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

lcw

Browse Source
This commit is contained in:
lcw
2026-01-20 17:06:37 +08:00
parent 10853312f2
commit 96283c3a0e
35 changed files with 4306 additions and 419 deletions
Download Patch File Download Diff File Expand all files Collapse all files

167
src/views/backOfficeSystem/IntelligentControl/marksControl/components/addForm.vue
View File

@ -8,83 +8,61 @@
</div>
</div>
<div class="form_cnt">
<FormMessage
ref="elform"
:disabled="disabled"
v-model="listQuery"
:formList="formData"
labelWidth="100px"
<FormMessage ref="elform" :disabled="disabled" v-model="listQuery" :formList="formData" labelWidth="100px"
:rules="rules">
<template #yjgz>
<div class="zdy-taf"></div>
<template #bqdlList>
<div @click="openBqdl" class="depBox" style="cursor: pointer;">
<el-tag class="ml4 mr4" v-for="(it, idx) in listQuery.bqdlList" :key="idx" closable
@close="deleDlbq(idx)">{{ it.bqMc }}</el-tag>
<span class="coolor" v-if="!listQuery.bqdlList || listQuery.bqdlList.length == 0">请选择标签大类</span>
</div>
</template>
<template #tjqy>
<div class="ww100">
<div class="ww100 flex align-center">
<div class="zdy-taf"></div>
<el-button type="primary">选择</el-button>
</div>
<div class="map relative">
<GdMap></GdMap>
</div>
<template #bqxlList>
<div @click="openBqxl" class="depBox" style="cursor: pointer;">
<el-tag class="ml4 mr4" v-for="(it, idx) in listQuery.bqxlList" :key="idx" closable
@close="deleXlbq(idx)">{{ it.bqMc }}</el-tag>
<span class="coolor" v-if="!listQuery.bqxlList || listQuery.bqxlList.length == 0">请选择标签小类</span>
</div>
</template>
</FormMessage>
</div>
</div>
<ChooseMarks v-model="chooseMarksVisible" @choosed="choosed" :roleIds="roleIds" />
<BqLb v-model="chooseBqdl" @choosed="choosedDlbq" :roleIds="dlIds" />
<MinBq v-model="chooseBqxl" @choosed="choosedXlbq" :roleIds="xlIds" />
</template>
<script setup>
import GdMap from "@/components/GdMap/index.vue";
import * as rule from "@/utils/rules.js";
import * as MOSTY from "@/components/MyComponents/index";
import ChooseMarks from "@/components/ChooseList/ChooseMarks/index.vue";
import FormMessage from "@/components/aboutTable/FormMessage.vue";
import { qcckGet, qcckPost, qcckPut } from "@/api/qcckApi.js";
import { ref, defineExpose, reactive, onMounted, defineEmits, getCurrentInstance, watch } from "vue";
import BqLb from "./index.vue"
import MinBq from "./minBq.vue"
const emit = defineEmits(["updateDate"]);
const props = defineProps({
dic: Object
});
const { proxy } = getCurrentInstance();
const roleIds = ref([]);
const chooseMarksVisible = ref(false);
const { D_GS_BQ_LB } = proxy.$dict("D_GS_BQ_LB");
const dialogForm = ref(false); //弹窗
const rules = reactive({
ryXm: [{ required: true, message: "请输入姓名", trigger: "blur" }],
...rule.identityCardRule({ validator: true },'rySfzh'), //身份证校验
...rule.identityCardRule({ validator: true }, 'rySfzh'), //身份证校验
...rule.phoneRule({ validator: true }, "ryLxdh"), // 是否必填 是否进行校验,
});
const obj = {
bqlist:[
{ label: "布控标签", value: "01" },
{ label: "历史标签", value: "02" },
{ label: "数据源", value: "03" },
],
sjy:[
{ label: "网吧", value: "01" },
{ label: "卡口", value: "02" },
{ label: "市综平台", value: "03" },
]
}
const listQuery = ref({}); //表单
const listQuery = ref({
bqdlList: [],
bqxlList: [],
}); //表单
const formData = ref([
{ label: "任务名称", prop: "rwmc", type: "input" },
{ label: "布控人电话", prop: "bkysDh", type: "input" },
{ label: "人员等级", prop: "ryJb", type: "input" },
{ label: "人员类型", prop: "ryJl", type: "input" },
{ label: "处置措施", prop: "czcs", type: "input" },
{ label: "布控事由", prop: "bksy", type: "input" },
{ label: "报警方式", prop: "bjfs", type: "input" },
{ label: "报警接收人", prop: "bjjsr", type: "input" },
{ label: "任务布控时限", prop: "rwBkzs", type: "datetimerange" },
{ label: "布控标签", prop: "bkbq", type: "select",options: obj.bqlist ,multiple:true},
{ label: "数据源", prop: "sjy", type: "select",options: obj.sjy },
{ label: "数据源", prop: "sjy", type: "select",options: obj.sjy },
{ label: "预警规则", prop: "yjgz", type: "slot" ,width:'100%'}, //选择多个标签
{ label: "添加区域", prop: "tjqy", type: "slot" ,width:'100%'}, //选择多个标签
{ label: "标签大类", prop: "bqdlList", type: "slot", width: '100%' }, //选择多个标签
{ label: "标签小类", prop: "bqxlList", type: "slot", width: '100%' },
{ label: "执法依据", prop: "zfyj", type: "textarea", width: '100%' }
]);
const loading = ref(false);
const elform = ref();
const title = ref("");
@ -93,9 +71,6 @@ const disabled = ref(false);
// 初始化数据
const init = (type, row) => {
dialogForm.value = true;
title.value = type == "add" ? "新增" : type == "detail" ? "详情" : "编辑";
disabled.value = type == "detail" ? true : false;
if (row) getDataById(row.id);
};
// 根据id查询详情
const getDataById = (id) => {
@ -108,22 +83,59 @@ const getDataById = (id) => {
// 提交
const submit = () => {
elform.value.submit((data) => {
const a = listQuery.value.bqdlList.map(item => {
return { bqdl: item.id, bqdm: item.bqDm, bqmc: item.bqMc, bqsm: item.bqSm, bqys: item.bqYs }
})
const b = listQuery.value.bqxlList.map(item => {
return { bqdl: listQuery.value.dlid, bqdm: item.bqDm, bqmc: item.bqMc, bqsm: item.bqSm, bqys: item.bqYs }
})
const promes = [...a, ...b]
// data.fjdz = data.fjdz?.join(",");
// let url = title.value == "新增" ? "/mosty-gsxt/tbGsxtZdcl/add" : "/mosty-gsxt/tbGsxtZdcl/update";
// let params = { ...data };
// loading.value = true;
// qcckPost(params, url).then(() => {
// loading.value = false;
// proxy.$message({ type: "success", message: title.value + "成功" });
// emit("updateDate");
// close();
// }).catch(() => {
// loading.value = false;
// });
let url = title.value == "新增" ? "/mosty-gsxt/gsxt/bqbk/saveList" : "/mosty-gsxt/tbGsxtZdcl/update";
loading.value = true;
qcckPost({list:promes}, url).then(() => {
loading.value = false;
proxy.$message({ type: "success", message: title.value + "成功" });
emit("updateDate");
close();
}).catch(() => {
loading.value = false;
});
});
};
//打卡大类弹窗
const chooseBqdl = ref(false)
const dlIds = ref()
const openBqdl = () => {
chooseBqdl.value = true
}
const choosedDlbq = (val) => {
listQuery.value.bqdlList = val
dlIds.value = val.map(item => item.id)
}
const deleDlbq = (val) => {
listQuery.value.bqdlList.splice(val, 1);
dlIds.value = listQuery.value.bqdlList.map(item => item.id);
}
// 打卡小类弹窗
const chooseBqxl = ref(false)
const xlIds = ref()
const openBqxl = () => {
chooseBqxl.value = true
}
const choosedXlbq = (val) => {
listQuery.value.dlid = val.bqDlid
listQuery.value.bqxlList = val.list
xlIds.value = val.list.map(item => item.id)
}
const deleXlbq = (val) => {
listQuery.value.bqxlList.splice(val, 1);
xlIds.value = listQuery.value.bqxlList.map(item => item.id);
}
// 关闭
const close = () => {
listQuery.value = {};
@ -151,27 +163,17 @@ defineExpose({ init });
.depBox {
border: 1px solid #e9e9e9;
width: 305px;
padding: 0 0 0 4px;
border-radius: 4px;
width: 100%;
::v-deep .el-input__inner {
border: none;
.coolor {
color: #d3d3d3;
}
::v-deep .el-cascader .el-input.is-focus .el-input__inner {
border-color: transparent !important;
}
::v-deep .el-input__inner:focus {
box-shadow: none;
}
::v-deep .el-input.is-disabled .el-input__inner {
border-color: transparent !important;
}
}
.zdy-taf{
.zdy-taf {
width: 100%;
width: 100%;
min-height: 32px;
@ -180,7 +182,8 @@ defineExpose({ init });
padding: 0px 5px;
box-sizing: border-box;
}
.map{
.map {
height: 520px;
margin-top: 10px;
}

259
src/views/backOfficeSystem/IntelligentControl/marksControl/components/index.vue Normal file
View File

@ -0,0 +1,259 @@
<template>
<el-dialog
:title="titleValue"
width="1400px"
:model-value="modelValue"
append-to-body
@close="closed"
>
<div>
<el-form :model="listQuery" class="mosty-from-wrap" :inline="true">
<el-form-item label="标签名称">
<el-input
placeholder="请输入标签名称"
v-model="listQuery.bqMc"
clearable
></el-input>
</el-form-item>
<el-form-item>
<el-button type="success" @click="handleFilter">查询</el-button>
<el-button type="info" @click="reset"> 重置 </el-button>
</el-form-item>
</el-form>
<div
class="tabBox"
:class="props.Single ? 'tabBoxRadio' : ''"
:key="keyVal"
style="margin-top: 0px"
>
<el-table
ref="multipleUserRef"
@selection-change="handleSelectionChange"
:data="tableData"
v-loading="loading"
border
:row-key="keyid"
style="width: 100%"
height="450"
>
<el-table-column
type="selection"
width="55"
:reserve-selection="true"
/>
<el-table-column prop="bqMc" align="center" label="标签名称" />
<el-table-column prop="bqDm" align="center" label="标签代码" />
<el-table-column prop="bqDj" align="center" label="标签等级">
<template #default="{ row }">
<DictTag :tag="false" :value="row.bqDj" :options="D_GS_BQ_DJ" />
</template>
</el-table-column>
<el-table-column prop="bqYs" align="center" label="标签颜色">
<template #default="{ row }">
<DictTag :value="row.bqYs" :tag="false" :options="D_GS_SSYJ" />
</template>
</el-table-column>
</el-table>
</div>
<div class="fenye" :style="{ top: tableHeight + 'px' }">
<el-pagination
class="pagination"
@pageSize-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="listQuery.pageCurrent"
:page-sizes="[10, 20, 50, 100]"
:page-pageSize="listQuery.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
></el-pagination>
</div>
</div>
<template #footer>
<div class="dialog-footer">
<el-button @click="closed">取消</el-button>
<el-button type="primary" @click="onComfirm">确认</el-button>
</div>
</template>
</el-dialog>
</template>
<script setup>
import { qcckGet } from "@/api/qcckApi.js";
import { defineProps, ref, getCurrentInstance, watch } from "vue";
const { proxy } = getCurrentInstance();
const { D_GS_BQ_DJ, D_GS_SSYJ,D_GS_BQ_LB,D_GS_BQ_LX } = proxy.$dict("D_GS_BQ_DJ", "D_GS_SSYJ","D_GS_BQ_LB","D_GS_BQ_LX"); //获取字典数据
const props = defineProps({
modelValue: {
type: Boolean,
default: false
},
titleValue: {
type: String,
default: "身份标签"
},
LeaderType: {
type: String,
default: ""
},
//是否单选
Single: {
type: Boolean,
default: false
},
roleIds: {
type: Array,
default: []
}
});
const loading = ref(false);
const total = ref(0);
const listQuery = ref({
pageCurrent: 1,
pageSize: 20
});
const keyVal = ref(0);
const multipleUserRef = ref(null);
const multipleSelectionUser = ref([]);
const tableData = ref([]);
const emits = defineEmits(["update:modelValue", "choosed"]);
const keyid = (row) => {
return row.id;
};
const closed = () => {
emits("update:modelValue", false);
};
const reset = () => {
listQuery.value = { pageCurrent: 1, pageSize: 20 };
getListData();
};
// 为用户分配角色
const onComfirm = () => {
const userList = multipleSelectionUser.value;
let list = [];
let listId = [];
userList.forEach((val) => {
if (listId.indexOf(val.id) == -1) {
list.push(val);
listId.push(val.id);
}
});
emits("choosed", list);
closed();
};
/**
* pageSize 改变触发
*/
const handleSizeChange = (currentSize) => {
listQuery.value.pageSize = currentSize;
getListData();
};
/**
* 页码改变触发
*/
const handleCurrentChange = (currentPage) => {
listQuery.value.pageCurrent = currentPage;
getListData();
};
const bqLb=ref('01')
const getListData = () => {
keyVal.value++;
loading.value = true;
const params = { ...listQuery.value, bqLb:bqLb.value,bqLx: "01" };
qcckGet(params, "/mosty-gsxt/tbGsxtBqgl/selectPage")
.then((res) => {
loading.value = false;
tableData.value = res.records || [];
total.value = res.total;
// 直接调用，multipleUser 内部已处理延迟
multipleUser();
})
.catch(() => {
loading.value = false;
});
};
//列表回显 - 优化版，确保已选择数据正确回显
function multipleUser() {
// 确保表格引用和数据都存在
if (!multipleUserRef.value || !tableData.value || tableData.value.length === 0) {
return;
}
// 等待下一帧确保DOM更新完成
setTimeout(() => {
// 再次检查表格引用是否存在
if (!multipleUserRef.value) return;
// 先清除所有选中状态
multipleUserRef.value.clearSelection();
// 再根据roleIds重新设置选中状态
if (props.roleIds && Array.isArray(props.roleIds) && props.roleIds.length > 0) {
tableData.value.forEach((item) => {
// 使用严格比较，确保ID类型匹配
if (props.roleIds.some((id) => String(id) === String(item.id))) {
multipleUserRef.value.toggleRowSelection(item, true);
}
});
}
}, 0);
}
const handleFilter = () => {
listQuery.value.pageCurrent = 1;
getListData();
};
const handleSelectionChange = (val) => {
if (props.Single) {
if (val.length > 1) {
let del_row = val.shift();
multipleUserRef.value.toggleRowSelection(del_row, false);
}
multipleSelectionUser.value = val;
} else {
multipleSelectionUser.value = val;
}
};
// 监听弹窗打开状态，打开时重新加载数据
watch(
() => props.modelValue,
(val) => {
if (val) {
handleFilter();
}
},
{ immediate: true }
);
// 监听roleIds变化，确保数据回显正确
watch(
() => props.roleIds,
(newRoleIds) => {
// 使用setTimeout确保在表格数据加载完成后再进行选择
setTimeout(() => {
multipleUser();
}, 100);
},
{ deep: true }
);
</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;
}
</style>

235
src/views/backOfficeSystem/IntelligentControl/marksControl/components/minBq.vue Normal file
View File

@ -0,0 +1,235 @@
<template>
<el-dialog :title="titleValue" width="1400px" :model-value="modelValue" append-to-body @close="closed">
<div>
<el-form :model="listQuery" class="mosty-from-wrap" :inline="true">
<el-form-item label="标签大类">
<el-select v-model="listQuery.bqDlId" placeholder="请选择标签大类" clearable>
<el-option v-for="item in DlList" :key="item.id" :label="item.bqMc" :value="item.id" />
</el-select>
</el-form-item>
<el-form-item label="标签名称">
<el-input placeholder="请输入标签名称" v-model="listQuery.bqMc" clearable></el-input>
</el-form-item>
<el-form-item>
<el-button type="success" @click="handleFilter">查询</el-button>
<el-button type="info" @click="reset"> 重置 </el-button>
</el-form-item>
</el-form>
<div class="tabBox" :class="props.Single ? 'tabBoxRadio' : ''" :key="keyVal" style="margin-top: 0px">
<el-table ref="multipleUserRef" @selection-change="handleSelectionChange" :data="tableData" v-loading="loading"
border :row-key="keyid" style="width: 100%" height="450">
<el-table-column type="selection" width="55" :reserve-selection="true" />
<el-table-column prop="bqMc" align="center" label="标签名称" />
<el-table-column prop="bqDm" align="center" label="标签代码" />
<el-table-column prop="bqDj" align="center" label="标签等级">
<template #default="{ row }">
<DictTag :tag="false" :value="row.bqDj" :options="D_GS_BQ_DJ" />
</template>
</el-table-column>
<el-table-column prop="bqYs" align="center" label="标签颜色">
<template #default="{ row }">
<DictTag :value="row.bqYs" :tag="false" :options="D_GS_SSYJ" />
</template>
</el-table-column>
</el-table>
</div>
<div class="fenye" :style="{ top: tableHeight + 'px' }">
<el-pagination class="pagination" @pageSize-change="handleSizeChange" @current-change="handleCurrentChange"
:current-page="listQuery.pageCurrent" :page-sizes="[10, 20, 50, 100]" :page-pageSize="listQuery.pageSize"
layout="total, sizes, prev, pager, next, jumper" :total="total"></el-pagination>
</div>
</div>
<template #footer>
<div class="dialog-footer">
<el-button @click="closed">取消</el-button>
<el-button type="primary" @click="onComfirm">确认</el-button>
</div>
</template>
</el-dialog>
</template>
<script setup>
import { qcckGet } from "@/api/qcckApi.js";
import { defineProps, ref, getCurrentInstance, watch } from "vue";
const { proxy } = getCurrentInstance();
const { D_GS_BQ_DJ, D_GS_SSYJ, D_GS_BQ_LB, D_GS_BQ_LX } = proxy.$dict("D_GS_BQ_DJ", "D_GS_SSYJ", "D_GS_BQ_LB", "D_GS_BQ_LX"); //获取字典数据
const props = defineProps({
modelValue: {
type: Boolean,
default: false
},
titleValue: {
type: String,
default: "身份标签"
},
LeaderType: {
type: String,
default: ""
},
//是否单选
Single: {
type: Boolean,
default: false
},
roleIds: {
type: Array,
default: []
}
});
const loading = ref(false);
const total = ref(0);
const listQuery = ref({
pageCurrent: 1,
pageSize: 20
});
const keyVal = ref();
const multipleUserRef = ref(null);
const multipleSelectionUser = ref([]);
const tableData = ref([]);
const emits = defineEmits(["update:modelValue", "choosed"]);
const keyid = (row) => {
return row.id;
};
const closed = () => {
emits("update:modelValue", false);
};
const reset = () => {
listQuery.value = { pageCurrent: 1, pageSize: 20 };
getListData();
};
// 为用户分配角色
const onComfirm = () => {
const userList = multipleSelectionUser.value;
let list = [];
let listId = [];
userList.forEach((val) => {
if (listId.indexOf(val.id) == -1) {
list.push(val);
listId.push(val.id);
}
});
emits("choosed", { list, bqDlid: listQuery.value.bqDlId });
closed();
};
/**
* pageSize 改变触发
*/
const handleSizeChange = (currentSize) => {
listQuery.value.pageSize = currentSize;
getListData();
};
/**
* 页码改变触发
*/
const handleCurrentChange = (currentPage) => {
listQuery.value.pageCurrent = currentPage;
getListData();
};
const getListData = () => {
keyVal.value++;
loading.value = true;
const params = { ...listQuery.value, bqLb: '02', bqLx: "01" };
qcckGet(params, "/mosty-gsxt/tbGsxtBqgl/selectPage")
.then((res) => {
loading.value = false;
tableData.value = res.records || [];
total.value = res.total;
multipleUser();
})
.catch(() => {
loading.value = false;
});
};
const DlList = ref()
// 获取大类
const getDlBq = () => {
const params = { pageCurrent: 1, pageSize: 200, bqLb: '01', bqLx: "01" };
qcckGet(params, "/mosty-gsxt/tbGsxtBqgl/selectPage")
.then((res) => {
DlList.value = res.records || [];
listQuery.value.bqDlId = DlList.value[0].id
getListData()
})
}
//列表回显 - 优化版，确保已选择数据正确回显
function multipleUser() {
if (!multipleUserRef.value || !tableData.value || tableData.value.length === 0) {
return;
}
// 先清除所有选中状态
tableData.value.forEach((item) => {
multipleUserRef.value.toggleRowSelection(item, false);
});
// 再根据roleIds重新设置选中状态
if (props.roleIds && Array.isArray(props.roleIds) && props.roleIds.length > 0) {
tableData.value.forEach((item) => {
if (props.roleIds.some((id) => id == item.id)) {
multipleUserRef.value.toggleRowSelection(item, true);
}
});
}
}
const handleFilter = () => {
listQuery.value.pageCurrent = 1;
getListData();
};
const handleSelectionChange = (val) => {
if (props.Single) {
if (val.length > 1) {
let del_row = val.shift();
multipleUserRef.value.toggleRowSelection(del_row, false);
}
multipleSelectionUser.value = val;
} else {
multipleSelectionUser.value = val;
}
};
// 监听弹窗打开状态，打开时重新加载数据
watch(
() => props.modelValue,
(val) => {
if (val) {
getDlBq()
// handleFilter();
}
},
{ immediate: true }
);
// 监听roleIds变化，确保数据回显正确
watch(
() => props.roleIds,
(newRoleIds) => {
// 使用setTimeout确保在表格数据加载完成后再进行选择
setTimeout(() => {
multipleUser();
}, 100);
},
{ deep: true }
);
</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;
}
</style>

119
src/views/backOfficeSystem/IntelligentControl/marksControl/components/shym.vue Normal file
View File

@ -0,0 +1,119 @@
<template>
<div class="information-container">
<h2 class="page-title">研判详情</h2>
<div class="info-section">
<div class="info-row">
<div class="info-item">
<span class="label">标签名称：</span>
<span class="value">{{ detail.bqmc || '暂无' }}</span>
</div>
<div class="info-item">
<span class="label">标签代码：</span>
<span class="value">
<span class="value">{{ detail.bqdm || '暂无' }}</span>
</span>
</div>
</div>
<div class="info-row">
<div class="info-item">
<span class="label">标签颜色：</span>
<span class="value">
<DictTag v-if="detail.bqys && D_GS_SSYJ" :tag="false" :value="detail.bqys" :options="D_GS_SSYJ" />
<span v-else>暂无</span>
</span>
</div>
<div class="info-item">
<span class="label">标签描述：</span>
<span class="value">{{ detail.bqsm || '暂无' }}</span>
</div>
</div>
</div>
</div>
</template>
<script setup>
import DictTag from '@/components/DictTag/index.vue';
import { onMounted ,ref,getCurrentInstance} from 'vue';
import { useRoute } from 'vue-router'
import { qcckGet, qcckPost, qcckPut } from "@/api/qcckApi.js";
const route = useRoute();
const { proxy } = getCurrentInstance();
const {D_GS_SSYJ}=proxy.$dict("D_GS_SSYJ");
const detail=ref({});
// 新增：存储用户提供的研判部门详情数据
onMounted(() => {
qcckGet({},`/mosty-gsxt/gsxt/bqbk/selectById/${route.query.id}`).then(res => {
detail.value=res;
})
});
</script>
<style lang="scss" scoped>
.information-container {
width: 100%;
padding: 20px;
background-color: #fff;
border-radius: 8px;
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
}
.page-title {
color: #303133;
font-size: 18px;
font-weight: bold;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 1px solid #e8e8e8;
}
.info-section {
width: 100%;
}
.info-row {
display: flex;
flex-wrap: wrap;
margin-bottom: 15px;
}
.info-item {
flex: 1;
min-width: 300px;
margin-bottom: 10px;
display: flex;
align-items: flex-start;
}
.label {
font-weight: bold;
color: #606266;
margin-right: 12px;
width: 100px;
text-align: right;
line-height: 32px;
}
.value {
color: #303133;
flex: 1;
line-height: 32px;
word-break: break-word;
}
/* 新增：数据展示模块样式 */
.data-section {
margin-top: 30px;
padding-top: 20px;
border-top: 1px solid #e8e8e8;
}
.section-title {
color: #303133;
font-size: 16px;
font-weight: bold;
margin-bottom: 15px;
}
</style>

112
src/views/backOfficeSystem/IntelligentControl/marksControl/index.vue
View File

@ -2,7 +2,7 @@
<div>
<div class="titleBox">
<PageTitle title="标签布控" >
<el-button type="primary" size="small" @click="handleItem('add', '')">
<el-button type="primary" size="small" @click="AddFrom('add', '')">
<el-icon style="vertical-align: middle"><CirclePlus /></el-icon>
<span style="vertical-align: middle">新增</span>
</el-button>
@ -21,13 +21,14 @@
:key="pageData.keyCount"
:tableConfiger="pageData.tableConfiger"
:controlsWidth="pageData.controlsWidth"
@chooseData="chooseData"
>
<template #bqys="{ row }">
<DictTag :tag="false" :value="row.bqys" :options="D_GS_SSYJ" />
</template>
<!-- 操作 -->
<template #controls="{ row }">
<el-link type="primary" size="small" @click="handleItem('edit',row)">编辑</el-link>
<el-link type="primary" size="small" @click="handleItem('detail',row)">详情</el-link>
<el-link type="danger" size="small" @click="handleItem('deleite',row)">删除</el-link>
<el-link type="primary" size="small" @click="createProcess(row)" v-if="row.shzt!= '03'">发起审批</el-link>
<el-link type="danger" size="small" @click="handleItem('deleite',row)" v-if="row.shzt == '03'">撤控</el-link>
</template>
</MyTable>
<Pages
@ -43,6 +44,8 @@
<!-- 新增 -->
<AddForm ref="addForm" @updateDate="getList"></AddForm>
</div>
<SubmissionProcess v-model="showSp" :data="rowData" :userData="{ ajmc: '布控审批', flowType: 'BQBK', modelName: '布控' }"
:path="fixedValue" @getList="getList" />
</template>
<script setup>
@ -51,19 +54,26 @@ import MyTable from "@/components/aboutTable/MyTable.vue";
import Pages from "@/components/aboutTable/Pages.vue";
import Search from "@/components/aboutTable/Search.vue";
import AddForm from './components/addForm.vue'
import SubmissionProcess from '@/components/flowPath/submissionProcess.vue'
import { qcckGet, qcckPost } from "@/api/qcckApi.js";
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
const { proxy } = getCurrentInstance();
const { D_BZ_SF } = proxy.$dict("D_BZ_SF"); //获取字典数据
const {D_GS_SSYJ} = proxy.$dict("D_GS_SSYJ"); //获取字典数据
const searchBox = ref();
const addForm = ref()
const searchConfiger = ref([
{
label: "任务名称",
prop: "rwmc",
placeholder: "请输入任务名称",
label: "标签名称",
prop: "bqmc",
placeholder: "请输入标签名称",
showType: "input",
}, {
label: "时间",
prop: "startTime",
placeholder: "请输入时间",
showType: "datetimerange",
},
]);
const queryFrom = ref({});
const pageData = reactive({
@ -79,14 +89,13 @@ const pageData = reactive({
pageSize: 20,
pageCurrent: 1
}, //分页
controlsWidth: 120, //操作栏宽度
controlsWidth: 240, //操作栏宽度
tableColumn: [
{ label: "任务名称", prop: "rwmc" },
{ label: "布控人电话", prop: "bkysDh" },
{ label: "人员等级", prop: "bkysDj" },
{ label: "处置措施", prop: "czcs" },
{ label: "布控事由", prop: "bksy" },
{ label: "布控标签", prop: "bqmc" },
{ label: "标签代码", prop: "bqdm" },
{ label: "标签颜色", prop: "bqys", showSolt: true },
{ label: "标签描述", prop: "bqsm" },
]
});
onMounted(() => {
@ -96,7 +105,11 @@ onMounted(() => {
// 搜索
const onSearch = (val) => {
queryFrom.value = { ...val };
queryFrom.value = {
...val,
startTime: val.startTime ? val.startTime[0] : '',
endTime: val.startTime ? val.startTime[1] : ''
};
pageData.pageConfiger.pageCurrent = 1;
getList();
};
@ -112,28 +125,53 @@ const changeSize = (val) => {
// 获取列表
const getList = () => {
// pageData.tableConfiger.loading = true;
// let data = {
// ...pageData.pageConfiger,
// ...queryFrom.value,
// };
// qcckGet(data, "/mosty-gsxt/tbGsxtBk/selectPage").then((res) => {
// pageData.tableData = res.records || [];
// pageData.total = res.total;
// pageData.tableConfiger.loading = false;
// }).catch(() => {
// pageData.tableConfiger.loading = false;
// });
pageData.tableConfiger.loading = true;
let data = {
...pageData.pageConfiger,
...queryFrom.value,
};
qcckGet(data, "/mosty-gsxt/gsxt/bqbk/getPageList").then((res) => {
pageData.tableData = res.records || [];
pageData.total = res.total;
pageData.tableConfiger.loading = false;
}).catch(() => {
pageData.tableConfiger.loading = false;
});
};
const AddFrom = () => {
addForm.value.init()
}
const handleItem = (type,row) => {
if(type == 'delete'){
proxy.$confirm('确认撤控吗？', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
qcckPost({ ids: [row.id] }, "/mosty-gsxt/gsxt/bqbk/bqck").then((res) => {
proxy.$message({
message: '撤控成功',
type: 'success'
});
getList();
}else{
addForm.value.init(type,row);
}
}).catch(() => {
pageData.tableConfiger.loading = false;
});
})
};
// 固定值
const fixedValue = {
clueVerification: 'shym',
byMeansOf: 'gsxt/bqbk/callback ',
nobyMeansOf: 'gsxt/bqbk/callback ',
recycle: 'gsxt/bqbk/callback ',
}
const showSp = ref(false);
const rowData = ref()
const createProcess = (row) => {
showSp.value = true;
rowData.value = row
}
// 表格高度计算
const tabHeightFn = () => {
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 300;
@ -164,9 +202,9 @@ const tabHeightFn = () => {
background: none;
}
:deep(.el-table--fit) {
top: 52px !important;
}
// :deep(.el-table--fit) {
// top: 52px !important;
// }
.btns {
height: 52px;
padding: 10px;

117
src/views/backOfficeSystem/IntelligentControl/myControl/components/addBkdx.vue
View File

@ -14,7 +14,7 @@
label-position="left">
<div style="display: flex; align-items: center;margin-bottom: 10px;">
<el-radio-group v-model="listQuery.bkDx" size="large" fill="#6cf" @change="shangeDx">
<el-radio-button :label="item.dm" v-for="(item, index) in props.dic.D_GS_BK_DX" :key="index">{{
<el-radio-button :label="item.dm" v-for="(item, index) in props.dic.D_GS_BK_NEWDX" :key="index">{{
item.zdmc }}</el-radio-button>
</el-radio-group>
<el-button type="primary" @click="handleAddPeo" v-if="!disabled" style="margin-left: 10px;">
@ -53,20 +53,37 @@
</MyTable>
</div>
<div style="width: 100%;" class="mt25">
<el-form-item prop="bkSjKs" label="布控开始时间" label-width="120px">
<el-form-item prop="bkSjKs" label="布控开始时间">
<MOSTY.Date v-model="listQuery.bkSjKs" type="datetime" format="YYYY-MM-DD HH:mm:ss"
placeholder="请选择布控开始时间" clearable />
</el-form-item>
<el-form-item prop="bkSjJs" label="布控结束时间" label-width="120px">
<el-form-item prop="bkSjJs" label="布控结束时间">
<MOSTY.Date v-model="listQuery.bkSjJs" type="datetime" format="YYYY-MM-DD HH:mm:ss"
placeholder="请选择布控结束时间" clearable />
</el-form-item>
<el-form-item prop="czYq" label="处置要求" label-width="60px" style="width:18% ;">
<el-form-item prop="czYq" label="处置要求">
<MOSTY.Select v-model="listQuery.czYq" :dictEnum="props.dic.D_GS_BK_CZYQ" placeholder="请选择处置要求"
clearable />
</el-form-item>
<el-form-item prop="bkDj" label="布控等级" label-width="60px" style="width:18% ;">
<MOSTY.Select v-model="listQuery.bkDj" :dictEnum="props.dic.D_GS_BK_DJ" placeholder="请选择布控级别"
</div>
<div style="width: 100%;" class="mt10">
<el-form-item prop="bkDj" label="布控部门" v-if="props.name == 'myControl'">
<MOSTY.Select v-model="listQuery.bkDj" :dictEnum="props.dic.D_GS_SSYJ" placeholder="请选择布控级别"
clearable />
</el-form-item>
<el-form-item prop="bkDj" label="布控等级" v-else>
<MOSTY.Select v-model="listQuery.bkDj" :dictEnum="props.dic.D_BZ_JQDJ" placeholder="请选择布控级别"
clearable />
</el-form-item>
<el-form-item prop="bklylx" label="布控来源">
<MOSTY.Select v-model="listQuery.bklylx" :dictEnum="props.dic.D_BZ_BKLYS" placeholder="请选择布控来源"
clearable />
</el-form-item>
</div>
<div style="width: 100%;" class="mt10">
<el-form-item prop="zfyj" label="执法依据" style="width: 100%;">
<MOSTY.Other v-model="listQuery.zfyj" placeholder="请输入执法依据" type="textarea" style="width: 100%;"
clearable />
</el-form-item>
</div>
@ -88,7 +105,7 @@
<div class=" mapSearch flex">
<el-select v-model="hzfs" placeholder="请选择布控范围" clearable @change="qhhzfs">
<el-option label="区域选择" value="1"></el-option>
<el-option label="自定义范围" value="2"></el-option>
<!-- <el-option label="自定义范围" value="2"></el-option> -->
</el-select>
<el-select multiple style="margin-left: 10px;" v-model="bkqyList" placeholder="请选择布控范围" clearable
@change="hzfsChage" v-if="hzfs == '1'">
@ -97,17 +114,17 @@
}}</el-option>
</el-select>
<el-button type="primary" @click="drawQy" style="margin-left: 10px;" v-else>
<!-- <el-button type="primary" @click="drawQy" style="margin-left: 10px;" v-else>
<el-icon style="vertical-align: middle">
<CirclePlus />
</el-icon>
<span style="vertical-align: middle">自定义区域</span>
</el-button>
</el-button> -->
</div>
<div class="ww100 relative mb10"
<!-- <div class="ww100 relative mb10"
style="height: 60vh;border: 1px solid #dcdfe6;border-radius: 4px;overflow: hidden;">
<GdMap></GdMap>
</div>
</div> -->
</el-form>
</div>
</div>
@ -143,14 +160,14 @@ import { qcckGet, qcckPost } from "@/api/qcckApi.js";
import { tableColumnList, Zd } from '@/views/backOfficeSystem/ApprovalInformation/tableRow.js'
import emitter from "@/utils/eventBus.js";
import { ref, defineExpose, reactive, defineEmits, getCurrentInstance, nextTick, watch, onMounted } from "vue";
import { queryProcessNode, queryProcessNodeLog, queryProcess } from '@/api/spl'
import ApprovalEcho from "@/components/flowPath/ApprovalEcho.vue";
import { useRouter, useRoute } from 'vue-router'
import { setAddress } from '@/utils/tools.js'
import { tbGsxtBkId } from "@/api/commit.js";
const emit = defineEmits(["change"]);
const props = defineProps({
dic: Object
dic: Object,
name: String
});
const route = useRoute()
const elform = ref()
@ -222,7 +239,7 @@ const init = (type, row) => {
disabled.value = type == 'detail' ? true : false;
dialogForm.value = true;
if (row) tableDate.tableConfiger.haveControls = false;
Zd({ D_GS_BK_DJ: props.dic.D_GS_BK_DJ, BD_BK_CLYJBQ: props.dic.BD_BK_CLYJBQ })
Zd({ D_GS_SSYJ: props.dic.D_GS_SSYJ, BD_BK_CLYJBQ: props.dic.BD_BK_CLYJBQ })
get_bkqy_list(row)
};
@ -426,44 +443,44 @@ const close = () => {
// 选择身份证
const chooseVisible_SFZ = ref(false)
// 获取布控信息的工作流
const workflow = ref()
const getWorkflow = async (id) => {
const promes = {
processId: id
}
const proNode = await queryProcessNode(promes)
const proNodeLog = await queryProcessNodeLog(promes)
const process = await queryProcess(promes)
workflow.value = proNode.rows.map(item => {
const log = proNodeLog.rows.filter(items => item.nodeId == items.nodeId)
// const workflow = ref()
// const getWorkflow = async (id) => {
// const promes = {
// processId: id
// }
// const proNode = await queryProcessNode(promes)
// const proNodeLog = await queryProcessNodeLog(promes)
// const process = await queryProcess(promes)
// workflow.value = proNode.rows.map(item => {
// const log = proNodeLog.rows.filter(items => item.nodeId == items.nodeId)
if (item.eventType == '0') {
return {
...item,
log: {
userData: item.userData ? JSON.parse(item.userData) : JSON.parse(process.rows[0].processData).orgNameData,
userName: process.rows[0].userName,
xtLrsj: process.rows[0].xtLrsj,
processStatus: process.rows[0].processStatus,
}
}
} else {
return {
...item,
orgNameData: JSON.parse(log[0].userData),
log: log
}
}
})
// if (item.eventType == '0') {
// return {
// ...item,
// log: {
// userData: item.userData ? JSON.parse(item.userData) : JSON.parse(process.rows[0].processData).orgNameData,
// userName: process.rows[0].userName,
// xtLrsj: process.rows[0].xtLrsj,
// processStatus: process.rows[0].processStatus,
// }
// }
// } else {
// return {
// ...item,
// orgNameData: JSON.parse(log[0].userData),
// log: log
// }
// }
// })
};
const drawQy = () => {
emitter.emit("drawShape", {
flag: "select_point",
type: "polygon",
isclear: true
});
}
// };
// const drawQy = () => {
// emitter.emit("drawShape", {
// flag: "select_point",
// type: "polygon",
// isclear: true
// });
// }
const hzfs = ref('1')
const bkqyList = ref()
const qhhzfs = () => {

3
src/views/backOfficeSystem/IntelligentControl/myControl/components/dolog/sfzLog.vue
View File

@ -135,6 +135,9 @@ const rulesList = {
dh: [{ required: true, message: "请输入电话号码", trigger: "blur" }],
ssbmdm: [{ required: true, message: "请选择责任部门", trigger: "blur" }],
yjdj: [{ required: true, message: "请输入身份证号", trigger: "blur" }],
},
'10': {
fjZp: [{ required: true, message: "请传人员照片", trigger: "blur" }],
}
}
watch(() => props.bkDx, (val, oldval) => {

35
src/views/backOfficeSystem/IntelligentControl/myControl/index.vue
View File

@ -20,10 +20,11 @@
<DictTag :tag="false" :value="row.bkZt" :options="D_GS_BK_ZT" />
</template>
<template #bkDj="{ row }">
<DictTag :tag="false" :value="row.bkDj" :options="D_GS_BK_DJ" />
<DictTag :tag="false" :value="row.bkDj" :options="D_GS_SSYJ" v-if="route.name=='myControl'" />
<DictTag :tag="false" :value="row.bkDj" :options="D_BZ_JQDJ" v-else/>
</template>
<template #bkDx="{ row }">
<DictTag :tag="false" :value="row.bkDx" :options="D_GS_BK_DX" />
<DictTag :tag="false" :value="row.bkDx" :options="D_GS_BK_NEWDX" />
</template>
<template #bkdxList="{ row }">
<span v-if="row.bkdxList"><span class="nowrap" v-for="(it, idx) in row.bkdxList" :key="idx">
@ -67,9 +68,9 @@
</div>
</div>
<!-- 布控类型 -->
<AddBkdx ref="addBkdxForm" @change="getList" :dic="{
D_GS_BK_DX, D_GS_BK_BKYS, D_BZ_XB, D_GS_BK_CZYQ,
D_GS_BK_DJ, BD_BK_CLYJBQ, D_GS_BK_CZJSDWLX, D_GS_BK_TJFS, D_GS_ZDR_YJDJ
<AddBkdx ref="addBkdxForm" @change="getList" :name="route.name" :dic="{
D_GS_BK_NEWDX, D_GS_BK_BKYS, D_BZ_XB, D_GS_BK_CZYQ,D_BZ_JQDJ,D_BZ_BKLYS,
D_GS_SSYJ, BD_BK_CLYJBQ, D_GS_BK_CZJSDWLX, D_GS_BK_TJFS, D_GS_ZDR_YJDJ,
}" />
<!-- 预警弹窗 -->
<YjDialog ref="warningkdxForm"></YjDialog>
@ -89,11 +90,15 @@ import SubmissionProcess from '@/components/flowPath/submissionProcess.vue'
import {tbGsxtBkQuash} from '@/api/zdr.js'
import { useRouter, useRoute } from 'vue-router'
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
import { rotate } from "ol/transform";
const router = useRouter()
const route = useRoute()
const { proxy } = getCurrentInstance();
const { D_GS_BK_BKYS, D_BZ_XB, D_GS_BK_SJLX, D_GS_BK_DJ, BD_BK_CLYJBQ, D_GS_ZDR_YJDJ,
D_GS_BK_DX, D_GS_BK_ZT, D_GS_BK_CZYQ, D_GS_BK_CZJSDWLX, D_GS_BK_TJFS } = proxy.$dict("D_GS_ZDR_YJDJ", "D_GS_BK_BKYS", "D_BZ_XB", "D_GS_BK_SJLX", "D_GS_BK_DJ", "D_GS_BK_DX", "D_GS_BK_ZT", "D_GS_BK_CZYQ", "D_GS_BK_CZJSDWLX", "D_GS_BK_TJFS", 'BD_BK_CLYJBQ'); //获取字典数据
const { D_GS_BK_BKYS, D_BZ_XB, D_GS_BK_SJLX, D_GS_SSYJ, BD_BK_CLYJBQ, D_GS_ZDR_YJDJ,
D_GS_BK_NEWDX, D_GS_BK_ZT, D_GS_BK_CZYQ, D_GS_BK_CZJSDWLX, D_GS_BK_TJFS,D_BZ_BKLYS,
D_BZ_JQDJ } = proxy.$dict("D_GS_ZDR_YJDJ", "D_GS_BK_BKYS", "D_BZ_XB", "D_GS_BK_SJLX",
"D_GS_SSYJ", "D_GS_BK_NEWDX", "D_GS_BK_ZT", "D_GS_BK_CZYQ", "D_GS_BK_CZJSDWLX", "D_GS_BK_TJFS",
'BD_BK_CLYJBQ', 'D_BZ_JQDJ',"D_BZ_BKLYS"); //获取字典数据
const addBkdxForm = ref(null); //布控对象组件
const warningkdxForm = ref(); //布控对象组件
const searchBox = ref(); //搜索框
@ -103,14 +108,14 @@ const searchConfiger = ref([
prop: "bkDj",
placeholder: "请选择布控等级",
showType: "select",
options: D_GS_BK_DJ
options: route.name == 'myControl' ? D_GS_SSYJ : D_BZ_JQDJ
},
{
label: "布控类型",
prop: "bkDx",
placeholder: "请选择布控类型",
showType: "select",
options: D_GS_BK_DX
options: D_GS_BK_NEWDX
},
{
label: "布控状态",
@ -119,6 +124,12 @@ const searchConfiger = ref([
showType: "select",
options: D_GS_BK_ZT
},
{
label: "布控时间",
prop: "startTime",
placeholder: "请选择布控时间",
showType: "datetimerange",
},
]);
const queryFrom = ref({});
const pageData = reactive({
@ -166,7 +177,11 @@ onMounted(() => {
// 搜索
const onSearch = (val) => {
queryFrom.value = { ...val };
queryFrom.value = {
...val,
startTime: val.startTime? val.startTime[0]: '',
endTime: val.startTime? val.startTime[1]: ''
};
pageData.pageConfiger.pageCurrent = 1;
getList();
};

187
src/views/backOfficeSystem/IntelligentControl/ysMarksControl/components/addForm.vue Normal file
View File

@ -0,0 +1,187 @@
<template>
<div class="dialog" v-if="dialogForm">
<div class="head_box">
<span class="title">{{ title }}标签布控</span>
<div>
<el-button type="primary" size="small" v-if="!disabled" :loading="loading" @click="submit">保存</el-button>
<el-button size="small" @click="close">关闭</el-button>
</div>
</div>
<div class="form_cnt">
<FormMessage
ref="elform"
:disabled="disabled"
v-model="listQuery"
:formList="formData"
labelWidth="100px"
:rules="rules">
<template #yjgz>
<div class="zdy-taf"></div>
</template>
<template #tjqy>
<div class="ww100">
<div class="ww100 flex align-center">
<div class="zdy-taf"></div>
<el-button type="primary">选择</el-button>
</div>
<div class="map relative">
<GdMap></GdMap>
</div>
</div>
</template>
</FormMessage>
</div>
</div>
<ChooseMarks v-model="chooseMarksVisible" @choosed="choosed" :roleIds="roleIds" />
</template>
<script setup>
import GdMap from "@/components/GdMap/index.vue";
import * as rule from "@/utils/rules.js";
import * as MOSTY from "@/components/MyComponents/index";
import ChooseMarks from "@/components/ChooseList/ChooseMarks/index.vue";
import FormMessage from "@/components/aboutTable/FormMessage.vue";
import { qcckGet, qcckPost, qcckPut } from "@/api/qcckApi.js";
import { ref, defineExpose, reactive, onMounted, defineEmits, getCurrentInstance, watch } from "vue";
const emit = defineEmits(["updateDate"]);
const props = defineProps({
dic: Object
});
const { proxy } = getCurrentInstance();
const roleIds = ref([]);
const chooseMarksVisible = ref(false);
const dialogForm = ref(false); //弹窗
const rules = reactive({
ryXm: [{ required: true, message: "请输入姓名", trigger: "blur" }],
...rule.identityCardRule({ validator: true },'rySfzh'), //身份证校验
...rule.phoneRule({ validator: true }, "ryLxdh"), // 是否必填 是否进行校验,
});
const obj = {
bqlist:[
{ label: "布控标签", value: "01" },
{ label: "历史标签", value: "02" },
{ label: "数据源", value: "03" },
],
sjy:[
{ label: "网吧", value: "01" },
{ label: "卡口", value: "02" },
{ label: "市综平台", value: "03" },
]
}
const listQuery = ref({}); //表单
const formData = ref([
{ label: "任务名称", prop: "rwmc", type: "input" },
{ label: "布控人电话", prop: "bkysDh", type: "input" },
{ label: "人员等级", prop: "ryJb", type: "input" },
{ label: "人员类型", prop: "ryJl", type: "input" },
{ label: "处置措施", prop: "czcs", type: "input" },
{ label: "布控事由", prop: "bksy", type: "input" },
{ label: "报警方式", prop: "bjfs", type: "input" },
{ label: "报警接收人", prop: "bjjsr", type: "input" },
{ label: "任务布控时限", prop: "rwBkzs", type: "datetimerange" },
{ label: "布控标签", prop: "bkbq", type: "select",options: obj.bqlist ,multiple:true},
{ label: "数据源", prop: "sjy", type: "select",options: obj.sjy },
{ label: "数据源", prop: "sjy", type: "select",options: obj.sjy },
{ label: "预警规则", prop: "yjgz", type: "slot" ,width:'100%'}, //选择多个标签
{ label: "添加区域", prop: "tjqy", type: "slot" ,width:'100%'}, //选择多个标签
]);
const loading = ref(false);
const elform = ref();
const title = ref("");
const disabled = ref(false);
// 初始化数据
const init = (type, row) => {
dialogForm.value = true;
title.value = type == "add" ? "新增" : type == "detail" ? "详情" : "编辑";
disabled.value = type == "detail" ? true : false;
if (row) getDataById(row.id);
};
// 根据id查询详情
const getDataById = (id) => {
// qcckGet({id}, "/mosty-gsxt/tbGsxtZdcl/selectByid").then((res) => {
// listQuery.value = res;
// listQuery.value.fjdz = listQuery.value.fjdz?.split(",");
// });
};
// 提交
const submit = () => {
elform.value.submit((data) => {
// data.fjdz = data.fjdz?.join(",");
// let url = title.value == "新增" ? "/mosty-gsxt/tbGsxtZdcl/add" : "/mosty-gsxt/tbGsxtZdcl/update";
// let params = { ...data };
// loading.value = true;
// qcckPost(params, url).then(() => {
// loading.value = false;
// proxy.$message({ type: "success", message: title.value + "成功" });
// emit("updateDate");
// close();
// }).catch(() => {
// loading.value = false;
// });
});
};
// 关闭
const close = () => {
listQuery.value = {};
dialogForm.value = false;
loading.value = false;
};
defineExpose({ init });
</script>
<style lang="scss" scoped>
@import "~@/assets/css/layout.scss";
@import "~@/assets/css/element-plus.scss";
::v-deep .el-tabs--card>.el-tabs__header .el-tabs__item.is-active {
color: #0072ff;
background: rgba(0, 114, 255, 0.3);
}
.boxlist {
width: calc(99% - 50px);
margin-top: 10px;
overflow: hidden;
}
.depBox {
border: 1px solid #e9e9e9;
width: 305px;
padding: 0 0 0 4px;
border-radius: 4px;
::v-deep .el-input__inner {
border: none;
}
::v-deep .el-cascader .el-input.is-focus .el-input__inner {
border-color: transparent !important;
}
::v-deep .el-input__inner:focus {
box-shadow: none;
}
::v-deep .el-input.is-disabled .el-input__inner {
border-color: transparent !important;
}
}
.zdy-taf{
width: 100%;
width: 100%;
min-height: 32px;
border: 1px solid #e9e9e9;
border-radius: 4px;
padding: 0px 5px;
box-sizing: border-box;
}
.map{
height: 520px;
margin-top: 10px;
}
</style>

176
src/views/backOfficeSystem/IntelligentControl/ysMarksControl/index.vue Normal file
View File

@ -0,0 +1,176 @@
<template>
<div>
<div class="titleBox">
<PageTitle title="标签布控" >
<el-button type="primary" size="small" @click="handleItem('add', '')">
<el-icon style="vertical-align: middle"><CirclePlus /></el-icon>
<span style="vertical-align: middle">新增</span>
</el-button>
</PageTitle>
</div>
<!-- 搜索 -->
<div ref="searchBox">
<Search :searchArr="searchConfiger" @submit="onSearch"></Search>
</div>
<!-- 表格 -->
<div class="tabBox">
<MyTable
:tableData="pageData.tableData"
:tableColumn="pageData.tableColumn"
:tableHeight="pageData.tableHeight"
:key="pageData.keyCount"
:tableConfiger="pageData.tableConfiger"
:controlsWidth="pageData.controlsWidth"
@chooseData="chooseData"
>
<!-- 操作 -->
<template #controls="{ row }">
<el-link type="primary" size="small" @click="handleItem('edit',row)">编辑</el-link>
<el-link type="primary" size="small" @click="handleItem('detail',row)">详情</el-link>
<el-link type="danger" size="small" @click="handleItem('deleite',row)">删除</el-link>
</template>
</MyTable>
<Pages
@changeNo="changeNo"
@changeSize="changeSize"
:tableHeight="pageData.tableHeight + 42"
:pageConfiger="{
...pageData.pageConfiger,
total: pageData.total
}"
></Pages>
</div>
<!-- 新增 -->
<AddForm ref="addForm" @updateDate="getList"></AddForm>
</div>
</template>
<script setup>
import PageTitle from "@/components/aboutTable/PageTitle.vue";
import MyTable from "@/components/aboutTable/MyTable.vue";
import Pages from "@/components/aboutTable/Pages.vue";
import Search from "@/components/aboutTable/Search.vue";
import AddForm from './components/addForm.vue'
import { qcckGet, qcckPost } from "@/api/qcckApi.js";
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
const { proxy } = getCurrentInstance();
const { D_BZ_SF } = proxy.$dict("D_BZ_SF"); //获取字典数据
const searchBox = ref();
const addForm = ref()
const searchConfiger = ref([
{
label: "任务名称",
prop: "rwmc",
placeholder: "请输入任务名称",
showType: "input",
},
]);
const queryFrom = ref({});
const pageData = reactive({
tableData: [], //表格数据
keyCount: 0,
tableConfiger: {
rowHieght: 61,
showSelectType: "null",
loading: false
},
total: 0,
pageConfiger: {
pageSize: 20,
pageCurrent: 1
}, //分页
controlsWidth: 120, //操作栏宽度
tableColumn: [
{ label: "任务名称", prop: "rwmc" },
{ label: "布控人电话", prop: "bkysDh" },
{ label: "人员等级", prop: "bkysDj" },
{ label: "处置措施", prop: "czcs" },
{ label: "布控事由", prop: "bksy" },
]
});
onMounted(() => {
tabHeightFn();
getList()
});
// 搜索
const onSearch = (val) => {
queryFrom.value = { ...val };
pageData.pageConfiger.pageCurrent = 1;
getList();
};
const changeNo = (val) => {
pageData.pageConfiger.pageCurrent = val;
getList();
};
const changeSize = (val) => {
pageData.pageConfiger.pageSize = val;
getList();
};
// 获取列表
const getList = () => {
// pageData.tableConfiger.loading = true;
// let data = {
// ...pageData.pageConfiger,
// ...queryFrom.value,
// };
// qcckGet(data, "/mosty-gsxt/tbGsxtBk/selectPage").then((res) => {
// pageData.tableData = res.records || [];
// pageData.total = res.total;
// pageData.tableConfiger.loading = false;
// }).catch(() => {
// pageData.tableConfiger.loading = false;
// });
};
const handleItem = (type,row) => {
if(type == 'delete'){
}else{
addForm.value.init(type,row);
}
};
// 表格高度计算
const tabHeightFn = () => {
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 300;
window.onresize = function () {
tabHeightFn();
};
};
</script>
<style lang="scss" scoped>
.main-nav {
padding: 16px;
background-color: #fff;
}
.sub-nav {
background-color: #fff;
padding: 0 16px;
}
:deep(.el-tabs__header) {
margin-bottom: 0;
}
:deep(.el-tabs__nav-wrap::after) {
height: 1px;
background: none;
}
:deep(.el-table--fit) {
top: 52px !important;
}
.btns {
height: 52px;
padding: 10px;
box-sizing: border-box;
}
</style>

682
src/views/backOfficeSystem/IntelligentControl/ysMyControl/components/addBkdx.vue Normal file
View File

@ -0,0 +1,682 @@
<template>
<div class="dialog" v-if="dialogForm">
<div class="head_box">
<span class="title">布控对象</span>
<div>
<el-button size="small" type="primary" v-if="!disabled" :loading="loading" @click="submit">保存</el-button>
<el-button size="small" @click="close">关闭</el-button>
</div>
</div>
<div class="flex">
<div :class="dataOrge.gzlid ? 'ww80' : 'ww100'">
<div class="form_cnt">
<el-form :model="listQuery" :rules="rules" :disabled="disabled" ref="elform" inline :label-width="100"
label-position="left">
<div style="display: flex; align-items: center;margin-bottom: 10px;">
<el-radio-group v-model="listQuery.bkDx" size="large" fill="#6cf" @change="shangeDx">
<el-radio-button :label="item.dm" v-for="(item, index) in props.dic.D_GS_BK_DX" :key="index">{{
item.zdmc }}</el-radio-button>
</el-radio-group>
<el-button type="primary" @click="handleAddPeo" v-if="!disabled" style="margin-left: 10px;">
<el-icon style="vertical-align: middle">
<CirclePlus />
</el-icon>
<span style="vertical-align: middle">新增</span>
</el-button>
</div>
<div class="relative ww100">
<MyTable :tableData="listQuery.bkdxList" :tableColumn="tableDate.tableColumn"
:tableHeight="tableDate.tableHeight" :key="tableDate.keyCount" :tableConfiger="tableDate.tableConfiger"
:controlsWidth="tableDate.controlsWidth">
<template #fjZp="{ row }">
<el-image :src="setAddress(row.fjZp)"></el-image>
</template>
<template #yjdj="{ row }">
<DictTag :tag="false" :value="row.yjdj" :options="props.dic.D_GS_ZDR_YJDJ" />
</template>
<template #yjbq="{ row }">
<DictTag :tag="false" :value="row.yjbq" :options="props.dic.BD_BK_CLYJBQ" />
</template>
<template #ryXb="{ row }">
<DictTag :tag="false" :value="row.ryXb" :options="props.dic.D_BZ_XB" />
</template>
<template #bqList="{ row }">
<span v-if="row.bqList">
<span v-for="(it, idx) in row.bqList" :key="idx"> {{ it.bqMc }}、</span>
</span>
</template>
<!-- 操作 -->
<template #controls="{ row }">
<el-link type="primary">查看档案</el-link>
<el-link type="danger" @click="deleteRow(row)">删除</el-link>
</template>
</MyTable>
</div>
<div style="width: 100%;" class="mt25">
<el-form-item prop="bkSjKs" label="布控开始时间" label-width="120px">
<MOSTY.Date v-model="listQuery.bkSjKs" type="datetime" format="YYYY-MM-DD HH:mm:ss"
placeholder="请选择布控开始时间" clearable />
</el-form-item>
<el-form-item prop="bkSjJs" label="布控结束时间" label-width="120px">
<MOSTY.Date v-model="listQuery.bkSjJs" type="datetime" format="YYYY-MM-DD HH:mm:ss"
placeholder="请选择布控结束时间" clearable />
</el-form-item>
<el-form-item prop="czYq" label="处置要求" label-width="60px" style="width:18% ;">
<MOSTY.Select v-model="listQuery.czYq" :dictEnum="props.dic.D_GS_BK_CZYQ" placeholder="请选择处置要求"
clearable />
</el-form-item>
<el-form-item prop="bkDj" label="布控等级" label-width="60px" style="width:18% ;">
<MOSTY.Select v-model="listQuery.bkDj" :dictEnum="props.dic.D_GS_SSYJ" placeholder="请选择布控级别"
clearable />
</el-form-item>
</div>
<div style="width: 100%;" class="mt10">
<el-form-item prop="bkSy" label="布控事由" style="width: 100%;">
<MOSTY.Other v-model="listQuery.bkSy" placeholder="请输入布控事由" type="textarea" style="width: 100%;"
clearable />
</el-form-item>
</div>
<div style="width: 100%;" class="mt10">
<el-form-item prop="bkfj" label="上传附件" style="width: 100%;">
<div>
<MOSTY.Upload :showBtn="true" :limit="10" :isImg="false" :isAll="true" v-model="listQuery.bkfj" />
<div>支持png、jpg、pdf文件上传</div>
</div>
</el-form-item>
</div>
<div class="smallTitle">布控范围</div>
<div class=" mapSearch flex">
<el-select v-model="hzfs" placeholder="请选择布控范围" clearable @change="qhhzfs">
<el-option label="区域选择" value="1"></el-option>
<el-option label="自定义范围" value="2"></el-option>
</el-select>
<el-select multiple style="margin-left: 10px;" v-model="bkqyList" placeholder="请选择布控范围" clearable
@change="hzfsChage" v-if="hzfs == '1'">
<el-option :label="item.label" :value="item.value" v-for="(item, index) in bkqyArr" :key="index">{{
item.label
}}</el-option>
</el-select>
<el-button type="primary" @click="drawQy" style="margin-left: 10px;" v-else>
<el-icon style="vertical-align: middle">
<CirclePlus />
</el-icon>
<span style="vertical-align: middle">自定义区域</span>
</el-button>
</div>
<div class="ww100 relative mb10"
style="height: 60vh;border: 1px solid #dcdfe6;border-radius: 4px;overflow: hidden;">
<GdMap></GdMap>
</div>
</el-form>
</div>
</div>
<div class="ww20" v-if="dataOrge.gzlid">
<ApprovalEcho ref="approvalEcho" />
</div>
</div>
</div>
<!-- 选择布控人员 -->
<BkryDialod :modelValue="chooseVisible_RY" @update:modelValue="chooseVisible_RY = $event" @choosed="choosed"
@choosedAdd="choosedAdd" :roleIds="roleIds" />
<!-- 选择车辆布控 -->
<BkclDialod :modelValue="chooseVisible_CL" @update:modelValue="chooseVisible_CL = $event" @choosed="choosed"
@choosedAdd="choosedAdd" :roleIds="roleIds" />
<!-- 选择布控群体 -->
<BkqtDialod :modelValue="chooseVisible_QT" @update:modelValue="chooseVisible_QT = $event" @choosed="choosed"
:roleIds="roleIds" />
<BksfzDialod :modelValue="chooseVisible_SFZ" @update:modelValue="chooseVisible_SFZ = $event" @choosed="choosed"
:roleIds="roleIds" :bkDx="listQuery.bkDx" @choosedAdd="choosedAdd" />
</template>
<script setup>
import { getItem } from "@/utils/storage";
import BkryDialod from '@/components/ChooseList/ChooseZdr/index.vue';
import BkqtDialod from '@/components/ChooseList/ChooseQt/index.vue';
import BkclDialod from '@/components/ChooseList/ChooseCl/index.vue';
import BksfzDialod from './dolog/sfzLog.vue';
import GdMap from "@/components/GdMap/index.vue";
import * as MOSTY from "@/components/MyComponents/index";
import MyTable from "@/components/aboutTable/MyTable.vue";
import { qcckGet, qcckPost } from "@/api/qcckApi.js";
import { tableColumnList, Zd } from '@/views/backOfficeSystem/ApprovalInformation/tableRow.js'
import emitter from "@/utils/eventBus.js";
import { ref, defineExpose, reactive, defineEmits, getCurrentInstance, nextTick, watch, onMounted } from "vue";
import { queryProcessNode, queryProcessNodeLog, queryProcess } from '@/api/spl'
import ApprovalEcho from "@/components/flowPath/ApprovalEcho.vue";
import { useRouter, useRoute } from 'vue-router'
import { setAddress } from '@/utils/tools.js'
import { tbGsxtBkId } from "@/api/commit.js";
const emit = defineEmits(["change"]);
const props = defineProps({
dic: Object
});
const route = useRoute()
const elform = ref()
const roleIds = ref([]); //角色ID
const chooseVisible_RY = ref(false); //选择布控人员弹窗
const chooseVisible_QT = ref(false); //选择布控群体弹窗
const chooseVisible_CL = ref(false)
const bkqyArr = ref([]); //布控区域
const { proxy } = getCurrentInstance();
const dialogForm = ref(false); //弹窗
const loading = ref(false)
const addPerson = ref([]) //单独新增的数据
const listQuery = ref({
bkYz: '01',
bkdxList: [],
}); //表单数据
const rules = reactive({
bkBt: [{ required: true, message: "请输入布控标题", trigger: "blur" }],
bkDx: [{ required: true, message: "请选择布控对象", trigger: "change" }],
bkSjKs: [{ required: true, message: "请选择布控开始时间", trigger: "change" }],
bkSjJs: [{ required: true, message: "请选择布控结束时间", trigger: "change" }],
czJsdwdm: [{ required: true, message: "请选择处置接收单位", trigger: "change" }],
bkshrSsbmdm: [{ required: true, message: "请选择审核部门", trigger: "change" }],
bksprSsbmdm: [{ required: true, message: "请选择审批部门", trigger: "change" }],
})
let tableDate = reactive({
keyCount: 0,
tableConfiger: {
rowHieght: 61,
showSelectType: "null",
loading: false
},
total: 0,
pageConfiger: {
pageSize: 20,
pageCurrent: 1
}, //分页
controlsWidth: 200, //操作栏宽度
tableColumn: [
{ label: "照片", prop: "fjZp", showSolt: true },
{ label: "姓名", prop: "ryXm" },
{ label: "性别", prop: "ryXb", showSolt: true },
{ label: "身份证号", prop: "rySfzh" },
{ label: "户籍地", prop: "ryHjd" },
{ label: "现居住地址", prop: "ryXjd" },
{ label: "手机号", prop: "rySjhm" },
{ label: "虚拟身份", prop: "qtXnsf" },
{ label: "车牌号", prop: "clCph" },
{ label: "车辆识别代码", prop: "clCjh" },
{ label: "特征描述", prop: "qtTzms" },
{ label: "标签", prop: "bqList", showSolt: true, showOverflowTooltip: true }
]
});
const title = ref('')
const disabled = ref(false)
// 初始化数据
const init = (type, row) => {
listQuery.value.bkfj = [];
if (type == 'add') {
tableDate.tableConfiger.haveControls = true;
disabled.value = false;
listQuery.value.bkfqrXm = getItem("USERNAME");
listQuery.value.bkfqrSfzh = getItem("idEntityCard");
listQuery.value.bkfqrSsbmmc = getItem("deptId")[0].deptName;;
listQuery.value.bkfqrSsbmdm = getItem("deptId")[0].deptCode;;
}
title.value = type == 'add' ? '新增' : type == 'detail' ? '详情' : '编辑';
disabled.value = type == 'detail' ? true : false;
dialogForm.value = true;
if (row) tableDate.tableConfiger.haveControls = false;
Zd({ D_GS_SSYJ: props.dic.D_GS_SSYJ, BD_BK_CLYJBQ: props.dic.BD_BK_CLYJBQ })
get_bkqy_list(row)
};
// 获取布控区域
const get_bkqy_list = (row) => {
qcckGet({}, '/mosty-gsxt/tbGsxtBkQy/selectList').then(res => {
let arr = res || [];
bkqyArr.value = arr.map(item => {
return { ...item, label: item.qymc, value: item.id }
})
if (row) getDataById(row.id);
})
}
const dataOrge = ref({})
const approvalEcho = ref()
watch(() => approvalEcho.value, (val) => {
if (val) {
approvalEcho.value.getWorkflow(dataOrge.value.gzlid)
}
}, { deep: true })
watch(() => approvalEcho.value, (val) => {
if (val) {
console.log(approvalEcho.value);
approvalEcho.value.getWorkflow(dataOrge.value.gzlid)
}
}, { deep: true })
const shangeDx = () => {
tableDate.tableColumn = tableColumnList[listQuery.value.bkDx]
listQuery.value.bkDxxx = '';
listQuery.value.bkdxList = [];
roleIds.value = [];
addPerson.value = []
}
// 删除数据
const deleteRow = (row) => {
roleIds.value = roleIds.value.filter(id => id != row.id);
addPerson.value = addPerson.value.filter(it => it.id != row.id);
listQuery.value.bkdxList = listQuery.value.bkdxList.filter(it => it.id != row.id);
}
// 单独新增的数据
const choosedAdd = (item) => {
let obj = {}
if (listQuery.value.bkDx !== '02') {
obj = { id: item.id, fjZp: item.fjZp, ryXm: item.ryXm, ryXb: item.ryXb, rySfzh: item.rySfzh, ryHjd: item.hjdXz, ryXjd: item.xzdXz, rySjhm: item.ryLxdh, qtXnsf: item.qtXnsf, clCjh: item.clCjh, clCph: item.clCph, qtTzms: item.qtTzms, bqList: item.bqList }
} else {
obj = {
clCph: item.hphm, clCjh: item.clCjh, clSyr: item.clSyr, clSyrsfzh: item.clSyrsfzh,
clYs: item.clYs, gxSsbmmc: item.gxSsbmmc, bqList: item.bqList
}
}
switch (listQuery.value.bkDx) {
default:
obj = { ...item }
break;
}
addPerson.value.push(obj);//缓存的数据
if (!listQuery.value.bkdxList) listQuery.value.bkdxList = [];
listQuery.value.bkdxList.unshift(obj);
console.log(listQuery.value.bkdxList);
}
// 选择重点人
const choosed = (val) => {
tableDate.tableColumn = tableColumnList[listQuery.value.bkDx]
if (listQuery.value.bkDx == '01') {// 人员
roleIds.value = val.map(it => it.id);
let arr = val.map(item => {
let bqArr = item.bqList || [];
let bqs = bqArr.map(v => {
return { bqZl: v.bqZl, bqId: v.bqId, bqLx: v.bqLx, bqLb: v.bqLb, bqMc: v.bqMc, bqDm: v.bqDm }
})
return {
id: item.id, fjZp: item.fjZp, ryXm: item.ryXm, ryXb: item.ryXb,
rySfzh: item.rySfzh, ryHjd: item.hjdXz, ryXjd: item.xzdXz,
rySjhm: item.ryLxdh, qtXnsf: item.qtXnsf, clCjh: item.clCjh,
clCph: item.clCph, qtTzms: item.qtTzms, bqList: bqs, yjdj: item.zdrYjdj, ssbmdm: item.zrSsbmdm
}
})
listQuery.value.bkdxList = [...addPerson.value, ...arr];
} else if (listQuery.value.bkDx == '03') {
roleIds.value = val.map(it => it.id);
let arr = val.map(item => {
return {
clCph: item.hphm, clCjh: item.clCjh, clSyr: item.clSyr, clSyrsfzh: item.clSyrsfzh,
clYs: item.clYs, gxSsbmmc: item.gxSsbmmc, yjbq: item.yjbq, yjdj: item.yjdj, ssbmdm: item.zrSsbmdm
}
})
listQuery.value.bkdxList = [...addPerson.value, ...arr];
}
else {// 群体
listQuery.value.bkDxxx = (val.map(it => it.id)).join(',');
let peolist = []
val.forEach(item => {
if (item.zdryList) peolist = peolist.concat(item.zdryList)
})
let brrPeo = peolist.map(item => {
let bqArr = item.bqList || [];
let bqs = bqArr.map(v => {
return { bqZl: v.bqZl, bqId: v.bqId, bqLx: v.bqLx, bqLb: v.bqLb, bqMc: v.bqMc, bqDm: v.bqDm }
})
return {
id: item.id, fjZp: item.fjZp, ryXm: item.ryXm, ryXb: item.ryXb,
rySfzh: item.rySfzh, ryHjd: item.hjdXz, ryXjd: item.xzdXz,
rySjhm: item.ryLxdh, qtXnsf: item.qtXnsf, clCjh: item.clCjh,
clCph: item.clCph, qtTzms: item.qtTzms, bqList: bqs,
yjdj: item.zdrYjdj, ssbmdm: item.zrSsbmdm
}
})
listQuery.value.bkdxList = brrPeo;
}
};
// 选择人员
const handleAddPeo = () => {
if (!listQuery.value.bkDx) return proxy.$message({ type: "warning", message: '请选择布控对象' });
switch (listQuery.value.bkDx) {
case '01':
chooseVisible_RY.value = true
break;
case '04':
case '05':
case '06':
case '07':
case '08':
case '09':
case '10':
chooseVisible_SFZ.value = true
break;
case '03':
chooseVisible_CL.value = true
break;
case '02':
chooseVisible_QT.value = true
break;
}
}
// 提交
const submit = () => {
elform.value.validate((validate) => {
if (!validate) return;
let bklx = ''
if (route.name == 'myControl') {
bklx = '01'
} else {
bklx = '02'
}
let params = { ...listQuery.value, bklx: bklx };
params.bkfj = params.bkfj ? params.bkfj.join(',') : '';
params.bkdxList = params.bkdxList ? params.bkdxList : [];
params.bkdxList.forEach(item => {
if (Array.isArray(item.fjZp)) {
item.fjZp = item.fjZp ? item.fjZp.join(',') : ''
} else {
item.fjZp = item.fjZp
}
})
loading.value = true;
let url = title.value == '新增' ? "/mosty-gsxt/tbGsxtBk/save" : "/mosty-gsxt/tbGsxtBk/update";
qcckPost(params, url).then((res) => {
proxy.$message({ type: "success", message: "布控成功" });
emit("change");
loading.value = false;
close();
}).catch(() => {
loading.value = false;
});
});
};
onMounted(() => {
emitter.on("coordString", (res) => {
listQuery.value.bkqyList = [{
pgis: res.coord[0],
}]
});
});
// 关闭
const close = () => {
listQuery.value = {};
dialogForm.value = false;
loading.value = false;
addPerson.value = [];
roleIds.value = []
dataOrge.value = {}
};
// 选择身份证
const chooseVisible_SFZ = ref(false)
// 获取布控信息的工作流
const workflow = ref()
const getWorkflow = async (id) => {
const promes = {
processId: id
}
const proNode = await queryProcessNode(promes)
const proNodeLog = await queryProcessNodeLog(promes)
const process = await queryProcess(promes)
workflow.value = proNode.rows.map(item => {
const log = proNodeLog.rows.filter(items => item.nodeId == items.nodeId)
if (item.eventType == '0') {
return {
...item,
log: {
userData: item.userData ? JSON.parse(item.userData) : JSON.parse(process.rows[0].processData).orgNameData,
userName: process.rows[0].userName,
xtLrsj: process.rows[0].xtLrsj,
processStatus: process.rows[0].processStatus,
}
}
} else {
return {
...item,
orgNameData: JSON.parse(log[0].userData),
log: log
}
}
})
};
const drawQy = () => {
emitter.emit("drawShape", {
flag: "select_point",
type: "polygon",
isclear: true
});
}
const hzfs = ref('1')
const bkqyList = ref()
const qhhzfs = () => {
listQuery.value.bkqyList = []
bkqyList.value = []
emitter.emit('removeBj')
emitter.emit('removeEara', "select_point")
}
const hzfsChage = (val) => {
const qyList = []
console.log(val);
listQuery.value.bkqyList = val.map((item, index) => {
const data = bkqyArr.value.filter(items => items.id == item)[0]
console.log(data);
if (data) {
qyList.push(data.pgis)
}
console.log(item);
return {
bkQyid: data.id,
pgis: data.pgis
}
})
setTimeout(() => {
changeXzqh(qyList)
}, 2000)
}
const changeXzqh = (val) => {
// 先移除已有的边界
emitter.emit('removeBj')
// 如果传入的是多个区域数据（二维数组）
const features = val.map((area, index) => ({
geometry: {
type: "Polygon",
coordinates: [area] // 确保格式正确
},
properties: {
},
type: "Feature"
}))
// 循环为每个区域创建单独的多边形，这样可以设置不同的样式
features.forEach((feature, index) => {
emitter.emit('setBoundarys', {
data: {
type: "FeatureCollection",
features: [feature]
},
color: '#cf1010',
fillColor: 'rgba(255, 255, 255,0)',
})
})
}
// 根据id获取详情
const getDataById = (id) => {
qcckGet({}, '/mosty-gsxt/tbGsxtBk/selectVoById/' + id).then(res => {
res.bkfj = res.ossList || [];
listQuery.value = res || {}
dataOrge.value = res
if (res.bkqyList) {
bkqyList.value = res.bkqyList ? res.bkqyList.map(v => {
{
if (v.bkQyid) {
hzfs.value = '1'
} else {
hzfs.value = '2'
}
return v.bkQyid
}
}) : [];
const data = res.bkqyList.map(item => {
return item.pgis
})
setTimeout(() => {
console.log(data);
changeXzqh(data)
// listQuery.value.bkDxxx = data.join(',')
}, 2000);
}
tableDate.tableColumn = tableColumnList[res.bkDx ? res.bkDx : '01']
})
}
defineExpose({ init });
</script>
<style lang="scss" scoped>
@import "~@/assets/css/layout.scss";
@import "~@/assets/css/element-plus.scss";
.smallTitle {
width: 100%;
font-size: 15px;
line-height: 50px;
font-weight: 550;
color: #606266;
}
.mapSearch {
margin-bottom: 10px;
}
.dialog {
::v-deep .el-form-item--default {
margin: 0 1% 0 0 !important;
padding-bottom: 0 !important;
}
}
::v-deep .avatar-uploader {
display: flex;
}
::v-deep .el-upload--picture-card i {
width: 156px;
}
.depBox {
border: 1px solid #e9e9e9;
width: 305px;
padding: 0 0 0 4px;
border-radius: 4px;
::v-deep .el-input__inner {
border: none;
}
::v-deep .el-cascader .el-input.is-focus .el-input__inner {
border-color: transparent !important;
}
::v-deep .el-input__inner:focus {
box-shadow: none;
}
::v-deep .el-input.is-disabled .el-input__inner {
border-color: transparent !important;
}
}
/* 使用深度选择器覆盖子组件样式 */
::v-deep .el-step.is-vertical .el-step__title {
color: #000000 !important;
border-color: #000000 !important;
}
::v-deep .el-step__description {
padding: 0 !important;
}
::v-deep .el-step__description.is-wait {
color: #000000 !important;
border-color: #000000 !important;
}
.el-step__title.is-wait {
color: #000000 !important;
border-color: #000000 !important;
}
::v-deep .el-step__head.is-wait {
color: #000000 !important;
border-color: #000000 !important;
}
::v-deep .el-step__line {
background-color: #000000 !important;
}
.nodeBox {
width: 80%;
text-align: center;
line-height: 30px;
border-radius: 10px;
overflow: hidden;
background-color: aliceblue;
.nodeorgNameTg {
background-color: #1abe20;
}
.nameTag {
line-height: 30px;
padding: 0 10px;
}
.nodeorgNameDd {
background-color: #18a2dd;
}
.fontColor {
color: #1abe20;
}
.fontColorDd {
color: #18a2dd;
}
}
::v-deep .el-form-item__label {
padding: 0;
}
::v-deep .el-radio-button__inner {
color: #000 !important;
}
</style>

185
src/views/backOfficeSystem/IntelligentControl/ysMyControl/components/dolog/sfzLog.vue Normal file
View File

@ -0,0 +1,185 @@
<template>
<el-dialog :model-value="modelValue" :destroy-on-close="true" title="新增布控" @close="close" :close-on-click-modal="false">
<FormMessage v-model="listQuery" :formList="formData" labelWidth="120px" ref="elform" :rules="rules">
<template #bqList>
<div class="marks pointer" @click="chooseMarksVisible = true">
<span style="color: rgb(175 178 184);padding-left: 10px;"
v-if="!listQuery.bqList || listQuery.bqList.length == 0">请选择标签</span>
<span v-else>
<el-tag @close.stop="closeTag(idx)" type="success" closable v-for="(it, idx) in listQuery.bqList"
:key="idx">{{ it.bqMc }}</el-tag>
</span>
</div>
</template>
</FormMessage>
<template #footer>
<div class="flex just-center">
<el-button @click="close">取消</el-button>
<el-button type="primary" @click="submitForm">确认</el-button>
</div>
</template>
</el-dialog>
<ChooseMarks v-model="chooseMarksVisible" @choosed="choosed" :roleIds="roleIds" />
</template>
<script setup>
import ChooseMarks from "@/components/ChooseList/ChooseMarks/index.vue";
import FormMessage from "@/components/aboutTable/FormMessage.vue";
import { reactive, ref, getCurrentInstance, watch } from 'vue';
const props = defineProps({
modelValue: {
type: Boolean,
default: false
},
bkDx: {
type: String,
default: '01'
}
})
const emits = defineEmits(["update:modelValue", "choosed", "choosedAdd"]);
const { proxy } = getCurrentInstance();
const { D_BZ_XB, D_GS_ZDR_YJDJ } = proxy.$dict("D_BZ_XB", "D_GS_ZDR_YJDJ"); // 获取字典数据
const elform = ref()
const roleIds = ref([])
const chooseMarksVisible = ref(false)
const listQuery = ref({})
const formData = ref()
const rules = ref()
const tableColumnList = {
'04': [
{ label: "身份证号", prop: "rySfzh", type: "input" },
{ label: "姓名", prop: "ryXm", type: "input", },
{ label: "性别", prop: "ryXb", type: "select", options: D_BZ_XB },
{ label: "预警等级", prop: "yjdj", type: "select", options: D_GS_ZDR_YJDJ },
{ label: "责任部门", prop: "ssbmdm", type: "department" },
{ label: "标签", prop: "bqList", type: "slot", width: '100%' },
],
'05': [
{ label: "车辆识别代码", prop: "clCjh", type: "input" },
{ label: "车牌号", prop: "clCph", type: "input", },
{ label: "姓名", prop: "ryXm", type: "input", },
{ label: "责任部门", prop: "ssbmdm", type: "department" },
{ label: "预警等级", prop: "yjdj", type: "select", options: D_GS_ZDR_YJDJ },
{ label: "标签", prop: "bqList", type: "slot", width: '100%' },
],
'06': [
{ label: "Mac地址", prop: "mac", type: "input" },
{ label: "责任部门", prop: "ssbmdm", type: "department" },
{ label: "预警等级", prop: "yjdj", type: "select", options: D_GS_ZDR_YJDJ },
{ label: "标签", prop: "bqList", type: "slot", width: '100%' },
],
'07': [
{ label: "IMEI", prop: "imei", type: "input" },
{ label: "责任部门", prop: "ssbmdm", type: "department" },
{ label: "预警等级", prop: "yjdj", type: "select", options: D_GS_ZDR_YJDJ },
{ label: "标签", prop: "bqList", type: "slot", width: '100%' },
],
'08': [
{ label: "IMSI", prop: "imsi", type: "input" },
{ label: "责任部门", prop: "ssbmdm", type: "department" },
{ label: "预警等级", prop: "yjdj", type: "select", options: D_GS_ZDR_YJDJ },
{ label: "标签", prop: "bqList", type: "slot", width: '100%' },
],
'09': [
{ label: "电话", prop: "rySjhm", type: "input" },
{ label: "姓名", prop: "ryXm", type: "input", },
{ label: "责任部门", prop: "ssbmdm", type: "department" },
{ label: "预警等级", prop: "yjdj", type: "select", options: D_GS_ZDR_YJDJ },
{ label: "性别", prop: "ryXb", type: "select", options: D_BZ_XB },
{ label: "标签", prop: "bqList", type: "slot", width: '100%' },
],
'10': [{ label: "姓名", prop: "ryXm", type: "input", },
{ label: "身份证号", prop: "rySfzh", type: "input" },
{ label: "预警等级", prop: "yjdj", type: "select", options: D_GS_ZDR_YJDJ },
{ label: "性别", prop: "ryXb", type: "select", options: D_BZ_XB },
{ label: "标签", prop: "bqList", type: "slot", width: '100%' },
{ label: "责任部门", prop: "ssbmdm", type: "department" },
{ label: "人员照片", prop: "fjZp", type: "upload", width: '100%' },
],
}
const rulesList = {
'04': {
rySfzh: [{ required: true, message: "请输入身份证号", trigger: "blur" }],
yjdj: [{ required: true, message: "请输入身份证号", trigger: "blur" }],
ssbmdm: [{ required: true, message: "请选择责任部门", trigger: "blur" }],
},
'03': {
fjZp: [{ required: true, message: "请选择附件", trigger: "blur" }],
ssbmdm: [{ required: true, message: "请选择责任部门", trigger: "blur" }],
yjdj: [{ required: true, message: "请输入身份证号", trigger: "blur" }],
},
'05': {
clCjh: [{ required: true, message: "请输入车辆识别代码", trigger: "blur" }],
ssbmdm: [{ required: true, message: "请选择责任部门", trigger: "blur" }],
yjdj: [{ required: true, message: "请输入身份证号", trigger: "blur" }],
},
'06': {
mac: [{ required: true, message: "请输入Mac地址", trigger: "blur" }],
ssbmdm: [{ required: true, message: "请选择责任部门", trigger: "blur" }],
yjdj: [{ required: true, message: "请输入身份证号", trigger: "blur" }],
},
'07': {
imei: [{ required: true, message: "请输入IMEI", trigger: "blur" }],
ssbmdm: [{ required: true, message: "请选择责任部门", trigger: "blur" }],
yjdj: [{ required: true, message: "请输入身份证号", trigger: "blur" }],
},
'08': {
imsi: [{ required: true, message: "请输入IMSI", trigger: "blur" }],
ssbmdm: [{ required: true, message: "请选择责任部门", trigger: "blur" }],
yjdj: [{ required: true, message: "请输入身份证号", trigger: "blur" }],
},
'09': {
dh: [{ required: true, message: "请输入电话号码", trigger: "blur" }],
ssbmdm: [{ required: true, message: "请选择责任部门", trigger: "blur" }],
yjdj: [{ required: true, message: "请输入身份证号", trigger: "blur" }],
}
}
watch(() => props.bkDx, (val, oldval) => {
formData.value = tableColumnList[val]
rules.value = rulesList[val]
}, { immediate: true })
// 选择标签
const choosed = (val) => {
listQuery.value.bqList = val.map(v => {
return { bqZl: v.bqLb, bqId: v.id, bqLx: v.bqLx, bqLb: v.bqLb, bqMc: v.bqMc, bqDm: v.bqDm }
});
roleIds.value = val.map(v => v.id)
}
// 删除数据
const closeTag = (idx) => {
listQuery.value.bqList.splice(idx, 1)
roleIds.value.splice(idx, 1)
}
const submitForm = () => {
elform.value.submit((val) => {
val.id = new Date().getTime()
emits('choosedAdd', val)
close()
})
}
const close = async () => {
roleIds.value = []
listQuery.value = {}
listQuery.value.fjZp = []
await emits("update:modelValue", false);
}
</script>
<style lang="scss" scoped>
.marks {
width: 100%;
min-height: 32px;
border: 1px solid #e9e9e9;
border-radius: 4px;
}
</style>

120
src/views/backOfficeSystem/IntelligentControl/ysMyControl/components/yjDialog.vue Normal file
View File

@ -0,0 +1,120 @@
<template>
<div class="dialog" v-if="dialogForm">
<div class="head_box">
<span class="title">预警详情</span>
<div>
<el-button @click="close">关闭</el-button>
</div>
</div>
<div class="form_cnt">
<div class="left">
<div class="lh30">轨迹信息</div>
<div class="flex item mr15">
<img :src="person" alt="">
<div class="ml10">
<div>姓名：张三（51018319954544454）</div>
<div>预警次数：<span>6</span>次</div>
<div>预警来源：布控预警</div>
<div>预警标签：社区戒毒</div>
<div><span class="marks">轨迹上图</span></div>
</div>
</div>
<ul class="cntBox">
<li class="li-item" v-for="idx in 10" :key="idx">
<div class="mb10">预警时间：2024-05-21 10:10:05</div>
<div class="item flex info">
<img :src="person" alt="" style="width:99px;height: 92px;">
<div class="ml10">预警内容；预警内容:5月21日20.41.14人像抓拍数据测到 马志强(510502199506168718)出现在024000050迎库路大世界石梯人行道2L4-SPL</div>
</div>
</li>
</ul>
</div>
<div class="right">
<GdMap></GdMap>
</div>
</div>
</div>
</template>
<script setup>
import GdMap from "@/components/GdMap/index.vue";
import { ref, defineExpose,defineEmits } from "vue";
const emit = defineEmits(["change"]);
const props = defineProps({
dic: Object
});
const person = require('@/assets/images/person.png')
const dialogForm = ref(false); //弹窗
// 初始化数据
const init = (row) => {
dialogForm.value = true;
};
// 关闭
const close = () => {
dialogForm.value = false;
};
defineExpose({ init });
</script>
<style lang="scss" scoped>
@import "~@/assets/css/layout.scss";
@import "~@/assets/css/element-plus.scss";
.form_cnt{
display: flex;
.left{
width: 400px;
height: 100%;
margin-right: 10px;
.item{
background: rgb(248, 248, 248);
padding: 4px;
}
.info{
padding: 10px;
box-sizing: border-box;
margin-left: 10px;
}
.marks{
font-size: 12px;
display: inline-block;
padding: 2px 6px;
background: #0072ff;
border-radius: 4px;
color: #fff;
}
.cntBox{
margin-top: 6px;
height: calc(100% - 140px);
overflow: hidden;
overflow-y: auto;
.li-item{
border-left:1px solid #0072ff ;
padding-left:10px;
box-sizing: border-box;
position: relative;
margin-left: 10px;
margin-right: 10px;
&::before{
position: absolute;
content: '';
top: 0;
left: -5px;
width: 10px;
height: 10px;
background: #0072ff;
border-radius: 50%;
}
}
}
}
.right{
position: relative;
width: calc(100% - 410px);
height: 100%;
}
}
</style>

252
src/views/backOfficeSystem/IntelligentControl/ysMyControl/index.vue Normal file
View File

@ -0,0 +1,252 @@
<template>
<div>
<div class="titleBox">
<PageTitle :title=" route.meta.title ">
<el-button type="primary" @click="handleAdd('add', null)">发起布控</el-button>
</PageTitle>
</div>
<!-- 搜索 -->
<div ref="searchBox">
<Search :searchArr="searchConfiger" @submit="onSearch" />
</div>
<!-- 按钮组 -->
<div class="content">
<!-- 表格 -->
<div class="tabBox">
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
<template #bkZt="{ row }">
<DictTag :tag="false" :value="row.bkZt" :options="D_GS_BK_ZT" />
</template>
<template #bkDj="{ row }">
<DictTag :tag="false" :value="row.bkDj" :options="D_GS_SSYJ" />
</template>
<template #bkDx="{ row }">
<DictTag :tag="false" :value="row.bkDx" :options="D_GS_BK_DX" />
</template>
<template #bkdxList="{ row }">
<span v-if="row.bkdxList"><span class="nowrap" v-for="(it, idx) in row.bkdxList" :key="idx">
{{ it.ryXm ? it.ryXm : it.imei ? it.imei : it.imsi ? it.imsi : '' }}
<!-- :it.ryXm?it.mac:it.imsi?it.imsi:'xxxx' -->
<span v-if="idx < row.bkdxList.length - 1">、</span></span></span>
<span v-else>暂无</span>
</template>
<!-- <template #sjrs="{ row }">
<span v-if="row.bkdxList"> {{ row.bkdxList.length }} </span>
<span v-else>0</span>
</template> -->
<!-- <template #qyList="{ row }">
<span v-for="(it,idx) in row.qyList" :key="idx"> {{ it.qymc }} <span v-if="idx < row.qyList.length-1">、</span></span>
</template> -->
<!-- <template #yjcs="{row}">
<span @click="openWarning(row)" style="color: #00ffff;" class="mr5 pointer">{{ row.yjcs || 0}}</span>次
</template> -->
<!-- 操作 -->
<template #controls="{ row }">
<template v-if="!row.gzlid">
<el-link type="primary" v-if="['01', '03', '06'].includes(row.bkZt)" size="small"
@click="createProcess(row)">送审</el-link>
<el-link type="primary" size="small" @click="tbGsxtBkQuashList( row)" v-else>撤控</el-link>
<el-link type="primary" v-if="['01', '03', '06'].includes(row.bkZt)" size="small"
@click="handleAdd('edit', row)">编辑</el-link>
</template>
<!-- 审核通过后才有轨迹 -->
<el-link type="primary" size="small" @click="handleAdd('detail', row)">详情</el-link>
<el-link type="danger" size="small" @click="handleRow(row.id)"
v-if="['01', '03', '06'].includes(row.bkZt)">删除</el-link>
</template>
</MyTable>
<Pages @changeNo="changeNo" @changeSize="changeSize" :tableHeight="pageData.tableHeight" :pageConfiger="{
...pageData.pageConfiger,
total: pageData.total
}"></Pages>
</div>
</div>
</div>
<!-- 布控类型 -->
<AddBkdx ref="addBkdxForm" @change="getList" :dic="{
D_GS_BK_DX, D_GS_BK_BKYS, D_BZ_XB, D_GS_BK_CZYQ,
D_GS_SSYJ, BD_BK_CLYJBQ, D_GS_BK_CZJSDWLX, D_GS_BK_TJFS, D_GS_ZDR_YJDJ
}" />
<!-- 预警弹窗 -->
<YjDialog ref="warningkdxForm"></YjDialog>
<SubmissionProcess v-model="showSp" :data="rowData" :userData="{ ajmc: '布控审批', flowType: 'BKSP', modelName: '布控' }"
:path="fixedValue" @getList="getList" />
</template>
<script setup>
import AddBkdx from "./components/addBkdx.vue";
import YjDialog from "./components/yjDialog.vue";
import PageTitle from "@/components/aboutTable/PageTitle.vue";
import MyTable from "@/components/aboutTable/MyTable.vue";
import Pages from "@/components/aboutTable/Pages.vue";
import Search from "@/components/aboutTable/Search.vue";
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
import SubmissionProcess from '@/components/flowPath/submissionProcess.vue'
import {tbGsxtBkQuash} from '@/api/zdr.js'
import { useRouter, useRoute } from 'vue-router'
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
const router = useRouter()
const route = useRoute()
const { proxy } = getCurrentInstance();
const { D_GS_BK_BKYS, D_BZ_XB, D_GS_BK_SJLX, D_GS_SSYJ, BD_BK_CLYJBQ, D_GS_ZDR_YJDJ,
D_GS_BK_DX, D_GS_BK_ZT, D_GS_BK_CZYQ, D_GS_BK_CZJSDWLX, D_GS_BK_TJFS } = proxy.$dict("D_GS_ZDR_YJDJ", "D_GS_BK_BKYS", "D_BZ_XB", "D_GS_BK_SJLX", "D_GS_SSYJ", "D_GS_BK_DX", "D_GS_BK_ZT", "D_GS_BK_CZYQ", "D_GS_BK_CZJSDWLX", "D_GS_BK_TJFS", 'BD_BK_CLYJBQ'); //获取字典数据
const addBkdxForm = ref(null); //布控对象组件
const warningkdxForm = ref(); //布控对象组件
const searchBox = ref(); //搜索框
const searchConfiger = ref([
{
label: "布控等级",
prop: "bkDj",
placeholder: "请选择布控等级",
showType: "select",
options: D_GS_SSYJ
},
{
label: "布控类型",
prop: "bkDx",
placeholder: "请选择布控类型",
showType: "select",
options: D_GS_BK_DX
},
{
label: "布控状态",
prop: "bkZt",
placeholder: "请选择布控状态",
showType: "select",
options: D_GS_BK_ZT
},
{
label: "布控时间",
prop: "startTime",
placeholder: "请选择布控时间",
showType: "datetimerange",
},
]);
const queryFrom = ref({});
const pageData = reactive({
tableData: [], //表格数据
keyCount: 0,
tableConfiger: {
rowHieght: 61,
showSelectType: "null", //选择类型
loading: false
},
total: 0,
pageConfiger: {
pageSize: 20,
pageCurrent: 1
}, //分页
controlsWidth: 250, //操作栏宽度
tableColumn: [
{ label: "布控对象", prop: "bkdxList", showSolt: true, showOverflowTooltip: true },
{ label: "布控类型", prop: "bkDx", showSolt: true, showOverflowTooltip: true },
{ label: "布控等级", prop: "bkDj", showSolt: true },
{ label: "开始时间", prop: "bkSjKs", showOverflowTooltip: true },
{ label: "结束时间", prop: "bkSjJs", showOverflowTooltip: true },
{ label: "申请人", prop: "bkfqrXm" },
{ label: "布控状态", prop: "bkZt", showSolt: true },
]
});
// 固定值
const fixedValue = {
clueVerification: 'deploymentApproval',
byMeansOf: 'tbGsxtBk/gsbkCallback',
nobyMeansOf: 'tbGsxtBk/gsbkCallback',
recycle: 'tbGsxtBk/gsbkCallback',
}
const showSp = ref(false);
const rowData = ref()
const createProcess = (row) => {
showSp.value = true;
rowData.value = row
}
onMounted(() => {
getList();
tabHeightFn();
});
// 搜索
const onSearch = (val) => {
queryFrom.value = {
...val,
startTime: val.startTime? val.startTime[0]: '',
endTime: val.startTime? val.startTime[1]: ''
};
pageData.pageConfiger.pageCurrent = 1;
getList();
};
const changeNo = (val) => {
pageData.pageConfiger.pageCurrent = val;
getList();
};
const changeSize = (val) => {
pageData.pageConfiger.pageSize = val;
getList();
};
// 获取列表
const getList = () => {
pageData.tableConfiger.loading = true;
let bklx = ''
console.log();
if (route.name == 'myControl') {
bklx = '01'
} else {
bklx = '02'
}
let data = {
...pageData.pageConfiger,
...queryFrom.value,
bkcxlx: '01',
bklx: bklx
};
qcckGet(data, "/mosty-gsxt/tbGsxtBk/selectPage").then((res) => {
pageData.tableData = res.records || [];
pageData.total = res.total;
pageData.tableConfiger.loading = false;
}).catch(() => {
pageData.tableConfiger.loading = false;
});
};
const handleAdd = (type, row) => {
addBkdxForm.value.init(type, row);
};
// 删除
const handleRow = (id) => {
proxy.$confirm("确定要删除？", "警告", { type: "warning" }).then(() => {
qcckDelete({}, "/mosty-gsxt/tbGsxtBk/" + id).then(() => {
proxy.$message({ type: "success", message: "删除成功" });
getList();
});
})
};
// 表格高度计算
const tabHeightFn = () => {
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 270;
window.onresize = function () {
tabHeightFn();
};
};
const tbGsxtBkQuashList = (item) => {
tbGsxtBkQuash({id:item.id}).then(res=>{
proxy.$message({ type: "success", message: "操作成功" });
getList();
})
}
</script>
<style lang="scss" scoped>
.el-loading-mask {
background: rgba(0, 0, 0, 0.5) !important;
}
</style>