|
@@ -33,7 +33,9 @@
|
|
|
<div class="stat-cards">
|
|
<div class="stat-cards">
|
|
|
<el-card class="stat-card stat-blue" shadow="hover">
|
|
<el-card class="stat-card stat-blue" shadow="hover">
|
|
|
<div class="stat-card-inner">
|
|
<div class="stat-card-inner">
|
|
|
- <div class="stat-icon"><el-icon :size="32"><DataLine /></el-icon></div>
|
|
|
|
|
|
|
+ <div class="stat-icon"><el-icon :size="32">
|
|
|
|
|
+ <DataLine />
|
|
|
|
|
+ </el-icon></div>
|
|
|
<div class="stat-info">
|
|
<div class="stat-info">
|
|
|
<div class="stat-value">{{ stats.total }}</div>
|
|
<div class="stat-value">{{ stats.total }}</div>
|
|
|
<div class="stat-label">总管线数</div>
|
|
<div class="stat-label">总管线数</div>
|
|
@@ -42,7 +44,9 @@
|
|
|
</el-card>
|
|
</el-card>
|
|
|
<el-card class="stat-card stat-red" shadow="hover">
|
|
<el-card class="stat-card stat-red" shadow="hover">
|
|
|
<div class="stat-card-inner">
|
|
<div class="stat-card-inner">
|
|
|
- <div class="stat-icon"><el-icon :size="32"><Warning /></el-icon></div>
|
|
|
|
|
|
|
+ <div class="stat-icon"><el-icon :size="32">
|
|
|
|
|
+ <Warning />
|
|
|
|
|
+ </el-icon></div>
|
|
|
<div class="stat-info">
|
|
<div class="stat-info">
|
|
|
<div class="stat-value">{{ stats.high }}</div>
|
|
<div class="stat-value">{{ stats.high }}</div>
|
|
|
<div class="stat-label">高风险管线</div>
|
|
<div class="stat-label">高风险管线</div>
|
|
@@ -51,7 +55,9 @@
|
|
|
</el-card>
|
|
</el-card>
|
|
|
<el-card class="stat-card stat-orange" shadow="hover">
|
|
<el-card class="stat-card stat-orange" shadow="hover">
|
|
|
<div class="stat-card-inner">
|
|
<div class="stat-card-inner">
|
|
|
- <div class="stat-icon"><el-icon :size="32"><WarningFilled /></el-icon></div>
|
|
|
|
|
|
|
+ <div class="stat-icon"><el-icon :size="32">
|
|
|
|
|
+ <WarningFilled />
|
|
|
|
|
+ </el-icon></div>
|
|
|
<div class="stat-info">
|
|
<div class="stat-info">
|
|
|
<div class="stat-value">{{ stats.medium }}</div>
|
|
<div class="stat-value">{{ stats.medium }}</div>
|
|
|
<div class="stat-label">中风险管线</div>
|
|
<div class="stat-label">中风险管线</div>
|
|
@@ -60,7 +66,9 @@
|
|
|
</el-card>
|
|
</el-card>
|
|
|
<el-card class="stat-card stat-green" shadow="hover">
|
|
<el-card class="stat-card stat-green" shadow="hover">
|
|
|
<div class="stat-card-inner">
|
|
<div class="stat-card-inner">
|
|
|
- <div class="stat-icon"><el-icon :size="32"><CircleCheck /></el-icon></div>
|
|
|
|
|
|
|
+ <div class="stat-icon"><el-icon :size="32">
|
|
|
|
|
+ <CircleCheck />
|
|
|
|
|
+ </el-icon></div>
|
|
|
<div class="stat-info">
|
|
<div class="stat-info">
|
|
|
<div class="stat-value">{{ stats.low }}</div>
|
|
<div class="stat-value">{{ stats.low }}</div>
|
|
|
<div class="stat-label">低风险管线</div>
|
|
<div class="stat-label">低风险管线</div>
|
|
@@ -91,7 +99,8 @@
|
|
|
</el-table-column>
|
|
</el-table-column>
|
|
|
<el-table-column label="风险级别" prop="riskLevel" min-width="100" align="center">
|
|
<el-table-column label="风险级别" prop="riskLevel" min-width="100" align="center">
|
|
|
<template #default="{ row }">
|
|
<template #default="{ row }">
|
|
|
- <el-tag :color="riskLevelColor(row.riskLevel)" effect="dark" style="border:none">{{ riskLevelText(row.riskLevel) }}</el-tag>
|
|
|
|
|
|
|
+ <el-tag :color="riskLevelColor(row.riskLevel)" effect="dark" style="border:none">{{ riskLevelText(row.riskLevel)
|
|
|
|
|
+ }}</el-tag>
|
|
|
</template>
|
|
</template>
|
|
|
</el-table-column>
|
|
</el-table-column>
|
|
|
<el-table-column label="评估时间" prop="assessTime" min-width="120" align="center" />
|
|
<el-table-column label="评估时间" prop="assessTime" min-width="120" align="center" />
|
|
@@ -104,14 +113,8 @@
|
|
|
|
|
|
|
|
<!-- 分页 -->
|
|
<!-- 分页 -->
|
|
|
<div class="pagination-wrap">
|
|
<div class="pagination-wrap">
|
|
|
- <el-pagination
|
|
|
|
|
- v-model:current-page="page.current"
|
|
|
|
|
- v-model:page-size="page.size"
|
|
|
|
|
- :page-sizes="[10, 20, 50]"
|
|
|
|
|
- :total="filteredList.length"
|
|
|
|
|
- layout="total, sizes, prev, pager, next, jumper"
|
|
|
|
|
- background
|
|
|
|
|
- />
|
|
|
|
|
|
|
+ <el-pagination v-model:current-page="page.current" v-model:page-size="page.size" :page-sizes="[10, 20, 50]"
|
|
|
|
|
+ :total="filteredList.length" layout="total, sizes, prev, pager, next, jumper" background />
|
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
<!-- 详情弹窗 -->
|
|
<!-- 详情弹窗 -->
|
|
@@ -144,7 +147,8 @@
|
|
|
</el-tab-pane>
|
|
</el-tab-pane>
|
|
|
<el-tab-pane label="评估详情" name="assess">
|
|
<el-tab-pane label="评估详情" name="assess">
|
|
|
<div style="margin-bottom:16px">
|
|
<div style="margin-bottom:16px">
|
|
|
- <el-tag :type="riskLevelColor(currentRow.riskLevel)" size="large">{{ riskLevelText(currentRow.riskLevel) }}</el-tag>
|
|
|
|
|
|
|
+ <el-tag :type="riskLevelColor(currentRow.riskLevel)" size="large">{{ riskLevelText(currentRow.riskLevel)
|
|
|
|
|
+ }}</el-tag>
|
|
|
<span style="margin-left:12px;font-size:18px;font-weight:bold;">综合评分:{{ currentRow.riskScore }}</span>
|
|
<span style="margin-left:12px;font-size:18px;font-weight:bold;">综合评分:{{ currentRow.riskScore }}</span>
|
|
|
</div>
|
|
</div>
|
|
|
<el-table :data="assessItems" border size="small">
|
|
<el-table :data="assessItems" border size="small">
|
|
@@ -154,7 +158,7 @@
|
|
|
<el-table-column prop="level" label="等级" width="100" align="center" />
|
|
<el-table-column prop="level" label="等级" width="100" align="center" />
|
|
|
</el-table>
|
|
</el-table>
|
|
|
</el-tab-pane>
|
|
</el-tab-pane>
|
|
|
- <el-tab-pane label="评估分析" name="analysis">
|
|
|
|
|
|
|
+ <!-- <el-tab-pane label="评估分析" name="analysis">
|
|
|
<el-alert type="info" :closable="false" style="margin-bottom:12px">
|
|
<el-alert type="info" :closable="false" style="margin-bottom:12px">
|
|
|
<template #title>
|
|
<template #title>
|
|
|
<strong>风险评估建议:</strong>
|
|
<strong>风险评估建议:</strong>
|
|
@@ -166,7 +170,7 @@
|
|
|
<p><strong>评估时间:</strong>{{ currentRow.assessTime }}</p>
|
|
<p><strong>评估时间:</strong>{{ currentRow.assessTime }}</p>
|
|
|
<p><strong>评估人员:</strong>李工、王工</p>
|
|
<p><strong>评估人员:</strong>李工、王工</p>
|
|
|
<p><strong>下次评估建议时间:</strong>2026-05-01</p>
|
|
<p><strong>下次评估建议时间:</strong>2026-05-01</p>
|
|
|
- </el-tab-pane>
|
|
|
|
|
|
|
+ </el-tab-pane> -->
|
|
|
</el-tabs>
|
|
</el-tabs>
|
|
|
</template>
|
|
</template>
|
|
|
<template #footer>
|
|
<template #footer>
|
|
@@ -334,10 +338,25 @@ const handleDetail = (row) => {
|
|
|
flex-shrink: 0;
|
|
flex-shrink: 0;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
-.stat-blue .stat-icon { background: rgba(64, 158, 255, 0.1); color: #409EFF; }
|
|
|
|
|
-.stat-red .stat-icon { background: rgba(245, 108, 108, 0.1); color: #F56C6C; }
|
|
|
|
|
-.stat-orange .stat-icon { background: rgba(230, 162, 60, 0.1); color: #E6A23C; }
|
|
|
|
|
-.stat-green .stat-icon { background: rgba(103, 194, 58, 0.1); color: #67C23A; }
|
|
|
|
|
|
|
+.stat-blue .stat-icon {
|
|
|
|
|
+ background: rgba(64, 158, 255, 0.1);
|
|
|
|
|
+ color: #409EFF;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+.stat-red .stat-icon {
|
|
|
|
|
+ background: rgba(245, 108, 108, 0.1);
|
|
|
|
|
+ color: #F56C6C;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+.stat-orange .stat-icon {
|
|
|
|
|
+ background: rgba(230, 162, 60, 0.1);
|
|
|
|
|
+ color: #E6A23C;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+.stat-green .stat-icon {
|
|
|
|
|
+ background: rgba(103, 194, 58, 0.1);
|
|
|
|
|
+ color: #67C23A;
|
|
|
|
|
+}
|
|
|
|
|
|
|
|
.stat-info {
|
|
.stat-info {
|
|
|
flex: 1;
|
|
flex: 1;
|
|
@@ -350,10 +369,21 @@ const handleDetail = (row) => {
|
|
|
line-height: 1.2;
|
|
line-height: 1.2;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
-.stat-blue .stat-value { color: #409EFF; }
|
|
|
|
|
-.stat-red .stat-value { color: #F56C6C; }
|
|
|
|
|
-.stat-orange .stat-value { color: #E6A23C; }
|
|
|
|
|
-.stat-green .stat-value { color: #67C23A; }
|
|
|
|
|
|
|
+.stat-blue .stat-value {
|
|
|
|
|
+ color: #409EFF;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+.stat-red .stat-value {
|
|
|
|
|
+ color: #F56C6C;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+.stat-orange .stat-value {
|
|
|
|
|
+ color: #E6A23C;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+.stat-green .stat-value {
|
|
|
|
|
+ color: #67C23A;
|
|
|
|
|
+}
|
|
|
|
|
|
|
|
.stat-label {
|
|
.stat-label {
|
|
|
font-size: 14px;
|
|
font-size: 14px;
|
|
@@ -362,15 +392,29 @@ const handleDetail = (row) => {
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
/* 风险评分颜色 */
|
|
/* 风险评分颜色 */
|
|
|
-.score-high { color: #F56C6C; font-weight: 700; }
|
|
|
|
|
-.score-medium { color: #E6A23C; font-weight: 700; }
|
|
|
|
|
-.score-low { color: #409EFF; font-weight: 700; }
|
|
|
|
|
-.score-veryLow { color: #67C23A; font-weight: 700; }
|
|
|
|
|
|
|
+.score-high {
|
|
|
|
|
+ color: #F56C6C;
|
|
|
|
|
+ font-weight: 700;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+.score-medium {
|
|
|
|
|
+ color: #E6A23C;
|
|
|
|
|
+ font-weight: 700;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+.score-low {
|
|
|
|
|
+ color: #409EFF;
|
|
|
|
|
+ font-weight: 700;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+.score-veryLow {
|
|
|
|
|
+ color: #67C23A;
|
|
|
|
|
+ font-weight: 700;
|
|
|
|
|
+}
|
|
|
|
|
|
|
|
/* 分页 */
|
|
/* 分页 */
|
|
|
.pagination-wrap {
|
|
.pagination-wrap {
|
|
|
display: flex;
|
|
display: flex;
|
|
|
justify-content: flex-end;
|
|
justify-content: flex-end;
|
|
|
margin-top: 16px;
|
|
margin-top: 16px;
|
|
|
-}
|
|
|
|
|
-</style>
|
|
|
|
|
|
|
+}</style>
|