lcw
This commit is contained in:
@ -8,157 +8,173 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="form_cnt">
|
||||
<el-form :model="listQuery" :rules="rules" :disabled="disabled" ref="elform" inline :label-width="100" label-position="left">
|
||||
<div class="smallTitle">布控信息</div>
|
||||
<el-form-item prop="bkBt" label="布控标题">
|
||||
<MOSTY.Other v-model="listQuery.bkBt" placeholder="请输入布控标题" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item prop="bkDx" label="布控对象">
|
||||
<MOSTY.Select v-model="listQuery.bkDx" @change="shangeDx" :dictEnum="props.dic.D_GS_BK_DX" placeholder="请选择布控对象" clearable />
|
||||
</el-form-item>
|
||||
<div class="ww100 mt10 mb10">
|
||||
<el-button type="primary" @click="handleAddPeo" v-if="!disabled">
|
||||
<el-icon style="vertical-align: middle"><CirclePlus /></el-icon>
|
||||
<span style="vertical-align: middle">新增</span>
|
||||
</el-button>
|
||||
</div>
|
||||
<div class="relative ww100">
|
||||
<MyTable
|
||||
:tableData="listQuery.bkdxList"
|
||||
:tableColumn="tableDate.tableColumn"
|
||||
:tableHeight="tableDate.tableHeight"
|
||||
:key="tableDate.keyCount"
|
||||
:tableConfiger="tableDate.tableConfiger"
|
||||
:controlsWidth="tableDate.controlsWidth"
|
||||
>
|
||||
<template #fjZp="{row}">
|
||||
<el-image :src="row.fjZp"></el-image>
|
||||
</template>
|
||||
<template #ryXb="{ row }">
|
||||
<DictTag :tag="false" :value="row.ryXb" :options="props.dic.D_BZ_XB" />
|
||||
</template>
|
||||
<template #bqList="{ row }">
|
||||
<span v-if="row.bqList">
|
||||
<span v-for="(it,idx) in row.bqList" :key="idx"> {{ it.bqMc }}、</span>
|
||||
</span>
|
||||
</template>
|
||||
<!-- 操作 -->
|
||||
<template #controls="{ row }">
|
||||
<el-link type="primary" >查看档案</el-link>
|
||||
<el-link type="danger" @click="deleteRow(row)">删除</el-link>
|
||||
</template>
|
||||
</MyTable>
|
||||
</div>
|
||||
<el-form :model="listQuery" :rules="rules" :disabled="disabled" ref="elform" inline :label-width="100"
|
||||
label-position="left">
|
||||
<div class="smallTitle">布控信息</div>
|
||||
<el-form-item prop="bkBt" label="布控标题">
|
||||
<MOSTY.Other v-model="listQuery.bkBt" placeholder="请输入布控标题" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item prop="bkDx" label="布控对象">
|
||||
<MOSTY.Select v-model="listQuery.bkDx" @change="shangeDx" :dictEnum="props.dic.D_GS_BK_DX"
|
||||
placeholder="请选择布控对象" clearable />
|
||||
</el-form-item>
|
||||
<div class="ww100 mt10 mb10">
|
||||
<el-button type="primary" @click="handleAddPeo" v-if="!disabled">
|
||||
<el-icon style="vertical-align: middle">
|
||||
<CirclePlus />
|
||||
</el-icon>
|
||||
<span style="vertical-align: middle">新增</span>
|
||||
</el-button>
|
||||
</div>
|
||||
<div class="relative ww100">
|
||||
<MyTable :tableData="listQuery.bkdxList" :tableColumn="tableDate.tableColumn"
|
||||
:tableHeight="tableDate.tableHeight" :key="tableDate.keyCount" :tableConfiger="tableDate.tableConfiger"
|
||||
:controlsWidth="tableDate.controlsWidth">
|
||||
<template #fjZp="{ row }">
|
||||
<el-image :src="row.fjZp"></el-image>
|
||||
</template>
|
||||
<template #ryXb="{ row }">
|
||||
<DictTag :tag="false" :value="row.ryXb" :options="props.dic.D_BZ_XB" />
|
||||
</template>
|
||||
<template #bqList="{ row }">
|
||||
<span v-if="row.bqList">
|
||||
<span v-for="(it, idx) in row.bqList" :key="idx"> {{ it.bqMc }}、</span>
|
||||
</span>
|
||||
</template>
|
||||
<!-- 操作 -->
|
||||
<template #controls="{ row }">
|
||||
<el-link type="primary">查看档案</el-link>
|
||||
<el-link type="danger" @click="deleteRow(row)">删除</el-link>
|
||||
</template>
|
||||
</MyTable>
|
||||
</div>
|
||||
|
||||
<div class="smallTitle">布控范围</div>
|
||||
<div class="ww100 relative mb10" style="height: 250px;border: 1px solid #dcdfe6;border-radius: 4px;overflow: hidden;">
|
||||
<div class="absolute mapSearch flex">
|
||||
<MOSTY.Select v-model="listQuery.bkqyList" filterable multiple :dictEnum="bkqyArr" style="width:350px" placeholder="请选择布控范围" clearable />
|
||||
</div>
|
||||
<GdMap></GdMap>
|
||||
</div>
|
||||
<el-form-item prop="bkBt" label="布控要素" style="width: 100%;">
|
||||
<div class="flex align-center">
|
||||
<el-button @click="listQuery.bkYz = it.dm" :type="listQuery.bkYz == it.dm ? 'primary':''" v-for="it in props.dic.D_GS_BK_BKYS" :key="it">{{ it.zdmc }}</el-button>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<div style="width: 100%;" class="mt25">
|
||||
<el-form-item prop="bkSjKs" label="布控开始时间" label-width="120px">
|
||||
<MOSTY.Date v-model="listQuery.bkSjKs" type="datetime" format="YYYY-MM-DD HH:mm:ss" placeholder="请选择布控开始时间" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item prop="bkSjJs" label="布控结束时间" label-width="120px" >
|
||||
<MOSTY.Date v-model="listQuery.bkSjJs" type="datetime" format="YYYY-MM-DD HH:mm:ss" placeholder="请选择布控结束时间" clearable />
|
||||
</el-form-item>
|
||||
</div>
|
||||
<div style="width: 100%;" class="mt25">
|
||||
<el-form-item prop="czYq" label="处置要求" >
|
||||
<MOSTY.Select v-model="listQuery.czYq" :dictEnum="props.dic.D_GS_BK_CZYQ" placeholder="请选择处置要求" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item prop="bkDj" label="布控级别" >
|
||||
<MOSTY.Select v-model="listQuery.bkDj" :dictEnum="props.dic.D_GS_BK_DJ" placeholder="请选择布控级别" clearable />
|
||||
</el-form-item>
|
||||
</div>
|
||||
<div style="width: 100%;" class="mt10">
|
||||
<el-form-item prop="bkSy" label="布控事由" style="width: 100%;">
|
||||
<MOSTY.Other v-model="listQuery.bkSy" placeholder="请输入布控事由" type="textarea" style="width: 100%;" clearable />
|
||||
</el-form-item>
|
||||
</div>
|
||||
<div style="width: 100%;" class="mt10">
|
||||
<el-form-item prop="bkfj" label="上传附件" style="width: 100%;">
|
||||
<div>
|
||||
<MOSTY.Upload :showBtn="true" :limit="10" :isImg="false" :isAll="true" v-model="listQuery.bkfj" />
|
||||
<div>支持png、jpg、pdf文件上传</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<div class="smallTitle">布控范围</div>
|
||||
<div class="ww100 relative mb10"
|
||||
style="height: 250px;border: 1px solid #dcdfe6;border-radius: 4px;overflow: hidden;">
|
||||
<div class="absolute mapSearch flex">
|
||||
<MOSTY.Select v-model="listQuery.bkqyList" filterable multiple :dictEnum="bkqyArr" style="width:350px"
|
||||
placeholder="请选择布控范围" clearable />
|
||||
</div>
|
||||
<GdMap></GdMap>
|
||||
</div>
|
||||
<el-form-item prop="bkBt" label="布控要素" style="width: 100%;">
|
||||
<div class="flex align-center">
|
||||
<el-button @click="listQuery.bkYz = it.dm" :type="listQuery.bkYz == it.dm ? 'primary' : ''"
|
||||
v-for="it in props.dic.D_GS_BK_BKYS" :key="it">{{ it.zdmc }}</el-button>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<div style="width: 100%;" class="mt25">
|
||||
<el-form-item prop="bkSjKs" label="布控开始时间" label-width="120px">
|
||||
<MOSTY.Date v-model="listQuery.bkSjKs" type="datetime" format="YYYY-MM-DD HH:mm:ss" placeholder="请选择布控开始时间"
|
||||
clearable />
|
||||
</el-form-item>
|
||||
<el-form-item prop="bkSjJs" label="布控结束时间" label-width="120px">
|
||||
<MOSTY.Date v-model="listQuery.bkSjJs" type="datetime" format="YYYY-MM-DD HH:mm:ss" placeholder="请选择布控结束时间"
|
||||
clearable />
|
||||
</el-form-item>
|
||||
</div>
|
||||
<div style="width: 100%;" class="mt25">
|
||||
<el-form-item prop="czYq" label="处置要求">
|
||||
<MOSTY.Select v-model="listQuery.czYq" :dictEnum="props.dic.D_GS_BK_CZYQ" placeholder="请选择处置要求" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item prop="bkDj" label="布控级别">
|
||||
<MOSTY.Select v-model="listQuery.bkDj" :dictEnum="props.dic.D_GS_BK_DJ" placeholder="请选择布控级别" clearable />
|
||||
</el-form-item>
|
||||
</div>
|
||||
<div style="width: 100%;" class="mt10">
|
||||
<el-form-item prop="bkSy" label="布控事由" style="width: 100%;">
|
||||
<MOSTY.Other v-model="listQuery.bkSy" placeholder="请输入布控事由" type="textarea" style="width: 100%;"
|
||||
clearable />
|
||||
</el-form-item>
|
||||
</div>
|
||||
<div style="width: 100%;" class="mt10">
|
||||
<el-form-item prop="bkfj" label="上传附件" style="width: 100%;">
|
||||
<div>
|
||||
<MOSTY.Upload :showBtn="true" :limit="10" :isImg="false" :isAll="true" v-model="listQuery.bkfj" />
|
||||
<div>支持png、jpg、pdf文件上传</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</div>
|
||||
|
||||
<div class="smallTitle">审批信息</div>
|
||||
<el-form-item prop="czJsdwdm" label="处置接收单位" label-width="120px" style="width: 100%;">
|
||||
<div class="flex align-center ww100">
|
||||
<MOSTY.Department v-model="listQuery.czJsdwdm" style="width:260px;margin-right: 10px;" placeholder="请选择处置要求" clearable />
|
||||
<el-radio-group v-model="listQuery.czJsdwlx" class="flex align-center">
|
||||
<el-radio :label="it.dm" v-for="(it,idx) in props.dic.D_GS_BK_CZJSDWLX" :key="idx">{{ it.zdmc }}</el-radio>
|
||||
</el-radio-group>
|
||||
<div class="smallTitle">审批信息</div>
|
||||
<el-form-item prop="czJsdwdm" label="处置接收单位" label-width="120px" style="width: 100%;">
|
||||
<div class="flex align-center ww100">
|
||||
<MOSTY.Department v-model="listQuery.czJsdwdm" style="width:260px;margin-right: 10px;" placeholder="请选择处置要求"
|
||||
clearable />
|
||||
<el-radio-group v-model="listQuery.czJsdwlx" class="flex align-center">
|
||||
<el-radio :label="it.dm" v-for="(it, idx) in props.dic.D_GS_BK_CZJSDWLX" :key="idx">{{ it.zdmc
|
||||
}}</el-radio>
|
||||
</el-radio-group>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<div class="ww100 mt10 mb20">
|
||||
<el-form-item prop="bkTjfs" label="提醒方式">
|
||||
<el-radio-group v-model="listQuery.bkTjfs" class="flex align-center">
|
||||
<el-radio :label="it.dm" v-for="(it, idx) in props.dic.D_GS_BK_TJFS" :key="idx">{{ it.zdmc }}</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item prop="bkSjQs" label="签收时间">
|
||||
<MOSTY.Date v-model="listQuery.bkSjQs" type="datetime" format="YYYY-MM-DD HH:mm:ss" placeholder="请选择签收时间"
|
||||
clearable />
|
||||
</el-form-item>
|
||||
</div>
|
||||
<div class="ww100">
|
||||
<el-steps direction="vertical" :active="listQuery.wccz" space="500" finish-status="success">
|
||||
<el-step title="发起申请">
|
||||
<template #description>
|
||||
<div class="flex align-center ww100 mt10 mb20">
|
||||
<el-input v-model="listQuery.bkfqrXm" readonly class="ww20"></el-input>
|
||||
<el-input v-model="listQuery.bkfqrSsbmmc" readonly class="ww20 ml10 mr10"></el-input>
|
||||
<span class="f12" style="color: #333333;"> 备注发起人和部门根据登陆人自动填写</span>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<div class="ww100 mt10 mb20">
|
||||
<el-form-item prop="bkTjfs" label="提醒方式">
|
||||
<el-radio-group v-model="listQuery.bkTjfs" class="flex align-center">
|
||||
<el-radio :label="it.dm" v-for="(it,idx) in props.dic.D_GS_BK_TJFS" :key="idx">{{ it.zdmc }}</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item prop="bkSjQs" label="签收时间">
|
||||
<MOSTY.Date v-model="listQuery.bkSjQs" type="datetime" format="YYYY-MM-DD HH:mm:ss" placeholder="请选择签收时间" clearable />
|
||||
</el-form-item>
|
||||
</div>
|
||||
<div class="ww100">
|
||||
<el-steps direction="vertical" :active="listQuery.wccz" space="500" finish-status="success">
|
||||
<el-step title="发起申请" >
|
||||
<template #description>
|
||||
<div class="flex align-center ww100 mt10 mb20">
|
||||
<el-input v-model="listQuery.bkfqrXm" readonly class="ww20"></el-input>
|
||||
<el-input v-model="listQuery.bkfqrSsbmmc" readonly class="ww20 ml10 mr10"></el-input>
|
||||
<span class="f12" style="color: #333333;"> 备注发起人和部门根据登陆人自动填写</span>
|
||||
</div>
|
||||
</template>
|
||||
</el-step>
|
||||
<el-step title="审核确认" >
|
||||
<template #description>
|
||||
<div class="ww100 mt10 mb20 depBox">
|
||||
<el-form-item prop="bkshrSsbmdm" label="审核部门:" label-width="100" style="width: 100%;">
|
||||
<MOSTY.Department :isAll="true" v-model="listQuery.bkshrSsbmdm" clearable :placeholder="listQuery.bkshrSsbmmc ? listQuery.bkshrSsbmmc : '' " />
|
||||
</el-form-item>
|
||||
</div>
|
||||
</template>
|
||||
</el-step>
|
||||
<el-step title="审批确认" >
|
||||
<template #description>
|
||||
<div class="ww100 mt10 mb20 depBox">
|
||||
<el-form-item prop="bkshrSsbmdm" label="审批部门:" label-width="100" style="width: 100%;">
|
||||
<MOSTY.Department :isAll="true" v-model="listQuery.bksprSsbmdm" clearable :placeholder="listQuery.bksprSsbmmc ? listQuery.bksprSsbmmc : '' " />
|
||||
</el-form-item>
|
||||
</div>
|
||||
</template>
|
||||
</el-step>
|
||||
</el-steps>
|
||||
</div>
|
||||
</el-form>
|
||||
</template>
|
||||
</el-step>
|
||||
<el-step title="审核确认">
|
||||
<template #description>
|
||||
<div class="ww100 mt10 mb20 depBox">
|
||||
<el-form-item prop="bkshrSsbmdm" label="审核部门:" label-width="100" style="width: 100%;">
|
||||
<MOSTY.Department :isAll="true" v-model="listQuery.bkshrSsbmdm" clearable
|
||||
:placeholder="listQuery.bkshrSsbmmc ? listQuery.bkshrSsbmmc : ''" />
|
||||
</el-form-item>
|
||||
</div>
|
||||
</template>
|
||||
</el-step>
|
||||
<el-step title="审批确认">
|
||||
<template #description>
|
||||
<div class="ww100 mt10 mb20 depBox">
|
||||
<el-form-item prop="bkshrSsbmdm" label="审批部门:" label-width="100" style="width: 100%;">
|
||||
<MOSTY.Department :isAll="true" v-model="listQuery.bksprSsbmdm" clearable
|
||||
:placeholder="listQuery.bksprSsbmmc ? listQuery.bksprSsbmmc : ''" />
|
||||
</el-form-item>
|
||||
</div>
|
||||
</template>
|
||||
</el-step>
|
||||
</el-steps>
|
||||
</div>
|
||||
</el-form>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 选择布控人员 -->
|
||||
<BkryDialod :modelValue="chooseVisible_RY" @update:modelValue="chooseVisible_RY = $event" @choosed="choosed" @choosedAdd="choosedAdd" :roleIds="roleIds" />
|
||||
<BkryDialod :modelValue="chooseVisible_RY" @update:modelValue="chooseVisible_RY = $event" @choosed="choosed"
|
||||
@choosedAdd="choosedAdd" :roleIds="roleIds" />
|
||||
<!-- 选择车辆布控 -->
|
||||
<BkclDialod :modelValue="chooseVisible_CL" @update:modelValue="chooseVisible_CL = $event" @choosed="choosed"
|
||||
@choosedAdd="choosedAdd" :roleIds="roleIds" />
|
||||
<!-- 选择布控群体 -->
|
||||
<BkqtDialod :modelValue="chooseVisible_QT" @update:modelValue="chooseVisible_QT = $event" @choosed="choosed" :roleIds="roleIds" />
|
||||
<BkqtDialod :modelValue="chooseVisible_QT" @update:modelValue="chooseVisible_QT = $event" @choosed="choosed"
|
||||
:roleIds="roleIds" />
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { getItem } from "@/utils/storage";
|
||||
import BkryDialod from '@/components/ChooseList/ChooseZdr/index.vue';
|
||||
import BkqtDialod from '@/components/ChooseList/ChooseQt/index.vue';
|
||||
import BkclDialod from '@/components/ChooseList/ChooseCl/index.vue';
|
||||
import GdMap from "@/components/GdMap/index.vue";
|
||||
import * as MOSTY from "@/components/MyComponents/index";
|
||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||
import { qcckGet,qcckPost } from "@/api/qcckApi.js";
|
||||
import { qcckGet, qcckPost } from "@/api/qcckApi.js";
|
||||
import { ref, defineExpose, reactive, defineEmits, getCurrentInstance, nextTick } from "vue";
|
||||
const emit = defineEmits(["change"]);
|
||||
const props = defineProps({
|
||||
@ -168,25 +184,26 @@ const elform = ref()
|
||||
const roleIds = ref([]); //角色ID
|
||||
const chooseVisible_RY = ref(false); //选择布控人员弹窗
|
||||
const chooseVisible_QT = ref(false); //选择布控群体弹窗
|
||||
const chooseVisible_CL = ref(false)
|
||||
const bkqyArr = ref([]); //布控区域
|
||||
const { proxy } = getCurrentInstance();
|
||||
const dialogForm = ref(false); //弹窗
|
||||
const loading = ref(false)
|
||||
const addPerson = ref([]) //单独新增的数据
|
||||
const listQuery = ref({
|
||||
bkYz:'01',
|
||||
bkdxList: [],
|
||||
bkYz: '01',
|
||||
bkdxList: [],
|
||||
}); //表单数据
|
||||
const rules = reactive({
|
||||
bkBt: [{ required: true, message: "请输入布控标题", trigger: "blur" }],
|
||||
bkDx: [{ required: true, message: "请选择布控对象", trigger: "change" }],
|
||||
bkSjKs: [{ required: true, message: "请选择布控开始时间", trigger: "change" }],
|
||||
bkSjJs: [{ required: true, message: "请选择布控结束时间", trigger: "change" }],
|
||||
czJsdwdm: [{ required: true, message: "请选择处置接收单位", trigger: "change" }],
|
||||
bkshrSsbmdm: [{ required: true, message: "请选择审核部门", trigger: "change" }],
|
||||
bksprSsbmdm: [{ required: true, message: "请选择审批部门", trigger: "change" }],
|
||||
bkBt: [{ required: true, message: "请输入布控标题", trigger: "blur" }],
|
||||
bkDx: [{ required: true, message: "请选择布控对象", trigger: "change" }],
|
||||
bkSjKs: [{ required: true, message: "请选择布控开始时间", trigger: "change" }],
|
||||
bkSjJs: [{ required: true, message: "请选择布控结束时间", trigger: "change" }],
|
||||
czJsdwdm: [{ required: true, message: "请选择处置接收单位", trigger: "change" }],
|
||||
bkshrSsbmdm: [{ required: true, message: "请选择审核部门", trigger: "change" }],
|
||||
bksprSsbmdm: [{ required: true, message: "请选择审批部门", trigger: "change" }],
|
||||
})
|
||||
const tableDate = reactive({
|
||||
let tableDate = reactive({
|
||||
keyCount: 0,
|
||||
tableConfiger: {
|
||||
rowHieght: 61,
|
||||
@ -200,9 +217,9 @@ const tableDate = reactive({
|
||||
}, //分页
|
||||
controlsWidth: 200, //操作栏宽度
|
||||
tableColumn: [
|
||||
{ label: "照片", prop: "fjZp",showSolt:true},
|
||||
{ label: "照片", prop: "fjZp", showSolt: true },
|
||||
{ label: "姓名", prop: "ryXm" },
|
||||
{ label: "性别", prop: "ryXb",showSolt:true },
|
||||
{ label: "性别", prop: "ryXb", showSolt: true },
|
||||
{ label: "身份证号", prop: "rySfzh" },
|
||||
{ label: "户籍地", prop: "ryHjd" },
|
||||
{ label: "现居住地址", prop: "ryXjd" },
|
||||
@ -211,124 +228,216 @@ const tableDate = reactive({
|
||||
{ label: "车牌号", prop: "clCph" },
|
||||
{ label: "车架号", prop: "clCjh" },
|
||||
{ label: "特征描述", prop: "qtTzms" },
|
||||
{ label: "人员标签", prop: "bqList" ,showSolt:true,showOverflowTooltip:true }
|
||||
{ label: "人员标签", prop: "bqList", showSolt: true, showOverflowTooltip: true }
|
||||
]
|
||||
});
|
||||
const tableColumnList = {
|
||||
'01': [
|
||||
{ label: "照片", prop: "fjZp", showSolt: true },
|
||||
{ label: "姓名", prop: "ryXm" },
|
||||
{ label: "性别", prop: "ryXb", showSolt: true },
|
||||
{ label: "身份证号", prop: "rySfzh" },
|
||||
{ label: "户籍地", prop: "ryHjd" },
|
||||
{ label: "现居住地址", prop: "ryXjd" },
|
||||
{ label: "手机号", prop: "rySjhm" },
|
||||
{ label: "虚拟身份", prop: "qtXnsf" },
|
||||
{ label: "车牌号", prop: "clCph" },
|
||||
{ label: "车架号", prop: "clCjh" },
|
||||
{ label: "特征描述", prop: "qtTzms" },
|
||||
{ label: "人员标签", prop: "bqList", showSolt: true, showOverflowTooltip: true }
|
||||
],
|
||||
'02': [
|
||||
{ label: "照片", prop: "fjZp", showSolt: true },
|
||||
{ label: "姓名", prop: "ryXm" },
|
||||
{ label: "性别", prop: "ryXb", showSolt: true },
|
||||
{ label: "身份证号", prop: "rySfzh" },
|
||||
{ label: "户籍地", prop: "ryHjd" },
|
||||
{ label: "现居住地址", prop: "ryXjd" },
|
||||
{ label: "手机号", prop: "rySjhm" },
|
||||
{ label: "虚拟身份", prop: "qtXnsf" },
|
||||
{ label: "车牌号", prop: "clCph" },
|
||||
{ label: "车架号", prop: "clCjh" },
|
||||
{ label: "特征描述", prop: "qtTzms" },
|
||||
{ label: "人员标签", prop: "bqList", showSolt: true, showOverflowTooltip: true }
|
||||
],
|
||||
'03': [
|
||||
{ label: "车牌号", prop: "clCph" },
|
||||
{ label: "车架号", prop: "clCjh" },
|
||||
{ label: "车辆颜色", prop: "clYs" },
|
||||
// { label: "车辆所有人", prop: "clSyr" },
|
||||
// { label: "管辖单位", prop: "gxSsbmmc" },
|
||||
// { label: "管控民警", prop: "gkMjXm" },
|
||||
]
|
||||
}
|
||||
const title = ref('')
|
||||
const disabled = ref(false)
|
||||
// 初始化数据
|
||||
const init = (type,row) => {
|
||||
listQuery.value.bkfj = [];
|
||||
if(type == 'add'){
|
||||
tableDate.tableConfiger.haveControls = true;
|
||||
disabled.value = false;
|
||||
listQuery.value.bkfqrXm = getItem("USERNAME");
|
||||
listQuery.value.bkfqrSfzh = getItem("idEntityCard");
|
||||
listQuery.value.bkfqrSsbmmc = getItem("deptId")[0].deptName;;
|
||||
listQuery.value.bkfqrSsbmdm = getItem("deptId")[0].deptCode;;
|
||||
}
|
||||
title.value = type == 'add' ? '新增' : type == 'detail' ?'详情':'编辑';
|
||||
disabled.value = type == 'detail' ? true :false ;
|
||||
dialogForm.value = true;
|
||||
if(row) tableDate.tableConfiger.haveControls = false;
|
||||
get_bkqy_list(row)
|
||||
const init = (type, row) => {
|
||||
listQuery.value.bkfj = [];
|
||||
if (type == 'add') {
|
||||
tableDate.tableConfiger.haveControls = true;
|
||||
disabled.value = false;
|
||||
listQuery.value.bkfqrXm = getItem("USERNAME");
|
||||
listQuery.value.bkfqrSfzh = getItem("idEntityCard");
|
||||
listQuery.value.bkfqrSsbmmc = getItem("deptId")[0].deptName;;
|
||||
listQuery.value.bkfqrSsbmdm = getItem("deptId")[0].deptCode;;
|
||||
}
|
||||
title.value = type == 'add' ? '新增' : type == 'detail' ? '详情' : '编辑';
|
||||
disabled.value = type == 'detail' ? true : false;
|
||||
dialogForm.value = true;
|
||||
if (row) tableDate.tableConfiger.haveControls = false;
|
||||
get_bkqy_list(row)
|
||||
};
|
||||
|
||||
// 获取布控区域
|
||||
const get_bkqy_list = (row) =>{
|
||||
qcckGet({},'/mosty-gsxt/tbGsxtBkQy/selectList').then(res=>{
|
||||
let arr = res || [];
|
||||
bkqyArr.value = arr.map(item=>{
|
||||
return {...item,label:item.qymc,value:item.id}
|
||||
})
|
||||
if(row) getDataById(row.id);
|
||||
const get_bkqy_list = (row) => {
|
||||
qcckGet({}, '/mosty-gsxt/tbGsxtBkQy/selectList').then(res => {
|
||||
let arr = res || [];
|
||||
bkqyArr.value = arr.map(item => {
|
||||
return { ...item, label: item.qymc, value: item.id }
|
||||
})
|
||||
if (row) getDataById(row.id);
|
||||
})
|
||||
}
|
||||
|
||||
// 根据id获取详情
|
||||
const getDataById = (id) =>{
|
||||
qcckGet({},'/mosty-gsxt/tbGsxtBk/selectVoById/'+id).then(res=>{
|
||||
res.bkfj = res.ossList || [];
|
||||
res.bkqyList = res.qyList ? res.qyList.map(v=>v.id) : [];
|
||||
listQuery.value = res || {}
|
||||
})
|
||||
const getDataById = (id) => {
|
||||
qcckGet({}, '/mosty-gsxt/tbGsxtBk/selectVoById/' + id).then(res => {
|
||||
res.bkfj = res.ossList || [];
|
||||
res.bkqyList = res.qyList ? res.qyList.map(v => v.id) : [];
|
||||
listQuery.value = res || {}
|
||||
|
||||
tableDate.tableColumn =tableColumnList[res.bkDx?res.bkDx:'01']
|
||||
})
|
||||
}
|
||||
|
||||
const shangeDx = () =>{
|
||||
listQuery.value.bkDxxx = '';
|
||||
listQuery.value.bkdxList = [];
|
||||
roleIds.value = [];
|
||||
addPerson.value = []
|
||||
const shangeDx = () => {
|
||||
tableDate.tableColumn =tableColumnList[listQuery.value.bkDx]
|
||||
listQuery.value.bkDxxx = '';
|
||||
listQuery.value.bkdxList = [];
|
||||
roleIds.value = [];
|
||||
addPerson.value = []
|
||||
}
|
||||
// 删除数据
|
||||
const deleteRow = (row) => {
|
||||
roleIds.value = roleIds.value.filter(id => id != row.id);
|
||||
addPerson.value = addPerson.value.filter(it => it.id != row.id);
|
||||
listQuery.value.bkdxList = listQuery.value.bkdxList.filter(it => it.id != row.id);
|
||||
roleIds.value = roleIds.value.filter(id => id != row.id);
|
||||
addPerson.value = addPerson.value.filter(it => it.id != row.id);
|
||||
listQuery.value.bkdxList = listQuery.value.bkdxList.filter(it => it.id != row.id);
|
||||
}
|
||||
// 单独新增的数据
|
||||
const choosedAdd = (item) =>{
|
||||
let obj = { id:item.id, fjZp:item.fjZp, ryXm:item.ryXm, ryXb:item.ryXb, rySfzh:item.rySfzh, ryHjd:item.hjdXz, ryXjd:item.xzdXz, rySjhm:item.ryLxdh, qtXnsf:item.qtXnsf,clCjh:item.clCjh, clCph:item.clCph, qtTzms:item.qtTzms, bqList:item.bqList }
|
||||
addPerson.value.push(obj) ;//缓存的数据
|
||||
if(!listQuery.value.bkdxList) listQuery.value.bkdxList = [];
|
||||
listQuery.value.bkdxList.unshift(obj);
|
||||
const choosedAdd = (item) => {
|
||||
console.log(item);
|
||||
|
||||
let obj = {}
|
||||
if (listQuery.value.bkDx!=='03') {
|
||||
obj={ id: item.id, fjZp: item.fjZp, ryXm: item.ryXm, ryXb: item.ryXb, rySfzh: item.rySfzh, ryHjd: item.hjdXz, ryXjd: item.xzdXz, rySjhm: item.ryLxdh, qtXnsf: item.qtXnsf, clCjh: item.clCjh, clCph: item.clCph, qtTzms: item.qtTzms, bqList: item.bqList }
|
||||
|
||||
} else {
|
||||
obj={
|
||||
clCph: item.hphm, clCjh: item.clCjh, clSyr: item.clSyr, clSyrsfzh: item.clSyrsfzh,
|
||||
clYs: item.clYs, gxSsbmmc: item.gxSsbmmc
|
||||
}
|
||||
|
||||
}
|
||||
addPerson.value.push(obj);//缓存的数据
|
||||
if (!listQuery.value.bkdxList) listQuery.value.bkdxList = [];
|
||||
listQuery.value.bkdxList.unshift(obj);
|
||||
}
|
||||
|
||||
// 选择重点人
|
||||
const choosed = (val) => {
|
||||
if(listQuery.value.bkDx == '01'){// 人员
|
||||
roleIds.value = val.map(it=>it.id);
|
||||
let arr = val.map(item=>{
|
||||
let bqArr = item.bqList || [];
|
||||
let bqs = bqArr.map(v=>{
|
||||
return { bqZl:v.bqZl , bqId:v.bqId, bqLx:v.bqLx, bqLb:v.bqLb, bqMc:v.bqMc, bqDm:v.bqDm }
|
||||
})
|
||||
return { id:item.id, fjZp:item.fjZp, ryXm:item.ryXm, ryXb:item.ryXb, rySfzh:item.rySfzh, ryHjd:item.hjdXz, ryXjd:item.xzdXz, rySjhm:item.ryLxdh, qtXnsf:item.qtXnsf,clCjh:item.clCjh, clCph:item.clCph, qtTzms:item.qtTzms, bqList:bqs }
|
||||
})
|
||||
listQuery.value.bkdxList = [...addPerson.value,...arr];
|
||||
}else{// 群体
|
||||
listQuery.value.bkDxxx = (val.map(it=>it.id)).join(',');
|
||||
let peolist = []
|
||||
val.forEach(item=>{
|
||||
if(item.zdryList) peolist = peolist.concat(item.zdryList)
|
||||
})
|
||||
let brrPeo = peolist.map(item=>{
|
||||
let bqArr = item.bqList || [];
|
||||
let bqs = bqArr.map(v=>{
|
||||
return { bqZl:v.bqZl , bqId:v.bqId, bqLx:v.bqLx, bqLb:v.bqLb, bqMc:v.bqMc, bqDm:v.bqDm }
|
||||
})
|
||||
return { id:item.id, fjZp:item.fjZp, ryXm:item.ryXm, ryXb:item.ryXb, rySfzh:item.rySfzh, ryHjd:item.hjdXz, ryXjd:item.xzdXz, rySjhm:item.ryLxdh, qtXnsf:item.qtXnsf,clCjh:item.clCjh, clCph:item.clCph, qtTzms:item.qtTzms, bqList:bqs }
|
||||
})
|
||||
console.log(val);
|
||||
|
||||
listQuery.value.bkdxList = brrPeo;
|
||||
}
|
||||
tableDate.tableColumn =tableColumnList[listQuery.value.bkDx]
|
||||
console.log(tableDate.tableColumn);
|
||||
|
||||
if (listQuery.value.bkDx == '01') {// 人员
|
||||
roleIds.value = val.map(it => it.id);
|
||||
let arr = val.map(item => {
|
||||
let bqArr = item.bqList || [];
|
||||
let bqs = bqArr.map(v => {
|
||||
return { bqZl: v.bqZl, bqId: v.bqId, bqLx: v.bqLx, bqLb: v.bqLb, bqMc: v.bqMc, bqDm: v.bqDm }
|
||||
})
|
||||
return { id: item.id, fjZp: item.fjZp, ryXm: item.ryXm, ryXb: item.ryXb, rySfzh: item.rySfzh, ryHjd: item.hjdXz, ryXjd: item.xzdXz, rySjhm: item.ryLxdh, qtXnsf: item.qtXnsf, clCjh: item.clCjh, clCph: item.clCph, qtTzms: item.qtTzms, bqList: bqs }
|
||||
})
|
||||
listQuery.value.bkdxList = [...addPerson.value, ...arr];
|
||||
} else if (listQuery.value.bkDx == '03') {
|
||||
|
||||
roleIds.value = val.map(it => it.id);
|
||||
let arr = val.map(item => {
|
||||
let bqArr = item.bqList || [];
|
||||
let bqs = bqArr.map(v => {
|
||||
return {
|
||||
clCph: v.hphm, clCjh: v.clCjh, clSyr: v.clSyr, clSyrsfzh: v.clSyrsfzh,
|
||||
clYs: v.clYs, gxSsbmmc: v.gxSsbmmc
|
||||
}
|
||||
})
|
||||
return {
|
||||
clCph: item.hphm, clCjh: item.clCjh, clSyr: item.clSyr, clSyrsfzh: item.clSyrsfzh,
|
||||
clYs: item.clYs, gxSsbmmc: item.gxSsbmmc, bqList: bqs
|
||||
}
|
||||
})
|
||||
listQuery.value.bkdxList = [...addPerson.value, ...arr];
|
||||
|
||||
}
|
||||
else {// 群体
|
||||
listQuery.value.bkDxxx = (val.map(it => it.id)).join(',');
|
||||
let peolist = []
|
||||
val.forEach(item => {
|
||||
if (item.zdryList) peolist = peolist.concat(item.zdryList)
|
||||
})
|
||||
let brrPeo = peolist.map(item => {
|
||||
let bqArr = item.bqList || [];
|
||||
let bqs = bqArr.map(v => {
|
||||
return { bqZl: v.bqZl, bqId: v.bqId, bqLx: v.bqLx, bqLb: v.bqLb, bqMc: v.bqMc, bqDm: v.bqDm }
|
||||
})
|
||||
return {
|
||||
id: item.id, fjZp: item.fjZp, ryXm: item.ryXm, ryXb: item.ryXb,
|
||||
rySfzh: item.rySfzh, ryHjd: item.hjdXz, ryXjd: item.xzdXz,
|
||||
rySjhm: item.ryLxdh, qtXnsf: item.qtXnsf, clCjh: item.clCjh,
|
||||
clCph: item.clCph, qtTzms: item.qtTzms, bqList: bqs
|
||||
}
|
||||
})
|
||||
|
||||
listQuery.value.bkdxList = brrPeo;
|
||||
}
|
||||
};
|
||||
|
||||
// 选择人员
|
||||
const handleAddPeo = () =>{
|
||||
if(!listQuery.value.bkDx) return proxy.$message({ type: "warning", message: '请选择布控对象' });
|
||||
listQuery.value.bkDx == '01' ? chooseVisible_RY.value = true : chooseVisible_QT.value = true;
|
||||
const handleAddPeo = () => {
|
||||
if (!listQuery.value.bkDx) return proxy.$message({ type: "warning", message: '请选择布控对象' });
|
||||
switch (listQuery.value.bkDx) {
|
||||
case '01':
|
||||
chooseVisible_RY.value = true
|
||||
break;
|
||||
case '02':
|
||||
chooseVisible_QT.value = true
|
||||
break;
|
||||
case '03':
|
||||
chooseVisible_CL.value = true
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// 提交
|
||||
const submit = () => {
|
||||
elform.value.validate((validate) => {
|
||||
if(!validate) return;
|
||||
let params = { ...listQuery.value };
|
||||
params.bkfj = params.bkfj ? params.bkfj.join(','):'';
|
||||
if (!validate) return;
|
||||
let params = { ...listQuery.value };
|
||||
params.bkfj = params.bkfj ? params.bkfj.join(',') : '';
|
||||
params.bkdxList = params.bkdxList ? params.bkdxList : [];
|
||||
params.bkdxList.forEach(item=>{ item.fjZp = item.fjZp ? item.fjZp.join(',') : '' })
|
||||
params.bkdxList.forEach(item => { item.fjZp = item.fjZp ? item.fjZp.join(',') : '' })
|
||||
loading.value = true;
|
||||
let url = title.value == '新增' ? "/mosty-gsxt/tbGsxtBk/save" : "/mosty-gsxt/tbGsxtBk/update";
|
||||
qcckPost(params, url).then((res) => {
|
||||
proxy.$message({ type: "success", message: "布控成功" });
|
||||
emit("change");
|
||||
loading.value = false;
|
||||
close();
|
||||
}).catch(() => {
|
||||
loading.value = false;
|
||||
});
|
||||
proxy.$message({ type: "success", message: "布控成功" });
|
||||
emit("change");
|
||||
loading.value = false;
|
||||
close();
|
||||
}).catch(() => {
|
||||
loading.value = false;
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
@ -347,50 +456,57 @@ defineExpose({ init });
|
||||
<style lang="scss" scoped>
|
||||
@import "~@/assets/css/layout.scss";
|
||||
@import "~@/assets/css/element-plus.scss";
|
||||
.smallTitle{
|
||||
width: 100%;
|
||||
font-size: 15px;
|
||||
line-height: 50px;
|
||||
font-weight: 550;
|
||||
color: #606266;
|
||||
|
||||
.smallTitle {
|
||||
width: 100%;
|
||||
font-size: 15px;
|
||||
line-height: 50px;
|
||||
font-weight: 550;
|
||||
color: #606266;
|
||||
}
|
||||
|
||||
.mapSearch{
|
||||
left: 10px;
|
||||
top: 10px;
|
||||
z-index: 100;
|
||||
.mapSearch {
|
||||
left: 10px;
|
||||
top: 10px;
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
.dialog{
|
||||
::v-deep .el-form-item--default{
|
||||
margin: 0 1% 0 0 !important;
|
||||
padding-bottom: 0 !important;
|
||||
}
|
||||
.dialog {
|
||||
::v-deep .el-form-item--default {
|
||||
margin: 0 1% 0 0 !important;
|
||||
padding-bottom: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep .avatar-uploader{
|
||||
display: flex;
|
||||
::v-deep .avatar-uploader {
|
||||
display: flex;
|
||||
}
|
||||
::v-deep .el-upload--picture-card i{
|
||||
width: 156px;
|
||||
|
||||
::v-deep .el-upload--picture-card i {
|
||||
width: 156px;
|
||||
}
|
||||
.depBox{
|
||||
border: 1px solid #e9e9e9;
|
||||
width: 305px;
|
||||
padding: 0 0 0 4px;
|
||||
border-radius: 4px;
|
||||
::v-deep .el-input__inner{
|
||||
border: none;
|
||||
}
|
||||
::v-deep .el-cascader .el-input.is-focus .el-input__inner{
|
||||
border-color: transparent !important;
|
||||
}
|
||||
::v-deep .el-input__inner:focus {
|
||||
box-shadow: none;
|
||||
}
|
||||
::v-deep .el-input.is-disabled .el-input__inner{
|
||||
border-color: transparent !important;
|
||||
}
|
||||
|
||||
|
||||
.depBox {
|
||||
border: 1px solid #e9e9e9;
|
||||
width: 305px;
|
||||
padding: 0 0 0 4px;
|
||||
border-radius: 4px;
|
||||
|
||||
::v-deep .el-input__inner {
|
||||
border: none;
|
||||
}
|
||||
|
||||
::v-deep .el-cascader .el-input.is-focus .el-input__inner {
|
||||
border-color: transparent !important;
|
||||
}
|
||||
|
||||
::v-deep .el-input__inner:focus {
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
::v-deep .el-input.is-disabled .el-input__inner {
|
||||
border-color: transparent !important;
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
|
Reference in New Issue
Block a user