|
|
|
|
@ -50,7 +50,7 @@
|
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</header> |
|
|
|
|
<div class="table-container"> |
|
|
|
|
<div class="table-container" v-loading="mainLoading"> |
|
|
|
|
<el-table :data="list"> |
|
|
|
|
<el-table-column label="姓名" prop="name" /> |
|
|
|
|
<el-table-column label="性别"> |
|
|
|
|
@ -85,6 +85,11 @@
|
|
|
|
|
width="120" |
|
|
|
|
align="center" |
|
|
|
|
/> |
|
|
|
|
<el-table-column label="风险指数" align="center" width="160"> |
|
|
|
|
<template #default="{ row }"> |
|
|
|
|
<span>/</span> |
|
|
|
|
</template> |
|
|
|
|
</el-table-column> |
|
|
|
|
<el-table-column label="操作" width="160"> |
|
|
|
|
<template #default="{ row }"> |
|
|
|
|
<el-button |
|
|
|
|
@ -113,7 +118,13 @@
|
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
<el-dialog title="个人问题画像" v-model="show" width="85vw" top="2vh"> |
|
|
|
|
<el-dialog |
|
|
|
|
title="个人问题画像" |
|
|
|
|
v-model="show" |
|
|
|
|
width="85vw" |
|
|
|
|
top="1vh" |
|
|
|
|
style="margin: 1vh auto" |
|
|
|
|
> |
|
|
|
|
<header class="flex center v-center gap"> |
|
|
|
|
<label>统计范围</label> |
|
|
|
|
<div style="width: 320px"> |
|
|
|
|
@ -125,184 +136,217 @@
|
|
|
|
|
</div> |
|
|
|
|
<el-button type="primary" @click="getProfileData">查询</el-button> |
|
|
|
|
</header> |
|
|
|
|
<main v-loading="loading"> |
|
|
|
|
<el-row class="mb-20"> |
|
|
|
|
<el-col :span="8"> |
|
|
|
|
<h5>民警基本情况</h5> |
|
|
|
|
<el-row> |
|
|
|
|
<el-col :span="6"> |
|
|
|
|
<img src="/imgs/police.jpeg" /> |
|
|
|
|
</el-col> |
|
|
|
|
<el-col :span="18"> |
|
|
|
|
<div class="row"> |
|
|
|
|
<div class="col col-12"> |
|
|
|
|
<label>姓名</label> |
|
|
|
|
<span>{{ policeInfo.name }}</span> |
|
|
|
|
<el-scrollbar |
|
|
|
|
max-height="calc(98vh - 120px)" |
|
|
|
|
v-loading="loading" |
|
|
|
|
element-loading-text="个人问题画像加载中..." |
|
|
|
|
> |
|
|
|
|
<main> |
|
|
|
|
<el-row class="mb-20"> |
|
|
|
|
<el-col :span="8"> |
|
|
|
|
<h5>民警基本情况</h5> |
|
|
|
|
<el-row> |
|
|
|
|
<el-col :span="6"> |
|
|
|
|
<img src="/favicon.png" /> |
|
|
|
|
</el-col> |
|
|
|
|
<el-col :span="18"> |
|
|
|
|
<div class="row"> |
|
|
|
|
<div class="col col-12"> |
|
|
|
|
<label>姓名</label> |
|
|
|
|
<span>{{ policeInfo.name }}</span> |
|
|
|
|
</div> |
|
|
|
|
<div class="col col-12"> |
|
|
|
|
<label>性别</label> |
|
|
|
|
<span>{{ |
|
|
|
|
getGenderFromIdCode( |
|
|
|
|
policeInfo.idCode |
|
|
|
|
) |
|
|
|
|
}}</span> |
|
|
|
|
</div> |
|
|
|
|
<div class="col col-24"> |
|
|
|
|
<label>所属单位</label> |
|
|
|
|
<span> |
|
|
|
|
<span |
|
|
|
|
>{{ |
|
|
|
|
activeRow.parentDepartName |
|
|
|
|
? activeRow.parentDepartName + |
|
|
|
|
"/" |
|
|
|
|
: activeRow.parentDepartName |
|
|
|
|
}}{{ |
|
|
|
|
activeRow.departName |
|
|
|
|
}}</span |
|
|
|
|
> |
|
|
|
|
</span> |
|
|
|
|
</div> |
|
|
|
|
<div class="col col-12"> |
|
|
|
|
<label>警号</label> |
|
|
|
|
<span>{{ policeInfo.empNo }}</span> |
|
|
|
|
</div> |
|
|
|
|
<div class="col col-12"> |
|
|
|
|
<label>任职年份</label> |
|
|
|
|
<span>{{ |
|
|
|
|
policeInfo.employmentDate || "/" |
|
|
|
|
}}</span> |
|
|
|
|
</div> |
|
|
|
|
<div class="col col-12"> |
|
|
|
|
<label>手机号</label> |
|
|
|
|
<span>{{ |
|
|
|
|
policeInfo.mobile || "/" |
|
|
|
|
}}</span> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<div class="col col-12"> |
|
|
|
|
<label>性别</label> |
|
|
|
|
<span>{{ |
|
|
|
|
getGenderFromIdCode(policeInfo.idCode) |
|
|
|
|
}}</span> |
|
|
|
|
</div> |
|
|
|
|
<div class="col col-24"> |
|
|
|
|
<label>所属单位</label> |
|
|
|
|
<span> |
|
|
|
|
<span |
|
|
|
|
>{{ |
|
|
|
|
activeRow.parentDepartName |
|
|
|
|
? activeRow.parentDepartName + |
|
|
|
|
"/" |
|
|
|
|
: activeRow.parentDepartName |
|
|
|
|
}}{{ activeRow.departName }}</span |
|
|
|
|
> |
|
|
|
|
</span> |
|
|
|
|
</el-col> |
|
|
|
|
</el-row> |
|
|
|
|
</el-col> |
|
|
|
|
<el-col :span="8"> |
|
|
|
|
<h5>问题情况</h5> |
|
|
|
|
<el-row |
|
|
|
|
class="flex v-center" |
|
|
|
|
style="height: calc(100% - 76px)" |
|
|
|
|
> |
|
|
|
|
<el-col :span="6" class="text-center"> |
|
|
|
|
<div |
|
|
|
|
class="text-primary" |
|
|
|
|
style="font-size: 34px" |
|
|
|
|
> |
|
|
|
|
{{ activeRow.verifySize }} |
|
|
|
|
</div> |
|
|
|
|
<div class="col col-12"> |
|
|
|
|
<label>警号</label> |
|
|
|
|
<span>{{ policeInfo.empNo }}</span> |
|
|
|
|
<div>问题总数</div> |
|
|
|
|
</el-col> |
|
|
|
|
<el-col :span="18"> |
|
|
|
|
<el-row> |
|
|
|
|
<el-col :span="12"> |
|
|
|
|
<description-pair |
|
|
|
|
label1="110接处警量" |
|
|
|
|
label2="问题数" |
|
|
|
|
:value1=" |
|
|
|
|
negativeInfo.jcjBusinessSize |
|
|
|
|
" |
|
|
|
|
:value2="negativeInfo.jcjSize" |
|
|
|
|
/> |
|
|
|
|
</el-col> |
|
|
|
|
<el-col :span="12"> |
|
|
|
|
<description-pair |
|
|
|
|
label1="执法办案" |
|
|
|
|
label2="问题数" |
|
|
|
|
:value1=" |
|
|
|
|
negativeInfo.zfbaBusinessSize |
|
|
|
|
" |
|
|
|
|
:value2="negativeInfo.zfbaSize" |
|
|
|
|
/> |
|
|
|
|
</el-col> |
|
|
|
|
</el-row> |
|
|
|
|
</el-col> |
|
|
|
|
</el-row> |
|
|
|
|
</el-col> |
|
|
|
|
<el-col :span="8"> |
|
|
|
|
<h5>风险指数</h5> |
|
|
|
|
<div class="flex center"> |
|
|
|
|
<el-progress |
|
|
|
|
type="dashboard" |
|
|
|
|
:percentage="78" |
|
|
|
|
:stroke-width="16" |
|
|
|
|
:width="250" |
|
|
|
|
color="#DC6231" |
|
|
|
|
> |
|
|
|
|
<div style="line-height: 64px" class="mt-40"> |
|
|
|
|
<span |
|
|
|
|
style=" |
|
|
|
|
font-weight: 600; |
|
|
|
|
font-size: 60px; |
|
|
|
|
color: #e87749; |
|
|
|
|
" |
|
|
|
|
>78</span |
|
|
|
|
> |
|
|
|
|
<span style="font-size: 18px; color: #999" |
|
|
|
|
>分</span |
|
|
|
|
> |
|
|
|
|
</div> |
|
|
|
|
<div class="col col-12"> |
|
|
|
|
<label>任职年份</label> |
|
|
|
|
<span>{{ policeInfo.employmentDate }}</span> |
|
|
|
|
<div style="font-size: 14px" class="mb-10"> |
|
|
|
|
分险指标值 |
|
|
|
|
</div> |
|
|
|
|
<div class="col col-12"> |
|
|
|
|
<label>手机号</label> |
|
|
|
|
<span>{{ policeInfo.mobile }}</span> |
|
|
|
|
<div style="color: #e87749; font-size: 28px"> |
|
|
|
|
中风险 |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</el-col> |
|
|
|
|
</el-row> |
|
|
|
|
</el-col> |
|
|
|
|
<el-col :span="8"> |
|
|
|
|
<h5>问题情况</h5> |
|
|
|
|
<el-row |
|
|
|
|
class="flex v-center" |
|
|
|
|
style="height: calc(100% - 76px)" |
|
|
|
|
> |
|
|
|
|
<el-col :span="6" class="text-center"> |
|
|
|
|
<div class="text-primary" style="font-size: 34px"> |
|
|
|
|
{{ activeRow.verifySize }} |
|
|
|
|
</div> |
|
|
|
|
<div>问题总数</div> |
|
|
|
|
</el-col> |
|
|
|
|
<el-col :span="18"> |
|
|
|
|
<el-row> |
|
|
|
|
<el-col :span="12"> |
|
|
|
|
<description-pair |
|
|
|
|
label1="110接处警量" |
|
|
|
|
label2="问题数" |
|
|
|
|
:value1="negativeInfo.jcjBusinessSize" |
|
|
|
|
:value2="negativeInfo.jcjSize" |
|
|
|
|
/> |
|
|
|
|
</el-col> |
|
|
|
|
<el-col :span="12"> |
|
|
|
|
<description-pair |
|
|
|
|
label1="执法办案" |
|
|
|
|
label2="问题数" |
|
|
|
|
:value1="negativeInfo.zfbaBusinessSize" |
|
|
|
|
:value2="negativeInfo.zfbaSize" |
|
|
|
|
/> |
|
|
|
|
</el-col> |
|
|
|
|
</el-row> |
|
|
|
|
</el-col> |
|
|
|
|
</el-row> |
|
|
|
|
</el-col> |
|
|
|
|
<el-col :span="8"> |
|
|
|
|
<h5>风险指数</h5> |
|
|
|
|
<div class="flex center"> |
|
|
|
|
<el-progress |
|
|
|
|
type="dashboard" |
|
|
|
|
:percentage="78" |
|
|
|
|
:stroke-width="16" |
|
|
|
|
:width="250" |
|
|
|
|
color="#DC6231" |
|
|
|
|
> |
|
|
|
|
<div style="line-height: 64px" class="mt-40"> |
|
|
|
|
<span |
|
|
|
|
style=" |
|
|
|
|
font-weight: 600; |
|
|
|
|
font-size: 60px; |
|
|
|
|
color: #e87749; |
|
|
|
|
" |
|
|
|
|
>78</span |
|
|
|
|
> |
|
|
|
|
<span style="font-size: 18px; color: #999" |
|
|
|
|
>分</span |
|
|
|
|
> |
|
|
|
|
</div> |
|
|
|
|
<div style="font-size: 14px" class="mb-10"> |
|
|
|
|
分险指标值 |
|
|
|
|
</div> |
|
|
|
|
<div style="color: #e87749; font-size: 28px"> |
|
|
|
|
中风险 |
|
|
|
|
</div> |
|
|
|
|
</el-progress> |
|
|
|
|
</div> |
|
|
|
|
</el-col> |
|
|
|
|
</el-row> |
|
|
|
|
<el-row class="mb-20"> |
|
|
|
|
<el-col :span="8"> |
|
|
|
|
<h5>问题来源占比</h5> |
|
|
|
|
<v-charts |
|
|
|
|
style="height: 320px" |
|
|
|
|
:option="problemSourcesPieOptions" |
|
|
|
|
autoresize |
|
|
|
|
/> |
|
|
|
|
</el-col> |
|
|
|
|
<el-col :span="8"> |
|
|
|
|
<h5>业务类型占比</h5> |
|
|
|
|
<v-charts |
|
|
|
|
style="height: 320px" |
|
|
|
|
:option="businessTypePieOptions" |
|
|
|
|
autoresize |
|
|
|
|
/> |
|
|
|
|
</el-col> |
|
|
|
|
<el-col :span="8"> |
|
|
|
|
<h5>风险问题构成</h5> |
|
|
|
|
</el-col> |
|
|
|
|
</el-row> |
|
|
|
|
</el-progress> |
|
|
|
|
</div> |
|
|
|
|
</el-col> |
|
|
|
|
</el-row> |
|
|
|
|
<el-row class="mb-20"> |
|
|
|
|
<el-col :span="8"> |
|
|
|
|
<h5>问题来源占比</h5> |
|
|
|
|
<v-charts |
|
|
|
|
style="height: 320px" |
|
|
|
|
:option="problemSourcesPieOptions" |
|
|
|
|
autoresize |
|
|
|
|
/> |
|
|
|
|
</el-col> |
|
|
|
|
<el-col :span="8"> |
|
|
|
|
<h5>业务类型占比</h5> |
|
|
|
|
<v-charts |
|
|
|
|
style="height: 320px" |
|
|
|
|
:option="businessTypePieOptions" |
|
|
|
|
autoresize |
|
|
|
|
/> |
|
|
|
|
</el-col> |
|
|
|
|
<el-col :span="8"> |
|
|
|
|
<h5>风险问题构成</h5> |
|
|
|
|
<v-charts |
|
|
|
|
style="height: 320px" |
|
|
|
|
:option="radarOption" |
|
|
|
|
autoresize |
|
|
|
|
/> |
|
|
|
|
</el-col> |
|
|
|
|
</el-row> |
|
|
|
|
|
|
|
|
|
<h5>问题变化趋势</h5> |
|
|
|
|
<v-charts style="height: 320px" :option="barOption" autoresize /> |
|
|
|
|
<div></div> |
|
|
|
|
<h5>问题清单</h5> |
|
|
|
|
<el-table :data="negativeList"> |
|
|
|
|
<el-table-column label="发现时间" prop="discoveryTime" /> |
|
|
|
|
<el-table-column label="问题来源" prop="problemSources" /> |
|
|
|
|
<el-table-column label="业务类别" prop="businessTypeName" /> |
|
|
|
|
<el-table-column label="涉及单位" prop="involveDepartName" /> |
|
|
|
|
<el-table-column |
|
|
|
|
label="核查情况" |
|
|
|
|
prop="checkStatusName" |
|
|
|
|
width="140" |
|
|
|
|
align="center" |
|
|
|
|
<h5>问题变化趋势</h5> |
|
|
|
|
<v-charts |
|
|
|
|
style="height: 320px" |
|
|
|
|
:option="barOption" |
|
|
|
|
autoresize |
|
|
|
|
/> |
|
|
|
|
<el-table-column label="操作" width="160"> |
|
|
|
|
<template #default="{ row }"> |
|
|
|
|
<el-button |
|
|
|
|
type="primary" |
|
|
|
|
link |
|
|
|
|
@click="handleAction(row)" |
|
|
|
|
>查看详情</el-button |
|
|
|
|
> |
|
|
|
|
</template> |
|
|
|
|
</el-table-column> |
|
|
|
|
</el-table> |
|
|
|
|
<div class="flex end mt-8"> |
|
|
|
|
<el-pagination |
|
|
|
|
@size-change="getNegativeList" |
|
|
|
|
@current-change="getNegativeList" |
|
|
|
|
:current-page="negativeQuery.current" |
|
|
|
|
:page-sizes="[10, 20, 50]" |
|
|
|
|
:page-size="negativeQuery.size" |
|
|
|
|
v-model:current-page="negativeQuery.current" |
|
|
|
|
layout="total, sizes, prev, pager, next" |
|
|
|
|
:total="negativeTotal" |
|
|
|
|
> |
|
|
|
|
</el-pagination> |
|
|
|
|
</div> |
|
|
|
|
</main> |
|
|
|
|
<div></div> |
|
|
|
|
<h5>问题清单</h5> |
|
|
|
|
<el-table :data="negativeList"> |
|
|
|
|
<el-table-column label="发现时间" prop="discoveryTime" /> |
|
|
|
|
<el-table-column label="问题来源" prop="problemSources" /> |
|
|
|
|
<el-table-column label="业务类别" prop="businessTypeName" /> |
|
|
|
|
<el-table-column |
|
|
|
|
label="涉及单位" |
|
|
|
|
prop="involveDepartName" |
|
|
|
|
/> |
|
|
|
|
<el-table-column |
|
|
|
|
label="核查情况" |
|
|
|
|
prop="checkStatusName" |
|
|
|
|
width="140" |
|
|
|
|
align="center" |
|
|
|
|
/> |
|
|
|
|
<el-table-column label="操作" width="160"> |
|
|
|
|
<template #default="{ row }"> |
|
|
|
|
<el-button |
|
|
|
|
type="primary" |
|
|
|
|
link |
|
|
|
|
@click="handleAction(row)" |
|
|
|
|
>查看详情</el-button |
|
|
|
|
> |
|
|
|
|
</template> |
|
|
|
|
</el-table-column> |
|
|
|
|
</el-table> |
|
|
|
|
<div class="flex end mt-8"> |
|
|
|
|
<el-pagination |
|
|
|
|
@size-change="getNegativeList" |
|
|
|
|
@current-change="getNegativeList" |
|
|
|
|
:current-page="negativeQuery.current" |
|
|
|
|
:page-sizes="[10, 20, 50]" |
|
|
|
|
:page-size="negativeQuery.size" |
|
|
|
|
v-model:current-page="negativeQuery.current" |
|
|
|
|
layout="total, sizes, prev, pager, next" |
|
|
|
|
:total="negativeTotal" |
|
|
|
|
> |
|
|
|
|
</el-pagination> |
|
|
|
|
</div> |
|
|
|
|
</main> |
|
|
|
|
</el-scrollbar> |
|
|
|
|
</el-dialog> |
|
|
|
|
|
|
|
|
|
<negative-dialog |
|
|
|
|
@ -320,7 +364,7 @@ import {
|
|
|
|
|
listNegativeMonthly, |
|
|
|
|
} from "@/api/sensitivePerception/profilePolice"; |
|
|
|
|
import { InspectCase } from "@/enums/dictEnums"; |
|
|
|
|
import { getDictLable } from "@/utils/util"; |
|
|
|
|
import { getDictLable, getGenderFromIdCode } from "@/utils/util"; |
|
|
|
|
import moment from "moment"; |
|
|
|
|
|
|
|
|
|
import useCatchStore from "@/stores/modules/catch"; |
|
|
|
|
@ -338,10 +382,13 @@ const query = ref({
|
|
|
|
|
const list = ref<any[]>([]); |
|
|
|
|
const total = ref(0); |
|
|
|
|
|
|
|
|
|
const mainLoading = ref(false); |
|
|
|
|
function getList() { |
|
|
|
|
mainLoading.value = true; |
|
|
|
|
listPoliceNegative(query.value).then((data) => { |
|
|
|
|
list.value = data.records; |
|
|
|
|
total.value = data.total; |
|
|
|
|
mainLoading.value = false; |
|
|
|
|
}); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
@ -426,13 +473,33 @@ watch(activeRow, async () => {
|
|
|
|
|
moment().format("YYYY-MM-DD HH:mm:ss"), |
|
|
|
|
]; |
|
|
|
|
await getProfileData(); |
|
|
|
|
listNegativeMonthly(row.idCode).then((data) => { |
|
|
|
|
listNegativeMonthly(activeRow.value.idCode).then((data) => { |
|
|
|
|
barOption.value.xAxis.data = data.months; |
|
|
|
|
barOption.value.series[0].data = data.values; |
|
|
|
|
}); |
|
|
|
|
}) |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
const time = ref([]); |
|
|
|
|
|
|
|
|
|
const radarOption = ref({ |
|
|
|
|
radar: { |
|
|
|
|
indicator: [], |
|
|
|
|
}, |
|
|
|
|
series: [ |
|
|
|
|
{ |
|
|
|
|
type: "radar", |
|
|
|
|
data: [ |
|
|
|
|
{ |
|
|
|
|
value: [], |
|
|
|
|
}, |
|
|
|
|
], |
|
|
|
|
label: { |
|
|
|
|
show: true |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
], |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
async function getProfileData() { |
|
|
|
|
loading.value = true; |
|
|
|
|
negativeQuery.value.idCode = activeRow.value.idCode; |
|
|
|
|
@ -447,6 +514,8 @@ async function getProfileData() {
|
|
|
|
|
problemSourcesPieOptions.value.series[0].data = data.problemSourcesList; |
|
|
|
|
businessTypePieOptions.value.series[0].data = data.businessTypeList; |
|
|
|
|
|
|
|
|
|
radarOption.value.radar.indicator = data.problemTypeRadarIndicator |
|
|
|
|
radarOption.value.series[0].data[0].value = data.problemTypeRadarData |
|
|
|
|
loading.value = false; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
@ -464,48 +533,6 @@ function getNegativeList() {
|
|
|
|
|
}); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
const radarOption = { |
|
|
|
|
radar: { |
|
|
|
|
// shape: 'circle', |
|
|
|
|
indicator: [ |
|
|
|
|
{ name: "内部管理", max: 6500 }, |
|
|
|
|
{ name: "涉及监督", max: 6500 }, |
|
|
|
|
{ name: "记录作风", max: 30000 }, |
|
|
|
|
{ name: "警保卫工作", max: 38000 }, |
|
|
|
|
{ name: "执法办案", max: 52000 }, |
|
|
|
|
{ name: "专项工作", max: 25000 }, |
|
|
|
|
], |
|
|
|
|
}, |
|
|
|
|
series: [ |
|
|
|
|
{ |
|
|
|
|
name: "Budget vs spending", |
|
|
|
|
type: "radar", |
|
|
|
|
data: [ |
|
|
|
|
{ |
|
|
|
|
value: [4200, 3000, 20000, 35000, 50000, 18000], |
|
|
|
|
}, |
|
|
|
|
], |
|
|
|
|
}, |
|
|
|
|
], |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
function getGenderFromIdCode(idCode) { |
|
|
|
|
// 检查身份证号码是否有效（长度为18位） |
|
|
|
|
if (!idCode || idCode.length !== 18) { |
|
|
|
|
return ""; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
// 获取第17位数字 |
|
|
|
|
const genderCode = parseInt(idCode.charAt(16), 10); |
|
|
|
|
|
|
|
|
|
// 检查是否为数字 |
|
|
|
|
if (isNaN(genderCode)) { |
|
|
|
|
return ""; |
|
|
|
|
} |
|
|
|
|
// 根据第17位数字判断性别 |
|
|
|
|
return genderCode % 2 === 0 ? "女" : "男"; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
const negativeShow = ref(false); |
|
|
|
|
const activeNegativeId = ref(""); |
|
|
|
|
function handleAction(row) { |
|
|
|
|
|
wxc
1 year ago