Browse Source

Merge remote-tracking branch 'origin/master'

main
sjh 1 year ago
parent
commit
59da8d6459
  1. 1
      index.html
  2. BIN
      public/imgs/police.jpeg
  3. 1
      src/App.vue
  4. 11
      src/api/sensitivePerception/profileDepart.ts
  5. 28
      src/api/sensitivePerception/profilePolice.ts
  6. 2
      src/components/datav/card.vue
  7. 2
      src/components/datav/chart-bar-mail.vue
  8. 33
      src/components/datav/chart-bar.vue
  9. 6
      src/components/datav/tabs.vue
  10. 4
      src/components/description-pair.vue
  11. 15
      src/utils/util.ts
  12. 4
      src/views/data/Ajhc.vue
  13. 41
      src/views/datav/CaseVerif.vue
  14. 14
      src/views/datav/Gobal.vue
  15. 68
      src/views/datav/MailVisits.vue
  16. 326
      src/views/sensitivePerception/DepartNegative.vue
  17. 495
      src/views/sensitivePerception/PoliceNegative.vue
  18. 122
      src/views/work/Fav.vue
  19. 88
      vite.config.ts.timestamp-1730686774606-8b00c58248ca4.mjs

1
index.html

@ -10,6 +10,7 @@
</head> </head>
<body> <body>
<div id="app"></div> <div id="app"></div>
<script type="module" src="/src/main.ts"></script> <script type="module" src="/src/main.ts"></script>
</body> </body>

BIN
public/imgs/police.jpeg

Binary file not shown.

After

Width:  |  Height:  |  Size: 42 KiB

1
src/App.vue

@ -11,3 +11,4 @@ const elConfig = {
locale: zhCn locale: zhCn
} }
</script> </script>

11
src/api/sensitivePerception/profileDepart.ts

@ -7,8 +7,15 @@ export function listDepartNegative(query) {
}); });
} }
export function getDepartProfile(departId) { export function getDepartProfile(departId, query) {
return request.get({ return request.get({
url: `/profile/depart/${departId}` url: `/profile/depart/${departId}`,
query
});
}
export function listNegativeMonthly(departId) {
return request.get({
url: `/profile/depart/${departId}/month`
}); });
} }

28
src/api/sensitivePerception/profilePolice.ts

@ -0,0 +1,28 @@
import request from "@/api/request";
export function listPoliceNegative(query) {
return request.get({
url: `/profile/police`,
query
});
}
export function getPoliceProfile(idCode, query) {
return request.get({
url: `/profile/police/${idCode}`,
query
});
}
export function listNegativeByPoliceIdCode(idCode, query) {
return request.get({
url: `/profile/police/${idCode}/negative`,
query
});
}
export function listNegativeMonthly(idCode) {
return request.get({
url: `/profile/police/${idCode}/month`
});
}

2
src/components/datav/card.vue

@ -23,7 +23,7 @@ defineProps({
<style lang="scss" scoped> <style lang="scss" scoped>
.datav-card { .datav-card {
padding: 12px; padding: 12px;
margin-top: 20px; margin-bottom: 20px;
position: relative; position: relative;
z-index: 1; z-index: 1;
&::before { &::before {

2
src/components/datav/chart-bar-mail.vue

@ -3,7 +3,6 @@
<span class="bar-title">{{ title }}</span> <span class="bar-title">{{ title }}</span>
<span class="bar-sub-title">{{ subTitle }}</span> <span class="bar-sub-title">{{ subTitle }}</span>
</div> </div>
<el-scrollbar height="300px">
<div> <div>
<div <div
class="flex v-center bar-item between" class="flex v-center bar-item between"
@ -32,7 +31,6 @@
</span> </span>
</div> </div>
</div> </div>
</el-scrollbar>
</template> </template>
<script setup> <script setup>

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

@ -8,14 +8,17 @@
class="flex v-center bar-item between" class="flex v-center bar-item between"
v-for="item in data" v-for="item in data"
:size="size" :size="size"
:style="{'--label-width': `${labelWidth}px`}"
> >
<span class="bar-item-name mr-10">{{ item.label }}</span> <span class="bar-item-label mr-10">
<div class="bar-item_content mr-16"> {{ item.label }}
</span>
<div class="bar-item_content mr-16" >
<div <div
class="bar-item_content-bar" class="bar-item_content-bar"
:style="{ :style="{
width: `${(item.value / max) * 100}%`, width: `${(item.value / max) * 100}%`,
background: getColor(item.value / max), background: getColor(item.value / max * 100),
}" }"
></div> ></div>
</div> </div>
@ -59,14 +62,19 @@ const props = defineProps({
color: { color: {
type: Object, type: Object,
default: "linear-gradient(270deg, #63e700 0%, #19674c 100%)" default: "linear-gradient(270deg, #63e700 0%, #19674c 100%)"
},
labelWidth: {
type: Number,
default: 80
} }
}); });
const max = ref(100); const max = ref(100);
watch( watch(
() => props.data, () => props.data,
(arr) => { () => {
getMax() getMax()
} }
); );
@ -86,8 +94,7 @@ function getColor(val) {
} }
if (props.color instanceof Array) { if (props.color instanceof Array) {
const colors = [...props.color] const colors = [...props.color]
colors.reduce((a, b) => b.percentage - a.percentage) colors.sort((a, b) => b.percentage - a.percentage)
console.log(colors)
for (let i = 0; i < colors.length; i++) { for (let i = 0; i < colors.length; i++) {
if (val > colors[0].percentage) { if (val > colors[0].percentage) {
return colors[0].color; return colors[0].color;
@ -120,17 +127,23 @@ function getColor(val) {
} }
} }
} }
.bar-item-name { &[size="small"] {
width: 19%; height: 25px;
font-size: 12px;
}
.bar-item-label {
text-align: right; text-align: right;
width: var(--label-width);
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
} }
.bar-item_content { .bar-item_content {
width: 55%; width: calc(100% - var(--label-width) - 80px);
.bar-item_content-bar { .bar-item_content-bar {
width: 0; width: 0;
height: 9px; height: 9px;
background: linear-gradient(270deg, #63e700 0%, #19674c 100%); background: linear-gradient(270deg, #63e700 0%, #19674c 100%);
box-shadow: 1px 0 0px 0px #020b5f;
transition: width 0.3s; transition: width 0.3s;
} }
} }

6
src/components/datav/tabs.vue

@ -41,8 +41,10 @@ const props = defineProps({
default: "", default: "",
}, },
}); });
const slots = useSlots().default();
const emit = defineEmits(["update:modelValue"]); const emit = defineEmits(["update:modelValue"]);
const activeTab = ref(props.modelValue); const activeTab = ref(props.modelValue || slots[0].props.name);
watch(() => props.modelValue, () => { watch(() => props.modelValue, () => {
activeTab.value = props.modelValue activeTab.value = props.modelValue
}) })
@ -52,7 +54,7 @@ watch(activeTab, (val) => {
provide("activeTab", activeTab); provide("activeTab", activeTab);
const slots = useSlots().default();
function handleChangeActiveTab(name) { function handleChangeActiveTab(name) {
activeTab.value = name; activeTab.value = name;

4
src/components/description-pair.vue

@ -17,7 +17,7 @@ defineProps({
default: "", default: "",
}, },
value1: { value1: {
type: String, type: Number,
default: "", default: "",
}, },
label2: { label2: {
@ -25,7 +25,7 @@ defineProps({
default: "", default: "",
}, },
value2: { value2: {
type: String, type: Number,
default: "", default: "",
}, },
size: { size: {

15
src/utils/util.ts

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

4
src/views/data/Ajhc.vue

@ -226,7 +226,7 @@
prop="discoveryTime" prop="discoveryTime"
show-overflow-tooltip show-overflow-tooltip
/> />
<el-table-column label="问题发生时间" prop="happenTime" show-overflow-tooltip /> <!-- <el-table-column label="问题发生时间" prop="happenTime" show-overflow-tooltip />-->
<el-table-column <el-table-column
label="问题来源" label="问题来源"
prop="problemSources" prop="problemSources"
@ -244,7 +244,7 @@
/> />
<el-table-column label="业务类别" prop="businessTypeName" /> <el-table-column label="业务类别" prop="businessTypeName" />
<el-table-column label="涉嫌问题" prop="involveProblem" /> <el-table-column label="涉嫌问题" prop="involveProblem" />
<el-table-column label="涉及警种" prop="policeTypeName" /> <!-- <el-table-column label="涉及警种" prop="policeTypeName" />-->
<el-table-column <el-table-column
label="涉及单位" label="涉及单位"
prop="involveDepartName" prop="involveDepartName"

41
src/views/datav/CaseVerif.vue

@ -7,23 +7,27 @@
<el-col :span="6"> <el-col :span="6">
<datav-card title="分县市局排名" subTitle="案件数"> <datav-card title="分县市局排名" subTitle="案件数">
<datav-tabs <datav-tabs
v-model="activeTab"
type="bottom-button" type="bottom-button"
> >
<datav-tab-item label="分县市局" name="1"> <datav-tab-item label="分县市局" name="1">
<el-scrollbar height="350px">
<datav-chart-bar <datav-chart-bar
:data="fxsjBarList" :data="fxsjBarList"
size="large" size="large"
:color="colors"
/> />
</el-scrollbar>
</datav-tab-item> </datav-tab-item>
<datav-tab-item label="局属单位" name="2"> <datav-tab-item label="局属单位" name="2">
<el-scrollbar height="350px">
<datav-chart-bar <datav-chart-bar
:data="jsdwBarList" :data="jsdwBarList"
:max="11" :max="11"
size="large" size="large"
:color="colors"
/> />
</el-scrollbar>
</datav-tab-item> </datav-tab-item>
</datav-tabs> </datav-tabs>
</datav-card> </datav-card>
<datav-card title="案件问题性质"> <datav-card title="案件问题性质">
@ -181,13 +185,16 @@ function getData() {
watch(time, () => { watch(time, () => {
getData(); getData();
}) });
onMounted(() => { onMounted(() => {
getData(); getData();
}); });
const zfbaPieOption = computed(() => { const zfbaPieOption = computed(() => {
return { return {
tooltip: {
trigger: "item",
},
series: [ series: [
{ {
type: "pie", type: "pie",
@ -203,6 +210,9 @@ const zfbaPieOption = computed(() => {
const fwglPieOption = computed(() => { const fwglPieOption = computed(() => {
return { return {
tooltip: {
trigger: "item",
},
series: [ series: [
{ {
type: "pie", type: "pie",
@ -218,6 +228,9 @@ const fwglPieOption = computed(() => {
const jjjgPieOption = computed(() => { const jjjgPieOption = computed(() => {
return { return {
tooltip: {
trigger: "item",
},
series: [ series: [
{ {
type: "pie", type: "pie",
@ -233,6 +246,9 @@ const jjjgPieOption = computed(() => {
const ajlyPieOption = computed(() => { const ajlyPieOption = computed(() => {
return { return {
tooltip: {
trigger: "item",
},
series: [ series: [
{ {
type: "pie", type: "pie",
@ -351,6 +367,9 @@ const option1 = ref({
}); });
const option4 = { const option4 = {
tooltip: {
trigger: "item",
},
series: [ series: [
{ {
type: "pie", type: "pie",
@ -371,7 +390,21 @@ const option4 = {
], ],
}; };
const activeTab = ref("1");
const colors = [
{
color: "linear-gradient( 270deg, #FB002D 0%, #822232 100%)",
percentage: 80,
},
{
color: "linear-gradient( 270deg, #FFB90E 0%, #71501D 100%)",
percentage: 60,
},
{
color: "linear-gradient( 270deg, #63E700 0%, #19674C 100%)",
percentage: 40,
},
];
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

14
src/views/datav/Gobal.vue

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

68
src/views/datav/MailVisits.vue

@ -46,26 +46,31 @@
type="bottom-button" type="bottom-button"
> >
<datav-tab-item label="初信初访" name="1"> <datav-tab-item label="初信初访" name="1">
<el-scrollbar height="300px">
<datav-chart-bar-mail <datav-chart-bar-mail
:data="fxsjFirstMailList" :data="fxsjFirstMailList"
size="large" size="large"
:max="11" :max="11"
/> />
</el-scrollbar>
</datav-tab-item> </datav-tab-item>
<datav-tab-item label="重复信访" name="2"> <datav-tab-item label="重复信访" name="2">
<el-scrollbar height="300px">
<datav-chart-bar-mail <datav-chart-bar-mail
:data="fxsjRepeatMailList" :data="fxsjRepeatMailList"
:max="11" :max="11"
size="large" size="large"
/> />
</el-scrollbar>
</datav-tab-item> </datav-tab-item>
<datav-tab-item label="领导接访" name="3"> <datav-tab-item label="领导接访" name="3">
<datav-chart-bar-mail <el-scrollbar height="300px">
<datav-chart-bar
:data="fxsjLeaderViewMailList" :data="fxsjLeaderViewMailList"
:max="11" :max="11"
size="large" size="large"
/> />
</el-scrollbar>
</datav-tab-item> </datav-tab-item>
</datav-tabs> </datav-tabs>
</datav-tab-item> </datav-tab-item>
@ -75,33 +80,32 @@
type="bottom-button" type="bottom-button"
> >
<datav-tab-item label="初信初访" name="1"> <datav-tab-item label="初信初访" name="1">
<div style="height: 300px; overflow: auto"> <el-scrollbar height="300px">
<datav-chart-bar <datav-chart-bar-mail
:data="bwzdFirstMailList" :data="bwzdFirstMailList"
size="large" size="large"
/> />
</div> </el-scrollbar>
</datav-tab-item> </datav-tab-item>
<datav-tab-item label="重复信访" name="2"> <datav-tab-item label="重复信访" name="2">
<div style="height: 300px; overflow: auto"> <el-scrollbar height="300px">
<datav-chart-bar <datav-chart-bar-mail
:data="bwzdRepeatMailList" :data="bwzdRepeatMailList"
:max="11" :max="11"
size="large" size="large"
/> />
</div> </el-scrollbar>
</datav-tab-item> </datav-tab-item>
<datav-tab-item label="领导接访" name="3"> <datav-tab-item label="领导接访" name="3">
<div style="height: 300px; overflow: auto"> <el-scrollbar height="300px">
<datav-chart-bar <datav-chart-bar-mail
:data="bwzdLeaderViewMailList" :data="bwzdLeaderViewMailList"
:max="11" :max="11"
size="large" size="large"
/> />
</div> </el-scrollbar>
</datav-tab-item> </datav-tab-item>
</datav-tabs> </datav-tabs>
</datav-tab-item> </datav-tab-item>
</datav-tabs> </datav-tabs>
</datav-card> </datav-card>
@ -242,24 +246,30 @@
type="bottom-button" type="bottom-button"
> >
<datav-tab-item label="领导督办" name="1"> <datav-tab-item label="领导督办" name="1">
<el-scrollbar height="300px">
<datav-chart-bar-mail <datav-chart-bar-mail
:data="xx" :data="xx"
size="large" size="large"
/> />
</el-scrollbar>
</datav-tab-item> </datav-tab-item>
<datav-tab-item label="缠访闹访" name="2"> <datav-tab-item label="缠访闹访" name="2">
<el-scrollbar height="300px">
<datav-chart-bar-mail <datav-chart-bar-mail
:data="xx" :data="xx"
:max="11" :max="11"
size="large" size="large"
/> />
</el-scrollbar>
</datav-tab-item> </datav-tab-item>
<datav-tab-item label="群体集访" name="3"> <datav-tab-item label="群体集访" name="3">
<el-scrollbar height="300px">
<datav-chart-bar-mail <datav-chart-bar-mail
:data="xx" :data="xx"
:max="11" :max="11"
size="large" size="large"
/> />
</el-scrollbar>
</datav-tab-item> </datav-tab-item>
</datav-tabs> </datav-tabs>
@ -270,24 +280,30 @@
type="bottom-button" type="bottom-button"
> >
<datav-tab-item label="领导督办" name="1"> <datav-tab-item label="领导督办" name="1">
<el-scrollbar height="300px">
<datav-chart-bar-mail <datav-chart-bar-mail
:data="xx" :data="xx"
size="large" size="large"
/> />
</el-scrollbar>
</datav-tab-item> </datav-tab-item>
<datav-tab-item label="缠访闹访" name="2"> <datav-tab-item label="缠访闹访" name="2">
<el-scrollbar height="300px">
<datav-chart-bar-mail <datav-chart-bar-mail
:data="xx" :data="xx"
:max="11" :max="11"
size="large" size="large"
/> />
</el-scrollbar>
</datav-tab-item> </datav-tab-item>
<datav-tab-item label="群体集访" name="3"> <datav-tab-item label="群体集访" name="3">
<el-scrollbar height="300px">
<datav-chart-bar-mail <datav-chart-bar-mail
:data="xx" :data="xx"
:max="11" :max="11"
size="large" size="large"
/> />
</el-scrollbar>
</datav-tab-item> </datav-tab-item>
</datav-tabs> </datav-tabs>
@ -303,11 +319,11 @@
/> />
</datav-card> </datav-card>
</el-col> </el-col>
</el-row> </el-row>
</main> </main>
</div> </div>
</el-scrollbar> </el-scrollbar>
</template> </template>
@ -363,7 +379,6 @@ const option = {
}, },
], ],
}; };
const option1 = ref({ const option1 = ref({
xAxis: { xAxis: {
type: "category", type: "category",
@ -415,8 +430,6 @@ const option1 = ref({
}, },
], ],
}); });
const option2 = { const option2 = {
series: [ series: [
{ {
@ -455,10 +468,6 @@ const option3 = {
}, },
], ],
}; };
const activeTab = ref("1"); const activeTab = ref("1");
const bwzdActiveTab = ref("1"); // tab const bwzdActiveTab = ref("1"); // tab
const activeMailTrend = ref("1"); // 访tab const activeMailTrend = ref("1"); // 访tab
@ -503,7 +512,7 @@ const time = ref([
* @type {Ref<UnwrapRef<string>, UnwrapRef<string> | string>} * @type {Ref<UnwrapRef<string>, UnwrapRef<string> | string>}
*/ */
const selectedOption = ref('2024'); const selectedOption = ref('2024');
const shihao= ref(1); const shihao = ref(1);
const handleCommand = async (command) => { const handleCommand = async (command) => {
selectedOption.value = `${command}`; selectedOption.value = `${command}`;
const recentlyMailTrend = await getRecentlyMailTrend({ const recentlyMailTrend = await getRecentlyMailTrend({
@ -531,8 +540,6 @@ function initRecentlyMailTrend() {
} }
watch(activeMailTrend, async () => { watch(activeMailTrend, async () => {
// console.log("Active Tab: ", activeMailTrend.value);
// console.log("Active Tab Right: ", selectedOption.value);
const recentlyMailTrend = await getRecentlyMailTrend({ const recentlyMailTrend = await getRecentlyMailTrend({
sourcesCode: activeMailTrend.value, sourcesCode: activeMailTrend.value,
year: selectedOption.value, year: selectedOption.value,
@ -560,6 +567,7 @@ onMounted(() => {
// console.log("Active Tab: ", activeMailTab.value); // console.log("Active Tab: ", activeMailTab.value);
// }, 3000); // 3 // }, 3000); // 3
}); });
function getData() { function getData() {
getMailVisitsData(time.value).then((data) => { getMailVisitsData(time.value).then((data) => {
overview.value = data.overview; overview.value = data.overview;
@ -577,8 +585,6 @@ function getData() {
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@import "@/style/datav.scss"; @import "@/style/datav.scss";
@ -589,4 +595,16 @@ function getData() {
top: 65px; top: 65px;
} }
.main {
padding: 0 10px 10px;
}
.main-left,
.main-right {
float: left;
width: 25%;
padding: 0 10px;
height: 90%;
}
</style> </style>

326
src/views/sensitivePerception/DepartNegative.vue

@ -4,7 +4,22 @@
<el-form :label-width="114"> <el-form :label-width="114">
<el-row> <el-row>
<el-col :span="6"> <el-col :span="6">
<el-form-item label="三级单位"> <el-form-item label="单位类型">
<el-select v-model="query.departLevel">
<el-option value="3" label="所队"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="统计时间">
<date-time-range-picker-ext
v-model="query.crtTime"
/>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="单位">
<depart-tree-select <depart-tree-select
v-model="query.departId" v-model="query.departId"
:check-strictly="false" :check-strictly="false"
@ -12,9 +27,10 @@
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="6"> <el-col :span="6">
<el-form-item label="统计时间"> <el-form-item label="单位简称">
<date-time-range-picker-ext <el-input
v-model="query.crtTime" v-model="query.departName"
placeholder="请输入"
/> />
</el-form-item> </el-form-item>
</el-col> </el-col>
@ -32,7 +48,7 @@
</div> </div>
</div> </div>
</header> </header>
<div class="table-container"> <div class="table-container" v-loading="mainLoading">
<el-table :data="list"> <el-table :data="list">
<el-table-column label="单位名称"> <el-table-column label="单位名称">
<template #default="{ row }"> <template #default="{ row }">
@ -67,7 +83,11 @@
align="center" align="center"
width="160" width="160"
/> />
<el-table-column label="风险指数" align="center" width="160">
<template #default="{ row }">
<span>/</span>
</template>
</el-table-column>
<el-table-column label="操作"> <el-table-column label="操作">
<template #default="{ row }"> <template #default="{ row }">
<el-button <el-button
@ -96,19 +116,31 @@
</div> </div>
</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"> <header class="flex center v-center gap">
<label>统计范围</label> <label>统计范围</label>
<div style="width: 320px"> <div style="width: 320px">
<date-time-range-picker-ext <date-time-range-picker-ext
v-model="query.crtTime" v-model="time"
@change="getProfileData"
style="width: 300px" style="width: 300px"
/> />
</div> </div>
<el-button type="primary">查询</el-button> <el-button type="primary" @click="getProfileData">查询</el-button>
</header> </header>
<main v-loading="loading"> <el-scrollbar
<el-row> max-height="calc(98vh - 120px)"
v-loading="loading"
element-loading-text="单位问题画像加载中..."
>
<main>
<el-row class="mb-20">
<el-col :span="8"> <el-col :span="8">
<h5>单位情况</h5> <h5>单位情况</h5>
<div class="row"> <div class="row">
@ -126,6 +158,7 @@
<span <span
v-for="item in departInfo.deputyRole" v-for="item in departInfo.deputyRole"
:key="item" :key="item"
class="mr-10"
>{{ item }}</span >{{ item }}</span
> >
</span> </span>
@ -154,9 +187,15 @@
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">
<h5>问题情况</h5> <h5>问题情况</h5>
<el-row> <el-row
class="flex v-center"
style="height: calc(100% - 76px)"
>
<el-col :span="6" class="text-center"> <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 }} {{ activeRow.verifySize }}
</div> </div>
<div>问题总数</div> <div>问题总数</div>
@ -167,16 +206,20 @@
<description-pair <description-pair
label1="110接处警量" label1="110接处警量"
label2="问题数" label2="问题数"
value1="132" :value1="
value2="21" negativeInfo.jcjBusinessSize
"
:value2="negativeInfo.jcjSize"
/> />
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<description-pair <description-pair
label1="执法办案" label1="执法办案"
label2="问题数" label2="问题数"
value1="132" :value1="
value2="21" negativeInfo.zfbaBusinessSize
"
:value2="negativeInfo.zfbaSize"
/> />
</el-col> </el-col>
</el-row> </el-row>
@ -216,12 +259,12 @@
</div> </div>
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row class="mb-20">
<el-col :span="8"> <el-col :span="8">
<h5>问题来源占比</h5> <h5>问题来源占比</h5>
<v-charts <v-charts
style="height: 320px" style="height: 320px"
:option="pieOptions" :option="problemSourcesPieOptions"
autoresize autoresize
/> />
</el-col> </el-col>
@ -229,7 +272,7 @@
<h5>业务类型占比</h5> <h5>业务类型占比</h5>
<v-charts <v-charts
style="height: 320px" style="height: 320px"
:option="pieOptions" :option="businessTypePieOptions"
autoresize autoresize
/> />
</el-col> </el-col>
@ -242,35 +285,57 @@
/> />
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row class="mb-20">
<el-col :span="8"> <el-col :span="8">
<h5>个人问题排名</h5> <h5>个人问题排名</h5>
<datav-chart-bar :data="barList" :color="colors" /> <datav-chart-bar
size="small"
:data="policeBarList"
:color="colors"
/>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">
<h5>突出问题排名</h5> <h5>突出问题排名</h5>
<datav-chart-bar :data="barList" /> <datav-chart-bar size="small" :data="problemTypeBarList" :color="colors" />
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">
<h5>单位问题标签</h5> <h5>单位问题标签</h5>
<datav-chart-bar :data="barList" />
</el-col> </el-col>
</el-row> </el-row>
<div style="margin-top: 60px">
<h5>问题变化趋势</h5> <h5>问题变化趋势</h5>
<v-charts style="height: 320px" :option="barOption" autoresize /> <v-charts
style="height: 320px"
:option="barOption"
autoresize
/>
<div></div> <div></div>
</div>
<h5>问题清单</h5> <h5>问题清单</h5>
<el-table :data="negativeList"> <el-table :data="negativeList">
<el-table-column label="发现时间" prop="discoveryTime" /> <el-table-column label="发现时间" prop="discoveryTime" />
<el-table-column label="问题来源" prop="problemSources" /> <el-table-column label="问题来源" prop="problemSources" />
<el-table-column label="业务类别" prop="businessTypeName" /> <el-table-column label="业务类别" prop="businessTypeName" />
<el-table-column label="涉及单位" prop="involveDepartName" /> <el-table-column
label="涉及单位"
prop="involveDepartName"
/>
<el-table-column <el-table-column
label="核查情况" label="核查情况"
prop="checkStatusName" prop="checkStatusName"
width="180" width="140"
align="center" 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> </el-table>
<div class="flex end mt-8"> <div class="flex end mt-8">
<el-pagination <el-pagination
@ -286,28 +351,45 @@
</el-pagination> </el-pagination>
</div> </div>
</main> </main>
</el-scrollbar>
</el-dialog> </el-dialog>
<negative-dialog
v-model="negativeShow"
:id="activeNegativeId"
@close="negativeShow = false"
/>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import vCharts from "vue-echarts"; import vCharts from "vue-echarts";
import { import {
listDepartNegative, listDepartNegative,
getDepartProfile, getDepartProfile,
listNegativeMonthly,
} from "@/api/sensitivePerception/profileDepart"; } from "@/api/sensitivePerception/profileDepart";
import { listNegative } from "@/api/work/negative"; import { listNegative } from "@/api/work/negative";
import { InspectCase } from "@/enums/dictEnums"; import { InspectCase } from "@/enums/dictEnums";
import moment from "moment";
const query = ref({ const query = ref({
current: 1, current: 1,
size: 10, size: 10,
departLevel: "3",
crtTime: [
moment().startOf("year").format("YYYY-MM-DD HH:mm:ss"),
moment().format("YYYY-MM-DD HH:mm:ss"),
],
}); });
const list = ref<any[]>([]); const list = ref<any[]>([]);
const total = ref(0); const total = ref(0);
const mainLoading = ref(false);
function getList() { function getList() {
mainLoading.value = true;
listDepartNegative(query.value).then((data) => { listDepartNegative(query.value).then((data) => {
list.value = data.records; list.value = data.records;
total.value = data.total; total.value = data.total;
mainLoading.value = false;
}); });
} }
@ -315,6 +397,11 @@ function reset() {
query.value = { query.value = {
current: 1, current: 1,
size: 10, size: 10,
departLevel: "3",
crtTime: [
moment().startOf("year").format("YYYY-MM-DD HH:mm:ss"),
moment().format("YYYY-MM-DD HH:mm:ss"),
],
}; };
getList(); getList();
} }
@ -326,6 +413,7 @@ onMounted(() => {
const activeRow = ref({}); const activeRow = ref({});
const show = ref(false); const show = ref(false);
const departInfo = ref({}); const departInfo = ref({});
const negativeInfo = ref({});
const loading = ref(false); const loading = ref(false);
const negativeQuery = ref({ const negativeQuery = ref({
@ -333,117 +421,131 @@ const negativeQuery = ref({
}); });
const negativeList = ref([]); const negativeList = ref([]);
const negativeTotal = ref(0); const negativeTotal = ref(0);
async function handleShowProfile(row) {
activeRow.value = row;
loading.value = true;
show.value = true;
negativeQuery.value.involveDepartId = row.departId; const problemSourcesPieOptions = ref({
getNegativeList(); tooltip: {
const data = await getDepartProfile(row.departId); trigger: "item",
departInfo.value = data.departInfo;
loading.value = false;
}
function getNegativeList() {
listNegative(negativeQuery.value).then((data) => {
negativeList.value = data.records;
negativeTotal.value = data.total;
});
}
const colors = [
{ color: "#f56c6c", percentage: 20 },
{ color: "#e6a23c", percentage: 40 },
{ color: "#5cb87a", percentage: 60 },
{ color: "#1989fa", percentage: 80 },
{ color: "#6f7ad3", percentage: 100 },
];
const barList = [
{
label: "张三",
value: 67,
},
{
label: "李四",
value: 80,
},
{
label: "王五",
value: 40,
},
{
label: "王五",
value: 40,
}, },
{
label: "王五",
value: 10,
},
];
const pieOptions = computed(() => {
return {
series: [ series: [
{ {
type: "pie", type: "pie",
radius: ["40%", "70%"], radius: ["40%", "70%"],
data: [],
data: [
{ value: 311, name: "慢作为" },
{ value: 735, name: "意见建议" },
{ value: 580, name: "违法违纪违规" },
{ value: 484, name: "乱作为" },
{ value: 300, name: "其他" },
{ value: 300, name: "不作为" },
],
}, },
], ],
};
}); });
const businessTypePieOptions = ref({
const radarOption = { tooltip: {
radar: { trigger: "item",
// shape: 'circle',
indicator: [
{ name: "内部管理", max: 6500 },
{ name: "涉及监督", max: 6500 },
{ name: "记录作风", max: 30000 },
{ name: "警保卫工作", max: 38000 },
{ name: "执法办案", max: 52000 },
{ name: "专项工作", max: 25000 },
],
}, },
series: [ series: [
{ {
name: "Budget vs spending", type: "pie",
type: "radar", radius: ["40%", "70%"],
data: [ data: [],
{
value: [4200, 3000, 20000, 35000, 50000, 18000],
},
],
}, },
], ],
}; });
const policeBarList = ref([]);
const barOption = { const barOption = ref({
xAxis: { xAxis: {
type: "category", type: "category",
data: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"], data: [],
}, },
yAxis: { yAxis: {
type: "value", type: "value",
}, },
series: [ series: [
{ {
data: [120, 200, 150, 80, 70, 110, 130], data: [],
type: "bar", type: "bar",
color: "#5B8FF9 ",
},
],
});
async function handleShowProfile(row) {
activeRow.value = row;
show.value = true;
}
watch(activeRow, async () => {
time.value = [
moment().startOf("year").format("YYYY-MM-DD HH:mm:ss"),
moment().format("YYYY-MM-DD HH:mm:ss"),
];
await getProfileData();
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;
getNegativeList();
const data = await getDepartProfile(activeRow.value.departId, {
beginTime: time.value.length ? time.value[0] : "",
endTime: time.value.length ? time.value[1] : "",
});
departInfo.value = data.departInfo;
negativeInfo.value = data.negativeInfo;
problemSourcesPieOptions.value.series[0].data = data.problemSourcesList;
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;
}
function getNegativeList() {
listNegative(negativeQuery.value).then((data) => {
negativeList.value = data.records;
negativeTotal.value = data.total;
});
}
const colors = [
{ color: "#5AD8A6", percentage: 40 },
{ color: "#F6BD16", percentage: 60 },
{ color: "#E8684A ", percentage: 80 },
];
const negativeShow = ref(false);
const activeNegativeId = ref("");
function handleAction(row) {
negativeShow.value = true;
activeNegativeId.value = row.id;
}
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
</style> </style>

495
src/views/sensitivePerception/PoliceNegative.vue

@ -4,17 +4,35 @@
<el-form :label-width="114"> <el-form :label-width="114">
<el-row> <el-row>
<el-col :span="6"> <el-col :span="6">
<el-form-item label="所在单位"> <el-form-item label="统计时间">
<depart-tree-select <date-time-range-picker-ext
v-model="query.departId" v-model="query.crtTime"
:check-strictly="false"
/> />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="6"> <el-col :span="6">
<el-form-item label="统计时间"> <el-form-item label="姓名">
<date-time-range-picker-ext <el-input
v-model="query.crtTime" v-model="query.name"
placeholder="请输入"
clearable
/>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="警号">
<el-input
v-model="query.empNo"
placeholder="请输入"
clearable
/>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="所属单位">
<depart-tree-select
v-model="query.departId"
:check-strictly="false"
/> />
</el-form-item> </el-form-item>
</el-col> </el-col>
@ -32,22 +50,52 @@
</div> </div>
</div> </div>
</header> </header>
<div class="table-container"> <div class="table-container" v-loading="mainLoading">
<el-table :data="list"> <el-table :data="list">
<el-table-column label="姓名" prop="name" /> <el-table-column label="姓名" prop="name" />
<el-table-column label="性别" /> <el-table-column label="性别">
<el-table-column label="职务" prop="" /> <template #default="{ row }">
<span>{{ getGenderFromIdCode(row.idCode) }}</span>
</template>
</el-table-column>
<el-table-column label="职务">
<template #default="{ row }">
<span v-if="row.position">{{ row.position }}</span>
<span v-else>{{
getDictLable(dict.personType, row.personType)
}}</span>
</template>
</el-table-column>
<el-table-column label="警号" prop="empNo" /> <el-table-column label="警号" prop="empNo" />
<el-table-column label="任职年限" prop="" /> <el-table-column label="任职年限" prop="employmentDate" />
<el-table-column label="单位名称" prop="policeSize" /> <el-table-column label="所属单位" prop="departName">
<template #default="{ row }">
<span
>{{
row.parentDepartName
? row.parentDepartName + "/"
: row.parentDepartName
}}{{ row.departName }}</span
>
</template>
</el-table-column>
<el-table-column <el-table-column
label="查实问题数" label="查实问题数"
prop="verifySize" prop="verifySize"
width="120" 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"> <el-table-column label="操作" width="160">
<template #default="{ row }"> <template #default="{ row }">
<el-button type="primary" link @click="show = true" <el-button
type="primary"
link
@click="handleShowProfile(row)"
>问题画像</el-button >问题画像</el-button
> >
</template> </template>
@ -70,59 +118,98 @@
</div> </div>
</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"> <header class="flex center v-center gap">
<label>统计范围</label> <label>统计范围</label>
<div style="width: 320px"> <div style="width: 320px">
<date-time-range-picker-ext v-model="query.crtTime" style="width: 300px" /> <date-time-range-picker-ext
v-model="time"
style="width: 300px"
@change="getProfileData"
/>
</div> </div>
<el-button type="primary">查询</el-button> <el-button type="primary" @click="getProfileData">查询</el-button>
</header> </header>
<el-scrollbar
max-height="calc(98vh - 120px)"
v-loading="loading"
element-loading-text="个人问题画像加载中..."
>
<main> <main>
<el-row> <el-row class="mb-20">
<el-col :span="8"> <el-col :span="8">
<h5>单位情况</h5> <h5>民警基本情况</h5>
<el-row>
<el-col :span="6">
<img src="/favicon.png" />
</el-col>
<el-col :span="18">
<div class="row"> <div class="row">
<div class="col col-24"> <div class="col col-12">
<label>单位名称</label> <label>姓名</label>
<span>{{}}</span> <span>{{ policeInfo.name }}</span>
</div> </div>
<div class="col col-24"> <div class="col col-12">
<label>所长</label> <label>性别</label>
<span>{{}}</span> <span>{{
getGenderFromIdCode(
policeInfo.idCode
)
}}</span>
</div> </div>
<div class="col col-24"> <div class="col col-24">
<label>副所长</label> <label>所属单位</label>
<span>{{}}</span> <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> </div>
<el-row>
<el-col :span="12">
<description-pair
label1="民警总人数"
label2="问题涉及民警数"
value1="132"
value2="21"
size="large"
/>
</el-col>
<el-col :span="12">
<description-pair
label1="协辅警人数"
label2="问题涉及协辅警数"
value1="132"
value2="21"
size="large"
/>
</el-col> </el-col>
</el-row> </el-row>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">
<h5>问题情况</h5> <h5>问题情况</h5>
<el-row> <el-row
class="flex v-center"
style="height: calc(100% - 76px)"
>
<el-col :span="6" class="text-center"> <el-col :span="6" class="text-center">
<div class="text-primary" style="font-size: 34px"> <div
51 class="text-primary"
style="font-size: 34px"
>
{{ activeRow.verifySize }}
</div> </div>
<div>问题总数</div> <div>问题总数</div>
</el-col> </el-col>
@ -132,16 +219,20 @@
<description-pair <description-pair
label1="110接处警量" label1="110接处警量"
label2="问题数" label2="问题数"
value1="132" :value1="
value2="21" negativeInfo.jcjBusinessSize
"
:value2="negativeInfo.jcjSize"
/> />
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<description-pair <description-pair
label1="执法办案" label1="执法办案"
label2="问题数" label2="问题数"
value1="132" :value1="
value2="21" negativeInfo.zfbaBusinessSize
"
:value2="negativeInfo.zfbaSize"
/> />
</el-col> </el-col>
</el-row> </el-row>
@ -158,21 +249,35 @@
:width="250" :width="250"
color="#DC6231" color="#DC6231"
> >
<div> <div style="line-height: 64px" class="mt-40">
<span style="">78</span> <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> </div>
<div>分险指标值</div>
<div>中风险</div>
</el-progress> </el-progress>
</div> </div>
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row class="mb-20">
<el-col :span="8"> <el-col :span="8">
<h5>问题来源占比</h5> <h5>问题来源占比</h5>
<v-charts <v-charts
style="height: 320px" style="height: 320px"
:option="pieOptions" :option="problemSourcesPieOptions"
autoresize autoresize
/> />
</el-col> </el-col>
@ -180,7 +285,7 @@
<h5>业务类型占比</h5> <h5>业务类型占比</h5>
<v-charts <v-charts
style="height: 320px" style="height: 320px"
:option="pieOptions" :option="businessTypePieOptions"
autoresize autoresize
/> />
</el-col> </el-col>
@ -193,150 +298,250 @@
/> />
</el-col> </el-col>
</el-row> </el-row>
<el-row>
<el-col :span="8">
<h5>个人问题排名</h5>
<datav-chart-bar :data="barList" />
</el-col>
<el-col :span="8">
<h5>突出问题排名</h5>
<datav-chart-bar :data="barList" />
</el-col>
<el-col :span="8">
<h5>单位问题标签</h5>
<datav-chart-bar :data="barList" />
</el-col>
</el-row>
<h5>问题变化趋势</h5> <h5>问题变化趋势</h5>
<v-charts style="height: 320px" :option="barOption" autoresize /> <v-charts
style="height: 320px"
:option="barOption"
autoresize
/>
<div></div> <div></div>
<h5>问题清单</h5> <h5>问题清单</h5>
<el-table> <el-table :data="negativeList">
<el-table-column label="发现时间" prop="" /> <el-table-column label="发现时间" prop="discoveryTime" />
<el-table-column label="问题来源" prop="" /> <el-table-column label="问题来源" prop="problemSources" />
<el-table-column label="业务类别" prop="" /> <el-table-column label="业务类别" prop="businessTypeName" />
<el-table-column label="涉及单位" prop="" />
<el-table-column label="是否属实" prop="" width="180" />
<el-table-column <el-table-column
label="完善情况" label="涉及单位"
prop="departName" prop="involveDepartName"
width="120"
/> />
<el-table-column <el-table-column
label="最后编辑人" label="核查情况"
prop="fxzs" prop="checkStatusName"
width="120" width="140"
align="center" 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> </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> </main>
</el-scrollbar>
</el-dialog> </el-dialog>
<negative-dialog
v-model="negativeShow"
:id="activeNegativeId"
@close="negativeShow = false"
/>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import vCharts from "vue-echarts"; import vCharts from "vue-echarts";
import { listDepartNegative } from "@/api/sensitivePerception/profileDepart"; import {
import { onMounted } from "vue"; listPoliceNegative,
getPoliceProfile,
listNegativeByPoliceIdCode,
listNegativeMonthly,
} from "@/api/sensitivePerception/profilePolice";
import { InspectCase } from "@/enums/dictEnums";
import { getDictLable, getGenderFromIdCode } from "@/utils/util";
import moment from "moment";
import useCatchStore from "@/stores/modules/catch";
const catchStore = useCatchStore();
const dict = catchStore.getDicts(["personType"]);
const query = ref({ const query = ref({
current: 1, current: 1,
size: 10, size: 10,
crtTime: [
moment().startOf("year").format("YYYY-MM-DD HH:mm:ss"),
moment().format("YYYY-MM-DD HH:mm:ss"),
],
}); });
const list = ref<any[]>([]); const list = ref<any[]>([]);
const total = ref(0); const total = ref(0);
const mainLoading = ref(false);
function getList() { function getList() {
mainLoading.value = true;
listPoliceNegative(query.value).then((data) => {
list.value = data.records;
total.value = data.total;
mainLoading.value = false;
});
}
function reset() {
query.value = {
current: 1,
size: 10,
crtTime: [
moment().startOf("year").format("YYYY-MM-DD HH:mm:ss"),
moment().format("YYYY-MM-DD HH:mm:ss"),
],
};
getList();
} }
onMounted(() => { onMounted(() => {
getList(); getList();
}); });
const activeRow = ref({});
const show = ref(false); const show = ref(false);
const policeInfo = ref({});
const negativeInfo = ref({});
const loading = ref(false);
const barList = [ const negativeQuery = ref({
{ checkStatusList: [InspectCase.TRUE, InspectCase.TRUE],
label: "张三", });
value: 67, const negativeList = ref([]);
}, const negativeTotal = ref(0);
{
label: "李四",
value: 80,
},
{
label: "王五",
value: 40,
},
{
label: "王五",
value: 40,
},
{
label: "王五",
value: 10,
},
];
const pieOptions = computed(() => { const problemSourcesPieOptions = ref({
return { tooltip: {
trigger: "item",
},
series: [ series: [
{ {
type: "pie", type: "pie",
radius: ["40%", "70%"], radius: ["40%", "70%"],
data: [],
data: [
{ value: 311, name: "慢作为" },
{ value: 735, name: "意见建议" },
{ value: 580, name: "违法违纪违规" },
{ value: 484, name: "乱作为" },
{ value: 300, name: "其他" },
{ value: 300, name: "不作为" },
],
}, },
], ],
};
}); });
const businessTypePieOptions = ref({
const radarOption = { tooltip: {
radar: { trigger: "item",
// shape: 'circle',
indicator: [
{ name: "内部管理", max: 6500 },
{ name: "涉及监督", max: 6500 },
{ name: "记录作风", max: 30000 },
{ name: "警保卫工作", max: 38000 },
{ name: "执法办案", max: 52000 },
{ name: "专项工作", max: 25000 },
],
}, },
series: [ series: [
{ {
name: "Budget vs spending", type: "pie",
type: "radar", radius: ["40%", "70%"],
data: [ data: [],
{
value: [4200, 3000, 20000, 35000, 50000, 18000],
},
],
}, },
], ],
}; });
const barOption = { const barOption = ref({
xAxis: { xAxis: {
type: "category", type: "category",
data: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"], data: [],
}, },
yAxis: { yAxis: {
type: "value", type: "value",
}, },
series: [ series: [
{ {
data: [120, 200, 150, 80, 70, 110, 130], data: [],
type: "bar", type: "bar",
color: "#5B8FF9 ",
}, },
], ],
}; });
async function handleShowProfile(row) {
activeRow.value = row;
show.value = true;
}
watch(activeRow, async () => {
time.value = [
moment().startOf("year").format("YYYY-MM-DD HH:mm:ss"),
moment().format("YYYY-MM-DD HH:mm:ss"),
];
await getProfileData();
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;
getNegativeList();
const data = await getPoliceProfile(activeRow.value.idCode, {
beginTime: time.value.length ? time.value[0] : "",
endTime: time.value.length ? time.value[1] : "",
});
policeInfo.value = data.policeInfo;
negativeInfo.value = data.negativeInfo;
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;
}
function getNegativeList() {
if (time.value.length === 2) {
negativeQuery.value.beginTime = time.value[0];
negativeQuery.value.endTime = time.value[1];
}
listNegativeByPoliceIdCode(
activeRow.value.idCode,
negativeQuery.value
).then((data) => {
negativeList.value = data.records;
negativeTotal.value = data.total;
});
}
const negativeShow = ref(false);
const activeNegativeId = ref("");
function handleAction(row) {
negativeShow.value = true;
activeNegativeId.value = row.id;
}
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.col {
--label-width: 60px;
}
</style> </style>

122
src/views/work/Fav.vue

@ -5,27 +5,44 @@
<el-row> <el-row>
<el-col :span="6"> <el-col :span="6">
<el-form-item label="问题发生时间"> <el-form-item label="问题发生时间">
<date-time-range-picker-ext v-model="query.happenTime"/> <date-time-range-picker-ext
v-model="query.happenTime"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="6"> <el-col :span="6">
<el-form-item label="问题来源"> <el-form-item label="问题来源">
<el-select v-model="query.problemSources"> <el-select v-model="query.problemSources">
<el-option v-for="item in dict.problemSources" :key="item.id" :label="item.dictLabel" :value="item.dictValue" /> <el-option
v-for="item in dict.problemSources"
:key="item.id"
:label="item.dictLabel"
:value="item.dictValue"
/>
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="6"> <el-col :span="6">
<el-form-item label="业务类别"> <el-form-item label="业务类别">
<el-select v-model="query.businessType"> <el-select v-model="query.businessType">
<el-option v-for="item in dict.businessType" :key="item.id" :label="item.dictLabel" :value="item.dictValue" /> <el-option
v-for="item in dict.businessType"
:key="item.id"
:label="item.dictLabel"
:value="item.dictValue"
/>
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="6"> <el-col :span="6">
<el-form-item label="涉嫌问题"> <el-form-item label="涉嫌问题">
<el-select> <el-select>
<el-option v-for="item in dict.suspectProblem" :key="item.id" :label="item.dictLabel" :value="item.dictValue" /> <el-option
v-for="item in dict.suspectProblem"
:key="item.id"
:label="item.dictLabel"
:value="item.dictValue"
/>
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
@ -36,12 +53,16 @@
</el-col> </el-col>
<el-col :span="6"> <el-col :span="6">
<el-form-item label="涉及单位"> <el-form-item label="涉及单位">
<depart-tree-select v-model="query.involveDepartId" /> <depart-tree-select
v-model="query.involveDepartId"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="6"> <el-col :span="6">
<el-form-item label="办理单位"> <el-form-item label="办理单位">
<depart-tree-select v-model="query.involveDepartId" /> <depart-tree-select
v-model="query.involveDepartId"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="6"> <el-col :span="6">
@ -89,7 +110,7 @@
<div class="row mt-10"> <div class="row mt-10">
<div class="col col-6"> <div class="col col-6">
<label>投诉反映人</label> <label>投诉反映人</label>
<span>{{ }}</span> <span>{{}}</span>
</div> </div>
<div class="col col-6"> <div class="col col-6">
<label>联系电话</label> <label>联系电话</label>
@ -103,7 +124,7 @@
</div> </div>
<div class="col col-6"> <div class="col col-6">
<label>涉嫌问题</label> <label>涉嫌问题</label>
<span>{{ }}</span> <span>{{}}</span>
</div> </div>
</div> </div>
<div class="row mt-10"> <div class="row mt-10">
@ -120,18 +141,36 @@
</el-table-column> </el-table-column>
<el-table-column label="问题发生时间" prop="happenTime" /> <el-table-column label="问题发生时间" prop="happenTime" />
<el-table-column label="问题来源" prop="problemSources" /> <el-table-column label="问题来源" prop="problemSources" />
<el-table-column label="业务类别" prop="" /> <el-table-column label="业务类别" prop="businessTypeName" />
<el-table-column label="涉嫌问题" prop="" /> <el-table-column label="涉嫌问题">
<el-table-column label="问题内容" prop="thingDesc" show-overflow-tooltip /> <template #default="{ row }">
<el-table-column label="办理单位" prop="" /> <span>{{ getInvolveProblem(row.involveProblem) }}</span>
<el-table-column label="办理状态" prop="" /> </template>
<el-table-column label="办理状态" prop="" /> </el-table-column>
<el-table-column
label="问题内容"
prop="thingDesc"
show-overflow-tooltip
/>
<el-table-column label="涉及单位" show-overflow-tooltip>
<template #default="{ row }">
<span>{{ row.involveDepartName }}</span>
</template>
</el-table-column>
<el-table-column label="操作"> <el-table-column label="操作">
<template #default="{ row }"> <template #default="{ row }">
<el-button type="primary" link @click="handleAction(row)" <el-button
type="primary"
link
@click="handleAction(row)"
>详情</el-button >详情</el-button
> >
<el-button type="danger" link @click="handleDelFav(row.negativeId)">取消收藏</el-button> <el-button
type="danger"
link
@click="handleDelFav(row.negativeId)"
>取消收藏</el-button
>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
@ -154,51 +193,56 @@
<negative-dialog v-model="show" :id="activeNegativeId" /> <negative-dialog v-model="show" :id="activeNegativeId" />
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { listFav, delFav } from '@/api/work/fav' import { listFav, delFav } from "@/api/work/fav";
import feedback from '@/utils/feedback' import feedback from "@/utils/feedback";
import useCatchStore from '@/stores/modules/catch' import useCatchStore from "@/stores/modules/catch";
import { getDictLable, getInvolveProblem } from "@/utils/util";
const dict = useCatchStore().getDicts(['problemSources', 'businessType', 'suspectProblem']) const dict = useCatchStore().getDicts([
console.log(dict) "problemSources",
"businessType",
"suspectProblem",
"processingStatus",
]);
console.log(dict);
const favs = ref([]) const favs = ref([]);
const query = ref({ const query = ref({
current: 1, current: 1,
size: 10 size: 10,
}); });
const total = ref(0); const total = ref(0);
function getList() { function getList() {
listFav().then(data => { listFav().then((data) => {
favs.value = data.records favs.value = data.records;
total.value = data.total total.value = data.total;
}) });
} }
onMounted(() => { onMounted(() => {
getList() getList();
});
})
function reset() { function reset() {
query.value = { query.value = {
current: 1, current: 1,
size: 10 size: 10,
} };
getList() getList();
} }
const show = ref(false) const show = ref(false);
const activeNegativeId = ref('') const activeNegativeId = ref("");
function handleAction(row) { function handleAction(row) {
show.value = true show.value = true;
activeNegativeId.value = row.negativeId activeNegativeId.value = row.negativeId;
} }
async function handleDelFav(negativeId) { async function handleDelFav(negativeId) {
await feedback.confirm("确定要取消收藏?"); await feedback.confirm("确定要取消收藏?");
await delFav(negativeId) await delFav(negativeId);
getList() getList();
} }
</script> </script>

88
vite.config.ts.timestamp-1730686774606-8b00c58248ca4.mjs

File diff suppressed because one or more lines are too long
Loading…
Cancel
Save