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

lcw

Browse Source
This commit is contained in:
lcw
2026-03-10 15:49:44 +08:00
parent e561ef9e6d
commit ab66f6d992
19 changed files with 4045 additions and 421 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
src/api/qcckApi.js
View File

@ -36,21 +36,19 @@ export const qcckFlvGet = (params = {}, url, cookie) => {
//get 请求
export const qcckGet = (params = {}, url, cookie) => {
if (cookie) {
return request({
withCredentials: true,
url: api + url,
method: "get",
params
});
} else {
return request({
url: api + url,
method: "get",
params
});
export const qcckGet = (params = {}, url, config = {}) => {
const options = {
url: api + url,
method: "get",
params,
...config
};
if (config.cookie) {
options.withCredentials = true;
}
return request(options);
};
//post 请求
export const qcckPost = (data = {}, url, cookie) => {

183
src/components/aboutTable/Search.vue
View File

@ -1,86 +1,97 @@
<template>
<div style="padding: 0" v-loading="loadingPage" class="pageSearch searchBox"
<div v-loading="loadingPage" class="pageSearch searchBox main-container"
:style="`margin-bottom: ${marginBottom}px;background-color: ${backgroundColor}`">
<div class="filter-title">
<span class="filter-label"><el-icon><Filter /></el-icon>筛选条件</span>
</div>
<div class="box">
<div v-for="(item, index) in getArr" :key="index" class="item">
<div class="label" v-if="item.label">{{ item.label }}</div>
<!-- select -->
<el-select v-if="item.showType === 'select'" v-model="searchObj[item.prop]" :multiple="item.multiple"
:clearable="item.clearable" :filterable="item.filterable" :placeholder="item.placeholder" collapse-tags
collapse-tags-tooltip>
<el-option v-for="obj in getOptions[item.prop]" :key="obj.value" :label="obj.label || obj.lable"
:value="obj.value" />
</el-select>
<!-- input -->
<el-input v-else-if="item.showType === 'input'" class="input" v-model="searchObj[item.prop]"
:clearable="item.clearable" :placeholder="item.placeholder" />
<!-- 日期段选择器 -->
<el-date-picker v-else-if="item.showType === 'daterange'" v-model="searchObj[item.prop]" type="daterange"
unlink-panels :range-separator="item.rangeSeparator" :start-placeholder="item.startPlaceholder"
:end-placeholder="item.endPlaceholder" :shortcuts="item.shortcuts" :disabledDate="disabledDate"
value-format="YYYY-MM-DD" />
<el-date-picker v-else-if="item.showType === 'datetimerange'" v-model="searchObj[item.prop]"
type="datetimerange" unlink-panels :range-separator="item.rangeSeparator || '至'"
:start-placeholder="item.startPlaceholder || '开始日期'" :end-placeholder="item.endPlaceholder || '结束日期'"
:shortcuts="item.shortcuts" value-format="YYYY-MM-DD HH:mm:ss" />
<el-date-picker v-else-if="item.showType === 'date'" v-model="searchObj[item.prop]" type="date"
:placeholder="item.placeholder" :disabled-date="disabledDate" :shortcuts="item.shortcuts"
value-format="YYYY-MM-DD">
</el-date-picker>
<el-date-picker v-else-if="item.showType === 'datetime'" v-model="searchObj[item.prop]" type="datetime"
:placeholder="item.placeholder" value-format="YYYY-MM-DD HH:mm:ss">
</el-date-picker>
<div class="filter-title">
<span class="filter-label"><el-icon>
<Filter />
</el-icon>筛选条件</span>
</div>
<div class="content-container">
<div class="box">
<div v-for="(item, index) in getArr" :key="index" class="item">
<div class="label" v-if="item.label">{{ item.label }}</div>
<!-- select -->
<el-select v-if="item.showType === 'select'" v-model="searchObj[item.prop]" :multiple="item.multiple"
:clearable="item.clearable" :filterable="item.filterable" :placeholder="item.placeholder" collapse-tags
collapse-tags-tooltip>
<el-option v-for="obj in getOptions[item.prop]" :key="obj.value" :label="obj.label || obj.lable"
:value="obj.value" />
</el-select>
<!-- input -->
<el-input v-else-if="item.showType === 'input'" class="input" v-model="searchObj[item.prop]"
:clearable="item.clearable" :placeholder="item.placeholder" />
<!-- input -->
<el-input v-else-if="item.showType === 'number'" class="input" v-model="searchObj[item.prop]"
:clearable="item.clearable" :placeholder="item.placeholder" type="number" />
<!-- 日期段选择器 -->
<el-date-picker v-else-if="item.showType === 'daterange'" v-model="searchObj[item.prop]" type="daterange"
unlink-panels :range-separator="item.rangeSeparator" :start-placeholder="item.startPlaceholder"
:end-placeholder="item.endPlaceholder" :shortcuts="item.shortcuts" :disabledDate="disabledDate"
value-format="YYYY-MM-DD" />
<el-date-picker v-else-if="item.showType === 'datetimerange'" v-model="searchObj[item.prop]"
type="datetimerange" unlink-panels :range-separator="item.rangeSeparator || '至'"
:start-placeholder="item.startPlaceholder || '开始日期'" :end-placeholder="item.endPlaceholder || '结束日期'"
:shortcuts="item.shortcuts" value-format="YYYY-MM-DD HH:mm:ss" />
<el-date-picker v-else-if="item.showType === 'date'" v-model="searchObj[item.prop]" type="date"
:placeholder="item.placeholder" :disabled-date="disabledDate" :shortcuts="item.shortcuts"
value-format="YYYY-MM-DD">
</el-date-picker>
<el-date-picker v-else-if="item.showType === 'datetime'" v-model="searchObj[item.prop]" type="datetime"
:placeholder="item.placeholder" value-format="YYYY-MM-DD HH:mm:ss">
</el-date-picker>
<!-- checkbox -->
<template v-else-if="item.showType === 'department'">
<MOSTY.Department clearable v-model="searchObj[item.prop]" />
</template>
<!-- checkbox -->
<template v-else-if="item.showType === 'checkbox'">
<el-checkbox v-if="item.showSelectAll" v-model="item.checkAll" :indeterminate="item.isIndeterminate" @change="
<!-- checkbox -->
<template v-else-if="item.showType === 'department'">
<MOSTY.Department clearable v-model="searchObj[item.prop]" />
</template>
<!-- checkbox -->
<template v-else-if="item.showType === 'checkbox'">
<el-checkbox v-if="item.showSelectAll" v-model="item.checkAll" :indeterminate="item.isIndeterminate"
@change="
(val) => {
handleCheckAllChange(val, item);
}
">全选</el-checkbox>
<el-checkbox-group v-model="searchObj[item.prop]" @change="
(val) => {
handleCheckedCitiesChange(val, item);
}
">
<el-checkbox v-for="obj in item.options" :key="obj.value" :label="obj.value">{{ obj.label }}</el-checkbox>
</el-checkbox-group>
</template>
<!-- radio -->
<el-radio-group v-else-if="item.showType === 'radio'" v-model="searchObj[item.prop]" @change="
(val) => {
handleCheckAllChange(val, item);
}
">全选</el-checkbox>
<el-checkbox-group v-model="searchObj[item.prop]" @change="
(val) => {
handleCheckedCitiesChange(val, item);
handleRadioChange(val, item);
}
">
<el-checkbox v-for="obj in item.options" :key="obj.value" :label="obj.value">{{ obj.label }}</el-checkbox>
</el-checkbox-group>
</template>
<!-- radio -->
<el-radio-group v-else-if="item.showType === 'radio'" v-model="searchObj[item.prop]" @change="
(val) => {
handleRadioChange(val, item);
}
">
<el-radio v-for="obj in item.options" :key="obj.value" :label="obj.value">{{ obj.label }}</el-radio>
</el-radio-group>
<!-- 级联选择 -->
<el-cascader v-else-if="item.showType === 'cascader'" v-model="searchObj[item.prop]" :props="item.props"
:show-all-levels="item.showAllLevels" :clearable="item.clearable" :options="getOptions[item.prop]"
:placeholder="item.placeholder" />
<div v-if="item.showType === 'Slot'">
<slot :name="item.prop"></slot>
<el-radio v-for="obj in item.options" :key="obj.value" :label="obj.value">{{ obj.label }}</el-radio>
</el-radio-group>
<!-- 级联选择 -->
<el-cascader v-else-if="item.showType === 'cascader'" v-model="searchObj[item.prop]" :props="item.props"
:show-all-levels="item.showAllLevels" :clearable="item.clearable" :options="getOptions[item.prop]"
:placeholder="item.placeholder" />
<div v-if="item.showType === 'Slot'">
<slot :name="item.prop"></slot>
</div>
<div v-if="item.showType === 'defaultSlot'">
<slot name="defaultSlot"></slot>
</div>
<div v-if="item.showType === 'nameSlot'">
<slot name="nameSlot"></slot>
</div>
</div>
<div v-if="item.showType === 'defaultSlot'">
<slot name="defaultSlot"></slot>
</div>
<div v-if="item.showType === 'nameSlot'">
<slot name="nameSlot"></slot>
</div>
<div class="button-container">
<div class="flex">
<el-button type="primary" @click="submit" size="small">确定</el-button>
<el-button type="" @click="reset" size="small">重置</el-button>
<slot> </slot>
</div>
</div>
<div class="flex">
<el-button type="primary" @click="submit">确定</el-button>
<el-button type="" @click="reset">重置</el-button>
<slot> </slot>
</div>
</div>
</div>
</template>
@ -476,17 +487,32 @@ watchEffect(() => {
<style lang="scss" scoped>
.pageSearch {
.main-container {
padding: 0;
}
.content-container {
display: flex;
padding: 0 15px;
}
.button-container {
display: flex;
flex-direction: column-reverse;
margin-bottom: 10px;
}
.filter-title {
display: flex;
align-items: center;
margin-bottom: 10px;
width: 100%;
background: linear-gradient(to right, #9ed7ff, #e6f0f8);
padding: 5px 15px;
background: linear-gradient(to right, #9ed7ff, #e6f0f8);
padding: 5px 15px;
.filter-label {
display: flex;
align-items: center;
display: flex;
align-items: center;
font-weight: bold;
color: #000;
margin-right: 10px;
@ -501,7 +527,8 @@ padding: 5px 15px;
}
.box {
padding: 0 15px;
flex: 1;
display: flex;
flex-wrap: wrap;

6
src/layout/index.vue
View File

@ -57,7 +57,7 @@ import TestDiv from "@/components/common/TestDiv.vue";
.hideSidebar .fixed-header {
width: calc(100% - #{$hideSideBarWidth});
}
::v-deep .el-scrollbar__view{
border-right: 1px solid #07376d;
}
// ::v-deep .el-scrollbar__view{
// border-right: 1px solid #07376d;
// }
</style>

324
src/views/backOfficeSystem/fourColorManage/tagManage copy/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>

178
src/views/backOfficeSystem/fourColorManage/tagManage copy/index.vue Normal file
View File

@ -0,0 +1,178 @@
<template>
<div>
<!-- 搜索 -->
<div ref="searchBox" class="mt10">
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount"></Search>
</div>
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
<template #left>
<!-- <el-button>
<span style="vertical-align: middle">调级</span>
</el-button>
<el-button>
<span style="vertical-align: middle">导出</span>
</el-button>
<el-button>
<span style="vertical-align: middle">导入</span>
</el-button> -->
<el-button size="small" type="primary" @click="addEdit('add', '')">
<el-icon style="vertical-align: middle">
<CirclePlus />
</el-icon>
<span style="vertical-align: middle">新增</span>
</el-button>
</template>
</PageTitle>
<!-- 表格 -->
<div class="tabBox">
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
<template #bqYs="{ row }">
<DictTag :value="row.bqYs" :tag="false" :options="D_GS_SSYJ" />
</template>
<template #bqDj="{ row }">
<DictTag :tag="false" :value="row.bqDj" :options="D_GS_BQ_DJ" />
</template>
<!-- 操作 -->
<template #controls="{ row }">
<el-link type="primary" @click="chooseJfFun(row)">配置系统</el-link>
<el-link type="primary" @click="addEdit('edit', row)">编辑</el-link>
<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>
<!-- 编辑详情 -->
<EditAddForm v-if="show" ref="detailDiloag" :dic="{ D_GS_BQ_LX, D_GS_BQ_DJ, D_GS_SSYJ, D_GS_BQ_LB }"
@updateDate="getList" />
<ChooseJf v-model="chooseJfShow" titleValue="选择系数" :Single="false"
:chooseJfBh="chooseJfBh" url="/tbGsxtBqzh/sjxspz" :roleIds="roleIds"/>
</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 EditAddForm from "./components/editAddForm.vue";
import ChooseJf from '@/components/ChooseList/ChooseJf/index.vue'
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
import { tbGsxtBqzhId } from "@/api/yj.js";
import { reactive, ref, onMounted, getCurrentInstance, nextTick } 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 detailDiloag = ref();
const show = ref(false)
const searchBox = ref(); //搜索框
const searchConfiger = ref(
[
{ label: "组合标签名称", prop: 'bqMc', placeholder: "请输入组合标签名称", showType: "input" },
// { label: "组合标签标签等级", prop: 'bqDj', placeholder: "请选择组合标签标签等级", showType: "select",options: D_GS_BQ_DJ },
{ label: "组合标签颜色", prop: 'bqYs', placeholder: "请选择组合标签标签颜色", showType: "select", options: D_GS_SSYJ },
]);
const queryFrom = ref({});
const pageData = reactive({
tableData: [], //表格数据
keyCount: 0,
tableConfiger: {
rowHieght: 61,
showSelectType: "null",
loading: false
},
total: 0,
pageConfiger: {
pageSize: 20,
pageCurrent: 1
}, //分页
controlsWidth: 160, //操作栏宽度
tableColumn: [
{ label: "组合标签名称", prop: "bqMc" },
{ label: "标签代码", prop: "bqDm" },
// { label: "组合标签等级", prop: "bqDj",showSolt:true },
{ label: "组合标签颜色", prop: "bqYs", showSolt: true },
{ label: "组合标签分值", prop: "bqFz" },
{ label: "组合标签说明", prop: "bqSm", showOverflowTooltip: true },
]
});
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;
qcckGet(queryFrom.value, '/mosty-gsxt/tbGsxtBqzh/selectPage').then((res) => {
pageData.tableData = res.records;
pageData.total = res.total;
pageData.tableConfiger.loading = false;
}).catch(() => {
pageData.tableConfiger.loading = false;
})
}
// 删除
const delDictItem = (id) => {
proxy.$confirm("确定要删除", "警告", { type: "warning" }).then(() => {
qcckDelete({}, '/mosty-gsxt/tbGsxtBqzh/' + id).then(() => {
proxy.$message({ type: "success", message: "删除成功" });
getList();
})
}).catch(() => { });
}
// 新增
const addEdit = (type, row) => {
show.value = true;
nextTick(() => {
detailDiloag.value.init(type, row,);
})
};
// 选择系数
const chooseJfShow = ref(false)
const chooseJfBh = ref()
const roleIds=ref()
const chooseJfFun = (val) => {
chooseJfBh.value=val.id
tbGsxtBqzhId(val.id).then(res => {
roleIds.value=res.sjxspzList.map(item => item.xsid)
chooseJfShow.value = true
})
}
// 表格高度计算
const tabHeightFn = () => {
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 270;
window.onresize = function () {
tabHeightFn();
};
};
</script>
<style>
.el-loading-mask {
background: rgba(0, 0, 0, 0.5) !important;
}
</style>

478
src/views/backOfficeSystem/fourColorManage/warningControl/controlWarning/components/particulars.vue Normal file
View File

@ -0,0 +1,478 @@
<!--预警指派展示组件 -->
<template>
<el-dialog :draggable="true" :model-value="modelValue" :title="title" :width="width" @close="close" append-to-body>
<div class="archive-container">
<div class="three-column-layout">
<!-- 重点人员基本信息页 -->
<div class="column">
<div class="column-header">重点人员基本信息</div>
<div class="info-section">
<div class="info-row">
<div class="info-item">
<span class="info-label">人员姓名：</span>
<span class="info-value">{{ dataForm.yjRyxm }}</span>
</div>
<div class="info-item">
<span class="info-label">性别：</span>
<span class="info-value">
<DictTag :value="dataForm.xbdm" :tag="false" :options="dict.D_BZ_XB" />
</span>
</div>
<div class="info-item">
<span class="info-label">年龄：</span>
<span class="info-value">{{ dataForm.nl }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">身份证号码：</span>
<span class="info-value">{{ dataForm.yjRysfzh }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">户籍地：</span>
<span class="info-value">{{ dataForm.hjdXz }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">现住地址：</span>
<span class="info-value">{{ dataForm.xzdXz }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">处置要求：</span>
<span class="info-value">
<DictTag :value="dataForm.bkczyq" :tag="false" :options="dict.D_GS_BK_CZYQ" />
</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">预警级别：</span>
<span class="info-value warning-level" :class="ys()">
<DictTag :value="dataForm.yjJb" :tag="false" :options="dict.D_BZ_YJJB" />
</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">布控起始时间：</span>
<span class="info-value">{{ dataForm.bkkssj }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">布控结束时间：</span>
<span class="info-value">{{ dataForm.bkjssj }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">所属单位：</span>
<span class="info-value">{{ dataForm.ssbm }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">布控单位：</span>
<span class="info-value">{{ dataForm.gkbmmc }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">布控原因：</span>
<span class="info-value text-area"></span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">一标三实：</span>
<span class="info-value text-area"></span>
</div>
</div>
</div>
</div>
<!-- 重点人员活动信息页 -->
<div class="column">
<div class="column-header">重点人员活动信息</div>
<div class="info-section blue-bg">
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">轨迹类别：</span>
<span class="info-value">
<DictTag :value="dataForm.yjLylx" :tag="false" :options="dict.D_GS_ZDR_GJLB" />
</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">核查时间：</span>
<span v-if="dataForm.fkList && dataForm.fkList.length > 0">{{ dataForm.fkList[0].czsj }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">比对时间：</span>
<span class="info-value">{{ dataForm.yjSj }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">预警内容：</span>
<span class="info-value text-area">{{ dataForm.yjNr }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">预警信息提供单位：</span>
<span class="info-value">{{ dataForm.jczmc }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">预警信息接收单位：</span>
<span class="info-value">{{ dataForm.ssbm }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">二次指派单位：</span>
<span class="info-value">
<div v-if="dataForm.zpList && dataForm.zpList.length > 0">
<span v-for="(item, index) in dataForm.zpList" :key="item.id">
{{ item.zpbm }}<span v-if="index < dataForm.zpList.length - 1">,</span>
</span>
</div>
</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">签收时限：</span>
<span class="info-value">{{ dataForm.qssj }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">反馈时限：</span>
<span class="info-value">{{ dataForm.fksj }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">处置建议：</span>
<span class="info-value text-area">
<div v-if="dataForm.czjyList && dataForm.czjyList.length > 0">
<div v-for="(item, index) in dataForm.czjyList" :key="item.id">
<span>{{ `${index + 1}、` + item.jynr }}</span>
</div>
</div>
</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">反馈内容：</span>
<span class="info-value text-area">
<div v-if="dataForm.fkList && dataForm.fkList.length > 0">
<div v-for="(item, index) in dataForm.fkList" :key="item.id">
<span v-if="item.ckczbcxx">{{ `${index + 1}、` + item.ckczbcxx }}</span>
</div>
</div>
</span>
</div>
</div>
</div>
</div>
<!-- 历史预警信息页 -->
<div class="column">
<div class="column-header">历史预警信息</div>
<div class="info-section">
<div class="history-item" v-for="(item, index) in dataForm.yjgjList" :key="item.id">
<span class="history-index">{{ `${index + 1}：` }}</span>
<span class="history-content">{{ item.yjNr }}</span>
</div>
</div>
</div>
</div>
</div>
<template #footer>
<div class="dialog-footer" style="text-align: center;">
<el-button @click="close">关闭</el-button>
</div>
</template>
</el-dialog>
</template>
<script setup>
import { defineProps, getCurrentInstance, watch, ref } from 'vue';
import { qcckGet } from '@/api/qcckApi.js'
const { proxy } = getCurrentInstance();
const props = defineProps({
modelValue: {
type: Boolean,
default: false
},
title: {
type: String,
default: '预警详情'
},
width: {
type: String,
default: '90%'
}, dataList: {
type: Object,
default: () => ({})
},
dict: {
type: Object,
default: () => ({})
}
});
// 定义事件
const emit = defineEmits(['update:modelValue']);
const loading = ref(false)
let abortController = null
const close = () => {
if (abortController) {
abortController.abort()
abortController = null
}
loading.value = false
emit('update:modelValue', false);
};
const dataForm = ref({});
watch(() => props.modelValue, (newVal) => {
if (newVal) {
getPart(props.dataList.id)
}
}, { deep: true });
const getPart = (id) => {
if (abortController) {
abortController.abort()
}
abortController = new AbortController()
loading.value = true
qcckGet({}, `/mosty-gsxt/tbYjxx/getInfo/${id}`, { signal: abortController.signal }).then(res => {
if (res) {
dataForm.value = res
} else {
dataForm.value = {}
}
}).catch(err => {
if (err.name !== 'AbortError') {
console.error('请求失败:', err)
}
}).finally(() => {
loading.value = false
})
}
const ys = () => {
switch (dataForm.value.yjJb) {
case '01':
return 'red';
case '02':
return 'orange';
case '03':
return 'yellow';
case '04':
return 'blue';
default:
return '';
}
}
</script>
<style scoped>
.archive-container {
padding: 0;
max-height: 500px;
overflow-y: auto;
}
.three-column-layout {
display: flex;
height: 100%;
}
.column {
flex: 1;
display: flex;
flex-direction: column;
min-width: 300px;
border: 1px solid #dcdfe6;
}
.column:not(:last-child) {
border-right: 1px solid #dcdfe6;
}
.column-header {
font-size: 16px;
font-weight: bold;
padding: 10px;
background: #f5f7fa;
color: #303133;
text-align: center;
border-bottom: 1px solid #dcdfe6;
}
.column .info-section {
flex: 1;
overflow-y: auto;
padding: 15px;
}
.info-section {
background: #ffffff;
}
.info-section.blue-bg {
background: #e6f7ff;
border: none;
}
.info-row {
display: flex;
flex-wrap: wrap;
margin-bottom: 12px;
}
.info-item {
flex: 1;
min-width: 300px;
display: flex;
align-items: center;
margin-bottom: 10px;
}
.info-item.full-width {
flex: 100%;
min-width: 100%;
}
.info-label {
font-weight: 600;
margin-right: 10px;
white-space: nowrap;
color: #303133;
font-size: 14px;
width: 100px;
flex-shrink: 0;
}
.info-value {
flex: 1;
padding: 4px 8px;
border: 1px solid #dcdfe6;
background: #ffffff;
min-height: 28px;
display: flex;
align-items: center;
font-size: 14px;
color: #606266;
}
.info-value.text-area {
min-height: 80px;
align-items: flex-start;
padding: 8px;
resize: vertical;
line-height: 1.5;
}
.info-value.warning-level {
background: #fffbe6;
border-color: #ffe58f;
color: #d48806;
font-weight: 600;
padding: 2px 6px;
font-size: 12px;
width: fit-content;
}
.info-value.warning-level.red {
background: #fef0f0;
border-color: #ffccc7;
color: #f56c6c;
}
.info-value.warning-level.orange {
background: #fffbe6;
border-color: #ffe58f;
color: #d48806;
}
.info-value.warning-level.yellow {
background: #fdf6ec;
border-color: #faecd8;
color: #e6a23c;
}
.info-value.warning-level.blue {
background: #ecf5ff;
border-color: #d9ecff;
color: #409eff;
}
.history-item {
margin-bottom: 8px;
padding: 6px 10px;
border: none;
background: #ffffff;
display: flex;
}
.history-index {
font-weight: bold;
margin-right: 8px;
color: #303133;
font-size: 14px;
min-width: 40px;
}
.history-content {
flex: 1;
color: #606266;
font-size: 14px;
line-height: 1.4;
}
/* 滚动条样式 */
.archive-container::-webkit-scrollbar,
.info-section::-webkit-scrollbar {
width: 8px;
height: 8px;
}
.archive-container::-webkit-scrollbar-track,
.info-section::-webkit-scrollbar-track {
background: #f1f1f1;
}
.archive-container::-webkit-scrollbar-thumb,
.info-section::-webkit-scrollbar-thumb {
background: #c1c1c1;
}
.archive-container::-webkit-scrollbar-thumb:hover,
.info-section::-webkit-scrollbar-thumb:hover {
background: #a8a8a8;
}
/* 按钮样式 */
.dialog-footer {
padding: 15px;
background: #f9f9f9;
border-top: 1px solid #e4e7ed;
text-align: center;
}
</style>

151
src/views/backOfficeSystem/fourColorManage/warningControl/controlWarning/index.vue
View File

@ -12,24 +12,17 @@
</template>
</Searchs>
</div>
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
<template #left>
<el-button type="primary" @click="exportExl" size="small">导出</el-button>
<el-button type="primary" size="small" @click="handleQs">签收</el-button>
</template>
</PageTitle>
</PageTitle>
<!-- 表格 -->
<div class="tabBox tabBox_zdy" :style="{ height: (pageData.tableHeight + 40) + 'px' }">
<MyTable
:tableData="pageData.tableData"
:tableColumn="pageData.tableColumn"
:tableHeight="pageData.tableHeight"
:key="pageData.keyCount"
:tableConfiger="pageData.tableConfiger"
:controlsWidth="pageData.controlsWidth"
expand
@chooseData="handleChooseData"
>
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth" expand
@chooseData="handleChooseData">
<template #expand="{ props }">
<Items :row="props || {}" :dict="dict" />
</template>
@ -55,18 +48,18 @@
<DictTag :value="row.czzt" :options="D_GSXT_YJXX_CZZT" />
</template>
<template #sex="{ row }">
<span v-if="row.yjRysfzh"> {{ IdCard(row.yjRysfzh,2) }} </span>
<span v-if="row.yjRysfzh"> {{ IdCard(row.yjRysfzh, 2) }} </span>
</template>
<template #age="{ row }">
<span v-if="row.yjRysfzh"> {{ IdCard(row.yjRysfzh,3) }} </span>
<span v-if="row.yjRysfzh"> {{ IdCard(row.yjRysfzh, 3) }} </span>
</template>
<template #yjLylx="{ row }">
<DictTag :value="row.yjLylx" :tag="false" :options="D_BZ_YJLY" />
<DictTag :value="row.yjLylx" :tag="false" :options="D_BZ_YJLY" />
</template>
<template #bqdl="{ row }">
<DictTag :value="row.bqdl" :tag="false" :options="D_GS_QLZDRLX" />
<DictTag :value="row.bqdl" :tag="false" :options="D_GS_QLZDRLX" />
</template>
<template #xsd="{ row }">
{{ row.xsd }}%
@ -76,9 +69,10 @@
<el-link type="warning" @click="pushAssess(row)">全息档案</el-link>
<el-link type="primary" @click="handleCzjy(row)" v-if="roleCode">处置建议</el-link>
<el-link type="success" @click="handleQsFk(row, '签收')" v-if="row.czzt == '01' && permission_sfqs">签收</el-link>
<el-link type="success" @click="handleQsFk(row, '反馈')" v-if="row.czzt == '02' && permission_sfqs" >反馈</el-link>
<el-link type="primary" @click="openAddFrom(row)">详情</el-link>
<el-link type="primary" @click="pushWarning(row)">指派</el-link>
<el-link type="success" @click="handleQsFk(row, '反馈')" v-if="row.czzt == '02' && permission_sfqs">反馈</el-link>
<!-- <el-link type="primary" @click="openAddFrom(row)">详情</el-link> -->
<el-link type="primary" @click="pushWarning(row)">指派</el-link>
<el-link type="primary" @click="openBox(row)">详情</el-link>
</template>
</MyTable>
<Pages @changeNo="changeNo" @changeSize="changeSize" :tableHeight="pageData.tableHeight" :pageConfiger="{
@ -91,11 +85,13 @@
<AddFrom ref="addModelRef" :dict="{ D_GSXT_YJXX_CZZT, D_BZ_YJJB, D_GS_SSYJ }" />
<!-- 处置建议 -->
<Czjy ref="czjyRef" @okSubmit="getList"></Czjy>
<ZpForm v-model="warningShow" :dataList="dataList"/>
<ZpForm v-model="warningShow" :dataList="dataList" />
<!-- <Pagination v-model="paginationOpen" /> -->
<Pagination v-model="paginationOpen" :dataList="dataPres" :dict="{D_BZ_XB,D_BZ_YJJB,D_GS_QLZDRLX,D_GS_ZDR_RYJB,D_GS_ZDR_GJLB,D_GS_BK_CZYQ}" />
</template>
<script setup>
import { IdCard } from '@/utils/validate.js'
import { IdCard } from '@/utils/validate.js'
import Czjy from './components/czjy.vue'
import { getItem, setItem } from '@/utils/storage'
import PageTitle from "@/components/aboutTable/PageTitle.vue";
@ -112,20 +108,45 @@ import { holographicProfileJump } from "@/utils/tools.js"
import Items from "./item/items.vue"
import { exportExlByObj } from "@/utils/exportExcel.js"
import { getMultiDictVal } from "@/utils/dict.js"
import Pagination from "./components/particulars.vue";
const czjyRef = ref()
const { proxy } = getCurrentInstance();
const searchBox = ref();
const { D_GS_QLZDRLX,D_BZ_YJLY,D_GSXT_YJXX_CZZT, D_GS_SSYJ,D_BZ_YJJB } = proxy.$dict('D_GS_QLZDRLX','D_BZ_YJLY',"D_GSXT_YJXX_CZZT", "D_GS_SSYJ",'D_BZ_YJJB')
const { D_GS_QLZDRLX, D_BZ_YJLY, D_GSXT_YJXX_CZZT, D_GS_SSYJ, D_BZ_YJJB, D_BZ_BKLYS, D_BZ_XB, D_BZ_SF, D_GS_CSZT, D_GS_BKZT, D_GS_ZDR_RYJB, D_GS_ZDR_GJLB,D_GS_BK_CZYQ } = proxy.$dict('D_GS_QLZDRLX', 'D_BZ_YJLY', "D_GSXT_YJXX_CZZT", "D_GS_SSYJ", 'D_BZ_YJJB', 'D_BZ_BKLYS', 'D_BZ_XB', 'D_BZ_SF', 'D_GS_CSZT', 'D_GS_BKZT', 'D_GS_ZDR_RYJB', 'D_GS_ZDR_GJLB','D_GS_BK_CZYQ'
)
const dict = reactive({ D_GSXT_YJXX_CZZT, D_GS_SSYJ })
// 搜索配置
const searchConfiger = ref([
{ label: "姓名", prop: 'xm', placeholder: "请输入姓名", showType: "input" },
{ label: "身份证号码", prop: 'sfzh', placeholder: "请输入身份证号码", showType: "input" },
{ label: "预警标签", prop: 'yjbqmc', placeholder: "请输入预警标签", showType: "input" },
{ label: "部门", prop: 'ssbmdm', placeholder: "请选择部门", showType: "department" },
{ label: "级别", prop: 'yjJb', placeholder: "请选择级别", showType: "select" ,options: D_BZ_YJJB},
{ label: "积分段", prop: 'jfd', placeholder: "请选择积分段", showType: "Slot" },
{ label: "布控时间", prop: 'startTime', placeholder: "请选择布控时间", showType: "datetimerange" },
{ label: "布控开始时间", prop: 'bkkssj', showType: "date", placeholder: "请选择布控开始时间" },
{ label: "布控结束时间", prop: 'bkjssj', showType: "date", placeholder: "请选择布控结束时间" },
{ label: "预警时间", prop: 'startTime', showType: "datetimerange", placeholder: "请选择预警时间" },
{ label: "预警级别", prop: 'yjJb', showType: "select", options: D_BZ_YJJB, placeholder: "请选择预警级别", multiple: true },
{ label: "布控来源", prop: 'bkly', showType: "select", options: D_BZ_BKLYS, placeholder: "请选择布控来源" },
{ label: "布控范围", prop: 'bkfw', showType: "input", placeholder: "请输入布控范围" },
{ label: "布控单位", prop: 'gkbmdm', showType: "department", placeholder: "请选择布控单位" },
{ label: "所属单位", prop: 'ssbmdm', showType: "department", placeholder: "请选择所属单位" },
{ label: "相似度", prop: 'xsd', showType: "input", placeholder: "请输入相似度" },
{ prop: 'sfglyj', showType: "checkbox", showSelectAll: false, options: [{ label: '关联预警', value: '1' }] },
{ prop: 'sfgz', showType: "checkbox", showSelectAll: false, options: [{ label: '重点关注', value: '1' }] },
{ prop: 'sfzp', showType: "checkbox", showSelectAll: false, options: [{ label: '二次指派', value: '1' }] },
{ label: "签收状态", prop: 'czzt', showType: "select", options: D_GSXT_YJXX_CZZT },
{ label: "超时状态", prop: 'cszt', placeholder: "请选择超时状态", showType: "select", options: D_GS_CSZT },
{ label: "布控状态", prop: 'zkzt', showType: "select", options: D_GS_BKZT, placeholder: "请选择布控状态" },
{ label: "姓名", prop: 'yjRyxm', showType: "input", placeholder: "请输入姓名" },
{ label: "性别", prop: 'xbdm', showType: "select", options: D_BZ_XB, placeholder: "请选择性别" },
{ label: "开始年龄", prop: 'ksnl', placeholder: "请输入年龄", showType: "number" },
{ label: "结束年龄", prop: 'jsnl', placeholder: "请输入年龄", showType: "number" },
{ label: "跨地区", prop: 'sflksd', showType: "select", options: D_BZ_SF, placeholder: "请选择是否跨地区" },
{ label: "身份证号", prop: 'yjRysfzh', showType: "input", placeholder: "请输入身份证号" },
{ label: "预警内容", prop: 'yjNr', showType: "input", placeholder: "请输入预警内容" },
// { label: "姓名", prop: 'xm', placeholder: "请输入姓名", showType: "input" },
// { label: "身份证号码", prop: 'sfzh', placeholder: "请输入身份证号码", showType: "input" },
// { label: "预警标签", prop: 'yjbqmc', placeholder: "请输入预警标签", showType: "input" },
// { label: "部门", prop: 'ssbmdm', placeholder: "请选择部门", showType: "department" },
// { label: "级别", prop: 'yjJb', placeholder: "请选择级别", showType: "select" ,options: D_BZ_YJJB},
// { label: "积分段", prop: 'jfd', placeholder: "请选择积分段", showType: "Slot" },
// { label: "布控时间", prop: 'startTime', placeholder: "请选择布控时间", showType: "datetimerange" },
]);
const ORDIMG = 'https://89.40.7.122:38496/image'
const IMGYM = 'https://sg.lz.dsj.xz/dhimage'
@ -151,26 +172,34 @@ const pageData = reactive({
},
controlsWidth: 180, //操作栏宽度
tableColumn: [
{ label: "预警图片", prop: "yjTp", showSolt: true, width: 100 },
{ label: "处置状态", prop: "czzt", showSolt: true },
{ label: "预警时间", prop: "yjSj", showOverflowTooltip: true, width: 200 },
{ label: "姓名", prop: "yjRyxm" },
{ label: "性别", prop: "sex", showSolt: true, width: 80 },
{ label: "年龄", prop: "age", showSolt: true, width: 80 },
{ label: "数据来源", prop: "yjLylx", showOverflowTooltip: true, showSolt: true },
{ label: "身份证", prop: "yjRysfzh", showOverflowTooltip: true, width: 200 },
{ label: "预警级别", prop: "yjJb", showSolt: true },
{ label: "相似度", prop: "xsd", showSolt: true },
{ label: "状态", prop: "czzt", showSolt: true, width: 80 },
{ label: "预警时间", prop: "yjSj", showOverflowTooltip: true },
{ label: "姓名", prop: "yjRyxm" , width: 50},
{ label: "身份证", prop: "yjRysfzh", showOverflowTooltip: true },
{ label: "性别", prop: "sex", showSolt: true , width: 50},
{ label: "年龄", prop: "age", showSolt: true, width: 50 },
{ label: "预警级别", prop: "yjJb", showSolt: true , width: 50},
{ label: "布控单位", prop: "gkbmdm", showSolt: true , width: 50},
{ label: "布控来源", prop: "bkly", showSolt: true , width: 50},
{ label: "布控范围", prop: "bkfw", showSolt: true },
{ label: "布控开始时间", showOverflowTooltip: true, prop: "bkkssj", showSolt: true },
{ label: "布控结束时间", showOverflowTooltip: true, prop: "bkjssj", showSolt: true },
{ label: "处置要求", prop: "bkczyq", showSolt: true, showOverflowTooltip: true },
{ label: "相似度", prop: "xsd", showSolt: true, width: 50 },
{ label: "预警内容", prop: "yjNr", showOverflowTooltip: true, showSolt: true },
{ label: "所属部门", prop: "ssbm", showOverflowTooltip: true },
{ label: "数据来源", prop: "yjLylx", showOverflowTooltip: true, showSolt: true },
{ label: "超时状态", prop: "cszt", showOverflowTooltip: true, showSolt: true, width: 50 },
{ label: "在控状态", prop: "zkzt", showOverflowTooltip: true, showSolt: true, width: 50 },
]
});
onMounted(() => {
let str = getItem('deptId') ? getItem('deptId')[0].deptLevel : ''
permission_sfqs.value = str.startsWith('2'||'3') ? false : true;
let rols = getItem('roleList') ? getItem('roleList'):[]
permission_sfqs.value = str.startsWith('2' || '3') ? false : true;
let rols = getItem('roleList') ? getItem('roleList') : []
let obj = rols.find(item => {
return ['JS_666666','JS_777777','JS_888888'].includes(item.roleCode)
return ['JS_666666', 'JS_777777', 'JS_888888'].includes(item.roleCode)
})
roleCode.value = obj ? true : false;
@ -183,7 +212,12 @@ const onSearch = (val) => {
...queryFrom.value, ...val,
startTime: val.startTime ? val.startTime[0] : '',
endTime: val.startTime ? val.startTime[1] : '',
};
yjJb: val.yjJb?.join(',') || '',
sfglyj: val.sfglyj?.join(',') || '',
sfgz: val.sfgz?.join(',') || '',
sfzp: val.sfzp?.join(',') || ''
};
pageData.pageConfiger.pageCurrent = 1;
getList();
};
@ -210,7 +244,7 @@ const getList = () => {
pageCurrent: pageData.pageConfiger.pageCurrent,
pageSize: pageData.pageConfiger.pageSize,
}
qcckPost(params,'/mosty-gsxt/tbYjxx/getBdbkPageList').then((res) => {
qcckPost(params, '/mosty-gsxt/tbYjxx/getBdbkPageList').then((res) => {
pageData.tableData = res?.records || []
pageData.total = res?.total || 0;
pageData.tableConfiger.loading = false;
@ -239,7 +273,7 @@ const handleQsFk = (val, type) => {
}
const pushAssess = (val) => {
return holographicProfileJump(val?.yjLx,val) // 全息档案跳转
return holographicProfileJump(val?.yjLx, val) // 全息档案跳转
}
@ -265,13 +299,13 @@ const openAddFrom = (row) => {
}
const handleCzjy = (row) => {
czjyRef.value.init( row)
czjyRef.value.init(row)
}
// 表格高度计算
const tabHeightFn = () => {
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 270;
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 270;
window.onresize = function() {
window.onresize = function () {
tabHeightFn();
};
};
@ -324,14 +358,14 @@ const exportExl = () => {
}
const handleQs = () => {
if (selectRows.value?.length === 0) return proxy.$message({ type: "warning", message: "请选择要签收的预警" });
if (selectRows.value?.length === 0) return proxy.$message({ type: "warning", message: "请选择要签收的预警" });
let wqs = selectRows.value.filter(item => item.czzt == '01');
if (wqs.length == 0) return proxy.$message({ type: "warning", message: "数据都已签收，请选择未签收的数据" });
let yqs = selectRows.value.filter(item => item.czzt == '02');
let texy = yqs.length > 0 ? `${yqs.length}条已签收预警数据，确认要签收${wqs.length}条未签收预警数据吗？` : '确认要签收所有预警数据吗？'
proxy.$confirm(texy, "警告", { type: "warning" }).then(() => {
let ids = wqs.map(item => item.id)
qcckPost({ids}, '/mosty-gsxt/tbYjxx/batchQs').then(() => {
qcckPost({ ids }, '/mosty-gsxt/tbYjxx/batchQs').then(() => {
proxy.$message({ type: "success", message: "成功" });
getList();
}).catch(() => {
@ -340,17 +374,30 @@ const handleQs = () => {
}).catch(() => { });
}
// 详情
const paginationOpen = ref(false)
const dataPres = ref({})
const openBox = (val) => {
paginationOpen.value = true
dataPres.value = val
}
</script>
<style lang="scss">
<style lang="scss" scoped>
.el-loading-mask {
background: rgba(0, 0, 0, 0.5) !important;
}
.tabBox_zdy{
.tabBox_zdy {
.el-table--fit {
overflow: unset !important;
}
}
::v-deep .el-table .cell {
padding: 0;
}
::v-deep .el-table .el-table__cell {
padding: 4px 0;
}
</style>

455
src/views/backOfficeSystem/fourColorManage/warningControl/regionalControl/components/particulars.vue Normal file
View File

@ -0,0 +1,455 @@
<!--预警指派展示组件 -->
<template>
<el-dialog :draggable="true" :model-value="modelValue" :title="title" :width="width" @close="close" append-to-body>
<div class="archive-container" v-loading="loading">
<div class="three-column-layout">
<!-- 重点人员基本信息页 -->
<div class="column">
<div class="column-header">人员预警信息首页</div>
<div class="info-section">
<div class="info-row">
<div class="info-item">
<span class="info-label">人员姓名：</span>
<span class="info-value">{{ dataForm.yjRyxm }}</span>
</div>
<div class="info-item">
<span class="info-label">性别：</span>
<span class="info-value">
<DictTag :value="dataForm.xbdm" :tag="false" :options="dict.D_BZ_XB" />
</span>
</div>
<div class="info-item">
<span class="info-label">年龄：</span>
<span class="info-value">{{ dataForm.nl }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">身份证号码：</span>
<span class="info-value">{{ dataForm.yjRysfzh }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">户籍地：</span>
<span class="info-value">{{ dataForm.hjdXz }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">现住地址：</span>
<span class="info-value">{{ dataForm.xzdXz }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item">
<span class="info-label">处置要求：</span>
<span class="info-value">
<DictTag :value="dataForm.bkczyq" :tag="false" :options="dict.D_GS_BK_CZYQ" />
</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">预警级别：</span>
<span class="info-value warning-level" :class="ys()">
<DictTag :value="dataForm.yjJb" :tag="false" :options="dict.D_BZ_YJJB" />
</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">布控起始时间：</span>
<span class="info-value">{{ dataForm.bkkssj }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">布控结束时间：</span>
<span class="info-value">{{ dataForm.bkjssj }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">所属单位：</span>
<span class="info-value">{{ dataForm.ssbm }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">布控单位：</span>
<span class="info-value">{{ dataForm.gkbmmc }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">布控原因：</span>
<span class="info-value text-area"></span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">一标三实：</span>
<span class="info-value text-area"></span>
</div>
</div>
</div>
</div>
<!-- 重点人员活动信息页 -->
<div class="column">
<div class="column-header">人境预警活动信息页</div>
<div class="info-section blue-bg">
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">轨迹类别：</span>
<span class="info-value">
<DictTag :value="dataForm.yjLylx" :tag="false" :options="dict.D_GS_ZDR_GJLB" />
</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">核查时间：</span>
<span class="info-value">
<span v-if="dataForm.fkList && dataForm.fkList.length > 0">{{ dataForm.fkList[0].czsj }}</span>
</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">比对时间：</span>
<span class="info-value">{{ dataForm.yjSj }}</span>
</div>
</div>
<!-- <div class="info-row">
<div class="info-item full-width">
<span class="info-label">五管检查站：</span>
<span class="info-value">A29核查</span>
</div>
</div> -->
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">信息提供单位：</span>
<span class="info-value">{{ dataForm.jczmc }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">信息接收单位：</span>
<span class="info-value">{{ dataForm.ssbm }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">二次指派单位：</span>
<span class="info-value">
<div v-if="dataForm.zpList && dataForm.zpList.length > 0">
<span v-for="(item, index) in dataForm.zpList" :key="item.id">
{{ item.zpbm }}<span v-if="index < dataForm.zpList.length - 1">,</span>
</span>
</div>
</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">签收时限：</span>
<span class="info-value">{{ dataForm.qssj }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">反馈时限：</span>
<span class="info-value">{{ dataForm.fksj }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">处置建议：</span>
<span class="info-value">
<div v-if="dataForm.czjyList && dataForm.czjyList.length > 0">
<div v-for="(item, index) in dataForm.czjyList" :key="item.id">
<span>{{ `${index + 1}、` + item.jynr }}</span>
</div>
</div>
</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">反馈内容：</span>
<span class="info-value">
<div v-if="dataForm.fkList && dataForm.fkList.length > 0">
<div v-for="(item, index) in dataForm.fkList" :key="item.id">
<span v-if="item.ckczbcxx">{{ `${index + 1}、` + item.ckczbcxx }}</span>
</div>
</div>
</span>
</div>
</div>
</div>
</div>
<!-- 历史预警信息页 -->
<div class="column">
<div class="column-header">历史预警信息页</div>
<div class="info-section">
<div class="history-item" v-for="(item, index) in dataForm.yjgjList" :key="item.id">
<span class="history-index">{{ `${index + 1}：` }}</span>
<span class="history-content">{{ item.yjNr }}</span>
</div>
</div>
</div>
</div>
</div>
<template #footer>
<div class="dialog-footer" style="text-align: center;">
<el-button @click="close">关闭</el-button>
</div>
</template>
</el-dialog>
</template>
<script setup>
import { defineProps, getCurrentInstance, watch, ref } from 'vue';
import { qcckGet } from '@/api/qcckApi.js'
const { proxy } = getCurrentInstance();
const props = defineProps({
modelValue: {
type: Boolean,
default: false
},
title: {
type: String,
default: '预警详情'
},
width: {
type: String,
default: '90%'
}, dataList: {
type: Object,
default: () => ({})
},
dict: {
type: Object,
default: () => ({})
}
});
// 定义事件
const emit = defineEmits(['update:modelValue']);
const loading = ref(false)
let abortController = null
const close = () => {
if (abortController) {
abortController.abort()
abortController = null
}
loading.value = false
emit('update:modelValue', false);
};
const dataForm = ref({});
watch(() => props.modelValue, (newVal) => {
if (newVal) {
getPart(props.dataList.id)
}
}, { deep: true });
const getPart = (id) => {
if (abortController) {
abortController.abort()
}
abortController = new AbortController()
loading.value = true
qcckGet({}, `/mosty-gsxt/tbYjxx/getInfo/${id}`, { signal: abortController.signal }).then(res => {
if (res) {
dataForm.value = res
} else {
dataForm.value = {}
}
}).catch(err => {
if (err.name !== 'AbortError') {
console.error('请求失败:', err)
}
}).finally(() => {
loading.value = false
})
}
const ys = () => {
switch (dataForm.value.yjJb) {
case '01':
return 'red';
case '02':
return 'orange';
case '03':
return 'yellow';
case '04':
return 'blue';
default:
return '';
}
}
</script>
<style scoped>
.archive-container {
padding: 0;
max-height: 500px;
overflow-y: auto;
}
.three-column-layout {
display: flex;
height: 100%;
border: 1px solid #dcdfe6;
}
.column {
flex: 1;
display: flex;
flex-direction: column;
min-width: 300px;
border-right: 1px solid #dcdfe6;
}
.column:last-child {
border-right: none;
}
.column-header {
font-size: 16px;
font-weight: bold;
padding: 8px;
background: #f0f2f5;
color: #303133;
text-align: center;
border-bottom: 1px solid #dcdfe6;
}
.column .info-section {
flex: 1;
overflow-y: auto;
padding: 12px;
}
.info-section {
background: #ffffff;
}
.info-section.blue-bg {
background: #e6f7ff;
border: none;
}
.info-row {
display: flex;
flex-wrap: wrap;
margin-bottom: 10px;
}
.info-item {
flex: 1;
min-width: 300px;
display: flex;
align-items: center;
margin-bottom: 8px;
}
.info-item.full-width {
flex: 100%;
min-width: 100%;
}
.info-label {
font-weight: 600;
margin-right: 8px;
white-space: nowrap;
color: #303133;
font-size: 13px;
width: 90px;
flex-shrink: 0;
}
.info-value {
flex: 1;
padding: 3px 6px;
border: 1px solid #dcdfe6;
background: #ffffff;
min-height: 26px;
display: flex;
align-items: center;
font-size: 13px;
color: #606266;
}
.info-value.text-area {
min-height: 70px;
align-items: flex-start;
padding: 6px;
resize: vertical;
line-height: 1.4;
}
.info-value.warning-level {
background: #fffbe6;
border-color: #ffe58f;
color: #d48806;
font-weight: 600;
padding: 2px 6px;
font-size: 12px;
width: fit-content;
}
.history-item {
margin-bottom: 6px;
padding: 4px 8px;
border: none;
background: #ffffff;
display: flex;
align-items: center;
}
.history-index {
font-weight: bold;
margin-right: 6px;
color: #303133;
font-size: 13px;
min-width: 35px;
}
.history-content {
flex: 1;
color: #606266;
font-size: 13px;
line-height: 1.4;
}
/* 滚动条样式 */
.archive-container::-webkit-scrollbar,
.info-section::-webkit-scrollbar {
width: 6px;
height: 6px;
}
.archive-container::-webkit-scrollbar-track,
.info-section::-webkit-scrollbar-track {
background: #f1f1f1;
}
.archive-container::-webkit-scrollbar-thumb,
.info-section::-webkit-scrollbar-thumb {
background: #c1c1c1;
}
.archive-container::-webkit-scrollbar-thumb:hover,
.info-section::-webkit-scrollbar-thumb:hover {
background: #a8a8a8;
}
/* 按钮样式 */
.dialog-footer {
padding: 12px;
background: #f9f9f9;
border-top: 1px solid #e4e7ed;
text-align: center;
}
</style>

120
src/views/backOfficeSystem/fourColorManage/warningControl/regionalControl/index.vue
View File

@ -1,7 +1,7 @@
<template>
<div>
<!-- 搜索 -->
<div ref="searchBox" class="mt10" >
<div ref="searchBox" class="mt10">
<Searchs :searchArr="searchConfiger" @submit="onSearch" @reset="reset" :key="pageData.keyCount">
<template #jfd>
<div>
@ -12,12 +12,12 @@
</template>
</Searchs>
</div>
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
<template #left>
<el-button type="primary" @click="exportExl" size="small">导出</el-button>
<el-button type="primary" size="small" @click="handleQs">签收</el-button>
</template>
</PageTitle>
</PageTitle>
<!-- 表格 -->
<div class="tabBox" :style="{ height: (pageData.tableHeight + 40) + 'px' }">
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
@ -35,16 +35,24 @@
<template #yjLylx="{ row }">
<DictTag :value="row.yjLylx" :tag="false" :options="D_BZ_YJLY" />
</template>
<template #xbdm="{ row }">
<DictTag :value="row.xbdm" :tag="false" :options="D_BZ_XB" />
</template>
<template #expand="{ props }">
<div class="expand-content" style="max-width: 100%; max-height: 400px; overflow-y: auto; padding: 10px;">
<Items :row="props || {}" :dict="dict" />
</div>
</template>
<template #yjLx="{ row }">
<DictTag :value="row.yjLx" :tag="false" :options="D_BZ_YJLX" />
</template>
<template #controls="{ row }">
<el-link type="warning" @click="pushAssess(row)">全息档案</el-link>
<el-link type="success" @click="handleQsFk(row, '签收')" v-if="row.czzt == '01' && permission_sfqs">签收</el-link>
<el-link type="success" @click="handleQsFk(row, '反馈')" v-else-if="row.czzt == '02' && permission_sfqs">反馈</el-link>
<el-link type="primary" @click="openAddModel(row)">详情</el-link>
<el-link type="success" @click="handleQsFk(row, '反馈')"
v-else-if="row.czzt == '02' && permission_sfqs">反馈</el-link>
<el-link type="primary" @click="openBox(row)">详情</el-link>
</template>
</MyTable>
<Pages @changeNo="changeNo" @changeSize="changeSize" :tableHeight="pageData.tableHeight" :pageConfiger="{
@ -66,6 +74,8 @@
<ChooseJf v-model="chooseJfShow" titleValue="选择系数" :Single="false" :chooseJfBh="chooseJfBh" url="/yjzxZhyj/sjxspz"
:roleIds="roleIds" />
<!-- <Pagination v-model="paginationOpen" /> -->
<Pagination v-model="paginationOpen" :dataList="dataPres" :dict="{D_BZ_XB,D_BZ_YJJB,D_GS_QLZDRLX,D_GS_ZDR_RYJB,D_GS_ZDR_GJLB,D_GS_BK_CZYQ}" />
</template>
<script setup>
@ -88,12 +98,14 @@ import Detail from './components/detail.vue'
import { exportExlByObj } from "@/utils/exportExcel.js"
import { getMultiDictVal } from "@/utils/dict.js"
import emitter from "@/utils/eventBus.js";
import Pagination from "./components/particulars.vue";
const permission_sfqs = ref(false)
const roleCode = ref(false)
const searchBox = ref();
const czjyRef = ref()
const { proxy } = getCurrentInstance();
const { D_GSXT_YJXX_CZZT, D_GS_SSYJ, D_BZ_YJJB, D_BZ_YJLY, D_BZ_YJLX } = proxy.$dict("D_GSXT_YJXX_CZZT", "D_GS_SSYJ", "D_BZ_YJJB", "D_BZ_YJLY", "D_BZ_YJLX");
const { D_GSXT_YJXX_CZZT, D_GS_SSYJ, D_BZ_YJJB, D_BZ_YJLY, D_BZ_YJLX, D_BZ_BKLYS, D_GS_CSZT, D_GS_BKZT, D_BZ_XB,D_GS_QLZDRLX,D_GS_ZDR_RYJB,D_GS_ZDR_GJLB,D_GS_BK_CZYQ } =
proxy.$dict("D_GSXT_YJXX_CZZT", "D_GS_SSYJ", "D_BZ_YJJB", "D_BZ_YJLY", "D_BZ_YJLX", "D_BZ_BKLYS", "D_GS_CSZT", "D_GS_BKZT", "D_BZ_XB","D_GS_QLZDRLX","D_GS_ZDR_RYJB","D_GS_ZDR_GJLB","D_GS_BK_CZYQ");
// 字典数据集合
const dict = ref({
@ -107,12 +119,28 @@ import { holographicProfileJump } from "@/utils/tools.js"
// 搜索配置
const searchConfiger = ref([
{ label: "布控开始时间", prop: 'bkkssj', showType: "date", placeholder: "请选择布控开始时间" },
{ label: "布控结束时间", prop: 'bkjssj', showType: "date", placeholder: "请选择布控结束时间" },
{ label: "预警时间", prop: 'startTime', showType: "datetimerange", placeholder: "请选择预警时间" },
{ label: "比中项", prop: 'yjLx', showType: "checkbox", showSelectAll: true, options: [{ label: '人员', value: '1', }, { label: '车辆', value: '2', }] },
{ label: "布控来源", prop: 'bkly', showType: "select", options: D_BZ_BKLYS, placeholder: "请选择布控来源" },
{ label: "区域所属单位", prop: 'ssbmdm', placeholder: "请选择区域所属单位", showType: "department" },
{ label: "布控单位", prop: 'ssbmdm', placeholder: "请选择布控单位", showType: "department" },
{ label: "所属部门", prop: 'ssbmdm', placeholder: "请选择所属部门", showType: "department" },
{ label: "签收状态", prop: 'czzt', showType: "select", options: D_GSXT_YJXX_CZZT },
{ label: "超时状态", prop: 'cszt', placeholder: "请选择超时状态", showType: "select", options: D_GS_CSZT },
{ label: "布控状态", prop: 'zkzt', showType: "select", options: D_GS_BKZT, placeholder: "请选择布控状态" },
{ label: "姓名", prop: 'xm', placeholder: "请输入姓名", showType: "input" },
{ label: "性别", prop: 'xbdm', showType: "select", options: D_BZ_XB, placeholder: "请选择性别" },
{ label: "开始年龄", prop: 'ksnl', placeholder: "请输入年龄", showType: "number" },
{ label: "结束年龄", prop: 'jsnl', placeholder: "请输入年龄", showType: "number" },
{ label: "身份证号码", prop: 'sfzh', placeholder: "请输入身份证号码", showType: "input" },
{ label: "预警标签", prop: 'yjbqmc', placeholder: "请输入预警标签", showType: "input" },
{ label: "部门", prop: 'ssbmdm', placeholder: "请选择部门", showType: "department" },
{ label: "级别", prop: 'bqys', placeholder: "请选择级别", showType: "select", options: D_BZ_YJJB },
{ label: "积分段", prop: 'jfd', placeholder: "请选择积分段", showType: "Slot" },
{ label: "车牌号码", prop: 'clcph', placeholder: "请输入车牌号码", showType: "input" },
{ label: "预警内容", prop: 'yjNr', showType: "input", placeholder: "请输入预警内容" },
// { label: "预警标签", prop: 'yjbqmc', placeholder: "请输入预警标签", showType: "input" },
// { label: "部门", prop: 'ssbmdm', placeholder: "请选择部门", showType: "department" },
// { label: "级别", prop: 'bqys', placeholder: "请选择级别", showType: "select", options: D_BZ_YJJB },
// { label: "积分段", prop: 'jfd', placeholder: "请选择积分段", showType: "Slot" },
]);
const queryFrom = ref({});
@ -132,19 +160,42 @@ const pageData = reactive({
pageSize: 20,
pageCurrent: 1
},
controlsWidth: 200,
controlsWidth:160,
tableColumn: [
{ label: "预警人姓名", prop: "yjRyxm" },
{ label: "相似度", prop: "xsd", showSolt: true },
{ label: "处置状态", prop: "czzt", showSolt: true },
{ label: "预警时间", prop: "yjSj", width: 200 },
{ label: "预警标签", prop: "yjbqmc" },
{ label: "身份证号", prop: "yjRysfzh", width: 200 },
{ label: "预警来源", prop: "yjLylx", showSolt: true },
{ label: "预警级别", prop: "yjJb", showSolt: true },
{ label: "车牌号", prop: "yjClcph" },
{ label: "布控区域名称", prop: "bkqymc" },
{ label: "所属部门", prop: "ssbm" },
{ label: "状态", prop: "czzt", showOverflowTooltip: true, showSolt: true, width: 80 },
{ label: "预警时间", prop: "yjSj", showOverflowTooltip: true, width: 50 },
{ label: "区域名称", prop: "bkqymc", showOverflowTooltip: true, width: 50 },
{ label: "区域范围", prop: "bkfw", showOverflowTooltip: true, width: 50},
// { label: "区域所属", prop: "gkbmmc", showOverflowTooltip: true, width: 50 },
{ label: "比中", prop: "yjLx", showOverflowTooltip: true, width: 60, showSolt: true },
{ label: "姓名", prop: "yjRyxm", showOverflowTooltip: true, width: 60 },
{ label: "身份证号", prop: "yjRysfzh", showOverflowTooltip: true },
{ label: "性别", prop: "xbdm", showOverflowTooltip: true, showSolt: true, width: 50 },
{ label: "年龄", prop: "nl", showOverflowTooltip: true, width: 50 },
{ label: "预警级别", prop: "yjJb", showOverflowTooltip: true,showSolt: true, width: 60 },
{ label: "布控单位", prop: "gkbmmc", showOverflowTooltip: true, width: 60 },
{ label: "布控来源", prop: "bkly", showOverflowTooltip: true ,showSolt: true, width: 60 },
{ label: "布控范围", prop: "bkfw", showOverflowTooltip: true, width: 60 },
{ label: "布控开始时间", prop: "bkkssj", showOverflowTooltip: true },
{ label: "布控结束时间", prop: "bkjssj", showOverflowTooltip: true },
{ label: "处置要求", prop: "bkczyq",showSolt: true, showOverflowTooltip: true, width: 50 },
{ label: "相似度", prop: "xsd", showSolt: true, showOverflowTooltip: true, width:45 },
{ label: "预警内容", prop: "yjNr", showOverflowTooltip: true, width: 50 },
{ label: "所属单位", prop: "ssbm", showOverflowTooltip: true, width: 50 },
{ label: "数据来源", prop: "yjLylx", showOverflowTooltip: true,showSolt: true, width: 65 },
{ label: "超时状态", prop: "cszt", showOverflowTooltip: true,showSolt: true, width: 50 },
{ label: "在控状态", prop: "zkzt", showOverflowTooltip: true,showSolt: true, width: 50 },
// { label: "相似度", prop: "xsd", showSolt: true },
// { label: "处置状态", prop: "czzt", showSolt: true },
// { label: "预警时间", prop: "yjSj", width: 200 },
// { label: "预警标签", prop: "yjbqmc" },
// { label: "身份证号", prop: "yjRysfzh", width: 200 },
// { label: "预警来源", prop: "yjLylx", showSolt: true },
// { label: "预警级别", prop: "yjJb", showSolt: true },
// { label: "车牌号", prop: "yjClcph" },
// { label: "布控区域名称", prop: "bkqymc" },
// { label: "所属部门", prop: "ssbm" },
]
});
@ -168,7 +219,7 @@ const handleCzjy = (row) => {
}
const onSearch = (val) => {
queryFrom.value = { ...queryFrom.value, ...val };
queryFrom.value = { ...queryFrom.value, ...val,sfglyj:val.sfglyj.join(',') };
pageData.pageConfiger.pageCurrent = 1;
getList();
};
@ -311,7 +362,7 @@ const chooseJfFun = (val) => {
// 表格高度计算
const tabHeightFn = () => {
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 270;
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 270;
window.onresize = function () {
tabHeightFn();
};
@ -352,14 +403,14 @@ const exportExl = () => {
}
const handleQs = () => {
if (selectRows.value?.length === 0) return proxy.$message({ type: "warning", message: "请选择要签收的预警" });
if (selectRows.value?.length === 0) return proxy.$message({ type: "warning", message: "请选择要签收的预警" });
let wqs = selectRows.value.filter(item => item.czzt == '01');
if (wqs.length == 0) return proxy.$message({ type: "warning", message: "数据都已签收，请选择未签收的数据" });
let yqs = selectRows.value.filter(item => item.czzt == '02');
let texy = yqs.length > 0 ? `${yqs.length}条已签收预警数据，确认要签收${wqs.length}条未签收预警数据吗？` : '确认要签收所有预警数据吗？'
proxy.$confirm(texy, "警告", { type: "warning" }).then(() => {
let ids = wqs.map(item => item.id)
qcckPost({ids}, '/mosty-gsxt/tbYjxx/batchQs').then(() => {
qcckPost({ ids }, '/mosty-gsxt/tbYjxx/batchQs').then(() => {
proxy.$message({ type: "success", message: "成功" });
getList();
}).catch(() => {
@ -367,11 +418,24 @@ const handleQs = () => {
});
}).catch(() => { });
}
// 详情
const paginationOpen = ref(false)
const dataPres = ref()
const openBox = (val) => {
dataPres.value = val
paginationOpen.value = true
}
</script>
<style>
<style lang="scss" scoped>
.el-loading-mask {
background: rgba(0, 0, 0, 0.5) !important;
}
::v-deep .el-table .cell {
padding: 0;
}
::v-deep .el-table .el-table__cell {
padding: 4px 0;
}
</style>

211
src/views/backOfficeSystem/fourColorManage/warningControl/sevenWarning/index.vue
View File

@ -1,34 +1,23 @@
<template>
<div>
<!-- 搜索 -->
<div ref="searchBox" class="mt10 mb10">
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount">
<template #age="{ row }">
<div class="ageBox">
<el-input v-model="queryFrom.age_s" placeholder="开始年龄" type="number" :min="1" :max="100" style="width: 102px;"></el-input>
<span style="color: #333;" class="ml5 mr5">至</span>
<el-input v-model="queryFrom.age_b" placeholder="结束年龄" type="number" :min="parseInt(queryFrom.age_s)+1" :max="100" style="width: 102px;"></el-input>
</div>
</template>
<div ref="searchBox" class="mt10 mb10">
<Search :searchArr="searchConfiger" @submit="onSearch" ref="searchDom" :key="pageData.keyCount">
</Search>
</div>
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
<template #left>
<el-button type="primary" size="small" @click="exportExl">导出</el-button>
<el-button type="primary" size="small" @click="handleQs">签收</el-button>
<el-button type="primary" size="small" @click="exportExl">批量导出</el-button>
<el-button type="primary" size="small" @click="handleQs">批量签收</el-button>
<el-button type="primary" size="small" @click="handleQs">批量分析</el-button>
<el-button type="primary" size="small" @click="countPeople">计算人数</el-button>
</template>
</PageTitle>
<!-- 表格 -->
<div class="tabBox heightBox">
<MyTable expand
:tableData="pageData.tableData"
:tableColumn="pageData.tableColumn"
:tableHeight="pageData.tableHeight"
:key="pageData.keyCount"
:tableConfiger="pageData.tableConfiger"
:controlsWidth="pageData.controlsWidth"
@chooseData="handleChooseData"
>
<MyTable expand :tableData="pageData.tableData" :tableColumn="pageData.tableColumn"
:tableHeight="pageData.tableHeight" :key="pageData.keyCount" :tableConfiger="pageData.tableConfiger"
:controlsWidth="pageData.controlsWidth" @chooseData="handleChooseData">
<template #expand="{ props }">
<div style="max-width: 100%">
<Items :row="props || {}" />
@ -37,27 +26,34 @@
<template #czzt="{ row }">
<DictTag :value="row.czzt" :tag="false" :options="D_GSXT_YJXX_CZZT" />
</template>
<template #sex="{ row }">
<span v-if="row.yjRysfzh"> {{ IdCard(row.yjRysfzh,2) }} </span>
<template #xbdm="{ row }">
<DictTag :value="row.xbdm" :tag="false" :options="D_BZ_XB" />
</template>
<template #age="{ row }">
<span v-if="row.yjRysfzh"> {{ IdCard(row.yjRysfzh,3) }} </span>
<span v-if="row.yjRysfzh"> {{ IdCard(row.yjRysfzh, 3) }} </span>
</template>
<template #yjJb="{ row }">
<DictTag :value="row.yjJb" :tag="false" :options="D_BZ_YJJB" />
</template>
<template #bqdl="{ row }">
<DictTag :value="row.bqdl" :tag="false" :options="D_GS_QLZDRLX" />
<DictTag :value="row.bqdl" :tag="false" :options="D_GS_QLZDRLX" />
</template>
<template #yjLylx="{ row }">
<DictTag :value="row.yjLylx" :tag="false" :options="D_BZ_YJLY" />
<DictTag :value="row.yjLylx" :tag="false" :options="D_BZ_YJLY" />
</template>
<template #yjLx="{ row }">
<DictTag :value="row.yjLx" :tag="false" :options="D_GS_QLZDRYXX" />
<template #yjLx="{ row }">
<DictTag :value="row.yjLx" :tag="false" :options="D_GS_QLZDRYXX" />
</template>
<template #controls="{ row }">
<el-link type="warning" v-if="row.sfbc != '1'" @click="failWarning(row)">报错</el-link>
<el-link type="primary" @click="handleQsSingle(row)">签收</el-link>
<el-link type="primary" @click="particularsOpen(row)">详情</el-link>
<el-link type="warning" @click="pushWarning(row)">指派</el-link>
<el-link type="warning" v-if="row.sfbc != '1'" @click="failWarning(row)">报错</el-link>
<el-link type="primary" @click="payAttention(row)">关注</el-link>
</template>
<template #cszt="{ row }">
<DictTag :value="row.cszt" :tag="false" :options="D_GSXT_YJXX_CZZT" />
</template>
</MyTable>
<Pages @changeNo="changeNo" @changeSize="changeSize" :tableHeight="pageData.tableHeight" :pageConfiger="{
@ -66,7 +62,9 @@
}"></Pages>
</div>
</div>
<ZpForm v-model="warningShow" :dataList="dataList"/>
<ZpForm v-model="warningShow" :dataList="dataList" />
<Particulars v-model="particularsShow" :dataList="dataPres" :dict="{D_BZ_XB,D_BZ_YJJB,D_GS_QLZDRLX,D_GS_ZDR_RYJB,D_GS_ZDR_GJLB}" />
<peopleConut v-model="searchOpen" :dataConut="dataConut" />
</template>
<script setup>
@ -74,6 +72,7 @@ import { getMultiDictVal } from "@/utils/dict.js"
import { exportExlByObj } from "@/utils/exportExcel.js"
import Items from '@/views/backOfficeSystem/fourColorManage/warningList/portraitWarning/item/items.vue'
import ZpForm from "./zpForm.vue";
import Particulars from "./particulars.vue";
import { IdCard } from '@/utils/validate.js'
import Search from "@/components/aboutTable/Search.vue";
import PageTitle from "@/components/aboutTable/PageTitle.vue";
@ -81,25 +80,33 @@ import MyTable from "@/components/aboutTable/MyTable.vue";
import Pages from "@/components/aboutTable/Pages.vue";
import { qcckGet, qcckPost } from "@/api/qcckApi.js";
import { reactive, ref, onMounted, getCurrentInstance, } from "vue";
import peopleConut from "./peopleConut.vue";
const { proxy } = getCurrentInstance();
const { D_BZ_YJLY,D_GS_QLZDRLX,D_BZ_YJJB, D_GS_QLZDRYXX,D_BZ_XB,D_GSXT_YJXX_CZZT } = proxy.$dict('D_BZ_YJLY','D_GS_QLZDRLX',"D_BZ_YJJB", "D_GS_QLZDRYXX", "D_BZ_XB","D_GSXT_YJXX_CZZT"); //获取字典数据
const { D_BZ_YJLY, D_GS_QLZDRLX, D_GS_ZDR_GJLB, D_BZ_YJJB, D_GS_CSZT, D_GS_QLZDRYXX, D_BZ_XB, D_GSXT_YJXX_CZZT, D_GS_ZDR_RYJB } = proxy.$dict('D_BZ_YJLY', 'D_GS_QLZDRLX', "D_BZ_YJJB", "D_GS_QLZDRYXX", "D_BZ_XB", "D_GSXT_YJXX_CZZT", "D_GS_ZDR_RYJB", 'D_GS_ZDR_GJLB', 'D_GS_CSZT'); //获取字典数据
const searchBox = ref(); //搜索框
const warningShow = ref(false);
const dataList = ref([]);
const searchConfiger = ref(
[
{ label: "预警时间xx", prop: 'startTime', showType: "datetimerange", placeholder: "请选择预警时间" },
{ label: "预警级别", prop: 'yjJb', placeholder: "请选择预警级别", showType: "select", options: D_BZ_YJJB, multiple: true },
{ label: "接收单位", prop: 'ssbmdm', showType: "department" },
{ prop: 'sfglyj', showType: "checkbox", showSelectAll: false, options: [{ label: '关联预警', value: '1' }] },
{ prop: 'sfgz', showType: "checkbox", showSelectAll: false, options: [{ label: '重点关注', value: '1' }] },
{ prop: 'sfzp', showType: "checkbox", showSelectAll: false, options: [{ label: '二次指派', value: '1' }] },
{label: "超时状态", prop: 'cszt', placeholder: "请选择超时状态", showType: "select", options: D_GS_CSZT},
{ label: "人员类别", prop: 'bqdl', placeholder: "请选择人员类别", showType: "select", options: D_GS_QLZDRLX },
{ label: "预警次数", prop: 'yjCs', placeholder: "请输入预警次数", showType: "number" },
{ label: "人员级别", prop: 'yjJb', showType: "select", options: D_GS_ZDR_RYJB },
{ label: "轨迹类别", prop: 'yjLylx', showType: "select", options: D_GS_ZDR_GJLB },
{ label: "姓名", prop: 'yjRyxm', placeholder: "请输入姓名", showType: "input" },
// { label: "年龄段", prop: 'age', placeholder: "请输入身份证号码", showType: "Slot" },
{ label: "性别", prop: 'xbdm', placeholder: "请选择性别", showType: "select", options: D_BZ_XB },
{ label: "身份证", prop: 'yjRysfzh', placeholder: "请输入身份证号码", showType: "input" },
{ label: "预警时间", prop: 'times', showType: "datetimerange" },
{ label: "状态", prop: 'czzt', placeholder: "请选择状态", showType: "select", options: D_GSXT_YJXX_CZZT },
{ label: "人员类别", prop: 'bqdl', placeholder: "请选择人员类别", showType: "select", options: D_GS_QLZDRLX },
{ label: "细类", prop: 'yjbqmc', placeholder: "请输入细类", showType: "input" },
{ label: "活动发生地址", prop: 'yjDz', placeholder: "请输入活动发生地址", showType: "input" },
{ label: "接收单位", prop: 'ssbmdm',showType: "department" },
]);
{ label: "开始年龄", prop: 'ksnl', placeholder: "请输入年龄", showType: "number" },
{ label: "结束年龄", prop: 'jsnl', placeholder: "请输入年龄", showType: "number" },
{ label: "活动发生地", prop: 'yjDz', placeholder: "请输入活动发生地", showType: "input" },
{ label: "人员细类", prop: 'yjbqmc', placeholder: "请输入人员细类", showType: "input" },
])
const queryFrom = ref({});
const pageData = reactive({
tableData: [], //表格数据
@ -115,21 +122,22 @@ const pageData = reactive({
pageSize: 20,
pageCurrent: 1
}, //分页
controlsWidth: 160, //操作栏宽度
controlsWidth: 200, //操作栏宽度
tableColumn: [
{ label: "状态", prop: "czzt", showSolt: true },
{ label: "预警时间", prop: "yjSj" },
{ label: "预警状态", prop: "czzt", showSolt: true, width: 70 },
{ label: "预警时间", prop: "yjSj", width: 148 },
{ label: "人员姓名", prop: "yjRyxm", },
{ label: "身份证号", prop: "yjRysfzh", },
{ label: "性别", prop: "sex" ,showSolt: true },
{ label: "年龄", prop: "age", showSolt: true },
{ label: "预警级别", prop: "yjJb", showSolt: true },
{ label: "人员类别", prop: "bqdl", showSolt: true },
{ label: "细类", prop: "yjbqmc" },
{ label: "身份证号", prop: "yjRysfzh", width: 148 },
{ label: "性别", prop: "xbdm", showSolt: true, width: 60 },
{ label: "年龄", prop: "age", showSolt: true, width: 50 },
{ label: "级别", prop: "yjJb", showSolt: true, width: 50 },
{ label: "人员类别", prop: "bqdl", showSolt: true, width: 100 },
{ label: "人员细类", prop: "yjbqmc" },
{ label: "轨迹类别", prop: "yjLylx", showSolt: true },
{ label: "活动发生地", prop: "yjDz" },
{ label: "接收单位", prop: "ssbm" },
{ label: "预警次数", prop: "yjCs" },
{ label: "接收单位", prop: "ssbm", width: 148 },
{ label: "次数", prop: "yjCs", width: 50 },
{ label: "超时状态", prop: "cszt" },
]
});
@ -140,9 +148,12 @@ onMounted(() => {
// 搜索
const onSearch = (val) => {
queryFrom.value = { ...val }
queryFrom.value.startTime = val.times ? val.times[0] : ''
queryFrom.value.endTime = val.times ? val.times[1] : ''
queryFrom.value = { ...val, yjJb: val.yjJb?.join(',') || '' }
queryFrom.value.startTime = val.startTime ? val.startTime[0] : ''
queryFrom.value.endTime = val.startTime ? val.startTime[1] : ''
queryFrom.value.sfglyj = val.sfglyj?.join(',') || ''
queryFrom.value.sfgz = val.sfgz?.join(',') || ''
queryFrom.value.sfzp = val.sfzp?.join(',') || ''
pageData.pageConfiger.pageCurrent = 1;
getList()
}
@ -177,15 +188,14 @@ const pushWarning = (val) => {
}
const failWarning = (val) => {
let ids = [val.id]
qcckPost({ids}, '/mosty-gsxt/tbYjxx/yjbc').then((res) => {
proxy.$message({ type: "success", message: "成功" });
getList();
}).catch(() => {
proxy.$message({ type: "error", message: "失败" });
});
let ids = [val.id]
qcckPost({ ids }, '/mosty-gsxt/tbYjxx/yjbc').then((res) => {
proxy.$message({ type: "success", message: "成功" });
getList();
}).catch(() => {
proxy.$message({ type: "error", message: "失败" });
});
}
@ -220,16 +230,16 @@ const exportExl = () => {
})
exportExlByObj(titleObj, data, '七类重点')
}
// 批量签收
const handleQs = () => {
if (selectRows.value?.length === 0) return proxy.$message({ type: "warning", message: "请选择要签收的预警" });
if (selectRows.value?.length === 0) return proxy.$message({ type: "warning", message: "请选择要签收的预警" });
let wqs = selectRows.value.filter(item => item.czzt == '01');
if (wqs.length == 0) return proxy.$message({ type: "warning", message: "数据都已签收，请选择未签收的数据" });
let yqs = selectRows.value.filter(item => item.czzt == '02');
let texy = yqs.length > 0 ? `${yqs.length}条已签收预警数据，确认要签收${wqs.length}条未签收预警数据吗？` : '确认要签收所有预警数据吗？'
proxy.$confirm(texy, "警告", { type: "warning" }).then(() => {
let ids = wqs.map(item => item.id)
qcckPost({ids}, '/mosty-gsxt/tbYjxx/batchQs').then(() => {
qcckPost({ ids }, '/mosty-gsxt/tbYjxx/batchQs').then(() => {
proxy.$message({ type: "success", message: "成功" });
getList();
}).catch(() => {
@ -237,7 +247,68 @@ const handleQs = () => {
});
}).catch(() => { });
}
// 详情
const dataPres=ref({})
const particularsShow = ref(false);
const particularsOpen = (row) => {
dataPres.value = row
particularsShow.value = true;
}
// 单条签收
const handleQsSingle = (row) => {
if (row.czzt == '02') return proxy.$message({ type: "warning", message: "数据已签收，无需重复签收" });
proxy.$confirm('确认要签收该条预警数据吗？', "警告", { type: "warning" }).then(() => {
qcckPost({ ids: [row.id] }, '/mosty-gsxt/tbYjxx/batchQs').then(() => {
proxy.$message({ type: "success", message: "成功" });
getList();
}).catch(() => {
proxy.$message({ type: "error", message: "失败" });
});
}).catch(() => { });
}
// 关注
const payAttention = (row) => {
let promes = {}
if (row.sfgz == '1') {
promes.sfgz = '0'
promes.msg = '取消关注'
} else {
promes.sfgz = '1'
promes.msg = '关注'
}
proxy.$confirm('确认要关注该条预警数据吗？', "警告", { type: "warning" }).then(() => {
qcckPost({ sfgz: promes.sfgz, id: row.id }, '/mosty-gsxt/tbYjxx/yjgz').then(() => {
proxy.$message({ type: "success", message: `${promes.msg}成功` });
getList();
}).catch(() => {
proxy.$message({ type: "error", message: `${promes.msg}失败` });
});
}).catch(() => { });
}
// 人数计算
const searchDom = ref(null)
const dataConut = ref(0)
const searchOpen=ref(false)
const countPeople = () => {
const promes = {
...searchDom.value.searchObj,
yjJb: searchDom.value.searchObj.yjJb?.join(',') || '',
startTime: searchDom.value.searchObj.startTime ? searchDom.value.searchObj.startTime[0] : '',
endTime: searchDom.value.searchObj.endTime ? searchDom.value.searchObj.endTime[1] : '',
sfglyj: searchDom.value.searchObj.sfglyj?.join(',') || '',
sfgz: searchDom.value.searchObj.sfgz?.join(',') || '',
sfzp: searchDom.value.searchObj.sfzp?.join(',') || '',
}
qcckPost(promes, '/mosty-gsxt/tbYjxx/bkyjQctj').then((res) => {
dataConut.value = res || 0
searchOpen.value=true
}).catch(() => {
// proxy.$message({ type: "error", message: `${promes.msg}失败` });
});
}
// 表格高度计算
const tabHeightFn = () => {
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 290;
@ -245,8 +316,16 @@ const tabHeightFn = () => {
};
</script>
<style>
<style lang="scss" scoped>
.el-loading-mask {
background: rgba(0, 0, 0, 0.5) !important;
}
::v-deep .el-table .cell {
padding: 0;
}
::v-deep .el-table .el-table__cell {
padding: 4px 0;
}
</style>

472
src/views/backOfficeSystem/fourColorManage/warningControl/sevenWarning/particulars.vue Normal file
View File

@ -0,0 +1,472 @@
<!--预警指派展示组件 -->
<template>
<el-dialog :draggable="true" :model-value="modelValue" :title="title" :width="width" @close="close" append-to-body>
<div class="archive-container" v-loading="loading">
<div class="three-column-layout">
<!-- 重点人员基本信息页 -->
<div class="column">
<div class="column-header">重点人员基本信息页</div>
<div class="info-section">
<div class="info-row">
<div class="info-item">
<span class="info-label">人员姓名：</span>
<span class="info-value">{{ dataForm.yjRyxm }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item">
<span class="info-label">性别：</span>
<span class="info-value">
<DictTag :value="dataForm.xbdm" :tag="false" :options="dict.D_BZ_XB" />
</span>
</div>
</div>
<div class="info-row">
<div class="info-item">
<span class="info-label">年龄：</span>
<span class="info-value">{{ dataForm.nl }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">身份证号码：</span>
<span class="info-value">{{ dataForm.yjRysfzh }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">户籍地：</span>
<span class="info-value">{{ dataForm.hjdXz }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">现住地址：</span>
<span class="info-value">{{ dataForm.xzdXz }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item">
<span class="info-label">入库时间：</span>
<span class="info-value">{{ dataForm.zdrRkkssj }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item">
<span class="info-label">预警级别：</span>
<span class="info-value warning-level" :class="ys()">
<DictTag :value="dataForm.yjJb" :tag="false" :options="dict.D_BZ_YJJB" />
</span>
</div>
</div>
<div class="info-row">
<div class="info-item">
<span class="info-label">人员类别：</span>
<span class="info-value">
<DictTag :value="dataForm.bqdl" :tag="false" :options="dict.D_GS_QLZDRLX" />
</span>
</div>
</div>
<div class="info-row">
<div class="info-item">
<span class="info-label">人员级别：</span>
<span class="info-value">
<DictTag :value="dataForm.yjJb" :tag="false" :options="dict.D_GS_ZDR_RYJB" />
</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">人员细类：</span>
<span class="info-value">{{ dataForm.yjbqmc }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">立案单位：</span>
<span class="info-value"></span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">简要案情：</span>
<span class="info-value text-area"></span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">一标三实：</span>
<span class="info-value text-area"></span>
</div>
</div>
</div>
</div>
<!-- 重点人员活动信息页 -->
<div class="column">
<div class="column-header">重点人员活动信息页</div>
<div class="info-section blue-bg">
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">轨迹类别：</span>
<span class="info-value">
<DictTag :value="dataForm.yjLylx" :tag="false" :options="dict.D_GS_ZDR_GJLB" />
</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">核查时间：</span>
<span class="info-value">
<span v-if="dataForm.fkList && dataForm.fkList.length > 0">{{ dataForm.fkList[0].czsj }}</span>
</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">比对时间：</span>
<span class="info-value">{{ dataForm.yjSj }}</span>
</div>
</div>
<!-- <div class="info-row">
<div class="info-item full-width">
<span class="info-label">活动发生地：</span>
<span class="info-value">{{ dataForm.xxdz }}</span>
</div>
</div> -->
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">活动场所：</span>
<span class="info-value">
<span v-if="dataForm.fkList && dataForm.fkList.length > 0">{{ dataForm.fkList[0].xxdz }}</span>
</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">活动信息：</span>
<span class="info-value">{{ dataForm.yjNr }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">信息提供单位：</span>
<span class="info-value">{{ dataForm.jczmc }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">信息接收单位：</span>
<span class="info-value">{{ dataForm.ssbm }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">二次指派单位：</span>
<span class="info-value">
<div v-if="dataForm.zpList && dataForm.zpList.length > 0">
<span v-for="(item, index) in dataForm.zpList" :key="item.id">
{{ item.zpbm }}<span v-if="index < dataForm.zpList.length - 1">,</span>
</span>
</div>
</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">签收时限：</span>
<span class="info-value">{{ dataForm.qssj }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">反馈时限：</span>
<span class="info-value">{{ dataForm.fksj }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">处置建议：</span>
<span class="info-value">
<div v-if="dataForm.czjyList && dataForm.czjyList.length > 0">
<div v-for="(item, index) in dataForm.czjyList" :key="item.id">
<span>{{ `${index + 1}、` + item.jynr }}</span>
</div>
</div>
</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">反馈内容：</span>
<span class="info-value">
<div v-if="dataForm.fkList && dataForm.fkList.length > 0">
<div v-for="(item, index) in dataForm.fkList" :key="item.id">
<span v-if="item.ckczbcxx">{{ `${index + 1}、` + item.ckczbcxx }}</span>
</div>
</div>
</span>
</div>
</div>
</div>
</div>
<!-- 历史预警信息页 -->
<div class="column">
<div class="column-header">历史预警信息页</div>
<div class="info-section">
<div class="history-item" v-for="(item, index) in dataForm.yjgjList" :key="item.id">
<span class="history-index">{{ `${index + 1}：` }}</span>
<span class="history-content">{{ item.yjNr }}</span>
</div>
</div>
</div>
</div>
</div>
<template #footer>
<div class="dialog-footer" style="text-align: center;">
<el-button @click="close">关闭</el-button>
</div>
</template>
</el-dialog>
</template>
<script setup>
import { defineProps, getCurrentInstance, watch, ref } from 'vue';
import { qcckGet } from '@/api/qcckApi.js'
const { proxy } = getCurrentInstance();
const props = defineProps({
modelValue: {
type: Boolean,
default: false
},
title: {
type: String,
default: '预警详情'
},
width: {
type: String,
default: '90%'
}, dataList: {
type: Object,
default: () => ({})
},
dict: {
type: Object,
default: () => ({})
}
});
// 定义事件
const emit = defineEmits(['update:modelValue']);
const loading = ref(false)
let abortController = null
const close = () => {
if (abortController) {
abortController.abort()
abortController = null
}
loading.value = false
emit('update:modelValue', false);
};
const dataForm = ref({});
watch(() => props.modelValue, (newVal) => {
if (newVal) {
getPart(props.dataList.id)
}
}, { deep: true });
const getPart = (id) => {
if (abortController) {
abortController.abort()
}
abortController = new AbortController()
loading.value = true
qcckGet({}, `/mosty-gsxt/tbYjxx/getInfo/${id}`, { signal: abortController.signal }).then(res => {
if (res) {
dataForm.value = res
} else {
dataForm.value = {}
}
}).catch(err => {
if (err.name !== 'AbortError') {
console.error('请求失败:', err)
}
}).finally(() => {
loading.value = false
})
}
const ys = () => {
switch (dataForm.value.yjJb) {
case '01':
return 'red';
case '02':
return 'orange';
case '03':
return 'yellow';
case '04':
return 'blue';
default:
return '';
}
}
</script>
<style scoped>
.archive-container {
padding: 20px;
height: 600px;
overflow-y: auto;
}
.three-column-layout {
display: flex;
gap: 20px;
height: 100%;
}
.column {
flex: 1;
display: flex;
flex-direction: column;
min-width: 300px;
}
.column-header {
font-size: 16px;
font-weight: bold;
margin-bottom: 15px;
padding: 10px;
background: #f0f2f5;
border: 1px solid #e4e7ed;
border-radius: 4px 4px 0 0;
text-align: center;
color: #303133;
}
.column .info-section {
flex: 1;
border-radius: 0 0 4px 4px;
overflow-y: auto;
}
.info-section {
border: 1px solid #e4e7ed;
border-radius: 4px;
padding: 15px;
background: #ffffff;
}
.info-section.blue-bg {
background: #e6f0f8;
border-color: #9ed7ff;
}
.info-row {
display: flex;
flex-wrap: wrap;
margin-bottom: 12px;
}
.info-item {
flex: 1;
min-width: 300px;
display: flex;
align-items: center;
}
.info-item.full-width {
flex: 100%;
min-width: 100%;
}
.info-label {
width: 80px;
font-weight: bold;
margin-right: 10px;
white-space: nowrap;
color: #333;
}
.info-value {
flex: 1;
padding: 4px 8px;
border: 1px solid #dcdfe6;
border-radius: 4px;
background: #ffffff;
min-height: 28px;
display: flex;
align-items: center;
}
.info-value.text-area {
min-height: 80px;
align-items: flex-start;
padding: 8px;
resize: vertical;
}
/* 红 */
.warning-level.red {
background: #fef0f0;
border-color: #ffccc7;
color: #f56c6c !important;
font-weight: bold;
}
/* 橙 */
.warning-level.orange {
background: #fffbe6;
border-color: #ffe58f;
color: #d48806 !important;
font-weight: bold;
}
/* 黄 */
.warning-level.yellow {
background: #fdf6ec;
border-color: #faecd8;
color: #e6a23c !important;
font-weight: bold;
}
/* 蓝 */
.warning-level.blue {
background: #ecf5ff;
border-color: #d9ecff;
color: #409eff !important;
font-weight: bold;
}
.history-item {
margin-bottom: 10px;
padding: 8px 12px;
border: 1px solid #e4e7ed;
border-radius: 4px;
background: #ffffff;
display: flex;
/* align-items: center; */
}
.history-index {
font-weight: bold;
margin-right: 10px;
color: #409eff;
}
.history-content {
flex: 1;
color: #606266;
}
.demo-tabs {
margin-bottom: 20px;
}
::v-deep .el-tabs__header {
margin-bottom: 20px;
}
::v-deep .el-tabs__content {
min-height: 400px;
}
</style>

80
src/views/backOfficeSystem/fourColorManage/warningControl/sevenWarning/peopleConut.vue Normal file
View File

@ -0,0 +1,80 @@
<!--预警指派展示组件 -->
<template>
<el-dialog :draggable="true" :model-value="modelValue" :title="title" :width="width" @close="close" append-to-body>
<div class="count-container">
<div class="count-number">{{dataConut}}</div>
<div class="count-label">预警人数</div>
</div>
<template #footer>
<div class="dialog-footer" style="text-align: center;">
<el-button @click="close">关闭</el-button>
</div>
</template>
</el-dialog>
</template>
<script setup>
import { defineProps,getCurrentInstance } from 'vue';
const { proxy } = getCurrentInstance();
const props = defineProps({
modelValue: {
type: Boolean,
default: false
},
title: {
type: String,
default: '人数查询'
},
dataConut: {
type: Number,
default: 0
},width: {
type: String,
default: '20%'
},
});
// 定义事件
const emit = defineEmits(['update:modelValue']);
const close = () => {
emit('update:modelValue', false);
};
</script>
<style scoped>
.count-container {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 40px 0;
text-align: center;
}
.count-number {
font-size: 48px;
font-weight: bold;
color: #409eff;
margin-bottom: 16px;
text-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
animation: pulse 2s infinite;
}
.count-label {
font-size: 18px;
color: #606266;
font-weight: 500;
}
@keyframes pulse {
0% {
transform: scale(1);
}
50% {
transform: scale(1.05);
}
100% {
transform: scale(1);
}
}
</style>

9
src/views/backOfficeSystem/fourColorManage/warningControl/sevenWarningFail/index.vue
View File

@ -3,13 +3,7 @@
<!-- 搜索 -->
<div ref="searchBox" class="mt10 mb10">
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount">
<template #age="{ row }">
<div class="ageBox">
<el-input v-model="queryFrom.age_s" placeholder="开始年龄" type="number" :min="1" :max="100" style="width: 102px;"></el-input>
<span style="color: #333;" class="ml5 mr5">至</span>
<el-input v-model="queryFrom.age_b" placeholder="结束年龄" type="number" :min="parseInt(queryFrom.age_s)+1" :max="100" style="width: 102px;"></el-input>
</div>
</template>
</Search>
</div>
<!-- 表格 -->
@ -64,7 +58,6 @@ const searchBox = ref(); //搜索框
const searchConfiger = ref(
[
{ label: "姓名", prop: 'yjRyxm', placeholder: "请输入姓名", showType: "input" },
// { label: "年龄段", prop: 'age', placeholder: "请输入身份证号码", showType: "Slot" },
{ label: "性别", prop: 'xbdm', placeholder: "请选择性别", showType: "select", options: D_BZ_XB },
{ label: "身份证", prop: 'yjRysfzh', placeholder: "请输入身份证号码", showType: "input" },
{ label: "预警时间", prop: 'times', showType: "datetimerange" },

348
src/views/backOfficeSystem/fourColorManage/warningControl/wrjWarning/components/particulars.vue Normal file
View File

@ -0,0 +1,348 @@
<!--预警指派展示组件 -->
<template>
<el-dialog :draggable="true" :model-value="modelValue" :title="title" :width="width" @close="close" append-to-body>
<div class="archive-container">
<div class="three-column-layout">
<!-- 重点人员基本信息页 -->
<div class="column">
<div class="column-header">重点人员基本信息页</div>
<div class="info-section">
<div class="info-row">
<div class="info-item">
<span class="info-label">人员姓名：</span>
<span class="info-value">曾海峰</span>
</div>
<div class="info-item">
<span class="info-label">年龄：</span>
<span class="info-value">32</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">身份证号码：</span>
<span class="info-value">513701199606095613</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">户籍地：</span>
<span class="info-value">四川省成都市xx县大坝村2组</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">户籍地：</span>
<span class="info-value">四川省成都市xx县大坝村2组</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">现住地址：</span>
<span class="info-value">四川省成都市xx县大坝村2组</span>
</div>
</div>
<div class="info-row">
<div class="info-item">
<span class="info-label">入库时间：</span>
<span class="info-value">2015年3月11日</span>
</div>
<div class="info-item">
<span class="info-label">预警级别：</span>
<span class="info-value warning-level">黄色</span>
</div>
</div>
<div class="info-row">
<div class="info-item">
<span class="info-label">人员类别：</span>
<span class="info-value">刑事前科类</span>
</div>
<div class="info-item">
<span class="info-label">人员级别：</span>
<span class="info-value">部级</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">人员细类：</span>
<span class="info-value">盗窃案</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">立案单位：</span>
<span class="info-value">四川省成都市xx县公安局</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">简要案情：</span>
<span class="info-value text-area"></span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">一标三实：</span>
<span class="info-value text-area"></span>
</div>
</div>
</div>
</div>
<!-- 无人机信息页 -->
<div class="column">
<div class="column-header">无人机信息页</div>
<div class="info-section blue-bg">
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">生产厂商名称：</span>
<span class="info-value">大疆</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">产品名称：</span>
<span class="info-value"></span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">产品型号：</span>
<span class="info-value"></span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">产品类别：</span>
<span class="info-value"></span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">产品类型：</span>
<span class="info-value"></span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">空机重量：</span>
<span class="info-value"></span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">最大起飞重量：</span>
<span class="info-value"></span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">使用用途：</span>
<span class="info-value"></span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">报批区域：</span>
<span class="info-value"></span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">预警信息接收单位：</span>
<span class="info-value">波密县公安局</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">处置建议：</span>
<span class="info-value text-area">请波密县公安局与xxx预警一起研判，排除xx风险。</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">反馈内容：</span>
<span class="info-value text-area">经核查，已排除xxxxxxx风险。</span>
</div>
</div>
</div>
</div>
<!-- 历史预警信息页 -->
<div class="column">
<div class="column-header">历史预警信息页</div>
<div class="info-section">
<div class="history-item">
<span class="history-index">01：</span>
<span class="history-content">2026年2月19日 10：34：02 预警内容</span>
</div>
<div class="history-item">
<span class="history-index">02：</span>
<span class="history-content">2026年2月19日 10：34：02 预警内容</span>
</div>
<div class="history-item">
<span class="history-index">03：</span>
<span class="history-content">2026年2月19日 10：34：02 预警内容</span>
</div>
</div>
</div>
</div>
</div>
<template #footer>
<div class="dialog-footer" style="text-align: center;">
<el-button type="primary">确定</el-button>
<el-button @click="close">关闭</el-button>
</div>
</template>
</el-dialog>
</template>
<script setup>
import { defineProps,getCurrentInstance } from 'vue';
const { proxy } = getCurrentInstance();
const props = defineProps({
modelValue: {
type: Boolean,
default: false
},
title: {
type: String,
default: '预警详情'
},
width: {
type: String,
default: '90%'
},
});
// 定义事件
const emit = defineEmits(['update:modelValue']);
const close = () => {
emit('update:modelValue', false);
};
</script>
<style scoped>
.archive-container {
padding: 0;
max-height: 600px;
overflow-y: auto;
}
.three-column-layout {
display: flex;
height: 100%;
border: 1px solid #dcdfe6;
}
.column {
flex: 1;
display: flex;
flex-direction: column;
min-width: 300px;
border-right: 1px solid #dcdfe6;
}
.column:last-child {
border-right: none;
}
.column-header {
font-size: 16px;
font-weight: bold;
padding: 8px;
background: #f0f2f5;
color: #303133;
text-align: center;
border-bottom: 1px solid #dcdfe6;
}
.column .info-section {
flex: 1;
overflow-y: auto;
padding: 10px;
}
.info-section {
background: #ffffff;
}
.info-section.blue-bg {
background: #e6f7ff;
border-right: 1px solid #dcdfe6;
}
.info-row {
display: flex;
flex-wrap: wrap;
margin-bottom: 10px;
}
.info-item {
flex: 1;
min-width: 140px;
display: flex;
align-items: center;
margin-right: 10px;
}
.info-item.full-width {
flex: 100%;
min-width: 100%;
margin-right: 0;
}
.info-label {
font-weight: bold;
margin-right: 8px;
white-space: nowrap;
color: #333;
font-size: 14px;
}
.info-value {
flex: 1;
padding: 4px 8px;
border: 1px solid #dcdfe6;
border-radius: 4px;
background: #ffffff;
min-height: 28px;
display: flex;
align-items: center;
font-size: 14px;
}
.info-value.text-area {
min-height: 60px;
align-items: flex-start;
padding: 8px;
resize: vertical;
}
.info-value.warning-level {
background: #fffbe6;
border-color: #ffe58f;
color: #d48806;
font-weight: bold;
}
.history-item {
margin-bottom: 8px;
padding: 6px 10px;
border: 1px solid #e4e7ed;
border-radius: 4px;
background: #ffffff;
display: flex;
align-items: center;
font-size: 14px;
}
.history-index {
font-weight: bold;
margin-right: 8px;
color: #409eff;
}
.history-content {
flex: 1;
color: #606266;
}
</style>

71
src/views/backOfficeSystem/fourColorManage/warningControl/wrjWarning/index.vue
View File

@ -102,6 +102,7 @@
<ZpForm v-model="warningShow" :dataList="dataList"/>
<!-- 反馈 -->
<FkDialog @change="getList" />
<Pagination v-model="paginationOpen" />
</template>
<script setup>
@ -126,10 +127,11 @@ import Pages from "@/components/aboutTable/Pages.vue";
import PageTitle from "@/components/aboutTable/PageTitle.vue";
import Search from "@/components/aboutTable/Search.vue";
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
import Pagination from "./components/particulars.vue";
const ORDIMG = 'https://89.40.7.122:38496/image'
const IMGYM = 'https://sg.lz.dsj.xz/dhimage'
const { proxy } = getCurrentInstance();
const { D_GSXT_YJXX_CZZT,D_GS_QLZDRLX, D_BZ_YJJB, D_BZ_YJLYXT, D_BZ_YJLY, D_BZ_XB } = proxy.$dict("D_GSXT_YJXX_CZZT",'D_GS_QLZDRLX ', "D_BZ_YJJB", "D_BZ_YJLYXT", "D_BZ_YJLY", "D_BZ_XB")
const { D_GSXT_YJXX_CZZT,D_GS_QLZDRLX, D_BZ_YJJB, D_BZ_YJLYXT, D_BZ_YJLY, D_BZ_XB ,D_GS_CSZT} = proxy.$dict("D_GSXT_YJXX_CZZT",'D_GS_QLZDRLX ', "D_BZ_YJJB", "D_BZ_YJLYXT", "D_BZ_YJLY", "D_BZ_XB","D_GS_CSZT")
const searchBox = ref(); //搜索框
const roleCode = ref(false)
const czjyRef = ref()
@ -140,16 +142,28 @@ const dataList = ref([])
const showDialog = ref(false)// 发送指令
const assessShow = ref(false)// 全息档案
const searchConfiger = ref(
[
{ label: "布控人员", prop: 'yjRyxms', showType: "Slot" },
{ label: "性别", prop: 'xbdm', placeholder: "请选择性别", showType: "select", options: D_BZ_XB },
{ label: "身份证", prop: 'yjRysfzh', placeholder: "请输入身份证号码", showType: "input" },
{ label: "预警时间", prop: 'times', showType: "datetimerange" },
{ label: "状态", prop: 'czzt', placeholder: "请选择状态", showType: "select", options: D_GSXT_YJXX_CZZT },
// { label: "人员类别", prop: 'bqdl', placeholder: "请选择人员类别", showType: "select", options: D_GS_QLZDRLX },
{ label: "细类", prop: 'yjbqmc', placeholder: "请输入细类", showType: "input" },
{ label: "活动发生地址", prop: 'yjDz', placeholder: "请输入活动发生地址", showType: "input" },
{ label: "接收单位", prop: 'ssbmdm',showType: "department" },
[
{ label: "预警时间", prop: 'times', showType: "datetimerange" },
{ label: "超时状态", prop: 'cszt', placeholder: "请选择超时状态", showType: "select", options: D_GS_CSZT },
{ label: "比中项", prop: 'yjLx', showType: "checkbox", showSelectAll: true, options: [{ label: '人员', value: '1', }, { label: '车辆', value: '2', }] },
{ label: "预警级别", prop: 'yjJb', showType: "select", options: D_BZ_YJJB, placeholder: "请选择预警级别", multiple: true },
{ label: "人员类别", prop: 'yjJb', showType: "select", options: D_BZ_YJJB, placeholder: "请选择预警级别", multiple: true },
{ label: "接收单位", prop: 'ssbmdm', placeholder: "请选择接收单位", showType: "department" },
{ label: "放飞开始时间", prop: 'bkkssj', showType: "date", placeholder: "请选择放飞开始时间" },
{ label: "放飞结束时间", prop: 'bkjssj', showType: "date", placeholder: "请选择放飞结束时间" },
{ label: "无人机型号", prop: 'xm', placeholder: "请输入无人机型号", showType: "input" },
{ label: "手机号码", prop: 'mobile', placeholder: "请输入手机号码", showType: "input" },
{ label: "姓名", prop: 'xm', placeholder: "请输入姓名", showType: "input" },
{ label: "放飞区域", prop: 'xm', placeholder: "请输入放飞区域", showType: "input" },
{ label: "身份证号码", prop: 'sfzh', placeholder: "请输入身份证号码", showType: "input" },
// { label: "布控人员", prop: 'yjRyxms', showType: "Slot" },
// { label: "性别", prop: 'xbdm', placeholder: "请选择性别", showType: "select", options: D_BZ_XB },
// { label: "身份证", prop: 'yjRysfzh', placeholder: "请输入身份证号码", showType: "input" },
// { label: "预警时间", prop: 'times', showType: "datetimerange" },
// { label: "状态", prop: 'czzt', placeholder: "请选择状态", showType: "select", options: D_GSXT_YJXX_CZZT },
// { label: "细类", prop: 'yjbqmc', placeholder: "请输入细类", showType: "input" },
// { label: "活动发生地址", prop: 'yjDz', placeholder: "请输入活动发生地址", showType: "input" },
// { label: "接收单位", prop: 'ssbmdm',showType: "department" },
]);
const pageData = reactive({
tableData: [], //表格数据
@ -166,19 +180,33 @@ const pageData = reactive({
pageSize: 20,
pageCurrent: 1
}, //分页
controlsWidth: 250, //操作栏宽度
controlsWidth: 160, //操作栏宽度
tableColumn: [
{ label: "预警图片", prop: "yjTp", showSolt: true, width: 100 },
{ label: "处置状态", prop: "czzt", showSolt: true },
{ label: "预警时间", prop: "yjSj", showOverflowTooltip: true, width: 200 },
{ label: "姓名", prop: "yjRyxm" },
{ label: "性别", prop: "xb", showSolt: true, width: 80 },
{ label: "年龄", prop: "nl", showSolt: true, width: 80 },
{ label: "数据来源", prop: "yjLylx", showOverflowTooltip: true, showSolt: true },
{ label: "身份证", prop: "yjRysfzh", showOverflowTooltip: true, width: 200 },
{ label: "比重类别", prop: "yjTp", showSolt: true, width: 100 },
{ label: "预警级别", prop: "yjJb", showSolt: true },
{ label: "相似度", prop: "xsd", showSolt: true },
{ label: "所属部门", prop: "ssbm", showOverflowTooltip: true },
{ label: "细类", prop: "czzt", showSolt: true },
{ label: "开始放飞时间", prop: "czzt", showSolt: true },
{ label: "结束放飞时间", prop: "czzt", showSolt: true },
{ label: "飞行时间", prop: "czzt", showSolt: true },
{ label: "放飞区域", prop: "czzt", showSolt: true },
{ label: "无人机类型", prop: "czzt", showSolt: true },
{ label: "手机号", prop: "czzt", showSolt: true },
{ label: "所属单位", prop: "czzt", showSolt: true },
{ label: "超时状态", prop: "czzt", showSolt: true },
// { label: "预警图片", prop: "yjTp", showSolt: true, width: 100 },
// { label: "处置状态", prop: "czzt", showSolt: true },
// { label: "预警时间", prop: "yjSj", showOverflowTooltip: true, width: 200 },
// { label: "姓名", prop: "yjRyxm" },
// { label: "性别", prop: "xb", showSolt: true, width: 80 },
// { label: "年龄", prop: "nl", showSolt: true, width: 80 },
// { label: "数据来源", prop: "yjLylx", showOverflowTooltip: true, showSolt: true },
// { label: "身份证", prop: "yjRysfzh", showOverflowTooltip: true, width: 200 },
// { label: "预警级别", prop: "yjJb", showSolt: true },
// { label: "相似度", prop: "xsd", showSolt: true },
// { label: "所属部门", prop: "ssbm", showOverflowTooltip: true },
]
});
const addFromRefs = ref()
@ -382,6 +410,11 @@ const tabHeightFn = () => {
tabHeightFn();
};
};
// 详情
const paginationOpen=ref(false)
const openBox = (val) => {
paginationOpen.value = true
}
</script>
<style lang="scss">

506
src/views/backOfficeSystem/fourColorManage/warningList/portraitWarning/components/particulars.vue Normal file
View File

@ -0,0 +1,506 @@
<!--预警指派展示组件 -->
<template>
<el-dialog :draggable="true" :model-value="modelValue" :title="title" :width="width" @close="close" append-to-body>
<div class="archive-container" v-loading="loading" >
<div class="three-column-layout">
<!-- 重点人员基本信息页 -->
<div class="column">
<div class="column-header">重点人员基本信息</div>
<div class="info-section">
<div class="info-row">
<div class="info-item">
<span class="info-label">人员姓名：</span>
<span class="info-value">{{ dataForm.yjRyxm }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item">
<span class="info-label">性别：</span>
<span class="info-value">
<DictTag :value="dataForm.xbdm" :tag="false" :options="dict.D_BZ_XB" />
</span>
</div>
</div>
<div class="info-row">
<div class="info-item">
<span class="info-label">年龄：</span>
<span class="info-value">{{ dataForm.nl }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">身份证号码：</span>
<span class="info-value">{{ dataForm.yjRysfzh }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">户籍地：</span>
<span class="info-value">{{ dataForm.hjdXz }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">现住地址：</span>
<span class="info-value">{{ dataForm.xzdXz }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item">
<span class="info-label">入库时间：</span>
<span class="info-value">{{ dataForm.zdrRkkssj }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item">
<span class="info-label">预警级别：</span>
<span class="info-value warning-level" :class="ys()">
<DictTag :value="dataForm.yjJb" :tag="false" :options="dict.D_BZ_YJJB" />
</span>
</div>
</div>
<div class="info-row">
<div class="info-item">
<span class="info-label">人员类别：</span>
<span class="info-value">
<DictTag :value="dataForm.bqdl" :tag="false" :options="dict.D_GS_QLZDRLX" />
</span>
</div>
</div>
<div class="info-row">
<div class="info-item">
<span class="info-label">人员级别：</span>
<span class="info-value">
<DictTag :value="dataForm.yjJb" :tag="false" :options="dict.D_GS_ZDR_RYJB" />
</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">人员细类：</span>
<span class="info-value">{{dataForm.yjbqmc }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">立案单位：</span>
<span class="info-value"></span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">简要案情：</span>
<span class="info-value text-area"></span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">一标三实：</span>
<span class="info-value text-area"></span>
</div>
</div>
</div>
</div>
<!-- 重点人员活动信息页 -->
<div class="column">
<div class="column-header">重点人员活动信息</div>
<div class="info-section blue-bg">
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">轨迹类别：</span>
<span class="info-value">
<DictTag :value="dataForm.yjLylx" :tag="false" :options="dict.D_GS_ZDR_GJLB" />
</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">核查时间：</span>
<span class="info-value">
<span v-if="dataForm.fkList && dataForm.fkList.length > 0">{{dataForm.fkList[0].czsj }}</span>
</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">比对时间：</span>
<span class="info-value">{{ dataForm.yjSj }}</span>
</div>
</div>
<!-- <div class="info-row">
<div class="info-item full-width">
<span class="info-label">活动发生地：</span>
<span class="info-value">{{ dataForm.xxdz }}</span>
</div>
</div> -->
<!-- <div class="info-row">
<div class="info-item full-width">
<span class="info-label">活动场所：</span>
<span class="info-value">
<span v-if="dataForm.fkList && dataForm.fkList.length > 0">{{dataForm.fkList[0].xxdz }}</span>
</span>
</div>
</div> -->
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">预警内容：</span>
<span class="info-value">{{ dataForm.yjNr }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">信息提供单位：</span>
<span class="info-value">{{ dataForm.jczmc }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">信息接收单位：</span>
<span class="info-value">{{ dataForm.ssbm }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">二次指派单位：</span>
<span class="info-value">
<div v-if="dataForm.zpList && dataForm.zpList.length > 0">
<span v-for="(item,index) in dataForm.zpList" :key="item.id">
{{ item.zpbm }}<span v-if="index < dataForm.zpList.length - 1">,</span>
</span>
</div>
</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">签收时限：</span>
<span class="info-value">{{ dataForm.qssj }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">反馈时限：</span>
<span class="info-value">{{ dataForm.fksj }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">处置建议：</span>
<span class="info-value">
<div v-if="dataForm.czjyList && dataForm.czjyList.length > 0">
<div v-for="(item,index) in dataForm.czjyList" :key="item.id">
<span>{{`${index+1}、` + item.jynr }}</span>
</div>
</div>
</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">反馈内容：</span>
<span class="info-value">
<div v-if="dataForm.fkList && dataForm.fkList.length > 0">
<div v-for="(item,index) in dataForm.fkList" :key="item.id">
<span v-if="item.ckczbcxx">{{ `${index + 1}、` + item.ckczbcxx }}</span>
</div>
</div>
</span>
</div>
</div>
</div>
</div>
<!-- 历史预警信息页 -->
<div class="column">
<div class="column-header">历史预警信息</div>
<div class="info-section">
<div class="history-item" v-for="(item,index) in dataForm.yjgjList" :key="item.id">
<span class="history-index">{{`${index+1}：`}}</span>
<span class="history-content">{{item.yjNr }}</span>
</div>
</div>
</div>
</div>
</div>
<template #footer>
<div class="dialog-footer" style="text-align: center;">
<el-button @click="close">关闭</el-button>
</div>
</template>
</el-dialog>
</template>
<script setup>
import { defineProps, getCurrentInstance, watch, ref } from 'vue';
import {qcckGet} from '@/api/qcckApi.js'
const { proxy } = getCurrentInstance();
const props = defineProps({
modelValue: {
type: Boolean,
default: false
},
title: {
type: String,
default: '预警详情'
},
width: {
type: String,
default: '90%'
}, dataList: {
type: Object,
default: () => ({})
},
dict: {
type: Object,
default: () => ({})
}
});
// 定义事件
const emit = defineEmits(['update:modelValue']);
const loading = ref(false)
let abortController = null
const close = () => {
if (abortController) {
abortController.abort()
abortController = null
}
loading.value = false
emit('update:modelValue', false);
};
const dataForm = ref({});
watch(() => props.dataList, (newVal) => {
if (newVal) {
getPart(newVal.id)
}
}, { deep: true });
const getPart = (id) => {
if (abortController) {
abortController.abort()
}
abortController = new AbortController()
loading.value = true
qcckGet({},`/mosty-gsxt/tbYjxx/getInfo/${id}`, { signal: abortController.signal }).then(res => {
dataForm.value = res
}).catch(err => {
if (err.name !== 'AbortError') {
console.error('请求失败:', err)
}
}).finally(() => {
loading.value = false
})
}
const ys = () => {
switch (dataForm.value.yjJb) {
case '01':
return 'red';
case '02':
return 'orange';
case '03':
return 'yellow';
case '04':
return 'blue';
default:
return '';
}
}
</script>
<style scoped>
.archive-container {
padding: 20px;
height: 500px;
overflow-y: auto;
}
.three-column-layout {
display: flex;
gap: 20px;
height: 100%;
}
.column {
flex: 1;
display: flex;
flex-direction: column;
min-width: 300px;
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
border-radius: 8px;
overflow: hidden;
}
.column-header {
font-size: 16px;
font-weight: bold;
padding: 10px;
background: #f5f7fa;
color: #303133;
text-align: center;
border-bottom: 1px solid #dcdfe6;
}
.column .info-section {
flex: 1;
overflow-y: auto;
}
.info-section {
padding: 20px;
background: #ffffff;
}
.info-section.blue-bg {
background: #f0f9ff;
border-left: 4px solid #409eff;
}
.info-row {
display: flex;
flex-wrap: wrap;
margin-bottom: 16px;
}
.info-item {
flex: 1;
min-width: 300px;
display: flex;
align-items: center;
}
.info-item.full-width {
flex: 100%;
min-width: 100%;
}
.info-label {
font-weight: 600;
margin-right: 12px;
white-space: nowrap;
color: #303133;
font-size: 14px;
width: 100px;
flex-shrink: 0;
}
.info-value {
flex: 1;
padding: 6px 12px;
border: 1px solid #e4e7ed;
border-radius: 4px;
background: #f8f9fa;
min-height: 32px;
display: flex;
align-items: center;
font-size: 14px;
color: #606266;
transition: all 0.3s ease;
}
.info-value:hover {
border-color: #409eff;
box-shadow: 0 0 0 2px rgba(64, 158, 255, 0.2);
}
.info-value.text-area {
min-height: 100px;
align-items: flex-start;
padding: 10px 12px;
resize: vertical;
line-height: 1.5;
}
/* 红 */
.warning-level.red {
background: #fef0f0;
border-color: #ffccc7;
color: #f56c6c !important;
font-weight: bold;
}
/* 橙 */
.warning-level.orange {
background: #fffbe6;
border-color: #ffe58f;
color: #d48806 !important;
font-weight: bold;
}
/* 黄 */
.warning-level.yellow {
background: #fdf6ec;
border-color: #faecd8;
color: #e6a23c !important;
font-weight: bold;
}
/* 蓝 */
.warning-level.blue {
background: #ecf5ff;
border-color: #d9ecff;
color: #409eff !important;
font-weight: bold;
}
.history-item {
margin-bottom: 12px;
padding: 12px 16px;
border: 1px solid #e4e7ed;
border-radius: 6px;
background: #f8f9fa;
display: flex;
transition: all 0.3s ease;
}
.history-item:hover {
border-color: #409eff;
box-shadow: 0 2px 8px rgba(64, 158, 255, 0.15);
}
.history-index {
font-weight: bold;
margin-right: 12px;
color: #409eff;
font-size: 14px;
min-width: 40px;
}
.history-content {
flex: 1;
color: #606266;
font-size: 14px;
line-height: 1.4;
}
/* 滚动条样式 */
.archive-container::-webkit-scrollbar,
.info-section::-webkit-scrollbar {
width: 8px;
height: 8px;
}
.archive-container::-webkit-scrollbar-track,
.info-section::-webkit-scrollbar-track {
background: #f1f1f1;
border-radius: 4px;
}
.archive-container::-webkit-scrollbar-thumb,
.info-section::-webkit-scrollbar-thumb {
background: #c1c1c1;
border-radius: 4px;
}
.archive-container::-webkit-scrollbar-thumb:hover,
.info-section::-webkit-scrollbar-thumb:hover {
background: #a8a8a8;
}
/* 按钮样式 */
.dialog-footer {
padding: 20px;
background: #f9f9f9;
border-top: 1px solid #e4e7ed;
margin-top: 20px;
border-radius: 0 0 8px 8px;
}
</style>

194
src/views/backOfficeSystem/fourColorManage/warningList/portraitWarning/index.vue
View File

@ -1,37 +1,31 @@
<template>
<div>
<!-- 搜索 -->
<div ref="searchBox">
<Search :searchArr="searchConfiger" @submit="onSearch" @reset="onReset" :key="pageData.keyCount">
<template #yjRyxms>
<el-select clearable v-model="listQuery.yjRyxm" filterable remote allow-create default-first-optionreserve-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>
</template>
</Search>
</div>
<div ref="searchBox">
<Search :searchArr="searchConfiger" @submit="onSearch" @reset="onReset" :key="pageData.keyCount">
<!-- <template #yjRyxms>
<el-select clearable v-model="listQuery.yjRyxm" filterable remote allow-create
default-first-optionreserve-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>
</template> -->
</Search>
</div>
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
<template #left>
<el-button type="primary" size="small" @click="exportExl">导出</el-button>
<el-button type="primary" size="small" @click="handleQs" v-if="permission_sfqs">签收</el-button>
<el-button type="primary" size="small" @click="exportExl">导出</el-button>xxxx
<el-button type="primary" size="small" @click="handleQs" v-if="permission_sfqs">批量签收</el-button>
</template>
</PageTitle>
<!-- 表格 -->
<div class="tabBox tabBox_zdy">
<MyTable
:tableData="pageData.tableData"
:tableColumn="pageData.tableColumn"
:tableHeight="pageData.tableHeight"
:key="pageData.keyCount"
:tableConfiger="pageData.tableConfiger"
:controlsWidth="pageData.controlsWidth"
expand
@chooseData="handleChooseData"
:rowClassName="getRowClassName"
>
<div class="tabBox tabBox_zdy">
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth" expand
@chooseData="handleChooseData" :rowClassName="getRowClassName">
<template #expand="{ props }">
<Items :row="props"/>
<Items :row="props" />
</template>
<template #yjTp="{ row }">
<template v-if="!row.yjTp || row.yjTp.includes('baidu')">
@ -72,16 +66,15 @@
<el-link type="primary" @click="handleCzjy(row)" v-if="roleCode">处置建议</el-link>
<!-- <el-link type="primary" @click="showDetail(row)">转合成</el-link> -->
<el-link type="success" @click="handleQsFk(row, '签收')" v-if="row.czzt == '01' && permission_sfqs">签收</el-link>
<el-link type="success" @click="handleQsFk(row, '反馈')" v-else-if="row.czzt == '02' && permission_sfqs">反馈</el-link>
<el-link type="success" @click="handleQsFk(row, '反馈')"
v-else-if="row.czzt == '02' && permission_sfqs">反馈</el-link>
<!-- <el-link type="success" @click="handleQsFk(row, '查看反馈')" v-else>查看反馈</el-link> -->
<el-link type="primary" @click="openAddFrom(row)">详情</el-link>
<!-- <el-link type="primary" @click="openAddFrom(row)">详情</el-link> -->
<el-link type="primary" @click="pushWarning(row)">指派</el-link>
<el-link type="primary" @click="openBox(row)">详情</el-link>
</template>
</MyTable>
<Pages
@changeNo="changeNo"
@changeSize="changeSize"
:tableHeight="pageData.tableHeight"
<Pages @changeNo="changeNo" @changeSize="changeSize" :tableHeight="pageData.tableHeight"
:pageConfiger="{ ...pageData.pageConfiger, total: pageData.total }">
</Pages>
</div>
@ -91,7 +84,8 @@
<HolographicArchive v-model="assessShow" :dataList="dataList" />
<Information v-model="showDialog" title="发送指令" @submit='submitSendZl' @close='closeFszl'>
<SemdFqzl ref="semdFqzlRef" :itemData="itemData" @handleClose="handleClose" identification="yj" :tacitly="tacitly" />
<SemdFqzl ref="semdFqzlRef" :itemData="itemData" @handleClose="handleClose" identification="yj"
:tacitly="tacitly" />
</Information>
<!-- 详情 -->
@ -99,9 +93,10 @@
<!-- 处置建议 -->
<Czjy ref="czjyRef" @okSubmit="getList"></Czjy>
<!-- 指派 -->
<ZpForm v-model="warningShow" :dataList="dataList"/>
<ZpForm v-model="warningShow" :dataList="dataList" />
<!-- 反馈 -->
<FkDialog @change="getList" />
<Particulars v-model="paginationOpen" :dataList="dataPres" :dict="{D_BZ_XB,D_BZ_YJJB,D_GS_QLZDRLX,D_GS_ZDR_RYJB,D_GS_ZDR_GJLB}" />
</template>
<script setup>
@ -126,10 +121,12 @@ import Pages from "@/components/aboutTable/Pages.vue";
import PageTitle from "@/components/aboutTable/PageTitle.vue";
import Search from "@/components/aboutTable/Search.vue";
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
import SemdFqzl from '@/components/instructionHasBeen/sendFqzl.vue'
import Particulars from "./components/particulars.vue";
const ORDIMG = 'https://89.40.7.122:38496/image'
const IMGYM = 'https://sg.lz.dsj.xz/dhimage'
const { proxy } = getCurrentInstance();
const { D_GSXT_YJXX_CZZT,D_GS_QLZDRLX, D_BZ_YJJB, D_BZ_YJLYXT, D_BZ_YJLY, D_BZ_XB } = proxy.$dict("D_GSXT_YJXX_CZZT",'D_GS_QLZDRLX ', "D_BZ_YJJB", "D_BZ_YJLYXT", "D_BZ_YJLY", "D_BZ_XB")
const { D_GSXT_YJXX_CZZT, D_GS_QLZDRLX, D_GS_BKZT, D_GS_CSZT, D_BZ_BKLYS, D_BZ_YJJB, D_BZ_YJLYXT, D_BZ_YJLY, D_BZ_XB, D_BZ_SF,D_GS_ZDR_RYJB, D_GS_ZDR_GJLB} = proxy.$dict("D_GSXT_YJXX_CZZT", 'D_GS_QLZDRLX ', "D_BZ_YJJB", "D_BZ_YJLYXT", "D_BZ_YJLY", "D_BZ_XB", "D_BZ_BKLYS", "D_GS_BKZT", "D_GS_CSZT", "D_BZ_SF","D_GS_ZDR_RYJB","D_GS_ZDR_GJLB")
const searchBox = ref(); //搜索框
const roleCode = ref(false)
const czjyRef = ref()
@ -140,17 +137,40 @@ const dataList = ref([])
const showDialog = ref(false)// 发送指令
const assessShow = ref(false)// 全息档案
const searchConfiger = ref(
[
{ label: "布控人员", prop: 'yjRyxms', showType: "Slot" },
{ label: "性别", prop: 'xbdm', placeholder: "请选择性别", showType: "select", options: D_BZ_XB },
{ label: "身份证", prop: 'yjRysfzh', placeholder: "请输入身份证号码", showType: "input" },
{ label: "预警时间", prop: 'times', showType: "datetimerange" },
{ label: "状态", prop: 'czzt', placeholder: "请选择状态", showType: "select", options: D_GSXT_YJXX_CZZT },
// { label: "人员类别", prop: 'bqdl', placeholder: "请选择人员类别", showType: "select", options: D_GS_QLZDRLX },
{ label: "细类", prop: 'yjbqmc', placeholder: "请输入细类", showType: "input" },
{ label: "活动发生地址", prop: 'yjDz', placeholder: "请输入活动发生地址", showType: "input" },
{ label: "接收单位", prop: 'ssbmdm',showType: "department" },
]);
[
{ label: "布控开始时间", prop: 'bkkssj', showType: "date", placeholder: "请选择布控开始时间" },
{ label: "布控结束时间", prop: 'bkjssj', showType: "date", placeholder: "请选择布控结束时间" },
{ label: "预警时间", prop: 'startTime', showType: "datetimerange", placeholder: "请选择预警时间" },
// { label: "预警名称", prop: 'yjBt', showType: "input", placeholder: "请输入预警名称" },
{ label: "预警级别", prop: 'yjJb', showType: "select", options: D_BZ_YJJB, placeholder: "请选择预警级别", multiple: true },
{ label: "布控来源", prop: 'bkly', showType: "select", options: D_BZ_BKLYS, placeholder: "请选择布控来源" },
{ label: "布控范围", prop: 'bkfw', showType: "input", placeholder: "请输入布控范围" },
{ label: "布控单位", prop: 'gkbmdm', showType: "department", placeholder: "请选择布控单位" },
{ label: "所属单位", prop: 'ssbmdm', showType: "department", placeholder: "请选择所属单位" },
{ label: "相似度", prop: 'xsd', showType: "input", placeholder: "请输入相似度" },
{ prop: 'sfglyj', showType: "checkbox", showSelectAll: false, options: [{ label: '关联预警', value: '1' }] },
{ prop: 'sfgz', showType: "checkbox", showSelectAll: false, options: [{ label: '重点关注', value: '1' }] },
{ prop: 'sfzp', showType: "checkbox", showSelectAll: false, options: [{ label: '二次指派', value: '1' }] },
{ label: "签收状态", prop: 'czzt', showType: "select", options: D_GSXT_YJXX_CZZT },
{ label: "超时状态", prop: 'cszt', placeholder: "请选择超时状态", showType: "select", options: D_GS_CSZT },
{ label: "布控状态", prop: 'zkzt', showType: "select", options: D_GS_BKZT, placeholder: "请选择布控状态" },
{ label: "姓名", prop: 'yjRyxm', showType: "input", placeholder: "请输入姓名" },
{ label: "性别", prop: 'xbdm', showType: "select", options: D_BZ_XB, placeholder: "请选择性别" },
{ label: "开始年龄", prop: 'ksnl', placeholder: "请输入年龄", showType: "number" },
{ label: "结束年龄", prop: 'jsnl', placeholder: "请输入年龄", showType: "number" },
{ label: "跨地区", prop: 'sflksd', showType: "select", options: D_BZ_SF, placeholder: "请选择是否跨地区" },
{ label: "身份证号", prop: 'yjRysfzh', showType: "input", placeholder: "请输入身份证号" },
{ label: "预警内容", prop: 'yjNr', showType: "input", placeholder: "请输入预警内容" },
// { label: "布控人员", prop: 'yjRyxms', showType: "Slot" },
// { label: "性别", prop: 'xbdm', placeholder: "请选择性别", showType: "select", options: D_BZ_XB },
// { label: "身份证", prop: 'yjRysfzh', placeholder: "请输入身份证号码", showType: "input" },
// { label: "预警时间", prop: 'times', showType: "datetimerange" },
// { label: "状态", prop: 'czzt', placeholder: "请选择状态", showType: "select", options: D_GSXT_YJXX_CZZT },
// // { label: "人员类别", prop: 'bqdl', placeholder: "请选择人员类别", showType: "select", options: D_GS_QLZDRLX },
// { label: "细类", prop: 'yjbqmc', placeholder: "请输入细类", showType: "input" },
// { label: "活动发生地址", prop: 'yjDz', placeholder: "请输入活动发生地址", showType: "input" },
// { label: "接收单位", prop: 'ssbmdm',showType: "department" },
]);
const pageData = reactive({
tableData: [], //表格数据
keyCount: 0,
@ -166,18 +186,27 @@ const pageData = reactive({
pageSize: 20,
pageCurrent: 1
}, //分页
controlsWidth: 250, //操作栏宽度
controlsWidth: 150, //操作栏宽度
tableColumn: [
{ label: "预警图片", prop: "yjTp", showSolt: true, width: 100 },
{ label: "处置状态", prop: "czzt", showSolt: true },
{ label: "预警时间", prop: "yjSj", showOverflowTooltip: true, width: 200 },
{ label: "姓名", prop: "yjRyxm" },
{ label: "性别", prop: "xb", showSolt: true, width: 80 },
{ label: "年龄", prop: "nl", showSolt: true, width: 80 },
{ label: "预警图片", prop: "yjTp", showSolt: true, width: 50 },
{ label: "处置状态", prop: "czzt", showOverflowTooltip: true, width: 50 },
{ label: "预警时间", prop: "yjSj", showOverflowTooltip: true },
{ label: "姓名", prop: "yjRyxm", width: 50 },
{ label: "身份证", prop: "yjRysfzh", showOverflowTooltip: true },
{ label: "性别", prop: "xbdm", showSolt: true, width: 50 },
{ label: "年龄", prop: "nl", showSolt: true, width: 50 },
{ label: "预警级别", prop: "yjJb", showSolt: true, width: 50 },
{ label: "布控单位", prop: "gkbmdm", showSolt: true, width: 50 },
{ label: "布控来源", prop: "bkly", showSolt: true, width: 50 },
{ label: "布控范围", prop: "bkfw", showSolt: true, width: 50 },
{ label: "布控开始时间", showOverflowTooltip: true, prop: "bkkssj", showSolt: true, width: 50 },
{ label: "布控结束时间", showOverflowTooltip: true, prop: "bkjssj", showSolt: true, width: 50 },
{ label: "处置要求", prop: "bkczyq", showSolt: true, showOverflowTooltip: true, width: 50 },
{ label: "相似度", prop: "xsd", showSolt: true, width: 50 },
{ label: "预警内容", prop: "yjNr", showOverflowTooltip: true, showSolt: true },
{ label: "数据来源", prop: "yjLylx", showOverflowTooltip: true, showSolt: true },
{ label: "身份证", prop: "yjRysfzh", showOverflowTooltip: true, width: 200 },
{ label: "预警级别", prop: "yjJb", showSolt: true },
{ label: "相似度", prop: "xsd", showSolt: true },
{ label: "超时状态", prop: "cszt", showOverflowTooltip: true, showSolt: true, width: 50, },
{ label: "在控状态", prop: "zkzt", showOverflowTooltip: true, showSolt: true, width: 50 },
{ label: "所属部门", prop: "ssbm", showOverflowTooltip: true },
]
});
@ -190,11 +219,10 @@ const permission_sfqs = ref(false)
onMounted(() => {
let str = getItem('deptId') ? getItem('deptId')[0].deptLevel : ''
permission_sfqs.value = str.startsWith('2'||'3') ? false : true;
let rols = getItem('roleList') ? getItem('roleList'):[]
permission_sfqs.value = str.startsWith('2' || '3') ? false : true;
let rols = getItem('roleList') ? getItem('roleList') : []
let obj = rols.find(item => {
return ['JS_666666','JS_777777','JS_888888'].includes(item.roleCode)
return ['JS_666666', 'JS_777777', 'JS_888888'].includes(item.roleCode)
})
roleCode.value = obj ? true : false;
@ -206,9 +234,12 @@ const onReset = () => {
listQuery.value.yjRyxm = ''
}
const onSearch = (val) => {
listQuery.value = { ...listQuery.value,...val };
listQuery.value.startTime = val.times ? val.times[0] : ''
listQuery.value.endTime = val.times ? val.times[1] : ''
listQuery.value = { ...listQuery.value, ...val, yjJb: val.yjJb?.join(',') || '' };
listQuery.value.startTime = val.startTime ? val.startTime[0] : ''
listQuery.value.endTime = val.startTime ? val.startTime[1] : ''
listQuery.value.sfglyj = val.sfglyj?.join(',') || ''
listQuery.value.sfgz = val.sfgz?.join(',') || ''
listQuery.value.sfzp = val.sfzp?.join(',') || ''
getList()
}
@ -248,13 +279,13 @@ const getList = () => {
const remoteMethod = (query) => {
if (!query) return opentions.value = [];
loading.value = true
tbGsxtZdrySelectList({ ryXm: query }).then(res => {
opentions.value = res || [];
loading.value = false;
}).catch(() => {
loading.value = false
})
loading.value = true
tbGsxtZdrySelectList({ ryXm: query }).then(res => {
opentions.value = res || [];
loading.value = false;
}).catch(() => {
loading.value = false
})
}
const getRowClassName = (row) => {
@ -323,14 +354,14 @@ const exportExl = () => {
}
const handleQs = () => {
if (selectRows.value?.length === 0) return proxy.$message({ type: "warning", message: "请选择要签收的预警" });
if (selectRows.value?.length === 0) return proxy.$message({ type: "warning", message: "请选择要签收的预警" });
let wqs = selectRows.value.filter(item => item.czzt == '01');
if (wqs.length == 0) return proxy.$message({ type: "warning", message: "数据都已签收，请选择未签收的数据" });
let yqs = selectRows.value.filter(item => item.czzt == '02');
let texy = yqs.length > 0 ? `${yqs.length}条已签收预警数据，确认要签收${wqs.length}条未签收预警数据吗？` : '确认要签收所有预警数据吗？'
proxy.$confirm(texy, "警告", { type: "warning" }).then(() => {
let ids = wqs.map(item => item.id)
qcckPost({ids}, '/mosty-gsxt/tbYjxx/batchQs').then(() => {
qcckPost({ ids }, '/mosty-gsxt/tbYjxx/batchQs').then(() => {
proxy.$message({ type: "success", message: "成功" });
getList();
}).catch(() => {
@ -341,7 +372,7 @@ const handleQs = () => {
// 全息档案跳转
const pushAssess = (val) => {
return holographicProfileJump(val.yjLx,val)
return holographicProfileJump(val.yjLx, val)
}
const showDetail = (item) => {
@ -375,6 +406,14 @@ const pushWarning = (val) => {
warningShow.value = true
dataList.value = val;
}
// 详情
const paginationOpen = ref(false)
const dataPres = ref({})
const openBox = (val) => {
dataPres.value = val
paginationOpen.value = true
}
// 表格高度计算
const tabHeightFn = () => {
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 290;
@ -383,12 +422,19 @@ const tabHeightFn = () => {
};
};
</script>
<style lang="scss">
<style lang="scss" scoped>
.el-loading-mask {
background: rgba(0, 0, 0, 0.5) !important;
}
::v-deep .el-table .cell {
padding: 0;
}
::v-deep .el-table .el-table__cell {
padding: 4px 0;
}
/* 预警级别行样式 */
.warning-level-01 {
background-color: rgba(255, 2, 2, 0.1) !important;
@ -430,7 +476,7 @@ const tabHeightFn = () => {
background-color: transparent !important;
}
.tabBox_zdy{
.tabBox_zdy {
.el-table--fit {
overflow: unset !important;
}

443
src/views/backOfficeSystem/fourColorManage/warningList/vehicleWarning/components/particulars.vue Normal file
View File

@ -0,0 +1,443 @@
<!--预警指派展示组件 -->
<template>
<el-dialog :draggable="true" :model-value="modelValue" :title="title" :width="width" @close="close" append-to-body>
<div class="archive-container" v-loading="loading">
<div class="three-column-layout">
<!-- 车辆预警基本信息页 -->
<div class="column">
<div class="column-header">车辆预警基本信息页</div>
<div class="info-section">
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">车牌号：</span>
<span class="info-value">{{ dataForm.yjClcph }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">车辆所有人：</span>
<span class="info-value">{{ dataForm.yjRyxm }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">处置要求：</span>
<span class="info-value">
<DictTag :value="dataForm.bkczyq" :tag="false" :options="dict.D_GS_BK_CZYQ" />
</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">预警级别：</span>
<span class="info-value warning-level" :class="ys()">
<DictTag :value="dataForm.yjJb" :tag="false" :options="dict.D_BZ_YJJB" />
</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">布控起始时间：</span>
<span class="info-value">{{ dataForm.bkkssj }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">布控结束时间：</span>
<span class="info-value">{{ dataForm.bkjssj }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">所属单位：</span>
<span class="info-value">{{ dataForm.ssbm }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">布控单位：</span>
<span class="info-value">{{ dataForm.gkbmmc }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">布控原因：</span>
<span class="info-value text-area"></span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">一标三实信息：</span>
<span class="info-value text-area"></span>
</div>
</div>
</div>
</div>
<!-- 车辆预警活动信息页 -->
<div class="column">
<div class="column-header">车辆预警活动信息页</div>
<div class="info-section blue-bg">
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">轨迹类别：</span>
<span class="info-value">
<DictTag :value="dataForm.yjLylx" :tag="false" :options="dict.D_GS_ZDR_GJLB" />
</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">核查时间：</span>
<span class="info-value">
<span v-if="dataForm.fkList && dataForm.fkList.length > 0">{{ dataForm.fkList[0].czsj }}</span>
</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">比对时间：</span>
<span class="info-value">{{ dataForm.yjSj }}</span>
</div>
</div>
<!-- <div class="info-row">
<div class="info-item full-width">
<span class="info-label">活动发生地：</span>
<span class="info-value">{{ dataForm.xxdz }}</span>
</div>
</div> -->
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">活动场所：</span>
<span class="info-value">
<span v-if="dataForm.fkList && dataForm.fkList.length > 0">{{ dataForm.fkList[0].xxdz }}</span>
</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">活动信息：</span>
<span class="info-value">{{ dataForm.yjNr }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">信息提供单位：</span>
<span class="info-value">{{ dataForm.jczmc }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">信息接收单位：</span>
<span class="info-value">{{ dataForm.ssbm }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">二次指派单位：</span>
<span class="info-value">
<div v-if="dataForm.zpList && dataForm.zpList.length > 0">
<span v-for="(item, index) in dataForm.zpList" :key="item.id">
{{ item.zpbm }}<span v-if="index < dataForm.zpList.length - 1">,</span>
</span>
</div>
</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">签收时限：</span>
<span class="info-value">{{ dataForm.qssj }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">反馈时限：</span>
<span class="info-value">{{ dataForm.fksj }}</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">处置建议：</span>
<span class="info-value">
<div v-if="dataForm.czjyList && dataForm.czjyList.length > 0">
<div v-for="(item, index) in dataForm.czjyList" :key="item.id">
<span>{{ `${index + 1}、` + item.jynr }}</span>
</div>
</div>
</span>
</div>
</div>
<div class="info-row">
<div class="info-item full-width">
<span class="info-label">反馈内容：</span>
<span class="info-value">
<div v-if="dataForm.fkList && dataForm.fkList.length > 0">
<div v-for="(item, index) in dataForm.fkList" :key="item.id">
<span v-if="item.ckczbcxx">{{ `${index + 1}、` + item.ckczbcxx }}</span>
</div>
</div>
</span>
</div>
</div>
</div>
</div>
<!-- 历史预警信息页 -->
<div class="column">
<div class="column-header">历史预警信息页</div>
<div class="info-section">
<div class="history-item" v-for="(item, index) in dataForm.yjgjList" :key="item.id">
<span class="history-index">{{ `${index + 1}：` }}</span>
<span class="history-content">{{ item.yjNr }}</span>
</div>
</div>
</div>
</div>
</div>
<template #footer>
<div class="dialog-footer" style="text-align: center;">
<el-button @click="close">关闭</el-button>
</div>
</template>
</el-dialog>
</template>
<script setup>
import { defineProps, getCurrentInstance, watch, ref } from 'vue';
import { qcckGet } from '@/api/qcckApi.js'
const { proxy } = getCurrentInstance();
const props = defineProps({
modelValue: {
type: Boolean,
default: false
},
title: {
type: String,
default: '预警详情'
},
width: {
type: String,
default: '90%'
}, dataList: {
type: Object,
default: () => ({})
},
dict: {
type: Object,
default: () => ({})
}
});
// 定义事件
const emit = defineEmits(['update:modelValue']);
const loading = ref(false)
let abortController = null
const close = () => {
if (abortController) {
abortController.abort()
abortController = null
}
loading.value = false
dataForm.value = {}
emit('update:modelValue', false);
};
const dataForm = ref({});
watch(() => props.modelValue, (newVal) => {
if (newVal) {
getPart(props.dataList.id)
}
}, { deep: true });
const getPart = (id) => {
if (abortController) {
abortController.abort()
}
abortController = new AbortController()
loading.value = true
qcckGet({}, `/mosty-gsxt/tbYjxx/getInfo/${id}`, { signal: abortController.signal }).then(res => {
if (res) {
dataForm.value = res
} else {
dataForm.value = {}
}
console.log(res);
}).catch(err => {
if (err.name !== 'AbortError') {
console.error('请求失败:', err)
}
}).finally(() => {
console.log("xxxxxx");
loading.value = false
})
}
const ys = () => {
switch (dataForm.value.yjJb) {
case '01':
return 'red';
case '02':
return 'orange';
case '03':
return 'yellow';
case '04':
return 'blue';
default:
return '';
}
}
</script>
<style scoped>
.archive-container {
padding: 0;
max-height: 600px;
overflow-y: auto;
}
.three-column-layout {
display: flex;
height: 100%;
border: 1px solid #dcdfe6;
}
.column {
flex: 1;
display: flex;
flex-direction: column;
min-width: 300px;
border-right: 1px solid #dcdfe6;
}
.column:last-child {
border-right: none;
}
.column-header {
font-size: 16px;
font-weight: bold;
padding: 8px;
background: #f0f2f5;
color: #303133;
text-align: center;
border-bottom: 1px solid #dcdfe6;
}
.column .info-section {
flex: 1;
overflow-y: auto;
padding: 10px;
}
.info-section {
background: #ffffff;
}
.info-section.blue-bg {
background: #e6f7ff;
border-right: 1px solid #dcdfe6;
}
.info-row {
display: flex;
flex-wrap: wrap;
margin-bottom: 10px;
}
.info-item {
/* flex: 1; */
min-width: 140px;
display: flex;
align-items: center;
margin-right: 10px;
}
.info-item.full-width {
flex: 100%;
min-width: 100%;
margin-right: 0;
}
.info-label {
font-weight: bold;
margin-right: 8px;
width: 100px;
white-space: nowrap;
color: #333;
font-size: 14px;
}
.info-value {
flex: 1;
padding: 4px 8px;
border: 1px solid #dcdfe6;
border-radius: 4px;
background: #ffffff;
min-height: 28px;
display: flex;
align-items: center;
font-size: 14px;
}
.info-value.text-area {
min-height: 60px;
align-items: flex-start;
padding: 8px;
resize: vertical;
}
.info-value.warning-level {
background: #fffbe6;
border-color: #ffe58f;
color: #d48806;
font-weight: bold;
}
.info-value.warning-level.red {
background: #fef0f0;
border-color: #ffccc7;
color: #f56c6c;
}
.info-value.warning-level.orange {
background: #fffbe6;
border-color: #ffe58f;
color: #d48806;
}
.info-value.warning-level.yellow {
background: #fdf6ec;
border-color: #faecd8;
color: #e6a23c;
}
.info-value.warning-level.blue {
background: #ecf5ff;
border-color: #d9ecff;
color: #409eff;
}
.history-item {
margin-bottom: 8px;
padding: 6px 10px;
border: 1px solid #e4e7ed;
border-radius: 4px;
background: #ffffff;
display: flex;
align-items: center;
font-size: 14px;
}
.history-index {
font-weight: bold;
margin-right: 8px;
color: #409eff;
}
.history-content {
flex: 1;
color: #606266;
}
</style>

189
src/views/backOfficeSystem/fourColorManage/warningList/vehicleWarning/index.vue
View File

@ -1,35 +1,29 @@
<template>
<div>
<!-- 搜索 -->
<div ref="searchBox">
<Search :searchArr="searchConfiger" @submit="onSearch" @reset="onReset" :key="pageData.keyCount">
<template #yjRyxms>
<el-select clearable v-model="listQuery.yjRyxm" filterable remote allow-create default-first-optionreserve-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>
</template>
</Search>
</div>
<div ref="searchBox">
<Search :searchArr="searchConfiger" @submit="onSearch" @reset="onReset" :key="pageData.keyCount">
<template #yjRyxms>
<el-select clearable v-model="listQuery.yjRyxm" filterable remote allow-create
default-first-optionreserve-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>
</template>
</Search>
</div>
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
<template #left>
<el-button type="primary" size="small" @click="exportExl">导出</el-button>
<el-button type="primary" size="small" @click="handleQs" v-if="permission_sfqs">签收</el-button>
<el-button type="primary" size="small" @click="handleQs" v-if="permission_sfqs">批量签收</el-button>
</template>
</PageTitle>
<!-- 表格 -->
<div class="tabBox tabBox_zdy">
<MyTable
:tableData="pageData.tableData"
:tableColumn="pageData.tableColumn"
:tableHeight="pageData.tableHeight"
:key="pageData.keyCount"
:tableConfiger="pageData.tableConfiger"
:controlsWidth="pageData.controlsWidth"
expand
@chooseData="handleChooseData"
:rowClassName="getRowClassName"
>
<div class="tabBox tabBox_zdy">
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth" expand
@chooseData="handleChooseData" :rowClassName="getRowClassName">
<template #expand="{ props }">
<Items :row="props" />
</template>
@ -58,15 +52,31 @@
<template #xsd="{ row }">
{{ row.xsd }}%
</template>
<template #yjLylx="{ row }">
<template #yjLylx="{ row }">
<DictTag v-model:value="row.yjLylx" :options="D_BZ_YJLY" />
</template>
</template>
<template #czzt="{ row }">
<DictTag v-model:value="row.czzt" :options="D_GSXT_YJXX_CZZT" />
</template>
<template #yjJb="{ row }">
<DictTag v-model:value="row.yjJb" :options="D_BZ_YJJB" />
</template>
<template #bkly="{ row }">
<DictTag v-model:value="row.bkly" :options="D_BZ_BKLYS" />
</template>
<template #bkczyq="{ row }">
<DictTag v-model:value="row.bkczyq" :options="D_GS_BK_CZYQ" />
</template>
<template #xtSjly="{ row }">
<span>{{ row.xtSjly==1?'PC':row.xtSjly==2?'移动端':'一张网' }}</span>
</template>
<template #cszt="{ row }">
<DictTag v-model:value="row.cszt" :options="D_GS_CSZT" />
</template>
<template #zkzt="{ row }">
<DictTag v-model:value="row.zkzt" :options="D_GS_BKZT" />
</template>
<!-- 操作 -->
<template #controls="{ row }">
<el-link type="warning" @click="pushAssess(row)">全息档案</el-link>
@ -74,16 +84,14 @@
<!-- <el-link type="primary" @click="showDetail(row)">转合成</el-link> -->
<!-- <el-link type="danger" @click="delDictItem(row.id)">转会商</el-link> -->
<el-link type="success" @click="handleQsFk(row, '签收')" v-if="row.czzt == '01' && permission_sfqs">签收</el-link>
<el-link type="success" @click="handleQsFk(row, '反馈')" v-else-if="row.czzt == '02' && permission_sfqs">反馈</el-link>
<el-link type="success" @click="handleQsFk(row, '反馈')"
v-else-if="row.czzt == '02' && permission_sfqs">反馈</el-link>
<!-- <el-link type="success" @click="handleQsFk(row, '查看反馈')" v-else>查看反馈</el-link> -->
<el-link type="primary" @click="openAddFrom(row)">详情</el-link>
<el-link type="primary" @click="openBox(row)">详情</el-link>
<el-link type="primary" @click="pushWarning(row)">指派</el-link>
</template>
</MyTable>
<Pages
@changeNo="changeNo"
@changeSize="changeSize"
:tableHeight="pageData.tableHeight"
<Pages @changeNo="changeNo" @changeSize="changeSize" :tableHeight="pageData.tableHeight"
:pageConfiger="{ ...pageData.pageConfiger, total: pageData.total }">
</Pages>
</div>
@ -93,7 +101,8 @@
<HolographicArchive v-model="assessShow" :dataList="dataList" />
<Information v-model="showDialog" title="发送指令" @submit='submitSendZl' @close='closeFszl'>
<SemdFqzl ref="semdFqzlRef" :itemData="itemData" @handleClose="handleClose" identification="yj" :tacitly="tacitly" />
<SemdFqzl ref="semdFqzlRef" :itemData="itemData" @handleClose="handleClose" identification="yj"
:tacitly="tacitly" />
</Information>
<!-- 详情 -->
@ -101,9 +110,10 @@
<!-- 处置建议 -->
<Czjy ref="czjyRef" @okSubmit="getList"></Czjy>
<!-- 指派 -->
<ZpForm v-model="warningShow" :dataList="dataList"/>
<ZpForm v-model="warningShow" :dataList="dataList" />
<!-- 反馈 -->
<FkDialog @change="getList" />
<Particulars v-model="particularsShow" :dataList="dataPres" :dict="{D_BZ_XB,D_BZ_YJJB,D_GS_QLZDRLX,D_GS_ZDR_RYJB,D_GS_ZDR_GJLB,D_GS_BK_CZYQ}" />
</template>
<script setup>
@ -128,10 +138,15 @@ import Pages from "@/components/aboutTable/Pages.vue";
import PageTitle from "@/components/aboutTable/PageTitle.vue";
import Search from "@/components/aboutTable/Search.vue";
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
import Particulars from './components/particulars.vue'
const ORDIMG = 'https://89.40.7.122:38496/image'
const IMGYM = 'https://sg.lz.dsj.xz/dhimage'
const { proxy } = getCurrentInstance();
const { D_GSXT_YJXX_CZZT,D_GS_QLZDRLX, D_BZ_YJJB, D_BZ_YJLYXT, D_BZ_YJLY, D_BZ_XB } = proxy.$dict("D_GSXT_YJXX_CZZT",'D_GS_QLZDRLX ', "D_BZ_YJJB", "D_BZ_YJLYXT", "D_BZ_YJLY", "D_BZ_XB")
const { D_GSXT_YJXX_CZZT, D_GS_QLZDRLX,
D_BZ_XB,
D_BZ_BKLYS, D_BZ_YJJB, D_BZ_YJLYXT, D_GS_BKZT, D_BZ_SF,
D_BZ_YJLY, D_GS_CSZT, D_GS_BK_CZYQ } = proxy.$dict("D_GSXT_YJXX_CZZT", 'D_GS_QLZDRLX ', "D_GS_BKZT", "D_BZ_SF",
"D_BZ_YJJB", "D_BZ_YJLYXT", "D_BZ_YJLY", "D_BZ_XB", "D_BZ_BKLYS", "D_GS_CSZT", "D_GS_BK_CZYQ")
const searchBox = ref(); //搜索框
const roleCode = ref(false)
const czjyRef = ref()
@ -142,15 +157,29 @@ const dataList = ref([])
const showDialog = ref(false)// 发送指令
const assessShow = ref(false)// 全息档案
const searchConfiger = ref(
[
{ label: "车牌号", prop: 'yjClcph', showType: "input", placeholder: "请输入车牌号", },
{ label: "预警时间", prop: 'times', showType: "datetimerange" },
{ label: "状态", prop: 'czzt', placeholder: "请选择状态", showType: "select", options: D_GSXT_YJXX_CZZT },
{ label: "预警级别", prop: 'yjJb', placeholder: "请选择预警级别", showType: "select", options: D_BZ_YJJB },
{ label: "细类", prop: 'yjbqmc', placeholder: "请输入细类", showType: "input" },
{ label: "活动发生地址", prop: 'yjDz', placeholder: "请输入活动发生地址", showType: "input" },
{ label: "接收单位", prop: 'ssbmdm',showType: "department" },
]);
[
{ label: "布控开始时间", prop: 'bkkssj', showType: "date", placeholder: "请选择布控开始时间" },
{ label: "布控结束时间", prop: 'bkjssj', showType: "date", placeholder: "请选择布控结束时间" },
{ label: "预警时间", prop: 'startTime', showType: "datetimerange", placeholder: "请选择预警时间" },
{ label: "预警级别", prop: 'yjJb', showType: "select", options: D_BZ_YJJB, placeholder: "请选择预警级别", multiple: true },
{ label: "布控来源", prop: 'bkly', showType: "select", options: D_BZ_BKLYS, placeholder: "请选择布控来源" },
{ label: "布控范围", prop: 'bkfw', showType: "input", placeholder: "请输入布控范围" },
{ label: "布控单位", prop: 'gkbmdm', showType: "department", placeholder: "请选择布控单位" },
{ label: "所属单位", prop: 'ssbmdm', showType: "department", placeholder: "请选择所属单位" },
{ label: "签收状态", prop: 'czzt', showType: "select", options: D_GSXT_YJXX_CZZT },
{ label: "超时状态", prop: 'cszt', placeholder: "请选择超时状态", showType: "select", options: D_GS_CSZT },
{ label: "布控状态", prop: 'zkzt', showType: "select", options: D_GS_BKZT, placeholder: "请选择布控状态" },
{ label: "跨地区", prop: 'sflksd', showType: "select", options: D_BZ_SF, placeholder: "请选择是否跨地区" },
{ label: "车牌号", prop: 'yjClcph', showType: "input", placeholder: "请输入车牌号" },
{ label: "预警内容", prop: 'yjNr', showType: "input", placeholder: "请输入预警内容" },
// { label: "车牌号", prop: 'yjClcph', showType: "input", placeholder: "请输入车牌号", },
// { label: "预警时间", prop: 'times', showType: "datetimerange" },
// { label: "状态", prop: 'czzt', placeholder: "请选择状态", showType: "select", options: D_GSXT_YJXX_CZZT },
// { label: "预警级别", prop: 'yjJb', placeholder: "请选择预警级别", showType: "select", options: D_BZ_YJJB },
// { label: "细类", prop: 'yjbqmc', placeholder: "请输入细类", showType: "input" },
// { label: "活动发生地址", prop: 'yjDz', placeholder: "请输入活动发生地址", showType: "input" },
// { label: "接收单位", prop: 'ssbmdm',showType: "department" },
]);
const pageData = reactive({
tableData: [], //表格数据
keyCount: 0,
@ -166,18 +195,23 @@ const pageData = reactive({
pageSize: 20,
pageCurrent: 1
}, //分页
controlsWidth: 250, //操作栏宽度
controlsWidth: 180, //操作栏宽度
tableColumn: [
{ label: "状态", prop: "czzt", showSolt: true },
{ label: "预警图片", prop: "yjTp", showSolt: true, width: 100 },
{ label: "布控车牌号", prop: "yjClcph", showOverflowTooltip: true },
{ label: "处置状态", prop: "czzt", showSolt: true },
{ label: "状态", prop: "czzt", showSolt: true, width: 80 },
{ label: "车牌号", prop: "yjClcph", showOverflowTooltip: true },
{ label: "预警级别", prop: "yjJb", showSolt: true },
{ label: "预警时间", prop: "yjSj", showOverflowTooltip: true },
{ label: "标题", prop: "yjBt" },
{ label: "预警地址", prop: "yjDz", showOverflowTooltip: true },
{ label: "接收单位", prop: "ssbm", showOverflowTooltip: true },
{ label: "布控单位", prop: "gkbmmc", showOverflowTooltip: true },
{ label: "布控来源", prop: "bkly", showOverflowTooltip: true, showSolt: true },
{ label: "布控范围", prop: "bkfw", showOverflowTooltip: true },
{ label: "布控开始时间", prop: "bkkssj", showOverflowTooltip: true },
{ label: "布控结束时间", prop: "bkjssj", showOverflowTooltip: true },
{ label: "处置要求", prop: "bkczyq", showOverflowTooltip: true, showSolt: true },
{ label: "内容", prop: "yjNr", showOverflowTooltip: true },
{ label: "所属部门", prop: "ssbm", showOverflowTooltip: true },
{ label: "数据来源", prop: "xtSjly", showSolt: true },
{ label: "超时状态", prop: "cszt", showSolt: true },
{ label: "在控状态", prop: "zkzt", showSolt: true},
]
});
const addFromRefs = ref()
@ -189,11 +223,11 @@ const permission_sfqs = ref(false)
onMounted(() => {
let str = getItem('deptId') ? getItem('deptId')[0].deptLevel : ''
permission_sfqs.value = str.startsWith('2'||'3') ? false : true;
permission_sfqs.value = str.startsWith('2' || '3') ? false : true;
let rols = getItem('roleList') ? getItem('roleList'):[]
let rols = getItem('roleList') ? getItem('roleList') : []
let obj = rols.find(item => {
return ['JS_666666','JS_777777','JS_888888'].includes(item.roleCode)
return ['JS_666666', 'JS_777777', 'JS_888888'].includes(item.roleCode)
})
roleCode.value = obj ? true : false;
@ -205,9 +239,10 @@ const onReset = () => {
listQuery.value.yjRyxm = ''
}
const onSearch = (val) => {
listQuery.value = { ...listQuery.value,...val };
listQuery.value.startTime = val.times ? val.times[0] : ''
listQuery.value.endTime = val.times ? val.times[1] : ''
listQuery.value = { ...listQuery.value, ...val };
listQuery.value = { ...val, yjJb: val.yjJb?.join(',') || '' }
listQuery.value.startTime = val.startTime ? val.startTime[0] : ''
listQuery.value.endTime = val.startTime ? val.startTime[1] : ''
getList()
}
@ -247,13 +282,13 @@ const getList = () => {
const remoteMethod = (query) => {
if (!query) return opentions.value = [];
loading.value = true
tbGsxtZdrySelectList({ ryXm: query }).then(res => {
opentions.value = res || [];
loading.value = false;
}).catch(() => {
loading.value = false
})
loading.value = true
tbGsxtZdrySelectList({ ryXm: query }).then(res => {
opentions.value = res || [];
loading.value = false;
}).catch(() => {
loading.value = false
})
}
// 根据预警级别设置行样式
@ -323,14 +358,14 @@ const exportExl = () => {
}
const handleQs = () => {
if (selectRows.value?.length === 0) return proxy.$message({ type: "warning", message: "请选择要签收的预警" });
if (selectRows.value?.length === 0) return proxy.$message({ type: "warning", message: "请选择要签收的预警" });
let wqs = selectRows.value.filter(item => item.czzt == '01');
if (wqs.length == 0) return proxy.$message({ type: "warning", message: "数据都已签收，请选择未签收的数据" });
let yqs = selectRows.value.filter(item => item.czzt == '02');
let texy = yqs.length > 0 ? `${yqs.length}条已签收预警数据，确认要签收${wqs.length}条未签收预警数据吗？` : '确认要签收所有预警数据吗？'
proxy.$confirm(texy, "警告", { type: "warning" }).then(() => {
let ids = wqs.map(item => item.id)
qcckPost({ids}, '/mosty-gsxt/tbYjxx/batchQs').then(() => {
qcckPost({ ids }, '/mosty-gsxt/tbYjxx/batchQs').then(() => {
proxy.$message({ type: "success", message: "成功" });
getList();
}).catch(() => {
@ -341,7 +376,7 @@ const handleQs = () => {
// 全息档案跳转
const pushAssess = (val) => {
return holographicProfileJump(val.yjLx,val)
return holographicProfileJump(val.yjLx, val)
}
const showDetail = (item) => {
@ -375,6 +410,16 @@ const pushWarning = (val) => {
warningShow.value = true
dataList.value = val;
}
// 详情
const particularsShow = ref(false)
const dataPres = ref()
const openBox = (val) => {
particularsShow.value = true
dataPres.value = val
}
// 表格高度计算
const tabHeightFn = () => {
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 290;
@ -384,11 +429,19 @@ const tabHeightFn = () => {
};
</script>
<style lang="scss">
<style lang="scss" scoped>
.el-loading-mask {
background: rgba(0, 0, 0, 0.5) !important;
}
::v-deep .el-table .cell {
padding: 0;
}
::v-deep .el-table .el-table__cell {
padding: 4px 0;
}
/* 预警级别行样式 */
.warning-level-01 {
background-color: rgba(255, 2, 2, 0.1) !important;
@ -430,7 +483,7 @@ const tabHeightFn = () => {
background-color: transparent !important;
}
.tabBox_zdy{
.tabBox_zdy {
.el-table--fit {
overflow: unset !important;
}