deadcxap/inpx-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Улучшение вида списков

Browse Source
This commit is contained in:
Book Pauk
2022-10-31 15:00:32 +07:00
parent 26340bf061
commit 4ea9b388f0
4 changed files with 58 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
client/components/Search/AuthorList/AuthorList.vue
View File

@@ -60,9 +60,9 @@
<div v-if="book.showAllBooks" class="book-row column">
<BookView
v-for="seriesBook in book.allBooks" :key="seriesBook.id"
:book="seriesBook" :genre-map="genreMap"
show-author
:show-read-link="showReadLink"
:book="seriesBook"
mode="series"
:genre-map="genreMap" :show-read-link="showReadLink"
:title-color="isFoundSeriesBook(book, seriesBook) ? 'text-blue-10' : 'text-red'"
@book-event="bookEvent"
/>
@@ -70,7 +70,7 @@
<div v-else class="book-row column">
<BookView
v-for="seriesBook in book.seriesBooks" :key="seriesBook.key"
:book="seriesBook" :genre-map="genreMap" :show-read-link="showReadLink" @book-event="bookEvent"
:book="seriesBook" mode="author" :genre-map="genreMap" :show-read-link="showReadLink" @book-event="bookEvent"
/>
</div>
@@ -101,7 +101,7 @@
</div>
</div>
<!-- книга без серии -->
<BookView v-else :book="book" :genre-map="genreMap" :show-read-link="showReadLink" @book-event="bookEvent" />
<BookView v-else :book="book" mode="author" :genre-map="genreMap" :show-read-link="showReadLink" @book-event="bookEvent" />
</div>
<!--div v-if="isExpandedAuthor(item) && item.books && !item.books.length" class="book-row row items-center">

70
client/components/Search/BookView/BookView.vue
View File

@@ -1,6 +1,6 @@
<template>
<div class="row items-center q-my-sm">
<div class="row items-center no-wrap">
<div class="row items-center q-my-sm no-wrap">
<div class="row items-center">
<div v-if="showRates || showDeleted">
<div v-if="showRates && !book.del">
<div v-if="book.librate">
@@ -31,7 +31,7 @@
</div>
</div>
<div v-if="!titleList" 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>
@@ -53,31 +53,50 @@
<span class="clickable2" @click="selectSeries">{{ bookSeries }}</span>
</div>
</div>
</div-->
</div>
<div class="q-ml-sm column">
<div v-if="(mode == 'series' || mode == 'title') && bookAuthor" class="row items-center clickable2 text-green-10">
{{ bookAuthor }}
</div>
</div>
<div class="q-ml-sm">
{{ bookSize }}, {{ book.ext }}
</div>
<div class="row items-center">
<div v-if="book.serno" class="q-mr-xs">
{{ book.serno }}.
</div>
<div class="clickable2" :class="titleColor" @click="selectTitle">
{{ book.title }}
</div>
<div v-if="mode == 'title' && bookSeries" class="q-ml-xs clickable2" @click="selectSeries">
{{ bookSeries }}
</div>
<div class="q-ml-sm clickable" @click="download">
(скачать)
</div>
<div class="q-ml-sm clickable" @click="copyLink">
<q-icon name="la la-copy" size="20px" />
</div>
<div class="q-ml-sm">
{{ bookSize }}, {{ book.ext }}
</div>
<div v-if="showReadLink" class="q-ml-sm clickable" @click="readBook">
(читать)
</div>
<div class="q-ml-sm clickable" @click="download">
(скачать)
</div>
<div v-if="showGenres && book.genre" class="q-ml-sm">
{{ bookGenre }}
</div>
<div class="q-ml-sm clickable" @click="copyLink">
<q-icon name="la la-copy" size="20px" />
</div>
<div v-if="showDates && book.date" class="q-ml-sm">
{{ bookDate }}
<div v-if="showReadLink" class="q-ml-sm clickable" @click="readBook">
(читать)
</div>
<div v-if="showGenres && book.genre" class="q-ml-sm">
{{ bookGenre }}
</div>
<div v-if="showDates && book.date" class="q-ml-sm">
{{ bookDate }}
</div>
</div>
</div>
<div v-show="false">
@@ -105,10 +124,9 @@ class BookView {
_options = componentOptions;
_props = {
book: Object,
mode: String,
genreMap: Object,
showAuthor: Boolean,
showReadLink: Boolean,
titleList: Boolean,
titleColor: { type: String, default: 'text-blue-10'},
};
@@ -135,9 +153,9 @@ class BookView {
}
get bookAuthor() {
if ((this.showAuthor || this.titleList) && this.book.author) {
if (this.book.author) {
let a = this.book.author.split(',');
return a.slice(0, 2).join(', ') + (a.length > 2 ? ' и др.' : '');
return a.slice(0, 3).join(', ') + (a.length > 3 ? ' и др.' : '');
}
return '';
@@ -145,7 +163,7 @@ class BookView {
get bookSeries() {
if (this.book.series) {
return `(${this.book.series})`;
return `(Серия: ${this.book.series})`;
}
return '';

11
client/components/Search/SeriesList/SeriesList.vue
View File

@@ -39,18 +39,17 @@
<div v-if="item.showAllBooks" class="book-row column">
<BookView
v-for="seriesBook in item.allBooks" :key="seriesBook.id"
:book="seriesBook" :genre-map="genreMap"
show-author
:show-read-link="showReadLink"
:book="seriesBook"
mode="series"
:genre-map="genreMap" :show-read-link="showReadLink"
:title-color="isFoundSeriesBook(item, seriesBook) ? 'text-blue-10' : 'text-red'"
@book-event="bookEvent"
/>
</div>
<div v-else class="book-row column">
<BookView
v-for="seriesBook in item.books" :key="seriesBook.key"
show-author
:book="seriesBook" :genre-map="genreMap" :show-read-link="showReadLink" @book-event="bookEvent"
v-for="seriesBook in item.books" :key="seriesBook.key"
:book="seriesBook" mode="series" :genre-map="genreMap" :show-read-link="showReadLink" @book-event="bookEvent"
/>
</div>

9
client/components/Search/TitleList/TitleList.vue
View File

@@ -9,15 +9,14 @@
<div v-for="item in tableData" :key="item.key" class="column" :class="{'odd-item': item.num % 2}" style="font-size: 120%">
<BookView
class="q-ml-md"
title-list
:book="item.book" :genre-map="genreMap" :show-read-link="showReadLink" @book-event="bookEvent"
:book="item.book" mode="title" :genre-map="genreMap" :show-read-link="showReadLink" @book-event="bookEvent"
/>
<BookView
v-for="book in item.books" :key="book.id"
:book="book" :genre-map="genreMap"
class="q-ml-md"
title-list
:show-read-link="showReadLink"
:book="book"
mode="title"
:genre-map="genreMap" :show-read-link="showReadLink"
@book-event="bookEvent"
/>
</div>