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

Merge branch 'main' of http://61.139.16.27:26684/zy_oyj/sgxt_web

Browse Source
This commit is contained in:
Esacpe
2025-09-20 14:11:49 +08:00
parent 06ccb2a7f0 48cb481fe5
commit 9f503c7069
530 changed files with 185158 additions and 22008 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
src/api/yj.js Normal file
View 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
})
}

91
src/api/zdr.js
View File

@ -1,6 +1,5 @@
import request from "@/utils/request";
const api = "/mosty-api/mosty-gsxt";
// 群体性质新增
export const tbGsxtZdrySelectVoById = (params) => {
return request({
url: api + `/tbGsxtZdry/getZyryById`,
@ -16,7 +15,14 @@ export const tbGsxtZdryUpdate = (data) => {
data,
});
}
// 重点人员新增
export const tbGsxtZdrySave = (data) => {
return request({
url: api + `/tbGsxtZdry/save `,
method: "post",
data,
});
}
// 重点人员车辆信息-（新增）
export const tbZdryClxxAdd = (data) => {
return request({
@ -68,14 +74,20 @@ export const tbGsxtZdryLxrselectLxrBy = (params) => {
});
}
// 密切联系人新增或者修改接口
export const tbGsxtZdryLxrsaveOrUpdateLxr = (params) => {
export const tbGsxtZdryLxrsaveOrUpdateLxr = (data) => {
return request({
url: api + `/tbGsxtZdryLxr/saveOrUpdateLxr`,
method: "post",
params,
data,
});
}
// 密切联系人新增或者修改接口
export const tbGsxtZdryLxr = (id) => {
return request({
url: api + `/tbGsxtZdryLxr/${id}`,
method: "delete",
});
}
// 走访记录查询接口
export const tbGsxtZdryZfjlselectZfjl = (params) => {
return request({
@ -84,6 +96,21 @@ export const tbGsxtZdryZfjlselectZfjl = (params) => {
params,
});
}
// 新增或修改走访记录信息
export const tbGsxtZdryZfjlsaveOrUpdateZfjl = (data) => {
return request({
url: api + `/tbGsxtZdryZfjl/saveOrUpdateZfjl`,
method: "post",
data,
});
}
export const tbGsxtZdryZfjl = (id) => {
return request({
url: api + `/tbGsxtZdryZfjl/${id}`,
method: "delete",
});
}
// 案件信息查询接口
export const tbGsxtZdryAjxxselectAjxx = (params) => {
return request({
@ -92,3 +119,57 @@ export const tbGsxtZdryAjxxselectAjxx = (params) => {
params,
});
}
// 新增或修改案件信息
export const tbGsxtZdryAjxxSaveOrUpdateAjxx = (data) => {
return request({
url: api + `/tbGsxtZdryAjxx/saveOrUpdateAjxx`,
method: "post",
data,
});
}
export const tbGsxtZdryAjxx = (id) => {
return request({
url: api + `/tbGsxtZdryAjxx/${id} `,
method: "delete",
});
}
// 新增或修改现实表现
export const tbGsxtZdryXsbxSaveOrUpdateXsbx = (data) => {
return request({
url: api + `/tbGsxtZdryXsbx/saveOrUpdateXsbx`,
method: "post",
data,
});
}
// 查询走访记录信息
export const tbGsxtZdryXsbxSelectZfjl = (params) => {
return request({
url: api + `/tbGsxtZdryXsbx/selectXsbx`,
method: "get",
params,
});
}
// 删除走访记录信息
export const tbGsxtZdryXsbx = (id) => {
return request({
url: api + `/tbGsxtZdryXsbx/${id}`,
method: "delete",
});
}
// 查询操作日志
export const tbGsxtZdryCzrzSelectCzrz = (params) => {
return request({
url: api + `/tbGsxtZdryCzrz/selectCzrz`,
method: "get",
params,
});
}
// 不分页查询
export const tbGsxtZdrySelectList = (params) => {
return request({
url: api + `/tbGsxtZdry/selectList`,
method: "get",
params,
});
}

2
src/components/ChooseList/ChooseUser/index.vue
View File

@ -242,7 +242,7 @@ function multipleUser() {
multipleUserRef.value.toggleRowSelection(item, false);
});
}
// 根据 roleIds 进行回显
tableData.value.forEach((item) => {
if (props.roleIds.some((id) => id == item.id)) {

76
src/components/GdMap/index.vue
View File

@ -79,8 +79,6 @@ let map;
let mapLayer;
let mapLayer1;
onMounted(() => {
console.log("xxxxxxx");
emitter.on("followUp", (res) => {
let box = document.getElementsByClassName("changeMap_box");
if (!box) return;
@ -106,48 +104,48 @@ onMounted(() => {
}
});
// window.map = map;
// map.mapboxGLMap.on("load", () => {
// map.addGaudLayer({
// url: 'http://webrd02.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=8&x={x}&y={y}&z={z}',
// })
// zoomTarget.value = map.mapboxGLMap.getZoom();
// // 地图加载完成后发出事件
// emit('mapLoaded')
// });
// mapUtil.value = new MapUtil(map);
map = new EliMap({
id: props.mapid,
crs: "EPSG:4490",
style: {
glyphs: "./fonts/{fontstack}/{range}.pbf",
center: [94.36057012, 29.64276831],
zoom: 15
},
minZoom: 7,
maxZoom: 18,
});
window.map = map;
map.mapboxGLMap.on("load", () => {
map.addWMTSLayer(
"/PGIS_S_TileMapServer/Maps/XZDJ_SL/EzMap"
,
{
Service: "getImage",
Type: "RGB",
ZoomOffset: "0",
V: "0.3",
Zoom: "{z}",
Row: "{y}",
Col: "{x}"
},
{
tileSize: 300
}
);
map.addGaudLayer({
url: 'http://webrd02.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=8&x={x}&y={y}&z={z}',
})
zoomTarget.value = map.mapboxGLMap.getZoom();
// 地图加载完成后发出事件
// emit('mapLoaded')
});
mapUtil.value = new MapUtil(map);
// map = new EliMap({
// id: props.mapid,
// crs: "EPSG:4490",
// style: {
// glyphs: "./fonts/{fontstack}/{range}.pbf",
// center: [94.36057012, 29.64276831],
// zoom: 15
// },
// minZoom: 7,
// maxZoom: 18,
// });
// window.map = map;
// map.mapboxGLMap.on("load", () => {
// map.addWMTSLayer(
// "/PGIS_S_TileMapServer/Maps/XZDJ_SL/EzMap"
// ,
// {
// Service: "getImage",
// Type: "RGB",
// ZoomOffset: "0",
// V: "0.3",
// Zoom: "{z}",
// Row: "{y}",
// Col: "{x}"
// },
// {
// tileSize: 300
// }
// );
// zoomTarget.value = map.mapboxGLMap.getZoom();
// });
// mapUtil.value = new MapUtil(map);
mapUtil.value.Drawplot(); //初始化加载绘制工具
// 设置地图中心点及图层

97
src/components/GdMap/mapUtil.js
View File

@ -9,7 +9,7 @@ export function MapUtil(map) {
_that.idsBox = {} //存放id的容器（需要某个标记单个删除的时候存储）
_that.isCheck = false
/**
* 设置地图中心点以
* 设置地图中心点以
* @param {*} location 中心坐标 [jd,wd]
* @param {*} zoomLevel 层级 10
*/
@ -141,10 +141,10 @@ export function MapUtil(map) {
}
// 信息框展示
MapUtil.prototype.makerShowTitle = (item,points,flag,text) =>{
let T = flag == 'rx' ? 'rxTitle' :'Title'
let flagT = flag+T;
if(!_that._self[flagT]) _that._self[flagT] = [];
MapUtil.prototype.makerShowTitle = (item, points, flag, text) => {
let T = flag == 'rx' ? 'rxTitle' : 'Title'
let flagT = flag + T;
if (!_that._self[flagT]) _that._self[flagT] = [];
// 展示名字
let textTitle = item.jzMc ? item.jzMc : item.fzrXm + '警组';
@ -242,7 +242,7 @@ export function MapUtil(map) {
}
/**
* 聚合撒点
* 聚合撒点
* @param {*} coords 点位数据 geojson lng lat
* @param {*} icon 点位图
*/
@ -287,9 +287,9 @@ export function MapUtil(map) {
* @param {*} coords 数组
*/
MapUtil.prototype.showHeatDrawing = (res) => {
let { coords, flag,isclear ,color} = res;
if(!_that._self[flag]) _that._self[flag] = [];
if(isclear) _that.removeElement(flag) //清除热力
let { coords, flag, isclear, color } = res;
if (!_that._self[flag]) _that._self[flag] = [];
if (isclear) _that.removeElement(flag) //清除热力
let data = {
type: 'FeatureCollection',
features: []
@ -315,12 +315,12 @@ export function MapUtil(map) {
// 清除所有
MapUtil.prototype.removeAll = () => {
for(let key in _that._self){
if(key != 'rx' && key !='gpsZb' && !key.includes('rxTitle')){
for (let key in _that._self) {
if (key != 'rx' && key != 'gpsZb' && !key.includes('rxTitle')) {
let list = _that._self[key]
for (let i = 0; i < list.length; i++) {
const el = list[i];
if(el && typeof el == 'object') el.destroy() //destory()销毁 , show(false) false:隐藏 true ：展示
if (el && typeof el == 'object') el.destroy() //destory()销毁 , show(false) false:隐藏 true ：展示
}
_that._self[key] = [];
}
@ -342,7 +342,7 @@ export function MapUtil(map) {
}
}
}
if(layer == 'rx') _that.idsBox[layer] = [];
if (layer == 'rx') _that.idsBox[layer] = [];
// 其他图层
if (!_that._self[layer]) return false;
@ -354,8 +354,8 @@ export function MapUtil(map) {
_that._self[layer] = [];
// d带标题的撒点
let T = layer == 'rx' ? 'rxTitle' :'Title'
let flagT = layer+T;
let T = layer == 'rx' ? 'rxTitle' : 'Title'
let flagT = layer + T;
if (!_that._self[flagT]) return false;
for (let i = 0; i < _that._self[flagT].length; i++) {
const el = _that._self[flagT][i];
@ -376,9 +376,9 @@ export function MapUtil(map) {
_that.idsBox[layer].splice(index, 1);
if (_that._self[layer][index]) _that._self[layer][index].destroy()
_that._self[layer].splice(index, 1)
if(layer == 'rx'){
let flagT = layer +'rxTitle';
if(_that._self[flagT][index]) _that._self[flagT][index].destroy()
if (layer == 'rx') {
let flagT = layer + 'rxTitle';
if (_that._self[flagT][index]) _that._self[flagT][index].destroy()
_that._self[flagT].splice(index, 1)
_that.removeGpsZbOverlayById(id) //删除图标
}
@ -417,12 +417,12 @@ export function MapUtil(map) {
* (point 点, line 线, circle 圆, polygon 多边形, rectangle 矩形) ,
* geoJson:根据geojson回显图
*/
MapUtil.prototype.plot = (res,resFun) => {
let {flag ,color,linecolor, type ,coords} = res
if(!_that._self[flag]) _that._self[flag] = [];
if(res.isclear) _that.removePlot(flag); //移除绘制工具
if(res.isclear && (res.type == 'polygon' || res.type == 'line')) _that.removeEara(flag); //移除回显的面和线条
switch(type){
MapUtil.prototype.plot = (res, resFun) => {
let { flag, color, linecolor, type, coords } = res
if (!_that._self[flag]) _that._self[flag] = [];
if (res.isclear) _that.removePlot(flag); //移除绘制工具
if (res.isclear && (res.type == 'polygon' || res.type == 'line')) _that.removeEara(flag); //移除回显的面和线条
switch (type) {
case 'point':
_that._CustomDraw.point((val) => { _that.handlePlot(val, type, flag, resFun) })
break;
@ -486,7 +486,7 @@ export function MapUtil(map) {
})
}
/**
* 移除绘制面
* 移除绘制面
* @param {*} flag 唯一标识
*/
MapUtil.prototype.removeEara = (flag) => {
@ -499,11 +499,11 @@ export function MapUtil(map) {
* (solid 实线, dash 虚线, FlowColor 彩虹线, RoadLine 流线
*/
MapUtil.prototype.createLine = (res) => {
let { type , coords , isclear ,flag ,color,width } = res;
if(!coords) return false; // coords 是数组对象，可以同时撒多条数据
if(!_that._self[flag]) _that._self[flag] = [] ;
if(isclear) _that.removeElement(flag); //移除回显的线条
let data = coords.map((item,index)=>{
let { type, coords, isclear, flag, color, width } = res;
if (!coords) return false; // coords 是数组对象，可以同时撒多条数据
if (!_that._self[flag]) _that._self[flag] = [];
if (isclear) _that.removeElement(flag); //移除回显的线条
let data = coords.map((item, index) => {
return {
position: item.coords[0], //二维数组
text: '',
@ -670,22 +670,22 @@ export function MapUtil(map) {
}
/**geojson 创建边界
* let data = {
* type: "FeatureCollection",
* features: [
* {
geometry: {
type: "Polygon",
coordinates: [it.coordinates]
},
properties: {
},
type: "Feature",
}
* ]
};
*/
/**geojson 创建边界
* let data = {
* type: "FeatureCollection",
* features: [
* {
geometry: {
type: "Polygon",
coordinates: [it.coordinates]
},
properties: {
},
type: "Feature",
}
* ]
};
*/
MapUtil.prototype.createBoundarys = (res) => {
let { data } = res
if (!data) return false;
@ -713,8 +713,13 @@ export function MapUtil(map) {
MapUtil.prototype.openInfoDetail = (flag, data) => {
switch (flag) {
case 'home_yj_map':
console.log(data);
emitter.emit("showHomeYJ", data);
break;
case 'home_yj_detail':
console.log(data);
emitter.emit("showHomeWarning", data);
break;
}
}
}

2
src/components/aboutTable/FormMessage.vue
View File

@ -4,7 +4,7 @@
<el-form-item v-for="(item, idx) in props.formList" :style="item.width && { width: item.width }" :prop="item.prop" :label="item.label" :label-width="item.labelWidth" :key="idx">
<!-- input表单 input-->
<MOSTY.Other v-if="item.type == 'input'" width="100%" clearable v-model="listQuery[item.prop]" :placeholder="`请输入${item.label}`" :disabled="item.disabled" :readonly="item.readonly" />
<el-input v-model="listQuery[item.prop]" v-else-if="item.type == 'textarea'" type="textarea" :rows="3" :placeholder="`请输入${item.label}`" :disabled="item.disabled" />
<!-- 数值 inputNumber-->
<el-input type="number" v-model="listQuery[item.prop]" v-else-if="item.type == 'inputNumber'" :placeholder="`请输入${item.label}`" :disabled="item.disabled" />

10
src/router/index.js
View File

@ -224,6 +224,14 @@ export const publicRoutes = [
title: "预警中心",
icon: "article"
}
}, {
path: "/warningList",
name: "warningList",
component: () => import("@/views/backOfficeSystem/fourColorManage/warningList/index"),
meta: {
title: "预警列表",
icon: "article"
}
},
{
path: "/WarningModel",
@ -609,7 +617,7 @@ export const publicRoutes = [
icon: "article"
},
children: [
// {
// path: "/surveillanceControl",
// name: "surveillanceControl",

4
src/views/backOfficeSystem/BasicManagement/experienceShare/components/editAddForm.vue
View File

@ -35,9 +35,7 @@ const rules = reactive({
{ required: true, message: "请输入经验内容", trigger: "blur" }
]
});
const formData = ref([
]);
const formData = ref([]);
const listQuery = ref({}); //表单
const loading = ref(false);
const elform = ref();

7
src/views/backOfficeSystem/DeploymentDisposal/mpvGroup/model/controlInfo.vue
View File

@ -1,7 +1,7 @@
<template>
<div>
<div class="headClass" style="">
<h3>管控信息</h3>
<h3>{{title}}管控信息</h3>
<el-button type="primary" :disabled="disabled" @click="chooseMarksVisible = true">选择</el-button>
</div>
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
@ -37,6 +37,10 @@ const props = defineProps({
type: Boolean,
default: false
},
title: {
type: String,
default: "群体"
}
})
const { D_BZ_RYJZLB } = proxy.$dict('D_BZ_RYJZLB')
const pageData = reactive({
@ -75,7 +79,6 @@ const pageData = reactive({
})
onMounted(() => {
console.log('ControlInfo 组件已挂载！')
})
const listData = ref({})
watch(() => props.dataList, (val) => {

70
src/views/backOfficeSystem/DeploymentDisposal/mpvPeo/component/caseLodig.vue Normal file
View File

@ -0,0 +1,70 @@
<template>
<!-- 添加 -->
<el-dialog v-model="modelValue" :title="title" width="40%" :before-close="handleClose">
<FormMessage v-model="listQuery" :formList="formData" labelWidth="120px" ref="elform" :rules="rules">
</FormMessage>
<template #footer>
<el-button @click="handleClose">取消</el-button>
<el-button type="primary" @click="submitForm">确认</el-button>
</template>
</el-dialog>
</template>
<script setup>
import { defineProps, defineEmits, ref, watch, reactive, getCurrentInstance } from 'vue'
import FormMessage from "@/components/aboutTable/FormMessage.vue";
const { proxy } = getCurrentInstance();
const props = defineProps({
data: {
type: Object,
default: () => { }
},
modelValue: {
type: Boolean,
default: false
},
title: {
type: String,
default: '走访信息'
},
dict: {
type: Object,
default: () => { }
}
})
const emit = defineEmits(['update:modelValue', 'comfirm'])
const listQuery = ref({})
const formData = ref([
{ label: "案件名称", prop: "ajmc", type: "input", width: '100%' },
{ label: "案件时间", prop: "sasj", type: "date", width: '100%' },
{ label: "案件编码", prop: "ajbm", type: "input", width: '100%' },
])
const rules = reactive({
ajmc: [{ required: true, message: "请输入案件名称", trigger: "blur" }],
sasj: [{ required: true, message: "请输入案件时间", trigger: "change" }],
ajbm: [{ required: true, message: "请输入案件编码", trigger: "blur" }],
})
const elform=ref(null)
const submitForm = () => {
elform.value.submit((val) => {
if (val) {
emit('comfirm', val)
handleClose()
}
})
}
watch(
() => props.data,
(val) => {
listQuery.value = val ? { ...val } : {}
},
{ deep: true }
)
// 取消：关闭弹窗
const handleClose = () => {
listQuery.value = {}
emit('update:modelValue', false)
}
</script>
<style scoped lang="scss"></style>

86
src/views/backOfficeSystem/DeploymentDisposal/mpvPeo/component/diaLogForm.vue Normal file
View File

@ -0,0 +1,86 @@
<template>
<!-- 添加 -->
<el-dialog v-model="modelValue" :title="title" width="40%" :before-close="handleClose">
<el-form ref="historyForm" style="max-width: 600px" :model="diaLogRuleForm" :rules="rules">
<el-form-item label-width="160px" label="姓名" prop="ryXm" style="width: 100%;">
<el-input v-model="diaLogRuleForm.ryXm" :placeholder="`请输入联系人姓名`" />
</el-form-item>
<el-form-item label-width="160px" label="人员身份证号" prop="rySfzh" style="width: 100%;">
<el-input v-model="diaLogRuleForm.rySfzh" :placeholder="`请输入人员身份证号`" />
</el-form-item>
<el-form-item label-width="160px" label="对应关系" prop="dygx" style="width: 100%;">
<el-select v-model="diaLogRuleForm.dygx" placeholder="请选择对应关系">
<el-option v-for="item in dict.D_BZ_QSGXDM" :key="item.dm" :label="item.zdmc" :value="item.dm" />
</el-select>
</el-form-item>
<el-form-item label-width="160px" label="联系人电话" prop="lxrDh" style="width: 100%;">
<el-input v-model="diaLogRuleForm.lxrDh" :placeholder="`请输入联系人电话`" />
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button @click="handleClose">取消</el-button>
<el-button type="primary" @click="onSubmit">
确认
</el-button>
</div>
</template>
</el-dialog>
</template>
<script setup>
import { defineProps, defineEmits, ref, watch, reactive } from 'vue'
import { generateRandom10Digits } from '@/utils/tools'
const props = defineProps({
data: {
type: Object,
default: () => { }
},
modelValue: {
type: Boolean,
default: false
},
title: {
type: String,
default: ''
},
dict: {
type: Object,
default: () => { }
}
})
const historyForm = ref(null)
const emit = defineEmits(['update:modelValue', 'submit'])
const diaLogRuleForm = ref({})
const rules = reactive({
ryXm: [{ required: true, message: '请输入姓名', trigger: 'blur' }],
rySfzh: [{ required: true, message: '请输入身份证号', trigger: 'blur' }],
dygx: [{ required: true, message: '请选择对应关系', trigger: 'change' }],
})
watch(
() => props.data,
(val) => {
diaLogRuleForm.value = val ? { ...val } : {}
},
{ deep: true }
)
// 取消：关闭弹窗
const handleClose = () => {
diaLogRuleForm.value = {}
emit('update:modelValue', false)
}
// 提交
const onSubmit = () => {
historyForm.value.validate().then((valid) => {
if (valid) {
emit('submit', { ...diaLogRuleForm.value }) // 提交数据
handleClose()
}
}).catch((err) => {
console.log(err);
});
}
</script>
<style scoped lang="scss"></style>

91
src/views/backOfficeSystem/DeploymentDisposal/mpvPeo/component/interLoding.vue Normal file
View File

@ -0,0 +1,91 @@
<template>
<!-- 添加 -->
<el-dialog v-model="modelValue" :title="title" width="40%" :before-close="handleClose">
<FormMessage v-model="listQuery" :formList="formData" labelWidth="120px" ref="elform" :rules="rules">
<template #zfmjXm>
<el-input v-model="listQuery.zfmjXm" :placeholder="`请输入民警姓名`" readonly @click="changeShow" />
</template>
</FormMessage>
<template #footer>
<el-button @click="handleClose">取消</el-button>
<el-button type="primary" @click="submitForm">确认</el-button>
</template>
</el-dialog>
<ChooseUser :Single="true" v-model="chooseMarksVisible" @choosedUsers="addMarks" :roleIds="roleIds" />
</template>
<script setup>
import { defineProps, defineEmits, ref, watch, reactive, getCurrentInstance } from 'vue'
import { generateRandom10Digits } from '@/utils/tools'
import FormMessage from "@/components/aboutTable/FormMessage.vue";
import ChooseUser from "@/components/ChooseList/ChooseUser/index.vue";
const { proxy } = getCurrentInstance();
const { D_ZFNR_MBLX } = proxy.$dict("D_ZFNR_MBLX")
const props = defineProps({
data: {
type: Object,
default: () => { }
},
modelValue: {
type: Boolean,
default: false
},
title: {
type: String,
default: '走访信息'
},
dict: {
type: Object,
default: () => { }
}
})
const emit = defineEmits(['update:modelValue', 'comfirm'])
const historyForm = ref(null)
const chooseMarksVisible = ref(false)
const listQuery = ref({})
const formData = ref([
{ label: "民警姓名", prop: "zfmjXm", type: "slot", width: '100%' },
{ label: "走访时间", prop: "zfsj", type: "date", width: '100%' },
{ label: "走访地址", prop: "zfdz", type: "input", width: '100%' },
{ label: "走访方式", prop: "zffs", type: "input", width: '100%' },
{ label: "走访情况", prop: "zfqk", type: "textarea", width: '100%' },
])
const rules = reactive({
zfmjXm: [{ required: true, message: "请选择民警姓名", trigger: "blur" }],
zfsj: [{ required: true, message: "请输入走访时间", trigger: "change" }],
zfdz: [{ required: true, message: "请输入走访地址", trigger: "blur" }],
zffs: [{ required: true, message: "请输入走访方式", trigger: "blur" }],
zfqk: [{ required: true, message: "请输入走访情况", trigger: "blur" }],
})
const changeShow = () => {
chooseMarksVisible.value = true
}
const addMarks = (val) => {
listQuery.value.zfmjXm = val[0].userName
listQuery.value.zfmjSfzh=val[0].idEntityCard
}
const elform=ref(null)
const submitForm = () => {
elform.value.submit((val) => {
if (val) {
emit('comfirm', val)
handleClose()
}
})
}
watch(
() => props.data,
(val) => {
console.log(val);
listQuery.value = val ? { ...val } : {}
},
{ deep: true }
)
// 取消：关闭弹窗
const handleClose = () => {
listQuery.value = {}
emit('update:modelValue', false)
}
</script>
<style scoped lang="scss"></style>

306
src/views/backOfficeSystem/DeploymentDisposal/mpvPeo/component/judgmentRecord.vue Normal file
View File

@ -0,0 +1,306 @@
<template>
<el-dialog :title="titleValue" width="800px" :model-value="modelValue" append-to-body @close="closed">
<FormMessage v-model="listQuery" :formList="formData" labelWidth="120px" ref="elform" :rules="rules">
<template #rrry>
<el-input v-model="listQuery.rrry" :placeholder="`请输入民警姓名`" readonly @click="changeShow" />
</template>
<template #fjxx>
<!-- 文件列表区域 -->
<div class="file-attachment-section">
<div class="section-title">相关附件</div>
<div class="file-list-container">
<div v-if="listQuery.fileList.length === 0" class="empty-file-list">暂无附件</div>
<div v-else class="file-list">
<div v-for="(file, index) in listQuery.fileList" :key="index" class="file-item">
<div class="file-info">
<span class="file-name">{{ file.originalName }}</span>
<span class="file-time">{{ file.uploadTime }}</span>
</div>
<div class="file-actions">
<el-button type="text" size="small" @click="downloadFile(file)" title="下载文件" :disabled="disabled">
<el-icon>
<Download />
</el-icon>
</el-button>
<el-button type="text" size="small" @click="deleteFile(index)" title="删除文件" class="delete-btn"
:disabled="disabled">
<el-icon>
<Delete />
</el-icon>
</el-button>
</div>
</div>
</div>
</div>
<!-- 上传按钮区域 -->
<div class="upload-btn-container">
<el-upload v-model:file-list="listQuery.fileList" class="upload-demo" :show-file-list="false" multiple
:http-request="handleUploadRequest" :on-remove="handleRemove" :limit="3" :on-exceed="handleExceed">
<el-button type="primary" :disabled="disabled">上传文件</el-button>
</el-upload>
</div>
</div>
</template>
</FormMessage>
<template #footer>
<div class="dialog-footer">
<el-button @click="closed">取消</el-button>
<el-button type="primary" @click="onComfirm">确认</el-button>
</div>
</template>
</el-dialog>
<ChooseUser :Single="true" v-model="chooseMarksVisible" @choosedUsers="addMarks" :roleIds="roleIds" />
</template>
<script setup>
import { ref, onMounted, reactive, watch, getCurrentInstance } from "vue";
import { generateRandom10Digits } from '@/utils/tools'
import { uploadMultipleFiles } from '@/views/backOfficeSystem/DeploymentDisposal/mpvGroup/model/fileUp.js'
import { ElMessage } from 'element-plus';
import FormMessage from "@/components/aboutTable/FormMessage.vue";
import ChooseUser from "@/components/ChooseList/ChooseUser/index.vue";
const { proxy } = getCurrentInstance()
const props = defineProps({
modelValue: {
type: Boolean,
default: false
},
titleValue: {
type: String,
default: "研判记录"
},
data: {
type: Object,
default: () => { }
}
});
const emits = defineEmits(["update:modelValue", "comfirm"]);
const formData = ref([
{ label: "录入人员", prop: "rrry", type: "slot", width: '100%' },
{ label: "录入时间", prop: "lrsj", type: "date", width: '100%' },
{ label: "表现内容", prop: "bxnr", type: "textarea", width: '100%' },
{ label: "附件信息", prop: "fjxx", type: "slot", width: '100%' },
])
const rules = reactive({
rrry: [{ required: true, message: "请选择民警姓名", trigger: "blur" }],
lrsj: [{ required: true, message: "请输入录入时间", trigger: "change" }],
bxnr: [{ required: true, message: "请输入表现内容", trigger: "blur" }],
})
const listQuery = ref({fileList:[]})
const roleIds=ref([])
const chooseMarksVisible=ref(false)
const changeShow = () => {
chooseMarksVisible.value = true
}
const addMarks = (val) => {
listQuery.value.rrry = val[0].userName
roleIds.value = val.map(item => item.id)
}
const closed = () => {
listQuery.value={}
listQuery.value.fileList = []
emits("update:modelValue", false);
};
const onComfirm = () => {
emits("comfirm", {...listQuery.value,fjxx:listQuery.value.fileList.length>0?JSON.stringify(listQuery.value.fileList):null });
emits("update:modelValue", false);
}
watch(() => props.data, (val) => {
if (val) {
listQuery.value={...val,fileList:val.fjxx}
}
},{deep: true})
// 下载文件
const downloadFile = (file) => {
// 实际项目中，这里应该调用下载API
console.log('下载文件:', file.name)
// 示例：window.open(file.url)
}
// 删除文件
const deleteFile = (index) => {
// 实际项目中，这里应该先调用删除API，成功后再从列表中移除
listQuery.value.fileList.splice(index, 1)
ElMessage.success('文件已删除')
}
// 上传相关方法
const handleUploadRequest = async (options) => {
try {
// 调用uploadMultipleFiles进行文件上传
const result = await uploadMultipleFiles(options.file, {
uploadedFiles: listQuery.value.fileList,
fjIds: [], // 如果需要保存文件ID列表，可以在这里传递
compressImage: null // 可选的图片压缩函数
});
// 更新文件列表，添加上传时间信息
const index = listQuery.value.fileList.findIndex(f => f.originalName === options.file.name);
if (index !== -1) {
listQuery.value.fileList[index].uploadTime = new Date().toLocaleString('zh-CN');
}
// 调用成功回调
if (options.onSuccess) {
options.onSuccess(result);
}
} catch (error) {
console.error('文件上传失败:', error);
// 调用失败回调
if (options.onError) {
options.onError(error);
}
}
}
const handleRemove = (uploadFile, uploadFiles) => {
// 实际项目中，这里应该先调用删除API，成功后再从列表中移除
const index = listQuery.value.fileList.findIndex(f => f.name === uploadFile.name);
if (index !== -1) {
listQuery.value.fileList.splice(index, 1);
}
}
</script>
<style lang="scss" scoped>
@import "@/assets/css/layout.scss";
@import "@/assets/css/element-plus.scss";
</style>
<style>
.tabBoxRadio .el-checkbox__inner {
border-radius: 50% !important;
}
.tabBoxRadio .el-table__header-wrapper .el-checkbox {
display: none;
}
.file-attachment-section {
margin-top: 15px;
width: 100%;
}
.section-title {
font-size: 14px;
font-weight: 500;
color: #303133;
margin-bottom: 10px;
padding-bottom: 5px;
border-bottom: 1px solid #ebeef5;
}
.file-list-container {
max-height: 100px;
overflow-y: auto;
border: 1px solid #ebeef5;
border-radius: 4px;
background-color: #ffffff;
margin-bottom: 10px;
}
/* 自定义滚动条样式 */
.file-list-container::-webkit-scrollbar {
width: 6px;
}
.file-list-container::-webkit-scrollbar-track {
background: #f1f1f1;
border-radius: 3px;
}
.file-list-container::-webkit-scrollbar-thumb {
background: #c0c4cc;
border-radius: 3px;
}
.file-list-container::-webkit-scrollbar-thumb:hover {
background: #909399;
}
.empty-file-list {
padding: 20px;
text-align: center;
color: #909399;
font-size: 12px;
}
.file-list {
padding: 5px;
}
.file-item {
display: flex;
justify-content: space-between;
align-items: center;
padding: 8px 10px;
margin-bottom: 2px;
background-color: #f8f9fa;
border-radius: 4px;
transition: all 0.3s ease;
cursor: pointer;
}
.file-item:hover {
background-color: #e6f7ff;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}
.file-info {
flex: 1;
display: flex;
align-items: center;
gap: 15px;
min-width: 0;
}
.file-name {
flex: 1;
font-size: 12px;
color: #303133;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.file-size {
font-size: 11px;
color: #909399;
min-width: 60px;
}
.file-time {
font-size: 11px;
color: #909399;
}
.file-actions {
display: flex;
align-items: center;
gap: 5px;
margin-left: 10px;
}
.file-actions .el-button {
padding: 0 5px;
margin: 0;
color: #606266;
transition: color 0.3s ease;
}
.file-actions .el-button:hover {
color: #409eff;
}
.delete-btn:hover {
color: #f56c6c !important;
}
.upload-btn-container {
display: flex;
justify-content: center;
margin-top: 10px;
}
</style>

55
src/views/backOfficeSystem/DeploymentDisposal/mpvPeo/component/vehiclDoing.vue
View File

@ -8,25 +8,28 @@
<el-input v-model="ruleForm.clsbm" placeholder="请输入车辆识别码" />
</el-form-item>
<el-form-item label="车辆型号" prop="cllx">
<el-select v-model="ruleForm.cllx" placeholder="请选择车辆型号">
<el-option :label="item.zdmc" :value="item.dm" v-for="(item,index) in dict.D_BZ_CLLX" :key="index"></el-option>
</el-select>
</el-form-item>
<el-form-item label="车辆颜色" prop="clys">
<el-select v-model="ruleForm.clys" placeholder="请选择车辆颜色">
<el-option :label="item.zdmc" :value="item.dm" v-for="(item,index) in dict.D_BZ_CLYS" :key="index"></el-option>
</el-select>
</el-form-item>
<el-form-item label="车辆品牌" prop="clpp">
<el-select v-model="ruleForm.clpp" placeholder="请选择车辆品牌">
<el-option :label="item.zdmc" :value="item.dm" v-for="(item,index) in dict.D_BZ_CLPP" :key="index"></el-option>
</el-select>
</el-form-item>
<el-select v-model="ruleForm.cllx" placeholder="请选择车辆型号">
<el-option :label="item.zdmc" :value="item.dm" v-for="(item, index) in dict.D_BZ_CLLX"
:key="index"></el-option>
</el-select>
</el-form-item>
<el-form-item label="车辆颜色" prop="clys">
<el-select v-model="ruleForm.clys" placeholder="请选择车辆颜色">
<el-option :label="item.zdmc" :value="item.dm" v-for="(item, index) in dict.D_BZ_CLYS"
:key="index"></el-option>
</el-select>
</el-form-item>
<el-form-item label="车辆品牌" prop="clpp">
<el-select v-model="ruleForm.clpp" placeholder="请选择车辆品牌">
<el-option :label="item.zdmc" :value="item.dm" v-for="(item, index) in dict.D_BZ_CLPP"
:key="index"></el-option>
</el-select>
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button @click="closed">取消</el-button>
<el-button type="primary" @click="onComfirm">确认</el-button>
<el-button type="primary" @click="onComfirm()">确认</el-button>
</div>
</template>
</el-dialog>
@ -66,18 +69,22 @@ const rules = reactive({
});
const onComfirm = () => {
const promes = {...ruleForm.value,
id: ruleForm.value.id ? ruleForm.value.id : generateRandom10Digits(),
}
console.log(promes);
emits("comfirm", { ...promes });
closed()
historyForm.value.validate((valid, fields) => {
if (valid) {
const promes = {
...ruleForm.value,
id: ruleForm.value.id ? ruleForm.value.id : generateRandom10Digits(),
}
emits("comfirm", { ...promes });
closed()
} else {
console.log('error submit!', fields)
}
})
}
watch(() => props.modelValue, (val) => {
ruleForm.value = props.data
},{deep: true})
}, { deep: true })
const closed = () => {

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

@ -10,30 +10,32 @@
<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' : ''">群体标签</li>
:class="activeSection === 'groupLabels-section' ? 'active' : ''" v-if="!butShow">关联车辆</li>
<li @click="scrollToSection('character-section')"
:class="activeSection === 'character-section' ? 'active' : ''">群体性质</li>
:class="activeSection === 'character-section' ? 'active' : ''">背景信息</li>
<li @click="scrollToSection('controlInfo-section')"
:class="activeSection === 'controlInfo-section' ? 'active' : ''">管控信息</li>
:class="activeSection === 'controlInfo-section' ? 'active' : ''" v-if="!butShow">管控信息</li>
<li @click="scrollToSection('featinfo-section')"
:class="activeSection === 'featinfo-section' ? 'active' : ''">群体特征</li>
:class="activeSection === 'featinfo-section' ? 'active' : ''" v-if="!butShow">全要素布控</li>
<li @click="scrollToSection('demandsInfo-section')"
:class="activeSection === 'demandsInfo-section' ? 'active' : ''">主要诉求</li>
:class="activeSection === 'demandsInfo-section' ? 'active' : ''" v-if="!butShow">密切联系人</li>
<li @click="scrollToSection('requestInfo-section')"
:class="activeSection === 'requestInfo-section' ? 'active' : ''">诉求信息</li>
:class="activeSection === 'requestInfo-section' ? 'active' : ''" v-if="!butShow">动态轨迹</li>
<li @click="scrollToSection('personnel-section')"
:class="activeSection === 'personnel-section' ? 'active' : ''">重点人员</li>
:class="activeSection === 'personnel-section' ? 'active' : ''" v-if="!butShow">行为信息</li>
<li @click="scrollToSection('judgmentRecord-section')"
:class="activeSection === 'judgmentRecord-section' ? 'active' : ''">研判记录</li>
:class="activeSection === 'judgmentRecord-section' ? 'active' : ''" v-if="!butShow">走访记录</li>
<li @click="scrollToSection('historyAssembly-section')"
:class="activeSection === 'historyAssembly-section' ? 'active' : ''">历史汇集</li>
:class="activeSection === 'historyAssembly-section' ? 'active' : ''" v-if="!butShow">案件信息</li>
<li @click="scrollToSection('joblogging-section')"
:class="activeSection === 'joblogging-section' ? 'active' : ''">工作记录</li>
: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">
@ -43,97 +45,89 @@
<div id="backinfo-section">
<PersonnelTags ref="personnelTags" :disabled="disabled" :showBut="showBut" :dataList="listQuery" />
</div>
<div id="groupLabels-section">
<div id="groupLabels-section" v-if="!butShow">
<Vehicle ref="vehicle" :disabled="disabled" :showBut="showBut" :dataList="listQuery" />
</div>
<div id="character-section">
<BackInfo ref="backInfo" :disabled="disabled" :showBut="showBut" :dataList="listQuery" />
</div>
<div id="controlInfo-section">
<controlInfo ref="controlInfo" :disabled="disabled" :showBut="showBut" :dataList="listQuery" />
</div>
<div id="deployment-section">
<deployment ref="deployment" :disabled="disabled" :showBut="showBut" :dataList="listQuery" />
</div>
<div id="contact-section">
<contact ref="contact" :disabled="disabled" :showBut="showBut" :dataList="listQuery" />
<div id="controlInfo-section" v-if="!butShow">
<ControlInfo ref="controlInfo" title="重点人" :disabled="disabled" :showBut="showBut" :dataList="listQuery" />
</div>
<div id="dynamicTrajectory-section">
<dynamicTrajectory ref="dynamicTrajectory" :disabled="disabled" :showBut="showBut" />
</div>
<div class="behaviorInfo" style="">
<h3>行为信息</h3>
<!-- <el-button type="primary" :disabled="disabled" @click="AddPore">选择</el-button> -->
</div>
<div>
<div class="textContent">
基站认证信息：2022-3-33&ensp;12：30：30出现在乃宁市
</div>
<div class="textContent">
基站认证信息：2022-3-33&ensp;12：30：30出现在乃宁市
</div>
<div class="textContent">
基站认证信息：2022-3-33&ensp;12：30：30出现在乃宁市
</div>
<div class="textContent">
基站认证信息：2022-3-33&ensp;12：30：30出现在乃宁市
</div>
</div>
<div id="visitRecord-section">
<visitRecord ref="visitRecord" :disabled="disabled" :showBut="showBut" :dataList="listQuery" />
</div>
<div id="caseInfo-section">
<caseInfo ref="caseInfo" :disabled="disabled" :showBut="showBut" :dataList="listQuery" />
</div>
<div id="actualPerformance-section">
<actualPerformance ref="actualPerformance" :disabled="disabled" :showBut="showBut" :dataList="listQuery" />
</div>
<div class="behaviorInfo" style="">
<h3>操作日志</h3>
<!-- <el-button type="primary" :disabled="disabled" @click="AddPore">选择</el-button> -->
</div>
<!-- 滚动列表容器 -->
<div class="list-container">
<!-- 固定标题行 -->
<div class="list-header">
<span>账号名称</span>
<span>操作时间</span>
<span>操作记录</span>
</div>
<!-- 可滚动内容 -->
<div class="list-body">
<div class="list-item" v-for="i in 30" :key="i">
<span>张三</span>
<span>2020-3030-2202</span>
<span>新增操作记录</span>
</div>
</div>
<div id="featinfo-section" v-if="!butShow">
<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" />
</div>
<div id="requestInfo-section" v-if="!butShow">
<DynamicTrajectory ref="dynamicTrajectory" :disabled="disabled" :showBut="showBut" />
</div>
<div id="personnel-section" v-if="!butShow">
<BehaviorInfo ref="behaviorInfo" :disabled="disabled" :showBut="showBut" />
</div>
<div id="judgmentRecord-section" v-if="!butShow">
<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" />
</div>
<div id="joblogging-section" v-if="!butShow">
<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" />
</div>
</div>
</div>
</div>
<!-- <ChooseMarks v-model="chooseMarksVisible" @choosed="choosed" :roleIds="roleIds" /> -->
</template>
<script setup>
import { getItem } from "@/utils/storage";
import { qcckGet, qcckPost, qcckPut } from "@/api/qcckApi.js";
import { tbGsxtZdrySelectVoById } from "@/api/zdr.js";
import controlInfo from '../../mpvGroup/model/controlInfo.vue'
import { tbGsxtZdrySelectVoById, tbGsxtZdrySave } from "@/api/zdr.js";
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 visitRecord from '../model/visitRecord.vue'
import caseInfo from '../model/caseInfo.vue'
import actualPerformance from '../model/actualPerformance.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 { ref, onUnmounted } from "vue";
const emit = defineEmits(["updateDate"]);
const chooseMarksVisible = ref(false);
@ -144,6 +138,7 @@ const showBut = ref(false)
const listQuery = ref({});
const butShow = ref(false)
const title = ref('新增')
const showData=ref(false)
// 初始化数据
const init = (type, row) => {
dialogForm.value = true;
@ -153,11 +148,10 @@ const init = (type, row) => {
disabled.value = false
showBut.value = false
} else {
butShow.value = false
tbGsxtZdrySelectVoById({ id: row.id }).then(res => {
console.log(res, "dddddddddddddddd");
Object.assign(listQuery.value, res)
listQuery.value = { ...res }
})
if (type == 'edit') {
showBut.value = true
@ -200,7 +194,7 @@ const handleScroll = () => {
'info-section', 'backinfo-section', 'groupLabels-section',
'character-section', 'controlInfo-section', 'featinfo-section',
'demandsInfo-section', 'requestInfo-section', 'personnel-section',
'judgmentRecord-section', 'historyAssembly-section', 'joblogging-section'
'judgmentRecord-section', 'historyAssembly-section', 'joblogging-section', "czModel-section"
];
for (let i = sections.length - 1; i >= 0; i--) {
@ -235,8 +229,15 @@ const submit = async () => {
// 使用Promise.all处理所有子组件的验证和数据获取
const [infoData, personnelTagsData] = await Promise.all([
info.value.throwData(),
personnelTags.value.throwData(),
// personnelTags.value.throwData(),
]);
tbGsxtZdrySave(infoData).then(res => {
console.log(res);
})
console.log(infoData);
};

65
src/views/backOfficeSystem/DeploymentDisposal/mpvPeo/components/diaLogForm.vue
View File

@ -1,65 +0,0 @@
<template>
{{ visible }}
<!-- 添加 -->
<el-dialog v-model="visible" :title="Tips" width="40%" :before-close="handleClose">
<el-form ref="historyForm" style="max-width: 600px" :model="diaLogRuleForm" :rules="diaLogRules">
<div v-for="item in diaLogRuleForm" :key="item.props">
<el-form-item label-width="80px" :label="item.label" :prop="item.props" style="width: 100%;">
<el-input v-model="item.value" :placeholder="`请输入${item.label}`" />
</el-form-item>
</div>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button @click="onCancel">取消</el-button>
<el-button type="primary" @click="onSubmit">
确认
</el-button>
</div>
</template>
</el-dialog>
</template>
<script setup>
import { defineProps, defineEmits, ref, watch } from 'vue'
// 接收 v-model:visible
const props = defineProps({
visible: Boolean,
Tips: String,
diaLogRules: Object,
diaLogRuleForm: Object
})
const emit = defineEmits(['update:visible', 'submit'])
const formRef = ref(null)
const formData = ref({})
// 监听外部传入的 formData 变化（如编辑时回显）
watch(
[() => props.diaLogRuleForm, props.visible],
(val) => {
console.log(val, "变化之后的diaLogRuleForm");
formData.value = val ? { ...val } : {}
},
{ immediate: true }
)
// 取消：关闭弹窗
const onCancel = () => {
emit('update:visible', false)
}
// 提交
const onSubmit = () => {
emit('submit', props.diaLogRuleForm) // 提交数据
// formRef.value?.validate((valid) => {
// if (valid) {
// // 不在这里关闭！由父组件决定是否关闭（比如提交失败不关闭）
// }
// })
}
</script>
<style scoped lang="scss"></style>

5
src/views/backOfficeSystem/DeploymentDisposal/mpvPeo/index.vue
View File

@ -8,8 +8,7 @@
</template>
<div class="flex just-center">
<el-button size="small" type="primary" v-for="it in D_GS_BK_SQLX" :key="it.dm"
@click="handleApplication(it)">{{
it.zdmc }}</el-button>
@click="handleApplication(it)">{{it.zdmc }}</el-button>
</div>
</el-popover>
<el-popover placement="bottom" :visible="visiblefp" :width="400" trigger="click">
@ -169,7 +168,7 @@ const pageData = reactive({
pageSize: 20,
pageCurrent: 1
},
controlsWidth: 150,
controlsWidth: 250,
tableColumn: [
{ label: "姓名", prop: "ryXm", width: 150 },
{ label: "性别", prop: "ryXb", showSolt: true, width: 100 },

113
src/views/backOfficeSystem/DeploymentDisposal/mpvPeo/model/actualPerformance.vue
View File

@ -2,23 +2,12 @@
<div>
<div class="headClass" style="">
<h3>现实表现</h3>
<!-- <el-button type="primary" :disabled="disabled" @click="AddPore">选择</el-button> -->
</div>
<div class="headSelect">
<el-button @click="add" type="primary">新增</el-button>
<el-button @click="AddPore" type="primary" v-if="showBut">新增</el-button>
</div>
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
<template #clys="{ row }">
<DictTag :tag="false" :value="row.clys" :options="D_BZ_CLYS" />
</template>
<template #cllx="{ row }">
<DictTag :tag="false" :value="row.cllx" :options="D_BZ_CLLX" />
</template>
<template #clpp="{ row }">
<DictTag :tag="false" :value="row.clpp" :options="D_BZ_CLPP" />
<template #showSolt="{ row }">
<span v-for="(item,index) in row.fjxx" :key="index">{{ item.originalName }}<span v-if="index < row.fjxx.length - 1">、</span></span>
</template>
<!-- 操作 -->
<template #controls="{ row }">
@ -27,20 +16,23 @@
</template>
</MyTable>
</div>
<VehiclDoing v-model="chooseMarksVisible" @comfirm="addMarks" :data="dataModel"
:dict="{ D_BZ_CLLX, D_BZ_CLYS, D_BZ_CLPP }" />
<!-- <VehiclDoing v-model="JudgmentShow" @comfirm="addMarks" :data="dataModel"
:dict="{ D_BZ_CLLX, D_BZ_CLYS, D_BZ_CLPP }" /> -->
<JudgmentRecord v-model="JudgmentShow" @comfirm="onComfirm" :data="dataModel" />
</template>
<script setup>
import { identityCardRule } from "@/utils/rules"
import { ref, reactive, watch, toRaw, getCurrentInstance, onMounted, onUnmounted } from "vue";
import { ref, reactive, watch, toRaw, getCurrentInstance, onMounted, onUnmounted } from "vue";
import MyTable from "@/components/aboutTable/MyTable.vue";
import VehiclDoing from "../component/vehiclDoing.vue";
import { tbZdryClxxAdd, tbZdryClxxBatchAdd, tbZdryClxxDelete, tbZdryClxxSelectPage, tbZdryClxxUpdate } from '@/api/zdr.js'
import JudgmentRecord from "../component/judgmentRecord.vue";
import { tbGsxtZdryXsbxSaveOrUpdateXsbx,tbGsxtZdryXsbxSelectZfjl,tbGsxtZdryXsbx } from '@/api/zdr.js'
import { ElMessage, ElMessageBox } from "element-plus";
const { proxy } = getCurrentInstance();
const { D_BZ_CLLX, D_BZ_CLYS, D_BZ_CLPP } = proxy.$dict("D_BZ_CLLX", "D_BZ_CLYS", "D_BZ_CLPP"); //获取字典数据
const chooseMarksVisible = ref(false)
const JudgmentShow = ref(false)
const props = defineProps({
dataList: {
type: Object,
@ -66,20 +58,17 @@ watch(() => props.dataList, (val) => {
const pageData = reactive({
tableData: [],
tableColumn: [{
prop: 'cph',
prop: 'rrry',
label: '录入人员',
}, {
prop: 'cllx',
prop: 'lrsj',
label: '录入时间',
showSolt: true,
prop: 'clpp',
}, {
showSolt: true,
prop: 'clys',
prop: 'bxnr',
label: '表现内容',
}, {
showSolt: true,
prop: 'clpp',
prop: 'fjxx',
label: '附件信息',
}],
tableHeight: '200px',
@ -97,45 +86,40 @@ const pageData = reactive({
},
controlsWidth: 200,
})
// 表单数据
const formData = reactive({
username: "",
ID: ""
})
const rulesForm = ref(identityCardRule({ validator: true }, 'rySfzh'))
// 修改数据接口
const dataModel = ref()
const addMarks = (val) => {
const onComfirm = (val) => {
const params = {
...val,
zdrid: listData.value.id,
zdryId: listData.value.id,
}
if (props.showBut && !props.disabled) {
if (addUpd.value) {
tbZdryClxxAdd(params).then(res => {
console.log(params);
// if (props.showBut && !props.disabled) {
// if (addUpd.value) {
tbGsxtZdryXsbxSaveOrUpdateXsbx(params).then(res => {
gettbZdryClxxSelectPage()
proxy.$message({
message: '关联车辆添加成功',
type: 'success'
})
})
}
else {
tbZdryClxxUpdate(params).then(res => {
gettbZdryClxxSelectPage()
proxy.$message({
message: '关联车辆修改成功',
type: 'success'
})
})
}
} else {
pageData.tableData.push(val)
}
// }
// else {
// tbZdryClxxUpdate(params).then(res => {
// gettbZdryClxxSelectPage()
// proxy.$message({
// message: '关联车辆修改成功',
// type: 'success'
// })
// })
// }
// } else {
// pageData.tableData.push(val)
// }
}
onMounted(() => {
})
// 删除车辆
const delDictItem = (val) => {
@ -150,10 +134,10 @@ const delDictItem = (val) => {
}
)
.then(() => {
tbZdryClxxDelete({ ids: [val] }).then(res => {
tbGsxtZdryXsbx(val).then(res => {
gettbZdryClxxSelectPage()
proxy.$message({
message: '关联车辆删除成功',
message: '表现信息删除成功',
type: 'success'
})
})
@ -171,24 +155,26 @@ const delDictItem = (val) => {
}
const updDictItem = (val) => {
chooseMarksVisible.value = true
JudgmentShow.value = true
addUpd.value = false
dataModel.value = val
}
const AddPore = () => {
chooseMarksVisible.value = true
dataModel.value = {}
JudgmentShow.value = true
addUpd.value = true
}
// 查询车辆
const gettbZdryClxxSelectPage = () => {
const promes = {
pageCurrent: 1,
pageSize: 20,
zdrid: listData.value.id
}
tbZdryClxxSelectPage(promes).then(res => {
pageData.tableData = res.records
tbGsxtZdryXsbxSelectZfjl(promes).then(res => {
pageData.tableData = res.map(item => {
return {
...item,
fjxx: item.fjxx ? JSON.parse(item.fjxx) : []
}
})
})
}
// 抛出数据并验证标签列表不为空
@ -237,6 +223,9 @@ defineExpose({
}
.headClass {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 18px;
font-weight: 600;
color: #303133;

119
src/views/backOfficeSystem/DeploymentDisposal/mpvPeo/model/bakInfo.vue
View File

@ -3,14 +3,8 @@
<div class="backinfo-container">
<div class="headClass" style="">
<h3>背景信息</h3>
<el-button type="primary" v-if="showBut" :disabled="disabled" @click="ClickSave">保存</el-button>
<el-button type="primary" v-if="showBut" :disabled="disabled" @click="submitForm(ruleFormRef)">保存</el-button>
</div>
<!-- <div>
<div>拘留记录：</div>
<div v-for="(item,index) in jljl" :key="index">
<el-input v-model="jljl[index]" :autosize="{ minRows: 4, maxRows: 10 }" type="textarea" placeholder="请输入背景信息"
class="background-info-input" :disabled="disabled" /></div>
</div> -->
<div>
<!-- 全部输入框 -->
<el-form class="record" ref="ruleFormRef" :model="ruleForm" :rules="rules">
@ -19,17 +13,16 @@
<div>拘留所记录：</div>
<div>
<div v-for="(item, i) in ruleForm.detentionCenterRecords" :key="item.id" class="detentionFacilityArr">
<el-form-item :prop="'detentionCenterRecords.' + i + '.str'" :rules="rules.str">
<el-input v-model="ruleForm.detentionCenterRecords[i].str" class="detentionFacilityInput"
placeholder="请输入拘留所记录" />
<el-form-item :prop="'detentionCenterRecords.' + i + '.str'" :rules="rules.str">
<el-input v-model="ruleForm.detentionCenterRecords[i].str" type="textarea"
class="detentionFacilityInput" placeholder="请输入拘留所记录" />
</el-form-item>
<el-button type="primary"
v-if="ruleForm.detentionCenterRecords.length > 1 && i != ruleForm.detentionCenterRecords.length - 1"
@click="decreaseRecord(i, '拘留所')">−</el-button>
<el-button type="primary" @click="addRecord(i, '拘留所')"
v-if="ruleForm.detentionCenterRecords.length - 1 == i">+</el-button>
<div style="width: 100px;">
<el-button type="primary" v-if="ruleForm.detentionCenterRecords.length != 1"
@click="decreaseRecord(i, '拘留所')">−</el-button>
<el-button type="primary" @click="addRecord(i, '拘留所')"
v-if="i == ruleForm.detentionCenterRecords.length - 1">+</el-button>
</div>
</div>
</div>
</div>
@ -38,21 +31,20 @@
<div>看守所记录：</div>
<div>
<div v-for="(item, i) in ruleForm.prison" :key="item.id" class="detentionFacilityArr">
<el-form-item :prop="'prison.' + i + '.str'" :rules="rules.str">
<el-input v-model="ruleForm.prison[i].str"
class="detentionFacilityInput" placeholder="请输入拘留所记录"
@input="changeprison(ruleForm.prison[i].str)"
/>
<el-form-item :prop="'prison.' + i + '.str'" :rules="rules.str">
<el-input v-model="ruleForm.prison[i].str" type="textarea" class="detentionFacilityInput"
placeholder="请输入拘留所记录" />
</el-form-item>
<el-button type="primary" v-if="ruleForm.prison.length > 1 && i != ruleForm.prison.length - 1"
<div style="width: 100px;">
<el-button type="primary" v-if="ruleForm.prison.length != 1"
@click="decreaseRecord(i, '看守所')">−</el-button>
<el-button type="primary" @click="addRecord(i, '看守所')" v-if="ruleForm.prison.length - 1 == i">+</el-button>
<el-button type="primary" @click="addRecord(i, '看守所')"
v-if="i == ruleForm.prison.length - 1">+</el-button>
</div>
</div>
</div>
</div>
<div class="sumbitBtnBOX">
<el-button type="primary" @click="submitForm(ruleFormRef)" class="sumbitBtn">确认提交</el-button>
</div>
</el-form>
</div>
@ -60,9 +52,9 @@
</template>
<script setup>
import { reactive, ref, watch, onMounted } from "vue";
import { Delete, Download } from '@element-plus/icons';
// import { tbGsxtZdryUpdate } from '@/api/zdr.js'
import { reactive, ref, watch, onMounted, getCurrentInstance } from "vue";
import { tbGsxtZdryUpdate } from '@/api/zdr.js'
const { proxy } = getCurrentInstance();
const props = defineProps({
dataList: {
type: Object,
@ -76,7 +68,6 @@ const props = defineProps({
default: false
},
})
const jljl = ref([])
const ruleFormRef = ref()
const ruleForm = reactive({
detentionCenterRecords: [{ id: 0, str: "" }],
@ -84,33 +75,28 @@ const ruleForm = reactive({
})
// 表单校验
const rules = reactive({
str: [
{ required: true, message: '请输入具体信息', trigger: 'blur' },
{ min: 3, max: 20, message: '请最少输入3个字,最多输入20个字', trigger: 'blur' },
],
// str: [
// { required: true, message: '请输入具体信息', trigger: 'blur' },
// { min: 3, max: 20, message: '请最少输入3个字,最多输入20个字', trigger: 'blur' },
// ],
})
watch(() => props.dataList, (val) => {
if (val) {
// qtbjxx.value = val.qtBjzl
ruleForm.detentionCenterRecords = val.jlsJl && val.kssJl.length > 0 ? val.jlsJl.map((item, index) => {
return {
id: index,
str: item
}
}) : [{ id: 0, str: "" }],
ruleForm.prison = val.kssJl && val.kssJl.length > 0 ? val.kssJl.map((item, index) => {
return {
id: index,
str: item
}
}) : [{ id: 0, str: "" }]
}
}, { deep: true })
onMounted(() => {
console.log('组件已挂载')
})
const throwData = () => {
return new Promise((resolve) => {
// 基本验证：确保背景信息不为空
if (!qtbjxx.value.trim()) {
throw new Error('请输入群体背景信息');
}
resolve({
qtbjxx: qtbjxx.value,
fileList: fileList.value
});
});
}
// 增加输入记录输入框
const addRecord = (val, type) => {
if (type == '拘留所') {
@ -118,7 +104,6 @@ const addRecord = (val, type) => {
} else {
ruleForm.prison.push({ id: val })
}
}
// 减少输入记录输入框
const decreaseRecord = (val, type) => {
@ -129,25 +114,33 @@ const decreaseRecord = (val, type) => {
}
}
const changeprison=(value)=>{
console.log(value,"jafahfahf");
}
//提交数据校验表单
const submitForm = async (formEl) => {
console.log(formEl,"formElformEl");
if (!formEl) return
await formEl.validate((valid, fields) => {
console.log(valid,fields,"22222222");
if (valid) {
const promes = {
id: props.dataList.id,
jlsJl: ruleForm.detentionCenterRecords.map(item => item.str),
kssJl: ruleForm.prison.map(item => item.str),
}
tbGsxtZdryUpdate(promes).then((res) => {
proxy.$message.success('保存成功')
}).catch((err) => {
proxy.$message.error('保存失败')
});
console.log('submit!')
} else {
console.log('error submit!', fields)
}
})
}
}
const throwData = () => {
return new Promise((resolve) => {
resolve(ruleForm);
});
}
defineExpose({
throwData
})
@ -202,7 +195,7 @@ defineExpose({
.detentionFacilityArr {
display: flex;
margin-top: 20px;
justify-content: space-between;

268
src/views/backOfficeSystem/DeploymentDisposal/mpvPeo/model/behaviorInfo.vue Normal file
View File

@ -0,0 +1,268 @@
<template>
<div class="backinfo-container">
<div class="headClass">
<h3>行为信息</h3>
</div>
<!-- 列表区域 -->
<div class="list-container">
<div v-loading="loading" class="behavior-list">
<div class="behavior-list-inner">
<div
v-for="(item, index) in behaviorList"
:key="item.id"
class="behavior-item"
>
<div class="behavior-item-header">
<span class="behavior-index">{{ index + 1 }}.</span>
<el-tag :type="getTagType(item.behaviorType)">{{ item.behaviorTypeName }}</el-tag>
<span class="behavior-time">{{ item.time }}</span>
</div>
<div class="behavior-item-content">
<p class="behavior-description">{{ item.description }}</p>
<p class="behavior-location"><i class="el-icon-location-outline"></i> {{ item.location }}</p>
</div>
</div>
<div v-if="!loading && behaviorList.length === 0" class="empty-state">
<el-empty description="暂无行为记录" />
</div>
</div>
</div>
</div>
</div>
</template>
<script setup>
import { ref, getCurrentInstance, onMounted } from 'vue'
import GdMap from "@/components/GdMap/index.vue";
const { proxy } = getCurrentInstance();
const { D_BZ_ZJLX } = proxy.$dict("D_BZ_ZJLX")
// 搜索表单
const searchForm = ref({
behaviorType: '',
timeRange: null
})
// 列表数据
const behaviorList = ref([])
const loading = ref(false)
// 获取标签类型
const getTagType = (type) => {
const typeMap = {
'ticket': 'success',
'hotel': 'primary',
'border': 'warning',
'baseStation': 'info'
}
return typeMap[type] || 'default'
}
// 搜索
const handleSearch = () => {
fetchData()
}
// 重置搜索
const resetSearch = () => {
searchForm.value = {
behaviorType: '',
timeRange: null
}
fetchData()
}
// 获取数据
const fetchData = () => {
loading.value = true
// 模拟API请求延迟
setTimeout(() => {
// 模拟数据
const mockData = [
{
id: 1,
behaviorType: 'baseStation',
behaviorTypeName: '基站认证',
description: '2025-5-22 14:30:20出现在南宁市青秀区云网网咖',
location: '广西壮族自治区南宁市青秀区',
time: '2025-05-22 14:30:20'
}
]
// 根据搜索条件过滤数据
let filteredData = [...mockData]
if (searchForm.value.behaviorType) {
filteredData = filteredData.filter(item => item.behaviorType === searchForm.value.behaviorType)
}
if (searchForm.value.timeRange && searchForm.value.timeRange.length === 2) {
const [startTime, endTime] = searchForm.value.timeRange
filteredData = filteredData.filter(item => {
const itemTime = new Date(item.time)
return itemTime >= new Date(startTime) && itemTime <= new Date(endTime)
})
}
behaviorList.value = filteredData
loading.value = false
}, 500)
}
// 页面加载时获取数据
onMounted(() => {
fetchData()
})
</script>
<style lang="scss" scoped>
@import "~@/assets/css/layout.scss";
@import "~@/assets/css/element-plus.scss";
.backinfo-container {
padding: 20px;
width: 100%;
background-color: #f5f7fa;
}
.headClass {
font-size: 18px;
font-weight: 600;
color: #303133;
margin: 0 0 20px 0;
padding-bottom: 15px;
border-bottom: 2px solid #409eff;
position: relative;
}
h3 {
margin: 0;
}
.search-container {
background-color: #fff;
padding: 16px;
border-radius: 6px;
margin-bottom: 16px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}
.demo-form-inline {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 16px;
}
.list-container {
background-color: #fff;
padding: 16px;
border-radius: 6px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}
.behavior-list {
max-height: 600px;
overflow: hidden; /* 完全禁止滚动条 */
position: relative;
}
.behavior-list-inner {
max-height: 600px;
overflow-y: auto;
overflow-x: hidden;
padding-right: 10px; /* 为滚动条留出空间但不显示 */
}
.behavior-item {
padding: 16px;
border-bottom: 1px solid #f0f0f0;
transition: all 0.3s ease;
position: relative;
left: 0; /* 初始位置 */
}
.behavior-item:hover {
background-color: #fafafa;
left: 5px; /* 使用left属性代替transform，避免触发滚动条 */
}
.behavior-item:last-child {
border-bottom: none;
}
.behavior-item-header {
display: flex;
align-items: center;
margin-bottom: 12px;
}
.behavior-index {
font-weight: 600;
color: #606266;
margin-right: 12px;
min-width: 20px;
}
.behavior-time {
margin-left: auto;
color: #909399;
font-size: 13px;
}
.behavior-item-content {
padding-left: 32px;
}
.behavior-description {
margin: 0 0 8px 0;
color: #303133;
line-height: 1.5;
}
.behavior-location {
margin: 0;
color: #606266;
font-size: 13px;
line-height: 1.5;
}
.empty-state {
padding: 60px 0;
text-align: center;
}
::v-deep .el-tag {
margin-right: 0;
}
::v-deep .el-date-editor .el-range-separator {
color: #606266;
}
@media (max-width: 768px) {
.backinfo-container {
padding: 10px;
}
.demo-form-inline {
flex-direction: column;
align-items: stretch;
}
.demo-form-inline .el-form-item {
margin-bottom: 10px;
}
.pagination-container {
justify-content: center;
}
}
</style>

87
src/views/backOfficeSystem/DeploymentDisposal/mpvPeo/model/caseInfo.vue
View File

@ -2,41 +2,28 @@
<div>
<div class="headClass" style="">
<h3>案件信息</h3>
<!-- <el-button type="primary" :disabled="disabled" @click="AddPore">选择</el-button> -->
<el-button @click="AddPore" type="primary" v-if="showBut">新增</el-button>
</div>
<div class="headSelect">
<el-button @click="add" type="primary">新增</el-button>
</div>
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
<template #clys="{ row }">
<DictTag :tag="false" :value="row.clys" :options="D_BZ_CLYS" />
</template>
<template #cllx="{ row }">
<DictTag :tag="false" :value="row.cllx" :options="D_BZ_CLLX" />
</template>
<template #clpp="{ row }">
<DictTag :tag="false" :value="row.clpp" :options="D_BZ_CLPP" />
</template>
<!-- 操作 -->
<template #controls="{ row }">
<el-link type="danger" @click="delDictItem(row.id)">删除</el-link>
<el-link type="danger" @click="updDictItem(row)">修改</el-link>
</template>
</MyTable>
</div>
<VehiclDoing v-model="chooseMarksVisible" @comfirm="addMarks" :data="dataModel"
:dict="{ D_BZ_CLLX, D_BZ_CLYS, D_BZ_CLPP }" />
<CaseLodig v-model="chooseMarksVisible" @comfirm="addMarks" :data="dataModel" />
</template>
<script setup>
import { identityCardRule } from "@/utils/rules"
import { ref, reactive, watch, toRaw, getCurrentInstance, onMounted, onUnmounted } from "vue";
import MyTable from "@/components/aboutTable/MyTable.vue";
import VehiclDoing from "../component/vehiclDoing.vue";
import { tbZdryClxxAdd, tbZdryClxxBatchAdd, tbZdryClxxDelete, tbGsxtZdryAjxxselectAjxx, tbZdryClxxUpdate } from '@/api/zdr.js'
import CaseLodig from "../component/caseLodig.vue";
import { tbGsxtZdryAjxxSaveOrUpdateAjxx, tbGsxtZdryAjxx, tbGsxtZdryAjxxselectAjxx } from '@/api/zdr.js'
import { ElMessage, ElMessageBox } from "element-plus";
const { proxy } = getCurrentInstance();
const { D_BZ_CLLX, D_BZ_CLYS, D_BZ_CLPP } = proxy.$dict("D_BZ_CLLX", "D_BZ_CLYS", "D_BZ_CLPP"); //获取字典数据
@ -66,16 +53,13 @@ watch(() => props.dataList, (val) => {
const pageData = reactive({
tableData: [],
tableColumn: [{
prop: 'cph',
prop: 'ajbm',
label: '案件编号',
}, {
prop: 'cllx',
prop: 'ajmc',
label: '案件名称',
showSolt: true,
prop: 'clpp',
}, {
showSolt: true,
prop: 'clys',
prop: 'sasj',
label: '受案时间',
},],
tableHeight: '200px',
@ -93,51 +77,29 @@ const pageData = reactive({
},
controlsWidth: 200,
})
// 表单数据
const formData = reactive({
username: "",
ID: ""
})
const rulesForm = ref(identityCardRule({ validator: true }, 'rySfzh'))
// 修改数据接口
const dataModel = ref()
const addMarks = (val) => {
const params = {
...val,
zdrid: listData.value.id,
}
if (props.showBut && !props.disabled) {
if (addUpd.value) {
tbZdryClxxAdd(params).then(res => {
gettbZdryClxxSelectPage()
proxy.$message({
message: '关联车辆添加成功',
type: 'success'
})
})
}
else {
tbZdryClxxUpdate(params).then(res => {
gettbZdryClxxSelectPage()
proxy.$message({
message: '关联车辆修改成功',
type: 'success'
})
})
}
} else {
pageData.tableData.push(val)
zdryId: listData.value.id,
}
tbGsxtZdryAjxxSaveOrUpdateAjxx(params).then(res => {
gettbZdryClxxSelectPage()
proxy.$message({
message: '案件信息操作成功',
type: 'success'
})
})
}
onMounted(() => {
// console.log(identityCardRule,"dadad1");
})
// 删除车辆
const delDictItem = (val) => {
if (!props.disabled && props.showBut) {
ElMessageBox.confirm(
'是否删除关联车辆',
'是否删除案件信息',
'提示',
{
confirmButtonText: '确认',
@ -146,10 +108,10 @@ const delDictItem = (val) => {
}
)
.then(() => {
tbZdryClxxDelete({ ids: [val] }).then(res => {
tbGsxtZdryAjxx(val).then(res => {
gettbZdryClxxSelectPage()
proxy.$message({
message: '关联车辆删除成功',
message: '案件信息删除成功',
type: 'success'
})
})
@ -179,14 +141,10 @@ const AddPore = () => {
// 查询车辆
const gettbZdryClxxSelectPage = () => {
const promes = {
pageCurrent: 1,
pageSize: 20,
zdrid: listData.value.id
}
tbGsxtZdryAjxxselectAjxx(promes).then(res => {
console.log(res, "案件信息");
pageData.tableData = res.records
pageData.tableData = res
})
}
// 抛出数据并验证标签列表不为空
@ -236,6 +194,9 @@ defineExpose({
.headClass {
font-size: 18px;
display: flex;
justify-content: space-between;
align-items: center;
font-weight: 600;
color: #303133;
margin: 20px 0 10px 0;

281
src/views/backOfficeSystem/DeploymentDisposal/mpvPeo/model/contact.vue
View File

@ -2,63 +2,45 @@
<div>
<div class="headClass" style="">
<h3>密切联系人</h3>
<!-- <el-button type="primary" :disabled="disabled" @click="AddPore">选择</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-item label="姓名" prop="username" :rules="[
{ required: true, message: '请输入用户名', trigger: 'blur' },
{ min: 2, max: 4, message: '长度在 2 到 4 个字符', trigger: 'blur' }
]">
<el-input v-model="formData.username" placeholder="请输入姓名" style="width: 120px;" />
<el-form-item label="身份证号码">
<el-input v-model="formData.rySfzh" placeholder="请输入身份证号码" />
</el-form-item>
<!-- 身份证号码 -->
<el-form-item label="身份证号码" prop="cardID" :rules="[
{ required: true, message: '请输入身份证号码', trigger: 'blur' }
]">
<el-input v-model="formData.ID" placeholder="请输入身份证号码" style="width: 200px;" />
</el-form-item>
<!-- 按钮组：统一放在一个 item 中 -->
<el-form-item class="form-actions">
<el-button type="primary" @click="check">查询</el-button>
<el-button @click="resetForm">重置</el-button>
<el-button @click="openDialog('新增密切联系人')">新增</el-button>
</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">
<!-- <template #ryXm="{ row }">
<DictTag :tag="false" :value="row.clys" :options="D_BZ_CLYS" />
</template> -->
<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)">修改</el-link>
<el-link type="danger" @click="openDialog('修改密切联系人', row, false)">修改</el-link>
</template>
</MyTable>
<diaLogForm v-model:visible="dialogVisible" :diaLogRules="diaLogRules" :diaLogRuleForm="diaLogRuleForm"
@submit="addPersonOrModifica" :Tips="Tips">
<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 MyTable from "@/components/aboutTable/MyTable.vue";
import diaLogForm from "../components/diaLogForm.vue";
import { tbGsxtZdryLxrsaveOrUpdateLxr, tbZdryClxxBatchAdd, tbZdryClxxDelete, tbGsxtZdryLxrselectLxrBy, tbZdryClxxUpdate } from '@/api/zdr.js'
import diaLogForm from "../component/diaLogForm.vue";
import { tbZdryClxxUpdate, tbGsxtZdryLxrsaveOrUpdateLxr,tbGsxtZdryLxrselectLxrBy ,tbGsxtZdryLxr} from '@/api/zdr.js'
import { ElMessage, ElMessageBox } from "element-plus";
const { proxy } = getCurrentInstance();
const { D_BZ_CLLX, D_BZ_CLYS, D_BZ_CLPP } = proxy.$dict("D_BZ_CLLX", "D_BZ_CLYS", "D_BZ_CLPP"); //获取字典数据
const chooseMarksVisible = ref(false)
const { D_BZ_QSGXDM } = proxy.$dict("D_BZ_QSGXDM"); //获取字典数据
const props = defineProps({
dataList: {
type: Object,
@ -72,37 +54,25 @@ const props = defineProps({
default: false
},
})
const ruleForm = ref({
name: '',
cardID: '',
relation: '',
phone: '',
})
const dialogVisible = ref(false)
const listData = ref({})
const Tips = ref(false)
const addUpd = ref(true)
const Tips = ref("密切联系人")
// 表格数据
const pageData = reactive({
tableData: [],
tableColumn: [{
prop: 'ryXm',
label: '人员姓名',
}, {
prop: 'rySfzh',
label: '身份证号码',
width: 200
}, {
prop: 'dygx',
label: '关系',
showSolt: true,
}, {
prop: 'lxrDh',
label: '联系电话',
width: 120
}],
tableHeight: '200px',
keyCount: 0,
@ -120,171 +90,104 @@ const pageData = reactive({
controlsWidth: 200,
})
// 表单数据
const formData = reactive({
const formData = ref({
username: "",
ID: ""
})
const touchIn = ref(true)
const rulesForm = ref(identityCardRule({ validator: true }, 'rySfzh'))
const diaLogRuleForm = reactive([{ prop: 'username', label: '姓名', type: 'input', value: '' },
{ prop: 'cardID', label: '身份证号', type: 'input', value: '' },
{ prop: 'relation', label: '关系', type: 'input', value: '' },
{ prop: 'phone', label: '联系电话', type: 'input', value: '' }
])
const diaLogRuleForm = ref({})
watch(() => props.dataList, (val) => {
if (val) {
console.log(val, 'listData.value');
listData.value = val
getContact()
}
}, { deep: true })
// 弹出增加或者修改弹窗
const openDialog = (type, formVal) => {
const openDialog = (type, formVal, bool) => {
touchIn.value = bool
dialogVisible.value = true
Tips.value = type
console.log(formVal, "formVal");
console.log(dialogVisible.value, "dialogVisible.value")
if (type === '新增密切联系人') {
diaLogRuleForm.forEach(item => {
item.value = ''
})
} else {
diaLogRuleForm[0].value = formVal.ryXm
diaLogRuleForm[1].value = formVal.rySfzh
diaLogRuleForm[2].value = formVal.dygx
diaLogRuleForm[3].value = formVal.lxrDh
}
diaLogRuleForm.value = { ...formVal }
}
// 增加或修改数据接口
const dataModel = ref()
const addPersonOrModifica = async (val) => {
console.log('dafafaf', val)
let params = {
id: listData.value.id
}
val.forEach(item => {
switch (item.label) {
case '姓名':
params.ryXm = item.value
break
case '身份证号':
params.rySfzh = item.value
break
case '关系':
params.dygx = item.value
break
case '联系电话':
params.lxrDh = item.value
break
default:
break
// 提交表单
const addPersonOrModifica = (val) => {
if (touchIn.value) {
const item = pageData.tableData.findIndex(item => item.rySfzh == val.rySfzh)
if (item != -1) {
proxy.$message({
message: '该人员已存在',
type: 'warning'
})
return
}
})
console.log(params, "fafafafaff");
if (props.showBut && !props.disabled) {
const res = await tbGsxtZdryLxrsaveOrUpdateLxr(params)
console.log(res, "联系人增加res");
// if (type) {
// if (res.code == 200) {
// gettbZdryClxxSelectPage()
// proxy.$message({
// message: '密切联系人添加成功',
// type: 'success'
// })
// } else {
// proxy.$message({
// message: '密切联系人添加失败',
// type: 'error'
// })
// }
// } else {
// if (res.code == 200) {
// gettbZdryClxxSelectPage()
// proxy.$message({
// message: '密切联系人添加成功',
// type: 'success'
// })
// } else {
// proxy.$message({
// message: '密切联系人添加失败',
// type: 'error'
// })
// }
// }
} else {
pageData.tableData.push(val)
}
}
onMounted(() => {
// console.log(identityCardRule,"dadad1");
})
// 删除车辆
const delDictItem = (val) => {
if (!props.disabled && props.showBut) {
ElMessageBox.confirm(
'是否删除关联车辆',
'提示',
{
confirmButtonText: '确认',
cancelButtonText: '取消',
type: 'warning',
}
)
.then(() => {
tbZdryClxxDelete({ ids: [val] }).then(res => {
gettbZdryClxxSelectPage()
proxy.$message({
message: '关联车辆删除成功',
type: 'success'
})
})
})
.catch(() => {
ElMessage({
type: 'info',
message: '取消删除',
})
})
} else {
pageData.tableData = pageData.tableData.filter(v => v.id != val)
}
}
const updDictItem = (val) => {
chooseMarksVisible.value = true
addUpd.value = false
dataModel.value = val
}
const AddPore = () => {
chooseMarksVisible.value = true
dataModel.value = {}
addUpd.value = true
}
// 初始化密切联系人
const gettbZdryClxxSelectPage = () => {
const promes = {
pageCurrent: 1,
pageSize: 20,
zdrid: listData.value.id
...val,
zdryId: listData.value.id
}
tbGsxtZdryLxrselectLxrBy(promes).then(res => {
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',
})
})
}
const getContact = () => {
const promes = { zdryId: listData.value.id }
tbGsxtZdryLxrselectLxrBy(promes).then((res) => {
pageData.tableData = res
console.log(pageData.tableData, "表格原生数据");
})
}
const resetForm = () => {
formData.value = {}
getContact()
}
const check = () => {
if (formData.value.rySfzh) {
// 模糊查询：检查身份证号码是否包含输入的内容
pageData.tableData = pageData.tableData.filter(item => item.rySfzh && item.rySfzh.includes(formData.value.rySfzh))
} else {
// 如果输入为空，显示所有数据
getContact()
}
}
// 抛出数据并验证标签列表不为空
const throwData = () => {
return new Promise((resolve) => {
@ -335,7 +238,9 @@ defineExpose({
padding-bottom: 10px;
border-bottom: 2px solid #409eff;
position: relative;
display: flex;
justify-content: space-between;
align-items: center;
}
.headSelect {

222
src/views/backOfficeSystem/DeploymentDisposal/mpvPeo/model/czModel.vue Normal file
View File

@ -0,0 +1,222 @@
<template>
<div class="backinfo-container">
<div class="headClass">
<h3>操作日志</h3>
</div>
<!-- 列表区域 -->
<div class="list-container">
<div v-loading="loading" class="behavior-list">
<div class="behavior-list-inner">
<div
v-for="(item, index) in behaviorList"
:key="item.id"
class="behavior-item"
>
<div class="behavior-item-header">
<span class="behavior-index">{{ index + 1 }}.</span>
<el-tag :type="getTagType(item.behaviorType)">{{ item.zhmc }}</el-tag>
<span class="behavior-time">{{ item.czsj }}</span>
</div>
<div class="behavior-item-content">
<p class="behavior-description">{{ item.czjl }}</p>
<p class="behavior-location"><i class="el-icon-location-outline"></i> {{ item.bz }}</p>
</div>
</div>
<div v-if="!loading && behaviorList.length === 0" class="empty-state">
<el-empty description="暂无操作记录" />
</div>
</div>
</div>
</div>
</div>
</template>
<script setup>
import { ref, getCurrentInstance, onMounted,watch } from 'vue'
import GdMap from "@/components/GdMap/index.vue";
import {tbGsxtZdryCzrzSelectCzrz} from '@/api/zdr'
const { proxy } = getCurrentInstance();
const props = defineProps({
dataList: {
type: Object,
default: () => { },
}, disabled: {
type: Boolean,
default: false
},
showBut: {
type: Boolean,
default: false
},
})
const listData = ref({})
watch(() => props.dataList, (val) => {
if (val) {
listData.value = val
fetchData()
}
}, { deep: true })
// 列表数据
const behaviorList = ref([])
const loading = ref(false)
// 获取数据
const fetchData = () => {
loading.value = true
tbGsxtZdryCzrzSelectCzrz({ zdrid: listData.value.id }).then(res => {
behaviorList.value = res
}).finally(() => {
loading.value = false
})
}
// 页面加载时获取数据
onMounted(() => {
})
</script>
<style lang="scss" scoped>
@import "~@/assets/css/layout.scss";
@import "~@/assets/css/element-plus.scss";
.backinfo-container {
padding-top: 20px;
width: 100%;
background-color: #f5f7fa;
}
.headClass {
font-size: 18px;
font-weight: 600;
color: #303133;
margin: 0 0 20px 0;
padding-bottom: 15px;
border-bottom: 2px solid #409eff;
position: relative;
}
h3 {
margin: 0;
}
.search-container {
background-color: #fff;
padding: 16px;
border-radius: 6px;
margin-bottom: 16px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}
.demo-form-inline {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 16px;
}
.list-container {
background-color: #fff;
padding: 16px;
border-radius: 6px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}
.behavior-list {
max-height: 600px;
overflow: hidden; /* 完全禁止滚动条 */
position: relative;
}
.behavior-list-inner {
max-height: 600px;
overflow-y: auto;
overflow-x: hidden;
padding-right: 10px; /* 为滚动条留出空间但不显示 */
}
.behavior-item {
padding: 16px;
border-bottom: 1px solid #f0f0f0;
transition: all 0.3s ease;
position: relative;
left: 0; /* 初始位置 */
}
.behavior-item:hover {
background-color: #fafafa;
left: 5px; /* 使用left属性代替transform，避免触发滚动条 */
}
.behavior-item:last-child {
border-bottom: none;
}
.behavior-item-header {
display: flex;
align-items: center;
margin-bottom: 12px;
}
.behavior-index {
font-weight: 600;
color: #606266;
margin-right: 12px;
min-width: 20px;
}
.behavior-time {
margin-left: auto;
color: #909399;
font-size: 13px;
}
.behavior-item-content {
padding-left: 32px;
}
.behavior-description {
margin: 0 0 8px 0;
color: #303133;
line-height: 1.5;
}
.behavior-location {
margin: 0;
color: #606266;
font-size: 13px;
line-height: 1.5;
}
.empty-state {
padding: 60px 0;
text-align: center;
}
::v-deep .el-tag {
margin-right: 0;
}
::v-deep .el-date-editor .el-range-separator {
color: #606266;
}
@media (max-width: 768px) {
.backinfo-container {
padding: 10px;
}
.demo-form-inline {
flex-direction: column;
align-items: stretch;
}
.demo-form-inline .el-form-item {
margin-bottom: 10px;
}
.pagination-container {
justify-content: center;
}
}
</style>

23
src/views/backOfficeSystem/DeploymentDisposal/mpvPeo/model/deployment.vue
View File

@ -6,11 +6,18 @@
</div>
<div class="marginBox">
<div>身份证号码：{{ listData.rySfzh }} <span>({{ listData.zdrBkZt ? '已布控' : '未布控' }})</span></div>
<div>手机号码：{{ listData.ryLxdh?.[0] }} <span>({{ listData.zdrBkZt ? '已布控' : '未布控' }})</span>
<div v-if="listData.ryLxdh&&listData.ryLxdh.length>0"> 手机号码：
<span style="color: #000;" v-for="(item, index) in listData.ryLxdh" :key="index">{{ item }}
<span v-if="index != listData.ryLxdh.length - 1">、</span>
</span>
<div> {{ listData.ryLxdh?.[1] }}<span>({{ listData.zdrBkZt ? '已布控' : '未布控' }})</span></div>
</div>
<div>车牌号码：{{ listData.clHm }} <span>({{ listData.zdrBkZt ? '已布控' : '未布控' }})</span></div>
<div v-if="listData.clxxList">车牌号码：
<span style="color: #000;" v-for="(item, index) in listData.clxxList" :key="index">{{ item.cph }}
<span v-if="index != listData.clxxList.length - 1">、</span>
</span>
<span>({{ listData.zdrBkZt ? '已布控' : '未布控' }})</span>
</div>
</div>
</div>
@ -67,30 +74,28 @@ onMounted(() => {
}
&>:nth-child(1) {
width: 300px;
// width: 300px;
height: 30px;
display: flex;
align-items: center;
justify-content: space-between;
}
&>:nth-child(2) {
width: 400px;
// width: 400px;
height: 30px;
display: flex;
align-items: center;
justify-content: space-between;
// justify-content: space-between;
}
&>:nth-child(3) {
width: 210px;
// width: 210px;
height: 30px;
display: flex;
align-items: center;
justify-content: space-between;
}
}
</style>

150
src/views/backOfficeSystem/DeploymentDisposal/mpvPeo/model/dynamicTrajectory.vue
View File

@ -1,51 +1,41 @@
<template>
<div>
<div class="headClass" style="">
<h3>动态轨迹</h3>
<!-- <el-button type="primary" :disabled="disabled" @click="AddPore">选择</el-button> -->
</div>
<div class="headSelect">
<el-select v-model="value" placeholder="身份证号码" style="width: 100px">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
<el-select v-model="value" placeholder="请输入内容" style="width: 240px">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
<div class="demo-datetime-picker">
<div class="block">
<el-date-picker v-model="value2" type="datetimerange" start-placeholder="Start date"
end-placeholder="End date" format="YYYY-MM-DD HH:mm:ss" date-format="YYYY/MM/DD ddd"
time-format="A hh:mm:ss" />
</div>
</div>
<el-button type="primary" @click="check">查询</el-button>
<el-button @click="resetForm">重置</el-button>
</div>
<div class="mapBox">地图</div>
<div>
<div class="headClass" style="">
<h3>动态轨迹</h3>
</div>
<div class="headSelect">
<el-select v-model="listData.zjlx" placeholder="身份证号码" style="width: 240px">
<el-option v-for="item in D_BZ_ZJLX" :key="item.dm" :label="item.zdmc" :value="item.dm" />
</el-select>
<el-input v-model="listData.msg" placeholder="请输入证件号码" style="width: 300px" />
<div class="demo-datetime-picker">
<div class="block">
<el-date-picker v-model="listData.time" type="datetimerange" start-placeholder="开始时间"
end-placeholder="结束时间" format="YYYY-MM-DD HH:mm:ss" date-format="YYYY/MM/DD ddd"/>
</div>
</div>
<el-button type="primary" @click="check">查询</el-button>
<el-button @click="resetForm">重置</el-button>
</div>
<div class="mapBox">
<GdMap />
</div>
</div>
</template>
<script setup>
import { ref } from 'vue'
const value = ref('')
const options = [
{
value: '1',
label: '身份证号码',
},
{
value: '2',
label: '港澳台通行证',
},
{
value: 'Option3',
label: 'Option3',
},
]
import { ref, getCurrentInstance } from 'vue'
import GdMap from "@/components/GdMap/index.vue";
// import
const { proxy } = getCurrentInstance();
const { D_BZ_ZJLX } = proxy.$dict("D_BZ_ZJLX")
const listData= ref({})
const check = () => { }
const resetForm = () => {
listData.value = {}
}
</script>
<style lang="scss" scoped>
@ -53,60 +43,64 @@ const options = [
@import "~@/assets/css/element-plus.scss";
.backinfo-container {
padding: 10px;
padding: 10px;
}
::v-deep(.el-form) {
display: flex;
justify-content: space-between;
display: flex;
justify-content: space-between;
}
.left_box {
width: 200px;
border: 1px solid #c8c8c89a;
border-radius: 5px;
padding: 5px;
width: 200px;
border: 1px solid #c8c8c89a;
border-radius: 5px;
padding: 5px;
}
.right_box {
width: calc(100% - 230px);
overflow-y: auto;
padding: 5px;
width: calc(100% - 230px);
overflow-y: auto;
padding: 5px;
}
::v-deep .el-form-item__content {
display: block !important;
display: block !important;
}
::v-deep .el-range-input{
color: #000 !important;
}
.headClass {
font-size: 18px;
font-weight: 600;
color: #303133;
margin: 0 0 10px 0;
padding-bottom: 10px;
border-bottom: 2px solid #409eff;
position: relative;
font-size: 18px;
font-weight: 600;
color: #303133;
margin: 0 0 10px 0;
padding-bottom: 10px;
border-bottom: 2px solid #409eff;
position: relative;
}
.headSelect {
width: 100%;
margin: 20px 0;
padding:0 16px;
background-color: #fff;
border-bottom: 1px solid #eee;
display: flex;
align-items: baseline;
justify-content: space-between;
width: 100%;
margin: 20px 0;
padding: 0 16px;
background-color: #fff;
border-bottom: 1px solid #eee;
display: flex;
align-items: baseline;
justify-content: space-between;
}
.mapBox{
width: 100%;
height: 300px;
background-color: rgba(0, 123, 255, 0.5);
}
.mapBox {
width: 100%;
height: 300px;
position: relative;
background-color: rgba(0, 123, 255, 0.5);
}
h3 {
margin: 0;
margin: 0;
}
</style>
</style>

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

@ -1,11 +1,11 @@
<template>
<div>
<div class="headClass">
<h3>群体背景信息</h3>
<h3>人员信息</h3>
<!-- @click="gettbGsxtZdqtUpdate" -->
<el-button type="primary" v-if="showBut" :disabled="disabled" @click="submit">保存</el-button>
</div>
<div class="form_cnt">
<div>
<FormMessage :disabled="disabled" v-model="listQuery" :formList="formData" labelWidth="100px" ref="elform"
:rules="rules">
<template #ryzp>
@ -18,13 +18,13 @@
<div class="inputGroup" v-for="(item,index) in listQuery.ryLxdh" :key="index">
<el-input v-model="listQuery.ryLxdh[index]" class="group" placeholder="请输入电话号码" />
<div class="flex align-center but">
<el-button type="primary" :icon="Plus" circle @click="addPhone" title="添加电话号码" />
<el-button type="primary" :icon="Plus" circle @click="addPhone" title="添加电话号码" v-if=" listQuery.ryLxdh.length-1 ==index"/>
<el-button type="success" :icon="Minus" circle @click="removePhone(index)" title="删除电话号码" />
</div>
</div>
</div>
</template>
<template #tags>
<!-- <template #tags>
<div style="display: flex; align-items: center;">
<el-button type="primary" :disabled="disabled" @click="chooseMarksVisible = true">
选择标签
@ -33,12 +33,12 @@
已选择 {{ roleIds.length }} 个标签
</div>
</div>
</template>
</template> -->
</FormMessage>
</div>
</div>
<ChooseMarks v-model="chooseMarksVisible" @choosed="choosed" :roleIds="roleIds" />
<!-- <ChooseMarks v-model="chooseMarksVisible" @choosed="choosed" :roleIds="roleIds" /> -->
</template>
<script setup>
@ -50,8 +50,8 @@ import ChooseMarks from "@/components/ChooseList/ChooseMarks/index.vue";
import { ref, reactive, onMounted, getCurrentInstance, watch } from "vue";
import { tbGsxtZdryUpdate } from "@/api/zdr.js";
const { proxy } = getCurrentInstance();
const { D_BZ_XB, D_BZ_ZZMM, D_BZ_HYZK, D_BZ_MZ, D_BZ_XZQHDM, D_BZ_RCBKZT, D_GS_ZDR_RYJB, D_GS_ZDR_YJDJ, D_GS_BK_SSJZ, D_GS_ZDR_CZZT, D_BZ_WHCD, D_ZDRY_ZYLB } =
proxy.$dict('D_BZ_XB', 'D_BZ_ZZMM', 'D_BZ_HYZK', 'D_BZ_MZ', 'D_BZ_XZQHDM', 'D_BZ_RCBKZT', 'D_GS_ZDR_RYJB', 'D_GS_ZDR_YJDJ', 'D_GS_BK_SSJZ', 'D_GS_ZDR_CZZT', 'D_BZ_WHCD', 'D_ZDRY_ZYLB')
const { D_BZ_XB, D_BZ_ZZMM, D_BZ_HYZK, D_BZ_MZ, D_BZ_XZQHDM, D_ZDRY_RYLX,D_BZ_RCBKZT, D_GS_ZDR_RYJB, D_GS_ZDR_YJDJ, D_GS_BK_SSJZ, D_GS_ZDR_CZZT, D_BZ_WHCD, D_ZDRY_ZYLB } =
proxy.$dict('D_BZ_XB', 'D_BZ_ZZMM', 'D_BZ_HYZK', 'D_BZ_MZ', "D_ZDRY_RYLX",'D_BZ_XZQHDM', 'D_BZ_RCBKZT', 'D_GS_ZDR_RYJB', 'D_GS_ZDR_YJDJ', 'D_GS_BK_SSJZ', 'D_GS_ZDR_CZZT', 'D_BZ_WHCD', 'D_ZDRY_ZYLB')
const props = defineProps({
dataList: {
type: Object,
@ -77,7 +77,8 @@ const rules = reactive({
ryCsrq: [{ required: true, message: "请选择出生日期", trigger: "change" }],
ryJg: [{ required: true, message: "请选择籍贯", trigger: "change" }],
zdrRyjb: [{ required: true, message: "请选择人员级别", trigger: "change" }],
zdrYjdj: [{ required: true, message: "请选择预警等级", trigger: "change" }]
zdrYjdj: [{ required: true, message: "请选择预警等级", trigger: "change" }],
rylx: [{ required: true, message: "请选择人员类型", trigger: "change" }]
});
const listQuery = ref({ryLxdh:[""]}); //表单
const chooseMarksVisible = ref(false); // 控制标签选择弹窗显示
@ -110,11 +111,12 @@ const formData = ref([
{ label: "婚姻状态", prop: "hyzk", type: "select", options: D_BZ_HYZK },
{ label: "处置状态", prop: "zdrCzzt", type: "select", options: D_GS_ZDR_CZZT },
{ label: "布控状态", prop: "zdrBkZt", type: "select", options: D_BZ_RCBKZT },
{ label: "人员类型", prop: "rylx", type: "select", options: D_ZDRY_RYLX },
{ label: "入库开始时间", prop: "zdrRkkssj", type: "datetime" },
{ label: "入库结束时间", prop: "zdrRkjssj", type: "datetime" },
{ label: "Mac地址", prop: "macDz", type: "input" },
{ label: "联系电话", prop: "ryLxdh", type: "slot", width: "100%" },
{ label: "标签选择", prop: "tags", type: "slot", width: "100%" },
// { label: "标签选择", prop: "tags", type: "slot", width: "100%" },
{ label: "管控原因", prop: "zdrLkyy", type: "textarea", width: "100%" },
]);
const loading = ref(false);
@ -147,6 +149,7 @@ watch(() => props.dataList, (val) => {
listQuery.value = deepClone(val);
// 处理照片数据
listQuery.value.ryzp = val.ryzp == null || val.ryzp == '' ? [] : [val.ryzp];
listQuery.value.zdrSjjz = val.zdrSjjz == null || val.zdrSjjz == '' ? [] :JSON.parse(val.zdrSjjz);
// 处理标签ID数据，确保数据回显
if (val.tagIds && Array.isArray(val.tagIds) && val.tagIds.length > 0) {
roleIds.value = [...val.tagIds];
@ -155,7 +158,6 @@ watch(() => props.dataList, (val) => {
} else {
roleIds.value = [];
}
// listQuery.value.ryLxdh =listQuery.value.ryLxdh.length>0?listQuery.value.ryLxdh:['11'];
}
}, { deep: true })
// 提交
@ -163,22 +165,13 @@ const submit = () => {
loading.value = true
gettbGsxtZdryUpdate()
};
// 处理标签选择结果
const choosed = (selectedTags) => {
// 存储选择的标签ID用于回显
roleIds.value = selectedTags.map(tag => tag.id);
// 这里可以根据实际需求处理选择的标签数据
};
//
const gettbGsxtZdryUpdate = () => {
const promes = {
...listQuery.value,
ryzp: listQuery.value.ryzp.length > 0 ? listQuery.value.ryzp.toString() : "",
ryLxdh: listQuery.value.ryLxdh,
tagIds: roleIds.value,
bqIds: roleIds.value,
zdrSjjz:JSON.stringify(listQuery.value.zdrSjjz),
}
tbGsxtZdryUpdate(promes).then((res) => {
@ -228,9 +221,8 @@ const throwData = () => {
resolve({
...listQuery.value,
ryzp: listQuery.value.ryzp && listQuery.value.ryzp.length > 0 ? listQuery.value.ryzp.toString() : '',
ryLxdh: JSON.stringify(validPhones),
tagIds: roleIds.value,
bqIds: roleIds.value
ryLxdh: validPhones,
zdrSjjz:JSON.stringify(listQuery.value.zdrSjjz),
});
} else {
reject(new Error('表单验证失败，请检查输入信息'));
@ -246,9 +238,8 @@ const throwData = () => {
resolve({
...listQuery.value,
ryzp: listQuery.value.ryzp && listQuery.value.ryzp.length > 0 ? listQuery.value.ryzp.toString() : '',
ryLxdh: JSON.stringify(validPhones),
tagIds: roleIds.value,
bqIds: roleIds.value
ryLxdh: validPhones,
zdrSjjz:JSON.stringify(listQuery.value.zdrSjjz),
});
}
});

4
src/views/backOfficeSystem/DeploymentDisposal/mpvPeo/model/vehicle.vue
View File

@ -2,7 +2,7 @@
<div>
<div class="headClass" style="">
<h3>关联车辆</h3>
<el-button type="primary" :disabled="disabled" @click="AddPore">选择</el-button>
<el-button type="primary" :disabled="disabled" @click="AddPore" v-if="showBut">选择</el-button>
</div>
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
@ -30,7 +30,7 @@
import { ref, reactive, watch, toRaw, getCurrentInstance, onMounted, onUnmounted } from "vue";
import MyTable from "@/components/aboutTable/MyTable.vue";
import VehiclDoing from "../component/vehiclDoing.vue";
import { tbZdryClxxAdd, tbZdryClxxBatchAdd, tbZdryClxxDelete, tbZdryClxxSelectPage, tbZdryClxxUpdate } from '@/api/zdr.js'
import { tbZdryClxxAdd, tbZdryClxxDelete, tbZdryClxxSelectPage, tbZdryClxxUpdate } from '@/api/zdr.js'
import { ElMessage, ElMessageBox } from "element-plus";
const { proxy } = getCurrentInstance();
const { D_BZ_CLLX, D_BZ_CLYS, D_BZ_CLPP } = proxy.$dict("D_BZ_CLLX", "D_BZ_CLYS", "D_BZ_CLPP"); //获取字典数据

93
src/views/backOfficeSystem/DeploymentDisposal/mpvPeo/model/visitRecord.vue
View File

@ -2,24 +2,10 @@
<div>
<div class="headClass" style="">
<h3>走访记录</h3>
<!-- <el-button type="primary" :disabled="disabled" @click="AddPore">选择</el-button> -->
</div>
<div class="headSelect">
<el-button @click="add" type="primary">新增</el-button>
<el-button @click="AddPore" type="primary" v-if="showBut">新增</el-button>
</div>
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
<template #clys="{ row }">
<DictTag :tag="false" :value="row.clys" :options="D_BZ_CLYS" />
</template>
<template #cllx="{ row }">
<DictTag :tag="false" :value="row.cllx" :options="D_BZ_CLLX" />
</template>
<template #clpp="{ row }">
<DictTag :tag="false" :value="row.clpp" :options="D_BZ_CLPP" />
</template>
<!-- 操作 -->
<template #controls="{ row }">
<el-link type="danger" @click="delDictItem(row.id)">删除</el-link>
@ -27,24 +13,21 @@
</template>
</MyTable>
</div>
<VehiclDoing v-model="chooseMarksVisible" @comfirm="addMarks" :data="dataModel"
:dict="{ D_BZ_CLLX, D_BZ_CLYS, D_BZ_CLPP }" />
<InterLoding v-model="chooseMarksVisible" @comfirm="addMarks" :data="dataModel" />
</template>
<script setup>
import { identityCardRule } from "@/utils/rules"
import { ref, reactive, watch, toRaw, getCurrentInstance, onMounted, onUnmounted } from "vue";
import MyTable from "@/components/aboutTable/MyTable.vue";
import VehiclDoing from "../component/vehiclDoing.vue";
import { tbZdryClxxAdd, tbZdryClxxBatchAdd, tbZdryClxxDelete, tbGsxtZdryZfjlselectZfjl, tbZdryClxxUpdate } from '@/api/zdr.js'
import InterLoding from "../component/interLoding.vue";
import { tbGsxtZdryZfjlsaveOrUpdateZfjl,tbGsxtZdryZfjlselectZfjl,tbGsxtZdryZfjl } from '@/api/zdr.js'
import { ElMessage, ElMessageBox } from "element-plus";
const { proxy } = getCurrentInstance();
const { D_BZ_CLLX, D_BZ_CLYS, D_BZ_CLPP } = proxy.$dict("D_BZ_CLLX", "D_BZ_CLYS", "D_BZ_CLPP"); //获取字典数据
const chooseMarksVisible = ref(false)
const props = defineProps({
dataList: {
type: Object,
default: () => { },
default: () => {},
}, disabled: {
type: Boolean,
default: false
@ -58,9 +41,7 @@ const listData = ref({})
const addUpd = ref(true)
watch(() => props.dataList, (val) => {
if (val) {
listData.value = val
listData.value = {...val}
gettbZdryClxxSelectPage()
}
}, { deep: true })
@ -68,26 +49,21 @@ watch(() => props.dataList, (val) => {
const pageData = reactive({
tableData: [],
tableColumn: [{
prop: 'cph',
prop: 'zfmjXm',
width: 150,
label: '走访民警/辅警',
label: '走访民警',
}, {
prop: 'cllx',
prop: 'zffs',
label: '走访方式',
showSolt: true,
prop: 'clpp',
}, {
showSolt: true,
prop: 'clys',
prop: 'zfsj',
label: '走访时间',
}, {
showSolt: true,
prop: 'clpp',
prop: 'zfdz',
label: '走访地址',
},
{
showSolt: true,
prop: 'clpp',
prop: 'zfqk',
label: '走访情况',
}],
tableHeight: '200px',
@ -105,51 +81,39 @@ const pageData = reactive({
},
controlsWidth: 200,
})
// 表单数据
const formData = reactive({
username: "",
ID: ""
})
const rulesForm = ref(identityCardRule({ validator: true }, 'rySfzh'))
// 修改数据接口
const dataModel = ref()
const addMarks = (val) => {
const params = {
...val,
zdrid: listData.value.id,
zdryId: listData.value.id,
}
if (props.showBut && !props.disabled) {
if (addUpd.value) {
tbZdryClxxAdd(params).then(res => {
tbGsxtZdryZfjlsaveOrUpdateZfjl(params).then(res => {
gettbZdryClxxSelectPage()
proxy.$message({
message: '关联车辆添加成功',
message: '走访记录添加成功',
type: 'success'
})
})
}
else {
tbZdryClxxUpdate(params).then(res => {
tbGsxtZdryZfjlsaveOrUpdateZfjl(params).then(res => {
gettbZdryClxxSelectPage()
proxy.$message({
message: '关联车辆修改成功',
message: '走访记录修改成功',
type: 'success'
})
})
}
} else {
pageData.tableData.push(val)
}
}
onMounted(() => {
})
// 删除车辆
// 删除走访记录
const delDictItem = (val) => {
if (!props.disabled && props.showBut) {
ElMessageBox.confirm(
'是否删除关联车辆',
'是否删除走访记录',
'提示',
{
confirmButtonText: '确认',
@ -158,10 +122,10 @@ const delDictItem = (val) => {
}
)
.then(() => {
tbZdryClxxDelete({ ids: [val] }).then(res => {
tbGsxtZdryZfjl(val).then(res => {
gettbZdryClxxSelectPage()
proxy.$message({
message: '关联车辆删除成功',
message: '走访记录删除成功',
type: 'success'
})
})
@ -188,11 +152,9 @@ const AddPore = () => {
dataModel.value = {}
addUpd.value = true
}
// 查询车辆
// 查询走访记录
const gettbZdryClxxSelectPage = () => {
const promes = {
pageCurrent: 1,
pageSize: 20,
zdrid: listData.value.id
}
tbGsxtZdryZfjlselectZfjl(promes).then(res => {
@ -203,10 +165,6 @@ const gettbZdryClxxSelectPage = () => {
// 抛出数据并验证标签列表不为空
const throwData = () => {
return new Promise((resolve) => {
// // 验证：确保标签列表不为空
// if (!pageData.tableData || pageData.tableData.length === 0) {
// throw new Error('请录入车辆信息');
// }
resolve(pageData.tableData);
});
}
@ -246,13 +204,16 @@ defineExpose({
}
.headClass {
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
font-size: 18px;
font-weight: 600;
color: #303133;
margin: 20px 0 10px 0;
padding-bottom: 10px;
border-bottom: 2px solid #409eff;
position: relative;
}

328
src/views/backOfficeSystem/IntelligentControl/warningControl/components/historicalRoute.vue Normal file
View File

@ -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>

231
src/views/backOfficeSystem/IntelligentControl/warningControl/components/yjItem.vue
View File

@ -1,18 +1,48 @@
<template>
<div class="personCard relative flex mb10 pointer" >
<div class="avatarBox relative">
<div class="marks f12 absolute" :class="changeBg(props.item.yjJb)">
<span>{{ changetText(props.item.yjJb) }}</span>
<div class="personCard relative mb10 pointer">
<div class="flex nowrap align-center just-between boderBox">
<div class="avatarBox relative">
<div class="marks f12 absolute" :class="changeBg(props.item.yjJb)">
<span>{{ changetText(props.item.yjJb) }}</span>
</div>
<div>
<el-image :preview-teleported="true" style="width: 80px; height: 110px" :src="props.item.yjTp"
:preview-src-list="[props.item.yjTp]" />
</div>
<div>
<span class="smallbtn" @click.stop="() => { }">全息档案{{ props.item.id }}</span>
</div>
</div>
<div>
<el-image :preview-teleported="true" style="width: 80px; height: 110px" :src="props.item.yjTp" :preview-src-list="[props.item.yjTp]"/>
</div>
<div>
<span class="smallbtn" @click.stop="()=>{}">全息档案</span>
</div>
</div>
<div class="infoBox">
<div class="items">
<div class="infoBox">
<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 ellipsis">性别：<span class="value">{{ IdCard(props.item.yjRysfzh , 2 )}}</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.qssj }}</span></div>
<div class="infoItem ellipsis">反馈时间：<span class="value">{{ props.item.fksj }}</span></div>
</div> -->
</div>
</div>
</div>
<!-- 虚拟触发 -->
<!-- <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 class="infoItem ellipsis flex align-center">
<img src="@/assets/images/ddtb.png" />
<span class="value">{{ props.item.yjDz }}</span>
</div>
</el-popover> -->
</div>
<HistoricalRoute v-model="showTrack" :data="props.item" />
</template>
<script setup>
import emitter from "@/utils/eventBus.js";
import { qcckGet, qcckPost } from "@/api/qcckApi.js";
import * as MOSTY from "@/components/MyComponents/index";
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 props = defineProps({
item: {
@ -70,28 +94,29 @@ const props = defineProps({
type: {
type: String,
default: ""
}, track: {
type: Boolean,
default: true
}
});
watch(() => props.item, (newVal) => {
if (newVal) {
console.log(newVal);
}
},{deep:true})
const deptLevel = ref(null)
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;
});
const emit = defineEmits(['showDetail'])
const showDetail = (val) => {
emit('showDetail', val)
}
// 处理签收
const handleQsFk = (val,type) =>{
switch(type){
const handleQsFk = (val, type) => {
switch (type) {
case '签收':
proxy.$confirm("是否确定要签收？", "警告", { type: "warning" }).then(() => {
qcckPost({id:val.id}, "/mosty-gsxt/tbYjxx/yjqs").then(() => {
qcckPost({ id: val.id }, "/mosty-gsxt/tbYjxx/yjqs").then(() => {
val.czzt = '02'
proxy.$message({ type: "success", message: "签收成功" });
});
@ -99,7 +124,7 @@ const handleQsFk = (val,type) =>{
break;
case '反馈':
case '查看反馈':
emitter.emit("openFkDialog", {id:val.id,type});
emitter.emit("openFkDialog", { id: val.id, type });
break;
}
}
@ -133,14 +158,42 @@ const changetText = (type) => {
return "不关注";
}
};
const showDetail = () => {
emit('showDetail',props.item)
}
const showTrack=ref(false)
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>
<style lang="scss" scoped>
.personCard {
position: relative;
background: rgba(10, 49, 88, 0.6);
box-shadow: inset 0px 0px 10px 0px rgba(56, 119, 242, 0.5);
border-radius: 0px 0px 0px 0px;
@ -149,12 +202,41 @@ const showDetail = () => {
box-sizing: border-box;
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 {
background: rgba(17, 66, 96, 0.8);
}
::v-deep .el-button{
span{
::v-deep .el-button {
span {
color: #fff;
}
}
@ -163,6 +245,7 @@ const showDetail = () => {
margin-right: 5px;
overflow: hidden;
width: 80px;
.marks {
width: 70px;
height: 32px;
@ -203,31 +286,28 @@ const showDetail = () => {
.infoBox {
width: calc(100% - 90px);
display: flex;
justify-content: space-between;
.items{
width: 50%;
// display: flex;
// justify-content: space-between;
.linItem {
line-height: 28px;
}
.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;
}
}
.wichAlian {
// width: 10%;
text-align: center;
}
.wichAlian3 {
// width: 40%;
}
.wichAlian2 {
// width: 10%;
text-align: center;
}
}
}
@ -239,7 +319,8 @@ const showDetail = () => {
border-radius: 5px 5px 5px 5px;
margin-top: 6px;
}
.num{
.num {
color: #00ffff;
}
</style>

183
src/views/backOfficeSystem/IntelligentControl/warningControl/index.vue
View File

@ -11,77 +11,88 @@
</el-form>
<el-button type="primary">搜索</el-button>
</div>
<div class="systemBox">
<!-- 左边列表 -->
<div class="leftList">
<div class="hed flex just-between align center">
<span class="f14">预警列表</span>
<span style="color: #00b7ff" class="pointer" @click="seeMoreFn">查看更多》</span>
</div>
<div class="ml10 mr10 mt10">
<el-input v-model="keyword" placeholder="姓名、证件号码搜索">
<template #append><el-icon><Search /></el-icon></template>
</el-input>
</div>
<ul class="listContent noScollLine mt10" v-infinite-scroll="loadList" style="overflow: auto" v-loading="loading">
<!-- @click.stop="showDetail(item)" -->
<li v-for="(item, index) in personList" :key="index" >
<YjItem :item="item" type="yj" :dic="{D_BZ_YJCZZT}"></YjItem>
</li>
<MOSTY.Empty :show="!loading && personList.length <= 0"></MOSTY.Empty>
</ul>
</div>
<!-- 右边模块 -->
<div class="rightList">
<!-- 第一部门 -->
<div class="model-commom">
<div class="hed flex align-center">预警处置统计</div>
<div class="comm-cnt" v-loading="list.YjczDate.loading">
<BarHatEcharts echartsId="qylxEcharts" :data="list.YjczDate"></BarHatEcharts>
<div class="systemBox">
<!-- 左边列表 -->
<div class="leftList">
<div class="hed flex just-between align center">
<span class="f14">预警列表</span>
<span style="color: #00b7ff" class="pointer" @click="seeMoreFn">查看更多》</span>
</div>
</div>
<!-- 第二部分 -->
<div class="model-commom mt10">
<div class="hed flex align-center">布控区域统计</div>
<div class="comm-cnt" v-loading="list.RylxDate.loading">
<BarHatEcharts echartsId="rylxEcharts" :data="list.RylxDate"></BarHatEcharts>
<div class="ml10 mr10 mt10">
<el-input v-model="keyword" placeholder="姓名、证件号码搜索">
<template #append>
<el-button type="primary" @click="getKeyword">搜索</el-button>
<!-- <div >
<el-icon >
<Search />
</el-icon>
</div> -->
</template>
</el-input>
</div>
<ul class="listContent noScollLine mt10" v-infinite-scroll="loadList" style="overflow: auto"
v-loading="loading">
<!-- @click.stop="showDetail(item)" -->
<li v-for="(item, index) in personList" :key="index" @click="markAbove(item)">
<YjItem :item="item" type="yj" :dic="{ D_BZ_YJCZZT }" @showDetail="showDetail"></YjItem>
</li>
<MOSTY.Empty :show="!loading && personList.length <= 0"></MOSTY.Empty>
</ul>
</div>
<!-- 第三部分 -->
<div class="model-commom mt10">
<div class="hed flex align-center">感知源统计</div>
<div class="comm-cnt" v-loading="list.GzyDate.loading">
<BarHatEcharts echartsId="gzyEcharts" :data="list.GzyDate"></BarHatEcharts>
<!-- 右边模块 -->
<div class="rightList">
<!-- 第一部门 -->
<div class="model-commom">
<div class="hed flex align-center">预警处置统计</div>
<div class="comm-cnt" v-loading="list.YjczDate.loading">
<BarHatEcharts echartsId="qylxEcharts" :data="list.YjczDate"></BarHatEcharts>
</div>
</div>
</div>
<!-- 第四部分 -->
<div class="model-commom mt10">
<div class="hed flex align-center">预警等级统计</div>
<div class="comm-cnt" v-loading="loadingyj">
<WarningCount ref="yjjbRef"></WarningCount>
<!-- 第二部分 -->
<div class="model-commom mt10">
<div class="hed flex align-center">布控区域统计</div>
<div class="comm-cnt" v-loading="list.RylxDate.loading">
<BarHatEcharts echartsId="rylxEcharts" :data="list.RylxDate"></BarHatEcharts>
</div>
</div>
<!-- 第三部分 -->
<div class="model-commom mt10">
<div class="hed flex align-center">感知源统计</div>
<div class="comm-cnt" v-loading="list.GzyDate.loading">
<BarHatEcharts echartsId="gzyEcharts" :data="list.GzyDate"></BarHatEcharts>
</div>
</div>
<!-- 第四部分 -->
<div class="model-commom mt10">
<div class="hed flex align-center">预警等级统计</div>
<div class="comm-cnt" v-loading="loadingyj">
<WarningCount ref="yjjbRef"></WarningCount>
</div>
</div>
</div>
</div>
</div>
</div>
<Information v-model="showDialog" title="发送指令" @submit='submit' @close='close'>
<SemdFqzl ref="semdFqzlRef" :itemData="itemData" @handleClose="handleClose" identification="yj" :tacitly="tacitly"/>
<Information v-model="showDialog" title="发送指令" @submit='submit' @close='close'>
<SemdFqzl ref="semdFqzlRef" :itemData="itemData" @handleClose="handleClose" identification="yj"
:tacitly="tacitly" />
</Information>
<!-- 反馈按钮 -->
<FkDialog @change="getList"></FkDialog>
<LeftDialog></LeftDialog>
</template>
<script setup>
import LeftDialog from '@/views/home/dialog/leftDialog.vue'
import FkDialog from './components/fkDialog.vue'
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 emitter from "@/utils/eventBus.js";
import YjItem from "./components/yjItem.vue";
import WarningCount from "./components/WarningCount.vue";
import BarHatEcharts from "@/views/home/echarts/barHatEcharts.vue";
import { onMounted, reactive, ref,getCurrentInstance } from "vue";
import { onMounted, reactive, ref, getCurrentInstance } from "vue";
import { useRouter } from "vue-router";
import Information from "@/views/home/model/information.vue";
import SemdFqzl from '@/components/instructionHasBeen/sendFqzl.vue'
@ -114,13 +125,13 @@ const loadingyj = ref(false)
const list = reactive({
// 预警处置统计
YjczDate: {
loading:false,
loading: false,
xDate: [],
list: [],
},
// 布控区域统计
RylxDate: {
loading:false,
loading: false,
xDate: [],
list: [],
},
@ -128,68 +139,71 @@ const list = reactive({
GzyDate: {
xDate: [],
list: [],
loading:false,
loading: false,
},
})
const personList = ref([]);
const pageNum = ref(1)
const total = ref(0)
onMounted(()=>{
onMounted(() => {
getList()
init()
})
// 触底加载
const loadList = () => {
if( personList.value.length == total.value) return;
if (personList.value.length == total.value) return;
pageNum.value++;
getList()
}
const getList = () =>{
let params = { pageSize:10, pageNum:pageNum.value };
const getList = () => {
let params = { pageSize: 10, pageNum: pageNum.value,keyword:keyword.value };
loading.value = true;
qcckPost(params,'/mosty-gsxt/tbYjxx/getPageList').then(res=>{
qcckPost(params, '/mosty-gsxt/tbYjxx/getPageList').then(res => {
loading.value = false;
let arr = res.records || [];
personList.value = pageNum.value == 1 ? arr : personList.value.concat(arr);
total.value = res.total;
}).catch(()=>{
}).catch(() => {
loading.value = false;
})
}
const init = () =>{
const getKeyword = () => {
pageNum.value=1
getList()
}
const init = () => {
// 预警处置统计
list.YjczDate.loading = true;
qcckGet({},'/mosty-gsxt/tbYjxx/getYjCzztTj').then(res=>{
qcckGet({}, '/mosty-gsxt/tbYjxx/getYjCzztTj').then(res => {
list.YjczDate.loading = false;
list.YjczDate.xDate = res.map(item=>item.zdmc);
list.YjczDate.xDate = res.map(item => item.zdmc);
list.YjczDate.list = [{
value: res.map(item=>item.count),
value: res.map(item => item.count),
color: ['rgba(0,244,255,1)', 'rgba(0,77,167,1)'],
hatColor: '#087df9'
}]
})
// 布控区域统计
list.RylxDate.loading = true;
qcckGet({},'/mosty-gsxt/tbGsxtBkQy/getBkQytj').then(res=>{
qcckGet({}, '/mosty-gsxt/tbGsxtBkQy/getBkQytj').then(res => {
list.RylxDate.loading = false;
list.RylxDate.xDate = res.map(item=>item.qymc);
list.RylxDate.xDate = res.map(item => item.qymc);
list.RylxDate.list = [{
value: res.map(item=>item.num),
value: res.map(item => item.num),
color: ['rgba(0,244,255,1)', 'rgba(0,77,167,1)'],
hatColor: '#087df9'
}]
})
// 感知元统计
list.GzyDate.loading= true;
qcckGet({},'/mosty-gsxt/tbYjxx/getGzyTj').then(res=>{
list.GzyDate.loading = true;
qcckGet({}, '/mosty-gsxt/tbYjxx/getGzyTj').then(res => {
list.GzyDate.loading = false;
list.GzyDate.xDate = res.map(item=>item.yj_gzymc);
list.GzyDate.xDate = res.map(item => item.yj_gzymc);
list.GzyDate.list = [{
value: res.map(item=>item.num),
value: res.map(item => item.num),
color: ['rgba(0,244,255,1)', 'rgba(0,77,167,1)'],
hatColor: '#087df9'
}]
@ -197,7 +211,7 @@ const init = () =>{
// 预警级别
loadingyj.value = true;
qcckGet({},'/mosty-gsxt/tbYjxx/getYjxxTj').then(res=>{
qcckGet({}, '/mosty-gsxt/tbYjxx/getYjxxTj').then(res => {
loadingyj.value = false;
yjjbRef.value.initCharts(res)
})
@ -207,25 +221,34 @@ const seeMoreFn = () => {
router.push('/ControlApproval')
}
const showDialog = ref(false)
const itemData=ref()
const itemData = ref()
const showDetail = (item) => {
showDialog.value = true;
itemData.value=item
itemData.value = item
}
const handleClose = () => {
showDialog.value = false;
}
const semdFqzlRef = ref()
const tacitly = {
title:'yjBt',
instructionContent:'yjNr'
title: 'yjBt',
instructionContent: 'yjNr'
}
const submit=()=>{
const submit = () => {
semdFqzlRef.value.getsendFqzl()
}
const 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>
<style lang="scss" scoped>
@ -314,13 +337,13 @@ const close = () => {
height: 40px;
line-height: 40px;
padding-left: 10px;
background: linear-gradient(90deg, #124cb3 0%, rgba(18, 76, 179, 0.23) 77%, rgba(18, 76, 179, 0) 100%);
background: linear-gradient(90deg, #124cb3 0%, rgba(18, 76, 179, 0.23) 77%, rgba(18, 76, 179, 0) 100%);
}
}
</style>
<style>
.el-loading-mask{
background: rgba(0,0,0,0.5);
.el-loading-mask {
background: rgba(0, 0, 0, 0.5);
}
</style>

0
src/views/backOfficeSystem/JudgmentHome/tsypHome/components/content.js → src/views/backOfficeSystem/JudgmentHome/tsypHome/components copy/content.js
View File

0
src/views/backOfficeSystem/JudgmentHome/tsypHome/components/historicalReport.vue → src/views/backOfficeSystem/JudgmentHome/tsypHome/components copy/historicalReport.vue
View File

37
src/views/backOfficeSystem/JudgmentHome/tsypHome/components copy/index.vue Normal file
View File

@ -0,0 +1,37 @@
<template>
<div>
<YpHome v-if="showModel == '研判首页'" @change="changeModel"></YpHome>
<YjList v-if="showModel == '态势预警列表'" :item="itemYj" @change="changeModel"></YjList>
<YjDetail v-if="showModel == '预警详情'" :item="itemDetail" @change="changeModel"></YjDetail>
</div>
</template>
<script setup>
import YpHome from "./components/ypHome.vue";
import YjList from "./components/yjList.vue";
import YjDetail from "./components/yjDetail.vue";
import { onMounted, ref } from "vue";
const showModel = ref('研判首页')
const itemYj = ref({})
const itemDetail = ref({})
onMounted(()=>{
// route.query.id ? lookDeatl(route.query.id): getLits();
})
function changeModel(val){
showModel.value = val.type ;
if(val.data){
if(val.type == '态势预警列表'){
itemYj.value = val.data
}else if(val.type == '预警详情'){
itemDetail.value = val.data
}
}
}
</script>
<style lang="scss" scoped>
</style>

0
src/views/backOfficeSystem/JudgmentHome/tsypHome/components/particulars.vue → src/views/backOfficeSystem/JudgmentHome/tsypHome/components copy/particulars.vue
View File

0
src/views/backOfficeSystem/JudgmentHome/tsypHome/components/yjDetail.vue → src/views/backOfficeSystem/JudgmentHome/tsypHome/components copy/yjDetail.vue
View File

0
src/views/backOfficeSystem/JudgmentHome/tsypHome/components/yjList.vue → src/views/backOfficeSystem/JudgmentHome/tsypHome/components copy/yjList.vue
View File

417
src/views/backOfficeSystem/JudgmentHome/tsypHome/components copy/ypHome.vue Normal file
View File

@ -0,0 +1,417 @@
<template>
<!-- 研判类型 -->
<div class="content">
<div class="btnsBox" ref="refBtn">
<CheckBox :data="checkData.yplxBtn" @changeData="changeData_yplx"></CheckBox>
</div>
<div ref="searchBox">
<Search :searchArr="searchConfiger" @submit="onSearch"> </Search>
</div>
<ul class="cntlsit mb10" v-if="show" v-infinite-scroll="load" :style="{ height: listHeight + 'px' }"
v-loading="loading">
<li class="cntItem" @click.stop="lookDeatl(it)" v-for="(it, idx) in list" :key="idx">
<div class="ww100"><img class="ww100" style="height: 168px;" src="@/assets/images/mxbg.jpg" alt=""></div>
<div class="f14 lh24 pl4 pr4 one_text_detail">名称：{{ it.ypMc }}</div>
<div class="flex ww100 f14 lh24 pl4 pr4 one_text_detail">类型：
<DictTag :value="it.ypLx" :tag="false" :options="D_SG_TSYPGZ" />
</div>
<div class="f14 lh24 pl4 pr4 one_text_detail">数量：{{ it.num }}</div>
<div class="foot">
<span class="ml10 pointer" @click.stop="openHistoricalReport(it.id)" style="color:#027ff0 ;"><el-icon style="top: 2px;"><Document /></el-icon>历史报告</span>
<span class="ml10 pointer" @click.stop="funAll(it.id)" style="color:#027ff0 ;"><el-icon style="top: 2px;"><Document /></el-icon>报告</span>
<span class="ml10 pointer" @click="handleHs(it)" style="color:#f4ac47 ;"><el-icon style="top: 2px;"><Files /></el-icon>会商</span>
</div>
</li>
<div class="ww100 flex just-center">
<MOSTY.Empty :show="!loading && list.length <= 0"></MOSTY.Empty>
</div>
<div class="tc ww100 mb4" style="color: #a29f9f;" v-if="total == list.length && total > 0">暂时没有数据了！</div>
</ul>
</div>
<YpModel v-model="showModel" @SaveReport="SaveReport" :heightNumber="436" v-model:textContent="textContent"></YpModel>
<HistoricalReport v-model="showHistoricalReport" @choosed="getHistory" :chageData="chageData"/>
</template>
<script setup>
import CheckBox from '@/components/checkBox/index.vue'
import YpModel from '@/components/ypModel/index.vue'
import HistoricalReport from './historicalReport.vue'
import * as MOSTY from "@/components/MyComponents/index";
import Search from "@/components/aboutTable/Search.vue";
import { qcckPost } from "@/api/qcckApi.js";
import { timeValidate } from '@/utils/tools.js'
import { getItem } from '@/utils/storage.js'
import { useRoute, useRouter } from 'vue-router';
import { reactive, ref, onMounted, getCurrentInstance, watch, defineEmits } from "vue";
import { jqypDywdtj, jqypfxbgJqlxtj, jqypfxbgYdfx, jqypfxbgJqlytj, jqypfxbgTj, jqypfxbgCljgf, jqypfxbgCzlfx, getDictItem } from '@/api/semanticAnalysis'
import { textStyle, Firstlevelheading, Subheading, BiheadlinegTitle, BigTitle, headTitle, report, signature } from './content.js'
import { ElMessage, ElMessageBox } from 'element-plus'
const router = useRouter();
const { proxy } = getCurrentInstance();
const emit = defineEmits(['change'])
const { D_SG_SJLY, D_SG_TSYPGZ, JQLB, JQLX, JQXL, JQZL, D_BZ_JQLY, D_BZ_JQFL, JQCLJG } = proxy.$dict("D_SG_SJLY", "D_SG_TSYPGZ", "JQLB", "JQLX", "JQXL", "JQZL", "D_BZ_JQLY", "D_BZ_JQFL", "JQCLJG"); //获取字典数据
const searchBox = ref(); //搜索框
const showModel = ref(false);
const textContent = ref('');
const refBtn = ref();
const show = ref(false)
const listHeight = ref()
const searchConfiger = ref([
{ label: "研判名称", prop: "ypMc", placeholder: "请输入研判名称", showType: "input" },
]);
const checkData = reactive({
yplxBtn: {
hasChoose: [],
list: []
},
});
const page = ref(1);
const total = ref(0)
const list = ref([])
const loading = ref(false);
const formData = ref({})
const chageData=ref()
watch(() => D_SG_TSYPGZ.value, val => {
checkData.yplxBtn.list = val.map(v => v.zdmc);
checkData.yplxBtn.hasChoose = val.map(v => v.zdmc);
}, { immediate: true, deep: true });
onMounted(() => {
show.value = true;
Time()
tabHeightFn();
getLits()
})
// 研判类型
const changeData_yplx = (val) => {
checkData.yplxBtn.hasChoose = val;
let dms = [];
D_SG_TSYPGZ.value.forEach(item => {
if (val.includes(item.zdmc)) dms.push(item.dm);
});
formData.value.ypLx = dms;
page.value = 1;
getLits();
}
const onSearch = (val) => {
formData.value = { ...formData.value, ...val, };
page.value = 1;
getLits();
}
const load = () => {
if (total.value == list.value.length) return;
page.value++;
getLits();
}
const getLits = () => {
let params = {
pageCurrent: page.value,
pageSize: 8,
...formData.value
}
loading.value = true;
qcckPost(params, '/mosty-gsxt/tsyp/selectPage').then(res => {
let arr = res.records || [];
list.value = page.value == 1 ? arr : list.value.concat(arr);
total.value = res.total;
loading.value = false;
}).catch(() => {
loading.value = false;
})
}
const handleHs = (val) => {
router.push({ path: '/MeetingRoom', query: { tsypid: val.id } })
}
// 查看详情
const lookDeatl = (val) => {
emit('change', { data:val, type:'态势预警列表' })
}
// 表格高度计算
const tabHeightFn = () => {
listHeight.value = window.innerHeight - searchBox.value.offsetHeight - refBtn.value.offsetHeight - 182;
window.onresize = function () {
tabHeightFn();
};
};
const dataList = reactive({
dyTj: {
xAxisData: [],
seriesData: [],
},
jqlxTj: [],
jqlyTj: [],
CljgfTj: [],
XsfxTj: [],
})
const sortingRatioValue = ref({
jqlx: "",
jqly: "",
dywd: "",
ydfx: "",
xlwdfx: "",
czjgfx: "",
})
const sortingRatio = (data) => {
// 提取所有number值
// 计算总数
const total = data.reduce((sum, item) => sum + item.number, 0);
// 找出第一大和第二大的值及其对应的name
const sortedData = [...data].sort((a, b) => b.number - a.number);
const dataValue = sortedData.map(item => {
return {
...item,
ratio: total > 0 ? (item.number / total * 100).toFixed(2) + '%' : '0%',
}
})
return dataValue
}
const pageData = reactive({
parameter: { bjlbList: '' }
})
const getDictItemList = () => {
const promes = {
dictCode: "00000000"
}
getDictItem(promes).then(res => {
pageData.parameter.bjlbList = res.map(item => item.dm).join(',')
console.log(pageData.parameter.bjlbList);
})
}
getDictItemList()
const funAll = (val) => {
const dev = getItem('deptId')[0]
sortingRatioValue.value = {}
textContent.value = BigTitle(`${endYears.value}年度西藏公安执法数据分析`) + headTitle({
orgName: dev.deptName,
serialNumber: timeValidate("", "mm"),
time: timeValidate(),
})
const data = `为全面、客观、准确掌握全区公安机关的执法状况，自治区公安厅基于数据统计，对全区公安机关${endYears.value}年度的执法状况作了客观分析。`
textContent.value += BiheadlinegTitle('1.接处警情况') + textStyle(data) + Firstlevelheading('一、执法状况总体分析')
getfxbgYdfx(val)
getfxbgTj(val)
getfxbgJqlxtj(val)
getfxbgJqlytj(val)
getfxbgDywdtj(val)
getfxgbCljgf(val)
getfxgbCzlfx(val)
showModel.value = true;
}
watch(() => sortingRatioValue.value, (val) => {
if (val.jqlx && val.jqly && val.dywd && val.ydfx && val.xlwdfx && val.czjgfx) {
textContent.value += val.jqlx + val.jqly + val.dywd + val.ydfx + val.xlwdfx + val.czjgfx + report() + signature()
}
}, { deep: true })
const getfxbgTj = (val) => {
jqypfxbgTj({ ypid: val }).then(res => {
const data = `${Time()} ，全区公安机关共接报各类警情${res.total}起,同比上升 ${res.tbbsb}%,同比上升${res.hbbsb}%`
textContent.value += BiheadlinegTitle('1.1接报警情') + textStyle(data)
dataList.XsfxTj = res
})
}
// 警情类型统计
const getfxbgJqlxtj = (val) => {
let params = {
...pageData.parameter,
ypid: val
}
jqypfxbgJqlxtj(params).then(res => {
const model = sortingRatio(res)
const data = `按警情类型来看，${model[0].name}最多，占到${model[0].ratio}；其次为${model[1].name}最多，占到${model[1].ratio}。`
sortingRatioValue.value.jqlx = Subheading('1.1.1类型维度') + textStyle(data)
})
}
// 警情来源统计
const getfxbgJqlytj = (val) => {
jqypfxbgJqlytj({ ypid: val }).then(res => {
const model = sortingRatio(res)
const data = `按警情来源来看，${model[0].name}最多，占到${model[0].ratio}；其次为${model[1].name}最多，占到${model[1].ratio}。`
sortingRatioValue.value.jqly = Subheading('1.1.2来源维度') + textStyle(data)
})
}
// 地域统计
const getfxbgDywdtj = (val) => {
jqypDywdtj({ ypid: val }).then(res => {
dataList.dyTj.xAxisData = res.map(it => it.ssbm)
dataList.dyTj.seriesData = [];
for (let i = 0; i < res.length; i++) {
dataList.dyTj.seriesData[i] = [];
for (let j = 0; j < res.length; j++) {
dataList.dyTj.seriesData[i][j] = 0;
}
}
for (let i = 0; i < dataList.dyTj.seriesData.length; i++) {
dataList.dyTj.seriesData[i][i] = res[i].number
}
const model = sortingRatio(res)
let data
if (model.length > 1) {
data = `从地市分布地市来看，${model[0].ssbm}警情量最大，占到全区警情总量的${model[0].number}。其次为${model[1].ssbm}和${model[2].ssbm}，两市警情量较为接近。警情量最少的为${model[model.length - 1].ssbm}。`
} else {
data = `从地市分布地市来看，${model[0].ssbm}警情量最大，占到全区警情总量的${model[0].number}。`
}
sortingRatioValue.value.dywd = Subheading('1.1.3地域维度') + textStyle(data)
})
}
//分析报告-时间维度-月分析
const getfxbgYdfx = (val) => {
jqypfxbgYdfx({ ypid: val }).then(res => {
const model = sortingRatio(res)
const data = `我们将所有警情按照月份划分进行统计发现，每月警情分布较为平均。最高月份为${model[0].month}月，占到${model[0].number}；最低月份为${model[res.length - 1].month}月，占到${model[res.length - 1].number}。考虑是因为${model[0].month}月为我区传统旅游旺季，进藏人员较多。 ${model[res.length - 1].month}月一般春节及藏历新年期间，在藏人员较少。`
sortingRatioValue.value.ydfx = Subheading('1.1.4时间维度') + textStyle(data)
})
}
// 分析报告-处理结果分析
const getfxgbCljgf = (val) => {
jqypfxbgCljgf({ ypid: val }).then(res => {
// sortingRatioValue.Cljgf =
const model = sortingRatio(res)
let czjgfx = `从警情处置结果来看，`
model.forEach(item => {
czjgfx += `${item.name}，占到${item.ratio};`
})
sortingRatioValue.value.xlwdfx = BiheadlinegTitle('1.2警情处置') + Firstlevelheading('1.2.1结果维度') + textStyle(czjgfx)
})
}
// 分析报告-处置率分析
const getfxgbCzlfx = (val) => {
jqypfxbgCzlfx({ ypid: val }).then(res => {
dataList.withinTj = [{
name: "超时分流(超过24小时)",
value: res.within24h ? res.within24h : 0
}, {
name: "按时分流(24小时内)",
value: res.over24h ? res.over24h : 0
}]
const data = `从处警效率来看，24小时以内处警的，占到${res.over24h}%。表明我区公安机关在接警之后能够在第一时间处警。`
sortingRatioValue.value.czjgfx = Subheading('1.2.2效率维度') + textStyle(data)
})
}
const timeDate = ref()
const endYears = ref()
const Time = () => {
const currentYear = new Date().getFullYear();
const startOfYear = new Date(currentYear, 0, 1); // 今年1月1日
const endOfYear = new Date(currentYear, 11, 31, 23); // 今年12月31日23:59:59.999
const year = startOfYear.getFullYear();
const month = String(startOfYear.getMonth() + 1).padStart(2, '0');
const day = String(startOfYear.getDate()).padStart(2, '0');
const endYear = endOfYear.getFullYear();
const endMonth = String(endOfYear.getMonth() + 1).padStart(2, '0');
const endDay = String(endOfYear.getDate()).padStart(2, '0');
timeDate.value = `${endYear}年${endMonth}月${endDay}日`
endYears.value = year
return `${year}年${month}月${day}日 至${endYear}年${endMonth}月${endDay}日`
}
const showHistoricalReport = ref(false)
const openHistoricalReport = (val) => {
chageData.value = val
showHistoricalReport.value = true
}
// const
const getHistory = (val) => {
textContent.value = val
showHistoricalReport.value = false
showModel.value = true
}
const SaveReport = (val) => {
ElMessageBox.prompt('请输入名称', '提示', {
confirmButtonText: '确认',
cancelButtonText: '取消',
// inputPattern:/[\w!#$%&'*+/=?^_`{|}~-]+(?:\.[\w!#$%&'*+/=?^_`{|}~-]+)*@(?:[\w](?:[\w-]*[\w])?\.)+[\w](?:[\w-]*[\w])?/,
// inputErrorMessage: 'Invalid Email',
})
.then(({ value }) => {
const promes = {
bgmc:value,
bgnr: val,
ypid:chageData.value
}
qcckPost( promes , "/mosty-gsxt/gsxtYpbg/addEntity")
.then(() => {
ElMessage.success("保存成功");
})
})
.catch(() => {
ElMessage({
type: 'info',
message: '取消保存',
})
})
.catch(() => { });
}
</script>
<style lang="scss" scoped>
.content {
width: 100%;
height: 100%;
margin-top: 20px;
margin-left: 10px;
border-radius: 4px;
box-sizing: border-box;
.btnsBox {
background: #fff;
padding: 10px 5px;
border-radius: 4px;
margin-bottom: 10px;
}
.cntlsit {
display: flex;
flex-wrap: wrap;
align-content: start;
gap: 18px;
overflow: hidden;
overflow-y: auto;
background: #fff;
padding: 4px;
box-sizing: border-box;
.cntItem {
width: 300px;
border: 1px solid #ccc;
color: #787878;
border-radius: 4px;
overflow: hidden;
.foot {
text-align: right;
margin-top: 4px;
border-top: 1px solid #ccc;
padding: 4px;
box-sizing: border-box;
}
}
}
}
</style>

53
src/views/backOfficeSystem/JudgmentHome/tsypHome/components/addModel.vue Normal file
View File

@ -0,0 +1,53 @@
<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" v-show="title!='详情'">保存</el-button>
<el-button size="small" @click="close">关闭</el-button>
</div>
</div>
<div class="form_cnt">
<FormMessage :formList="formData" v-model="listQuery" ref="elform" :rules="rules">
</FormMessage>
</div>
</div>
</template>
<script setup>
import { reactive, ref } from 'vue'
import FormMessage from "@/components/aboutTable/FormMessage.vue";
const dialogForm = ref(false)
const title=ref("新增")
const init = (type,row) => {
dialogForm.value = true
if (type=='edit') {
title.value="编辑"
} else if (type=='add') {
title.value="新增"
} else {
title.value="详情"
}
}
// 表单内容
const formData = reactive([
{ label: "模型名称", prop: "mxmc", type: "input", width: "40%" },
{ label: "模型类型", prop: "mxlx", type: "input", width: "40%"},
])
const loading=ref(false)
// 新增
const submit = () => {
loading.value = true
}
// 关闭
const close = () => {
dialogForm.value = false
}
defineExpose({
init
})
</script>
<style lang="scss" scoped>
</style>

67
src/views/backOfficeSystem/JudgmentHome/tsypHome/components/regulation.vue Normal file
View File

@ -0,0 +1,67 @@
<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" v-show="title != '详情'">保存</el-button>
<el-button size="small" @click="close">关闭</el-button>
</div>
</div>
<div class="form_cnt">
<VueDraggable @update="onUpdate"
@add="onAdd"
@remove="remove">
<el-button type="primary" v-for="(item,index) in listBut" :key="index">{{ item }}</el-button>
</VueDraggable>
<VueDraggable>
<el-button type="primary" v-for="(item,index) in listBut" :key="index">{{ item }}</el-button>
</VueDraggable>
</div>
</div>
</template>
<script setup>
import { reactive, ref } from 'vue'
import FormMessage from "@/components/aboutTable/FormMessage.vue";
import { VueDraggable } from 'vue-draggable-plus'
const dialogForm = ref(false)
const title = ref("新增")
const init = (type, row) => {
dialogForm.value = true
if (type == 'edit') {
title.value = "编辑"
} else if (type == 'add') {
title.value = "新增"
} else {
title.value = "详情"
}
}
const loading = ref(false)
// 新增
const submit = () => {
loading.value = true
}
const listBut = ref(["物品", "人员", "组织", "次数", "事件", "地点", "整情"])
// 关闭
const close = () => {
dialogForm.value = false
}
const onUpdate = (evt) => {
console.log(evt)
}
// 新增
const onAdd = (evt) => {
console.log(evt)
}
// 删除
const remove = (evt) => {
console.log(evt)
}
defineExpose({
init
})
</script>
<style lang="scss" scoped></style>

435
src/views/backOfficeSystem/JudgmentHome/tsypHome/components/ypHome.vue
View File

@ -1,124 +1,96 @@
<template>
<!-- 研判类型 -->
<div class="content">
<div class="btnsBox" ref="refBtn">
<CheckBox :data="checkData.yplxBtn" @changeData="changeData_yplx"></CheckBox>
</div>
<div ref="searchBox">
<Search :searchArr="searchConfiger" @submit="onSearch"> </Search>
</div>
<ul class="cntlsit mb10" v-if="show" v-infinite-scroll="load" :style="{ height: listHeight + 'px' }"
v-loading="loading">
<li class="cntItem" @click.stop="lookDeatl(it)" v-for="(it, idx) in list" :key="idx">
<div class="ww100"><img class="ww100" style="height: 168px;" src="@/assets/images/mxbg.jpg" alt=""></div>
<div class="f14 lh24 pl4 pr4 one_text_detail">名称：{{ it.ypMc }}</div>
<div class="flex ww100 f14 lh24 pl4 pr4 one_text_detail">类型：
<DictTag :value="it.ypLx" :tag="false" :options="D_SG_TSYPGZ" />
</div>
<div class="f14 lh24 pl4 pr4 one_text_detail">数量：{{ it.num }}</div>
<div class="foot">
<span class="ml10 pointer" @click.stop="openHistoricalReport(it.id)" style="color:#027ff0 ;"><el-icon style="top: 2px;"><Document /></el-icon>历史报告</span>
<span class="ml10 pointer" @click.stop="funAll(it.id)" style="color:#027ff0 ;"><el-icon style="top: 2px;"><Document /></el-icon>报告</span>
<span class="ml10 pointer" @click="handleHs(it)" style="color:#f4ac47 ;"><el-icon style="top: 2px;"><Files /></el-icon>会商</span>
</div>
</li>
<div class="ww100 flex just-center">
<MOSTY.Empty :show="!loading && list.length <= 0"></MOSTY.Empty>
</div>
<div class="tc ww100 mb4" style="color: #a29f9f;" v-if="total == list.length && total > 0">暂时没有数据了！</div>
</ul>
<!-- 研判类型 -->
<div class="content">
<div class="titleBox">
<PageTitle title="模型平台">
<el-button type="primary" @click="openAddModel('add')" :icon="CirclePlus">
新增模型
</el-button>
</PageTitle>
</div>
<YpModel v-model="showModel" @SaveReport="SaveReport" :heightNumber="436" v-model:textContent="textContent"></YpModel>
<HistoricalReport v-model="showHistoricalReport" @choosed="getHistory" :chageData="chageData"/>
<div ref="searchBox">
<Search :searchArr="searchConfiger" @submit="onSearch"> </Search>
</div>
<ul class="cntlsit mb10" v-if="show" v-infinite-scroll="load" :style="{ height: listHeight + 'px' }"
v-loading="loading">
<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;"
src="@/assets/images/mxbg.jpg" alt=""></div>
<div class="foot">
<span class="ml10 pointer" style="color:#027ff0 ;" @click="openAddRule"><el-icon style="top: 2px;">
<Document />
</el-icon>查看规则</span>
<span class="ml10 pointer" style="color:#027ff0 ;" @click="openAddModel('edit', it)"><el-icon
style="top: 2px;">
<Edit />
</el-icon>编辑</span>
<span class="ml10 pointer" style="color:#f4ac47 ;"><el-icon style="top: 2px;">
<Files />
</el-icon>删除</span>
</div>
</li>
<div class="ww100 flex just-center">
<MOSTY.Empty :show="!loading && list.length <= 0"></MOSTY.Empty>
</div>
<div class="tc ww100 mb4" style="color: #a29f9f;" v-if="total == list.length && total > 0">暂时没有数据了！</div>
</ul>
</div>
<AddModel ref="addModel" />
<Regulation ref="regulation" />
</template>
<script setup>
import CheckBox from '@/components/checkBox/index.vue'
import YpModel from '@/components/ypModel/index.vue'
import HistoricalReport from './historicalReport.vue'
import PageTitle from "@/components/aboutTable/PageTitle.vue";
import { CirclePlus } from '@element-plus/icons-vue'
import * as MOSTY from "@/components/MyComponents/index";
import Search from "@/components/aboutTable/Search.vue";
import { qcckPost } from "@/api/qcckApi.js";
import { timeValidate } from '@/utils/tools.js'
import { getItem } from '@/utils/storage.js'
import { useRoute, useRouter } from 'vue-router';
import { reactive, ref, onMounted, getCurrentInstance, watch, defineEmits } from "vue";
import { jqypDywdtj, jqypfxbgJqlxtj, jqypfxbgYdfx, jqypfxbgJqlytj, jqypfxbgTj, jqypfxbgCljgf, jqypfxbgCzlfx, getDictItem } from '@/api/semanticAnalysis'
import { textStyle, Firstlevelheading, Subheading, BiheadlinegTitle, BigTitle, headTitle, report, signature } from './content.js'
import { ElMessage, ElMessageBox } from 'element-plus'
const router = useRouter();
const { proxy } = getCurrentInstance();
import AddModel from "./addModel.vue";
import Regulation from "./regulation.vue";
const emit = defineEmits(['change'])
const { D_SG_SJLY, D_SG_TSYPGZ, JQLB, JQLX, JQXL, JQZL, D_BZ_JQLY, D_BZ_JQFL, JQCLJG } = proxy.$dict("D_SG_SJLY", "D_SG_TSYPGZ", "JQLB", "JQLX", "JQXL", "JQZL", "D_BZ_JQLY", "D_BZ_JQFL", "JQCLJG"); //获取字典数据
const searchBox = ref(); //搜索框
const showModel = ref(false);
const textContent = ref('');
const refBtn = ref();
const show = ref(false)
const listHeight = ref()
const searchConfiger = ref([
{ label: "研判名称", prop: "ypMc", placeholder: "请输入研判名称", showType: "input" },
{ label: "模型名称", prop: "ypMc", placeholder: "请输入模型名称", showType: "input" },
{ label: "模型类型", prop: "ypLx", placeholder: "请输入模型类型", showType: "input" },
]);
const checkData = reactive({
yplxBtn: {
hasChoose: [],
list: []
},
const PaginationConfig = reactive({
pageCurrent: 1,
pageSize: 8,
});
const page = ref(1);
const total = ref(0)
const list = ref([])
const loading = ref(false);
const formData = ref({})
const chageData=ref()
watch(() => D_SG_TSYPGZ.value, val => {
checkData.yplxBtn.list = val.map(v => v.zdmc);
checkData.yplxBtn.hasChoose = val.map(v => v.zdmc);
}, { immediate: true, deep: true });
onMounted(() => {
show.value = true;
Time()
tabHeightFn();
getLits()
})
// 研判类型
const changeData_yplx = (val) => {
checkData.yplxBtn.hasChoose = val;
let dms = [];
D_SG_TSYPGZ.value.forEach(item => {
if (val.includes(item.zdmc)) dms.push(item.dm);
});
formData.value.ypLx = dms;
page.value = 1;
getLits();
}
const onSearch = (val) => {
formData.value = { ...formData.value, ...val, };
page.value = 1;
PaginationConfig.pageCurrent = 1;
getLits();
}
const load = () => {
if (total.value == list.value.length) return;
page.value++;
PaginationConfig.pageCurrent++;
getLits();
}
const getLits = () => {
let params = {
pageCurrent: page.value,
pageSize: 8,
...PaginationConfig,
...formData.value
}
loading.value = true;
qcckPost(params, '/mosty-gsxt/tsyp/selectPage').then(res => {
let arr = res.records || [];
list.value = page.value == 1 ? arr : list.value.concat(arr);
list.value = PaginationConfig.pageCurrent == 1 ? arr : list.value.concat(arr);
total.value = res.total;
loading.value = false;
}).catch(() => {
@ -126,292 +98,71 @@ const getLits = () => {
})
}
const handleHs = (val) => {
router.push({ path: '/MeetingRoom', query: { tsypid: val.id } })
}
// 查看详情
const lookDeatl = (val) => {
emit('change', { data:val, type:'态势预警列表' })
}
// 表格高度计算
const tabHeightFn = () => {
listHeight.value = window.innerHeight - searchBox.value.offsetHeight - refBtn.value.offsetHeight - 182;
listHeight.value = window.innerHeight - searchBox.value.offsetHeight - 230;
window.onresize = function () {
tabHeightFn();
};
};
const dataList = reactive({
dyTj: {
xAxisData: [],
seriesData: [],
},
jqlxTj: [],
jqlyTj: [],
CljgfTj: [],
XsfxTj: [],
})
const sortingRatioValue = ref({
jqlx: "",
jqly: "",
dywd: "",
ydfx: "",
xlwdfx: "",
czjgfx: "",
})
const sortingRatio = (data) => {
// 提取所有number值
// 计算总数
const total = data.reduce((sum, item) => sum + item.number, 0);
// 找出第一大和第二大的值及其对应的name
const sortedData = [...data].sort((a, b) => b.number - a.number);
const dataValue = sortedData.map(item => {
return {
...item,
ratio: total > 0 ? (item.number / total * 100).toFixed(2) + '%' : '0%',
}
})
return dataValue
// 打开弹窗
const addModel = ref(null)
const openAddModel = (type, row) => {
addModel.value.init(type, row)
}
const pageData = reactive({
parameter: { bjlbList: '' }
})
const getDictItemList = () => {
const promes = {
dictCode: "00000000"
}
getDictItem(promes).then(res => {
pageData.parameter.bjlbList = res.map(item => item.dm).join(',')
console.log(pageData.parameter.bjlbList);
})
}
getDictItemList()
const funAll = (val) => {
const dev = getItem('deptId')[0]
sortingRatioValue.value = {}
textContent.value = BigTitle(`${endYears.value}年度西藏公安执法数据分析`) + headTitle({
orgName: dev.deptName,
serialNumber: timeValidate("", "mm"),
time: timeValidate(),
})
const data = `为全面、客观、准确掌握全区公安机关的执法状况，自治区公安厅基于数据统计，对全区公安机关${endYears.value}年度的执法状况作了客观分析。`
textContent.value += BiheadlinegTitle('1.接处警情况') + textStyle(data) + Firstlevelheading('一、执法状况总体分析')
getfxbgYdfx(val)
getfxbgTj(val)
getfxbgJqlxtj(val)
getfxbgJqlytj(val)
getfxbgDywdtj(val)
getfxgbCljgf(val)
getfxgbCzlfx(val)
showModel.value = true;
}
watch(() => sortingRatioValue.value, (val) => {
if (val.jqlx && val.jqly && val.dywd && val.ydfx && val.xlwdfx && val.czjgfx) {
textContent.value += val.jqlx + val.jqly + val.dywd + val.ydfx + val.xlwdfx + val.czjgfx + report() + signature()
}
}, { deep: true })
const getfxbgTj = (val) => {
jqypfxbgTj({ ypid: val }).then(res => {
const data = `${Time()} ，全区公安机关共接报各类警情${res.total}起,同比上升 ${res.tbbsb}%,同比上升${res.hbbsb}%`
textContent.value += BiheadlinegTitle('1.1接报警情') + textStyle(data)
dataList.XsfxTj = res
})
}
// 警情类型统计
const getfxbgJqlxtj = (val) => {
let params = {
...pageData.parameter,
ypid: val
}
jqypfxbgJqlxtj(params).then(res => {
const model = sortingRatio(res)
const data = `按警情类型来看，${model[0].name}最多，占到${model[0].ratio}；其次为${model[1].name}最多，占到${model[1].ratio}。`
sortingRatioValue.value.jqlx = Subheading('1.1.1类型维度') + textStyle(data)
})
}
// 警情来源统计
const getfxbgJqlytj = (val) => {
jqypfxbgJqlytj({ ypid: val }).then(res => {
const model = sortingRatio(res)
const data = `按警情来源来看，${model[0].name}最多，占到${model[0].ratio}；其次为${model[1].name}最多，占到${model[1].ratio}。`
sortingRatioValue.value.jqly = Subheading('1.1.2来源维度') + textStyle(data)
})
}
// 地域统计
const getfxbgDywdtj = (val) => {
jqypDywdtj({ ypid: val }).then(res => {
dataList.dyTj.xAxisData = res.map(it => it.ssbm)
dataList.dyTj.seriesData = [];
for (let i = 0; i < res.length; i++) {
dataList.dyTj.seriesData[i] = [];
for (let j = 0; j < res.length; j++) {
dataList.dyTj.seriesData[i][j] = 0;
}
}
for (let i = 0; i < dataList.dyTj.seriesData.length; i++) {
dataList.dyTj.seriesData[i][i] = res[i].number
}
const model = sortingRatio(res)
let data
if (model.length > 1) {
data = `从地市分布地市来看，${model[0].ssbm}警情量最大，占到全区警情总量的${model[0].number}。其次为${model[1].ssbm}和${model[2].ssbm}，两市警情量较为接近。警情量最少的为${model[model.length - 1].ssbm}。`
} else {
data = `从地市分布地市来看，${model[0].ssbm}警情量最大，占到全区警情总量的${model[0].number}。`
}
sortingRatioValue.value.dywd = Subheading('1.1.3地域维度') + textStyle(data)
})
}
//分析报告-时间维度-月分析
const getfxbgYdfx = (val) => {
jqypfxbgYdfx({ ypid: val }).then(res => {
const model = sortingRatio(res)
const data = `我们将所有警情按照月份划分进行统计发现，每月警情分布较为平均。最高月份为${model[0].month}月，占到${model[0].number}；最低月份为${model[res.length - 1].month}月，占到${model[res.length - 1].number}。考虑是因为${model[0].month}月为我区传统旅游旺季，进藏人员较多。 ${model[res.length - 1].month}月一般春节及藏历新年期间，在藏人员较少。`
sortingRatioValue.value.ydfx = Subheading('1.1.4时间维度') + textStyle(data)
})
}
// 分析报告-处理结果分析
const getfxgbCljgf = (val) => {
jqypfxbgCljgf({ ypid: val }).then(res => {
// sortingRatioValue.Cljgf =
const model = sortingRatio(res)
let czjgfx = `从警情处置结果来看，`
model.forEach(item => {
czjgfx += `${item.name}，占到${item.ratio};`
})
sortingRatioValue.value.xlwdfx = BiheadlinegTitle('1.2警情处置') + Firstlevelheading('1.2.1结果维度') + textStyle(czjgfx)
})
}
// 分析报告-处置率分析
const getfxgbCzlfx = (val) => {
jqypfxbgCzlfx({ ypid: val }).then(res => {
dataList.withinTj = [{
name: "超时分流(超过24小时)",
value: res.within24h ? res.within24h : 0
}, {
name: "按时分流(24小时内)",
value: res.over24h ? res.over24h : 0
}]
const data = `从处警效率来看，24小时以内处警的，占到${res.over24h}%。表明我区公安机关在接警之后能够在第一时间处警。`
sortingRatioValue.value.czjgfx = Subheading('1.2.2效率维度') + textStyle(data)
})
}
const timeDate = ref()
const endYears = ref()
const Time = () => {
const currentYear = new Date().getFullYear();
const startOfYear = new Date(currentYear, 0, 1); // 今年1月1日
const endOfYear = new Date(currentYear, 11, 31, 23); // 今年12月31日23:59:59.999
const year = startOfYear.getFullYear();
const month = String(startOfYear.getMonth() + 1).padStart(2, '0');
const day = String(startOfYear.getDate()).padStart(2, '0');
const endYear = endOfYear.getFullYear();
const endMonth = String(endOfYear.getMonth() + 1).padStart(2, '0');
const endDay = String(endOfYear.getDate()).padStart(2, '0');
timeDate.value = `${endYear}年${endMonth}月${endDay}日`
endYears.value = year
return `${year}年${month}月${day}日 至${endYear}年${endMonth}月${endDay}日`
}
const showHistoricalReport = ref(false)
const openHistoricalReport = (val) => {
chageData.value = val
showHistoricalReport.value = true
}
// const
const getHistory = (val) => {
textContent.value = val
showHistoricalReport.value = false
showModel.value = true
}
const SaveReport = (val) => {
ElMessageBox.prompt('请输入名称', '提示', {
confirmButtonText: '确认',
cancelButtonText: '取消',
// inputPattern:/[\w!#$%&'*+/=?^_`{|}~-]+(?:\.[\w!#$%&'*+/=?^_`{|}~-]+)*@(?:[\w](?:[\w-]*[\w])?\.)+[\w](?:[\w-]*[\w])?/,
// inputErrorMessage: 'Invalid Email',
})
.then(({ value }) => {
const promes = {
bgmc:value,
bgnr: val,
ypid:chageData.value
}
qcckPost( promes , "/mosty-gsxt/gsxtYpbg/addEntity")
.then(() => {
ElMessage.success("保存成功");
})
})
.catch(() => {
ElMessage({
type: 'info',
message: '取消保存',
})
})
.catch(() => { });
// 打开规则弹窗
const regulation = ref(null)
const openAddRule = (type, row) => {
regulation.value.init(type, row)
}
</script>
<style lang="scss" scoped>
.content {
width: 100%;
height: 100%;
margin-top: 20px;
margin-left: 10px;
width: 100%;
height: 100%;
margin-top: 20px;
margin-left: 10px;
border-radius: 4px;
box-sizing: border-box;
.btnsBox {
background: #fff;
padding: 10px 5px;
border-radius: 4px;
margin-bottom: 10px;
}
.cntlsit {
display: flex;
flex-wrap: wrap;
align-content: start;
gap: 18px;
overflow: hidden;
overflow-y: auto;
background: #fff;
padding: 4px;
box-sizing: border-box;
.btnsBox {
background: #fff;
padding: 10px 5px;
.cntItem {
width: 300px;
border: 1px solid #ccc;
color: #787878;
border-radius: 4px;
margin-bottom: 10px;
}
.cntlsit {
display: flex;
flex-wrap: wrap;
align-content: start;
gap: 18px;
overflow: hidden;
overflow-y: auto;
background: #fff;
padding: 4px;
box-sizing: border-box;
.cntItem {
width: 300px;
border: 1px solid #ccc;
color: #787878;
border-radius: 4px;
overflow: hidden;
.foot {
text-align: right;
margin-top: 4px;
border-top: 1px solid #ccc;
padding: 4px;
box-sizing: border-box;
}
.foot {
text-align: right;
margin-top: 4px;
border-top: 1px solid #ccc;
padding: 4px;
box-sizing: border-box;
}
}
}
}
</style>

19
src/views/backOfficeSystem/JudgmentHome/tsypHome/index.vue
View File

@ -1,33 +1,18 @@
<template>
<div>
<YpHome v-if="showModel == '研判首页'" @change="changeModel"></YpHome>
<YjList v-if="showModel == '态势预警列表'" :item="itemYj" @change="changeModel"></YjList>
<YjDetail v-if="showModel == '预警详情'" :item="itemDetail" @change="changeModel"></YjDetail>
<!-- <YjList v-if="showModel == '态势预警列表'" :item="itemYj" @change="changeModel"></YjList>
<YjDetail v-if="showModel == '预警详情'" :item="itemDetail" @change="changeModel"></YjDetail> -->
</div>
</template>
<script setup>
import YpHome from "./components/ypHome.vue";
import YjList from "./components/yjList.vue";
import YjDetail from "./components/yjDetail.vue";
import { onMounted, ref } from "vue";
const showModel = ref('研判首页')
const itemYj = ref({})
const itemDetail = ref({})
onMounted(()=>{
// route.query.id ? lookDeatl(route.query.id): getLits();
})
function changeModel(val){
showModel.value = val.type ;
if(val.data){
if(val.type == '态势预警列表'){
itemYj.value = val.data
}else if(val.type == '预警详情'){
itemDetail.value = val.data
}
}
}
</script>

324
src/views/backOfficeSystem/fourColorManage/warningList/components/editAddForm.vue Normal file
View File

@ -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>

141
src/views/backOfficeSystem/fourColorManage/warningList/components/localWarning.vue Normal file
View File

@ -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
View 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>

1
src/views/home/dialog/components/home_yj.vue
View File

@ -8,7 +8,6 @@
</li>
<MOSTY.Empty :show="props.data.length <= 0" :imgSize="150"></MOSTY.Empty>
</ul>
<!-- :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
View 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>

13
src/views/home/dialog/leftDialog.vue
View File

@ -2,19 +2,23 @@
<div class="noScollLine">
<!-- 预警信息弹框 -->
<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>
</template>
<script setup>
import emitter from "@/utils/eventBus.js";
import Home_YJ from "./components/home_yj.vue";
import PopupWarning from './components/popupWarning'
import { ref, onMounted, onUnmounted, reactive, getCurrentInstance } from "vue";
const { proxy } = getCurrentInstance();
const isShow = ref({
showYj: false, //预警弹窗
showWarning: false
});
const list = reactive({
Info_YJ: [], //预警数据
Info_Warning: [],
});
onMounted(() => {
@ -23,11 +27,16 @@ onMounted(() => {
isShow.value.showYj = res ? true : false;
if (res) list.Info_YJ = res;
});
// 展示预警
emitter.on("showHomeWarning", (res) => {
isShow.value.showWarning = res ? true : false;
if (res) list.Info_Warning = res;
});
});
onUnmounted(() => {
emitter.off("showHomeYJ");
emitter.off("showHomeWarning");
});
</script>
<style lang="scss" scoped>
</style>
<style lang="scss" scoped></style>

5
src/views/home/layout/dialogDragger.vue
View File

@ -1,7 +1,7 @@
<template>
<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"
: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>
<div class="my-header">
<span class="imgIcon"> {{props.title}}</span>
@ -82,9 +82,8 @@ function closeDialog(params) {
padding: 8px 10px;
box-sizing: border-box;
pointer-events: auto !important;
height:calc(100% - 300px);
/* height:calc(100% - 300px); */
overflow: auto;
}
.zdy-model-dialog .el-dialog__header {
padding: 0 !important;

1
src/views/login/oatuh_login.vue
View File

@ -11,7 +11,6 @@ const loginDialog = ref(false);
const deptList = ref([]);
const store = useStore();
function redirectAuth() {
let token = location.hash.slice(20) || null;
if (token != null) {
token = token.replace(/\ +/g, "");