zy_oyj/sgxt_web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

lcw

Browse Source
This commit is contained in:
lcw
2026-04-07 11:12:09 +08:00
parent 582b8677fc
commit ef3c23a03a
13 changed files with 1206 additions and 763 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
.prettierrc
View File

@ -1,6 +1,7 @@
{ {
"semi":true, "semi": true,
"singleQuote": false, "singleQuote": false,
"trailingComma": "none", "trailingComma": "none",
"spaced-comment":2 "spacedComment": 2,
} "quoteProps": "preserve"
}

BIN
gsxt.zip
View File

Binary file not shown.

BIN
src/assets/images/15.mp3 Normal file
View File

Binary file not shown.

BIN
src/assets/images/16.mp3
View File

Binary file not shown.

284
src/components/common/TestDiv.vue
View File

@ -17,140 +17,137 @@
<script setup> <script setup>
// 测试div组件，用于在后台和大屏页面都显示 // 测试div组件，用于在后台和大屏页面都显示
import { ref, onMounted, onUnmounted } from 'vue' import { ref, onMounted, onUnmounted } from "vue";
import { Close } from '@element-plus/icons-vue' import { Close } from "@element-plus/icons-vue";
import emitter from "@/utils/eventBus.js"; // 导入事件总线 import emitter from "@/utils/eventBus.js"; // 导入事件总线
import { qcckGet } from '@/api/qcckApi' import { qcckGet } from "@/api/qcckApi";
import Item from './item.vue' import Item from "./item.vue";
import { AudioPlayerClass } from '@/utils/audioPlayer.js' import { AudioPlayerClass } from "@/utils/audioPlayer.js";
import { getItem } from '@/utils/storage.js' import { getItem } from "@/utils/storage.js";
const dataList = ref([]) const dataList = ref([]);
const timekeeping = ref(null) const timekeeping = ref(null);
const countdown = ref(0) // 倒计时时间（秒） const countdown = ref(0); // 倒计时时间（秒）
// 音频播放器实例映射 // 音频播放器实例映射
const audioPlayers = ref({ const audioPlayers = ref({
'01': null, // 预警信息 "01": null, // 预警信息
'02': null, // 信息上报 "02": null, // 信息上报
'03': null, // 研判审批 "03": null, // 研判审批
'04': null, // 研判指令 "04": null, // 研判指令
'05': null, // 线索下发, "05": null, // 线索下发,
'06': null, // 警情监测 "06": null, // 警情监测
'07': null, // 线索处理 "07": null, // 线索处理
'08': null, // 线索下发 "08": null, // 线索下发
'09': null, // 线索处理 "09": null, // 线索处理
'10': null, // 林安码 10: null, // 林安码
'11': null, // 发布了新的线索 11: null, // 发布了新的线索
'12': null, // 有新的研判指令 12: null, // 有新的研判指令
'13': null, // 有新的研判约稿通知 13: null, // 有新的研判约稿通知
'14': null, // 有新的公文发布 14: null, // 有新的公文发布
'15': null, // 有新的待审核工作（补发音效） 15: null // 有新的待审核工作（补发音效）
}) });
// 音频文件路径映射 // 音频文件路径映射
const audioPaths = { const audioPaths = {
'01': require('@/assets/images/01.mp3'),//高级预计信息前置 "01": require("@/assets/images/01.mp3"), //高级预计信息前置
'02': require('@/assets/images/02.mp3'),//一般预警信息前置 "02": require("@/assets/images/02.mp3"), //一般预警信息前置
'03': require('@/assets/images/03.mp3'),//信息前置 "03": require("@/assets/images/03.mp3"), //信息前置
'04': require('@/assets/images/04.mp3'),//红色预警 "04": require("@/assets/images/04.mp3"), //红色预警
'05': require('@/assets/images/05.mp3'),//新的重点人 "05": require("@/assets/images/05.mp3"), //新的重点人
'06': require('@/assets/images/06.mp3'),//一级临控预警 "06": require("@/assets/images/06.mp3"), //一级临控预警
'07': require('@/assets/images/07.mp3'),//有新的布控预警情 "07": require("@/assets/images/07.mp3"), //有新的布控预警情
'08': require('@/assets/images/08.mp3'),//有新的标签预警 "08": require("@/assets/images/08.mp3"), //有新的标签预警
'09': require('@/assets/images/09.mp3'),//信息汇聚系统有新信息 "09": require("@/assets/images/09.mp3"), //信息汇聚系统有新信息
'10': require('@/assets/images/10.mp3'),//林安码 "10": require("@/assets/images/10.mp3"), //林安码
'11': require('@/assets/images/11.mp3'),//发布了新的线索 "11": require("@/assets/images/11.mp3"), //发布了新的"线索"
'12': require('@/assets/images/12.mp3'),//有新的研判指令 "12": require("@/assets/images/12.mp3"), //有新的研判指令
'13': require('@/assets/images/13.mp3'),//有新的研判约稿通知 "13": require("@/assets/images/13.mp3"), //有新的研判约稿通知
'14': require('@/assets/images/14.mp3'),//有新的公文发布 "14": require("@/assets/images/14.mp3"), //有新的公文发布
'15': require('@/assets/images/16.mp3'),//有新的警情监测预警，请注意查收 "15": require("@/assets/images/15.mp3"), //有新的警情监测预警，请注意查收
} "16": require("@/assets/images/16.mp3") //有新的一级临控预警，请及时签收处理！
};
// 初始化音频播放器 // 初始化音频播放器
const initAudioPlayers = () => { const initAudioPlayers = () => {
Object.keys(audioPaths).forEach(type => { Object.keys(audioPaths).forEach((type) => {
try { try {
audioPlayers.value[type] = new AudioPlayerClass() audioPlayers.value[type] = new AudioPlayerClass();
audioPlayers.value[type].init(audioPaths[type], false) audioPlayers.value[type].init(audioPaths[type], false);
} catch (error) { } catch (error) {
console.error(`初始化类型${type}的音频播放器失败:`, error) console.error(`初始化类型${type}的音频播放器失败:`, error);
} }
}) });
} };
// 根据类型播放音频 // 根据类型播放音频
const playAudioByType = (val) => { const playAudioByType = (val) => {
switch (val.typeMasgeLx) { switch (val.typeMasgeLx) {
case '01'://预警 case "01": //预警
// 01 布控预警、02 七类重点人、03 政保 // 01 布控预警、02 七类重点人、03 政保
switch (val.yjlb) { switch (val.yjlb) {
case '01': case "01":
switch (val.yjJb) { switch (val.yjJb) {
case '01': case "01":
audioPlayers.value['01'].play() audioPlayers.value["01"].play();
audioPlayers.value['06'].play() audioPlayers.value["06"].play();
break; break;
default: default:
audioPlayers.value['02'].play() audioPlayers.value["02"].play();
audioPlayers.value['07'].play() audioPlayers.value["07"].play();
break; break;
} }
break break;
case '02': case "02":
switch (val.yjJb) { switch (val.yjJb) {
case '01': case "01":
audioPlayers.value['01'].play() audioPlayers.value["01"].play();
audioPlayers.value['04'].play() audioPlayers.value["04"].play();
break; break;
default: default:
audioPlayers.value['02'].play() audioPlayers.value["02"].play();
audioPlayers.value['05'].play() audioPlayers.value["05"].play();
break; break;
} }
break break;
case '03': case "03":
break break;
} }
break break;
case '02'://信息汇聚 case "02": //信息汇聚
audioPlayers.value['03'].play() audioPlayers.value["03"].play();
audioPlayers.value['09'].play() audioPlayers.value["09"].play();
break break;
case '03'://约稿 case "03": //约稿
audioPlayers.value['03'].play() audioPlayers.value["03"].play();
audioPlayers.value['13'].play() audioPlayers.value["13"].play();
break break;
case '04'://指令 case "04": //指令
audioPlayers.value['03'].play() audioPlayers.value["03"].play();
audioPlayers.value['12'].play() audioPlayers.value["12"].play();
break break;
case '05'://新线索 case "05": //新线索
audioPlayers.value['03'].play() audioPlayers.value["03"].play();
audioPlayers.value['11'].play() audioPlayers.value["11"].play();
break break;
case '06'://监测 case "06": //监测
audioPlayers.value['02'].play() audioPlayers.value["02"].play();
audioPlayers.value['15'].play() audioPlayers.value["15"].play();
break break;
// case '07': // case '07':
// audioPlayers.value['07'].play() // audioPlayers.value['07'].play()
// break // break
case '08'://林安码 case "08": //林安码
audioPlayers.value['03'].play() audioPlayers.value["03"].play();
audioPlayers.value['10'].play() audioPlayers.value["10"].play();
break break;
// case '10': case "11":
// audioPlayers.value['10'].play() audioPlayers.value["03"].play();
// break audioPlayers.value["16"].play();
break;
default: default:
break break;
} }
// if (audioPlayers.value[type]) { // if (audioPlayers.value[type]) {
// try { // try {
// audioPlayers.value[type].play() // audioPlayers.value[type].play()
@ -158,73 +155,73 @@ const playAudioByType = (val) => {
// console.error(`播放类型${type}的音频失败:`, error) // console.error(`播放类型${type}的音频失败:`, error)
// } // }
// } // }
} };
// 手动关闭 // 手动关闭
const handleClose = () => { const handleClose = () => {
if (timekeeping.value) { if (timekeeping.value) {
clearInterval(timekeeping.value) clearInterval(timekeeping.value);
timekeeping.value = null timekeeping.value = null;
} }
dataList.value = [] dataList.value = [];
} };
// 重置倒计时 // 重置倒计时
const resetCountdown = () => { const resetCountdown = () => {
if (timekeeping.value) { if (timekeeping.value) {
clearInterval(timekeeping.value) clearInterval(timekeeping.value);
} }
countdown.value = 15 countdown.value = 15;
timekeeping.value = setInterval(() => { timekeeping.value = setInterval(() => {
countdown.value-- countdown.value--;
if (countdown.value <= 0) { if (countdown.value <= 0) {
clearInterval(timekeeping.value) clearInterval(timekeeping.value);
dataList.value = [] dataList.value = [];
timekeeping.value = null timekeeping.value = null;
} }
}, 1000) }, 1000);
} };
// 做一个定时器15s一次 // 做一个定时器15s一次
const checkNews = ref(null) const checkNews = ref(null);
const checkNewsInterval = 15000 // 15秒 const checkNewsInterval = 15000; // 15秒
checkNews.value = setInterval(() => { checkNews.value = setInterval(() => {
dataModel() dataModel();
}, checkNewsInterval) }, checkNewsInterval);
onMounted(() => { onMounted(() => {
// 初始化音频播放器 // 初始化音频播放器
initAudioPlayers() initAudioPlayers();
emitter.on('webSocketMessage', (newsDate) => { emitter.on("webSocketMessage", (newsDate) => {
if (newsDate) { if (newsDate) {
dataList.value = newsDate dataList.value = newsDate;
// dataList.value.unshift({...newsDate.data,typeMasgeLx:newsDate.type}) // dataList.value.unshift({...newsDate.data,typeMasgeLx:newsDate.type})
// 根据消息类型播放音频 // 根据消息类型播放音频
playAudioByType(newsDate[0]) playAudioByType(newsDate[0]);
resetCountdown() resetCountdown();
} }
}) });
}) });
const idEntityCard = ref(getItem('idEntityCard')) const idEntityCard = ref(getItem("idEntityCard"));
const dataModel = () => { const dataModel = () => {
qcckGet({}, '/mosty-gsxt/dsjJbxx/message').then(res => { qcckGet({}, "/mosty-gsxt/dsjJbxx/message").then((res) => {
if (res) { if (res) {
// const yjmasg = res.filter(item => item.type === '01') // const yjmasg = res.filter(item => item.type === '01')
// if (yjmasg.length > 0) { // if (yjmasg.length > 0) {
// emitter.emit('openYp', yjmasg[0].obj); // 触发音频播放 // emitter.emit('openYp', yjmasg[0].obj); // 触发音频播放
// } // }
const data = res.filter(item => item.sfzList.includes(idEntityCard.value)) const data = res.filter((item) =>
const infoMasge = data.map(item => { item.sfzList.includes(idEntityCard.value)
);
const infoMasge = data.map((item) => {
return { return {
...item.obj, ...item.obj,
typeMasgeLx: item.type typeMasgeLx: item.type
} };
}) });
console.log(infoMasge, "xxxxxxxxxxxx"); console.log(infoMasge, "xxxxxxxxxxxx");
emitter.emit('webSocketMessage', infoMasge) emitter.emit("webSocketMessage", infoMasge);
} }
}) });
};
}
// if (newsDate.type === '01') { // if (newsDate.type === '01') {
// // 触发音频播放 // // 触发音频播放
@ -232,24 +229,24 @@ const dataModel = () => {
// emitter.emit('openYp', newsDate.data); // 传递消息数据 // emitter.emit('openYp', newsDate.data); // 传递消息数据
// } else { // } else {
onUnmounted(() => { onUnmounted(() => {
emitter.off('webSocketMessage') emitter.off("webSocketMessage");
if (timekeeping.value) { if (timekeeping.value) {
clearInterval(timekeeping.value) clearInterval(timekeeping.value);
} }
// 销毁所有音频播放器实例 // 销毁所有音频播放器实例
Object.values(audioPlayers.value).forEach(player => { Object.values(audioPlayers.value).forEach((player) => {
if (player) { if (player) {
player.destroy() player.destroy();
} }
}) });
// 清除定时器 // 清除定时器
if (checkNews.value) { if (checkNews.value) {
clearInterval(checkNews.value) clearInterval(checkNews.value);
checkNews.value = null checkNews.value = null;
} }
// 组件卸载时执行的操作 // 组件卸载时执行的操作
console.log('组件卸载时执行的操作') console.log("组件卸载时执行的操作");
}) });
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
@ -299,7 +296,7 @@ onUnmounted(() => {
text-shadow: 0 0 10px rgba(0, 255, 255, 0.7); text-shadow: 0 0 10px rgba(0, 255, 255, 0.7);
&::before { &::before {
content: ''; content: "";
display: inline-block; display: inline-block;
width: 8px; width: 8px;
height: 8px; height: 8px;
@ -310,7 +307,6 @@ onUnmounted(() => {
} }
@keyframes pulse { @keyframes pulse {
0%, 0%,
100% { 100% {
opacity: 1; opacity: 1;

140
src/components/common/item.vue
View File

@ -1,105 +1,141 @@
<template> <template>
<div class="test-item" v-if="item.typeMasgeLx == '01'" @click="goDetail(item.id, item.typeMasgeLx, item)"> <div
class="test-item"
v-if="item.typeMasgeLx == '01' || item.typeMasgeLx == '11'"
@click="goDetail(item.id, item.typeMasgeLx, item)"
>
<div class="item-header"> <div class="item-header">
<div class="item-title">{{ item.yjBt || '' }}</div> <div class="item-title">{{ item.yjBt || "" }}</div>
<div class="item-type">{{ item.yjlb == '01' ? '布控预警' : item.yjlb == '02' ? '七类重点人' : '政保' }}</div> <div class="item-type">
{{
item.yjlb == "01"
? "布控预警"
: item.yjlb == "02"
? "七类重点人"
: "政保"
}}
</div>
</div> </div>
<div class="item-message">{{ item.yjNr }}</div> <div class="item-message">{{ item.yjNr }}</div>
<div class="item-time">{{ item.yjSj || '' }}</div> <div class="item-time">{{ item.yjSj || "" }}</div>
</div> </div>
<div class="test-item" v-if="item.typeMasgeLx == '02'" @click="goDetail(item.id, item.typeMasgeLx)"> <div
class="test-item"
v-if="item.typeMasgeLx == '02'"
@click="goDetail(item.id, item.typeMasgeLx)"
>
<div class="item-header"> <div class="item-header">
<div class="item-title">{{ item.qbmc || '' }}</div> <div class="item-title">{{ item.qbmc || "" }}</div>
<div class="item-type">{{ informationMap[item.typeMasgeLx] }}</div> <div class="item-type">{{ informationMap[item.typeMasgeLx] }}</div>
</div> </div>
<div class="item-message">{{ item.qbnr }}</div> <div class="item-message">{{ item.qbnr }}</div>
<div class="item-time">{{ item.xtCjsj || '' }}</div> <div class="item-time">{{ item.xtCjsj || "" }}</div>
</div> </div>
<div class="test-item" v-if="item.typeMasgeLx == '03'" @click="goDetail(item.id, item.typeMasgeLx)"> <div
class="test-item"
v-if="item.typeMasgeLx == '03'"
@click="goDetail(item.id, item.typeMasgeLx)"
>
<div class="item-header"> <div class="item-header">
<div class="item-title">{{ item.ypyt || '' }}</div> <div class="item-title">{{ item.ypyt || "" }}</div>
<div class="item-type">{{ informationMap[item.typeMasgeLx] }}</div> <div class="item-type">{{ informationMap[item.typeMasgeLx] }}</div>
</div> </div>
<div class="item-message">{{ item.ssbm }}</div> <div class="item-message">{{ item.ssbm }}</div>
<div class="item-time">{{ item.ypsj || '' }}</div> <div class="item-time">{{ item.ypsj || "" }}</div>
</div> </div>
<div class="test-item" v-if="item.typeMasgeLx == '04'" @click="goDetail(item.id, item.typeMasgeLx)"> <div
class="test-item"
v-if="item.typeMasgeLx == '04'"
@click="goDetail(item.id, item.typeMasgeLx)"
>
<div class="item-header"> <div class="item-header">
<div class="item-title">{{ item.zlbt || '' }}</div> <div class="item-title">{{ item.zlbt || "" }}</div>
<div class="item-type">{{ informationMap[item.typeMasgeLx] }}</div> <div class="item-type">{{ informationMap[item.typeMasgeLx] }}</div>
</div> </div>
<div class="item-message" v-html="item.zlnr"></div> <div class="item-message" v-html="item.zlnr"></div>
<div class="item-time">{{ item.xtCjsj || '' }}</div> <div class="item-time">{{ item.xtCjsj || "" }}</div>
</div> </div>
<div class="test-item" v-if="item.typeMasgeLx == '05'" @click="goDetail(item.id, item.typeMasgeLx)"> <div
class="test-item"
v-if="item.typeMasgeLx == '05'"
@click="goDetail(item.id, item.typeMasgeLx)"
>
<div class="item-header"> <div class="item-header">
<div class="item-title">{{ item.zlbt || '' }}</div> <div class="item-title">{{ item.zlbt || "" }}</div>
<div class="item-type">{{ informationMap[item.typeMasgeLx] }}</div> <div class="item-type">{{ informationMap[item.typeMasgeLx] }}</div>
</div> </div>
<div class="item-message" v-html="item.zlnr"></div> <div class="item-message" v-html="item.zlnr"></div>
<div class="item-time">{{ item.xtCjsj || '' }}</div> <div class="item-time">{{ item.xtCjsj || "" }}</div>
</div> </div>
<div class="test-item" v-if="item.typeMasgeLx == '06'" @click="goDetail(item.id, item.typeMasgeLx)"> <div
class="test-item"
v-if="item.typeMasgeLx == '06'"
@click="goDetail(item.id, item.typeMasgeLx)"
>
<div class="item-header"> <div class="item-header">
<div class="item-title">{{ item.gxdwmc || '' }}</div> <div class="item-title">{{ item.gxdwmc || "" }}</div>
<div class="item-type">{{ informationMap[item.typeMasgeLx] }}</div> <div class="item-type">{{ informationMap[item.typeMasgeLx] }}</div>
</div> </div>
<div class="item-message">{{ item.bcjjnr }}</div> <div class="item-message">{{ item.bcjjnr }}</div>
<div class="item-time">{{ item.bjsj || '' }}</div> <div class="item-time">{{ item.bjsj || "" }}</div>
</div> </div>
<div class="test-item" v-if="item.typeMasgeLx == '08'" @click="goDetail(item.id, item.typeMasgeLx)"> <div
class="test-item"
v-if="item.typeMasgeLx == '08'"
@click="goDetail(item.id, item.typeMasgeLx)"
>
<div class="item-header"> <div class="item-header">
<div class="item-title">{{ item.qbmc || '' }}</div> <div class="item-title">{{ item.qbmc || "" }}</div>
<div class="item-type">{{ informationMap[item.typeMasgeLx] }}</div> <div class="item-type">{{ informationMap[item.typeMasgeLx] }}</div>
</div> </div>
<div class="item-message">{{ item.qbnr }}</div> <div class="item-message">{{ item.qbnr }}</div>
<div class="item-time">{{ item.sxsbsj || '' }}</div> <div class="item-time">{{ item.sxsbsj || "" }}</div>
</div> </div>
</template> </template>
<script setup> <script setup>
import { useRouter } from "vue-router";
import { useRouter } from 'vue-router'
import emitter from "@/utils/eventBus.js"; // 导入 import emitter from "@/utils/eventBus.js"; // 导入
const router = useRouter() const router = useRouter();
const props = defineProps({ const props = defineProps({
item: { item: {
type: Object, type: Object,
default: () => ({}) default: () => ({})
} }
}) });
const informationMap = { const informationMap = {
'01': '预警信息', "01": "预警信息",
'02': '信息上报', "02": "信息上报",
'03': '研判约稿', "03": "研判约稿",
'04': '研判指令', "04": "研判指令",
'05': '线索下发', "05": "线索下发",
'06': '警情监测', "06": "警情监测",
'08': '林安码信息', "08": "林安码信息"
} };
const emit = defineEmits(['goDetail']) const emit = defineEmits(["goDetail"]);
const goDetail = (id, lx, val) => { const goDetail = (id, lx, val) => {
let path = '' let path = "";
switch (lx) { switch (lx) {
case '01': case "01":
emitter.emit('openYp', val); case "11":
emitter.emit("openYp", val);
break; break;
case '02': case "02":
path = '/InfoCollection' path = "/InfoCollection";
break; break;
case '03': case "03":
path = '/dataReduction' path = "/dataReduction";
break; break;
case '04': case "04":
path = '/judgmentCommand' path = "/judgmentCommand";
break; break;
case '05': case "05":
path = '/InstructionInformation' path = "/InstructionInformation";
break; break;
case '06': case "06":
path = '/policeReport' path = "/policeReport";
break; break;
case '08': case "08":
path = '/lamXs' path = "/lamXs";
break; break;
} }
router.push({ router.push({
@ -107,8 +143,8 @@ const goDetail = (id, lx, val) => {
query: { query: {
id: id id: id
} }
}) });
} };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.test-item { .test-item {

268
src/views/backOfficeSystem/DeploymentDisposal/gzPeo/model/contact.vue
View File

@ -2,10 +2,21 @@
<div> <div>
<div class="headClass" style=""> <div class="headClass" style="">
<h3>密切联系人</h3> <h3>密切联系人</h3>
<el-button type="primary" @click="openDialog('新增密切联系人', {}, true)" v-if="showBut">新增</el-button> <el-button
type="primary"
@click="openDialog('新增密切联系人', {}, true)"
v-if="showBut"
>新增</el-button
>
</div> </div>
<div class="headSelect"> <div class="headSelect">
<el-form :model="formData" :inline="true" ref="formRef" :rules="rulesForm" class="form-inline"> <el-form
:model="formData"
:inline="true"
ref="formRef"
:rules="rulesForm"
class="form-inline"
>
<el-form-item label="身份证号码"> <el-form-item label="身份证号码">
<el-input v-model="formData.rySfzh" placeholder="请输入身份证号码" /> <el-input v-model="formData.rySfzh" placeholder="请输入身份证号码" />
</el-form-item> </el-form-item>
@ -16,177 +27,216 @@
</el-form-item> </el-form-item>
</el-form> </el-form>
</div> </div>
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight" <MyTable
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth"> :tableData="pageData.tableData"
:tableColumn="pageData.tableColumn"
:tableHeight="pageData.tableHeight"
:key="pageData.keyCount"
:tableConfiger="pageData.tableConfiger"
:controlsWidth="pageData.controlsWidth"
>
<template #dygx="{ row }"> <template #dygx="{ row }">
<DictTag :tag="false" :value="row.dygx" :options="D_BZ_QSGXDM" /> <DictTag :tag="false" :value="row.dygx" :options="D_BZ_QSGXDM" />
</template> </template>
<!-- 操作 --> <!-- 操作 -->
<template #controls="{ row }"> <template #controls="{ row }">
<el-link type="danger" @click="delDictItem(row.id)">删除</el-link> <el-link type="danger" @click="delDictItem(row.id)">删除</el-link>
<el-link type="danger" @click="openDialog('修改密切联系人', row, false)">修改</el-link> <el-link type="danger" @click="openDialog('修改密切联系人', row, false)"
>修改</el-link
>
</template> </template>
</MyTable> </MyTable>
<diaLogForm v-model="dialogVisible" :data="diaLogRuleForm" @submit="addPersonOrModifica" :title="Tips" <diaLogForm
:dict="{ D_BZ_QSGXDM }"> v-model="dialogVisible"
:data="diaLogRuleForm"
@submit="addPersonOrModifica"
:title="Tips"
:dict="{ D_BZ_QSGXDM }"
>
</diaLogForm> </diaLogForm>
</div> </div>
</template> </template>
<script setup> <script setup>
import { identityCardRule } from "@/utils/rules" import { identityCardRule } from "@/utils/rules";
import { ref, reactive, watch, toRaw, getCurrentInstance, onMounted, onUnmounted } from "vue"; import {
ref,
reactive,
watch,
toRaw,
getCurrentInstance,
onMounted,
onUnmounted
} from "vue";
import MyTable from "@/components/aboutTable/MyTable.vue"; import MyTable from "@/components/aboutTable/MyTable.vue";
import diaLogForm from "../component/diaLogForm.vue"; import diaLogForm from "../component/diaLogForm.vue";
import { tbZdryClxxUpdate, tbGsxtZdryLxrsaveOrUpdateLxr,tbGsxtZdryLxrselectLxrBy ,tbGsxtZdryLxr} from '@/api/zdr.js' import {
tbZdryClxxUpdate,
tbGsxtZdryLxrsaveOrUpdateLxr,
tbGsxtZdryLxrselectLxrBy,
tbGsxtZdryLxr
} from "@/api/zdr.js";
import { ElMessage, ElMessageBox } from "element-plus"; import { ElMessage, ElMessageBox } from "element-plus";
const { proxy } = getCurrentInstance(); const { proxy } = getCurrentInstance();
const { D_BZ_QSGXDM } = proxy.$dict("D_BZ_QSGXDM"); //获取字典数据 const { D_BZ_QSGXDM } = proxy.$dict("D_BZ_QSGXDM"); //获取字典数据
const props = defineProps({ const props = defineProps({
dataList: { dataList: {
type: Object, type: Object,
default: () => { }, default: () => {}
}, disabled: { },
disabled: {
type: Boolean, type: Boolean,
default: false default: false
}, },
showBut: { showBut: {
type: Boolean, type: Boolean,
default: false default: false
}, }
}) });
const dialogVisible = ref(false) const dialogVisible = ref(false);
const listData = ref({}) const listData = ref({});
const Tips = ref("密切联系人") const Tips = ref("密切联系人");
// 表格数据 // 表格数据
const pageData = reactive({ const pageData = reactive({
tableData: [], tableData: [],
tableColumn: [{ tableColumn: [
prop: 'ryXm', {
label: '人员姓名', prop: "ryXm",
}, { label: "人员姓名"
prop: 'rySfzh', },
label: '身份证号码', {
}, { prop: "rySfzh",
prop: 'dygx', label: "身份证号码"
label: '关系', },
showSolt: true, {
}, { prop: "dygx",
prop: 'lxrDh', label: "关系",
label: '联系电话', showSolt: true
}], },
tableHeight: '200px', {
prop: "lxrDh",
label: "联系电话"
}
],
tableHeight: "200px",
keyCount: 0, keyCount: 0,
tableConfiger: { tableConfiger: {
border: true, border: true,
stripe: true, stripe: true,
showHeader: true, showHeader: true,
showIndex: true, showIndex: true,
indexLabel: '序号', indexLabel: "序号",
indexWidth: 60, indexWidth: 60,
align: 'center', align: "center",
showOverflowTooltip: true, showOverflowTooltip: true,
haveControls: !props.disabled haveControls: !props.disabled
}, },
controlsWidth: 200, controlsWidth: 200
}) });
// 表单数据 // 表单数据
const formData = ref({ const formData = ref({
username: "", username: "",
ID: "" ID: ""
}) });
const touchIn = ref(true) const touchIn = ref(true);
const rulesForm = ref(identityCardRule({ validator: true }, 'rySfzh')) const rulesForm = ref(identityCardRule({ validator: true }, "rySfzh"));
const diaLogRuleForm = ref({}) const diaLogRuleForm = ref({});
watch(() => props.dataList, (val) => { watch(
if (val) { () => props.dataList,
listData.value = val (val) => {
getContact() if (val) {
} listData.value = val;
}, { deep: true }) getContact();
}
},
{ deep: true }
);
// 弹出增加或者修改弹窗 // 弹出增加或者修改弹窗
const openDialog = (type, formVal, bool) => { const openDialog = (type, formVal, bool) => {
touchIn.value = bool touchIn.value = bool;
dialogVisible.value = true dialogVisible.value = true;
Tips.value = type Tips.value = type;
diaLogRuleForm.value = { ...formVal } diaLogRuleForm.value = { ...formVal };
} };
// 提交表单 // 提交表单
const addPersonOrModifica = (val) => { const addPersonOrModifica = (val) => {
if (touchIn.value) { if (touchIn.value) {
const item = pageData.tableData.findIndex(item => item.rySfzh == val.rySfzh) console.log(pageData.tableData);
const item = pageData.tableData.findIndex(
(item) => item.rySfzh == val.rySfzh
);
if (item != -1) { if (item != -1) {
proxy.$message({ proxy.$message({
message: '该人员已存在', message: "该人员已存在",
type: 'warning' type: "warning"
}) });
return return;
} }
} }
const promes = { const promes = {
...val, ...val,
zdryId: listData.value.id zdryId: listData.value.id
} };
tbGsxtZdryLxrsaveOrUpdateLxr(promes).then((res) => { tbGsxtZdryLxrsaveOrUpdateLxr(promes)
proxy.$message({ .then((res) => {
message: '操作成功', proxy.$message({
type: 'success' message: "操作成功",
}) type: "success"
getContact()
}).catch((err) => {
proxy.$message({
message: '操作失败',
type: 'error'
})
});
}
const delDictItem = (val) => {
ElMessageBox.confirm(
'是否删除该联系人',
'提示',
{
confirmButtonText: '确认',
cancelButtonText: '取消',
type: 'warning',
}
)
.then(() => {
tbGsxtZdryLxr(val).then((res) => {
proxy.$message({
message: '删除成功',
type: 'success'
})
getContact()
}).catch((err) => {
}); });
getContact();
})
.catch((err) => {
proxy.$message({
message: "操作失败",
type: "error"
});
});
};
const delDictItem = (val) => {
ElMessageBox.confirm("是否删除该联系人", "提示", {
confirmButtonText: "确认",
cancelButtonText: "取消",
type: "warning"
})
.then(() => {
tbGsxtZdryLxr(val)
.then((res) => {
proxy.$message({
message: "删除成功",
type: "success"
});
getContact();
})
.catch((err) => {});
}) })
.catch(() => { .catch(() => {
proxy.$message({ proxy.$message({
message: '删除失败', message: "删除失败",
type: 'info', type: "info"
}) });
}) });
} };
const getContact = () => { const getContact = () => {
const promes = { zdryId: listData.value.id } const promes = { zdryId: listData.value.id };
tbGsxtZdryLxrselectLxrBy(promes).then((res) => { tbGsxtZdryLxrselectLxrBy(promes).then((res) => {
pageData.tableData = res pageData.tableData = res;
}) });
} };
const resetForm = () => { const resetForm = () => {
formData.value = {} formData.value = {};
getContact() getContact();
} };
const check = () => { const check = () => {
if (formData.value.rySfzh) { if (formData.value.rySfzh) {
// 模糊查询：检查身份证号码是否包含输入的内容 // 模糊查询：检查身份证号码是否包含输入的内容
pageData.tableData = pageData.tableData.filter(item => item.rySfzh && item.rySfzh.includes(formData.value.rySfzh)) pageData.tableData = pageData.tableData.filter(
(item) => item.rySfzh && item.rySfzh.includes(formData.value.rySfzh)
);
} else { } else {
// 如果输入为空，显示所有数据 // 如果输入为空，显示所有数据
getContact() getContact();
} }
} };
// 抛出数据并验证标签列表不为空 // 抛出数据并验证标签列表不为空
const throwData = () => { const throwData = () => {
@ -197,10 +247,10 @@ const throwData = () => {
// } // }
resolve(pageData.tableData); resolve(pageData.tableData);
}); });
} };
defineExpose({ defineExpose({
throwData throwData
}) });
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@ -211,8 +261,6 @@ defineExpose({
padding: 10px; padding: 10px;
} }
.left_box { .left_box {
width: 200px; width: 200px;
border: 1px solid #c8c8c89a; border: 1px solid #c8c8c89a;
@ -287,8 +335,6 @@ defineExpose({
} }
} }
// .headClass::after { // .headClass::after {
// content: ''; // content: '';
// position: absolute; // position: absolute;

465
src/views/backOfficeSystem/DeploymentDisposal/mpvPeo/components/addForm.vue
View File

@ -3,87 +3,239 @@
<div class="head_box"> <div class="head_box">
<span class="title">{{ title }}重点人管理</span> <span class="title">{{ title }}重点人管理</span>
<div> <div>
<el-button type="primary" size="small" v-if="butShow" :loading="loading" @click="submit">保存</el-button> <el-button
<el-button type="primary" size="small" v-if="showAuditShBtn && showButData" type="primary"
@click="openAuditDialog('sh')">审核</el-button> size="small"
<el-button type="primary" size="small" v-if="showAuditSpBtn && showButData" v-if="butShow"
@click="openAuditDialog('sp')">审批</el-button> :loading="loading"
@click="submit"
>保存</el-button
>
<el-button
type="primary"
size="small"
v-if="showAuditShBtn && showButData"
@click="openAuditDialog('sh')"
>审核</el-button
>
<el-button
type="primary"
size="small"
v-if="showAuditSpBtn && showButData"
@click="openAuditDialog('sp')"
>审批</el-button
>
<el-button size="small" @click="close">关闭</el-button> <el-button size="small" @click="close">关闭</el-button>
</div> </div>
</div> </div>
<AuditDialog v-model="auditDialogVisible" :title="auditTitle" :formData="auditForm" :rules="auditRules" <AuditDialog
:reasonProp="auditReasonProp" :loading="auditLoading" :dictEnum="D_BZ_SF" @cancel="handleAuditCancel" v-model="auditDialogVisible"
@submit="handleAuditSubmit" /> :title="auditTitle"
:formData="auditForm"
:rules="auditRules"
:reasonProp="auditReasonProp"
:loading="auditLoading"
:dictEnum="D_BZ_SF"
@cancel="handleAuditCancel"
@submit="handleAuditSubmit"
/>
<div class="form_cnt flex just-between"> <div class="form_cnt flex just-between">
<div class="left_box"> <div class="left_box">
<ul class="anchor-list"> <ul class="anchor-list">
<li @click="scrollToSection('info-section')" :class="activeSection === 'info-section' ? 'active' : ''">人员信息 <li
@click="scrollToSection('info-section')"
:class="activeSection === 'info-section' ? 'active' : ''"
>
人员信息
</li>
<li
@click="scrollToSection('backinfo-section')"
:class="activeSection === 'backinfo-section' ? 'active' : ''"
>
人员标签
</li>
<li
@click="scrollToSection('groupLabels-section')"
:class="activeSection === 'groupLabels-section' ? 'active' : ''"
v-if="!butShow"
>
关联车辆
</li>
<li
@click="scrollToSection('character-section')"
:class="activeSection === 'character-section' ? 'active' : ''"
>
背景信息
</li>
<li
@click="scrollToSection('controlInfo-section')"
:class="activeSection === 'controlInfo-section' ? 'active' : ''"
v-if="!butShow"
>
管控信息
</li>
<li
@click="scrollToSection('featinfo-section')"
:class="activeSection === 'featinfo-section' ? 'active' : ''"
v-if="!butShow"
>
全要素布控
</li>
<li
@click="scrollToSection('demandsInfo-section')"
:class="activeSection === 'demandsInfo-section' ? 'active' : ''"
v-if="!butShow"
>
密切联系人
</li>
<li
@click="scrollToSection('requestInfo-section')"
:class="activeSection === 'requestInfo-section' ? 'active' : ''"
v-if="!butShow"
>
动态轨迹
</li>
<li
@click="scrollToSection('personnel-section')"
:class="activeSection === 'personnel-section' ? 'active' : ''"
v-if="!butShow"
>
行为信息
</li>
<li
@click="scrollToSection('judgmentRecord-section')"
:class="activeSection === 'judgmentRecord-section' ? 'active' : ''"
v-if="!butShow"
>
走访记录
</li>
<li
@click="scrollToSection('historyAssembly-section')"
:class="activeSection === 'historyAssembly-section' ? 'active' : ''"
v-if="!butShow"
>
案件信息
</li>
<li
@click="scrollToSection('joblogging-section')"
:class="activeSection === 'joblogging-section' ? 'active' : ''"
v-if="!butShow"
>
现实表现
</li>
<li
@click="scrollToSection('joblogging-joblog')"
:class="activeSection === 'joblogging-joblog' ? 'active' : ''"
v-if="!butShow"
>
操作日志
</li> </li>
<li @click="scrollToSection('backinfo-section')"
:class="activeSection === 'backinfo-section' ? 'active' : ''">人员标签</li>
<li @click="scrollToSection('groupLabels-section')"
:class="activeSection === 'groupLabels-section' ? 'active' : ''" v-if="!butShow">关联车辆</li>
<li @click="scrollToSection('character-section')"
:class="activeSection === 'character-section' ? 'active' : ''">背景信息</li>
<li @click="scrollToSection('controlInfo-section')"
:class="activeSection === 'controlInfo-section' ? 'active' : ''" v-if="!butShow">管控信息</li>
<li @click="scrollToSection('featinfo-section')" :class="activeSection === 'featinfo-section' ? 'active' : ''"
v-if="!butShow">全要素布控</li>
<li @click="scrollToSection('demandsInfo-section')"
:class="activeSection === 'demandsInfo-section' ? 'active' : ''" v-if="!butShow">密切联系人</li>
<li @click="scrollToSection('requestInfo-section')"
:class="activeSection === 'requestInfo-section' ? 'active' : ''" v-if="!butShow">动态轨迹</li>
<li @click="scrollToSection('personnel-section')"
:class="activeSection === 'personnel-section' ? 'active' : ''" v-if="!butShow">行为信息</li>
<li @click="scrollToSection('judgmentRecord-section')"
:class="activeSection === 'judgmentRecord-section' ? 'active' : ''" v-if="!butShow">走访记录</li>
<li @click="scrollToSection('historyAssembly-section')"
:class="activeSection === 'historyAssembly-section' ? 'active' : ''" v-if="!butShow">案件信息</li>
<li @click="scrollToSection('joblogging-section')"
:class="activeSection === 'joblogging-section' ? 'active' : ''" v-if="!butShow">现实表现</li>
<li @click="scrollToSection('joblogging-joblog')"
:class="activeSection === 'joblogging-joblog' ? 'active' : ''" v-if="!butShow">操作日志</li>
</ul> </ul>
</div> </div>
<div class="right_box" ref="rightBox"> <div class="right_box" ref="rightBox">
<div id="info-section"> <div id="info-section">
<Info ref="info" :disabled="disabled" :showBut="showBut" :dataList="listQuery" /> <Info
ref="info"
:disabled="disabled"
:showBut="showBut"
:dataList="listQuery"
@close="close"
/>
</div> </div>
<div id="backinfo-section"> <div id="backinfo-section">
<PersonnelTags ref="personnelTags" :disabled="disabled" :showBut="showBut" :dataList="listQuery" /> <PersonnelTags
ref="personnelTags"
:disabled="disabled"
:showBut="showBut"
:dataList="listQuery"
/>
</div> </div>
<div id="groupLabels-section" v-if="!butShow"> <div id="groupLabels-section" v-if="!butShow">
<Vehicle ref="vehicle" :disabled="disabled" :showBut="showBut" :dataList="listQuery" /> <Vehicle
ref="vehicle"
:disabled="disabled"
:showBut="showBut"
:dataList="listQuery"
/>
</div> </div>
<div id="character-section"> <div id="character-section">
<BackInfo ref="backInfo" :disabled="disabled" :showBut="showBut" :dataList="listQuery" /> <BackInfo
ref="backInfo"
:disabled="disabled"
:showBut="showBut"
:dataList="listQuery"
/>
</div> </div>
<div id="controlInfo-section" v-if="!butShow"> <div id="controlInfo-section" v-if="!butShow">
<ControlInfo ref="controlInfo" title="重点人" :disabled="disabled" :showBut="showBut" :dataList="listQuery" /> <ControlInfo
ref="controlInfo"
title="重点人"
:disabled="disabled"
:showBut="showBut"
:dataList="listQuery"
/>
</div> </div>
<div id="featinfo-section" v-if="!butShow"> <div id="featinfo-section" v-if="!butShow">
<Deployment ref="deployment" :disabled="disabled" :showBut="showBut" :dataList="listQuery" /> <Deployment
ref="deployment"
:disabled="disabled"
:showBut="showBut"
:dataList="listQuery"
/>
</div> </div>
<div id="demandsInfo-section" v-if="!butShow"> <div id="demandsInfo-section" v-if="!butShow">
<Contact ref="contact" :disabled="disabled" :showBut="showBut" :dataList="listQuery" /> <Contact
ref="contact"
:disabled="disabled"
:showBut="showBut"
:dataList="listQuery"
/>
</div> </div>
<div id="requestInfo-section" v-if="!butShow"> <div id="requestInfo-section" v-if="!butShow">
<DynamicTrajectory ref="dynamicTrajectory" :disabled="disabled" :showBut="showBut" /> <DynamicTrajectory
ref="dynamicTrajectory"
:disabled="disabled"
:showBut="showBut"
/>
</div> </div>
<div id="personnel-section" v-if="!butShow"> <div id="personnel-section" v-if="!butShow">
<BehaviorInfo ref="behaviorInfo" :disabled="disabled" :showBut="showBut" /> <BehaviorInfo
ref="behaviorInfo"
:disabled="disabled"
:showBut="showBut"
/>
</div> </div>
<div id="judgmentRecord-section" v-if="!butShow"> <div id="judgmentRecord-section" v-if="!butShow">
<VisitRecord ref="visitRecord" :disabled="disabled" :showBut="showBut" :dataList="listQuery" /> <VisitRecord
ref="visitRecord"
:disabled="disabled"
:showBut="showBut"
:dataList="listQuery"
/>
</div> </div>
<div id="historyAssembly-section" v-if="!butShow"> <div id="historyAssembly-section" v-if="!butShow">
<CaseInfo ref="caseInfo" :disabled="disabled" :showBut="showBut" :dataList="listQuery" /> <CaseInfo
ref="caseInfo"
:disabled="disabled"
:showBut="showBut"
:dataList="listQuery"
/>
</div> </div>
<div id="joblogging-section" v-if="!butShow"> <div id="joblogging-section" v-if="!butShow">
<ActualPerformance ref="actualPerformance" :disabled="disabled" :showBut="showBut" :dataList="listQuery" /> <ActualPerformance
ref="actualPerformance"
:disabled="disabled"
:showBut="showBut"
:dataList="listQuery"
/>
</div> </div>
<div id="joblogging-joblog" v-if="!butShow"> <div id="joblogging-joblog" v-if="!butShow">
<CzModel ref="czModel" :disabled="disabled" :showBut="showBut" :dataList="listQuery" /> <CzModel
ref="czModel"
:disabled="disabled"
:showBut="showBut"
:dataList="listQuery"
/>
</div> </div>
</div> </div>
</div> </div>
@ -95,100 +247,106 @@ import { getItem } from "@/utils/storage";
import { qcckGet, qcckPost, qcckPut } from "@/api/qcckApi.js"; import { qcckGet, qcckPost, qcckPut } from "@/api/qcckApi.js";
import { tbGsxtZdrySelectVoById, tbGsxtZdrySave } from "@/api/zdr.js"; import { tbGsxtZdrySelectVoById, tbGsxtZdrySave } from "@/api/zdr.js";
import AuditDialog from "./auditDialog.vue"; import AuditDialog from "./auditDialog.vue";
import ControlInfo from '../../mpvGroup/model/controlInfo.vue' import ControlInfo from "../../mpvGroup/model/controlInfo.vue";
import Info from "../model/info.vue"; import Info from "../model/info.vue";
import PersonnelTags from '../model/personnelTags.vue' import PersonnelTags from "../model/personnelTags.vue";
import Vehicle from '../model/vehicle.vue' import Vehicle from "../model/vehicle.vue";
import BackInfo from '../model/bakInfo.vue' import BackInfo from "../model/bakInfo.vue";
import Deployment from '../model/deployment.vue' import Deployment from "../model/deployment.vue";
import Contact from '../model/contact.vue' import Contact from "../model/contact.vue";
import DynamicTrajectory from '../model/dynamicTrajectory.vue' import DynamicTrajectory from "../model/dynamicTrajectory.vue";
import BehaviorInfo from '../model/behaviorInfo.vue' import BehaviorInfo from "../model/behaviorInfo.vue";
import VisitRecord from '../model/visitRecord.vue' import VisitRecord from "../model/visitRecord.vue";
import CaseInfo from '../model/caseInfo.vue' import CaseInfo from "../model/caseInfo.vue";
import ActualPerformance from '../model/actualPerformance.vue' import ActualPerformance from "../model/actualPerformance.vue";
import CzModel from '../model/czModel.vue' import CzModel from "../model/czModel.vue";
import { useRouter, useRoute } from 'vue-router' import { useRouter, useRoute } from "vue-router";
import { ref, onUnmounted, getCurrentInstance, computed, reactive } from "vue"; import { ref, onUnmounted, getCurrentInstance, computed, reactive } from "vue";
const router = useRouter() const router = useRouter();
const route = useRoute() const route = useRoute();
const { proxy } = getCurrentInstance(); const { proxy } = getCurrentInstance();
const { D_BZ_SF } = proxy.$dict("D_BZ_SF"); const { D_BZ_SF } = proxy.$dict("D_BZ_SF");
const emit = defineEmits(["updateDate"]); const emit = defineEmits(["updateDate"]);
const chooseMarksVisible = ref(false); const chooseMarksVisible = ref(false);
const dialogForm = ref(false); //弹窗 const dialogForm = ref(false); //弹窗
const loading = ref(false); const loading = ref(false);
const disabled = ref(false) const disabled = ref(false);
const showBut = ref(false) const showBut = ref(false);
const listQuery = ref({}); const listQuery = ref({});
const butShow = ref(false) const butShow = ref(false);
const title = ref('新增') const title = ref("新增");
const showData = ref(false) const showData = ref(false);
const modeType = ref("detail") const modeType = ref("detail");
const currentRowId = ref("") const currentRowId = ref("");
const auditDialogVisible = ref(false) const auditDialogVisible = ref(false);
const auditLoading = ref(false) const auditLoading = ref(false);
const auditForm = reactive({ const auditForm = reactive({
id: "", id: "",
sftg: undefined, sftg: undefined,
shBtgyy: "", shBtgyy: "",
spBtgyy: "" spBtgyy: ""
}) });
const auditRules = reactive({ const auditRules = reactive({
sftg: [{ required: true, message: "请选择是否通过", trigger: "change" }], sftg: [{ required: true, message: "请选择是否通过", trigger: "change" }],
shBtgyy: [{ required: true, message: "请输入不通过原因", trigger: "blur" }], shBtgyy: [{ required: true, message: "请输入不通过原因", trigger: "blur" }],
spBtgyy: [{ required: true, message: "请输入不通过原因", trigger: "blur" }] spBtgyy: [{ required: true, message: "请输入不通过原因", trigger: "blur" }]
}) });
const auditTitle = computed(() => modeType.value === "sp" ? "审批" : "审核") const auditTitle = computed(() => (modeType.value === "sp" ? "审批" : "审核"));
const auditReasonProp = computed(() => modeType.value === "sp" ? "spBtgyy" : "shBtgyy") const auditReasonProp = computed(() =>
const showAuditShBtn = computed(() => modeType.value === "detail" && dataListQuery.value?.zdrZt == "02") modeType.value === "sp" ? "spBtgyy" : "shBtgyy"
const showAuditSpBtn = computed(() => modeType.value === "detail" && dataListQuery.value?.zdrZt == "04") );
const showAuditShBtn = computed(
() => modeType.value === "detail" && dataListQuery.value?.zdrZt == "02"
);
const showAuditSpBtn = computed(
() => modeType.value === "detail" && dataListQuery.value?.zdrZt == "04"
);
const props = defineProps({ const props = defineProps({
rylx: { rylx: {
type: String, type: String,
default: '01' default: "01"
}, },
showButData: { showButData: {
type: Boolean, type: Boolean,
default: false default: false
}, }
}) });
const dataListQuery = ref({}) const dataListQuery = ref({});
// 初始化数据 // 初始化数据
const init = (type, row) => { const init = (type, row) => {
dialogForm.value = true; dialogForm.value = true;
modeType.value = type; modeType.value = type;
currentRowId.value = row?.id || ""; currentRowId.value = row?.id || "";
if (type == 'add') { if (type == "add") {
butShow.value = true butShow.value = true;
title.value = '新增' title.value = "新增";
disabled.value = false disabled.value = false;
showBut.value = false showBut.value = false;
listQuery.value = {} listQuery.value = {};
} else { } else {
butShow.value = false butShow.value = false;
dataListQuery.value = { ...row } dataListQuery.value = { ...row };
tbGsxtZdrySelectVoById({ id: row.id }).then(res => { tbGsxtZdrySelectVoById({ id: row.id }).then((res) => {
listQuery.value = { ...res } listQuery.value = { ...res };
}) });
if (type == 'edit') { if (type == "edit") {
showBut.value = true showBut.value = true;
disabled.value = false disabled.value = false;
title.value = '编辑' title.value = "编辑";
} else if (type == "del") { } else if (type == "del") {
disabled.value = true disabled.value = true;
showBut.value = false showBut.value = false;
title.value = '删除' title.value = "删除";
} else { } else {
disabled.value = true disabled.value = true;
showBut.value = false showBut.value = false;
title.value = '详情' title.value = "详情";
} }
} }
}; };
const activeSection = ref('info-section') const activeSection = ref("info-section");
const rightBox = ref(null) const rightBox = ref(null);
// 滚动到指定区域 // 滚动到指定区域
const scrollToSection = (sectionId) => { const scrollToSection = (sectionId) => {
const element = document.getElementById(sectionId); const element = document.getElementById(sectionId);
@ -197,21 +355,30 @@ const scrollToSection = (sectionId) => {
const elementTop = element.offsetTop; const elementTop = element.offsetTop;
rightBox.value.scrollTo({ rightBox.value.scrollTo({
top: elementTop - 150, // 减去一些偏移量，让内容更好看 top: elementTop - 150, // 减去一些偏移量，让内容更好看
behavior: 'smooth' // 平滑滚动 behavior: "smooth" // 平滑滚动
}); });
activeSection.value = sectionId; activeSection.value = sectionId;
} }
} };
// 监听滚动，更新当前激活的锚点 // 监听滚动，更新当前激活的锚点
const handleScroll = () => { const handleScroll = () => {
if (!rightBox.value) return; if (!rightBox.value) return;
const scrollPosition = rightBox.value.scrollTop + 50; const scrollPosition = rightBox.value.scrollTop + 50;
const sections = [ const sections = [
'info-section', 'backinfo-section', 'groupLabels-section', "info-section",
'character-section', 'controlInfo-section', 'featinfo-section', "backinfo-section",
'demandsInfo-section', 'requestInfo-section', 'personnel-section', "groupLabels-section",
'judgmentRecord-section', 'historyAssembly-section', 'joblogging-section', "czModel-section" "character-section",
"controlInfo-section",
"featinfo-section",
"demandsInfo-section",
"requestInfo-section",
"personnel-section",
"judgmentRecord-section",
"historyAssembly-section",
"joblogging-section",
"czModel-section"
]; ];
for (let i = sections.length - 1; i >= 0; i--) { for (let i = sections.length - 1; i >= 0; i--) {
@ -221,26 +388,26 @@ const handleScroll = () => {
break; break;
} }
} }
} };
// 监听右侧区域的滚动事件 // 监听右侧区域的滚动事件
if (typeof window !== 'undefined') { if (typeof window !== "undefined") {
window.addEventListener('load', () => { window.addEventListener("load", () => {
if (rightBox.value) { if (rightBox.value) {
rightBox.value.addEventListener('scroll', handleScroll); rightBox.value.addEventListener("scroll", handleScroll);
} }
}); });
// 组件卸载时移除事件监听 // 组件卸载时移除事件监听
onUnmounted(() => { onUnmounted(() => {
if (rightBox.value) { if (rightBox.value) {
rightBox.value.removeEventListener('scroll', handleScroll); rightBox.value.removeEventListener("scroll", handleScroll);
} }
}); });
} }
const info = ref() const info = ref();
const personnelTags = ref() const personnelTags = ref();
// 提交 // 提交
const submit = async () => { const submit = async () => {
// 使用Promise.all处理所有子组件的验证和数据获取 // 使用Promise.all处理所有子组件的验证和数据获取
@ -248,27 +415,26 @@ const submit = async () => {
info.value.throwData() info.value.throwData()
// personnelTags.value.throwData(), // personnelTags.value.throwData(),
]); ]);
tbGsxtZdrySave({ ...infoData, rylx: props.rylx }).then(res => { tbGsxtZdrySave({ ...infoData, rylx: props.rylx }).then((res) => {
proxy.$message({ proxy.$message({
message: '新增成功', message: "新增成功",
type: 'success', type: "success"
}) });
close() close();
}) });
console.log(infoData); console.log(infoData);
}; };
const butzt = ref() const butzt = ref();
const openAuditDialog = (type) => { const openAuditDialog = (type) => {
// modeType.value = type; // modeType.value = type;
butzt.value = type butzt.value = type;
auditForm.id = currentRowId.value || listQuery.value?.id || ""; auditForm.id = currentRowId.value || listQuery.value?.id || "";
auditForm.sftg = undefined; auditForm.sftg = undefined;
auditForm.shBtgyy = ""; auditForm.shBtgyy = "";
auditForm.spBtgyy = ""; auditForm.spBtgyy = "";
auditDialogVisible.value = true; auditDialogVisible.value = true;
} };
const handleAuditCancel = () => { const handleAuditCancel = () => {
auditDialogVisible.value = false; auditDialogVisible.value = false;
@ -278,24 +444,29 @@ const handleAuditCancel = () => {
auditForm.sftg = undefined; auditForm.sftg = undefined;
auditForm.shBtgyy = ""; auditForm.shBtgyy = "";
auditForm.spBtgyy = ""; auditForm.spBtgyy = "";
} };
const handleAuditSubmit = () => { const handleAuditSubmit = () => {
auditLoading.value = true; auditLoading.value = true;
const url = butzt.value === "sp" ? "/mosty-gsxt/tbGsxtZdry/updateSp" : "/mosty-gsxt/tbGsxtZdry/updateSh"; const url =
butzt.value === "sp"
? "/mosty-gsxt/tbGsxtZdry/updateSp"
: "/mosty-gsxt/tbGsxtZdry/updateSh";
const successMsg = modeType.value === "sp" ? "审批成功" : "审核成功"; const successMsg = modeType.value === "sp" ? "审批成功" : "审核成功";
qcckPost(auditForm, url).then(() => { qcckPost(auditForm, url)
proxy.$message({ .then(() => {
message: successMsg, proxy.$message({
type: 'success', message: successMsg,
type: "success"
});
auditDialogVisible.value = false;
modeType.value = "detail";
close();
}) })
auditDialogVisible.value = false; .catch(() => {
modeType.value = "detail"; auditLoading.value = false;
close(); });
}).catch(() => { };
auditLoading.value = false;
});
}
// 关闭 // 关闭
const close = () => { const close = () => {
@ -315,7 +486,7 @@ const close = () => {
auditForm.sftg = undefined; auditForm.sftg = undefined;
auditForm.shBtgyy = ""; auditForm.shBtgyy = "";
auditForm.spBtgyy = ""; auditForm.spBtgyy = "";
emit('updateDate') emit("updateDate");
}; };
defineExpose({ init }); defineExpose({ init });
@ -326,7 +497,6 @@ defineExpose({ init });
@import "~@/assets/css/element-plus.scss"; @import "~@/assets/css/element-plus.scss";
.behaviorInfo { .behaviorInfo {
margin: 0 0 10px 0; margin: 0 0 10px 0;
// padding-bottom: 10px; // padding-bottom: 10px;
border-bottom: 2px solid #409eff; border-bottom: 2px solid #409eff;
@ -337,7 +507,6 @@ defineExpose({ init });
font-weight: 600; font-weight: 600;
color: #303133; color: #303133;
} }
} }
.textContent { .textContent {
@ -426,7 +595,7 @@ defineExpose({ init });
scrollbar-color: #999 #f1f1f1; scrollbar-color: #999 #f1f1f1;
} }
::v-deep .el-tabs--card>.el-tabs__header .el-tabs__item.is-active { ::v-deep .el-tabs--card > .el-tabs__header .el-tabs__item.is-active {
color: #0072ff; color: #0072ff;
background: rgba(0, 114, 255, 0.3); background: rgba(0, 114, 255, 0.3);
} }
@ -508,7 +677,7 @@ defineExpose({ init });
} }
.anchor-list li.active::before { .anchor-list li.active::before {
content: ''; content: "";
position: absolute; position: absolute;
left: 0; left: 0;
top: 0; top: 0;
@ -526,7 +695,7 @@ defineExpose({ init });
// border: 1px solid #ebeef5; // border: 1px solid #ebeef5;
border-radius: 6px; border-radius: 6px;
.right_box>div { .right_box > div {
background-color: #f8f9fa; background-color: #f8f9fa;
border-radius: 6px; border-radius: 6px;
padding: 20px; padding: 20px;
@ -534,7 +703,7 @@ defineExpose({ init });
margin-bottom: 10px; margin-bottom: 10px;
} }
.right_box>div:hover { .right_box > div:hover {
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
} }
@ -549,7 +718,7 @@ defineExpose({ init });
} }
.right_box h3::after { .right_box h3::after {
content: ''; content: "";
position: absolute; position: absolute;
left: 0; left: 0;
bottom: -2px; bottom: -2px;
@ -607,6 +776,6 @@ defineExpose({ init });
} }
::v-deep .avatar-uploader { ::v-deep .avatar-uploader {
display: flex display: flex;
} }
</style> </style>

2
src/views/backOfficeSystem/DeploymentDisposal/mpvPeo/model/info.vue
View File

@ -111,6 +111,7 @@ const props = defineProps({
default: false default: false
} }
}); });
const emit = defineEmits(["close"]);
const rules = reactive({ const rules = reactive({
ryXm: [{ required: true, message: "请输入姓名", trigger: "blur" }], ryXm: [{ required: true, message: "请输入姓名", trigger: "blur" }],
...rule.identityCardRule({ validator: true }, "rySfzh"), //身份证校验 ...rule.identityCardRule({ validator: true }, "rySfzh"), //身份证校验
@ -345,6 +346,7 @@ const gettbGsxtZdryUpdate = () => {
message: "更新成功", message: "更新成功",
type: "success" type: "success"
}); });
emit("close");
}) })
.catch((err) => {}) .catch((err) => {})
.finally(() => { .finally(() => {

153
src/views/backOfficeSystem/PoliceIncidentMonitoring/index.vue
View File

@ -3,40 +3,70 @@
<!-- 搜索 --> <!-- 搜索 -->
<div ref="searchBox" class="mt10"> <div ref="searchBox" class="mt10">
<Search :searchArr="searchConfiger" @submit="onSearch"> <Search :searchArr="searchConfiger" @submit="onSearch">
<el-button type="primary" size="small" @click="handleAdd('add', null)">添加规则</el-button> <el-button type="primary" size="small" @click="handleAdd('add', null)"
<el-button type="danger" size="small" @click="handleRow()">批量删除</el-button> >添加规则</el-button
>
<el-button type="danger" size="small" @click="handleRow()"
>批量删除</el-button
>
</Search> </Search>
</div> </div>
<!-- 按钮组 --> <!-- 按钮组 -->
<div class="content"> <div class="content">
<!-- 表格 --> <!-- 表格 -->
<div class="margTop"> <div class="margTop">
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight" <MyTable
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth" :tableData="pageData.tableData"
@chooseData="handleChooseData"> :tableColumn="pageData.tableColumn"
:tableHeight="pageData.tableHeight"
:key="pageData.keyCount"
:tableConfiger="pageData.tableConfiger"
:controlsWidth="pageData.controlsWidth"
@chooseData="handleChooseData"
>
<template #jqdjdm="{ row }"> <template #jqdjdm="{ row }">
<DictTag :options="D_BZ_JQDJ" :tag="false" :value="row.jqdjdm"></DictTag> <DictTag
:options="D_BZ_JQDJ"
:tag="false"
:value="row.jqdjdm"
></DictTag>
</template> </template>
<template #jqzldm="{ row }"> <template #jqzldm="{ row }">
{{ getJqName(row.jqzldm) }} {{ getJqName(row.jqzldm) }}
</template> </template>
<!-- 操作 --> <!-- 操作 -->
<template #controls="{ row }"> <template #controls="{ row }">
<el-link type="primary" size="small" @click="handleGljq( row)">关联警情</el-link> <el-link type="primary" size="small" @click="handleGljq(row)"
<el-link type="primary" size="small" @click="handleAdd('edit', row)">编辑</el-link> >关联警情</el-link
<el-link type="primary" size="small" @click="handleAdd('detail', row)">详情</el-link> >
<el-link type="danger" size="small" @click="handleRow(row.id)">删除</el-link> <el-link type="primary" size="small" @click="handleAdd('edit', row)"
>编辑</el-link
>
<el-link
type="primary"
size="small"
@click="handleAdd('detail', row)"
>详情</el-link
>
<el-link type="danger" size="small" @click="handleRow(row.id)"
>删除</el-link
>
</template> </template>
</MyTable> </MyTable>
<Pages @changeNo="changeNo" @changeSize="changeSize" :tableHeight="pageData.tableHeight" :pageConfiger="{ <Pages
...pageData.pageConfiger, @changeNo="changeNo"
total: pageData.total @changeSize="changeSize"
}"></Pages> :tableHeight="pageData.tableHeight"
:pageConfiger="{
...pageData.pageConfiger,
total: pageData.total
}"
></Pages>
</div> </div>
</div> </div>
</div> </div>
<AddForm ref="addForm" @getList="getList" :dict="{ D_BZ_JQDJ, jqTree }" /> <AddForm ref="addForm" @getList="getList" :dict="{ D_BZ_JQDJ, jqTree }" />
<GljqLod v-model="gljqShow" :dict="{D_GS_BQ_DJ,JQLB}" :zdsjLod="zdsjLod" /> <GljqLod v-model="gljqShow" :dict="{ D_GS_BQ_DJ, JQLB }" :zdsjLod="zdsjLod" />
</template> </template>
<script setup> <script setup>
import MyTable from "@/components/aboutTable/MyTable.vue"; import MyTable from "@/components/aboutTable/MyTable.vue";
@ -47,26 +77,31 @@ import { reactive, ref, onMounted, getCurrentInstance } from "vue";
import GljqLod from "./gljqLod.vue"; import GljqLod from "./gljqLod.vue";
import AddForm from "./addForm.vue"; import AddForm from "./addForm.vue";
const { proxy } = getCurrentInstance(); const { proxy } = getCurrentInstance();
const { D_BZ_JQDJ ,D_GS_BQ_DJ,JQLB} = proxy.$dict("D_BZ_JQDJ","D_GS_BQ_DJ","JQLB"); const { D_BZ_JQDJ, D_GS_BQ_DJ, JQLB } = proxy.$dict(
"D_BZ_JQDJ",
"D_GS_BQ_DJ",
"JQLB"
);
const searchBox = ref(); //搜索框 const searchBox = ref(); //搜索框
const searchConfiger = ref([ const searchConfiger = ref([
{ {
label: "内容关键字", label: "内容关键字",
prop: "jqgjz", prop: "jqgjz",
placeholder: "请输入警情内容关键字", placeholder: "请输入警情内容关键字",
showType: "input", showType: "input"
}, },
{ {
label: "值班日期", label: "监测时间",
prop: "startTime", prop: "startTime",
placeholder: "请选择值班日期", placeholder: "请选择监测时间",
showType: "datetimerange", showType: "datetimerange"
}, { },
{
label: "警情等级", label: "警情等级",
prop: "jqdjdm", prop: "jqdjdm",
placeholder: "请选择警情等级", placeholder: "请选择警情等级",
showType: "select", showType: "select",
options: D_BZ_JQDJ, options: D_BZ_JQDJ
} }
]); ]);
const queryFrom = ref({}); const queryFrom = ref({});
@ -87,16 +122,26 @@ const pageData = reactive({
tableColumn: [ tableColumn: [
{ label: "规则描述", prop: "gzms", showOverflowTooltip: true }, { label: "规则描述", prop: "gzms", showOverflowTooltip: true },
{ label: "内容关键字", prop: "jqgjz", showOverflowTooltip: true }, { label: "内容关键字", prop: "jqgjz", showOverflowTooltip: true },
{ label: "警情等级", prop: "jqdjdm", showOverflowTooltip: true, showSolt: true }, {
{ label: "警情类型", prop: "jqzldm", showOverflowTooltip: true, showSolt: true }, label: "警情等级",
prop: "jqdjdm",
showOverflowTooltip: true,
showSolt: true
},
{
label: "警情类型",
prop: "jqzldm",
showOverflowTooltip: true,
showSolt: true
},
{ label: "录入人姓名", prop: "lrrXm", showOverflowTooltip: true }, { label: "录入人姓名", prop: "lrrXm", showOverflowTooltip: true },
{ label: "录入人身份证号", prop: "lrrSfzh", showOverflowTooltip: true }, { label: "录入人身份证号", prop: "lrrSfzh", showOverflowTooltip: true },
{ label: "所属部门", prop: "ssbm" }, { label: "所属部门", prop: "ssbm" }
] ]
}); });
onMounted(() => { onMounted(() => {
getJqTree() getJqTree();
getList(); getList();
tabHeightFn(); tabHeightFn();
}); });
@ -105,8 +150,8 @@ onMounted(() => {
const onSearch = (val) => { const onSearch = (val) => {
queryFrom.value = { queryFrom.value = {
...val, ...val,
startTime: val.startTime ? val.startTime[0] : '', kssj: val.startTime ? val.startTime[0] : "",
endTime: val.startTime ? val.startTime[1] : '' jssj: val.startTime ? val.startTime[1] : ""
}; };
pageData.pageConfiger.pageCurrent = 1; pageData.pageConfiger.pageCurrent = 1;
getList(); getList();
@ -125,29 +170,31 @@ const changeSize = (val) => {
const getList = () => { const getList = () => {
const promes = { const promes = {
...pageData.pageConfiger, ...pageData.pageConfiger,
...queryFrom.value, ...queryFrom.value
} };
qcckGet(promes, "/mosty-gsxt/jqjczg/getPageList").then((res) => { qcckGet(promes, "/mosty-gsxt/jqjczg/getPageList")
pageData.tableData = res.records || []; .then((res) => {
pageData.total = res.total; pageData.tableData = res.records || [];
pageData.tableConfiger.loading = false; pageData.total = res.total;
}).catch(() => { pageData.tableConfiger.loading = false;
pageData.tableConfiger.loading = false; })
}); .catch(() => {
pageData.tableConfiger.loading = false;
});
}; };
// 获取警情树 // 获取警情树
const jqTree = ref([]) const jqTree = ref([]);
const getJqTree = () => { const getJqTree = () => {
qcckGet({}, "/mosty-gsxt/lzJcjPjdb/getDictTree").then((res) => { qcckGet({}, "/mosty-gsxt/lzJcjPjdb/getDictTree").then((res) => {
jqTree.value = res jqTree.value = res;
}); });
} };
// 根据值获取警情名称 // 根据值获取警情名称
const getJqName = (value) => { const getJqName = (value) => {
if (!value || !jqTree.value || jqTree.value.length === 0) { if (!value || !jqTree.value || jqTree.value.length === 0) {
return value || ''; return value || "";
} }
const findName = (tree, targetValue) => { const findName = (tree, targetValue) => {
@ -169,20 +216,20 @@ const getJqName = (value) => {
return name || value; return name || value;
}; };
// 删除 // 删除
const ids = ref([]) const ids = ref([]);
const handleChooseData = (val) => { const handleChooseData = (val) => {
ids.value = val.map(item => item.id) ids.value = val.map((item) => item.id);
} };
const handleRow = (id) => { const handleRow = (id) => {
const promes = { const promes = {
ids: id ? [id] : ids.value ids: id ? [id] : ids.value
} };
proxy.$confirm("确定要删除？", "警告", { type: "warning" }).then(() => { proxy.$confirm("确定要删除？", "警告", { type: "warning" }).then(() => {
qcckDelete(promes, "/mosty-gsxt/jqjczg/deleteEntity").then(() => { qcckDelete(promes, "/mosty-gsxt/jqjczg/deleteEntity").then(() => {
proxy.$message({ type: "success", message: "删除成功" }); proxy.$message({ type: "success", message: "删除成功" });
getList(); getList();
}); });
}) });
}; };
// 值班操作 // 值班操作
const addForm = ref(null); const addForm = ref(null);
@ -190,21 +237,21 @@ const handleAdd = (type, row) => {
addForm.value.init(type, row); addForm.value.init(type, row);
}; };
// 关联警情 // 关联警情
const gljqShow = ref(false) const gljqShow = ref(false);
const zdsjLod = ref() const zdsjLod = ref();
const handleGljq = (row) => { const handleGljq = (row) => {
gljqShow.value = true gljqShow.value = true;
zdsjLod.value=row zdsjLod.value = row;
} };
// 表格高度计算 // 表格高度计算
const tabHeightFn = () => { const tabHeightFn = () => {
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 220; pageData.tableHeight =
window.innerHeight - searchBox.value.offsetHeight - 220;
window.onresize = function () { window.onresize = function () {
tabHeightFn(); tabHeightFn();
}; };
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

79
src/views/backOfficeSystem/fourColorManage/warningControl/centerHome/components/fkDialog.vue
View File

@ -90,6 +90,12 @@ const choosetype = ref("");
const listQuery = ref({}); const listQuery = ref({});
const formData = ref([ const formData = ref([
{ label: "发现目标状态", prop: "mbzt", type: "select", options: D_BZ_SF }, { label: "发现目标状态", prop: "mbzt", type: "select", options: D_BZ_SF },
{
label: "常控处置结果",
prop: "ckczjg",
type: "select",
options: D_YJXX_CKCZJG
},
{ {
label: "发现目标责任单位", label: "发现目标责任单位",
prop: "mbzrdwdm", prop: "mbzrdwdm",
@ -120,12 +126,7 @@ const formData = ref([
type: "select", type: "select",
options: D_YJXX_CZSSXZ options: D_YJXX_CZSSXZ
}, },
{
label: "常控处置结果",
prop: "ckczjg",
type: "select",
options: D_YJXX_CKCZJG
},
{ label: "常控立线侦察评估", prop: "cklxzcpg", type: "input" }, { label: "常控立线侦察评估", prop: "cklxzcpg", type: "input" },
{ label: "常控立线侦察依据", prop: "cklxzcpgyj", type: "input" }, { label: "常控立线侦察依据", prop: "cklxzcpgyj", type: "input" },
{ {
@ -146,39 +147,39 @@ const formData = ref([
const rules = reactive({ const rules = reactive({
mbzt: [{ required: true, message: "请选择发现目标状态", trigger: "change" }], mbzt: [{ required: true, message: "请选择发现目标状态", trigger: "change" }],
fxmbzedw: [ // fxmbzedw: [
{ required: true, message: "请选择发现目标责任单位", trigger: "change" } // { required: true, message: "请选择发现目标责任单位", trigger: "change" }
], // ]
mbzrmjxm: [ // mbzrmjxm: [
{ required: true, message: "请选择发现目标责任民警", trigger: "change" } // { required: true, message: "请选择发现目标责任民警", trigger: "change" }
], // ],
sfbr: [{ required: true, message: "请选择是否本人", trigger: "change" }], // sfbr: [{ required: true, message: "请选择是否本人", trigger: "change" }],
czsj: [{ required: true, message: "请选择处置时间", trigger: "change" }], // czsj: [{ required: true, message: "请选择处置时间", trigger: "change" }],
czdz: [{ required: true, message: "请选择处置地址", trigger: "blur" }], // czdz: [{ required: true, message: "请选择处置地址", trigger: "blur" }],
xxdz: [{ required: true, message: "请选择详细地址", trigger: "blur" }], // xxdz: [{ required: true, message: "请选择详细地址", trigger: "blur" }],
czzrdwdm: [ // czzrdwdm: [
{ required: true, message: "请选择处置责任单位", trigger: "change" } // { required: true, message: "请选择处置责任单位", trigger: "change" }
], // ],
czzrmj: [ // czzrmj: [
{ required: true, message: "请选择处置责任民警", trigger: "change" } // { required: true, message: "请选择处置责任民警", trigger: "change" }
], // ],
ckczcslx: [ // ckczcslx: [
{ required: true, message: "请选择常控处置措施类型", trigger: "change" } // { required: true, message: "请选择常控处置措施类型", trigger: "change" }
], // ],
ckczcsxl: [ // ckczcsxl: [
{ required: true, message: "请选择常控处置措施细类", trigger: "change" } // { required: true, message: "请选择常控处置措施细类", trigger: "change" }
], // ],
ckczjg: [{ required: true, message: "请输入常控处置结果", trigger: "blur" }], ckczjg: [{ required: true, message: "请输入常控处置结果", trigger: "blur" }]
cklxzcpg: [ // cklxzcpg: [
{ required: true, message: "请输入常控立线侦察评估", trigger: "blur" } // { required: true, message: "请输入常控立线侦察评估", trigger: "blur" }
], // ],
cklxzcpgyj: [ // cklxzcpgyj: [
{ required: true, message: "请输入常控立线侦察依据", trigger: "blur" } // { required: true, message: "请输入常控立线侦察依据", trigger: "blur" }
], // ],
ckzylx: [ // ckzylx: [
{ required: true, message: "请选择常控从事职业类型", trigger: "change" } // { required: true, message: "请选择常控从事职业类型", trigger: "change" }
], // ],
sfnj: [{ required: true, message: "请选择是否尿检", trigger: "change" }] // sfnj: [{ required: true, message: "请选择是否尿检", trigger: "change" }]
}); });
const title = ref(""); const title = ref("");

480
src/views/home/index.vue
View File

@ -23,7 +23,11 @@
<!-- <KeyPpersonneltypes /> --> <!-- <KeyPpersonneltypes /> -->
<MyCase /> <MyCase />
</div> </div>
<div class="commom-aside" @mouseenter="mouseEnter" @mouseleave="mouseLeave"> <div
class="commom-aside"
@mouseenter="mouseEnter"
@mouseleave="mouseLeave"
>
<div class="relative-full-height"> <div class="relative-full-height">
<transition name="flip" mode="out-in"> <transition name="flip" mode="out-in">
<div :key="'qb'" v-if="reversalPushShow" class="flip-wrapper"> <div :key="'qb'" v-if="reversalPushShow" class="flip-wrapper">
@ -42,7 +46,11 @@
<div class="commom-aside-big"> <div class="commom-aside-big">
<Calendar /> <Calendar />
</div> </div>
<div class="commom-aside-big" @mouseenter="mouseEnter" @mouseleave="mouseLeave"> <div
class="commom-aside-big"
@mouseenter="mouseEnter"
@mouseleave="mouseLeave"
>
<transition name="flip" mode="out-in"> <transition name="flip" mode="out-in">
<div :key="'qb'" v-if="reversalShow" class="flip-wrapper"> <div :key="'qb'" v-if="reversalShow" class="flip-wrapper">
<Experience @reversalPush="reversal"></Experience> <Experience @reversalPush="reversal"></Experience>
@ -72,8 +80,17 @@
</el-icon> </el-icon>
</div> </div>
<div class="icon-button notification-button"> <div class="icon-button notification-button">
<el-tooltip class="item" effect="dark" :content="showNotification ? '通知关闭' : '通知打开'" placement="bottom"> <el-tooltip
<el-icon :size="20" @click="handleOpenNotification" class="icon-top"> class="item"
effect="dark"
:content="showNotification ? '通知关闭' : '通知打开'"
placement="bottom"
>
<el-icon
:size="20"
@click="handleOpenNotification"
class="icon-top"
>
<Open v-if="showNotification" /> <Open v-if="showNotification" />
<TurnOff v-else /> <TurnOff v-else />
</el-icon> </el-icon>
@ -91,11 +108,18 @@
</div> </div>
<div class="search-container"> <div class="search-container">
<div class="search-icon"> <div class="search-icon">
<el-icon :size="20" @click="showSeatch = !showSeatch" class="icon-top"> <el-icon
:size="20"
@click="showSeatch = !showSeatch"
class="icon-top"
>
<Search /> <Search />
</el-icon> </el-icon>
</div> </div>
<div :style="{ 'width': showSeatch ? '270px' : '0' }" class="trnsitinForm"> <div
:style="{ width: showSeatch ? '270px' : '0' }"
class="trnsitinForm"
>
<el-input v-model="searchText" placeholder="请输入身份证" clearable> <el-input v-model="searchText" placeholder="请输入身份证" clearable>
<template #append> <template #append>
<el-button type="primary" @click="handleSearch">搜索</el-button> <el-button type="primary" @click="handleSearch">搜索</el-button>
@ -148,63 +172,63 @@
</template> </template>
<script setup> <script setup>
import QxsqDialog from './components/qxsqDialog.vue' import QxsqDialog from "./components/qxsqDialog.vue";
import { qcckGet, qcckPost } from "@/api/qcckApi.js"; import { qcckGet, qcckPost } from "@/api/qcckApi.js";
import { ref, onMounted, onUnmounted, getCurrentInstance } from 'vue' import { ref, onMounted, onUnmounted, getCurrentInstance } from "vue";
import PeoDialog from './components/peoDialog.vue' import PeoDialog from "./components/peoDialog.vue";
import LeftDialog from './dialog/leftDialog' import LeftDialog from "./dialog/leftDialog";
import GdMap from "@/components/GdMap/index.vue"; import GdMap from "@/components/GdMap/index.vue";
import Head from './layout/head.vue' import Head from "./layout/head.vue";
import DbCount from './model/dbCount.vue' import DbCount from "./model/dbCount.vue";
import QbsbCount from './model/qbsbCount.vue' import QbsbCount from "./model/qbsbCount.vue";
import QblyType from './model/qblyType.vue' import QblyType from "./model/qblyType.vue";
import TextType from './model/textType.vue' import TextType from "./model/textType.vue";
import Bkcz from './model/bkcz.vue' import Bkcz from "./model/bkcz.vue";
import SevenWarning from './model/sevenWarning.vue' import SevenWarning from "./model/sevenWarning.vue";
// import WarningLevels from './model/warningLevels.vue' // import WarningLevels from './model/warningLevels.vue'
import BkWarning from './model/bkWarning.vue' import BkWarning from "./model/bkWarning.vue";
import Yszs from './model/yszs.vue' import Yszs from "./model/yszs.vue";
import DeployControl from './model/deployControl.vue'; import DeployControl from "./model/deployControl.vue";
import Experience from './model/experience.vue' import Experience from "./model/experience.vue";
import Calendar from './model/calendar.vue' import Calendar from "./model/calendar.vue";
import KeyPpersonneltypes from './model/keyPpersonneltypes.vue' import KeyPpersonneltypes from "./model/keyPpersonneltypes.vue";
import WarningDistrict from './model/WarningDistrict.vue' import WarningDistrict from "./model/WarningDistrict.vue";
import WarningPoints from './model/warningPoints.vue' import WarningPoints from "./model/warningPoints.vue";
import { getItem, setItem } from "@/utils/storage"; import { getItem, setItem } from "@/utils/storage";
import emitter from "@/utils/eventBus.js"; import emitter from "@/utils/eventBus.js";
import { bm } from '@/views/backOfficeSystem/IntelligentControl/DeploymentArea/xzqh.js' import { bm } from "@/views/backOfficeSystem/IntelligentControl/DeploymentArea/xzqh.js";
import Judgment from './model/judgment.vue' import Judgment from "./model/judgment.vue";
import { tbYjxxGetList } from '@/api/zdr.js' import { tbYjxxGetList } from "@/api/zdr.js";
import GeneralWindow from './model/generalWindow.vue' import GeneralWindow from "./model/generalWindow.vue";
import { timeValidate } from '@/utils/tools.js' import { timeValidate } from "@/utils/tools.js";
import Statistics from './model/statistics.vue' import Statistics from "./model/statistics.vue";
import MyCase from './model/myCase.vue' import MyCase from "./model/myCase.vue";
// 导入音频播放器工具类 // 导入音频播放器工具类
import audioPlayer from '@/utils/audioPlayer' import audioPlayer from "@/utils/audioPlayer";
import TestDiv from "@/components/common/TestDiv.vue"; import TestDiv from "@/components/common/TestDiv.vue";
import router from '../../router'; import router from "../../router";
import JobLog from './dialog/jobLog.vue' import JobLog from "./dialog/jobLog.vue";
const { proxy } = getCurrentInstance(); const { proxy } = getCurrentInstance();
const modelWarning = ref(true) const modelWarning = ref(true);
const modelQbsb = ref(true) const modelQbsb = ref(true);
const searchText = ref('') const searchText = ref("");
const peoDialogRef = ref() const peoDialogRef = ref();
const showSeatch = ref(false) const showSeatch = ref(false);
const ispLayBack = ref(true)//播放音频 const ispLayBack = ref(true); //播放音频
const indexNum = ref(0) //当前展示的气泡框 const indexNum = ref(0); //当前展示的气泡框
const showNotification = ref(false) //是否自动展开提示 const showNotification = ref(false); //是否自动展开提示
const allDep = ref([]) //所有部门 const allDep = ref([]); //所有部门
const bnTimer = ref(null) const bnTimer = ref(null);
const popupTimer = ref(null) const popupTimer = ref(null);
const timing = ref(true) const timing = ref(true);
const reversalPushShow = ref(true)// 情报翻转 const reversalPushShow = ref(true); // 情报翻转
const reversalShow = ref(true)// 论坛翻转 const reversalShow = ref(true); // 论坛翻转
const changeXzqh = (val, trg) => { const changeXzqh = (val, trg) => {
setTimeout(() => { setTimeout(() => {
// 先移除已有的边界 // 先移除已有的边界
emitter.emit('removeBj') emitter.emit("removeBj");
if (trg) { if (trg) {
// 如果传入的是多个区域数据（二维数组） // 如果传入的是多个区域数据（二维数组）
const features = val.map((area, index) => ({ const features = val.map((area, index) => ({
@ -214,23 +238,22 @@ const changeXzqh = (val, trg) => {
}, },
properties: {}, properties: {},
type: "Feature" type: "Feature"
})) }));
// 循环为每个区域创建单独的多边形，这样可以设置不同的样式 // 循环为每个区域创建单独的多边形，这样可以设置不同的样式
features.forEach((feature, index) => { features.forEach((feature, index) => {
emitter.emit('setBoundarys', { emitter.emit("setBoundarys", {
data: { data: {
type: "FeatureCollection", type: "FeatureCollection",
features: [feature] features: [feature]
}, },
color: 'rgba(209, 112, 65, 0.8)', color: "rgba(209, 112, 65, 0.8)",
fillColor: 'rgba(255, 255, 255,0)', fillColor: "rgba(255, 255, 255,0)",
outLineWidth: 2, outLineWidth: 2
}) });
}) });
} else { } else {
// 保持原来的逻辑，处理单个区域 // 保持原来的逻辑，处理单个区域
emitter.emit('setBoundarys', { emitter.emit("setBoundarys", {
data: { data: {
type: "FeatureCollection", type: "FeatureCollection",
features: [ features: [
@ -244,185 +267,237 @@ const changeXzqh = (val, trg) => {
} }
] ]
}, },
color: 'rgba(209 112 65,1)', color: "rgba(209 112 65,1)",
fillColor: 'rgba(255, 255, 255,0)', fillColor: "rgba(255, 255, 255,0)"
}) });
} }
}, 3000) }, 3000);
} };
const getDepId = () => { const getDepId = () => {
const deptId = getItem('deptId') const deptId = getItem("deptId");
const deptLevel = deptId[0].deptLevel ? deptId[0].deptLevel : null const deptLevel = deptId[0].deptLevel ? deptId[0].deptLevel : null;
const deptCode = deptId[0].deptCode ? deptId[0].deptCode : null const deptCode = deptId[0].deptCode ? deptId[0].deptCode : null;
if (deptLevel.startsWith('2')) { if (deptLevel.startsWith("2")) {
const data = Object.values(bm).map(item => item); const data = Object.values(bm).map((item) => item);
changeXzqh(data, true) changeXzqh(data, true);
} else { } else {
switch (deptCode) { switch (deptCode) {
case '54040200000'://巴宜区 case "54040200000": //巴宜区
changeXzqh(bm[542621]) changeXzqh(bm[542621]);
break; break;
case '54042400000'://波密县 case "54042400000": //波密县
changeXzqh(bm[542625]) changeXzqh(bm[542625]);
break; break;
case '54042500000'://察隅县 case "54042500000": //察隅县
changeXzqh(bm[542626]) changeXzqh(bm[542626]);
break; break;
case '54042100000'://工布江达县 case "54042100000": //工布江达县
changeXzqh(bm[542622]) changeXzqh(bm[542622]);
break; break;
case '54042600000'://朗县 case "54042600000": //朗县
changeXzqh(bm[542627]) changeXzqh(bm[542627]);
break; break;
case '54042200000'://米林县 case "54042200000": //米林县
changeXzqh(bm[542623]) changeXzqh(bm[542623]);
break; break;
case '54042300000'://墨脱县 case "54042300000": //墨脱县
changeXzqh(bm[542624]) changeXzqh(bm[542624]);
break; break;
default: default:
const data = Object.values(bm).map(item => item); const data = Object.values(bm).map((item) => item);
changeXzqh(data, true) changeXzqh(data, true);
break; break;
} }
} }
} };
const handleOpenNotification = () => { const handleOpenNotification = () => {
clearInterval(popupTimer.value) clearInterval(popupTimer.value);
showNotification.value = !showNotification.value; showNotification.value = !showNotification.value;
emitter.emit('deletePointArea', 'hm_pop') emitter.emit("deletePointArea", "hm_pop");
if (showNotification.value) { if (showNotification.value) {
// 主动展开提示，默认展示所有 // 主动展开提示，默认展示所有
allDep.value.forEach(item => { allDep.value.forEach((item) => {
emitter.emit("makerPopup", { data: item, flag: "hm_pop", type: 'Custom' }); emitter.emit("makerPopup", {
}) data: item,
flag: "hm_pop",
type: "Custom"
});
});
} else { } else {
// 关闭主动展开后，恢复循环单条气泡展示 // 关闭主动展开后，恢复循环单条气泡展示
startPopupLoop() startPopupLoop();
} }
} };
const makerCenter = () => { const makerCenter = () => {
const dw = require("@/assets/point/dingwei.png") const dw = require("@/assets/point/dingwei.png");
qcckGet({}, '/mosty-gsxt/lzJcjPjdb/selectCountNew').then(res => { qcckGet({}, "/mosty-gsxt/lzJcjPjdb/selectCountNew").then((res) => {
let list = res || []; let list = res || [];
allDep.value = list; allDep.value = list;
emitter.emit("addPointArea", { coords: list, icon: dw, flag: "hm", size: '14px', showTitle: false, offset: [0, -25] }); emitter.emit("addPointArea", {
}) coords: list,
icon: dw,
} flag: "hm",
size: "14px",
showTitle: false,
offset: [0, -25]
});
});
};
// 关闭播放 // 关闭播放
const closeLayBack = () => { const closeLayBack = () => {
ispLayBack.value = false ispLayBack.value = false;
audioPlayer.pause() audioPlayer.pause();
} };
// 初始化音频播放器 // 初始化音频播放器
const initAudioPlayer = () => { const initAudioPlayer = () => {
// 使用工具类初始化音频播放器 // 使用工具类初始化音频播放器
audioPlayer.init(require('@/assets/images/yjsy.mp3')) audioPlayer
.init(require("@/assets/images/yjsy.mp3"))
.then(() => { .then(() => {
console.log('音频播放器初始化成功'); console.log("音频播放器初始化成功");
// 只有当ispLayBack为true时才播放 // 只有当ispLayBack为true时才播放
if (ispLayBack.value) { if (ispLayBack.value) {
audioPlayer.muted = false audioPlayer.muted = false;
} }
}) })
.catch(error => { .catch((error) => {
console.error('初始化音频播放器失败:', error); console.error("初始化音频播放器失败:", error);
}) });
} };
const startPopupLoop = () => { const startPopupLoop = () => {
clearInterval(popupTimer.value) clearInterval(popupTimer.value);
popupTimer.value = setInterval(() => { popupTimer.value = setInterval(() => {
if (!showNotification.value && allDep.value.length > 0) { if (!showNotification.value && allDep.value.length > 0) {
emitter.emit('deletePointArea', 'hm_pop') emitter.emit("deletePointArea", "hm_pop");
emitter.emit("makerPopup", { data: allDep.value[indexNum.value], flag: "hm_pop", type: 'Custom' }) emitter.emit("makerPopup", {
indexNum.value = (indexNum.value + 1) % allDep.value.length data: allDep.value[indexNum.value],
flag: "hm_pop",
type: "Custom"
});
indexNum.value = (indexNum.value + 1) % allDep.value.length;
} }
}, 10000) }, 10000);
} };
// 搜索 // 搜索
const handleSearch = () => { const handleSearch = () => {
if (!searchText.value) return proxy.$message.warning('请输入身份证号'); if (!searchText.value) return proxy.$message.warning("请输入身份证号");
qcckPost({ rysfzh: searchText.value }, '/mosty-gsxt/tbYjxx/getPageAllList').then(res => { qcckPost(
peoDialogRef.value.init(res.records || []) { rysfzh: searchText.value },
}) "/mosty-gsxt/tbYjxx/getPageAllList"
} ).then((res) => {
peoDialogRef.value.init(res.records || []);
});
};
// 布控预警上图 // 布控预警上图
const getTbYjxxGetList = () => { const getTbYjxxGetList = () => {
// 设置为当天时间范围：00:00:00 到 23:59:59 // 设置为当天时间范围：00:00:00 到 23:59:59
const today = new Date(); const today = new Date();
const startTime = new Date(today.getFullYear(), today.getMonth(), today.getDate(), 0, 0, 0).getTime(); const startTime = new Date(
const endTime = new Date(today.getFullYear(), today.getMonth(), today.getDate(), 23, 59, 59).getTime(); today.getFullYear(),
const promes = { startTime: timeValidate(startTime), endTime: timeValidate(endTime), } today.getMonth(),
tbYjxxGetList(promes).then(res => { today.getDate(),
const coords = res.map(item => { 0,
return { id: item.id, jd: item.jd, wd: item.wd, yjtp: item.yjTp, yjnr: item.yjNr, yjLx: item.yjlx, yjlx: '01', yjsj: item.yjSj, rysfzh: item.yjRysfzh, ryxm: item.yjRyxm } 0,
}) 0
const icon = require("@/assets/point/yj.png") ).getTime();
emitter.emit('addPoint', { coords: coords, icon: icon, flag: 'yj', fontColor: '#FF0000' }) const endTime = new Date(
}) today.getFullYear(),
} today.getMonth(),
today.getDate(),
23,
59,
59
).getTime();
const promes = {
startTime: timeValidate(startTime),
endTime: timeValidate(endTime)
};
tbYjxxGetList(promes).then((res) => {
const coords = res.map((item) => {
return {
id: item.id,
jd: item.jd,
wd: item.wd,
yjtp: item.yjTp,
yjnr: item.yjNr,
yjLx: item.yjlx,
yjlx: "01",
yjsj: item.yjSj,
rysfzh: item.yjRysfzh,
ryxm: item.yjRyxm
};
});
const icon = require("@/assets/point/yj.png");
emitter.emit("addPoint", {
coords: coords,
icon: icon,
flag: "yj",
fontColor: "#FF0000"
});
});
};
const reversalPush = () => { const reversalPush = () => {
reversalPushShow.value = !reversalPushShow.value reversalPushShow.value = !reversalPushShow.value;
// 移除clearInterval调用，避免定时器被清除 // 移除clearInterval调用，避免定时器被清除
} };
const reversal = () => { const reversal = () => {
reversalShow.value = !reversalShow.value reversalShow.value = !reversalShow.value;
// 移除clearInterval调用，避免定时器被清除 // 移除clearInterval调用，避免定时器被清除
} };
// 鼠标移入 // 鼠标移入
const mouseEnter = () => { const mouseEnter = () => {
clearInterval(timing.value) clearInterval(timing.value);
} };
// 鼠标移出 // 鼠标移出
const mouseLeave = () => { const mouseLeave = () => {
// 清除可能存在的旧定时器，避免多个定时器同时运行 // 清除可能存在的旧定时器，避免多个定时器同时运行
clearInterval(timing.value) clearInterval(timing.value);
// 设置为5秒自动切换，更容易测试效果 // 设置为5秒自动切换，更容易测试效果
timing.value = setInterval(() => { timing.value = setInterval(() => {
reversalPush() reversalPush();
reversal() reversal();
changeModel() changeModel();
}, 30000) }, 30000);
} };
function changeModel() { function changeModel() {
modelWarning.value = !modelWarning.value modelWarning.value = !modelWarning.value;
} }
// 组件挂载时初始化音频播放器 // 组件挂载时初始化音频播放器
onMounted(() => { onMounted(() => {
getDepId() getDepId();
makerCenter() makerCenter();
bnTimer.value = setInterval(() => { bnTimer.value = setInterval(() => {
makerCenter() makerCenter();
}, 60000) }, 60000);
startPopupLoop() startPopupLoop();
mouseLeave() mouseLeave();
getTbYjxxGetList() getTbYjxxGetList();
// 初始化音频播放器 // 初始化音频播放器
initAudioPlayer() initAudioPlayer();
// 监听音频播放事件，获取WebSocket消息数据 // 监听音频播放事件，获取WebSocket消息数据
emitter.on("openYp", (newsDate) => { emitter.on("openYp", (newsDate) => {
// 使用工具类播放音频，自动处理静音切换 // 使用工具类播放音频，自动处理静音切换
if (ispLayBack.value) { if (ispLayBack.value) {
audioPlayer.play() audioPlayer
.play()
.then(() => { .then(() => {
console.log('WebSocket触发音频播放成功'); console.log("WebSocket触发音频播放成功");
})
.catch(error => {
console.error('WebSocket触发音频播放失败:', error);
}) })
.catch((error) => {
console.error("WebSocket触发音频播放失败:", error);
});
const coords = { const coords = {
id: newsDate.id, id: newsDate.id,
jd: newsDate.jd, jd: newsDate.jd,
@ -430,37 +505,86 @@ onMounted(() => {
yjtp: newsDate.yjTp, yjtp: newsDate.yjTp,
yjnr: newsDate.yjNr, yjnr: newsDate.yjNr,
yjLx: newsDate.yjlx, yjLx: newsDate.yjlx,
yjlx: '01', yjlx: "01",
yjsj: newsDate.yjSj, yjsj: newsDate.yjSj,
rysfzh: newsDate.yjRysfzh, rysfzh: newsDate.yjRysfzh,
ryxm: newsDate.yjRyxm, ryxm: newsDate.yjRyxm
} };
const icons = require("@/assets/point/jq.png") const icons = require("@/assets/point/jq.png");
emitter.emit('addPointArea', { coords: [{ jd: coords.jd, wd: coords.wd }], icon: icons, flag: 'yjs' }) emitter.emit("addPointArea", {
emitter.emit('yjDetail', coords) coords: [{ jd: coords.jd, wd: coords.wd }],
icon: icons,
flag: "yjs"
});
emitter.emit("yjDetail", coords);
} }
}) });
emitter.on("closeYp", () => { emitter.on("closeYp", () => {
audioPlayer.pause() audioPlayer.pause();
}) });
}) });
onUnmounted(() => { onUnmounted(() => {
clearInterval(timing.value) clearInterval(timing.value);
clearInterval(bnTimer.value) clearInterval(bnTimer.value);
clearInterval(popupTimer.value) clearInterval(popupTimer.value);
// 清理自动刷新定时器和事件监听
if (refreshTimer.value) {
clearTimeout(refreshTimer.value);
}
document.removeEventListener("mousemove", handleMouseActivity);
document.removeEventListener("mousedown", handleMouseActivity);
document.removeEventListener("keypress", handleMouseActivity);
document.removeEventListener("touchstart", handleMouseActivity);
document.removeEventListener("scroll", handleMouseActivity);
// 组件卸载时停止音频播放并释放资源 // 组件卸载时停止音频播放并释放资源
if (audioPlayer) audioPlayer.destroy(); if (audioPlayer) audioPlayer.destroy();
}) });
const mapNavigationShowOk = () => { const mapNavigationShowOk = () => {
router.push({ path: '/mapNavigation' }) router.push({ path: "/mapNavigation" });
} };
// 岗位日志 // 岗位日志
const jobLogShow = ref(false) const jobLogShow = ref(false);
const jobLogShowOpen = () => { const jobLogShowOpen = () => {
jobLogShow.value = true jobLogShow.value = true;
} };
// ============================================
// 自动刷新定时器逻辑
// 功能：鼠标无动作15分钟则自动刷新整个页面
// ============================================
const refreshTimer = ref(null); // 自动刷新定时器
const IDLE_TIMEOUT = 15 * 60 * 1000; // 15分钟 = 900000毫秒
// 重置定时器（鼠标有动作时调用）
const resetRefreshTimer = () => {
if (refreshTimer.value) {
clearTimeout(refreshTimer.value);
}
refreshTimer.value = setTimeout(() => {
// 定时器到期，刷新整个页面
window.location.reload();
}, IDLE_TIMEOUT);
};
// 鼠标事件监听器
const handleMouseActivity = () => {
resetRefreshTimer();
};
// 在组件挂载时启动定时器
resetRefreshTimer();
// 添加鼠标事件监听
document.addEventListener("mousemove", handleMouseActivity);
document.addEventListener("mousedown", handleMouseActivity);
document.addEventListener("keypress", handleMouseActivity);
document.addEventListener("touchstart", handleMouseActivity);
document.addEventListener("scroll", handleMouseActivity);
// ============================================
// 自动刷新定时器逻辑结束
// ============================================
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@ -619,7 +743,7 @@ const jobLogShowOpen = () => {
} }
/* 收缩时只显示第一个图标，隐藏其他内容 */ /* 收缩时只显示第一个图标，隐藏其他内容 */
.badge-content:not(.expanded)> :not(:first-child) { .badge-content:not(.expanded) > :not(:first-child) {
opacity: 0; opacity: 0;
max-height: 0; max-height: 0;
margin: 0; margin: 0;

91
src/views/home/model/textType.vue
View File

@ -1,9 +1,15 @@
<template> <template>
<div class="comom-title"> <div class="comom-title">
<div style=" width: 100%;" class="title">信息来源类型统计<span class="switchover" @click="reversalPush">切换</span></div> <div style="width: 100%" class="title">
<el-popover placement="right" :width="430" :visible="visible"> 信息来源类型统计<span class="switchover" @click="reversalPush">切换</span>
</div>
<el-popover placement="right" :width="430" :visible="visible">
<template #reference> <template #reference>
<div class="title" style="position: relative;z-index: 10000;height: 40px;width: 40px;" @click="visible = true"></div> <div
class="title"
style="position: relative; z-index: 10000; height: 40px; width: 40px"
@click="visible = true"
></div>
</template> </template>
<div> <div>
<div class="qbltData"> <div class="qbltData">
@ -14,81 +20,96 @@
</div> </div>
</el-popover> </el-popover>
</div> </div>
<div class="comom-cnt" > <div class="comom-cnt">
<BarHatEcharts echartsId="qbltBoxs" :autoTooltip="true" :data="list" ></BarHatEcharts> <BarHatEcharts
echartsId="qbltBoxs"
:autoTooltip="true"
:data="list"
></BarHatEcharts>
</div> </div>
</template> </template>
<script setup> <script setup>
import { qcckPost,qcckGet } from "@/api/qcckApi.js"; import { qcckPost, qcckGet } from "@/api/qcckApi.js";
import BarHatEcharts from "@/views/home/echarts/barHatEcharts.vue"; import BarHatEcharts from "@/views/home/echarts/barHatEcharts.vue";
import { onMounted, reactive, ref } from "vue"; import { onMounted, reactive, ref } from "vue";
import TimeData from '@/views/home/model/mesgSwitch/timeData.vue' import TimeData from "@/views/home/model/mesgSwitch/timeData.vue";
const list = ref({ const list = ref({
xDate: ['共享','内部','林安码'], xDate: ["共享", "内部", "林安码", "蜂群"],
list:[{ name: "总数", value: [0,0,0] ,color:['rgba(0,244,255,1)','rgba(0,77,167,1)'] ,hatColor:'#087df9'}], list: [
{
name: "总数",
value: [0, 0, 0, 0],
color: ["rgba(0,244,255,1)", "rgba(0,77,167,1)"],
hatColor: "#087df9"
}
]
// xDate: ['上访','诈骗','敲诈勒索','盗窃'], // xDate: ['上访','诈骗','敲诈勒索','盗窃'],
// list:[{ name: "总数", value: [0,0,0,0] ,color:['rgba(0,244,255,1)','rgba(0,77,167,1)'] ,hatColor:'#087df9'}], // list:[{ name: "总数", value: [0,0,0,0] ,color:['rgba(0,244,255,1)','rgba(0,77,167,1)'] ,hatColor:'#087df9'}],
}) });
onMounted(() => { onMounted(() => {
getCount() getCount();
}); });
const listQuery = ref() const listQuery = ref();
const getCount = () => { const getCount = () => {
const promes = { const promes = {
startTime: listQuery.value?.startTime || "", startTime: listQuery.value?.startTime || "",
endTime: listQuery.value?.endTime || "" endTime: listQuery.value?.endTime || ""
} };
qcckGet(promes, '/mosty-gsxt/xxcj/xxlylx').then(res => { qcckGet(promes, "/mosty-gsxt/xxcj/xxlylx").then((res) => {
list.value.list[0].value = [res.gxxx || 0,res.nbxx || 0,res.lam || 0] list.value.list[0].value = [
}) res.gxxx || 0,
res.nbxx || 0,
res.lam || 0,
res.fqxx || 0
];
});
// qcckPost(promes, '/mosty-gsxt/qbcj/getXscjTjBySszt').then(res => { // qcckPost(promes, '/mosty-gsxt/qbcj/getXscjTjBySszt').then(res => {
// list.value.xDate = res ? res.map(v=> v.zdmc):[]; // list.value.xDate = res ? res.map(v=> v.zdmc):[];
// list.value.list[0].value = res ? res.map(v => v.count) : [0, 0, 0, 0]; // list.value.list[0].value = res ? res.map(v => v.count) : [0, 0, 0, 0];
// console.log(list.value); // console.log(list.value);
// }) // })
} };
const visible = ref(false) const visible = ref(false);
const changeTime = (val) => { const changeTime = (val) => {
listQuery.value = { listQuery.value = {
...val ...val
} };
getCount() getCount();
} };
const emit = defineEmits(['reversalPush']) const emit = defineEmits(["reversalPush"]);
const reversalPush = () => { const reversalPush = () => {
emit('reversalPush') emit("reversalPush");
} };
const close = () => { const close = () => {
visible.value = false visible.value = false;
} };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@import "@/assets/css/homeScreen.scss"; @import "@/assets/css/homeScreen.scss";
.qbltBox { .qbltBox {
height: 100%; height: 100%;
background: rgba(0,29,75,0.6); background: rgba(0, 29, 75, 0.6);
border-radius: 0 0 4px 4px; border-radius: 0 0 4px 4px;
} }
.qbltData { .qbltData {
width: 100%; width: 100%;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
padding: 0 10px 10px padding: 0 10px 10px;
} }
.close { .close {
cursor: pointer; cursor: pointer;
} }
.switchover{ .switchover {
cursor: pointer; cursor: pointer;
font-size: 14px; font-size: 14px;
margin-left: 20px; margin-left: 20px;
color: rgb(255, 146, 4); color: rgb(255, 146, 4);
width: 100%; width: 100%;
margin-left: 10%; margin-left: 10%;
} }
</style> </style>