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

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

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

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

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

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

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

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

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

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

@ -3,40 +3,70 @@
<!-- 搜索 -->
<div ref="searchBox" class="mt10">
<Search :searchArr="searchConfiger" @submit="onSearch">
<el-button type="primary" size="small" @click="handleAdd('add', null)">添加规则</el-button>
<el-button type="danger" size="small" @click="handleRow()">批量删除</el-button>
<el-button type="primary" size="small" @click="handleAdd('add', null)"
>添加规则</el-button
>
<el-button type="danger" size="small" @click="handleRow()"
>批量删除</el-button
>
</Search>
</div>
<!-- 按钮组 -->
<div class="content">
<!-- 表格 -->
<div class="margTop">
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth"
@chooseData="handleChooseData">
<MyTable
:tableData="pageData.tableData"
:tableColumn="pageData.tableColumn"
:tableHeight="pageData.tableHeight"
:key="pageData.keyCount"
:tableConfiger="pageData.tableConfiger"
:controlsWidth="pageData.controlsWidth"
@chooseData="handleChooseData"
>
<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 #jqzldm="{ row }">
{{ getJqName(row.jqzldm) }}
</template>
<!-- 操作 -->
<template #controls="{ row }">
<el-link type="primary" size="small" @click="handleGljq( row)">关联警情</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>
<el-link type="primary" size="small" @click="handleGljq(row)"
>关联警情</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>
</MyTable>
<Pages @changeNo="changeNo" @changeSize="changeSize" :tableHeight="pageData.tableHeight" :pageConfiger="{
...pageData.pageConfiger,
total: pageData.total
}"></Pages>
<Pages
@changeNo="changeNo"
@changeSize="changeSize"
:tableHeight="pageData.tableHeight"
:pageConfiger="{
...pageData.pageConfiger,
total: pageData.total
}"
></Pages>
</div>
</div>
</div>
<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>
<script setup>
import MyTable from "@/components/aboutTable/MyTable.vue";
@ -47,26 +77,31 @@ import { reactive, ref, onMounted, getCurrentInstance } from "vue";
import GljqLod from "./gljqLod.vue";
import AddForm from "./addForm.vue";
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 searchConfiger = ref([
{
label: "内容关键字",
prop: "jqgjz",
placeholder: "请输入警情内容关键字",
showType: "input",
showType: "input"
},
{
label: "值班日期",
label: "监测时间",
prop: "startTime",
placeholder: "请选择值班日期",
showType: "datetimerange",
}, {
placeholder: "请选择监测时间",
showType: "datetimerange"
},
{
label: "警情等级",
prop: "jqdjdm",
placeholder: "请选择警情等级",
showType: "select",
options: D_BZ_JQDJ,
options: D_BZ_JQDJ
}
]);
const queryFrom = ref({});
@ -87,16 +122,26 @@ const pageData = reactive({
tableColumn: [
{ label: "规则描述", prop: "gzms", 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: "lrrSfzh", showOverflowTooltip: true },
{ label: "所属部门", prop: "ssbm" },
{ label: "所属部门", prop: "ssbm" }
]
});
onMounted(() => {
getJqTree()
getJqTree();
getList();
tabHeightFn();
});
@ -105,8 +150,8 @@ onMounted(() => {
const onSearch = (val) => {
queryFrom.value = {
...val,
startTime: val.startTime ? val.startTime[0] : '',
endTime: val.startTime ? val.startTime[1] : ''
kssj: val.startTime ? val.startTime[0] : "",
jssj: val.startTime ? val.startTime[1] : ""
};
pageData.pageConfiger.pageCurrent = 1;
getList();
@ -125,29 +170,31 @@ const changeSize = (val) => {
const getList = () => {
const promes = {
...pageData.pageConfiger,
...queryFrom.value,
}
qcckGet(promes, "/mosty-gsxt/jqjczg/getPageList").then((res) => {
pageData.tableData = res.records || [];
pageData.total = res.total;
pageData.tableConfiger.loading = false;
}).catch(() => {
pageData.tableConfiger.loading = false;
});
...queryFrom.value
};
qcckGet(promes, "/mosty-gsxt/jqjczg/getPageList")
.then((res) => {
pageData.tableData = res.records || [];
pageData.total = res.total;
pageData.tableConfiger.loading = false;
})
.catch(() => {
pageData.tableConfiger.loading = false;
});
};
// 获取警情树
const jqTree = ref([])
const jqTree = ref([]);
const getJqTree = () => {
qcckGet({}, "/mosty-gsxt/lzJcjPjdb/getDictTree").then((res) => {
jqTree.value = res
jqTree.value = res;
});
}
};
// 根据值获取警情名称
const getJqName = (value) => {
if (!value || !jqTree.value || jqTree.value.length === 0) {
return value || '';
return value || "";
}
const findName = (tree, targetValue) => {
@ -169,20 +216,20 @@ const getJqName = (value) => {
return name || value;
};
// 删除
const ids = ref([])
const ids = ref([]);
const handleChooseData = (val) => {
ids.value = val.map(item => item.id)
}
ids.value = val.map((item) => item.id);
};
const handleRow = (id) => {
const promes = {
ids: id ? [id] : ids.value
}
};
proxy.$confirm("确定要删除？", "警告", { type: "warning" }).then(() => {
qcckDelete(promes, "/mosty-gsxt/jqjczg/deleteEntity").then(() => {
proxy.$message({ type: "success", message: "删除成功" });
getList();
});
})
});
};
// 值班操作
const addForm = ref(null);
@ -190,21 +237,21 @@ const handleAdd = (type, row) => {
addForm.value.init(type, row);
};
// 关联警情
const gljqShow = ref(false)
const zdsjLod = ref()
const gljqShow = ref(false);
const zdsjLod = ref();
const handleGljq = (row) => {
gljqShow.value = true
zdsjLod.value=row
}
gljqShow.value = true;
zdsjLod.value = row;
};
// 表格高度计算
const tabHeightFn = () => {
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 220;
pageData.tableHeight =
window.innerHeight - searchBox.value.offsetHeight - 220;
window.onresize = function () {
tabHeightFn();
};
};
</script>
<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 formData = ref([
{ label: "发现目标状态", prop: "mbzt", type: "select", options: D_BZ_SF },
{
label: "常控处置结果",
prop: "ckczjg",
type: "select",
options: D_YJXX_CKCZJG
},
{
label: "发现目标责任单位",
prop: "mbzrdwdm",
@ -120,12 +126,7 @@ const formData = ref([
type: "select",
options: D_YJXX_CZSSXZ
},
{
label: "常控处置结果",
prop: "ckczjg",
type: "select",
options: D_YJXX_CKCZJG
},
{ label: "常控立线侦察评估", prop: "cklxzcpg", type: "input" },
{ label: "常控立线侦察依据", prop: "cklxzcpgyj", type: "input" },
{
@ -146,39 +147,39 @@ const formData = ref([
const rules = reactive({
mbzt: [{ required: true, message: "请选择发现目标状态", trigger: "change" }],
fxmbzedw: [
{ required: true, message: "请选择发现目标责任单位", trigger: "change" }
],
mbzrmjxm: [
{ required: true, message: "请选择发现目标责任民警", trigger: "change" }
],
sfbr: [{ required: true, message: "请选择是否本人", trigger: "change" }],
czsj: [{ required: true, message: "请选择处置时间", trigger: "change" }],
czdz: [{ required: true, message: "请选择处置地址", trigger: "blur" }],
xxdz: [{ required: true, message: "请选择详细地址", trigger: "blur" }],
czzrdwdm: [
{ required: true, message: "请选择处置责任单位", trigger: "change" }
],
czzrmj: [
{ required: true, message: "请选择处置责任民警", trigger: "change" }
],
ckczcslx: [
{ required: true, message: "请选择常控处置措施类型", trigger: "change" }
],
ckczcsxl: [
{ required: true, message: "请选择常控处置措施细类", trigger: "change" }
],
ckczjg: [{ required: true, message: "请输入常控处置结果", trigger: "blur" }],
cklxzcpg: [
{ required: true, message: "请输入常控立线侦察评估", trigger: "blur" }
],
cklxzcpgyj: [
{ required: true, message: "请输入常控立线侦察依据", trigger: "blur" }
],
ckzylx: [
{ required: true, message: "请选择常控从事职业类型", trigger: "change" }
],
sfnj: [{ required: true, message: "请选择是否尿检", trigger: "change" }]
// fxmbzedw: [
// { required: true, message: "请选择发现目标责任单位", trigger: "change" }
// ]
// mbzrmjxm: [
// { required: true, message: "请选择发现目标责任民警", trigger: "change" }
// ],
// sfbr: [{ required: true, message: "请选择是否本人", trigger: "change" }],
// czsj: [{ required: true, message: "请选择处置时间", trigger: "change" }],
// czdz: [{ required: true, message: "请选择处置地址", trigger: "blur" }],
// xxdz: [{ required: true, message: "请选择详细地址", trigger: "blur" }],
// czzrdwdm: [
// { required: true, message: "请选择处置责任单位", trigger: "change" }
// ],
// czzrmj: [
// { required: true, message: "请选择处置责任民警", trigger: "change" }
// ],
// ckczcslx: [
// { required: true, message: "请选择常控处置措施类型", trigger: "change" }
// ],
// ckczcsxl: [
// { required: true, message: "请选择常控处置措施细类", trigger: "change" }
// ],
ckczjg: [{ required: true, message: "请输入常控处置结果", trigger: "blur" }]
// cklxzcpg: [
// { required: true, message: "请输入常控立线侦察评估", trigger: "blur" }
// ],
// cklxzcpgyj: [
// { required: true, message: "请输入常控立线侦察依据", trigger: "blur" }
// ],
// ckzylx: [
// { required: true, message: "请选择常控从事职业类型", trigger: "change" }
// ],
// sfnj: [{ required: true, message: "请选择是否尿检", trigger: "change" }]
});
const title = ref("");

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

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

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

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