201206030/novel-front-web
1
0
Fork 0
mirror of https://github.com/201206030/novel-front-web.git synced 2025-04-27 07:50:50 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

perf: 显示优化

Browse Source
This commit is contained in:
xiongxiaoyang 2022-05-16 18:58:03 +08:00
parent dc54f75baf
commit e254462964
2 changed files with 37 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/views/BookClass.vue
View File

@ -164,7 +164,7 @@
<a
filter-value="visit_count"
href="javascript:void(0)"
:class="`${sortOn == 'visitcount desc' ? 'on' : ''}`"
:class="`${sortOn == 'visit_count desc' ? 'on' : ''}`"
@click="changeSort('visit_count desc')"
>点击量</a
>

51
src/views/BookRank.vue
View File

@ -9,7 +9,7 @@
<div class="pad20">
<div class="book_tit">
<div class="fl">
<h3 class="font26 mt5 mb5" id="rankName">{{rankName}}</h3>
<h3 class="font26 mt5 mb5" id="rankName">{{ rankName }}</h3>
</div>
<a class="fr"></a>
</div>
@ -26,27 +26,36 @@
</tr>
</thead>
<tbody id="bookRankList">
<tr v-for="(item,index) in books" :key="index">
<td class="rank"><i :class="'num' + (Number(`${index}`) + 1)">{{index + 1}}</i></td>
<tr v-for="(item, index) in books" :key="index">
<td class="rank">
<i :class="'num' + (Number(`${index}`) + 1)">{{
index + 1
}}</i>
</td>
<td class="style">
<a href="javascript:void(0)" @click="bookDetail(item.id)">[{{item.categoryName}}]</a>
<a href="javascript:void(0)" @click="bookDetail(item.id)"
>[{{ item.categoryName }}]</a
>
</td>
<td class="name">
<a @click="bookDetail(item.id)" href="javascript:void(0)"
>{{item.bookName}}</a
<a
@click="bookDetail(item.id)"
href="javascript:void(0)"
>{{ item.bookName }}</a
>
</td>
<td class="chapter">
<a @click="bookDetail(item.id)" href="javascript:void(0)"
>{{item.lastChapterName}}</a
<a
@click="bookDetail(item.id)"
href="javascript:void(0)"
>{{ item.lastChapterName }}</a
>
</td>
<td class="author">
<a href="javascript:void(0)">{{item.authorName}}</a>
<a href="javascript:void(0)">{{ item.authorName }}</a>
</td>
<td class="word">{{wordCountFormat(item.wordCount)}}</td>
<td class="word">{{ wordCountFormat(item.wordCount) }}</td>
</tr>
</tbody>
</table>
</div>
@ -62,9 +71,17 @@
</div>
<div class="rightList2">
<ul id="rankType">
<li><a class="on" href="javascript:void(0)" @click="visitRank">点击榜</a></li>
<li><a href="javascript:void(0)" @click="newestRank">新书榜</a></li>
<li><a href="javascript:void(0)" @click="updateRank">更新榜</a></li>
<li>
<a :class="`${rankType == 1 ? 'on' : ''}`" href="javascript:void(0)" @click="visitRank"
>点击榜</a
>
</li>
<li>
<a :class="`${rankType == 2 ? 'on' : ''}`" href="javascript:void(0)" @click="newestRank">新书榜</a>
</li>
<li>
<a :class="`${rankType == 3 ? 'on' : ''}`" href="javascript:void(0)" @click="updateRank">更新榜</a>
</li>
</ul>
</div>
</div>
@ -98,6 +115,7 @@ export default {
const state = reactive({
books: [],
rankName: "点击榜",
rankType: 1,
});
onMounted(() => {
visitRank();
@ -107,18 +125,21 @@ export default {
const { data } = await listVisitRankBooks();
state.books = data;
state.rankName = "点击榜";
state.rankType = 1;
};
const newestRank = async () => {
const { data } = await listNewestRankBooks();
state.books = data;
state.rankName = "新书榜";
state.rankType = 2;
};
const updateRank = async () => {
const { data } = await listUpdateRankBooks();
state.books = data;
state.rankName = "更新榜";
state.rankType = 3;
};
const bookDetail = (bookId) => {
@ -130,7 +151,7 @@ export default {
bookDetail,
newestRank,
visitRank,
updateRank
updateRank,
};
},
computed: {