Browse Source

fix: 完善单位问题画像、个人问题画像

main
wxc 1 year ago
parent
commit
463ae6de51
  1. 15
      src/components/datav/chart-bar.vue
  2. 15
      src/utils/util.ts
  3. 14
      src/views/datav/Gobal.vue
  4. 126
      src/views/sensitivePerception/DepartNegative.vue
  5. 143
      src/views/sensitivePerception/PoliceNegative.vue

15
src/components/datav/chart-bar.vue

@ -8,9 +8,10 @@
class="flex v-center bar-item between"
v-for="item in data"
:size="size"
:style="{'--label-width': `${labelWidth}px`}"
>
<span class="bar-item-name mr-10">{{ item.label }}</span>
<div class="bar-item_content mr-16">
<span class="bar-item-label mr-10">{{ item.label }}</span>
<div class="bar-item_content mr-16" >
<div
class="bar-item_content-bar"
:style="{
@ -59,6 +60,10 @@ const props = defineProps({
color: {
type: Object,
default: "linear-gradient(270deg, #63e700 0%, #19674c 100%)"
},
labelWidth: {
type: Number,
default: 80
}
});
@ -123,12 +128,12 @@ function getColor(val) {
height: 25px;
font-size: 12px;
}
.bar-item-name {
width: 19%;
.bar-item-label {
text-align: right;
width: var(--label-width);
}
.bar-item_content {
width: 55%;
width: calc(100% - var(--label-width) - 80px);
.bar-item_content-bar {
width: 0;
height: 9px;

15
src/utils/util.ts

@ -369,3 +369,18 @@ export function getInvolveProblem(json) {
}
return JSON.parse(json).map(item => item.dictLabel).join(' ')
}
export 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 ? "女" : "男";
}

14
src/views/datav/Gobal.vue

@ -387,49 +387,49 @@ const option1 = ref({
const data1 = [
{
name: "开福分局",
label: "开福分局",
value: 97,
unit: "%",
numerator: 97,
denominator: 100,
},
{
name: "芙蓉分局",
label: "芙蓉分局",
value: 90,
unit: "%",
numerator: 90,
denominator: 100,
},
{
name: "岳麓分局",
label: "岳麓分局",
value: 85,
unit: "%",
numerator: 85,
denominator: 100,
},
{
name: "雨花分局",
label: "雨花分局",
value: 80,
unit: "%",
numerator: 80,
denominator: 100,
},
{
name: "望城分局",
label: "望城分局",
value: 71,
unit: "%",
numerator: 71,
denominator: 100,
},
{
name: "浏阳市局",
label: "浏阳市局",
value: 66,
unit: "%",
numerator: 66,
denominator: 100,
},
{
name: "长沙县局",
label: "长沙县局",
value: 62,
unit: "%",
numerator: 62,

126
src/views/sensitivePerception/DepartNegative.vue

@ -19,7 +19,7 @@
</el-col>
<el-col :span="6">
<el-form-item label="三级单位">
<el-form-item label="单位">
<depart-tree-select
v-model="query.departId"
:check-strictly="false"
@ -83,7 +83,11 @@
align="center"
width="160"
/>
<el-table-column label="风险指数" align="center" width="160">
<template #default="{ row }">
<span>/</span>
</template>
</el-table-column>
<el-table-column label="操作">
<template #default="{ row }">
<el-button
@ -112,7 +116,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">
@ -124,7 +134,12 @@
</div>
<el-button type="primary" @click="getProfileData">查询</el-button>
</header>
<main v-loading="loading">
<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>
@ -176,7 +191,10 @@
style="height: calc(100% - 76px)"
>
<el-col :span="6" class="text-center">
<div class="text-primary" style="font-size: 34px">
<div
class="text-primary"
style="font-size: 34px"
>
{{ activeRow.verifySize }}
</div>
<div>问题总数</div>
@ -187,7 +205,9 @@
<description-pair
label1="110接处警量"
label2="问题数"
:value1="negativeInfo.jcjBusinessSize"
:value1="
negativeInfo.jcjBusinessSize
"
:value2="negativeInfo.jcjSize"
/>
</el-col>
@ -195,7 +215,9 @@
<description-pair
label1="执法办案"
label2="问题数"
:value1="negativeInfo.zfbaBusinessSize"
:value1="
negativeInfo.zfbaBusinessSize
"
:value2="negativeInfo.zfbaSize"
/>
</el-col>
@ -255,6 +277,11 @@
</el-col>
<el-col :span="8">
<h5>风险问题构成</h5>
<v-charts
style="height: 320px"
:option="radarOption"
autoresize
/>
</el-col>
</el-row>
<el-row class="mb-20">
@ -268,11 +295,10 @@
</el-col>
<el-col :span="8">
<h5>突出问题排名</h5>
<datav-chart-bar size="small" :data="[]" />
<datav-chart-bar size="small" :data="problemTypeBarList" :color="colors" />
</el-col>
<el-col :span="8">
<h5>单位问题标签</h5>
<datav-chart-bar size="small" :data="[]" />
</el-col>
</el-row>
<div style="margin-top: 60px">
@ -289,7 +315,10 @@
<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="involveDepartName"
/>
<el-table-column
label="核查情况"
prop="checkStatusName"
@ -321,6 +350,7 @@
</el-pagination>
</div>
</main>
</el-scrollbar>
</el-dialog>
<negative-dialog
@ -445,13 +475,34 @@ watch(activeRow, async () => {
moment().format("YYYY-MM-DD HH:mm:ss"),
];
await getProfileData();
listNegativeMonthly(row.departId).then((data) => {
listNegativeMonthly(activeRow.value.departId).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
}
},
],
});
const problemTypeBarList = ref([])
async function getProfileData() {
loading.value = true;
negativeQuery.value.involveDepartId = activeRow.value.departId;
@ -467,6 +518,11 @@ async function getProfileData() {
businessTypePieOptions.value.series[0].data = data.businessTypeList;
policeBarList.value = data.policeBarList;
radarOption.value.radar.indicator = data.problemTypeRadarIndicator
radarOption.value.series[0].data[0].value = data.problemTypeRadarData
problemTypeBarList.value = data.problemTypeBarList
loading.value = false;
}
@ -483,54 +539,6 @@ const colors = [
{ color: "#E8684A ", percentage: 80 },
];
const barList = [
{
label: "张三",
value: 67,
},
{
label: "李四",
value: 80,
},
{
label: "王五",
value: 40,
},
{
label: "王五",
value: 40,
},
{
label: "王五",
value: 10,
},
];
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],
},
],
},
],
};
const negativeShow = ref(false);
const activeNegativeId = ref("");
function handleAction(row) {

143
src/views/sensitivePerception/PoliceNegative.vue

@ -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,13 +136,18 @@
</div>
<el-button type="primary" @click="getProfileData">查询</el-button>
</header>
<main v-loading="loading">
<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="/imgs/police.jpeg" />
<img src="/favicon.png" />
</el-col>
<el-col :span="18">
<div class="row">
@ -142,7 +158,9 @@
<div class="col col-12">
<label>性别</label>
<span>{{
getGenderFromIdCode(policeInfo.idCode)
getGenderFromIdCode(
policeInfo.idCode
)
}}</span>
</div>
<div class="col col-24">
@ -154,7 +172,9 @@
? activeRow.parentDepartName +
"/"
: activeRow.parentDepartName
}}{{ activeRow.departName }}</span
}}{{
activeRow.departName
}}</span
>
</span>
</div>
@ -164,11 +184,15 @@
</div>
<div class="col col-12">
<label>任职年份</label>
<span>{{ policeInfo.employmentDate }}</span>
<span>{{
policeInfo.employmentDate || "/"
}}</span>
</div>
<div class="col col-12">
<label>手机号</label>
<span>{{ policeInfo.mobile }}</span>
<span>{{
policeInfo.mobile || "/"
}}</span>
</div>
</div>
</el-col>
@ -181,7 +205,10 @@
style="height: calc(100% - 76px)"
>
<el-col :span="6" class="text-center">
<div class="text-primary" style="font-size: 34px">
<div
class="text-primary"
style="font-size: 34px"
>
{{ activeRow.verifySize }}
</div>
<div>问题总数</div>
@ -192,7 +219,9 @@
<description-pair
label1="110接处警量"
label2="问题数"
:value1="negativeInfo.jcjBusinessSize"
:value1="
negativeInfo.jcjBusinessSize
"
:value2="negativeInfo.jcjSize"
/>
</el-col>
@ -200,7 +229,9 @@
<description-pair
label1="执法办案"
label2="问题数"
:value1="negativeInfo.zfbaBusinessSize"
:value1="
negativeInfo.zfbaBusinessSize
"
:value2="negativeInfo.zfbaSize"
/>
</el-col>
@ -260,18 +291,30 @@
</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 />
<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="involveDepartName"
/>
<el-table-column
label="核查情况"
prop="checkStatusName"
@ -303,6 +346,7 @@
</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) {

Loading…
Cancel
Save