feat(ui): 第二轮P1 — scoped样式/mc-dialog暗黑适配/空状态/字号变量
This commit is contained in:
@@ -12,33 +12,33 @@
|
||||
<el-row :gutter="16" class="section-gap">
|
||||
<el-col :span="6">
|
||||
<el-card shadow="never">
|
||||
<div style="text-align:center;">
|
||||
<div style="font-size:28px;font-weight:600;color:#409eff;">{{ stats.total_kpis }}</div>
|
||||
<div style="font-size:13px;color:#999;">KPI总数</div>
|
||||
<div class="stat-card-inner">
|
||||
<div class="stat-value" style="color:#409eff;">{{ stats.total_kpis }}</div>
|
||||
<div class="stat-label">KPI总数</div>
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-card shadow="never">
|
||||
<div style="text-align:center;">
|
||||
<div style="font-size:28px;font-weight:600;color:var(--bsc-learning);">{{ stats.open_logs }}</div>
|
||||
<div style="font-size:13px;color:#999;">未解决异常</div>
|
||||
<div class="stat-card-inner">
|
||||
<div class="stat-value" style="color:var(--bsc-learning);">{{ stats.open_logs }}</div>
|
||||
<div class="stat-label">未解决异常</div>
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-card shadow="never">
|
||||
<div style="text-align:center;">
|
||||
<div style="font-size:28px;font-weight:600;color:#f56c6c;">{{ stats.severity_counts?.critical ?? 0 }}</div>
|
||||
<div style="font-size:13px;color:#999;">严重异常</div>
|
||||
<div class="stat-card-inner">
|
||||
<div class="stat-value" style="color:#f56c6c;">{{ stats.severity_counts?.critical ?? 0 }}</div>
|
||||
<div class="stat-label">严重异常</div>
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-card shadow="never">
|
||||
<div style="text-align:center;">
|
||||
<div style="font-size:28px;font-weight:600;color:#67c23a;">{{ stats.type_counts?.missing_data ?? 0 }}</div>
|
||||
<div style="font-size:13px;color:#999;">数据缺失</div>
|
||||
<div class="stat-card-inner">
|
||||
<div class="stat-value" style="color:#67c23a;">{{ stats.type_counts?.missing_data ?? 0 }}</div>
|
||||
<div class="stat-label">数据缺失</div>
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
@@ -113,6 +113,7 @@
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-empty v-if="!loading && logs.length === 0" description="暂无质量异常日志" />
|
||||
</el-card>
|
||||
</div>
|
||||
</template>
|
||||
@@ -189,3 +190,11 @@ onMounted(() => {
|
||||
loadLogs()
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.quality-page { }
|
||||
.stat-card-inner { text-align: center; }
|
||||
.stat-card-inner .stat-value { font-size: 28px; font-weight: 600; }
|
||||
.stat-card-inner .stat-label { font-size: 13px; color: #999; }
|
||||
.section-gap-tabs { margin-top: 16px; }
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user