lcw
This commit is contained in:
20668
package-lock.json
generated
20668
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@ -38,6 +38,7 @@
|
|||||||
"pinia": "^3.0.1",
|
"pinia": "^3.0.1",
|
||||||
"tesseract.js": "^6.0.1",
|
"tesseract.js": "^6.0.1",
|
||||||
"vue": "^3.2.8",
|
"vue": "^3.2.8",
|
||||||
|
"vue-draggable-plus": "^0.6.0",
|
||||||
"vue-router": "^4.0.11",
|
"vue-router": "^4.0.11",
|
||||||
"vuex": "^4.0.2",
|
"vuex": "^4.0.2",
|
||||||
"xlsx": "^0.18.5"
|
"xlsx": "^0.18.5"
|
||||||
|
|||||||
25
src/api/yj.js
Normal file
25
src/api/yj.js
Normal file
@ -0,0 +1,25 @@
|
|||||||
|
|
||||||
|
import request from "@/utils/request";
|
||||||
|
const api = "/mosty-api/mosty-gsxt";
|
||||||
|
// 预警轨迹
|
||||||
|
export const tbYjxxGsgj = (data) => {
|
||||||
|
return request({
|
||||||
|
url: api + `/tbYjxx/gsgj`,
|
||||||
|
method: "POST",
|
||||||
|
data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
export const tbYjxxGetPageList = (data) => {
|
||||||
|
return request({
|
||||||
|
url: api + `/tbYjxx/getPageList`,
|
||||||
|
method: "post",
|
||||||
|
data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
export const tbYjxxQueryYjxx = (params) => {
|
||||||
|
return request({
|
||||||
|
url: api + `/tbYjxx/getList`,
|
||||||
|
method: "get",
|
||||||
|
params
|
||||||
|
})
|
||||||
|
}
|
||||||
@ -165,3 +165,11 @@ export const tbGsxtZdryCzrzSelectCzrz = (params) => {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 不分页查询
|
||||||
|
export const tbGsxtZdrySelectList = (params) => {
|
||||||
|
return request({
|
||||||
|
url: api + `/tbGsxtZdry/selectList`,
|
||||||
|
method: "get",
|
||||||
|
params,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|||||||
@ -79,8 +79,6 @@ let map;
|
|||||||
let mapLayer;
|
let mapLayer;
|
||||||
let mapLayer1;
|
let mapLayer1;
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
console.log("xxxxxxx");
|
|
||||||
|
|
||||||
emitter.on("followUp", (res) => {
|
emitter.on("followUp", (res) => {
|
||||||
let box = document.getElementsByClassName("changeMap_box");
|
let box = document.getElementsByClassName("changeMap_box");
|
||||||
if (!box) return;
|
if (!box) return;
|
||||||
@ -113,7 +111,7 @@ onMounted(() => {
|
|||||||
})
|
})
|
||||||
zoomTarget.value = map.mapboxGLMap.getZoom();
|
zoomTarget.value = map.mapboxGLMap.getZoom();
|
||||||
// 地图加载完成后发出事件
|
// 地图加载完成后发出事件
|
||||||
emit('mapLoaded')
|
// emit('mapLoaded')
|
||||||
});
|
});
|
||||||
mapUtil.value = new MapUtil(map);
|
mapUtil.value = new MapUtil(map);
|
||||||
// map = new EliMap({
|
// map = new EliMap({
|
||||||
|
|||||||
@ -713,8 +713,13 @@ export function MapUtil(map) {
|
|||||||
MapUtil.prototype.openInfoDetail = (flag, data) => {
|
MapUtil.prototype.openInfoDetail = (flag, data) => {
|
||||||
switch (flag) {
|
switch (flag) {
|
||||||
case 'home_yj_map':
|
case 'home_yj_map':
|
||||||
|
console.log(data);
|
||||||
emitter.emit("showHomeYJ", data);
|
emitter.emit("showHomeYJ", data);
|
||||||
break;
|
break;
|
||||||
|
case 'home_yj_detail':
|
||||||
|
console.log(data);
|
||||||
|
emitter.emit("showHomeWarning", data);
|
||||||
|
break;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -224,6 +224,14 @@ export const publicRoutes = [
|
|||||||
title: "预警中心",
|
title: "预警中心",
|
||||||
icon: "article"
|
icon: "article"
|
||||||
}
|
}
|
||||||
|
}, {
|
||||||
|
path: "/warningList",
|
||||||
|
name: "warningList",
|
||||||
|
component: () => import("@/views/backOfficeSystem/fourColorManage/warningList/index"),
|
||||||
|
meta: {
|
||||||
|
title: "预警列表",
|
||||||
|
icon: "article"
|
||||||
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: "/WarningModel",
|
path: "/WarningModel",
|
||||||
|
|||||||
@ -0,0 +1,328 @@
|
|||||||
|
<template>
|
||||||
|
<div class="historical-route-container" v-if="modelValue">
|
||||||
|
<!-- 头部标题 -->
|
||||||
|
<div class="header flex align-center just-between">
|
||||||
|
<span>轨迹历史</span>
|
||||||
|
<el-icon size="20px" @click="close" class="close-icon">
|
||||||
|
<Close />
|
||||||
|
</el-icon>
|
||||||
|
</div>
|
||||||
|
<!-- 筛选区域 -->
|
||||||
|
<div class="filter-section">
|
||||||
|
<div class="flex align-center just-between">
|
||||||
|
<el-date-picker class="date-picker" v-model="dateRange" type="datetimerange" range-separator="至"
|
||||||
|
start-placeholder="开始时间" end-placeholder="结束时间" format="YYYY-MM-DD HH:mm:ss"
|
||||||
|
value-format="YYYY-MM-DD HH:mm:ss" />
|
||||||
|
<el-button type="primary" size="small" @click="search" class="search-btn">
|
||||||
|
查询
|
||||||
|
</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 轨迹列表区域 -->
|
||||||
|
<div class="track-list-container">
|
||||||
|
<div v-for="(item, index) in trackList" :key="index" class="track-item">
|
||||||
|
<div class="track-location">{{ item.yjNr }}</div>
|
||||||
|
</div>
|
||||||
|
<!-- 空状态 -->
|
||||||
|
<MOSTY.Empty :show="trackList.length <= 0" :imgSize="150"></MOSTY.Empty>
|
||||||
|
</div>
|
||||||
|
<!-- 底部按钮 -->
|
||||||
|
<div class="bottom-section">
|
||||||
|
<el-button type="primary" size="small" @click="showOnMap" class="show-map-btn">
|
||||||
|
轨迹上图
|
||||||
|
</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import * as MOSTY from "@/components/MyComponents/index";
|
||||||
|
import { tbYjxxGsgj } from '@/api/yj.js'
|
||||||
|
import { ref, defineProps, onMounted, watch } from "vue";
|
||||||
|
import emitter from "@/utils/eventBus.js";
|
||||||
|
import { ElMessage } from "element-plus";
|
||||||
|
import { Close } from '@element-plus/icons-vue';
|
||||||
|
|
||||||
|
// 参数传递
|
||||||
|
const props = defineProps({
|
||||||
|
// 某条预警详情
|
||||||
|
data: {
|
||||||
|
type: Array,
|
||||||
|
default: () => []
|
||||||
|
},
|
||||||
|
modelValue: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
|
});
|
||||||
|
const emit = defineEmits(["update:modelValue"]);
|
||||||
|
// 日期范围
|
||||||
|
const dateRange = ref([null, null]);
|
||||||
|
// 轨迹列表数据
|
||||||
|
const trackList = ref([]);
|
||||||
|
// 关闭窗口
|
||||||
|
function close() {
|
||||||
|
dateRange.value = [null, null];
|
||||||
|
emit("update:modelValue", false);
|
||||||
|
}
|
||||||
|
// 查询轨迹数据
|
||||||
|
function search() {
|
||||||
|
mockTrackData();
|
||||||
|
}
|
||||||
|
const mapData = ref([])
|
||||||
|
// 轨迹上图
|
||||||
|
function showOnMap() {
|
||||||
|
if (trackList.value.length === 0) {
|
||||||
|
ElMessage({ message: '暂无轨迹数据', type: 'warning' });
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
for (let i = 0; i < 2; i++) {
|
||||||
|
let coords = mapData.value[i].list.map(item => {
|
||||||
|
return [item.jd, item.wd]
|
||||||
|
})
|
||||||
|
// const coords =[ [
|
||||||
|
// [
|
||||||
|
// 94.354613,
|
||||||
|
// 22.658568
|
||||||
|
// ],
|
||||||
|
// [
|
||||||
|
// 94.354613,
|
||||||
|
// 23.658568
|
||||||
|
// ],
|
||||||
|
// [
|
||||||
|
// 94.354613,
|
||||||
|
// 24.658568
|
||||||
|
// ],
|
||||||
|
// [
|
||||||
|
// 94.354613,
|
||||||
|
// 25.658568
|
||||||
|
// ],
|
||||||
|
// [
|
||||||
|
// 94.354613,
|
||||||
|
// 26.658568
|
||||||
|
// ],
|
||||||
|
// [
|
||||||
|
// 94.354613,
|
||||||
|
// 27.658568
|
||||||
|
// ],
|
||||||
|
// [
|
||||||
|
// 94.354613,
|
||||||
|
// 28.658568
|
||||||
|
// ],
|
||||||
|
// [
|
||||||
|
// 94.354613,
|
||||||
|
// 29.658568
|
||||||
|
// ]
|
||||||
|
// ],[
|
||||||
|
// [
|
||||||
|
// 89.354613,
|
||||||
|
// 22.658568
|
||||||
|
// ],
|
||||||
|
// [
|
||||||
|
// 90.354613,
|
||||||
|
// 23.658568
|
||||||
|
// ],
|
||||||
|
// [
|
||||||
|
// 91.354613,
|
||||||
|
// 24.658568
|
||||||
|
// ],
|
||||||
|
// [
|
||||||
|
// 92.354613,
|
||||||
|
// 25.658568
|
||||||
|
// ],
|
||||||
|
// [
|
||||||
|
// 93.354613,
|
||||||
|
// 26.658568
|
||||||
|
// ],
|
||||||
|
// [
|
||||||
|
// 94.354613,
|
||||||
|
// 27.658568
|
||||||
|
// ],
|
||||||
|
// [
|
||||||
|
// 95.354613,
|
||||||
|
// 28.658568
|
||||||
|
// ],
|
||||||
|
// [
|
||||||
|
// 96.354613,
|
||||||
|
// 29.658568
|
||||||
|
// ]
|
||||||
|
// ]]
|
||||||
|
|
||||||
|
emitter.emit('drawLineAnimation', {
|
||||||
|
type: "solid",
|
||||||
|
coords: coords,
|
||||||
|
isclear: true,
|
||||||
|
flag: "yjLine"
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// const coords = mapData.value.map(item => {
|
||||||
|
// console.log(item);
|
||||||
|
|
||||||
|
// return item.list.map(items => {
|
||||||
|
// return [items.jd, items.wd]
|
||||||
|
// })
|
||||||
|
// })
|
||||||
|
// emitter.emit('drawLineAnimation',
|
||||||
|
// {
|
||||||
|
// type: "solid",
|
||||||
|
// coords: coords,
|
||||||
|
// isclear: true,
|
||||||
|
// flag: "yjLine"
|
||||||
|
// }
|
||||||
|
// // { coords: coords, flag: 'yjLine' }
|
||||||
|
// );
|
||||||
|
}
|
||||||
|
// mapUtil.value.createLine(res, res.flag);
|
||||||
|
// 模拟轨迹数据
|
||||||
|
function mockTrackData() {
|
||||||
|
const promes = {
|
||||||
|
yjRysfzh: props.data.yjRysfzh,
|
||||||
|
startTime: dateRange.value[0] ? dateRange.value[0] : null,
|
||||||
|
endTime: dateRange.value[1] ? dateRange.value[1] : null,
|
||||||
|
}
|
||||||
|
tbYjxxGsgj(promes).then(res => {
|
||||||
|
mapData.value = res
|
||||||
|
trackList.value = []
|
||||||
|
for (let i = 0; i < res.length; i++) {
|
||||||
|
trackList.value = [...trackList.value, ...res[i].list]
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
watch(() => props.data, (newVal) => {
|
||||||
|
if (newVal.length > 0) {
|
||||||
|
mockTrackData();
|
||||||
|
}
|
||||||
|
})
|
||||||
|
// 组件挂载时获取默认数据
|
||||||
|
// onMounted(() => {
|
||||||
|
|
||||||
|
|
||||||
|
// mockTrackData();
|
||||||
|
// });
|
||||||
|
|
||||||
|
// 监听modelValue变化
|
||||||
|
watch(() => props.modelValue, (newVal) => {
|
||||||
|
if (newVal) {
|
||||||
|
mockTrackData();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
@import "@/assets/css/homeScreen.scss";
|
||||||
|
|
||||||
|
// 容器样式
|
||||||
|
.historical-route-container {
|
||||||
|
position: absolute;
|
||||||
|
top: 80%;
|
||||||
|
left: 100%;
|
||||||
|
z-index: 2;
|
||||||
|
width: 300px;
|
||||||
|
height: 400px;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 头部样式
|
||||||
|
.header {
|
||||||
|
width: 100%;
|
||||||
|
background: #1d5db4e3;
|
||||||
|
padding: 8px 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 关闭图标样式
|
||||||
|
.close-icon {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 筛选区域样式
|
||||||
|
.filter-section {
|
||||||
|
background: rgba(10, 49, 88, 0.6);
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 日期选择器样式
|
||||||
|
.date-picker {
|
||||||
|
width: 80%;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 查询按钮样式
|
||||||
|
.search-btn {
|
||||||
|
font-size: 12px;
|
||||||
|
background: #1890ff;
|
||||||
|
border-color: #1890ff;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 轨迹列表区域样式
|
||||||
|
.track-list-container {
|
||||||
|
background: rgba(10, 49, 88, 0.6);
|
||||||
|
box-shadow: inset 0px 0px 10px 0px rgba(56, 119, 242, 0.5);
|
||||||
|
height: 280px;
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 列表项样式
|
||||||
|
.track-item {
|
||||||
|
border-bottom: 1px solid rgba(56, 119, 242, 0.3);
|
||||||
|
padding: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 轨迹时间样式
|
||||||
|
.track-time {
|
||||||
|
color: #b7e4ff;
|
||||||
|
font-size: 12px;
|
||||||
|
line-height: 1.5;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 轨迹位置样式
|
||||||
|
.track-location {
|
||||||
|
color: white;
|
||||||
|
font-size: 12px;
|
||||||
|
line-height: 1.5;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 空状态样式
|
||||||
|
.empty-state {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
height: 200px;
|
||||||
|
color: #b7e4ff;
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 底部按钮区域样式
|
||||||
|
.bottom-section {
|
||||||
|
background: rgba(10, 49, 88, 0.6);
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 轨迹上图按钮样式
|
||||||
|
.show-map-btn {
|
||||||
|
width: 100%;
|
||||||
|
font-size: 12px;
|
||||||
|
background: #1890ff;
|
||||||
|
border-color: #1890ff;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 自定义滚动条样式
|
||||||
|
::-webkit-scrollbar {
|
||||||
|
width: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
::-webkit-scrollbar-track {
|
||||||
|
background: rgba(56, 119, 242, 0.1);
|
||||||
|
}
|
||||||
|
|
||||||
|
::-webkit-scrollbar-thumb {
|
||||||
|
background: rgba(56, 119, 242, 0.5);
|
||||||
|
border-radius: 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
::-webkit-scrollbar-thumb:hover {
|
||||||
|
background: rgba(56, 119, 242, 0.8);
|
||||||
|
}
|
||||||
|
|
||||||
|
::v-deep .el-range-input {
|
||||||
|
color: #000 !important;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -1,18 +1,48 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="personCard relative flex mb10 pointer" >
|
<div class="personCard relative mb10 pointer">
|
||||||
|
<div class="flex nowrap align-center just-between boderBox">
|
||||||
<div class="avatarBox relative">
|
<div class="avatarBox relative">
|
||||||
<div class="marks f12 absolute" :class="changeBg(props.item.yjJb)">
|
<div class="marks f12 absolute" :class="changeBg(props.item.yjJb)">
|
||||||
<span>{{ changetText(props.item.yjJb) }}</span>
|
<span>{{ changetText(props.item.yjJb) }}</span>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<el-image :preview-teleported="true" style="width: 80px; height: 110px" :src="props.item.yjTp" :preview-src-list="[props.item.yjTp]"/>
|
<el-image :preview-teleported="true" style="width: 80px; height: 110px" :src="props.item.yjTp"
|
||||||
|
:preview-src-list="[props.item.yjTp]" />
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<span class="smallbtn" @click.stop="()=>{}">全息档案</span>
|
<span class="smallbtn" @click.stop="() => { }">全息档案{{ props.item.id }}</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="infoBox">
|
<div class="infoBox">
|
||||||
<div class="items">
|
<div style="height: 110px">
|
||||||
|
<div class="flex nowrap align-center just-between linItem">
|
||||||
|
<div class="wichAlian3">{{ props.item.yjRyxm }}</div>
|
||||||
|
<div>|</div>
|
||||||
|
<div class="wichAlian">{{ IdCard(props.item.yjRysfzh, 2) }}</div>
|
||||||
|
<div>|</div>
|
||||||
|
<div class="wichAlian2"> {{ IdCard(props.item.yjRysfzh, 3) }}</div>
|
||||||
|
<div>|</div>
|
||||||
|
<div class="wichAlian3"> <span class="bqbox ml6">{{ props.item.yjbq }}</span></div>
|
||||||
|
</div>
|
||||||
|
<div class="linItem">身份证号：{{ props.item.yjRysfzh }}</div>
|
||||||
|
<div class="linItem">预警时间：{{ props.item.yjSj }}</div>
|
||||||
|
<div class="linItem flex nowrap align-center just-between">预警次数：{{ props.item.yjCs }}<div></div>
|
||||||
|
<div>相似度：90%</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="infoItem flex nowrap" style="margin-top: 6px;">
|
||||||
|
<span class="smllbtn" @click.stop="handleQsFk(props.item, '签收')"
|
||||||
|
v-if="props.item.yjJb != 10 && props.item.czzt == '01' && deptLevel == '40'">签收</span>
|
||||||
|
<span class="smllbtn" @click.stop="handleQsFk(props.item, '反馈')"
|
||||||
|
v-if="props.item.yjJb != 10 && props.item.czzt == '02' && deptLevel == '40'"> 反馈 </span>
|
||||||
|
<span class="smllbtn" @click.stop="handleQsFk(props.item, '查看反馈')"
|
||||||
|
v-if="props.item.yjJb != 10 && props.item.czzt == '03'"> 查看反馈 </span>
|
||||||
|
<div>
|
||||||
|
<span class="smllbtn" v-if="track" @click.stop="showDetail(props.item)">发送指令</span>
|
||||||
|
<span class="smllbtn" v-else @click.stop="openTrack(props.item)">历史轨迹</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- <div class="items">
|
||||||
<div class="infoItem flex nowrap mb10">{{ props.item.yjRyxm }} <span class="bqbox ml6">{{ props.item.yjbq }}</span></div>
|
<div class="infoItem flex nowrap mb10">{{ props.item.yjRyxm }} <span class="bqbox ml6">{{ props.item.yjbq }}</span></div>
|
||||||
<div class="infoItem ellipsis">性别：<span class="value">{{ IdCard(props.item.yjRysfzh , 2 )}}</span></div>
|
<div class="infoItem ellipsis">性别：<span class="value">{{ IdCard(props.item.yjRysfzh , 2 )}}</span></div>
|
||||||
<div class="infoItem ellipsis">身份证号：<span class="value">{{ props.item.yjRysfzh }}</span></div>
|
<div class="infoItem ellipsis">身份证号：<span class="value">{{ props.item.yjRysfzh }}</span></div>
|
||||||
@ -33,30 +63,24 @@
|
|||||||
<div class="infoItem ellipsis">预警时间：<span class="value">{{ props.item.yjSj }}</span></div>
|
<div class="infoItem ellipsis">预警时间：<span class="value">{{ props.item.yjSj }}</span></div>
|
||||||
<div class="infoItem ellipsis">签收时间：<span class="value">{{ props.item.qssj }}</span></div>
|
<div class="infoItem ellipsis">签收时间：<span class="value">{{ props.item.qssj }}</span></div>
|
||||||
<div class="infoItem ellipsis">反馈时间：<span class="value">{{ props.item.fksj }}</span></div>
|
<div class="infoItem ellipsis">反馈时间：<span class="value">{{ props.item.fksj }}</span></div>
|
||||||
|
</div> -->
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="infoItem ellipsis flex align-center">
|
||||||
|
<img src="@/assets/images/ddtb.png" />
|
||||||
|
<span class="value">{{ props.item.yjDz }}</span>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
<HistoricalRoute v-model="showTrack" :data="props.item" />
|
||||||
|
|
||||||
<!-- 虚拟触发 -->
|
|
||||||
<!-- <el-popover ref="popoverRef" :visible="isShowVisble" :width="400" :virtual-ref="buttonRef" trigger="click" title="反馈" virtual-triggering >
|
|
||||||
<el-form :model="chooseRow" ref="elRowForm" :inline="true" label-width="100px" :rules="rules">
|
|
||||||
<el-form-item label="反馈内容" prop="fknr" style="width: 100%;">
|
|
||||||
<MOSTY.Other style="width: 100%;" clearable v-model="chooseRow.fknr" type="textarea" placeholder="请输入不通过原因"/>
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
<div class="flex just-center mt10">
|
|
||||||
<el-button @click.stop="cancelRowSp">取消</el-button>
|
|
||||||
<el-button type="primary" @click.stop="handleSendSp(props.item)" v-loading="btnloading">确定</el-button>
|
|
||||||
</div>
|
|
||||||
</el-popover> -->
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import emitter from "@/utils/eventBus.js";
|
import emitter from "@/utils/eventBus.js";
|
||||||
import { qcckGet, qcckPost } from "@/api/qcckApi.js";
|
import { qcckGet, qcckPost } from "@/api/qcckApi.js";
|
||||||
import * as MOSTY from "@/components/MyComponents/index";
|
|
||||||
import { IdCard } from '@/utils/validate.js'
|
import { IdCard } from '@/utils/validate.js'
|
||||||
import { defineProps ,ref, reactive,getCurrentInstance, onMounted } from "vue";
|
import HistoricalRoute from './historicalRoute.vue'
|
||||||
|
import { defineProps, ref, reactive, getCurrentInstance, onMounted, watch } from "vue";
|
||||||
const { proxy } = getCurrentInstance();
|
const { proxy } = getCurrentInstance();
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
item: {
|
item: {
|
||||||
@ -70,22 +94,23 @@ const props = defineProps({
|
|||||||
type: {
|
type: {
|
||||||
type: String,
|
type: String,
|
||||||
default: ""
|
default: ""
|
||||||
|
}, track: {
|
||||||
|
type: Boolean,
|
||||||
|
default: true
|
||||||
}
|
}
|
||||||
|
|
||||||
});
|
});
|
||||||
|
watch(() => props.item, (newVal) => {
|
||||||
|
if (newVal) {
|
||||||
|
console.log(newVal);
|
||||||
|
|
||||||
|
}
|
||||||
|
},{deep:true})
|
||||||
const deptLevel = ref(null)
|
const deptLevel = ref(null)
|
||||||
const buttonRef = ref()
|
const emit = defineEmits(['showDetail'])
|
||||||
const popoverRef = ref()
|
const showDetail = (val) => {
|
||||||
const elRowForm = ref()
|
emit('showDetail', val)
|
||||||
const isShowVisble = ref(false)
|
}
|
||||||
const chooseRow = ref({})
|
|
||||||
const rules = reactive({
|
|
||||||
fknr: [{ required: true, message: "请输入反馈内容", trigger: "blur" }],
|
|
||||||
})
|
|
||||||
onMounted(() => {
|
|
||||||
// deptLevel.value = localStorage.getItem("deptId") ? JSON.parse(localStorage.getItem("deptId"))[0].deptLevel : null;
|
|
||||||
});
|
|
||||||
|
|
||||||
|
|
||||||
// 处理签收
|
// 处理签收
|
||||||
const handleQsFk = (val, type) => {
|
const handleQsFk = (val, type) => {
|
||||||
switch (type) {
|
switch (type) {
|
||||||
@ -133,14 +158,42 @@ const changetText = (type) => {
|
|||||||
return "不关注";
|
return "不关注";
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
const showDetail = () => {
|
const showTrack=ref(false)
|
||||||
emit('showDetail',props.item)
|
const openTrack = () => {
|
||||||
}
|
showTrack.value=true
|
||||||
|
};
|
||||||
|
// <!-- 虚拟触发 -->
|
||||||
|
// <!-- <el-popover ref="popoverRef" :visible="isShowVisble" :width="400" :virtual-ref="buttonRef" trigger="click" title="反馈" virtual-triggering >
|
||||||
|
// <el-form :model="chooseRow" ref="elRowForm" :inline="true" label-width="100px" :rules="rules">
|
||||||
|
// <el-form-item label="反馈内容" prop="fknr" style="width: 100%;">
|
||||||
|
// <MOSTY.Other style="width: 100%;" clearable v-model="chooseRow.fknr" type="textarea" placeholder="请输入不通过原因"/>
|
||||||
|
// </el-form-item>
|
||||||
|
// </el-form>
|
||||||
|
// <div class="flex just-center mt10">
|
||||||
|
// <el-button @click.stop="cancelRowSp">取消</el-button>
|
||||||
|
// <el-button type="primary" @click.stop="handleSendSp(props.item)" v-loading="btnloading">确定</el-button>
|
||||||
|
// </div>
|
||||||
|
// </el-popover> -->
|
||||||
|
// const showDetail = () => {
|
||||||
|
// emit('showDetail',props.item)
|
||||||
|
// }
|
||||||
|
// const buttonRef = ref()
|
||||||
|
// const popoverRef = ref()
|
||||||
|
// const elRowForm = ref()
|
||||||
|
// const isShowVisble = ref(false)
|
||||||
|
// const chooseRow = ref({})
|
||||||
|
// const rules = reactive({
|
||||||
|
// fknr: [{ required: true, message: "请输入反馈内容", trigger: "blur" }],
|
||||||
|
// })
|
||||||
|
// onMounted(() => {
|
||||||
|
// deptLevel.value = localStorage.getItem("deptId") ? JSON.parse(localStorage.getItem("deptId"))[0].deptLevel : null;
|
||||||
|
// });
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
.personCard {
|
.personCard {
|
||||||
|
position: relative;
|
||||||
background: rgba(10, 49, 88, 0.6);
|
background: rgba(10, 49, 88, 0.6);
|
||||||
box-shadow: inset 0px 0px 10px 0px rgba(56, 119, 242, 0.5);
|
box-shadow: inset 0px 0px 10px 0px rgba(56, 119, 242, 0.5);
|
||||||
border-radius: 0px 0px 0px 0px;
|
border-radius: 0px 0px 0px 0px;
|
||||||
@ -149,6 +202,35 @@ const showDetail = () => {
|
|||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
transition: all 0.3s;
|
transition: all 0.3s;
|
||||||
|
|
||||||
|
.boderBox {
|
||||||
|
border-bottom: 1px solid #217ce1;
|
||||||
|
padding-bottom: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.infoItem {
|
||||||
|
font-size: 13px;
|
||||||
|
margin-bottom: 2px;
|
||||||
|
color: #fff;
|
||||||
|
margin-top: 4px;
|
||||||
|
|
||||||
|
.value {
|
||||||
|
color: #89afcf;
|
||||||
|
}
|
||||||
|
|
||||||
|
.smllbtn {
|
||||||
|
display: inline-block;
|
||||||
|
padding: 4px 8px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
border-radius: 4px;
|
||||||
|
background: #0072ff;
|
||||||
|
border-radius: 5px 5px 5px 5px;
|
||||||
|
margin-right: 6px;
|
||||||
|
margin-top: 4px;
|
||||||
|
cursor: pointer;
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
background: rgba(17, 66, 96, 0.8);
|
background: rgba(17, 66, 96, 0.8);
|
||||||
}
|
}
|
||||||
@ -163,6 +245,7 @@ const showDetail = () => {
|
|||||||
margin-right: 5px;
|
margin-right: 5px;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
width: 80px;
|
width: 80px;
|
||||||
|
|
||||||
.marks {
|
.marks {
|
||||||
width: 70px;
|
width: 70px;
|
||||||
height: 32px;
|
height: 32px;
|
||||||
@ -203,31 +286,28 @@ const showDetail = () => {
|
|||||||
|
|
||||||
.infoBox {
|
.infoBox {
|
||||||
width: calc(100% - 90px);
|
width: calc(100% - 90px);
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
.items{
|
|
||||||
width: 50%;
|
|
||||||
}
|
|
||||||
.infoItem {
|
|
||||||
font-size: 13px;
|
|
||||||
margin-bottom: 2px;
|
|
||||||
color: #fff;
|
|
||||||
.value {
|
|
||||||
color: #89afcf;
|
|
||||||
}
|
|
||||||
.smllbtn {
|
|
||||||
display: inline-block;
|
|
||||||
padding: 4px 8px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
border-radius: 4px;
|
|
||||||
background: #0072ff;
|
|
||||||
border-radius: 5px 5px 5px 5px;
|
|
||||||
margin-right: 6px;
|
|
||||||
margin-top: 4px;
|
|
||||||
cursor: pointer;
|
|
||||||
|
|
||||||
|
// display: flex;
|
||||||
|
// justify-content: space-between;
|
||||||
|
.linItem {
|
||||||
|
line-height: 28px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.wichAlian {
|
||||||
|
// width: 10%;
|
||||||
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.wichAlian3 {
|
||||||
|
// width: 40%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wichAlian2 {
|
||||||
|
// width: 10%;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -239,6 +319,7 @@ const showDetail = () => {
|
|||||||
border-radius: 5px 5px 5px 5px;
|
border-radius: 5px 5px 5px 5px;
|
||||||
margin-top: 6px;
|
margin-top: 6px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.num {
|
.num {
|
||||||
color: #00ffff;
|
color: #00ffff;
|
||||||
}
|
}
|
||||||
|
|||||||
@ -20,13 +20,21 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="ml10 mr10 mt10">
|
<div class="ml10 mr10 mt10">
|
||||||
<el-input v-model="keyword" placeholder="姓名、证件号码搜索">
|
<el-input v-model="keyword" placeholder="姓名、证件号码搜索">
|
||||||
<template #append><el-icon><Search /></el-icon></template>
|
<template #append>
|
||||||
|
<el-button type="primary" @click="getKeyword">搜索</el-button>
|
||||||
|
<!-- <div >
|
||||||
|
<el-icon >
|
||||||
|
<Search />
|
||||||
|
</el-icon>
|
||||||
|
</div> -->
|
||||||
|
</template>
|
||||||
</el-input>
|
</el-input>
|
||||||
</div>
|
</div>
|
||||||
<ul class="listContent noScollLine mt10" v-infinite-scroll="loadList" style="overflow: auto" v-loading="loading">
|
<ul class="listContent noScollLine mt10" v-infinite-scroll="loadList" style="overflow: auto"
|
||||||
|
v-loading="loading">
|
||||||
<!-- @click.stop="showDetail(item)" -->
|
<!-- @click.stop="showDetail(item)" -->
|
||||||
<li v-for="(item, index) in personList" :key="index" >
|
<li v-for="(item, index) in personList" :key="index" @click="markAbove(item)">
|
||||||
<YjItem :item="item" type="yj" :dic="{D_BZ_YJCZZT}"></YjItem>
|
<YjItem :item="item" type="yj" :dic="{ D_BZ_YJCZZT }" @showDetail="showDetail"></YjItem>
|
||||||
</li>
|
</li>
|
||||||
<MOSTY.Empty :show="!loading && personList.length <= 0"></MOSTY.Empty>
|
<MOSTY.Empty :show="!loading && personList.length <= 0"></MOSTY.Empty>
|
||||||
</ul>
|
</ul>
|
||||||
@ -65,19 +73,22 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<Information v-model="showDialog" title="发送指令" @submit='submit' @close='close'>
|
<Information v-model="showDialog" title="发送指令" @submit='submit' @close='close'>
|
||||||
<SemdFqzl ref="semdFqzlRef" :itemData="itemData" @handleClose="handleClose" identification="yj" :tacitly="tacitly"/>
|
<SemdFqzl ref="semdFqzlRef" :itemData="itemData" @handleClose="handleClose" identification="yj"
|
||||||
|
:tacitly="tacitly" />
|
||||||
</Information>
|
</Information>
|
||||||
|
|
||||||
<!-- 反馈按钮 -->
|
<!-- 反馈按钮 -->
|
||||||
<FkDialog @change="getList"></FkDialog>
|
<FkDialog @change="getList"></FkDialog>
|
||||||
|
<LeftDialog></LeftDialog>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
|
import LeftDialog from '@/views/home/dialog/leftDialog.vue'
|
||||||
import FkDialog from './components/fkDialog.vue'
|
import FkDialog from './components/fkDialog.vue'
|
||||||
import * as MOSTY from "@/components/MyComponents/index";
|
import * as MOSTY from "@/components/MyComponents/index";
|
||||||
import { qcckPost, qcckGet } from "@/api/qcckApi.js";
|
import { qcckPost, qcckGet } from "@/api/qcckApi.js";
|
||||||
import GdMap from "@/components/GdMap/index.vue";
|
import GdMap from "@/components/GdMap/index.vue";
|
||||||
|
import emitter from "@/utils/eventBus.js";
|
||||||
import YjItem from "./components/yjItem.vue";
|
import YjItem from "./components/yjItem.vue";
|
||||||
import WarningCount from "./components/WarningCount.vue";
|
import WarningCount from "./components/WarningCount.vue";
|
||||||
import BarHatEcharts from "@/views/home/echarts/barHatEcharts.vue";
|
import BarHatEcharts from "@/views/home/echarts/barHatEcharts.vue";
|
||||||
@ -147,7 +158,7 @@ const loadList = () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const getList = () => {
|
const getList = () => {
|
||||||
let params = { pageSize:10, pageNum:pageNum.value };
|
let params = { pageSize: 10, pageNum: pageNum.value,keyword:keyword.value };
|
||||||
loading.value = true;
|
loading.value = true;
|
||||||
qcckPost(params, '/mosty-gsxt/tbYjxx/getPageList').then(res => {
|
qcckPost(params, '/mosty-gsxt/tbYjxx/getPageList').then(res => {
|
||||||
loading.value = false;
|
loading.value = false;
|
||||||
@ -158,7 +169,10 @@ const getList = () =>{
|
|||||||
loading.value = false;
|
loading.value = false;
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
const getKeyword = () => {
|
||||||
|
pageNum.value=1
|
||||||
|
getList()
|
||||||
|
}
|
||||||
const init = () => {
|
const init = () => {
|
||||||
// 预警处置统计
|
// 预警处置统计
|
||||||
list.YjczDate.loading = true;
|
list.YjczDate.loading = true;
|
||||||
@ -226,6 +240,15 @@ const submit=()=>{
|
|||||||
const close = () => {
|
const close = () => {
|
||||||
semdFqzlRef.value.close()
|
semdFqzlRef.value.close()
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// 标点上图
|
||||||
|
const markAbove = (val) => {
|
||||||
|
const icon = require('@/assets/point/yj.png')
|
||||||
|
emitter.emit('setMapCenter', { location: [val.jd, val.wd], zoomLevel: 15 });
|
||||||
|
emitter.emit("addPointArea", { flag: 'home_yj_detail', icon, coords: [val] })
|
||||||
|
}
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
|||||||
@ -8,9 +8,14 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="form_cnt">
|
<div class="form_cnt">
|
||||||
<div>
|
<VueDraggable @update="onUpdate"
|
||||||
|
@add="onAdd"
|
||||||
|
@remove="remove">
|
||||||
<el-button type="primary" v-for="(item,index) in listBut" :key="index">{{ item }}</el-button>
|
<el-button type="primary" v-for="(item,index) in listBut" :key="index">{{ item }}</el-button>
|
||||||
</div>
|
</VueDraggable>
|
||||||
|
<VueDraggable>
|
||||||
|
<el-button type="primary" v-for="(item,index) in listBut" :key="index">{{ item }}</el-button>
|
||||||
|
</VueDraggable>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
@ -18,6 +23,7 @@
|
|||||||
<script setup>
|
<script setup>
|
||||||
import { reactive, ref } from 'vue'
|
import { reactive, ref } from 'vue'
|
||||||
import FormMessage from "@/components/aboutTable/FormMessage.vue";
|
import FormMessage from "@/components/aboutTable/FormMessage.vue";
|
||||||
|
import { VueDraggable } from 'vue-draggable-plus'
|
||||||
const dialogForm = ref(false)
|
const dialogForm = ref(false)
|
||||||
const title = ref("新增")
|
const title = ref("新增")
|
||||||
const init = (type, row) => {
|
const init = (type, row) => {
|
||||||
@ -41,6 +47,18 @@ const listBut = ref(["物品", "人员", "组织", "次数", "事件", "地点",
|
|||||||
const close = () => {
|
const close = () => {
|
||||||
dialogForm.value = false
|
dialogForm.value = false
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const onUpdate = (evt) => {
|
||||||
|
console.log(evt)
|
||||||
|
}
|
||||||
|
// 新增
|
||||||
|
const onAdd = (evt) => {
|
||||||
|
console.log(evt)
|
||||||
|
}
|
||||||
|
// 删除
|
||||||
|
const remove = (evt) => {
|
||||||
|
console.log(evt)
|
||||||
|
}
|
||||||
defineExpose({
|
defineExpose({
|
||||||
init
|
init
|
||||||
})
|
})
|
||||||
|
|||||||
@ -13,7 +13,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<ul class="cntlsit mb10" v-if="show" v-infinite-scroll="load" :style="{ height: listHeight + 'px' }"
|
<ul class="cntlsit mb10" v-if="show" v-infinite-scroll="load" :style="{ height: listHeight + 'px' }"
|
||||||
v-loading="loading">
|
v-loading="loading">
|
||||||
<li class="cntItem" v-for="(it, idx) in list" :key="idx">
|
<li class="cntItem" v-for="(it, idx) in 10" :key="idx">
|
||||||
<div class="ww100" @click.stop="openAddModel('detail', it)"><img class="ww100" style="height: 168px;"
|
<div class="ww100" @click.stop="openAddModel('detail', it)"><img class="ww100" style="height: 168px;"
|
||||||
src="@/assets/images/mxbg.jpg" alt=""></div>
|
src="@/assets/images/mxbg.jpg" alt=""></div>
|
||||||
<div class="foot">
|
<div class="foot">
|
||||||
|
|||||||
@ -0,0 +1,324 @@
|
|||||||
|
<template>
|
||||||
|
<div class="dialog" v-if="dialogForm">
|
||||||
|
<div class="head_box">
|
||||||
|
<span class="title">组合标签管理{{ title }} </span>
|
||||||
|
<div>
|
||||||
|
<el-button
|
||||||
|
type="primary"
|
||||||
|
size="small"
|
||||||
|
:loading="loading"
|
||||||
|
@click="submit"
|
||||||
|
>保存</el-button
|
||||||
|
>
|
||||||
|
<el-button size="small" @click="close">关闭</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="form_cnt">
|
||||||
|
<FormMessage
|
||||||
|
v-model="listQuery"
|
||||||
|
:formList="formData"
|
||||||
|
ref="elform"
|
||||||
|
:rules="rules"
|
||||||
|
>
|
||||||
|
<!-- 身份标签细类 -->
|
||||||
|
<template #sfbqIdList>
|
||||||
|
<el-button @click="openDialog('01')">选择</el-button>
|
||||||
|
<div class="boxlist">
|
||||||
|
<MyTable
|
||||||
|
:tableData="tableDate.sfbqIdList"
|
||||||
|
:tableColumn="tableDate.tableColumn"
|
||||||
|
:tableHeight="tableDate.tableHeight"
|
||||||
|
:key="tableDate.keyCount"
|
||||||
|
:tableConfiger="tableDate.tableConfiger"
|
||||||
|
:controlsWidth="tableDate.controlsWidth"
|
||||||
|
>
|
||||||
|
<template #bqLx="{ row }">
|
||||||
|
<DictTag
|
||||||
|
:value="row.bqLx"
|
||||||
|
:tag="false"
|
||||||
|
:options="props.dic.D_GS_BQ_LX"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
<template #bqLb="{ row }">
|
||||||
|
<DictTag
|
||||||
|
:value="row.bqLb"
|
||||||
|
:tag="false"
|
||||||
|
:options="props.dic.D_GS_BQ_LB"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
<template #bqYs="{ row }">
|
||||||
|
<DictTag
|
||||||
|
:value="row.bqYs"
|
||||||
|
:tag="false"
|
||||||
|
:options="props.dic.D_GS_SSYJ"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
<template #bqDj="{ row }">
|
||||||
|
<DictTag
|
||||||
|
:tag="false"
|
||||||
|
:value="row.bqDj"
|
||||||
|
:options="props.dic.D_GS_BQ_DJ"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
<!-- 操作 -->
|
||||||
|
<template #controls="{ row }">
|
||||||
|
<el-link
|
||||||
|
type="danger"
|
||||||
|
@click="delDictItem(row.id, '身份标签细类')"
|
||||||
|
>删除</el-link
|
||||||
|
>
|
||||||
|
</template>
|
||||||
|
</MyTable>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<!-- 行为标签细类 -->
|
||||||
|
<template #xwbqIdList>
|
||||||
|
<el-button @click="openDialog('02')">选择</el-button>
|
||||||
|
<div class="boxlist">
|
||||||
|
<MyTable
|
||||||
|
:tableData="tableDate.xwbqIdList"
|
||||||
|
:tableColumn="tableDate.tableColumn"
|
||||||
|
:tableHeight="tableDate.tableHeight"
|
||||||
|
:key="tableDate.keyCount"
|
||||||
|
:tableConfiger="tableDate.tableConfiger"
|
||||||
|
:controlsWidth="tableDate.controlsWidth"
|
||||||
|
>
|
||||||
|
<template #bqLx="{ row }">
|
||||||
|
<DictTag
|
||||||
|
:value="row.bqLx"
|
||||||
|
:tag="false"
|
||||||
|
:options="props.dic.D_GS_BQ_LX"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
<template #bqLb="{ row }">
|
||||||
|
<DictTag
|
||||||
|
:value="row.bqLb"
|
||||||
|
:tag="false"
|
||||||
|
:options="props.dic.D_GS_BQ_LB"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
<template #bqYs="{ row }">
|
||||||
|
<DictTag
|
||||||
|
:value="row.bqYs"
|
||||||
|
:tag="false"
|
||||||
|
:options="props.dic.D_GS_SSYJ"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
<template #bqDj="{ row }">
|
||||||
|
<DictTag
|
||||||
|
:tag="false"
|
||||||
|
:value="row.bqDj"
|
||||||
|
:options="props.dic.D_GS_BQ_DJ"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
<!-- 操作 -->
|
||||||
|
<template #controls="{ row }">
|
||||||
|
<el-link
|
||||||
|
type="danger"
|
||||||
|
@click="delDictItem(row.id, '行为标签细类')"
|
||||||
|
>删除</el-link
|
||||||
|
>
|
||||||
|
</template>
|
||||||
|
</MyTable>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</FormMessage>
|
||||||
|
</div>
|
||||||
|
<!-- 列表弹窗 -->
|
||||||
|
<DialogList
|
||||||
|
:Single="false"
|
||||||
|
:roleIds="roleIds"
|
||||||
|
v-if="chooseShow"
|
||||||
|
:dic="props.dic"
|
||||||
|
@chooseDate="chooseDate"
|
||||||
|
:titleValue="chooseTitle"
|
||||||
|
v-model="chooseShow"
|
||||||
|
:bqLx="chooseType"
|
||||||
|
bqDl="02"
|
||||||
|
></DialogList>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||||
|
import DialogList from "@/views/backOfficeSystem/fourColorManage/components/dialogList.vue";
|
||||||
|
import FormMessage from "@/components/aboutTable/FormMessage.vue";
|
||||||
|
import { qcckGet, qcckPost, qcckPut } from "@/api/qcckApi.js";
|
||||||
|
import {
|
||||||
|
ref,
|
||||||
|
defineExpose,
|
||||||
|
defineProps,
|
||||||
|
reactive,
|
||||||
|
defineEmits,
|
||||||
|
getCurrentInstance
|
||||||
|
} from "vue";
|
||||||
|
const emit = defineEmits(["updateDate"]);
|
||||||
|
const { proxy } = getCurrentInstance();
|
||||||
|
const props = defineProps({
|
||||||
|
dic: Object
|
||||||
|
});
|
||||||
|
const roleIds = ref([]); //角色id
|
||||||
|
const chooseType = ref("01"); //选择弹窗类型
|
||||||
|
const chooseShow = ref(false); //选择弹窗
|
||||||
|
const chooseTitle = ref(""); //选择弹窗
|
||||||
|
const dialogForm = ref(false); //弹窗
|
||||||
|
const formData = reactive([
|
||||||
|
{ label: "组合标签名称", prop: "bqMc", type: "input" },
|
||||||
|
{ label: "组合标签代码", prop: "bqDm", type: "input" },
|
||||||
|
{
|
||||||
|
label: "标签等级",
|
||||||
|
prop: "bqDj",
|
||||||
|
type: "select",
|
||||||
|
options: props.dic.D_GS_BQ_DJ
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "标签颜色",
|
||||||
|
prop: "bqYs",
|
||||||
|
type: "select",
|
||||||
|
options: props.dic.D_GS_SSYJ
|
||||||
|
},
|
||||||
|
{ label: "组合标签分值", prop: "bqFz", type: "input" },
|
||||||
|
{ label: "组合标签说明", prop: "bqSm", type: "input" },
|
||||||
|
{ label: "身份标签细类", prop: "sfbqIdList", type: "slot", width: "100%" },
|
||||||
|
{ label: "行为标签细类", prop: "xwbqIdList", type: "slot", width: "100%" }
|
||||||
|
]);
|
||||||
|
const rules = reactive({
|
||||||
|
bqMc: [{ required: true, message: "请输入组合标签名称", trigger: "blur" }],
|
||||||
|
bqDm: [{ required: true, message: "请输入组合标签代码", trigger: "blur" }],
|
||||||
|
zhbqjf: [{ required: true, message: "请输入组合标签积分", trigger: "blur" }],
|
||||||
|
sfbqIdList: [
|
||||||
|
{ required: true, message: "请选择身份标签细类", trigger: "change" }
|
||||||
|
],
|
||||||
|
xwbqIdList: [
|
||||||
|
{ required: true, message: "请选择行为标签细类", trigger: "change" }
|
||||||
|
]
|
||||||
|
});
|
||||||
|
|
||||||
|
const tableDate = reactive({
|
||||||
|
sfbqIdList: [], //表格数据
|
||||||
|
xwbqIdList: [], //表格数据
|
||||||
|
keyCount: 0,
|
||||||
|
tableConfiger: {
|
||||||
|
rowHieght: 61,
|
||||||
|
showSelectType: "null",
|
||||||
|
loading: false
|
||||||
|
},
|
||||||
|
total: 0,
|
||||||
|
tableHeight: 225,
|
||||||
|
pageConfiger: {
|
||||||
|
pageSize: 20,
|
||||||
|
pageCurrent: 1
|
||||||
|
}, //分页
|
||||||
|
controlsWidth: 90, //操作栏宽度
|
||||||
|
tableColumn: [
|
||||||
|
{ label: "标签名称", prop: "bqMc", showOverflowTooltip: true },
|
||||||
|
{ label: "标签代码", prop: "bqDm" },
|
||||||
|
{ label: "标签大类名称", prop: "bqDlMc" },
|
||||||
|
{ label: "标签类型", prop: "bqLx", showSolt: true },
|
||||||
|
{ label: "标签类别", prop: "bqLb", showSolt: true },
|
||||||
|
{ label: "标签颜色", prop: "bqYs", showSolt: true },
|
||||||
|
{ label: "标签等级", prop: "bqDj", showSolt: true }
|
||||||
|
]
|
||||||
|
});
|
||||||
|
const listQuery = ref({}); //表单
|
||||||
|
const loading = ref(false);
|
||||||
|
const elform = ref();
|
||||||
|
const title = ref("");
|
||||||
|
// 初始化数据
|
||||||
|
const init = (type, row) => {
|
||||||
|
dialogForm.value = true;
|
||||||
|
title.value = type == "add" ? "新增" : "编辑";
|
||||||
|
if (row) getDataById(row.id);
|
||||||
|
};
|
||||||
|
// 根据id查询详情
|
||||||
|
const getDataById = (id) => {
|
||||||
|
qcckGet({}, "/mosty-gsxt/tbGsxtBqzh/selectVoById/" + id).then((res) => {
|
||||||
|
listQuery.value = res;
|
||||||
|
tableDate.sfbqIdList = res.sfbqList;
|
||||||
|
listQuery.value.sfbqIdList = res.sfbqList.map((item) => item.id);
|
||||||
|
tableDate.xwbqIdList = res.xwbqList;
|
||||||
|
listQuery.value.xwbqIdList = res.xwbqList.map((item) => item.id);
|
||||||
|
tableDate.keyCount++;
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
// 提交
|
||||||
|
const submit = () => {
|
||||||
|
elform.value.submit((data) => {
|
||||||
|
let url =
|
||||||
|
title.value == "新增"
|
||||||
|
? "/mosty-gsxt/tbGsxtBqzh/save"
|
||||||
|
: "/mosty-gsxt/tbGsxtBqzh/update";
|
||||||
|
let params = { ...data };
|
||||||
|
loading.value = true;
|
||||||
|
qcckPost(params, url)
|
||||||
|
.then((res) => {
|
||||||
|
proxy.$message({ type: "success", message: title.value + "成功" });
|
||||||
|
emit("updateDate");
|
||||||
|
loading.value = false;
|
||||||
|
close();
|
||||||
|
})
|
||||||
|
.catch(() => {
|
||||||
|
loading.value = false;
|
||||||
|
});
|
||||||
|
});
|
||||||
|
};
|
||||||
|
// 打开弹窗
|
||||||
|
const openDialog = (type) => {
|
||||||
|
chooseShow.value = true;
|
||||||
|
chooseType.value = type;
|
||||||
|
chooseTitle.value = type == "01" ? "选择身份标签细类" : "选择行为标签细类";
|
||||||
|
roleIds.value =
|
||||||
|
type == "01"
|
||||||
|
? tableDate.sfbqIdList.map((item) => item.id)
|
||||||
|
: tableDate.xwbqIdList.map((item) => item.id);
|
||||||
|
};
|
||||||
|
// 选择数据
|
||||||
|
const chooseDate = (data) => {
|
||||||
|
if (chooseType.value == "01") {
|
||||||
|
tableDate.sfbqIdList = data;
|
||||||
|
listQuery.value.sfbqIdList = tableDate.sfbqIdList.map((item) => item.id);
|
||||||
|
} else {
|
||||||
|
tableDate.xwbqIdList = data;
|
||||||
|
listQuery.value.xwbqIdList = tableDate.xwbqIdList.map((item) => item.id);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
// 删除
|
||||||
|
const delDictItem = (id, type) => {
|
||||||
|
switch (type) {
|
||||||
|
case "身份标签细类":
|
||||||
|
tableDate.sfbqIdList = tableDate.sfbqIdList.filter(
|
||||||
|
(item) => item.id !== id
|
||||||
|
);
|
||||||
|
listQuery.value.sfbqIdList = tableDate.sfbqIdList.map((item) => item.id);
|
||||||
|
break;
|
||||||
|
case "行为标签细类":
|
||||||
|
tableDate.xwbqIdList = tableDate.xwbqIdList.filter(
|
||||||
|
(item) => item.id !== id
|
||||||
|
);
|
||||||
|
listQuery.value.xwbqIdList = tableDate.xwbqIdList.map((item) => item.id);
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
// 关闭
|
||||||
|
const close = () => {
|
||||||
|
listQuery.value = {};
|
||||||
|
tableDate.sfbqIdList = [];
|
||||||
|
tableDate.xwbqIdList = [];
|
||||||
|
dialogForm.value = false;
|
||||||
|
loading.value = false;
|
||||||
|
};
|
||||||
|
defineExpose({ init });
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
@import "~@/assets/css/layout.scss";
|
||||||
|
@import "~@/assets/css/element-plus.scss";
|
||||||
|
.boxlist {
|
||||||
|
width: 99%;
|
||||||
|
height: 225px;
|
||||||
|
margin-top: 10px;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,141 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<!-- 表格 -->
|
||||||
|
|
||||||
|
<div class="tabBox">
|
||||||
|
|
||||||
|
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
|
||||||
|
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
|
||||||
|
<template #yjTp="{ row }">
|
||||||
|
<el-image :preview-teleported="true" style="width: 80px; height: 110px" :src="row.yjTp"
|
||||||
|
:preview-src-list="[row.yjTp]" />
|
||||||
|
</template>
|
||||||
|
<template #nl="{ row }">
|
||||||
|
{{ IdCard(row.yjRysfzh, 3) }}
|
||||||
|
</template>
|
||||||
|
<template #xb="{ row }">
|
||||||
|
{{ IdCard(row.yjRysfzh, 2) }}
|
||||||
|
</template>
|
||||||
|
<template #xsd="{ row }">
|
||||||
|
90%
|
||||||
|
</template>
|
||||||
|
<!-- 操作 -->
|
||||||
|
<template #controls="{ row }">
|
||||||
|
<el-link type="danger" @click="delDictItem(row.id)">删除</el-link>
|
||||||
|
</template>
|
||||||
|
</MyTable>
|
||||||
|
<Pages @changeNo="changeNo" @changeSize="changeSize" :tableHeight="pageData.tableHeight" :pageConfiger="{
|
||||||
|
...pageData.pageConfiger,
|
||||||
|
total: pageData.total
|
||||||
|
}"></Pages>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||||
|
import Pages from "@/components/aboutTable/Pages.vue";
|
||||||
|
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
|
||||||
|
import { IdCard } from '@/utils/validate.js'
|
||||||
|
import { tbYjxxGetPageList } from '@/api/yj.js'
|
||||||
|
import { reactive, ref, onMounted, getCurrentInstance, nextTick } from "vue";
|
||||||
|
const { proxy } = getCurrentInstance();
|
||||||
|
const detailDiloag = ref();
|
||||||
|
|
||||||
|
const queryFrom = ref({});
|
||||||
|
const pageData = reactive({
|
||||||
|
tableData: [], //表格数据
|
||||||
|
keyCount: 0,
|
||||||
|
tableConfiger: {
|
||||||
|
rowHieght: 61,
|
||||||
|
showSelectType: "null",
|
||||||
|
loading: false,
|
||||||
|
haveControls:false
|
||||||
|
},
|
||||||
|
|
||||||
|
total: 0,
|
||||||
|
pageConfiger: {
|
||||||
|
pageSize: 20,
|
||||||
|
pageCurrent: 1
|
||||||
|
}, //分页
|
||||||
|
controlsWidth: 160, //操作栏宽度
|
||||||
|
tableColumn: [
|
||||||
|
{ label: "人像照片", prop: "yjTp", showSolt: true },
|
||||||
|
{ label: "姓名", prop: "yjRyxm" },
|
||||||
|
{ label: "年龄", prop: "nl", showSolt: true },
|
||||||
|
{ label: "性别", prop: "xb", showSolt: true },
|
||||||
|
{ label: "预警级别", prop: "yjJb" },
|
||||||
|
{ label: "相似度", prop: "xsd", showSolt: true },
|
||||||
|
{ label: "预警时间", prop: "yjSj", showOverflowTooltip: true },
|
||||||
|
{ label: "预警地点", prop: "yjDz", showOverflowTooltip: true },
|
||||||
|
{ label: "预警次数", prop: "yjCs", showOverflowTooltip: true },
|
||||||
|
{ label: "布控手机号", prop: "yjRysjh", showOverflowTooltip: true },
|
||||||
|
{ label: "布控车牌号", prop: "yjClcph", showOverflowTooltip: true },
|
||||||
|
{ label: "身份证", prop: "yjRysfzh", showOverflowTooltip: true },
|
||||||
|
]
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
tabHeightFn();
|
||||||
|
getList()
|
||||||
|
});
|
||||||
|
|
||||||
|
const changeNo = (val) => {
|
||||||
|
pageData.pageConfiger.pageCurrent = val;
|
||||||
|
getList()
|
||||||
|
}
|
||||||
|
const changeSize = (val) => {
|
||||||
|
pageData.pageConfiger.pageSize = val;
|
||||||
|
getList()
|
||||||
|
}
|
||||||
|
|
||||||
|
const getList = (val) => {
|
||||||
|
pageData.tableConfiger.loading = true;
|
||||||
|
const promes = {
|
||||||
|
...val,
|
||||||
|
pageCurrent: pageData.pageConfiger.pageCurrent,
|
||||||
|
pageSize: pageData.pageConfiger.pageSize
|
||||||
|
}
|
||||||
|
tbYjxxGetPageList(promes).then((res) => {
|
||||||
|
pageData.tableData = res.records;
|
||||||
|
pageData.total = res.total;
|
||||||
|
pageData.tableConfiger.loading = false;
|
||||||
|
}).catch(() => {
|
||||||
|
pageData.tableConfiger.loading = false;
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
// 表格高度计算
|
||||||
|
const tabHeightFn = () => {
|
||||||
|
pageData.tableHeight = window.innerHeight - 430;
|
||||||
|
window.onresize = function () {
|
||||||
|
tabHeightFn();
|
||||||
|
};
|
||||||
|
};
|
||||||
|
defineExpose({
|
||||||
|
getList
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.el-loading-mask {
|
||||||
|
background: rgba(0, 0, 0, 0.5) !important;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
313
src/views/backOfficeSystem/fourColorManage/warningList/index.vue
Normal file
313
src/views/backOfficeSystem/fourColorManage/warningList/index.vue
Normal file
@ -0,0 +1,313 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<div class="titleBox">
|
||||||
|
<PageTitle title="预警列表" />
|
||||||
|
</div>
|
||||||
|
<!-- 搜索 -->
|
||||||
|
<div ref="searchBox" class="searchBox">
|
||||||
|
<el-form :model="listQuery" label-width="auto" :inline="true" ref="searchArr">
|
||||||
|
<el-form-item label="布控类型" prop="yjlx">
|
||||||
|
<el-select v-model="listQuery.yjlx" placeholder="请选择预警类型">
|
||||||
|
<el-option v-for="item in D_BZ_YJLX" :key="item.value" :label="item.label" :value="item.value" />
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="布控人员" prop="yjRyxm ">
|
||||||
|
<el-select v-model="listQuery.yjRyxm" filterable remote reserve-keyword placeholder="请选择布控人员"
|
||||||
|
:remote-method="remoteMethod" :loading="loading" style="width: 240px">
|
||||||
|
<el-option v-for="item in opentions" :key="item.rySfzh" :label="item.ryXm" :value="item.rySfzh" />
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="时间筛选">
|
||||||
|
<el-date-picker v-model="listQuery.time" type="datetimerange" :shortcuts="shortcuts" range-separator="To"
|
||||||
|
start-placeholder="开始时间" end-placeholder="结束时间" value-format="YYYY-MM-DD HH:mm:ss"
|
||||||
|
format="YYYY-MM-DD HH:mm:ss" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item>
|
||||||
|
<el-button type="primary" @click="onSearch">查询</el-button>
|
||||||
|
<el-button @click="resetForm(searchArr)">重置</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<!-- 表格 -->
|
||||||
|
<div class="tabBox" :style="{ height: pageData.tableHeight + 'px' }">
|
||||||
|
<el-tabs v-model="activeName" type="card" class="demo-tabs" @tab-click="handleClick">
|
||||||
|
<el-tab-pane label="本地预警" name="local">
|
||||||
|
<div style="padding:0 10px;"> <el-button type="primary" @click="exportExcel">导出</el-button></div>
|
||||||
|
<LocalWarning ref="localWarningRef" />
|
||||||
|
</el-tab-pane>
|
||||||
|
<el-tab-pane label="区厅预警" name="district">区厅预警</el-tab-pane>
|
||||||
|
</el-tabs>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<el-dialog v-model="showDc" title="导出预警" width="80%" align-center>
|
||||||
|
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="500"
|
||||||
|
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
|
||||||
|
<template #yjTp="{ row }">
|
||||||
|
<el-image :preview-teleported="true" style="width: 80px; height: 110px" :src="row.yjTp"
|
||||||
|
:preview-src-list="[row.yjTp]" />
|
||||||
|
</template>
|
||||||
|
<template #nl="{ row }">
|
||||||
|
{{ IdCard(row.yjRysfzh, 3) }}
|
||||||
|
</template>
|
||||||
|
<template #xb="{ row }">
|
||||||
|
{{ IdCard(row.yjRysfzh, 2) }}
|
||||||
|
</template>
|
||||||
|
<template #xsd="{ row }">
|
||||||
|
90%
|
||||||
|
</template>
|
||||||
|
<!-- 操作 -->
|
||||||
|
</MyTable>
|
||||||
|
|
||||||
|
<template #footer>
|
||||||
|
<div class="dialog-footer">
|
||||||
|
<el-button @click="showDc = false">关闭</el-button>
|
||||||
|
<el-button type="primary" @click="handleExport">
|
||||||
|
导出
|
||||||
|
</el-button>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-dialog>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
||||||
|
import Search from "@/components/aboutTable/Search.vue";
|
||||||
|
import * as MOSTY from "@/components/MyComponents/index";
|
||||||
|
import { IdCard } from '@/utils/validate.js'
|
||||||
|
import { tbGsxtZdrySelectList } from "@/api/zdr.js"
|
||||||
|
import { tbYjxxQueryYjxx } from "@/api/yj.js";
|
||||||
|
import LocalWarning from "./components/localWarning.vue";
|
||||||
|
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||||
|
import { reactive, ref, onMounted, getCurrentInstance, nextTick } from "vue";
|
||||||
|
import FileSaver from "file-saver";
|
||||||
|
import * as XLSX from "xlsx";
|
||||||
|
const { proxy } = getCurrentInstance();
|
||||||
|
const { D_BZ_YJLX } = proxy.$dict("D_BZ_YJLX")
|
||||||
|
const searchBox = ref(); //搜索框
|
||||||
|
const form = ref({});
|
||||||
|
const shortcuts = [
|
||||||
|
{
|
||||||
|
text: '近一周',
|
||||||
|
value: () => {
|
||||||
|
const end = new Date()
|
||||||
|
const start = new Date()
|
||||||
|
start.setDate(start.getDate() - 7)
|
||||||
|
return [start, end]
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
text: '近一月',
|
||||||
|
value: () => {
|
||||||
|
const end = new Date()
|
||||||
|
const start = new Date()
|
||||||
|
start.setMonth(start.getMonth() - 1)
|
||||||
|
return [start, end]
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
text: '近三月',
|
||||||
|
value: () => {
|
||||||
|
const end = new Date()
|
||||||
|
const start = new Date()
|
||||||
|
start.setMonth(start.getMonth() - 3)
|
||||||
|
return [start, end]
|
||||||
|
},
|
||||||
|
},
|
||||||
|
]
|
||||||
|
|
||||||
|
const pageData = reactive({
|
||||||
|
tableData: [], //表格数据
|
||||||
|
keyCount: 0,
|
||||||
|
tableConfiger: {
|
||||||
|
rowHieght: 61,
|
||||||
|
showSelectType: "null",
|
||||||
|
loading: false,
|
||||||
|
haveControls: false
|
||||||
|
},
|
||||||
|
|
||||||
|
total: 0,
|
||||||
|
pageConfiger: {
|
||||||
|
pageSize: 20,
|
||||||
|
pageCurrent: 1
|
||||||
|
}, //分页
|
||||||
|
controlsWidth: 160, //操作栏宽度
|
||||||
|
tableColumn: [
|
||||||
|
{ label: "人像照片", prop: "yjTp", showSolt: true },
|
||||||
|
{ label: "姓名", prop: "yjRyxm" },
|
||||||
|
{ label: "年龄", prop: "nl", showSolt: true },
|
||||||
|
{ label: "性别", prop: "xb", showSolt: true },
|
||||||
|
{ label: "预警级别", prop: "yjJb" },
|
||||||
|
{ label: "相似度", prop: "xsd", showSolt: true },
|
||||||
|
{ label: "预警时间", prop: "yjSj", showOverflowTooltip: true },
|
||||||
|
{ label: "预警地点", prop: "yjDz", showOverflowTooltip: true },
|
||||||
|
{ label: "预警次数", prop: "yjCs", showOverflowTooltip: true },
|
||||||
|
{ label: "布控手机号", prop: "yjRysjh", showOverflowTooltip: true },
|
||||||
|
{ label: "布控车牌号", prop: "yjClcph", showOverflowTooltip: true },
|
||||||
|
{ label: "身份证", prop: "yjRysfzh", showOverflowTooltip: true },
|
||||||
|
]
|
||||||
|
});
|
||||||
|
const showDc = ref(false)
|
||||||
|
const activeName = ref('local')
|
||||||
|
onMounted(() => {
|
||||||
|
tabHeightFn();
|
||||||
|
});
|
||||||
|
const listQuery = reactive({})
|
||||||
|
const opentions = ref([])
|
||||||
|
const localWarningRef = ref(null);
|
||||||
|
// 搜索
|
||||||
|
const onSearch = () => {
|
||||||
|
const promes = {
|
||||||
|
yjRyxm: listQuery.yjRyxm,
|
||||||
|
yjlx: listQuery.yjlx,
|
||||||
|
startTime: listQuery.time ? listQuery.time[0] : '',
|
||||||
|
endTime: listQuery.time ? listQuery.time[1] : '',
|
||||||
|
}
|
||||||
|
localWarningRef.value.getList(promes)
|
||||||
|
}
|
||||||
|
const loading = ref(false)
|
||||||
|
const remoteMethod = (query) => {
|
||||||
|
if (query) {
|
||||||
|
loading.value = true
|
||||||
|
tbGsxtZdrySelectList({ ryXm: query }).then(res => {
|
||||||
|
opentions.value = res
|
||||||
|
}).finally(() => {
|
||||||
|
loading.value = false
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
opentions.value = []
|
||||||
|
}
|
||||||
|
}
|
||||||
|
const searchArr = ref(null)
|
||||||
|
const resetForm = (formEl) => {
|
||||||
|
if (!formEl) return
|
||||||
|
formEl.resetFields()
|
||||||
|
}
|
||||||
|
// 表格高度计算
|
||||||
|
const tabHeightFn = () => {
|
||||||
|
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
||||||
|
window.onresize = function () {
|
||||||
|
tabHeightFn();
|
||||||
|
};
|
||||||
|
};
|
||||||
|
|
||||||
|
// 导出
|
||||||
|
|
||||||
|
const exportExcel = () => {
|
||||||
|
const promes = {
|
||||||
|
yjRyxm: listQuery.yjRyxm,
|
||||||
|
yjlx: listQuery.yjlx,
|
||||||
|
startTime: listQuery.time ? listQuery.time[0] : '',
|
||||||
|
endTime: listQuery.time ? listQuery.time[1] : '',
|
||||||
|
}
|
||||||
|
tbYjxxQueryYjxx(promes).then(res => {
|
||||||
|
pageData.tableData = res
|
||||||
|
showDc.value = true
|
||||||
|
})
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
// 处理Excel导出
|
||||||
|
const handleExport = () => {
|
||||||
|
// 创建一个临时表格用于导出
|
||||||
|
const tempTable = document.createElement('table');
|
||||||
|
|
||||||
|
// 创建表头
|
||||||
|
const thead = document.createElement('thead');
|
||||||
|
const headerRow = document.createElement('tr');
|
||||||
|
|
||||||
|
// 添加序号列
|
||||||
|
const indexTh = document.createElement('th');
|
||||||
|
indexTh.textContent = '序号';
|
||||||
|
headerRow.appendChild(indexTh);
|
||||||
|
|
||||||
|
// 添加其他列头
|
||||||
|
pageData.tableColumn.forEach(column => {
|
||||||
|
const th = document.createElement('th');
|
||||||
|
th.textContent = column.label;
|
||||||
|
headerRow.appendChild(th);
|
||||||
|
});
|
||||||
|
|
||||||
|
thead.appendChild(headerRow);
|
||||||
|
tempTable.appendChild(thead);
|
||||||
|
|
||||||
|
// 创建表体
|
||||||
|
const tbody = document.createElement('tbody');
|
||||||
|
|
||||||
|
// 处理表格数据
|
||||||
|
pageData.tableData.forEach((row, index) => {
|
||||||
|
const tr = document.createElement('tr');
|
||||||
|
|
||||||
|
// 添加序号
|
||||||
|
const indexTd = document.createElement('td');
|
||||||
|
indexTd.textContent = index + 1;
|
||||||
|
tr.appendChild(indexTd);
|
||||||
|
|
||||||
|
// 添加其他单元格数据
|
||||||
|
pageData.tableColumn.forEach(column => {
|
||||||
|
const td = document.createElement('td');
|
||||||
|
|
||||||
|
// 处理自定义插槽的情况
|
||||||
|
if (column.showSolt) {
|
||||||
|
if (column.prop === 'yjTp') {
|
||||||
|
// 照片字段只显示文字描述
|
||||||
|
td.textContent = '有照片';
|
||||||
|
} else if (column.prop === 'nl') {
|
||||||
|
// 年龄字段
|
||||||
|
td.textContent = IdCard(row.yjRysfzh, 3);
|
||||||
|
} else if (column.prop === 'xb') {
|
||||||
|
// 性别字段
|
||||||
|
td.textContent = IdCard(row.yjRysfzh, 2);
|
||||||
|
} else if (column.prop === 'xsd') {
|
||||||
|
// 相似度字段
|
||||||
|
td.textContent = '90%';
|
||||||
|
} else {
|
||||||
|
// 其他字段
|
||||||
|
td.textContent = row[column.prop] || '';
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
// 普通字段
|
||||||
|
td.textContent = row[column.prop] || '';
|
||||||
|
}
|
||||||
|
|
||||||
|
tr.appendChild(td);
|
||||||
|
});
|
||||||
|
|
||||||
|
tbody.appendChild(tr);
|
||||||
|
});
|
||||||
|
|
||||||
|
tempTable.appendChild(tbody);
|
||||||
|
|
||||||
|
// 执行Excel导出
|
||||||
|
let xlsxParam = { raw: true };
|
||||||
|
let wb = XLSX.utils.table_to_book(tempTable, xlsxParam);
|
||||||
|
let wbout = XLSX.write(wb, {
|
||||||
|
bookType: "xlsx",
|
||||||
|
bookSST: true,
|
||||||
|
type: "array"
|
||||||
|
});
|
||||||
|
|
||||||
|
// 保存文件
|
||||||
|
try {
|
||||||
|
const exportTime = new Date().toLocaleString('zh-CN').replace(/\//g, '-').replace(/:/g, '-');
|
||||||
|
FileSaver.saveAs(
|
||||||
|
new Blob([wbout], { type: "application/octet-stream" }),
|
||||||
|
`预警数据导出_${exportTime}.xlsx`
|
||||||
|
);
|
||||||
|
showDc.value = false;
|
||||||
|
} catch (e) {
|
||||||
|
console.error('导出Excel失败:', e);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.el-loading-mask {
|
||||||
|
background: rgba(0, 0, 0, 0.5) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.searchBox {
|
||||||
|
background-color: #fff;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -8,7 +8,6 @@
|
|||||||
</li>
|
</li>
|
||||||
<MOSTY.Empty :show="props.data.length <= 0" :imgSize="150"></MOSTY.Empty>
|
<MOSTY.Empty :show="props.data.length <= 0" :imgSize="150"></MOSTY.Empty>
|
||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
<!-- :style="{height: `calc(100vh - ${handleHs}px)`}" -->
|
<!-- :style="{height: `calc(100vh - ${handleHs}px)`}" -->
|
||||||
|
|
||||||
<div style="position:relative;width: 100%;" :style="{ height: `calc(100vh - ${handleHs}px)` }">
|
<div style="position:relative;width: 100%;" :style="{ height: `calc(100vh - ${handleHs}px)` }">
|
||||||
|
|||||||
43
src/views/home/dialog/components/popupWarning.vue
Normal file
43
src/views/home/dialog/components/popupWarning.vue
Normal file
@ -0,0 +1,43 @@
|
|||||||
|
<template>
|
||||||
|
<div style="position: absolute;top: 34%;left: 42%;transform: translate(-50%, -50%);z-index: 1;" v-if="show">
|
||||||
|
<div style="width: 100%;background: #1d5db4e3;padding: 8px 5px;" class="flex align-center just-between ">
|
||||||
|
<span >详情</span><el-icon size="20px" @click="close" style="cursor: pointer;">
|
||||||
|
<Close />
|
||||||
|
</el-icon>
|
||||||
|
</div>
|
||||||
|
<YjItem :item="data" :track="false" />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</template>
|
||||||
|
<script setup>
|
||||||
|
import YjItem from "@/views/backOfficeSystem/IntelligentControl/warningControl/components/yjItem.vue";
|
||||||
|
import { ref, defineProps, onMounted, watch } from "vue";
|
||||||
|
import emitter from "@/utils/eventBus.js";
|
||||||
|
//参数传递
|
||||||
|
const props = defineProps({
|
||||||
|
//某条预警详情
|
||||||
|
data: {
|
||||||
|
type: Array,
|
||||||
|
default: []
|
||||||
|
},
|
||||||
|
show: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
|
});
|
||||||
|
console.log(props.show);
|
||||||
|
|
||||||
|
//关闭
|
||||||
|
function close() {
|
||||||
|
emitter.emit('deletePointArea', 'home_yj_detail');
|
||||||
|
emitter.emit("showHomeWarning", false);
|
||||||
|
}
|
||||||
|
onMounted(() => {
|
||||||
|
|
||||||
|
})
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
@import "@/assets/css/homeScreen.scss";
|
||||||
|
</style>
|
||||||
@ -2,19 +2,23 @@
|
|||||||
<div class="noScollLine">
|
<div class="noScollLine">
|
||||||
<!-- 预警信息弹框 -->
|
<!-- 预警信息弹框 -->
|
||||||
<Home_YJ v-if="isShow.showYj" :show="isShow.showYj" :data="list.Info_YJ" />
|
<Home_YJ v-if="isShow.showYj" :show="isShow.showYj" :data="list.Info_YJ" />
|
||||||
|
<PopupWarning v-if="isShow.showWarning" :show="isShow.showWarning" :data="list.Info_Warning" />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import emitter from "@/utils/eventBus.js";
|
import emitter from "@/utils/eventBus.js";
|
||||||
import Home_YJ from "./components/home_yj.vue";
|
import Home_YJ from "./components/home_yj.vue";
|
||||||
|
import PopupWarning from './components/popupWarning'
|
||||||
import { ref, onMounted, onUnmounted, reactive, getCurrentInstance } from "vue";
|
import { ref, onMounted, onUnmounted, reactive, getCurrentInstance } from "vue";
|
||||||
const { proxy } = getCurrentInstance();
|
const { proxy } = getCurrentInstance();
|
||||||
const isShow = ref({
|
const isShow = ref({
|
||||||
showYj: false, //预警弹窗
|
showYj: false, //预警弹窗
|
||||||
|
showWarning: false
|
||||||
});
|
});
|
||||||
const list = reactive({
|
const list = reactive({
|
||||||
Info_YJ: [], //预警数据
|
Info_YJ: [], //预警数据
|
||||||
|
Info_Warning: [],
|
||||||
});
|
});
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
@ -23,11 +27,16 @@ onMounted(() => {
|
|||||||
isShow.value.showYj = res ? true : false;
|
isShow.value.showYj = res ? true : false;
|
||||||
if (res) list.Info_YJ = res;
|
if (res) list.Info_YJ = res;
|
||||||
});
|
});
|
||||||
|
// 展示预警
|
||||||
|
emitter.on("showHomeWarning", (res) => {
|
||||||
|
isShow.value.showWarning = res ? true : false;
|
||||||
|
if (res) list.Info_Warning = res;
|
||||||
|
});
|
||||||
});
|
});
|
||||||
onUnmounted(() => {
|
onUnmounted(() => {
|
||||||
emitter.off("showHomeYJ");
|
emitter.off("showHomeYJ");
|
||||||
|
emitter.off("showHomeWarning");
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped></style>
|
||||||
</style>
|
|
||||||
|
|||||||
@ -1,7 +1,7 @@
|
|||||||
<template>
|
<template>
|
||||||
<div style="pointer-events: none" :class="props.parentClass">
|
<div style="pointer-events: none" :class="props.parentClass">
|
||||||
<el-dialog :top="props.top" style="pointer-events: auto !important;" :modal="false" draggable v-model="props.modelValue" :destroy-on-close="true"
|
<el-dialog :top="props.top" style="pointer-events: auto !important;" :modal="false" draggable v-model="props.modelValue" :destroy-on-close="true"
|
||||||
:show-close="false" :close-on-click-modal="false" :width="width" :custom-class="coumClass">
|
:show-close="false" :close-on-click-modal="false" :width="width" :custom-class="coumClass" :append-to-body="true">
|
||||||
<template #title>
|
<template #title>
|
||||||
<div class="my-header">
|
<div class="my-header">
|
||||||
<span class="imgIcon"> {{props.title}}</span>
|
<span class="imgIcon"> {{props.title}}</span>
|
||||||
@ -82,9 +82,8 @@ function closeDialog(params) {
|
|||||||
padding: 8px 10px;
|
padding: 8px 10px;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
pointer-events: auto !important;
|
pointer-events: auto !important;
|
||||||
height:calc(100% - 300px);
|
/* height:calc(100% - 300px); */
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
|
|
||||||
}
|
}
|
||||||
.zdy-model-dialog .el-dialog__header {
|
.zdy-model-dialog .el-dialog__header {
|
||||||
padding: 0 !important;
|
padding: 0 !important;
|
||||||
|
|||||||
@ -4,7 +4,7 @@ function resolve(dir) {
|
|||||||
return path.join(__dirname, dir);
|
return path.join(__dirname, dir);
|
||||||
}
|
}
|
||||||
|
|
||||||
// const serverHost = "http://192.168.8.15:8006"//波哥
|
// const serverHost = "http://47.108.232.77:9537"//波哥
|
||||||
const serverHost = "http://192.168.0.231:8006"//线上
|
const serverHost = "http://192.168.0.231:8006"//线上
|
||||||
// const serverHost = "http://192.168.1.117:8006"//周
|
// const serverHost = "http://192.168.1.117:8006"//周
|
||||||
// const serverHost = "http://192.168.1.98:8006"//毛毛
|
// const serverHost = "http://192.168.1.98:8006"//毛毛
|
||||||
|
|||||||
Reference in New Issue
Block a user