Работа над TitleList

client/components/Search/BookView/BookView.vue

@@ -31,7 +31,7 @@
                 </div>
             </div>
 
-            <div class="q-ml-sm row items-center">
+            <div v-if="!titleList" class="q-ml-sm row items-center">
                 {{ book.serno ? `${book.serno}. ` : '' }}
                 <div v-if="showAuthor && book.author">
                     <span class="clickable2 text-green-10" @click="selectAuthor">{{ bookAuthor }}</span>
@@ -40,6 +40,20 @@
                 </div>
                 <span v-else class="clickable2" :class="titleColor" @click="selectTitle">{{ book.title }}</span>
             </div>
+            <div v-else class="q-ml-sm row items-center">
+                <span class="clickable2" :class="titleColor" @click="selectTitle">{{ book.title }}</span>
+
+                <div v-if="book.author || bookSeries" class="row">
+                    &nbsp;-&nbsp;
+                    <div v-if="book.author">
+                        <span class="clickable2 text-green-10" @click="selectAuthor">{{ bookAuthor }}</span>
+                        &nbsp;
+                    </div>
+                    <div v-if="bookSeries">
+                        <span class="clickable2" @click="selectSeries">{{ bookSeries }}</span>
+                    </div>
+                </div>
+            </div>
         </div>
 
         <div class="q-ml-sm">
@@ -88,6 +102,7 @@ class BookView {
         genreMap: Object,
         showAuthor: Boolean,
         showReadLink: Boolean,
+        titleList: Boolean,
         titleColor: { type: String, default: 'text-blue-10'},
     };
 
@@ -112,7 +127,7 @@ class BookView {
     }
 
     get bookAuthor() {
-        if (this.showAuthor && this.book.author) {
+        if ((this.showAuthor || this.titleList) && this.book.author) {
             let a = this.book.author.split(',');
             return a.slice(0, 2).join(', ') + (a.length > 2 ? ' и др.' : '');
         }
@@ -120,6 +135,14 @@ class BookView {
         return '';
     }
 
+    get bookSeries() {
+        if (this.book.series) {
+            return `(${this.book.series})`;
+        }
+
+        return '';
+    }
+
     get bookSize() {
         let size = this.book.size/1024;
         let unit = 'KB';
@@ -155,6 +178,10 @@ class BookView {
         this.$emit('bookEvent', {action: 'authorClick', book: this.book});
     }
 
+    selectSeries() {
+        this.$emit('bookEvent', {action: 'seriesClick', book: this.book});
+    }
+
     selectTitle() {
         this.$emit('bookEvent', {action: 'titleClick', book: this.book});
     }