feat(admin): 优化表格展示并限制访问页面数据数量
docs: 更新项目描述为更详细的介绍 refactor(api): 限制访问页面接口返回数量为20条 style(admin): 为表格添加响应式布局和滚动支持
This commit is contained in:
@@ -53,28 +53,35 @@
|
||||
<div v-if="loading" class="page-hint">加载中...</div>
|
||||
<div v-else-if="error" class="page-error">{{ error }}</div>
|
||||
<div v-else-if="items.length === 0" class="page-hint">暂无访问数据</div>
|
||||
<div v-else class="domain-table">
|
||||
<div class="domain-table-header">
|
||||
<div class="domain-cell domain-cell-domain">页面标题</div>
|
||||
<div class="domain-cell">访问量</div>
|
||||
<div class="domain-cell">最后访问时间</div>
|
||||
<div class="domain-cell">页面地址</div>
|
||||
</div>
|
||||
<div v-for="item in items" :key="item.postSlug" class="domain-table-row">
|
||||
<div class="domain-cell domain-cell-domain">
|
||||
{{ item.postTitle || item.postSlug }}
|
||||
<div v-else class="domain-table-wrapper">
|
||||
<div class="domain-table">
|
||||
<div class="domain-table-header">
|
||||
<div class="domain-cell domain-cell-title">页面标题</div>
|
||||
<div class="domain-cell domain-cell-pv">访问量</div>
|
||||
<div class="domain-cell domain-cell-time">最后访问时间</div>
|
||||
<div class="domain-cell domain-cell-url">页面地址</div>
|
||||
</div>
|
||||
<div class="domain-cell">
|
||||
{{ item.pv }}
|
||||
</div>
|
||||
<div class="domain-cell">
|
||||
{{ formatTime(item.lastVisitAt) }}
|
||||
</div>
|
||||
<div class="domain-cell">
|
||||
<a v-if="item.postUrl" :href="item.postUrl" target="_blank" rel="noreferrer">
|
||||
{{ item.postUrl }}
|
||||
</a>
|
||||
<span v-else>-</span>
|
||||
<div v-for="item in items" :key="item.postSlug" class="domain-table-row">
|
||||
<div class="domain-cell domain-cell-title">
|
||||
{{ item.postTitle || item.postSlug }}
|
||||
</div>
|
||||
<div class="domain-cell domain-cell-pv">
|
||||
{{ item.pv }}
|
||||
</div>
|
||||
<div class="domain-cell domain-cell-time">
|
||||
{{ formatTime(item.lastVisitAt) }}
|
||||
</div>
|
||||
<div class="domain-cell domain-cell-url">
|
||||
<a
|
||||
v-if="item.postUrl"
|
||||
:href="item.postUrl"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
>
|
||||
{{ item.postUrl }}
|
||||
</a>
|
||||
<span v-else>-</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -392,9 +399,16 @@ watch(
|
||||
color: #24292f;
|
||||
}
|
||||
|
||||
.domain-table-wrapper {
|
||||
width: 100%;
|
||||
overflow-x: auto;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
}
|
||||
|
||||
.domain-table {
|
||||
border: 1px solid #d0d7de;
|
||||
border-radius: 6px;
|
||||
min-width: 520px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
@@ -420,11 +434,48 @@ watch(
|
||||
color: #57606a;
|
||||
}
|
||||
|
||||
.domain-cell-domain {
|
||||
flex: 2;
|
||||
.domain-cell-title {
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.domain-cell-pv {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.domain-cell-time {
|
||||
flex: 0 0 170px;
|
||||
}
|
||||
|
||||
.domain-cell-url {
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.domain-table {
|
||||
width: 610px;
|
||||
}
|
||||
|
||||
.domain-cell {
|
||||
flex: none;
|
||||
}
|
||||
|
||||
.domain-cell-title {
|
||||
width: 160px;
|
||||
}
|
||||
|
||||
.domain-cell-pv {
|
||||
width: 100px;
|
||||
}
|
||||
|
||||
.domain-cell-time {
|
||||
width: 150px;
|
||||
}
|
||||
|
||||
.domain-cell-url {
|
||||
width: 200px;
|
||||
}
|
||||
}
|
||||
|
||||
.chart-wrapper {
|
||||
margin-top: 4px;
|
||||
}
|
||||
@@ -457,10 +508,4 @@ watch(
|
||||
background-color: #d1242f;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.stats-grid {
|
||||
grid-template-columns: repeat(1, minmax(0, 1fr));
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -65,20 +65,26 @@
|
||||
<div v-if="statsLoading" class="page-hint">加载中...</div>
|
||||
<div v-else-if="statsError" class="page-error">{{ statsError }}</div>
|
||||
<div v-else-if="domainStats.length === 0" class="page-hint">暂无评论数据</div>
|
||||
<div v-else class="domain-table">
|
||||
<div class="domain-table-header">
|
||||
<div class="domain-cell domain-cell-domain">域名</div>
|
||||
<div class="domain-cell">总数</div>
|
||||
<div class="domain-cell">已通过</div>
|
||||
<div class="domain-cell">待审核</div>
|
||||
<div class="domain-cell">已拒绝</div>
|
||||
</div>
|
||||
<div v-for="item in domainStats" :key="item.domain" class="domain-table-row">
|
||||
<div class="domain-cell domain-cell-domain">{{ item.domain }}</div>
|
||||
<div class="domain-cell">{{ item.total }}</div>
|
||||
<div class="domain-cell">{{ item.approved }}</div>
|
||||
<div class="domain-cell">{{ item.pending }}</div>
|
||||
<div class="domain-cell">{{ item.rejected }}</div>
|
||||
<div v-else class="domain-table-wrapper">
|
||||
<div class="domain-table">
|
||||
<div class="domain-table-header">
|
||||
<div class="domain-cell domain-cell-domain">域名</div>
|
||||
<div class="domain-cell">总数</div>
|
||||
<div class="domain-cell">已通过</div>
|
||||
<div class="domain-cell">待审核</div>
|
||||
<div class="domain-cell">已拒绝</div>
|
||||
</div>
|
||||
<div
|
||||
v-for="item in domainStats"
|
||||
:key="item.domain"
|
||||
class="domain-table-row"
|
||||
>
|
||||
<div class="domain-cell domain-cell-domain">{{ item.domain }}</div>
|
||||
<div class="domain-cell">{{ item.total }}</div>
|
||||
<div class="domain-cell">{{ item.approved }}</div>
|
||||
<div class="domain-cell">{{ item.pending }}</div>
|
||||
<div class="domain-cell">{{ item.rejected }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -346,9 +352,16 @@ onBeforeUnmount(() => {
|
||||
color: #d1242f;
|
||||
}
|
||||
|
||||
.domain-table-wrapper {
|
||||
width: 100%;
|
||||
overflow-x: auto;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
}
|
||||
|
||||
.domain-table {
|
||||
border: 1px solid #d0d7de;
|
||||
border-radius: 6px;
|
||||
min-width: 520px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
|
||||
@@ -163,7 +163,7 @@ export const getVisitPages = async (c: Context<{ Bindings: Bindings }>) => {
|
||||
last_visit_at: number | null;
|
||||
}>();
|
||||
|
||||
const items: VisitPageItem[] = [];
|
||||
let items: VisitPageItem[] = [];
|
||||
|
||||
for (const row of results) {
|
||||
const domain =
|
||||
@@ -184,6 +184,8 @@ export const getVisitPages = async (c: Context<{ Bindings: Bindings }>) => {
|
||||
});
|
||||
}
|
||||
|
||||
items = items.slice(0, 20);
|
||||
|
||||
return c.json({ items });
|
||||
} catch (e: any) {
|
||||
return c.json(
|
||||
|
||||
@@ -4,7 +4,7 @@ import { defineConfig } from 'vitepress';
|
||||
|
||||
export default defineConfig({
|
||||
title: 'CWD 评论系统文档',
|
||||
description: '基于 Cloudflare Workers 的轻量级评论系统',
|
||||
description: '基于 Cloudflare Workers 与全球边缘网络的免服务器、极速安全、即插即用评论系统。',
|
||||
lang: 'zh-CN',
|
||||
head: [
|
||||
[
|
||||
@@ -19,7 +19,7 @@ export default defineConfig({
|
||||
nav,
|
||||
sidebar,
|
||||
outline: {
|
||||
level: [2,3],
|
||||
level: [2, 3],
|
||||
label: 'On this page',
|
||||
},
|
||||
editLink: {
|
||||
|
||||
Reference in New Issue
Block a user