更新页面
This commit is contained in:
@ -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>支持png、jpg、pdf文件上传</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>
|
||||
|
||||
Reference in New Issue
Block a user