Remove default tags, add configurable featured line

sist2-vue/src/components/DocCard.vue

@@ -27,6 +27,11 @@
           <DocFileTitle :doc="doc"></DocFileTitle>
         </div>
 
+        <!-- Featured line -->
+        <div style="display: flex">
+          <FeaturedFieldsLine :doc="doc"></FeaturedFieldsLine>
+        </div>
+
         <!-- Tags -->
         <div class="card-text">
           <TagContainer :hit="doc"></TagContainer>
@@ -43,10 +48,11 @@ import DocFileTitle from "@/components/DocFileTitle.vue";
 import DocInfoModal from "@/components/DocInfoModal.vue";
 import ContentDiv from "@/components/ContentDiv.vue";
 import FullThumbnail from "@/components/FullThumbnail";
+import FeaturedFieldsLine from "@/components/FeaturedFieldsLine";
 
 
 export default {
-  components: {FullThumbnail, ContentDiv, DocInfoModal, DocFileTitle, TagContainer},
+  components: {FeaturedFieldsLine, FullThumbnail, ContentDiv, DocInfoModal, DocFileTitle, TagContainer},
   props: ["doc", "width"],
   data() {
     return {
@@ -133,8 +139,4 @@ export default {
 .sub-document .fit {
   padding: 4px 4px 0 4px;
 }
-
-.featured-line {
-  font-size: 92%;
-}
 </style>

sist2-vue/src/components/DocListItem.vue

@@ -50,6 +50,11 @@
           <span v-if="doc._source.author && doc._source.pages" class="mx-1">-</span>
           <span v-if="doc._source.author">{{ doc._source.author }}</span>
         </div>
+
+        <!-- Featured line -->
+        <div style="display: flex">
+          <FeaturedFieldsLine :doc="doc"></FeaturedFieldsLine>
+        </div>
       </div>
     </div>
   </b-list-group-item>
@@ -61,10 +66,11 @@ import DocFileTitle from "@/components/DocFileTitle";
 import DocInfoModal from "@/components/DocInfoModal";
 import ContentDiv from "@/components/ContentDiv";
 import FileIcon from "@/components/icons/FileIcon";
+import FeaturedFieldsLine from "@/components/FeaturedFieldsLine";
 
 export default {
   name: "DocListItem",
-  components: {FileIcon, ContentDiv, DocInfoModal, DocFileTitle, TagContainer},
+  components: {FileIcon, ContentDiv, DocInfoModal, DocFileTitle, TagContainer, FeaturedFieldsLine},
   props: ["doc"],
   data() {
     return {

sist2-vue/src/components/FeaturedFieldsLine.vue

@@ -0,0 +1,42 @@
+<template>
+  <div class="featured-line" v-html="featuredLineHtml"></div>
+</template>
+
+<script>
+import {humanDate, humanFileSize} from "@/util";
+
+function scopedEval(context, expr) {
+  const evaluator = Function.apply(null, [...Object.keys(context), "expr", "return eval(expr)"]);
+  return evaluator.apply(null, [...Object.values(context), expr]);
+}
+
+
+export default {
+  name: "FeaturedFieldsLine",
+  props: ["doc"],
+  computed: {
+    featuredLineHtml() {
+      const scope = {doc: this.doc._source, humanDate: humanDate, humanFileSize: humanFileSize};
+
+      return this.$store.getters.optFeaturedFields
+          .replaceAll(/\$\{([^}]*)}/g, (match, g1) => {
+            return scopedEval(scope, g1);
+          });
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+.featured-line {
+  font-size: 90%;
+  font-family: 'Source Sans Pro', 'Helvetica Neue', Arial, sans-serif;
+  color: #424242;
+  padding-left: 2px;
+}
+
+.theme-black .featured-line {
+  color: #bebebe;
+}
+</style>

sist2-vue/src/components/TagContainer.vue

@@ -40,6 +40,7 @@
 
 
     <template v-for="tag in hit._tags">
+      <!-- User tag-->
       <div v-if="tag.userTag" :key="tag.rawText" style="display: inline-block">
         <span
             :id="hit._id+tag.rawText"
@@ -51,7 +52,7 @@
         >{{ tag.text.split(".").pop() }}</span>
 
         <b-popover :target="hit._id+tag.rawText" triggers="focus blur" placement="top">
-          <b-button variant="danger" @click="onTagDeleteClick(tag, $event)">{{$t("deleteTag")}}</b-button>
+          <b-button variant="danger" @click="onTagDeleteClick(tag, $event)">{{ $t("deleteTag") }}</b-button>
         </b-popover>
       </div>
 
@@ -66,7 +67,7 @@
     <small v-if="showAddButton" class="badge add-tag-button" @click="tagAdd()">{{$t("addTag")}}</small>
 
     <!-- Size tag-->
-    <small v-else class="text-muted badge-size">{{
+    <small v-else class="text-muted badge-size" style="padding-left: 2px">{{
         humanFileSize(hit._source.size)
       }}</small>
   </div>
@@ -211,7 +212,7 @@ export default Vue.extend({
 
       return matches.sort().map(match => {
         return {
-          title: match.split(".").slice(0,-1).join("."),
+          title: match.split(".").slice(0, -1).join("."),
           id: match
         }
       });