Browse Source

Merge remote-tracking branch 'origin/master'

# Conflicts:
#	src/views/sensitivePerception/ModelClue.vue
main
sjh 1 year ago
parent
commit
4f2f82a4d6
  1. 114
      src/api/outrequest.ts
  2. 2
      src/api/request.ts
  3. 99
      src/api/screen/jwpy.ts
  4. 12
      src/api/work/alarm.ts
  5. 194
      src/views/datav/Gobal.vue
  6. 468
      src/views/datav/Jwpy.vue
  7. 534
      src/views/sensitivePerception/ModelClue.vue
  8. 227
      src/views/work/Alarm.vue
  9. 8
      vite.config.ts

114
src/api/outrequest.ts

@ -0,0 +1,114 @@
import { getToken, deleteToken } from '@/utils/token'
import feedback from '@/utils/feedback'
export const BASE_PATH = ''
type Options = {
url: string,
method?: 'GET' | 'POST' | 'PUT' | 'DELETE',
headers?: Record<string, string>,
query?: Record<string, any>,
params?: Record<string, any>,
body?: string | FormData | Record<string, any>,
showErrorMsg: bool
};
function get(options: Options) {
options.method = 'GET';
return ajax(options.url, options)
}
function post(options: Options) {
options.method = 'POST';
return ajax(options.url, options)
}
function put(options: Options) {
options.method = 'PUT';
return ajax(options.url, options)
}
function del(options: Options) {
options.method = 'DELETE';
return ajax(options.url, options)
}
let isRelogin = false;
function ajax(url: string, options: Options) {
const headers: Record<string, string> = {
"Authorization": getToken()
};
let body: string | FormData;
if (options?.params && Object.keys(options.params).length > 0) {
if (options.method === 'GET') {
options.query = options.params;
} else {
body = JSON.stringify(options.params);
}
}
if (options?.query) {
// 解决 query 的值为 undefined 的情况
if (options.query instanceof Object) {
const params = {}
for (let k of Object.keys(options.query)) {
if (options.query[k] === undefined || options.query[k] === null) {
continue;
}
params[k] = options.query[k]
}
url += (url.indexOf('?') > -1 ? '&' : '?') + new URLSearchParams(params).toString();
} else {
url += (url.indexOf('?') > -1 ? '&' : '?') + new URLSearchParams(options.query).toString();
}
}
if (options?.body) {
if (options.body instanceof FormData) {
body = options.body;
} else {
headers["Content-Type"] = "application/json"
if (options.body instanceof String) {
body = options.body;
}
if (options.body instanceof Array || (options.body instanceof Object && Object.keys(options.body).length > 0)) {
body = JSON.stringify(options.body);
}
}
}
return new Promise((resolve, reject) => {
fetch(`${BASE_PATH}${url}`, {
method: options.method,
body: body,
headers: { ...headers, ...options.headers }
}).then(response => {
if (response.status === 413) {
return;
}
return response.json();
}).then(res => {
if (res.code === 200 || res.httpStatusCode===0) {
resolve(res.data)
} else {
let message = res.message;
if (res.code === 401) {
deleteToken()
location.href = '/'
}
feedback.msgError(message)
reject(res)
}
})
})
}
const outrequest = {
get,
post,
put,
del
}
export default outrequest;

2
src/api/request.ts

@ -88,7 +88,7 @@ function ajax(url: string, options: Options) {
}
return response.json();
}).then(res => {
if (res.code === 200) {
if (res.code === 200 || res.httpStatusCode===0) {
resolve(res.data)
} else {
let message = res.message;

99
src/api/screen/jwpy.ts

@ -0,0 +1,99 @@
import outrequest from "../outrequest";
export function GetDCQK() {
let formData = new FormData();
formData.append("PeriodId", 6);
formData.append("PeriodSonID", -1);
formData.append("OrgNo", 4301);
formData.append("TaskID", 2);
return outrequest.post({
url: `/out-police-service/api/DSJ/GetDCQK`,
body: formData
});
}
export function GetBMYYBQS() {
let formData = new FormData();
formData.append("PeriodId", 6);
formData.append("PeriodSonID", -1);
formData.append("OrgNo", 4301);
formData.append("TaskID", 2);
return outrequest.post({
url: `/out-police-service/api/DSJ/GetBMYYBQS`,
body: formData
});
}
export function GetZHMYLPM() {
let formData = new FormData();
formData.append("PeriodId", 6);
formData.append("PeriodSonID", -1);
formData.append("OrgNo", 4301);
formData.append("TaskID", 2);
return outrequest.post({
url: `/out-police-service/api/DSJ/GetZHMYLPM`,
body: formData
});
}
export function GetRCSQQK() {
let formData = new FormData();
formData.append("PeriodId", 6);
formData.append("PeriodSonID", -1);
formData.append("OrgNo", 4301);
formData.append("TaskID", 2);
return outrequest.post({
url: `/out-police-service/api/DSJ/GetRCSQQK`,
body: formData
});
}
export function GetDXFX() {
let formData = new FormData();
formData.append("PeriodId", 6);
formData.append("PeriodSonID", -1);
formData.append("OrgNo", 4301);
formData.append("TaskID", 2);
return outrequest.post({
url: `/out-police-service/api/DSJ/GetDXFX`,
body: formData
});
}
export function GetZRSJXF() {
let formData = new FormData();
formData.append("PeriodId", 6);
formData.append("PeriodSonID", -1);
formData.append("OrgNo", 4301);
formData.append("TaskID", 2);
return outrequest.post({
url: `/out-police-service/api/DSJ/GetZRSJXF`,
body: formData
});
}
export function GetGLFW() {
let formData = new FormData();
formData.append("PeriodId", 6);
formData.append("PeriodSonID", -1);
formData.append("OrgNo", 4301);
formData.append("TaskID", 2);
return outrequest.post({
url: `/out-police-service/api/DSJ/GetGLFW`,
body: formData
});
}
export function GetDITU() {
let formData = new FormData();
formData.append("PeriodId", 6);
formData.append("PeriodSonID", -1);
formData.append("OrgNo", 4301);
formData.append("TaskID", 2);
return outrequest.post({
url: `/out-police-service/api/DSJ/GetDITU`,
body: formData
});
}

12
src/api/work/alarm.ts

@ -21,3 +21,15 @@ export function alarmNotificationCommit(data) {
});
}
export function alarmFiles(id) {
return request.get({
url: `/alarm/notification/files?alarmId=${id}`
});
}
export function alarmDetails(id) {
return request.get({
url: `/alarm/notification/details?alarmId=${id}`
});
}

194
src/views/datav/Gobal.vue

@ -155,7 +155,7 @@ const ywzblist = ref([]); // 业务类型占比
const wtlxlist = ref([]); //
const tcwtlist = ref([]); //
const mapData = ref([]); //
let gobalTempMapVoList = [
let gobalTempMapVoList = ref([
{
"name": "天心分局",
"totalPro": 11,
@ -165,106 +165,11 @@ let gobalTempMapVoList = [
"policePro": 11,
"reviewPro": 11
}
]; //
]); //
// endregion
const router = useRouter();
// region
echarts.registerMap("changsha", changshaMap);
const option = ref({
geo: {
map: "changsha",
},
tooltip: {
trigger: 'item',
formatter: function (params) {
console.log(params)
const dataItem = gobalTempMapVoList.find(item => item.name.includes(params.name.substring(0, 2)));
if (dataItem) {
return `
<div class="tooltip">
<div class="tooltip-title">${dataItem.name}</div>
<div class="tooltip-content">
<ul class="tooltip-ul" >
<li>问题总数 <span>${dataItem.totalPro}</span></li>
<li>督察问题 <span>${dataItem.supervisePro}</span></li>
<li>案件核查问题 <span>${dataItem.caseVerifyPro}</span></li>
<li>信访投诉问题 <span>${dataItem.mailPro}</span></li>
<li>民意感知问题 <span>${dataItem.policePro}</span></li>
</ul>
</div>
</div>`;
} else {
return `<div class="tooltip">
<div class="tooltip-title">${dataItem.name}</div>
<div class="tooltip-content">
<ul class="tooltip-ul"">
<li>问题总数 <span>0</span></li>
<li>督察问题 <span>0</span></li>
<li>案件核查问题 <span>0</span></li>
<li>信访投诉问题 <span>0</span></li>
<li>民意感知问题 <span>0</span></li>
</ul>
</div>
</div>`;
}
},
// backgroundColor: "#031577", //
// borderColor: "#0A2F86",
// borderWidth: 0, // 1
// borderRadius: 3, // 3
// shadowBlur: 0, // 8
// shadowOffsetX: 0, // 0
// shadowOffsetY: 0, // 6
},
visualMap: {
type: "piecewise",
bottom: 10,
pieces: [
{ min: 0, max: 500, label: "问题数低于500" }, { min: 501, max: 1000, label: "问题数介于500-1000" }, { min: 1001, label: "问题数高于1000" },
],
right: 10,
realtime: false,
orient: "horizontal",
textStyle: {
color: "#fff",
},
calculable: true,
inRange: {
color: ["#4987F6", "#F6A149", "#D34343",],
},
},
series: [
{
name: "长沙",
type: "map",
map: "changsha",
hoverAnimation: true,
label: {
show: true,
color: "white",
},
itemStyle: {
normal: {
areaColor: "#02215E",
borderColor: "#1773c3",
},
},
emphasis: {
areaColor: "#FFD700", //
borderColor: "#FF0000", //
borderWidth: 4 //
},
data: gobalTempMapVoList.map(item => ({
name: item.name,
value: item.totalPro // totalPro value
}))
}
],
})
// endregion
// region线
@ -410,7 +315,7 @@ function getData() {
});
getAllGobalCount(time.value).then((res) => {
overview.value = res.overview;
gobalTempMapVoList = res.gobalTempMapVoList;
gobalTempMapVoList.value = res.gobalTempMapVoList;
});
getGobalRecentlyTrendByMonth(new Date().getFullYear()).then((res) => {
proTrend.value.xAxis.data = res.monthList;
@ -430,6 +335,7 @@ onMounted(() => {
watch(time, () => {
getData();
});
// endregion
const colors = [
{
@ -447,6 +353,98 @@ const colors = [
];
// region
echarts.registerMap("changsha", changshaMap);
const option = ref({
geo: {
map: "changsha",
},
tooltip: {
trigger: 'item',
formatter: function (params) {
// console.log(gobalTempMapVoList.value)
const dataItem = gobalTempMapVoList.value.find(item => item.name.includes(params.name.substring(0, 2)));
// console.log(dataItem.name)
if (dataItem) {
return `
<div class="tooltip">
<div class="tooltip-title">${dataItem.name}</div>
<div class="tooltip-content">
<ul class="tooltip-ul" >
<li>问题总数 <span>${dataItem.totalPro}</span></li>
<li>督察问题 <span>${dataItem.supervisePro}</span></li>
<li>案件核查问题 <span>${dataItem.caseVerifyPro}</span></li>
<li>信访投诉问题 <span>${dataItem.mailPro}</span></li>
<li>民意感知问题 <span>${dataItem.policePro}</span></li>
</ul>
</div>
</div>`;
} else {
return `<div class="tooltip">
<div class="tooltip-title">${dataItem.name}</div>
<div class="tooltip-content">
<ul class="tooltip-ul"">
<li>问题总数 <span>0</span></li>
<li>督察问题 <span>0</span></li>
<li>案件核查问题 <span>0</span></li>
<li>信访投诉问题 <span>0</span></li>
<li>民意感知问题 <span>0</span></li>
</ul>
</div>
</div>`;
}
},
},
visualMap: {
type: "piecewise",
bottom: 10,
pieces: [
{ min: 0, max: 500, label: "问题数低于500", color:"#F6A149" },
{ min: 501, max: 1000, label: "问题数介于500-1000", color:"#F6A149"},
{ min: 1001, label: "问题数高于1000" , color:"#D34343"},
],
right: 10,
realtime: false,
orient: "horizontal",
textStyle: {
color: "#fff",
},
calculable: true,
},
series: [
{
name: "长沙",
type: "map",
map: "changsha",
hoverAnimation: true,
label: {
show: true,
color: "white",
},
itemStyle: {
normal: {
areaColor: "#02215E",
borderColor: "#1773c3",
},
},
emphasis: {
areaColor: "#FFD700", //
borderColor: "#FF0000", //
borderWidth: 4 //
},
data: gobalTempMapVoList.value.map(item => {
const data = {
name: item.name,
value: item.totalPro,
};
console.log(item.totalPro); //
return data;
})
}
],
})
// endregion

468
src/views/datav/Jwpy.vue

@ -10,7 +10,7 @@
<el-col :span="5">
<div class="descriptions_cell text-center margin-top-30">
<div class="descriptions_content">
{{ reviewOk.State2 }}
{{ reviewOk[0].State2 }}
</div>
<div class="descriptions_label">
调查总量
@ -20,7 +20,7 @@
<el-col :span="5">
<div class="descriptions_cell text-center margin-top-30">
<div class="descriptions_content">
{{ reviewOk.State3 }}
{{ reviewOk[0].State3 }}
</div>
<div class="descriptions_label">
有效回复
@ -30,7 +30,7 @@
<el-col :span="5">
<div class="descriptions_cell text-center margin-top-30">
<div class="descriptions_content">
{{ reviewOk.State3 - reviewOk.bmys }}
{{ reviewOk[0].State3 - reviewOk[0].bmys }}
</div>
<div class="descriptions_label">
满意
@ -50,7 +50,7 @@
<el-col :span="4">
<div class="descriptions_cell text-center margin-top-30">
<div class="descriptions_content">
{{ reviewOk.bmys }}
{{ reviewOk[0].bmys }}
</div>
<div class="descriptions_label">
不满意数
@ -66,7 +66,7 @@
<el-col>
<div class="descriptions_cell text-center height-118">
<div class="descriptions_content margin-top-30 ">
{{ reviewOk.bmys }}
{{ dcmyd.length > 0 && dcmyd[2] && dcmyd[2].FinalRP !== undefined ? dcmyd[2].FinalRP : '0' }}
</div>
<div class="descriptions_label">
上期满意度
@ -74,7 +74,7 @@
</div>
<div class="descriptions_cell text-center height-118">
<div class="descriptions_content">
{{ reviewOk.bmys }}
{{ dcmyd.length > 0 && dcmyd[0] && dcmyd[0].FinalRP !== undefined ? dcmyd[0].FinalRP : '0' }}
</div>
<div class="descriptions_label">
当前调查满意度
@ -88,7 +88,6 @@
:option="option1"
autoresize
/>
</el-main>
</el-container>
</div>
@ -103,15 +102,19 @@
:style="{ width: '100%', marginTop: '20px', fontSize: fontSize + 'px' }"
:header-cell-style="headerCellStyle"
:row-style="tableRowStyle"
:show-summary='true'
:highlight-current-row="false"
>
<el-table-column prop="id" label="单项业务"/>
<el-table-column prop="name" label="有效数"/>
<el-table-column prop="amount1" label="基本满意数"/>
<el-table-column prop="amount2" label="不满意数"/>
<el-table-column prop="amount3" label="满意率"/>
<el-table-column prop="amount3" label="同比"/>
<el-table-column prop="Name" label="单项业务" width="82px"/>
<el-table-column prop="sdcl" label="有效数" width="72px"/>
<el-table-column label="基本满意数" width="72px">
<template v-slot="scope">
<span>{{ calculateSatisfaction(scope.row) }}</span>
</template>
</el-table-column>
<el-table-column prop="sbmys" label="不满意数" width="72px"/>
<el-table-column prop="smyl" label="满意率" width="72px"/>
<el-table-column prop="smyltb" label="同比" width="86px"/>
</el-table>
</div>
</el-col>
@ -137,10 +140,70 @@
<el-container>
<el-container>
<el-header>Header</el-header>
<el-main>Main</el-main>
<el-header>
<div style="background-color:#04144E; ">
<el-table
:data="tableData1"
height="106"
:summary-cell-style="summaryCellStyle"
:summary-method="getSummaries"
:style="{ width: '100%', marginTop: '20px', fontSize: fontSize + 'px' }"
:header-cell-style="headerCellStyle"
:row-style="tableRowStyle"
:show-summary='false'
:highlight-current-row='false'
>
<el-table-column prop="SetName" label="排名" width="76"/>
<el-table-column prop="OrganizeName" label="市州考评" width="149"/>
<el-table-column prop="FinalRP" label="滿意度" width="65"/>
<el-table-column prop="TBRp" label="上期满意度" width="65"/>
<el-table-column prop="TBRpts" label="同比上期" width="65"/>
</el-table>
</div>
</el-header>
<el-main>
<div style="background-color:#04144E; ">
<el-table
:data="tableData2"
height="215"
:summary-cell-style="summaryCellStyle"
:summary-method="getSummaries"
:style="{ width: '100%', marginTop: '70px', fontSize: fontSize + 'px' }"
:header-cell-style="headerCellStyle"
:row-style="tableRowStyle"
:show-summary='false'
:highlight-current-row='false'
>
<el-table-column prop="MydRanking" label="排名"/>
<el-table-column prop="OrganizeName" label="县市考评"/>
<el-table-column prop="FinalRP" label="滿意度"/>
<el-table-column prop="TBRp" label="上期满意度"/>
<el-table-column prop="TBRpts" label="同比上期"/>
</el-table>
</div>
</el-main>
</el-container>
<el-aside width="445px">Aside</el-aside>
<el-aside width="445px">
<div style="background-color:#04144E; height: 360px ">
<el-table
:data="tableData3"
height="360"
:summary-cell-style="summaryCellStyle"
:summary-method="getSummaries"
:style="{ width: '100%', marginTop: '20px', fontSize: fontSize + 'px' }"
:header-cell-style="headerCellStyle"
:row-style="tableRowStyle"
:show-summary='false'
>
<el-table-column prop="MydRanking" label="排名"/>
<el-table-column prop="OrganizeName" label="区"/>
<el-table-column prop="FinalRP" label="滿意度"/>
<el-table-column prop="TBRp" label="上期满意度"/>
<el-table-column prop="TBRpts" label="同比上期"/>
</el-table>
</div>
</el-aside>
</el-container>
</div>
</datav-card>
@ -165,7 +228,25 @@
/>
</div>
</datav-card>
<datav-card title="单项调查情况"></datav-card>
<div style="background-color:#04144E; ">
<h3 style="color: white">单项调查情况 <span style="font-size: 14px; color: #597AE9">昨日数据下发</span>
</h3>
<el-table
:data="tableData4"
height="300"
:summary-cell-style="summaryCellStyle"
:summary-method="getSummaries"
:style="{ width: '100%', marginTop: '20px', fontSize: fontSize + 'px' }"
:header-cell-style="headerCellStyle"
:row-style="tableRowStyle"
:show-summary='true'
>
<el-table-column prop="Name" label="单项业务"/>
<el-table-column prop="sdcl" label="有效数"/>
<el-table-column prop="bmyzs" label="省不满意数"/>
<el-table-column prop="LastDayQACount" label="新增调查数"/>
</el-table>
</div>
</el-col>
</el-row>
@ -180,8 +261,21 @@
import vCharts from "vue-echarts";
import changshaMap from "@/assets/data/changsha.json";
import * as echarts from "echarts/core";
import {getMailVisitsData, getRecentlyMailTrend, getRecentlyMailTrend12337} from "@/api/datav";
import moment from "moment/moment.js";
import {GetBMYYBQS, GetDCQK, GetDITU, GetDXFX, GetGLFW, GetRCSQQK, GetZHMYLPM, GetZRSJXF} from "@/api/screen/jwpy.ts";
// region
//
const reviewOk = ref([{}]);
// 滿
const dcmyd = ref([]);
// endregion
// region
const bmyybqs = ref([]);
const dxfx = ref([]);
// endregion
echarts.registerMap("changsha", changshaMap);
let mapDataList = reactive([
@ -271,21 +365,12 @@ const option = {
data: mapDataList,
},
],
};
const option1 = {
const option1 = ref({
xAxis: {
type: "category",
boundaryGap: false,
data: [
"9/10",
"9/11",
"9/12",
"9/13",
"9/13",
"9/13",
],
data: [],
},
yAxis: {
type: "value",
@ -328,19 +413,12 @@ const option1 = {
},
]),
},
data: [
100,
25,
50,
70,
10,
10,
],
data: [],
},
],
grid: {left: '10%', right: '10%', top: '10%', bottom: '20%', containLabel: true},
}
const option2 = {
})
const option2 = ref({
xAxis: {
type: "category",
boundaryGap: false,
@ -402,46 +480,156 @@ const option2 = {
},
],
grid: {left: '10%', right: '10%', top: '10%', bottom: '20%', containLabel: true},
}
const option3 = {
title: {text: '柱状图示例'},
})
const option3 = ref({
tooltip: {},
legend: {data: ['销量']},
legend: {
data: ['本期', '上一期', '去年同期'],
textStyle: {
color: '#fff',
},
},
grid: {
left: '10%',
right: '10%', top: '10%', bottom: '10%'
},
xAxis: {type: 'category', data: ['衬衫', '羊毛衫', '雪纺衫', '裤子', '高跟鞋', '袜子']},
yAxis: {type: 'value'},
series: [{
name: '销量',
type: 'bar',
data: [5, 20, 36, 10, 10, 20],
itemStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
offset: 0,
color: 'rgba(109, 221, 159, 0.47)'
}, {offset: 1, color: 'rgba(109, 221, 159, 0)'}])
xAxis: {
type: 'category',
data: []
},
yAxis: {
type: 'value'
},
series: [
{
name: '本期',
type: 'bar',
data: [],
itemStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
offset: 0,
color: 'rgba(40,230,255,0.63)'
}, {offset: 1, color: 'rgba(40,230,255,0)'}])
},
},
{
name: '上一期',
type: 'bar',
data: [],
itemStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1,
[{offset: 0, color: 'rgba(255,218,51,0.52)'},
{offset: 1, color: 'rgba(255,219,49,0)'}])
}
},
{
name: '去年同期',
type: 'line',
data: [],
itemStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
offset: 0,
color: '#6FDBA0'
}, {offset: 1, color: '#6FDBA0'}])
}
}
}]
};
]
});
// region
const tableData = ref([])
const tableData1 = ref([])
const tableData2 = ref([])
const tableData3 = ref([])
const tableData4 = ref([])
// endregion
onMounted(() => {
getData();
});
function getData() {
//
GetDCQK().then((res) => {
console.log("GetDCQK ==== " + res)
reviewOk.value = res
});
//
GetGLFW().then((res) => {
dcmyd.value = res
option1.value.xAxis.data = dcmyd.value[0].lstson.map(item => item.SonPeriodName);
option1.value.series[0].data = dcmyd.value[0].lstson.map(item => item.FinalRP);
});
//
GetZRSJXF().then((res) => {
let temp = res.lstCity
temp= temp.filter(item => item.Name === null);
tableData.value = temp
});
//
GetZHMYLPM().then((res) => {
tableData1.value = res[0].lstCity
let temp = res[0].lstSheng;
const group2 = temp.filter(item => item.SetName === "(省)县市考评");
const group3 = temp.filter(item => item.SetName === "(省)区");
tableData2.value = group2
tableData3.value = group3
});
//
GetBMYYBQS().then((res) => {
console.log("GetBMYYBQS ==== " + res)
bmyybqs.value = res;
option2.value.xAxis.data = bmyybqs.value.map(item => item.SonPeriodName);
option2.value.series[0].data = bmyybqs.value.map(item => item.QACount);
});
//
GetDXFX().then((res) => {
console.log("GetDXFX ==== " + res)
dxfx.value = res;
option3.value.xAxis.data = dxfx.value[0].lstson.map(item => item.MasterName);
option3.value.series[0].data = dxfx.value[0].lstson.map(item => item.FinalRP);
option3.value.series[1].data = dxfx.value[1].lstson.map(item => item.FinalRP);
option3.value.series[2].data = dxfx.value[2].lstson.map(item => item.FinalRP);
});
GetRCSQQK().then((res) => {
let text = res
text = text.filter(item => item.Name !== null)
tableData4.value = text
});
// GetZRSJXF().then((res) => { });
// GetDITU().then((res) => { });
}
// region
const fontSize = ref(11)
const headerCellStyle = ref({
fontSize: '11px', /* 设置表头字体大小 */
color: '#24D2EE', /* 设置表头字体颜色 */
backgroundColor: '#04144E', /* 设置表头背景颜色 */
height: '15px', /* 设置表头高度 */
height: '60px', /* 设置表头高度 */
padding: '0 0 0 0', /* 设置表头内边距 */
lineHeight: '60px',
});
const tableRowStyle = (row) => {
return {
backgroundColor: '#04144E',
color: "#FFFFFF"
};
};
//
const summaryCellStyle = () => {
return {
@ -449,8 +637,6 @@ const summaryCellStyle = () => {
color: "#FFFFFF"
};
};
//
const getSummaries = (param) => {
const {columns, data} = param;
@ -478,139 +664,33 @@ const getSummaries = (param) => {
return sums;
};
// region
const overview = ref({
total: 0,
countryMail: 0,
policeMail: 0,
commissionerMail: 0,
numMail: 0,
});
const reviewOk = ref({
State2: 164279,
State3: 104659,
bmys: "1615",
dczl: 392902,
jtl: "68.45%",
yxhf: "104659",
yxl: "38.92%"
});
// endregion
// region 滿
const calculateSatisfaction = (row) => {
const validCount = row.sdcl || 0 //
const dissatisfiedCount = row.sbmys || 0 //
return validCount - dissatisfiedCount //
}
// endregion
</script>
/**
* 初始化
*/
let timer;
const time = ref([
moment().startOf("year").format("YYYY-MM-DD"),
moment().format("YYYY-MM-DD"),
]);
const currentYear = new Date().getFullYear();
function initRecentlyMailTrend() {
getRecentlyMailTrend({
sourcesCode: "1",
year: currentYear,
startTime: time.value[0],
endTime: time.value[1]
}).then((data) => {
// xAxis series
// option1.value.xAxis.data = data.monthList;
// option1.value.series[0].data = data.totalList;
});
}
watch(time, () => {
getData();
// initRecentlyMailTrend()
})
onMounted(() => {
getData();
initRecentlyMailTrend();
<style lang="scss" scoped>
@import "@/style/datav.scss";
});
:deep() {
.el-table__footer-wrapper tfoot td.el-table__cell {
background-color: #09256D;
}
function getData() {
getMailVisitsData(time.value).then((data) => {
// overview.value = data.overview;
.el-scrollbar__wrap--hidden-default {
background-color: #03154D;
}
});
.el-table .cell {
padding: 0;
text-align: center;
}
}
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,
},
];
const tableData = [
{
id: '12987122',
name: 'Tom',
amount1: '234',
amount2: '3.2',
amount3: 10,
}, {
id: '12987122',
name: 'Tom',
amount1: '234',
amount2: '3.2',
amount3: 10,
}, {
id: '12987122',
name: 'Tom',
amount1: '234',
amount2: '3.2',
amount3: 10,
}, {
id: '12987122',
name: 'Tom',
amount1: '234',
amount2: '3.2',
amount3: 10,
}, {
id: '12987122',
name: 'Tom',
amount1: '234',
amount2: '3.2',
amount3: 10,
}, {
id: '12987122',
name: 'Tom',
amount1: '234',
amount2: '3.2',
amount3: 10,
}, {
id: '12987122',
name: 'Tom',
amount1: '234',
amount2: '3.2',
amount3: 10,
},
]
</script>
<style lang="scss" scoped>
@import "@/style/datav.scss";
.dropdown-container {
position: absolute;
right: 30px;
@ -639,7 +719,7 @@ const tableData = [
}
.custom-footer-row {
background-color:#FB3131;
background-color: #FB3131;
font-weight: bold;
color: #333;
}
@ -650,8 +730,16 @@ const tableData = [
}
h3 span {
float: right;
}
h3 {
line-height: 50px;
margin-top: 10px;
margin-bottom: 0px;
}
</style>

534
src/views/sensitivePerception/ModelClue.vue

@ -1,221 +1,327 @@
<template>
<div class="container h100">
<el-row :gutter="20" class="h100">
<el-col :span="6" class="h100">
<model-tree v-model="query.modelIds" />
</el-col>
<el-col :span="18">
<header>
<el-form :label-width="140">
<el-row>
<el-col :span="8">
<el-form-item label="预警时间">
<date-time-range-picker-ext
v-model="query.createTime"
/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="涉及单位">
<depart-tree-select
v-model="query.involveDepartId"
:check-strictly="false"
/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="预警内容">
<el-input
placeholder="请输入"
v-model="query.thingDesc"
clearable
/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="分发状态">
<el-select
v-model="query.distributionState"
clearable
>
<el-option
v-for="item in dict.distributionState"
:label="item.dictLabel"
:value="item.dictValue"
/>
</el-select>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div class="flex end mb-20">
<div>
<el-button type="primary" @click="getList">
<template #icon>
<icon name="el-icon-Search" />
</template>
查询</el-button
>
<el-button @click="reset">重置</el-button>
</div>
</div>
</header>
<div class="table-container">
<el-table :data="list">
<el-table-column
label="预警时间"
prop="createTime"
width="150"
/>
<!-- <el-table-column-->
<!-- label="预警模型"-->
<!-- prop="modelName"-->
<!-- width="160"-->
<!-- show-overflow-tooltip-->
<!-- />-->
<el-table-column
label="涉及单位"
show-overflow-tooltip
width="200"
>
<template #default="{ row }">
<span>{{ row.involveParentDepartName }}</span><span v-if="row.involveDepartName"><br>{{ row.involveDepartName }}</span>
</template>
</el-table-column>
<el-table-column
label="涉及人员"
prop="involvePoliceName"
width="100"
>
<template #default="{ row }">
<div v-if="row.involvePoliceName">
<div v-for="item in row.involvePoliceName.split(' ')" class="text-nowrap">{{
item }}</div>
</div>
<div v-else></div>
</template>
</el-table-column>
<el-table-column
label="预警内容"
prop="thingDesc"
show-overflow-tooltip
/>
<el-table-column
label="分发状态"
align="center"
width="120"
>
<template #default="{ row }">
<div class="container h100">
<el-row :gutter="20" class="h100">
<el-col :span="6" class="h100">
<model-tree v-model="query.modelIds"/>
</el-col>
<el-col :span="18">
<header>
<el-form :label-width="140">
<el-row>
<el-col :span="8">
<el-form-item label="预警时间">
<date-time-range-picker-ext
v-model="query.createTime"
/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="涉及单位">
<depart-tree-select
v-model="query.involveDepartId"
:check-strictly="false"
/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="预警内容">
<el-input
placeholder="请输入"
v-model="query.thingDesc"
clearable
/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="分发状态">
<el-select
v-model="query.distributionState"
clearable
>
<el-option
v-for="item in dict.distributionState"
:label="item.dictLabel"
:value="item.dictValue"
/>
</el-select>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div class="flex end mb-20">
<div>
<el-button type="primary" @click="getList">
<template #icon>
<icon name="el-icon-Search"/>
</template>
查询
</el-button
>
<el-button @click="reset">重置</el-button>
</div>
</div>
</header>
<div class="table-container">
<el-table :data="list">
<el-table-column
label="预警时间"
prop="createTime"
width="150"
/>
<!-- <el-table-column-->
<!-- label="预警模型"-->
<!-- prop="modelName"-->
<!-- width="160"-->
<!-- show-overflow-tooltip-->
<!-- />-->
<el-table-column
label="涉及单位"
show-overflow-tooltip
width="200"
>
<template #default="{ row }">
<span>{{ row.involveParentDepartName }}</span><span
v-if="row.involveDepartName"><br>{{ row.involveDepartName }}</span>
</template>
</el-table-column>
<el-table-column
label="涉及人员"
prop="involvePoliceName"
width="100"
>
<template #default="{ row }">
<div v-if="row.involvePoliceName">
<div v-for="item in row.involvePoliceName.split(' ')" class="text-nowrap">{{
item
}}
</div>
</div>
<div v-else></div>
</template>
</el-table-column>
<el-table-column
label="预警内容"
prop="thingDesc"
show-overflow-tooltip
/>
<el-table-column
label="分发状态"
align="center"
width="120"
>
<template #default="{ row }">
<span>{{
getDictLable(
dict.distributionState,
row.distributionState
)
}}</span>
</template>
</el-table-column>
<el-table-column label="操作" width="180">
<template #default="{ row }">
<el-button
type="primary"
link
@click="handleShowDetail(row)"
>查看详情</el-button
>
<el-button
v-if="row.negativeId"
type="primary"
link
@click="handleAction(row)"
>处理详情</el-button
>
</template>
</el-table-column>
</el-table>
</div>
<div class="flex end mt-8">
<el-pagination
@size-change="getList"
@current-change="getList"
:current-page="query.current"
:page-sizes="[9, 18, 36]"
v-model:page-size="query.size"
v-model:current-page="query.current"
layout="total, sizes, prev, pager, next"
:total="total"
v-if="list.length"
>
</el-pagination>
</div>
</el-col>
</el-row>
</div>
}}</span>
</template>
</el-table-column>
<el-table-column label="操作" width="180">
<template #default="{ row }">
<el-button
type="primary"
link
@click="handleShowDetail(row)"
>查看详情
</el-button
>
<el-button
v-if="row.negativeId"
type="primary"
link
@click="handleAction(row)"
>处理详情
</el-button
>
<el-button
type="primary"
link
v-if="row.notificationId"
@click="handleClue(row)"
>查看提醒
</el-button
>
</template>
</el-table-column>
</el-table>
</div>
<div class="flex end mt-8">
<el-pagination
@size-change="getList"
@current-change="getList"
:current-page="query.current"
:page-sizes="[9, 18, 36]"
v-model:page-size="query.size"
v-model:current-page="query.current"
layout="total, sizes, prev, pager, next"
:total="total"
v-if="list.length"
>
</el-pagination>
</div>
</el-col>
</el-row>
</div>
<el-dialog title="预警线索数据详情" v-model="show" width="80vw">
<div class="dialog-container">
<div class="row mt-10">
<div class="col col-6">
<label>预警时间</label>
<span>{{ activeModelClue.createTime }}</span>
</div>
<div class="col col-6">
<label>预警模型</label>
<span>{{ activeModelClue.modelName }}</span>
</div>
<div class="col col-6">
<label>涉及单位</label>
<span>
<span>{{ activeModelClue.involveParentDepartName }}</span><span>{{ activeModelClue.involveDepartName ? '/' + activeModelClue.involveDepartName : '' }}</span>
<el-dialog title="预警线索数据详情" v-model="show" width="80vw">
<div class="dialog-container">
<div class="row mt-10">
<div class="col col-6">
<label>预警时间</label>
<span>{{ activeModelClue.createTime }}</span>
</div>
<div class="col col-6">
<label>预警模型</label>
<span>{{ activeModelClue.modelName }}</span>
</div>
<div class="col col-6">
<label>涉及单位</label>
<span>
<span>{{
activeModelClue.involveParentDepartName
}}</span><span>{{
activeModelClue.involveDepartName ? '/' + activeModelClue.involveDepartName : ''
}}</span>
</span>
</div>
<div class="col col-6">
<label>涉及人员</label>
<span>{{ activeModelClue.involvePoliceName }}</span>
</div>
</div>
<div class="row mt-10">
<div class="col col-24">
<label>预警内容</label>
<span>{{ activeModelClue.thingDesc }}</span>
</div>
</div>
<div class="row mt-10">
<div class="col col-6">
<label>分发状态</label>
<span>{{
getDictLable(
dict.distributionState,
activeModelClue.distributionState
)
}}</span>
</div>
</div>
<h3>详细信息</h3>
<div style="min-height: 200px">
<el-empty description="无数据" />
</div>
</div>
</el-dialog>
<div class="col col-6">
<label>涉及人员</label>
<span>{{ activeModelClue.involvePoliceName }}</span>
</div>
</div>
<div class="row mt-10">
<div class="col col-24">
<label>预警内容</label>
<span>{{ activeModelClue.thingDesc }}</span>
</div>
</div>
<div class="row mt-10">
<div class="col col-6">
<label>分发状态</label>
<span>{{
getDictLable(
dict.distributionState,
activeModelClue.distributionState
)
}}</span>
</div>
</div>
<h3>详细信息</h3>
<div style="min-height: 200px">
<el-empty description="无数据"/>
</div>
</div>
</el-dialog>
<negative-dialog
v-model="negativeShow"
:id="activeNegativeId"
@close="negativeShow = false"
/>
<el-dialog
title="查看详情"
v-model="dialogShow"
width="800"
>
<el-form :model="showData" :label-width="120" ref="fomrRef">
<el-row>
<el-col :span="12">
<el-form-item
label="提醒类型"
>
<div>{{ showData.alarmType }}</div>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item
label="提醒时间"
>
<el-text>{{ showData.alarmTime }}</el-text>
</el-form-item>
</el-col>
</el-row>
<el-row style="margin-top: 5px;">
<el-col :span="12">
<el-form-item
label="被通知单位"
>
<el-text>{{ showData.notificationDepartName }}</el-text>
</el-form-item>
</el-col>
<el-col :span="12" v-if="showData.policeName != undefined">
<el-form-item
label="被通知民警"
>
<el-text>{{ showData.policeName }}</el-text>
</el-form-item>
</el-col>
</el-row>
<el-row style="margin-top: 5px;">
<el-form-item
label="提醒内容"
>
<el-text style="width: 588px;">{{ showData.alarmContent }}</el-text>
</el-form-item>
</el-row>
<el-row style="margin-top: 5px;" v-if="showData.replyState == 1">
<el-form-item
label="回复内容"
>
<el-text style="width: 588px;">{{ showData.replyResultContent }}</el-text>
</el-form-item>
</el-row>
<el-row style="margin-top: 10px;" v-if="showData.files != undefined && showData.files.length > 0">
<el-form-item
label="问题附件"
>
<div v-for="(item, index) in showData.files" :key="index" style="margin-top: 10px;">
<el-image :preview-src-list="previewList" style="width: 100px; height: 100px;margin-right: 8px"
:initial-index="index" :src="item.path" fit="cover"
:hide-on-click-modal="true" :lazy="true" :z-index="index"/>
</div>
</el-form-item>
</el-row>
</el-form>
<footer class="flex end">
<el-button @click="dialogShow = false">关闭</el-button>
</footer>
</el-dialog>
<negative-dialog
v-model="negativeShow"
:id="activeNegativeId"
@close="negativeShow = false"
/>
</template>
<script lang="ts" setup>
import { listModelClue } from "@/api/sensitivePerception/modelClue";
import {listModelClue} from "@/api/sensitivePerception/modelClue";
import {alarmDetails} from "@/api/work/alarm"
import useCatchStore from "@/stores/modules/catch";
import { getDictLable } from "@/utils/util";
import {getDictLable} from "@/utils/util";
const catchStore = useCatchStore();
const dict = catchStore.getDicts(["distributionState","handleState"]);
const dict = catchStore.getDicts(["distributionState", "handleState"]);
const query = ref({});
const list = ref([]);
const total = ref(0);
let showData = ref({})
let dialogShow = ref(false)
let previewList = ref([])
const handleClue = (row) => {
alarmDetails(row.notificationId).then(res => {
showData.value = res
let arr = []
if(res.files != undefined) {
res.files.forEach(item => {
arr.push(item.path)
})
}
previewList.value = arr
dialogShow.value = true
})
}
onMounted(() => {
if (route.query.modelId) {
query.value.modelIds = [route.query.modelId];
@ -227,47 +333,47 @@ const route = useRoute();
watch(
() => route.query.modelId,
(val) => {
query.value.modelIds = [val];
query.value.modelIds = [val];
}
);
watch(
() => query.value.modelIds,
(newVal, oldVal) => {
if (newVal !== oldVal) {
query.value.current = 1;
getList();
}
if (newVal !== oldVal) {
query.value.current = 1;
getList();
}
}
);
function getList() {
listModelClue(query.value).then((data) => {
list.value = data.records;
total.value = data.total;
});
listModelClue(query.value).then((data) => {
list.value = data.records;
total.value = data.total;
});
}
function reset() {
query.value = {};
getList();
query.value = {};
getList();
}
const show = ref(false);
const activeModelClue = ref({});
function handleShowDetail(row) {
activeModelClue.value = row;
show.value = true;
activeModelClue.value = row;
show.value = true;
}
const activeNegativeId = ref('')
const negativeShow = ref(false)
function handleAction(row) {
negativeShow.value = true;
activeNegativeId.value = row.negativeId;
negativeShow.value = true;
activeNegativeId.value = row.negativeId;
}
</script>
<style lang="scss" scoped>
</style>
</style>

227
src/views/work/Alarm.vue

@ -125,7 +125,7 @@
<el-button
type="primary"
link
@click="showDetail(row)"
@click="showFiles(row)"
>查看详情
</el-button>
<el-button
@ -155,53 +155,45 @@
</main>
<el-dialog v-model="editShow" title="回复问题" width="900px">
<el-form label-width="148" :model="formData" ref="formRef">
<el-form-item
label="提醒类型"
>
<el-input
v-model="formData.alarmType"
style="width: 280px"
disabled
/>
</el-form-item>
<el-form-item
label="提醒时间"
>
<el-input
v-model="formData.alarmTime"
disabled
style="width: 280px"
/>
</el-form-item>
<el-form-item
label="被通知单位"
>
<el-input
v-model="formData.notificationDepartName"
disabled
style="width: 280px"
/>
</el-form-item>
<el-form-item
label="被通知单位"
>
<el-input
v-model="formData.policeName"
disabled
style="width: 280px"
/>
</el-form-item>
<el-form-item
label="提醒内容"
>
<el-input
type="textarea"
v-model="formData.alarmContent"
:autosize="{ minRows: 6 }"
disabled
style="width: 280px"
/>
</el-form-item>
<el-row>
<el-col :span="12">
<el-form-item
label="提醒类型"
>
<div >{{formData.alarmType}}</div>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item
label="提醒时间"
>
<el-text>{{formData.alarmTime}}</el-text>
</el-form-item>
</el-col>
</el-row>
<el-row style="margin-top: 5px;">
<el-col :span="12">
<el-form-item
label="被通知单位"
>
<el-text>{{formData.notificationDepartName}}</el-text>
</el-form-item>
</el-col>
<el-col :span="12" v-if="formData.policeName != undefined">
<el-form-item
label="被通知民警"
>
<el-text>{{formData.policeName}}</el-text>
</el-form-item>
</el-col>
</el-row>
<el-row style="margin-top: 5px;">
<el-form-item
label="提醒内容"
>
<el-text style="width: 588px;">{{formData.alarmContent}}</el-text>
</el-form-item>
</el-row>
<el-form-item
label="回复问题"
:rules="{
@ -230,69 +222,66 @@
<el-dialog
title="查看详情"
v-model="dialogShow"
width="600"
width="800"
>
<el-form :model="showData" :label-width="120" ref="fomrRef">
<el-form-item
label="提醒类型"
>
<el-input
v-model="showData.alarmType"
style="width: 280px"
disabled
/>
</el-form-item>
<el-form-item
label="提醒时间"
>
<el-input
v-model="showData.alarmTime"
disabled
style="width: 280px"
/>
</el-form-item>
<el-form-item
label="被通知单位"
>
<el-input
v-model="showData.notificationDepartName"
disabled
style="width: 280px"
/>
</el-form-item>
<el-form-item
label="被通知单位"
>
<el-input
v-model="showData.policeName"
disabled
style="width: 280px"
/>
</el-form-item>
<el-form-item
label="提醒内容"
>
<el-input
type="textarea"
v-model="showData.alarmContent"
:autosize="{ minRows: 6 }"
disabled
style="width: 280px"
/>
</el-form-item>
<el-row>
<el-col :span="12">
<el-form-item
label="提醒类型"
>
<div >{{showData.alarmType}}</div>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item
label="提醒时间"
>
<el-text>{{showData.alarmTime}}</el-text>
</el-form-item>
</el-col>
</el-row>
<el-row style="margin-top: 5px;">
<el-col :span="12">
<el-form-item
label="被通知单位"
>
<el-text>{{showData.notificationDepartName}}</el-text>
</el-form-item>
</el-col>
<el-col :span="12" v-if="showData.policeName != undefined">
<el-form-item
label="被通知民警"
>
<el-text>{{showData.policeName}}</el-text>
</el-form-item>
</el-col>
</el-row>
<el-row style="margin-top: 5px;">
<el-form-item
label="提醒内容"
>
<el-text style="width: 588px;">{{showData.alarmContent}}</el-text>
</el-form-item>
</el-row>
<el-row style="margin-top: 5px;" v-if="showData.replyState == 1">
<el-form-item
<el-form-item
v-if="showData.replyState == 1"
label="回复内容"
>
<el-input
type="textarea"
v-model="showData.replyResultContent"
disabled
:autosize="{ minRows: 4 }"
style="width: 280px"
/>
</el-form-item>
label="回复内容"
>
<el-text style="width: 588px;">{{showData.replyResultContent}}</el-text>
</el-form-item>
</el-row>
<el-row style="margin-top: 10px;" v-if="showData.files != undefined && showData.files.length > 0">
<el-form-item
label="问题附件"
>
<div v-for="(item, index) in showData.files" :key="index" style="margin-top: 10px;">
<el-image :preview-src-list="previewList" style="width: 100px; height: 100px;margin-right: 8px"
:initial-index="index" :src="item.path" fit="cover" :hide-on-click-modal="true" :lazy="true" />
</div>
</el-form-item>
</el-row>
</el-form>
<footer class="flex end">
<el-button @click="dialogShow = false">关闭</el-button>
@ -303,10 +292,12 @@
</template>
<script setup>
import moment from "moment";
import {ElLoading} from "element-plus";
import { Clock } from '@element-plus/icons-vue'
import {
alarmNotificationPages,
alarmNotificationReply
alarmNotificationReply,
alarmFiles
} from "@/api/work/alarm";
import feedback from "@/utils/feedback";
@ -326,12 +317,22 @@ const total = ref(0);
let showData = ref({})
let dialogShow = ref(false)
let previewList = ref([])
const loading = ref(true);
const showDetail = (data) => {
showData.value = data;
dialogShow.value = true;
const showFiles = (data) => {
alarmFiles(data.id).then(res => {
showData.value = data;
showData.value['files'] = res;
let arr = []
res.forEach(item => {
arr.push(item.path)
})
previewList.value = arr
console.log(showData.value)
dialogShow.value = true;
})
}
function getList() {

8
vite.config.ts

@ -28,7 +28,13 @@ export default ({ mode }) => {
target: 'http://127.0.0.1:8080/',
changeOrigin: true,
rewrite: (p) => p.replace(/^\/api\/v2/, '')
}
},
'/out-police-service/': {
target: 'http://127.0.0.1:8080/',
changeOrigin: true,
rewrite: (p) => p.replace(/^\/out-polic-service/, '')
},
}
},
plugins: [

Loading…
Cancel
Save