调整风险人员总览核心异常点标签展示
This commit is contained in:
@@ -10,7 +10,7 @@
|
||||
<el-button size="mini" type="text">导出</el-button>
|
||||
</div>
|
||||
|
||||
<el-table :data="sectionData.overviewList || []" class="people-table">
|
||||
<el-table :data="overviewList" class="people-table">
|
||||
<el-table-column type="index" label="序号" width="60" />
|
||||
<el-table-column prop="name" label="姓名" min-width="100" />
|
||||
<el-table-column prop="idNo" label="身份证号" min-width="180" />
|
||||
@@ -24,7 +24,25 @@
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="modelCount" label="命中模型数" min-width="110" />
|
||||
<el-table-column prop="riskPoint" label="核心异常点" min-width="220" />
|
||||
<el-table-column label="核心异常点" min-width="220">
|
||||
<template slot-scope="scope">
|
||||
<div
|
||||
v-if="scope.row.riskPointTagList && scope.row.riskPointTagList.length"
|
||||
class="risk-point-tag-list"
|
||||
>
|
||||
<el-tag
|
||||
v-for="(tag, index) in scope.row.riskPointTagList"
|
||||
:key="`${scope.row.idNo || scope.row.name || index}-risk-point-${index}`"
|
||||
size="mini"
|
||||
effect="plain"
|
||||
:type="mapRiskLevelToTagType(tag.riskLevel)"
|
||||
>
|
||||
{{ tag.ruleName }}
|
||||
</el-tag>
|
||||
</div>
|
||||
<span v-else class="empty-text">-</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="100" align="right">
|
||||
<template slot-scope="scope">
|
||||
<el-button type="text" size="mini">{{ scope.row.actionLabel || "查看详情" }}</el-button>
|
||||
@@ -37,6 +55,52 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
function normalizeRiskPointTags(tags, riskPoint, riskLevel) {
|
||||
if (Array.isArray(tags) && tags.length) {
|
||||
return tags
|
||||
.map((item) => {
|
||||
if (typeof item === "string") {
|
||||
return {
|
||||
ruleName: item.trim(),
|
||||
riskLevel,
|
||||
};
|
||||
}
|
||||
if (item && typeof item === "object") {
|
||||
return {
|
||||
ruleName: item.ruleName || item.label || item.name || "",
|
||||
riskLevel: item.riskLevel || riskLevel,
|
||||
};
|
||||
}
|
||||
return null;
|
||||
})
|
||||
.filter((item) => item && item.ruleName);
|
||||
}
|
||||
|
||||
if (!riskPoint) {
|
||||
return [];
|
||||
}
|
||||
|
||||
return String(riskPoint)
|
||||
.split(/[、,,;;]/)
|
||||
.map((item) => item.trim())
|
||||
.filter(Boolean)
|
||||
.map((item) => ({
|
||||
ruleName: item,
|
||||
riskLevel,
|
||||
}));
|
||||
}
|
||||
|
||||
function normalizeOverviewRows(rows) {
|
||||
if (!Array.isArray(rows)) {
|
||||
return [];
|
||||
}
|
||||
|
||||
return rows.map((item) => ({
|
||||
...item,
|
||||
riskPointTagList: normalizeRiskPointTags(item.riskPointTagList, item.riskPoint, item.riskLevelType),
|
||||
}));
|
||||
}
|
||||
|
||||
export default {
|
||||
name: "RiskPeopleSection",
|
||||
props: {
|
||||
@@ -45,6 +109,23 @@ export default {
|
||||
default: () => ({}),
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
overviewList() {
|
||||
return normalizeOverviewRows(this.sectionData.overviewList);
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
mapRiskLevelToTagType(riskLevel) {
|
||||
const level = String(riskLevel || "").toUpperCase();
|
||||
if (level === "HIGH" || level === "DANGER") {
|
||||
return "danger";
|
||||
}
|
||||
if (level === "MEDIUM" || level === "WARNING") {
|
||||
return "warning";
|
||||
}
|
||||
return "info";
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
@@ -88,4 +169,14 @@ export default {
|
||||
background: #f8fafc;
|
||||
color: #64748b;
|
||||
}
|
||||
|
||||
.risk-point-tag-list {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
.empty-text {
|
||||
color: #94a3b8;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -22,6 +22,10 @@ export const mockOverviewData = {
|
||||
riskLevelType: "danger",
|
||||
modelCount: 3,
|
||||
riskPoint: "跨地域转账频繁交易",
|
||||
riskPointTagList: [
|
||||
{ ruleName: "跨地域转账", riskLevel: "HIGH" },
|
||||
{ ruleName: "频繁交易", riskLevel: "HIGH" },
|
||||
],
|
||||
actionLabel: "查看详情",
|
||||
},
|
||||
{
|
||||
@@ -33,6 +37,10 @@ export const mockOverviewData = {
|
||||
riskLevelType: "warning",
|
||||
modelCount: 2,
|
||||
riskPoint: "多工资转入频繁交易",
|
||||
riskPointTagList: [
|
||||
{ ruleName: "多工资转入", riskLevel: "MEDIUM" },
|
||||
{ ruleName: "频繁交易", riskLevel: "MEDIUM" },
|
||||
],
|
||||
actionLabel: "查看详情",
|
||||
},
|
||||
{
|
||||
@@ -44,6 +52,9 @@ export const mockOverviewData = {
|
||||
riskLevelType: "info",
|
||||
modelCount: 1,
|
||||
riskPoint: "频繁小额转账",
|
||||
riskPointTagList: [
|
||||
{ ruleName: "频繁小额转账", riskLevel: "LOW" },
|
||||
],
|
||||
actionLabel: "查看详情",
|
||||
},
|
||||
],
|
||||
|
||||
@@ -0,0 +1,17 @@
|
||||
const assert = require("assert");
|
||||
const fs = require("fs");
|
||||
const path = require("path");
|
||||
|
||||
const source = fs.readFileSync(
|
||||
path.resolve(__dirname, "../../src/views/ccdiProject/components/detail/RiskPeopleSection.vue"),
|
||||
"utf8"
|
||||
);
|
||||
|
||||
[
|
||||
"risk-point-tag-list",
|
||||
"scope.row.riskPointTagList",
|
||||
"normalizeRiskPointTags",
|
||||
":type=\"mapRiskLevelToTagType(tag.riskLevel)\"",
|
||||
].forEach((token) => assert(source.includes(token), token));
|
||||
|
||||
assert(!source.includes('<el-table-column prop="riskPoint" label="核心异常点" min-width="220" />'));
|
||||
Reference in New Issue
Block a user