更新页面

This commit is contained in:
2025-07-10 17:59:39 +08:00
parent 5f6f37a166
commit b2880cd82c
7 changed files with 475 additions and 131 deletions

View File

@ -1,6 +1,6 @@
<template>
<div class="form-item-box" :style="{ width: width }">
<el-date-picker style="width:100%" v-model="modelValue" type="date" v-bind="$attrs" @change="onInput" :placeholder="placeholder" value-format="YYYY-MM-DD"/>
<el-date-picker style="width:100%" v-model="modelValue" type="date" v-bind="$attrs" @change="onInput" :placeholder="placeholder" :value-format="props.format"/>
</div>
</template>
@ -13,6 +13,10 @@ const props = defineProps({
default: "请填写",
type: String
},
format:{
default: "YYYY-MM-DD",
type: String
},
modelValue: {
default: "",
type: String

View File

@ -28,20 +28,43 @@
</div>
</el-popover>
<el-popover placement="bottom" :visible="visiblefp" :width="400" trigger="click">
<el-popover
placement="bottom"
:visible="visiblefp"
:width="400"
trigger="click"
>
<template #reference>
<el-button size="small" type="primary" @click="(visiblefp = !visiblefp), (visible = false)">指定分配</el-button>
<el-button
size="small"
type="primary"
@click="(visiblefp = !visiblefp), (visible = false)"
>指定分配</el-button
>
</template>
<div>
<el-input readonly v-model="obj.fpmc" @click="chooseUserVisible = true" placeholder="请选择民警"></el-input>
<el-input
readonly
v-model="obj.fpmc"
@click="chooseUserVisible = true"
placeholder="请选择民警"
></el-input>
<div class="flex just-center mt10">
<el-button @click="(visiblefp = false), (obj = {})" size="small">取消</el-button>
<el-button type="primary" @click="handlefp" size="small">分配</el-button>
<el-button @click="(visiblefp = false), (obj = {})" size="small"
>取消</el-button
>
<el-button type="primary" @click="handlefp" size="small"
>分配</el-button
>
</div>
</div>
</el-popover>
<el-button size="small" type="primary" @click="handleZxs">转线索</el-button>
<el-button size="small" type="primary" @click="handleMove">移交管控</el-button>
<el-button size="small" type="primary" @click="handleZxs"
>转线索</el-button
>
<el-button size="small" type="primary" @click="handleMove"
>移交管控</el-button
>
<el-button type="primary" size="small" @click="addEdit('add', '')">
<el-icon style="vertical-align: middle">
<CirclePlus />
@ -176,9 +199,25 @@
}"
/>
<!-- 选择用户 -->
<ChooseUser v-model="chooseUserVisible" @choosedUsers="handleUserSelected" :roleIds="roleIds" />
<ChooseUser
v-model="chooseUserVisible"
@choosedUsers="handleUserSelected"
:roleIds="roleIds"
/>
<!-- 转线索 -->
<ZxsForm v-if="showzxs" ref="zxsDilof" @change="getList" :dic="{ D_BZ_SF, D_BZ_XB, D_GS_XS_LY, D_BZ_SSZT, D_GS_XS_LX, D_GS_XS_QTLX }">
<ZxsForm
v-if="showzxs"
ref="zxsDilof"
@change="getList"
:dic="{
D_BZ_SF,
D_BZ_XB,
D_GS_XS_LY,
D_BZ_SSZT,
D_GS_XS_LX,
D_GS_XS_QTLX
}"
>
</ZxsForm>
</div>
</template>
@ -192,8 +231,8 @@ import MyTable from "@/components/aboutTable/MyTable.vue";
import Pages from "@/components/aboutTable/Pages.vue";
import Search from "@/components/aboutTable/Search.vue";
import AddForm from "./components/addForm.vue";
import { qcckGet,qcckPost } from "@/api/qcckApi.js";
import { reactive, ref, onMounted, getCurrentInstance,nextTick } from "vue";
import { qcckGet, qcckPost } from "@/api/qcckApi.js";
import { reactive, ref, onMounted, getCurrentInstance, nextTick } from "vue";
const { proxy } = getCurrentInstance();
const {
D_GS_ZDR_RYJB,
@ -211,7 +250,7 @@ const {
D_BZ_SF,
D_GS_XS_LY,
D_BZ_SSZT,
D_GS_XS_LX,
D_GS_XS_LX,
D_GS_XS_QTLX
} = proxy.$dict(
"D_GS_ZDR_RYJB",
@ -229,8 +268,8 @@ const {
"D_BZ_SF",
"D_GS_XS_LY",
"D_BZ_SSZT",
'D_GS_XS_LX',
'D_GS_XS_QTLX'
"D_GS_XS_LX",
"D_GS_XS_QTLX"
);
const obj = ref({
fpmc: ""
@ -357,7 +396,8 @@ const chooseData = (data) => {
};
// 选择申请数据数据
const handleApplication = () => {
if (ids.value.length === 0) return ElMessage.error("请先选择需要布控的重点人");
if (ids.value.length === 0)
return ElMessage.error("请先选择需要布控的重点人");
qcckPost({ ids: ids.value }, "/mosty-gsxt/tbGsxtZdry/addBksq")
.then(() => {
ElMessage.success("申请成功");
@ -375,38 +415,47 @@ const handleUserSelected = (val) => {
};
const handlefp = () => {
if (ids.value.length === 0) return ElMessage.error("请先选择需要布控的重点人");
qcckPost({ ids: ids.value, uid: obj.value.fpid },"/mosty-gsxt/tbGsxtZdry/addGkmj").then(() => {
ElMessage.success("分配成功");
visible.value = false;
visiblefp.value = false;
getList();
}).catch(() => {
ElMessage.error("分配失败");
});
if (ids.value.length === 0)
return ElMessage.error("请先选择需要布控的重点人");
qcckPost(
{ ids: ids.value, uid: obj.value.fpid },
"/mosty-gsxt/tbGsxtZdry/addGkmj"
)
.then(() => {
ElMessage.success("分配成功");
visible.value = false;
visiblefp.value = false;
getList();
})
.catch(() => {
ElMessage.error("分配失败");
});
};
// 移交管控
const handleMove = () => {
if (ids.value.length === 0) return ElMessage.error("请先选择需要移交管控的重点群体");
if (ids.value.length === 0)
return ElMessage.error("请先选择需要移交管控的重点群体");
proxy.$confirm("是否确定移交?", "警告", { type: "warning" }).then(() => {
qcckPost({ ids: ids.value }, "/mosty-gsxt/tbGsxtZdry/addSfyj").then(() => {
ElMessage.success("移交管控成功");
getList();
}).catch(() => {
ElMessage.error("移交管控失败");
});
})
qcckPost({ ids: ids.value }, "/mosty-gsxt/tbGsxtZdry/addSfyj")
.then(() => {
ElMessage.success("移交管控成功");
getList();
})
.catch(() => {
ElMessage.error("移交管控失败");
});
});
};
const handleZxs = () => {
if (ids.value.length === 0) return ElMessage.error("请先选择需要转线索的重点群体");
if (ids.value.length === 0)
return ElMessage.error("请先选择需要转线索的重点群体");
showzxs.value = true;
nextTick(() => {
zxsDilof.value.init(choosList.value);
});
};
</script>
<style>

View File

@ -3,24 +3,24 @@
<div class="head_box">
<span class="title">布控对象</span>
<div>
<el-button @click="close">关闭</el-button>
<el-button size="small" type="primary" v-if="!disabled" :loading="loading" @click="submit">保存</el-button>
<el-button size="small" @click="close">关闭</el-button>
</div>
</div>
<div class="form_cnt">
<el-form :model="listQuery" inline :label-width="100" label-position="left">
<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" :dictEnum="props.dic.D_GS_BK_DX" placeholder="请选择布控对象" clearable />
<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="chooseVisible = true">
<el-button type="primary" @click="handleAddPeo">
<el-icon style="vertical-align: middle"><CirclePlus /></el-icon>
<span style="vertical-align: middle">新增</span>
</el-button>
<el-button type="danger">批量删除</el-button>
</div>
<div class="relative ww100">
<MyTable
@ -37,10 +37,14 @@
<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="primary" >编辑</el-link>
<el-link type="danger" >删除</el-link>
</template>
</MyTable>
@ -63,11 +67,11 @@
</div>
</el-form-item>
<div style="width: 100%;" class="mt10">
<el-form-item prop="bkSjKs" label="布控开始时间" >
<MOSTY.Date v-model="listQuery.bkSjKs" placeholder="请选择布控开始时间" clearable />
<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="布控结束时间" >
<MOSTY.Date v-model="listQuery.bkSjJs" placeholder="请选择布控结束时间" clearable />
<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="mt10">
@ -84,9 +88,9 @@
</el-form-item>
</div>
<div style="width: 100%;" class="mt10">
<el-form-item prop="fjZp" label="上传附件" style="width: 100%;">
<el-form-item prop="kbfj" label="上传附件" style="width: 100%;">
<div>
<MOSTY.Upload :limit="10" v-model="listQuery.fjZp" />
<MOSTY.Upload :limit="10" v-model="listQuery.kbfj" :key="1" />
<div>支持pngjpgpdf文件上传</div>
</div>
</el-form-item>
@ -108,7 +112,7 @@
</el-radio-group>
</el-form-item>
<el-form-item prop="bkSjQs" label="签收时间">
<MOSTY.Date v-model="listQuery.bkSjQs" placeholder="请选择签收时间" clearable />
<MOSTY.Date v-model="listQuery.bkSjQs" type="datetime" format="YYYY-MM-DD HH:mm:ss" placeholder="请选择签收时间" clearable />
</el-form-item>
</div>
<div class="ww100">
@ -116,8 +120,8 @@
<el-step title="发起申请" >
<template #description>
<div class="flex align-center ww100 mt10 mb20">
<el-input v-model="listQuery.fqr" class="ww20"></el-input>
<el-input v-model="listQuery.fqbm" class="ww20 ml10 mr10"></el-input>
<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>
@ -144,40 +148,42 @@
</div>
</div>
<!-- 选择布控人员 -->
<BkryDialod v-model="chooseVisible" @choosed="choosed" :roleIds="roleIds" />
<BkryDialod v-model="chooseVisible_RY" @choosed="choosed" :roleIds="roleIds" />
<!-- 选择布控群体 -->
<BkqtDialod v-model="chooseVisible_QT" @choosed="choosed" :roleIds="roleIds" />
</template>
<script setup>
import { getItem } from "@/utils/storage";
import BkryDialod from './bkryDialod.vue';
import BkqtDialod from './bkqtDialod.vue';
import GdMap from "@/components/GdMap/index.vue";
import * as MOSTY from "@/components/MyComponents/index";
import MyTable from "@/components/aboutTable/MyTable.vue";
import { qcckGet } from "@/api/qcckApi.js";
import { ref, defineExpose, reactive, onMounted, defineEmits, getCurrentInstance, nextTick } from "vue";
import { fa } from 'element-plus/es/locale.mjs';
import { qcckGet,qcckPost } from "@/api/qcckApi.js";
import { ref, defineExpose, reactive, defineEmits, getCurrentInstance, nextTick } from "vue";
const emit = defineEmits(["change"]);
const props = defineProps({
dic: Object
});
const elform = ref()
const roleIds = ref([]); //角色ID
const chooseVisible = ref(false); //选择布控人员弹窗
const chooseVisible_RY = ref(false); //选择布控人员弹窗
const chooseVisible_QT = ref(false); //选择布控群体弹窗
const bkqyArr = ref([]); //布控区域
const { proxy } = getCurrentInstance();
const dialogForm = ref(false); //弹窗
const loading = ref(false)
const listQuery = ref({
bkYz:'01',
ssqy:'全国',
dtqy:'+范围选择(地图)',
dwlx:'3',
txfs:'3',
wccz: 1,
fqr:'布控发起人:张三',
fqbm:'发起部门:巴宜区公安局城区派出所',
shqr:'审核部门:巴宜区公安局',
spqr:'审批部门:巴宜区公安局',
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" }],
})
const tableDate = reactive({
keyCount: 0,
tableConfiger: {
@ -203,33 +209,87 @@ const tableDate = reactive({
{ label: "车牌号", prop: "clCph" },
{ label: "车架号", prop: "clCjh" },
{ label: "特征描述", prop: "qtTzms" },
{ label: "人员标签", prop: "bqList" }
{ label: "人员标签", prop: "bqList" ,showSolt:true }
]
});
const disabled = ref(false)
// 初始化数据
const init = (type, row) => {
dialogForm.value = true;
get_bkqy_list()
const init = (type,row) => {
if(type == 'add'){
disabled.value = false;
const userInfo = getItem("userInfo");
listQuery.value.bkfqrXm = userInfo.userName;
listQuery.value.bkfqrSfzh = userInfo.idEntityCard;
listQuery.value.bkfqrSsbmmc = userInfo.ssbm;
listQuery.value.bkfqrSsbmdm = userInfo.ssbmdm;
}
disabled.value = type == 'add' ? false : true;
dialogForm.value = true;
get_bkqy_list(row)
};
// 获取布控区域
const get_bkqy_list = () =>{
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=>{
console.log(res,'=========00');
listQuery.value = res || {}
})
}
const shangeDx = () =>{
listQuery.value.bkdxList = [];
roleIds.value = [];
}
// 选择重点人
const choosed = (val) => {
// listQuery.value.bkdx = val.map(v => {
// return { bkdxDm: v.bkdxDm, bkdxId: v.id, bkdxMc: v.bkdxMc }
// });
// roleIds.value = val.map(v => v.id);
if(listQuery.value.bkDx == '01'){// 人员
roleIds.value = (val.filter(v => v.id)).map(it=>it.id);
listQuery.value.bkdxList = val.map(item=>{
return { 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:'', bqList:item.bqList }
});
}else{// 群体
}
};
// 选择人员
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 submit = () => {
elform.value.validate(() => {
let params = { ...listQuery.value };
params.kbfj = params.kbfj ? params.kbfj.join(','):'';
params.bkdxList = params.bkdxList ? params.bkdxList : [];
params.bkdxList.forEach(item=>{
item.fjZp = item.fjZp ? item.fjZp.join(',') : ''
})
loading.value = true;
qcckPost(params, "/mosty-gsxt/tbGsxtBk/save").then((res) => {
proxy.$message({ type: "success", message: "布控成功" });
emit("change");
loading.value = false;
close();
}).catch(() => {
loading.value = false;
});
});
};
// 关闭
const close = () => {
@ -238,8 +298,6 @@ const close = () => {
loading.value = false;
};
defineExpose({ init });
</script>
@ -287,6 +345,9 @@ defineExpose({ init });
::v-deep .el-input__inner:focus {
box-shadow: none;
}
::v-deep .el-input.is-disabled .el-input__inner{
border-color: transparent !important;
}
}
</style>

View File

@ -1,7 +1,7 @@
<template>
<el-dialog v-model="showDialog" :destroy-on-close="true" title="新增人员" @close="close" :close-on-click-modal="false">
<FormMessage v-model="listQuery" :formList="formData" labelWidth="120px" ref="elform" :rules="rules">
<template #rybq>
<template #bqList>
<div class="marks pointer" @click="chooseMarksVisible = true">
<span style="color: rgb(175 178 184);padding-left: 10px;" v-if="!listQuery.bqList || listQuery.bqList.length == 0 ">请选择标签</span>
<span v-else >
@ -25,7 +25,7 @@ import ChooseMarks from "@/components/MyComponents/ChooseMarks/index.vue";
import FormMessage from "@/components/aboutTable/FormMessage.vue";
import { reactive, ref,getCurrentInstance } from 'vue';
const { proxy } = getCurrentInstance();
const { D_BZ_MZ } = proxy.$dict("D_BZ_MZ"); // 获取字典数据
const { D_BZ_XB } = proxy.$dict("D_BZ_XB"); // 获取字典数据
const elform = ref()
const roleIds = ref([])
const showDialog = ref(false)
@ -33,26 +33,28 @@ const chooseMarksVisible = ref(false)
const emit = defineEmits(['change'])
const listQuery = ref({})
const formData = ref([
{ label: "人员姓名", prop: "xm", type: "input" ,width:'45%'},
{ label: "身份证号", prop: "sfzh", type: "input" ,width:'45%'},
{ label: "手机号码", prop: "hjdz", type: "input",width:'45%' },
{ label: "人员民族", prop: "hjdpcsdm", type: "select" ,options:D_BZ_MZ,width:'45%'},
{ label: "户籍地址", prop: "bqList", type: "input",width:'100%',disabled:true },
{ label: "现居住地址", prop: "sfttr", type: "input",width:'100%'},
{ label: "特征描述", prop: "sfxyr", type: "input" ,width:'100%'},
{ label: "人员标签", prop: "rybq", type: "slot" ,width:'45%'},
{ label: "车牌号", prop: "wx", type: "input" ,width:'45%'},
{ label: "人员照片", prop: "qq", type: "upload" ,width:'45%'},
{ label: "人员姓名", prop: "ryXm", type: "input" ,width:'45%'},
{ label: "性别", prop: "ryXb", type: "select" ,width:'45%',options:D_BZ_XB},
{ label: "身份证号", prop: "rySfzh", type: "input" ,width:'45%'},
{ label: "手机号码", prop: "ryLxdh", type: "input",width:'45%' },
{ label: "户籍地址", prop: "hjdXz", type: "input",width:'100%'},
{ label: "现居住地址", prop: "xzdXz", type: "input",width:'100%'},
{ label: "特征描述", prop: "qtTzms", type: "input" ,width:'100%'},
{ label: "人员标签", prop: "bqList", type: "slot" ,width:'100%'},
{ label: "车牌号", prop: "clCph", type: "input" ,width:'45%'},
{ label: "车架号", prop: "clCjh", type: "input" ,width:'45%'},
{ label: "人员照片", prop: "fjZp", type: "upload" ,width:'100%'},
])
const rules = reactive({
xm: [{ required: true, message: "请输入姓名", trigger: "blur" }],
xb: [{ required: true, message: "请选择性别", trigger: "change" }],
sfzh: [{ required: true, message: "请输入身份证号", trigger: "blur" }],
hjd: [{ required: true, message: "请输入户籍地", trigger: "blur" }],
ryXm: [{ required: true, message: "请输入姓名", trigger: "blur" }],
rySfzh: [{ required: true, message: "请输入身份证号", trigger: "blur" }],
ryXb: [{ required: true, message: "请选择性别", trigger: "change" }],
ryLxdh: [{ required: true, message: "请输入手机号码", trigger: "blur" }],
hjdXz: [{ required: true, message: "请输入户籍地", trigger: "blur" }],
xzdXz: [{ required: true, message: "请输入现居住地址", trigger: "blur" }],
})
const title = ref('')
const order = ref(null)
const init = () =>{
showDialog.value = true;
}
@ -72,13 +74,14 @@ const closeTag = (idx) =>{
const submitForm = () =>{
elform.value.submit((val)=>{
emit('change',[val])
emit('change',val)
showDialog.value = false;
})
}
const close = () =>{
elform.value.reset();
listQuery.value.bqList = []
showDialog.value = false;
}
@ -88,7 +91,6 @@ defineExpose({init})
<style lang="scss" scoped>
.marks{
width: 100%;
width: 100%;
min-height: 32px;
border: 1px solid #e9e9e9;

View File

@ -0,0 +1,201 @@
<template>
<el-dialog width="1400px" :model-value="modelValue" append-to-body @close="closed">
<template #title>
<span class="mr10 f16">选择布控群体</span>
</template>
<el-form :model="listQuery" :inline="true">
<el-form-item label="群体名称">
<el-input placeholder="请输入群体名称" v-model="listQuery.qtMc" clearable ></el-input>
</el-form-item>
<el-form-item>
<el-button type="success" @click="handleFilter">查询</el-button>
<el-button type="info" @click="reset()"> 重置 </el-button>
</el-form-item>
</el-form>
<div class="tabBox" :class="props.Single ? 'tabBoxRadio' : ''" style="margin-top: 0px">
<el-table ref="multipleUserRef" :key="keyTabel" @selection-change="handleSelectionChange" :data="tableData" border :row-key="keyid" style="width: 100%" height="450">
<el-table-column type="selection" width="55" :reserve-selection="true"/>
<el-table-column type="expand">
<template #default="props">
<div class="pl20 pr10 pt10 pb10">
<el-table :data="props.row.zdryList" >
<el-table-column label="姓名" prop="ryXm" align="center" />
<el-table-column prop="rySfzh" align="center" label="身份证"/>
<el-table-column prop="ryXb" align="center" label="性别">
<template #default="{ row }">
<DictTag :tag="false" :value="row.ryXb" :options="D_BZ_XB" />
</template>
</el-table-column>
<el-table-column prop="ryMz" align="center" label="民族">
<template #default="{ row }">
<DictTag :value="row.ryMz" :tag="false" :options="D_BZ_MZ" />
</template>
</el-table-column>
<el-table-column prop="ryLxdh" align="center" label="手机号"/>
<el-table-column prop="xzdXz" align="center" label="现居住址"/>
</el-table>
</div>
</template>
</el-table-column>
<el-table-column prop="qtMc" align="center" label="群体名称"/>
<el-table-column prop="qtFxdj" align="center" label="风险等级">
<template #default="{ row }">
<DictTag :value="row.qtFxdj" :tag="false" :options="D_GS_ZDQT_FXDJ" />
</template>
</el-table-column>
</el-table>
</div>
<div class="fenye flex just-end " :style="{ top: tableHeight + 'px' }">
<el-pagination
class="pagination"
@size-change="handleSizeChange"
@pageCurrent-change="handleCurrentChange"
:pageCurrent-page="listQuery.pageCurrent"
:page-sizes="[10, 20, 50, 100]"
:page-size="listQuery.size"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
></el-pagination>
</div>
<template #footer>
<div class="flex just-center">
<el-button type="primary" @click="onComfirm">确认</el-button>
<el-button @click="closed">取消</el-button>
</div>
</template>
</el-dialog>
</template>
<script setup>
import { qcckGet} from "@/api/qcckApi.js";
import { defineProps, ref ,getCurrentInstance, watch} from "vue";
const { proxy } = getCurrentInstance();
const { D_BZ_XB,D_GS_ZDQT_FXDJ,D_BZ_MZ } = proxy.$dict("D_BZ_XB","D_GS_ZDQT_FXDJ","D_BZ_MZ"); //获取字典数据
const props = defineProps({
modelValue: {
type: Boolean,
default:false
},
LeaderType: {
type: String,
default: ""
},
//是否单选
Single: {
type: Boolean,
default: false
},
roleIds: {
type: Array,
default: []
},
});
const total = ref(0);
const listQuery = ref({
pageCurrent: 1,
pageSize: 20
});
const multipleUserRef = ref(null);
const multipleSelectionUser = ref([]);
const tableData = ref([]);
const emits = defineEmits(["update:modelValue", "choosed"]);
const keyTabel = ref(0)
const keyid = (row) => {
return row.id;
};
const closed = () => {
emits("update:modelValue", false);
};
const reset = () => {
listQuery.value = { pageCurrent: 1, pageSize: 20, };
getListData();
};
// 为用户分配角色
const onComfirm = () => {
const userList = multipleSelectionUser.value;
let list = [];
let listId = [];
userList.forEach((val) => {
if (listId.indexOf(val.id) == -1) {
list.push(val);
listId.push(val.id);
}
});
emits("choosed", list);
closed();
};
/**
* pageSize 改变触发
*/
const handleSizeChange = (currentSize) => {
listQuery.value.pageSize = currentSize;
getListData();
};
/**
* 页码改变触发
*/
const handleCurrentChange = (currentPage) => {
listQuery.value.pageCurrent = currentPage;
getListData();
};
const getListData = () => {
keyTabel.value++
const params = {...listQuery.vlue}
qcckGet(params,'/mosty-gsxt/tbGsxtZdqt/selectPage').then(res=>{
tableData.value = res.records || [];
total.value = res.total;
multipleUser();
})
};
//列表回显
function multipleUser() {
tableData.value.forEach((item) => {
multipleUserRef.value.toggleRowSelection(item, false);
if (props.roleIds.some((id) => id == item.id)) {
multipleUserRef.value.toggleRowSelection(item, true);
}
});
}
const handleFilter = () => {
listQuery.value.pageCurrent = 1;
getListData();
};
const handleSelectionChange = (val) => {
if (props.Single) {
if (val.length > 1) {
let del_row = val.shift();
multipleUserRef.value.toggleRowSelection(del_row, false);
}
multipleSelectionUser.value = val;
} else {
multipleSelectionUser.value = val;
}
};
watch(()=>props.modelValue,val=>{
if(val) handleFilter();
},{immediate:true})
</script>
<style lang="scss" scoped>
@import "@/assets/css/layout.scss";
@import "@/assets/css/element-plus.scss";
</style>
<style>
.tabBoxRadio .el-checkbox__inner {
border-radius: 50% !important;
}
.tabBoxRadio .el-table__header-wrapper .el-checkbox {
display: none;
}
</style>

View File

@ -22,26 +22,32 @@
<div class="tabBox" :class="props.Single ? 'tabBoxRadio' : ''" style="margin-top: 0px">
<el-table ref="multipleUserRef" :key="keyTabel" @selection-change="handleSelectionChange" :data="tableData" border :row-key="keyid" style="width: 100%" height="450">
<el-table-column type="selection" width="55" :reserve-selection="true"/>
<el-table-column prop="bqMc" align="center" label="照片"/>
<el-table-column prop="bqDm" align="center" label="姓名"/>
<el-table-column prop="bqDj" align="center" label="性别">
<el-table-column prop="ryXm" align="center" label="姓名"/>
<el-table-column prop="rySfzh" align="center" label="身份证"/>
<el-table-column prop="ryXb" align="center" label="性别">
<template #default="{ row }">
<DictTag :tag="false" :value="row.bqDj" :options="D_GS_BQ_DJ" />
<DictTag :tag="false" :value="row.ryXb" :options="D_BZ_XB" />
</template>
</el-table-column>
<el-table-column prop="bqYs" align="center" label="民族">
<el-table-column prop="ryMz" align="center" label="民族">
<template #default="{ row }">
<DictTag :value="row.bqYs" :tag="false" :options="D_GS_SSYJ" />
<DictTag :value="row.ryMz" :tag="false" :options="D_BZ_MZ" />
</template>
</el-table-column>
<el-table-column prop="hjdXz" align="center" label="户籍地"/>
<el-table-column prop="xzdXz" align="center" label="现居住址"/>
<el-table-column prop="ryLxdh" align="center" label="手机号"/>
<el-table-column prop="qtXnsf" align="center" label="虚拟身份"/>
<el-table-column prop="clCph" align="center" label="车牌号"/>
<el-table-column prop="clCjh" align="center" label="车架号"/>
<el-table-column prop="qtTzms" align="center" label="特征描述"/>
<el-table-column prop="bqList" align="center" label="人员标签">
<template #default="{ row }">
<span v-if="row.bqList">
<span v-for="(it,idx) in row.bqList" :key="idx"> {{ it.bqMc }}</span>
</span>
</template>
</el-table-column>
<el-table-column prop="bqDm" align="center" label="户籍地"/>
<el-table-column prop="bqDm" align="center" label="现居住址"/>
<el-table-column prop="bqDm" align="center" label="手机号"/>
<el-table-column prop="bqDm" align="center" label="虚拟身份"/>
<el-table-column prop="bqDm" align="center" label="车牌号"/>
<el-table-column prop="bqDm" align="center" label="车架号"/>
<el-table-column prop="bqDm" align="center" label="特征描述"/>
<el-table-column prop="bqDm" align="center" label="人员标签"/>
</el-table>
</div>
<div class="fenye flex just-end " :style="{ top: tableHeight + 'px' }">
@ -73,7 +79,7 @@ import AddPeo from './addPeo.vue'
import { qcckGet} from "@/api/qcckApi.js";
import { defineProps, ref ,getCurrentInstance, watch} from "vue";
const { proxy } = getCurrentInstance();
const { D_GS_BQ_DJ,D_GS_SSYJ } = proxy.$dict("D_GS_BQ_DJ","D_GS_SSYJ"); //获取字典数据
const { D_BZ_XB,D_BZ_MZ } = proxy.$dict("D_BZ_XB","D_BZ_MZ"); //获取字典数据
const props = defineProps({
modelValue: {
type: Boolean,
@ -91,7 +97,7 @@ const props = defineProps({
roleIds: {
type: Array,
default: []
}
},
});
const total = ref(0);
const listQuery = ref({
@ -102,7 +108,7 @@ const addPerson = ref()
const multipleUserRef = ref(null);
const multipleSelectionUser = ref([]);
const tableData = ref([]);
const emits = defineEmits(["update:modelValue", "choosed"]);
const emits = defineEmits(["update:modelValue", "choosed","choosedAdd"]);
const keyTabel = ref(0)
const keyid = (row) => {
return row.id;
@ -134,7 +140,17 @@ const onComfirm = () => {
// 自定义加人
const changeZdy = (val) => {
emits("choosed", val);
const userList = multipleSelectionUser.value;
let list = [];
let listId = [];
userList.forEach((val) => {
if (listId.indexOf(val.id) == -1) {
list.push(val);
listId.push(val.id);
}
});
list.unshift(val)
emits("choosed", list);
closed();
}
/**
@ -153,8 +169,8 @@ const handleCurrentChange = (currentPage) => {
};
const getListData = () => {
keyTabel.value++
const params = {bqLb:'02',...listQuery.vlue}
qcckGet(params,'/mosty-gsxt/tbGsxtBqgl/selectPage').then(res=>{
const params = {...listQuery.vlue}
qcckGet(params,'/mosty-gsxt/tbGsxtZdry/selectPage').then(res=>{
tableData.value = res.records || [];
total.value = res.total;
multipleUser();

View File

@ -1,7 +1,10 @@
<template>
<div>
<div class="titleBox">
<PageTitle title="我的布控" />
<PageTitle title="我的布控">
<el-button type="primary" @click="sendControl('add',null)">发起布控</el-button>
<el-button type="primary">导出</el-button>
</PageTitle>
</div>
<!-- 搜索 -->
<div ref="searchBox">
@ -9,11 +12,6 @@
</div>
<!-- 按钮组 -->
<div class="content">
<div class="btns">
<el-button type="primary" @click="sendControl">发起布控</el-button>
<el-button type="primary">导出</el-button>
<el-button type="danger">批量删除</el-button>
</div>
<!-- 表格 -->
<div class="tabBox">
<MyTable
@ -30,6 +28,9 @@
<template #bkDj="{ row }">
<DictTag :tag="false" :value="row.bkDj" :options="D_GS_BK_DJ" />
</template>
<template #bkDx="{ row }">
<DictTag :tag="false" :value="row.bkDx" :options="D_GS_BK_DX" />
</template>
<template #bkDxxx="{ row }">
<span v-if="row.bkDxxx"><span v-for="(it,idx) in row.bkDxxx" :key="idx"> {{ it.ryXm }} </span></span>
<span v-else>暂无</span>
@ -46,9 +47,9 @@
</template>
<!-- 操作 -->
<template #controls="{ row }">
<el-link type="primary" size="small" @click="handleRow('edit', row)">编辑</el-link>
<el-link type="primary" size="small" @click="sendControl('detail',row)">详情</el-link>
<el-link type="primary" size="small">续控</el-link>
<el-link type="danger" size="small" @click="handleRow('delete', row)">删除</el-link>
<el-link type="danger" size="small" @click="handleRow(row.id)">删除</el-link>
</template>
</MyTable>
<Pages @changeNo="changeNo" @changeSize="changeSize" :tableHeight="pageData.tableHeight" :pageConfiger="{
@ -59,7 +60,7 @@
</div>
</div>
<!-- 布控对象 -->
<AddBkdx ref="addBkdxForm" :dic="{D_GS_BK_DX,D_GS_BK_BKYS,D_BZ_XB,D_GS_BK_CZYQ,D_GS_BK_DJ,D_GS_BK_CZJSDWLX,D_GS_BK_TJFS}" />
<AddBkdx ref="addBkdxForm" @change="getList" :dic="{D_GS_BK_DX,D_GS_BK_BKYS,D_BZ_XB,D_GS_BK_CZYQ,D_GS_BK_DJ,D_GS_BK_CZJSDWLX,D_GS_BK_TJFS}" />
<!-- 预警弹窗 -->
<YjDialog ref="warningkdxForm"></YjDialog>
</template>
@ -127,7 +128,7 @@ const pageData = reactive({
tableColumn: [
{ label: "布控级别", prop: "bkDj", showSolt: true },
{ label: "布控标题", prop: "bkBt" },
{ label: "布控对象", prop: "bkDx" },
{ label: "布控对象", prop: "bkDx",showSolt: true },
{ label: "布控对象信息", prop: "bkDxxx",showSolt: true },
{ label: "布控范围", prop: "qyList", showSolt: true },
{ label: "涉及人数", prop: "sjrs",showSolt: true },
@ -182,17 +183,27 @@ const openWarning = (val) =>{
warningkdxForm.value.init(val)
}
const sendControl = () => {
addBkdxForm.value.init();
const sendControl = (type,row) => {
addBkdxForm.value.init(type,row);
};
// 删除
const handleRow = (id) => {
proxy.$confirm("确定要删除", "警告", { type: "warning" }).then(() => {
qcckDelete({}, "/mosty-gsxt/tbGsxtBk/"+id).then(() => {
proxy.$message({ type: "success", message: "删除成功" });
getList();
});
})
};
// 表格高度计算
const tabHeightFn = () => {
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 292;
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 270;
window.onresize = function () {
tabHeightFn();
};
};
</script>
};</script>
<style lang="scss" scoped>
.el-loading-mask {