shumengya/cwd
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(admin): 优化表格展示并限制访问页面数据数量

Browse Source 
docs: 更新项目描述为更详细的介绍
refactor(api): 限制访问页面接口返回数量为20条
style(admin): 为表格添加响应式布局和滚动支持
This commit is contained in:
anghunk
2026-01-22 09:29:58 +08:00
parent 1899449cc6
commit 6c1651b4e9
4 changed files with 106 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files

103
cwd-admin/src/views/AnalyticsVisitView.vue
View File

@@ -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>

41
cwd-admin/src/views/StatsView.vue
View File

@@ -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;
}