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-03-18 11:07:40 +08:00
parent 9fb505eb8e
commit c181530639
71 changed files with 2331 additions and 1027 deletions
Download Patch File Download Diff File Expand all files Collapse all files

129
src/views/home/model/mapNavigation.vue
View File

@ -17,18 +17,44 @@
<GdMap :mapid="'map-99'"></GdMap>
<div class="button-container">
<template v-for="(value, index) in butList" :key="index">
<el-popover v-if="value.label === '警情' && value.onChage" placement="top" :width="200" trigger="hover">
<el-popover v-if="value.label === '警情' && value.onChage" placement="top" :width="480" trigger="click"
@show="changeBut(value)">
<template #reference>
<div class="but" :class="{ 'butOk': value.onChage }" @click="changeBut(value)">
<!-- -->
<div class="but" :class="{ 'butOk': value.onChage }">
{{ value.label }}
</div>
</template>
<div class="jqdj-popover">
<el-checkbox-group v-model="jqdjdmFilter" @change="handleJqdjFilterChange">
<el-checkbox v-for="item in D_BZ_JQDJ" :key="item.dm" :label="item.dm">
{{ item.zdmc }}
</el-checkbox>
</el-checkbox-group>
<div class="filter-item">
<span class="filter-label">等级：</span>
<el-checkbox-group v-model="jqdjdmFilter" @change="handleJqdjFilterChange" class="checkbox-group">
<el-checkbox v-for="item in D_BZ_JQDJ" :key="item.dm" :label="item.dm" class="checkbox-item">
{{ item.zdmc }}
</el-checkbox>
</el-checkbox-group>
</div>
<div class="filter-item">
<span class="filter-label">时间：</span>
<el-date-picker style="width: 100%;" v-model="timeRange" type="datetimerange" start-placeholder="开始时间" end-placeholder="结束时间"
format="YYYY-MM-DD HH:mm:ss" @change="handleTimeRangeChange" />
</div>
</div>
</el-popover>
<el-popover v-else-if="value.label === '事件' && value.onChage" placement="top" :width="480" trigger="click"
@show="changeBut(value)">
<template #reference>
<div class="but" :class="{ 'butOk': value.onChage }">
{{ value.label }}
</div>
</template>
<div class="jqdj-popover">
<div class="filter-item">
<span class="filter-label">时间：</span>
<el-date-picker v-model="sjTimeRange" type="datetimerange" style="width: 100%;" start-placeholder="开始时间" end-placeholder="结束时间"
format="YYYY-MM-DD HH:mm:ss" @change="getTimeRange" />
</div>
</div>
</el-popover>
<div v-else class="but" :class="{ 'butOk': value.onChage }" @click="changeBut(value)">
@ -63,7 +89,6 @@
</div>
<div class="dataList" v-infinite-scroll="loadMore" infinite-scroll-disabled="loading"
infinite-scroll-distance="10">
<template v-if="changeState">
<div class="item" v-for="(item, index) in jqList" :key="index" @click="clickJq(item)">
<div class="data-title">接警单：{{ item.jjdbh }}</div>
@ -143,14 +168,48 @@ const jqdjdmFilter = ref([])
const handleJqdjFilterChange = () => {
getLzJcjPjdb()
}
// 获取当天的开始和结束时间
const getCurrentMonthRange = () => {
const now = new Date();
const year = now.getFullYear();
const month = now.getMonth();
const day = now.getDate();
// 当天零点
const start = new Date(year, month, day, 0, 0, 0);
// 当天23:59:59
const end = new Date(year, month, day, 23, 59, 59);
return [start, end];
};
const timeRange = ref(getCurrentMonthRange())
const sjTimeRange = ref()
const handleTimeRangeChange = () => {
getLzJcjPjdb()
}
const getTimeRange = () => {
getZdsj()
};
// 底部按钮
const changeBut = (row) => {
if (row.label == '清除') {
emitter.emit('deletePointArea', 'sj_flash')
emitter.emit('deletePointArea', 'jq_flash')
emitter.emit('deletePointArea', 'jq')
emitter.emit('deletePointArea', 'sj')
return
}
// 警情按钮点击时不改变onChage状态，因为它需要显示popover
if (row.label == '警情') {
// 只执行获取警情数据的操作，不改变状态
getLzJcjPjdb()
return
}
if (row.label == '事件') {
getZdsj()
return
}
let index = butList.value.findIndex(item => item.label == row.label)
@ -170,12 +229,28 @@ const changeBut = (row) => {
}
}
}
// 格式化日期为YYYY-MM-DD HH:mm:ss格式
const formatDate = (date) => {
if (!date) return '';
const year = date.getFullYear();
const month = String(date.getMonth() + 1).padStart(2, '0');
const day = String(date.getDate()).padStart(2, '0');
const hours = String(date.getHours()).padStart(2, '0');
const minutes = String(date.getMinutes()).padStart(2, '0');
const seconds = String(date.getSeconds()).padStart(2, '0');
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
};
// 获取所有的一级警情
const getLzJcjPjdb = () => {
const jqdjdmStr = jqdjdmFilter.value.length > 0 ? jqdjdmFilter.value.join(',') : ''
emitter.emit("deletePointArea", "jq")
qcckGet({
jqdjdm: jqdjdmStr
jqdjdm: jqdjdmStr,
startTime: timeRange.value ? formatDate(timeRange.value[0]) : '',
endTime: timeRange.value ? formatDate(timeRange.value[1]) : '',
}, "/mosty-gsxt/lzJcjPjdb/selectList").then(res => {
let list = res.filter(item => item.fxdwjd && item.fxdwjd).map(item => {
return {
@ -194,7 +269,10 @@ const loading = ref(false)
const changeState = ref(true)// 点击切换
// 获取所有的重点事件
const getZdsj = () => {
qcckGet({}, "/mosty-gsxt/zdsj/selectList").then(res => {
qcckGet({
startTime: sjTimeRange.value ? sjTimeRange.value[0] : '',
endTime: sjTimeRange.value ? sjTimeRange.value[1] : '',
}, "/mosty-gsxt/zdsj/selectList").then(res => {
let list = res.filter(item => item.jd && item.wd).map(item => {
return {
...item,
@ -596,15 +674,40 @@ const coordStringHandler = (res) => {
}
.jqdj-popover {
:deep(.el-checkbox-group) {
padding: 10px;
.filter-item {
margin-bottom: 10px;
display: flex;
flex-direction: column;
gap: 8px;
align-items: center;
flex-wrap: nowrap;
gap: 10px;
}
.filter-label {
white-space: nowrap;
color: #333;
font-size: 14px;
}
.checkbox-group {
display: flex;
flex-wrap: nowrap;
gap: 15px;
align-items: center;
}
:deep(.el-checkbox) {
margin-right: 0;
}
:deep(.el-checkbox__label) {
white-space: nowrap;
}
:deep(.el-date-editor) {
width: 200px;
}
}
.display-flex {