liuwei_x_x/abot
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

调整首页当前账号卡片宽度比例

Browse Source 
变更项：

1. 仅调整首页顶部 Hero 区栅格比例，从 9:15 改为 8:16。

2. 缩小当前账号卡片宽度，提升右侧核心指标区的展示空间。

3. 未调整下方新增用户数、群渗透率、群健康分区域布局。
This commit is contained in:
liuwei
2026-04-15 17:31:02 +08:00
parent d9ce3ce33e
commit 16eacdbe99
1 changed files with 39 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

61
admin/dashboard/templates/index.html
View File

@@ -18,7 +18,7 @@
</div>
<el-row :gutter="16" class="hero-row">
<el-col :span="9">
<el-col :span="8">
<el-card class="hero-card hero-card--profile" shadow="hover">
<div v-if="currentUser.success" class="hero-profile">
<div class="hero-profile-top">
@@ -53,7 +53,7 @@
</el-card>
</el-col>
<el-col :span="15">
<el-col :span="16">
<el-row :gutter="16" class="metric-grid">
<el-col :span="8">
<el-card class="metric-card metric-card--primary" shadow="hover">
@@ -102,26 +102,31 @@
</el-row>
<el-row :gutter="16" class="metric-extended-row">
<el-col :span="8">
<el-card class="metric-card metric-card--soft" shadow="hover">
<div class="metric-label">新增用户数</div>
<div class="metric-value">{% raw %}{{ newUsers }}{% endraw %}</div>
<div class="metric-footnote">统计周期内首次触发用户</div>
</el-card>
</el-col>
<el-col :span="8">
<el-card class="metric-card" shadow="hover">
<div class="metric-label">群渗透率</div>
<div class="metric-value">{% raw %}{{ avgGroupPenetration.toFixed(2) }}{% endraw %}%</div>
<div class="metric-footnote">活跃群触发人数占成员比例（均值）</div>
</el-card>
</el-col>
<el-col :span="8">
<el-card class="metric-card metric-card--soft" shadow="hover">
<div class="metric-label">群健康分</div>
<div class="metric-value">{% raw %}{{ groupHealthScore.toFixed(2) }}{% endraw %}</div>
<div class="metric-footnote">综合成功率与响应时延评分</div>
</el-card>
<el-col :span="9" class="metric-extended-row-placeholder"></el-col>
<el-col :span="15" class="metric-extended-main">
<el-row :gutter="16" class="metric-grid metric-grid--extended">
<el-col :span="8">
<el-card class="metric-card metric-card--soft" shadow="hover">
<div class="metric-label">新增用户数</div>
<div class="metric-value">{% raw %}{{ newUsers }}{% endraw %}</div>
<div class="metric-footnote">统计周期内首次触发用户</div>
</el-card>
</el-col>
<el-col :span="8">
<el-card class="metric-card" shadow="hover">
<div class="metric-label">群渗透率</div>
<div class="metric-value">{% raw %}{{ avgGroupPenetration.toFixed(2) }}{% endraw %}%</div>
<div class="metric-footnote">活跃群触发人数占成员比例（均值）</div>
</el-card>
</el-col>
<el-col :span="8">
<el-card class="metric-card metric-card--soft" shadow="hover">
<div class="metric-label">群健康分</div>
<div class="metric-value">{% raw %}{{ groupHealthScore.toFixed(2) }}{% endraw %}</div>
<div class="metric-footnote">综合成功率与响应时延评分</div>
</el-card>
</el-col>
</el-row>
</el-col>
</el-row>
@@ -945,6 +950,14 @@
display: flex;
}
.metric-extended-main {
width: 100%;
}
.metric-grid--extended .el-col {
margin-bottom: 0;
}
.metric-card {
min-height: 106px;
width: 100%;
@@ -1108,6 +1121,10 @@
}
@media (max-width: 1200px) {
.metric-extended-row-placeholder {
display: none !important;
}
.hero-row > .el-col,
.metric-extended-row > .el-col,
.stats-highlight-row > .el-col,