lcw
This commit is contained in:
104
src/components/ChooseList/ChooseCl/addPeo.vue
Normal file
104
src/components/ChooseList/ChooseCl/addPeo.vue
Normal file
@ -0,0 +1,104 @@
|
||||
<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 #bqList>
|
||||
<div class="marks pointer" @click="chooseMarksVisible = true">
|
||||
<span style="color: rgb(175 178 184);padding-left: 10px;"
|
||||
v-if="!listQuery.bqList || listQuery.bqList.length == 0">请选择标签</span>
|
||||
<span v-else>
|
||||
<el-tag @close.stop="closeTag(idx)" type="success" closable v-for="(it, idx) in listQuery.bqList"
|
||||
:key="idx">{{ it.bqMc }}</el-tag>
|
||||
</span>
|
||||
</div>
|
||||
</template>
|
||||
</FormMessage>
|
||||
<template #footer>
|
||||
<div class="flex just-center">
|
||||
<el-button @click="close">取消</el-button>
|
||||
<el-button type="primary" @click="submitForm">确认</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
<ChooseMarks v-model="chooseMarksVisible" @choosed="choosed" :roleIds="roleIds" />
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import ChooseMarks from "@/components/ChooseList/ChooseMarks/index.vue";
|
||||
import FormMessage from "@/components/aboutTable/FormMessage.vue";
|
||||
import { reactive, ref, getCurrentInstance } from 'vue';
|
||||
const { proxy } = getCurrentInstance();
|
||||
const { D_BZ_XB } = proxy.$dict("D_BZ_XB"); // 获取字典数据
|
||||
const elform = ref()
|
||||
const roleIds = ref([])
|
||||
const showDialog = ref(false)
|
||||
const chooseMarksVisible = ref(false)
|
||||
const emit = defineEmits(['change'])
|
||||
const listQuery = ref({})
|
||||
const formData = ref([
|
||||
{ label: "车牌号", prop: "hphm", type: "input" },
|
||||
{ label: "车架号", prop: "clCjh", type: "input" },
|
||||
{
|
||||
label: "车辆颜色",
|
||||
prop: "clYs",
|
||||
type: "input",
|
||||
},
|
||||
{ label: "车辆所有人", prop: "clSyr", type: "input" },
|
||||
{ label: "人员身份证", prop: "clSyrsfzh", type: "input" },
|
||||
{ label: "责任单位", prop: "zrSsbmdm", depMc: 'zrSsbmmc', type: "department" },
|
||||
{ label: "管辖单位", prop: "gxSsbmdm", depMc: 'gxSsbmmc', type: "department" },
|
||||
{ label: "管控民警姓名", prop: "gkMjXm", type: "input" },
|
||||
{ label: "管控民警警号", prop: "gkMjJh", type: "input" },
|
||||
{ label: "管控原因", prop: "clLkyy", type: "textarea", width: "100%" },
|
||||
{ label: "车辆照片", prop: "fjdz", type: "upload", width: "100%" },
|
||||
])
|
||||
const rules = reactive({
|
||||
hphm: [{ required: true, message: "请输入车牌号", trigger: "blur" }],
|
||||
clCjh: [{ required: true, message: "请输入车架号", trigger: "blur" }],
|
||||
clYs: [{ required: true, message: "请输入车辆颜色", trigger: "blur" }],
|
||||
clSyr: [{ required: true, message: "请输入车辆所有人", trigger: "blur" }],
|
||||
clSyrsfzh: [{ required: true, message: "请输入人员身份证", trigger: "blur" }],
|
||||
})
|
||||
const init = () => {
|
||||
showDialog.value = true;
|
||||
}
|
||||
|
||||
// 选择标签
|
||||
const choosed = (val) => {
|
||||
listQuery.value.bqList = val.map(v => {
|
||||
return { bqZl: v.bqLb, bqId: v.id, bqLx: v.bqLx, bqLb: v.bqLb, bqMc: v.bqMc, bqDm: v.bqDm }
|
||||
});
|
||||
roleIds.value = val.map(v => v.id)
|
||||
}
|
||||
|
||||
// 删除数据
|
||||
const closeTag = (idx) => {
|
||||
listQuery.value.bqList.splice(idx, 1)
|
||||
roleIds.value.splice(idx, 1)
|
||||
}
|
||||
|
||||
const submitForm = () => {
|
||||
elform.value.submit((val) => {
|
||||
val.id = new Date().getTime()
|
||||
emit('change', val)
|
||||
showDialog.value = false;
|
||||
})
|
||||
}
|
||||
|
||||
const close = () => {
|
||||
elform.value.reset();
|
||||
listQuery.value.bqList = []
|
||||
roleIds.value = []
|
||||
showDialog.value = false;
|
||||
}
|
||||
|
||||
defineExpose({ init })
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.marks {
|
||||
width: 100%;
|
||||
min-height: 32px;
|
||||
border: 1px solid #e9e9e9;
|
||||
border-radius: 4px;
|
||||
}
|
||||
</style>
|
204
src/components/ChooseList/ChooseCl/index.vue
Normal file
204
src/components/ChooseList/ChooseCl/index.vue
Normal file
@ -0,0 +1,204 @@
|
||||
<template>
|
||||
<el-dialog width="1400px" :model-value="modelValue" append-to-body @close="closed">
|
||||
<template #title>
|
||||
<span class="mr10 f16">选择布控车辆</span>
|
||||
<el-button type="primary" size="small" @click="zdyaddPerson">添加其他车辆</el-button>
|
||||
</template>
|
||||
<el-form :model="listQuery" :inline="true">
|
||||
<el-form-item label="车牌号">
|
||||
<el-input placeholder="请输入车牌号" v-model="listQuery.hphm" clearable ></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="车架号">
|
||||
<el-input placeholder="请输入车架号" v-model="listQuery.clCjh" clearable ></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="车辆所有人">
|
||||
<el-input placeholder="请输入车辆所有人" v-model="listQuery.clSyr" 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" v-loading="loading" @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="hphm" align="center" label="车牌号"/>
|
||||
<el-table-column prop="clCjh" align="center" label="车架号"/>
|
||||
<el-table-column prop="clYs" align="center" label="车辆颜色"/>
|
||||
<el-table-column prop="clSyr" align="center" label="车辆所有人"/>
|
||||
<el-table-column prop="gxSsbmmc" align="center" label="管辖单位"/>
|
||||
<el-table-column prop="gkMjXm" align="center" label="管控民警"/>
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="fenye flex just-end " :style="{ top: tableHeight + 'px' }">
|
||||
<el-pagination
|
||||
class="pagination"
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="handleCurrentChange"
|
||||
:current-page="listQuery.pageCurrent"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
:page-size="listQuery.pageSize"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="total"
|
||||
></el-pagination>
|
||||
</div>
|
||||
<template #footer>
|
||||
<div class="flex just-center">
|
||||
<el-button @click="closed">取消</el-button>
|
||||
<el-button type="primary" @click="onComfirm">确认</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 自定义选添加人 -->
|
||||
<AddPeo ref="addPerson" @change="changeZdy"></AddPeo>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import AddPeo from './addPeo.vue'
|
||||
import { qcckGet} from "@/api/qcckApi.js";
|
||||
import { defineProps, ref ,getCurrentInstance, watch} from "vue";
|
||||
const { proxy } = getCurrentInstance();
|
||||
const { D_BZ_XB,D_BZ_MZ } = proxy.$dict("D_BZ_XB","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 loading = ref(false)
|
||||
const total = ref(0);
|
||||
const listQuery = ref({
|
||||
pageCurrent: 1,
|
||||
pageSize: 20
|
||||
});
|
||||
const addPerson = ref()
|
||||
const multipleUserRef = ref(null);
|
||||
const multipleSelectionUser = ref([]);
|
||||
const tableData = ref([]);
|
||||
const emits = defineEmits(["update:modelValue", "choosed","choosedAdd"]);
|
||||
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();
|
||||
};
|
||||
|
||||
// 自定义加人
|
||||
const changeZdy = (val) => {
|
||||
emits("choosedAdd", val);
|
||||
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.value}
|
||||
loading.value = true;
|
||||
qcckGet(params,'/mosty-gsxt/tbGsxtZdcl/selectPage').then(res=>{
|
||||
loading.value = false;
|
||||
tableData.value = res.records || [];
|
||||
total.value = res.total;
|
||||
multipleUser();
|
||||
}).catch(()=>{
|
||||
loading.value = false;
|
||||
})
|
||||
};
|
||||
|
||||
//列表回显
|
||||
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;
|
||||
}
|
||||
};
|
||||
|
||||
const zdyaddPerson = () => {
|
||||
addPerson.value.init();
|
||||
};
|
||||
|
||||
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>
|
@ -46,11 +46,15 @@ const mMap = ref(null); //地图对象
|
||||
const mapUtil = ref(null); //地图工具对象
|
||||
const zoomTarget = ref(6);
|
||||
|
||||
// 定义组件发出的事件
|
||||
const emit = defineEmits(['mapLoaded'])
|
||||
|
||||
const props = defineProps({
|
||||
mapid: {
|
||||
type: String,
|
||||
default: "mapDiv"
|
||||
},
|
||||
|
||||
//是否显示可以切换地图底图
|
||||
isShow: {
|
||||
type: Boolean,
|
||||
@ -79,6 +83,8 @@ let map;
|
||||
let mapLayer;
|
||||
let mapLayer1;
|
||||
onMounted(() => {
|
||||
console.log("xxxxxxx");
|
||||
|
||||
emitter.on("followUp", (res) => {
|
||||
let box = document.getElementsByClassName("changeMap_box");
|
||||
if (!box) return;
|
||||
@ -110,6 +116,8 @@ onMounted(() => {
|
||||
url: 'http://webrd02.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=8&x={x}&y={y}&z={z}',
|
||||
})
|
||||
zoomTarget.value = map.mapboxGLMap.getZoom();
|
||||
// 地图加载完成后发出事件
|
||||
emit('mapLoaded')
|
||||
});
|
||||
mapUtil.value = new MapUtil(map);
|
||||
|
||||
|
@ -390,6 +390,15 @@ export const publicRoutes = [
|
||||
icon: "article"
|
||||
}
|
||||
},
|
||||
// {
|
||||
// path: "/MakeAcomment",
|
||||
// name: "MakeAcomment",
|
||||
// component: () => import("@/views/backOfficeSystem/MakeAcomment/index"),
|
||||
// meta: {
|
||||
// title: "情报评一评",
|
||||
// icon: "article"
|
||||
// }
|
||||
// }
|
||||
]
|
||||
},
|
||||
{
|
||||
@ -537,18 +546,18 @@ export const publicRoutes = [
|
||||
icon: "article"
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: "/surveillanceControl",
|
||||
name: "surveillanceControl",
|
||||
component: () =>
|
||||
import(
|
||||
"@/views/backOfficeSystem/BasicManagement/surveillanceControl/index"
|
||||
),
|
||||
meta: {
|
||||
title: "布控监视",
|
||||
icon: "article"
|
||||
}
|
||||
},
|
||||
// {
|
||||
// path: "/surveillanceControl",
|
||||
// name: "surveillanceControl",
|
||||
// component: () =>
|
||||
// import(
|
||||
// "@/views/backOfficeSystem/BasicManagement/surveillanceControl/index"
|
||||
// ),
|
||||
// meta: {
|
||||
// title: "布控监视",
|
||||
// icon: "article"
|
||||
// }
|
||||
// },
|
||||
{
|
||||
path: "/experienceShare",
|
||||
name: "experienceShare",
|
||||
|
@ -2,9 +2,13 @@
|
||||
<div>
|
||||
<div class="titleBox">
|
||||
<PageTitle title="人力情报数据采集管理">
|
||||
<el-button type="primary">
|
||||
<!-- <el-button type="primary">
|
||||
<el-icon style="vertical-align: middle"><CirclePlus /></el-icon>
|
||||
<span style="vertical-align: middle">导出</span>
|
||||
</el-button> -->
|
||||
<el-button type="primary" @click="dologShowFn()">
|
||||
<el-icon style="vertical-align: middle"><CirclePlus /></el-icon>
|
||||
<span style="vertical-align: middle">全域搜索</span>
|
||||
</el-button>
|
||||
</PageTitle>
|
||||
</div>
|
||||
@ -81,12 +85,19 @@
|
||||
</div>
|
||||
<!-- 新增 -->
|
||||
<AddForm ref="detailDiloag" @change="change" v-if="isShow" :dic="{D_BZ_SF,D_BZ_XB,D_GS_XS_LY,D_BZ_SSZT,D_GS_XS_LX ,D_GS_XS_QTLX}" />
|
||||
</div>
|
||||
|
||||
<DialogDragger title="全域搜索" top="30px" v-model="dologShow" coumClass="zdy-model-dialogs" @close="close" width="80%">
|
||||
<iframe style="width: 100%; height: 1000px" src="https://www.baidu.com" frameborder="0">
|
||||
xxxxx
|
||||
</iframe>
|
||||
</DialogDragger>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { download } from "@/utils/request";
|
||||
import * as MOSTY from "@/components/MyComponents/index";
|
||||
import DialogDragger from "@/views/home/layout/dialogDragger.vue";
|
||||
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||
import Pages from "@/components/aboutTable/Pages.vue";
|
||||
@ -94,7 +105,6 @@ 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 { fa } from "element-plus/es/locale.mjs";
|
||||
const { proxy } = getCurrentInstance();
|
||||
const {D_GS_XS_CZZT,D_GS_XS_LY, D_BZ_SSZT,D_BZ_SF,D_GS_XS_LX ,D_GS_XS_QTLX,D_BZ_XB,D_BZ_XSSHZT} = proxy.$dict("D_GS_XS_CZZT","D_GS_XS_LY","D_BZ_SSZT","D_BZ_SF","D_GS_XS_LX","D_GS_XS_QTLX","D_BZ_XB","D_BZ_XSSHZT"); //获取字典数据
|
||||
const detailDiloag = ref();
|
||||
@ -232,6 +242,10 @@ const tabHeightFn = () => {
|
||||
tabHeightFn();
|
||||
};
|
||||
};
|
||||
const dologShow = ref(false)
|
||||
const dologShowFn = (val) =>{
|
||||
dologShow.value = true;
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@ -245,11 +259,26 @@ const tabHeightFn = () => {
|
||||
color: red;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
<style>
|
||||
.el-loading-mask {
|
||||
background: rgba(0, 0, 0, 0.5) !important;
|
||||
}
|
||||
:v-deep .el-dialog{
|
||||
width: 90% !important;
|
||||
}
|
||||
.zdy-model-dialogs {
|
||||
/* background-color: rgb(50, 148, 214); */
|
||||
background: url("~@/assets/images/bg46.png") no-repeat center center;
|
||||
background-size: 100% 100%;
|
||||
padding: 8px 10px;
|
||||
box-sizing: border-box;
|
||||
pointer-events: auto !important;
|
||||
height:calc(100% - 50px);
|
||||
overflow: auto;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
@ -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>
|
||||
|
@ -47,7 +47,8 @@ import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||
import Pages from "@/components/aboutTable/Pages.vue";
|
||||
import Search from "@/components/aboutTable/Search.vue";
|
||||
import { qcckPost } from "@/api/qcckApi.js";
|
||||
import {ref,reactive, nextTick,getCurrentInstance} from 'vue';
|
||||
import { ref, reactive, nextTick, getCurrentInstance } from 'vue';
|
||||
import { useRouter,useRoute } from 'vue-router'
|
||||
const { proxy } = getCurrentInstance();
|
||||
const { D_GS_ZDR_RYJB,D_GS_ZDR_YJDJ} = proxy.$dict("D_GS_ZDR_RYJB","D_GS_ZDR_YJDJ"); //获取字典数据
|
||||
const showDialog = ref(false)
|
||||
@ -57,6 +58,9 @@ const searchConfiger = ref(
|
||||
{ label: "姓名", prop: 'ryXm', placeholder: "请输入姓名", showType: "input"},
|
||||
{ label: "身份证号", prop: 'rySfzh', placeholder: "请输入身份证号", showType: "input"},
|
||||
]);
|
||||
const emit=defineEmits(['getData'])
|
||||
const router = useRouter()
|
||||
const route=useRoute()
|
||||
const pageData = reactive({
|
||||
tableData: [], //表格数据
|
||||
keyCount: 0,
|
||||
@ -122,7 +126,9 @@ const getList = () =>{
|
||||
|
||||
const close = () =>{
|
||||
pageData.tableData = [];
|
||||
showDialog.value = false;
|
||||
showDialog.value = false;
|
||||
router.replace(route.query)
|
||||
emit("getData")
|
||||
}
|
||||
|
||||
const init = (val,lxs) =>{
|
||||
|
@ -11,30 +11,37 @@
|
||||
<!-- 研判类型 -->
|
||||
<CheckBox :data="checkData.yplxBtn" @changeData="changeData_yplx"></CheckBox>
|
||||
</div>
|
||||
<div ref="searchBox" >
|
||||
<div ref="searchBox">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch"> </Search>
|
||||
</div>
|
||||
<ul class="cntlsit mb10" v-if="show" v-infinite-scroll="load" :style="{height:listHeight+'px'}" v-loading="loading">
|
||||
<li class="cntItem" @click.stop="lookDeatl(it)" v-for="(it,idx) in list" :key="idx">
|
||||
<ul class="cntlsit mb10" v-if="show" v-infinite-scroll="load" :style="{ height: listHeight + 'px' }"
|
||||
v-loading="loading">
|
||||
<li class="cntItem" @click.stop="lookDeatl(it)" v-for="(it, idx) in list" :key="idx">
|
||||
<div class="ww100"><img class="ww100" style="height: 168px;" src="@/assets/images/mxbg.jpg" alt=""></div>
|
||||
<div class="f14 lh24 pl4 pr4 one_text_detail">名称:{{ it.ypMc }}</div>
|
||||
<div class="flex ww100 f14 lh24 pl4 pr4 one_text_detail">类型:<DictTag :value="it.ypLx" :tag="false" :options="D_SG_TSYPGZ" /></div>
|
||||
<div class="flex ww100 f14 lh24 pl4 pr4 one_text_detail">类型:
|
||||
<DictTag :value="it.ypLx" :tag="false" :options="D_SG_TSYPGZ" />
|
||||
</div>
|
||||
<div class="f14 lh24 pl4 pr4 one_text_detail">数量:{{ it.num }}</div>
|
||||
<div class="foot">
|
||||
<span class="ml10 pointer" @click.stop="handleYp(it)" style="color:#027ff0 ;"><el-icon style="top: 2px;"><Document /></el-icon>报告</span>
|
||||
<span class="ml10 pointer" @click="handleHs(it)" style="color:#f4ac47 ;"><el-icon style="top: 2px;"><Files /></el-icon>会商</span>
|
||||
<span class="ml10 pointer" @click.stop="handleYp(it)" style="color:#027ff0 ;"><el-icon style="top: 2px;">
|
||||
<Document />
|
||||
</el-icon>报告</span>
|
||||
<span class="ml10 pointer" @click="handleHs(it)" style="color:#f4ac47 ;"><el-icon style="top: 2px;">
|
||||
<Files />
|
||||
</el-icon>会商</span>
|
||||
</div>
|
||||
</li>
|
||||
<div class="ww100 flex just-center">
|
||||
<MOSTY.Empty :show="!loading && list.length <= 0"></MOSTY.Empty>
|
||||
</div>
|
||||
<div class="tc ww100 mb4" style="color: #a29f9f;" v-if="total == list.length && total>0">暂时没有数据了!</div>
|
||||
<div class="tc ww100 mb4" style="color: #a29f9f;" v-if="total == list.length && total > 0">暂时没有数据了!</div>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 详情 -->
|
||||
<Detail ref="detailForm"></Detail>
|
||||
<YpModel v-model="showModel" :textContent="textContent" ></YpModel>
|
||||
<Detail ref="detailForm" @getData="getLits"></Detail>
|
||||
<YpModel v-model="showModel" :textContent="textContent"></YpModel>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
@ -45,10 +52,10 @@ import CheckBox from "@/components/checkBox/index.vue";
|
||||
import Search from "@/components/aboutTable/Search.vue";
|
||||
import { qcckPost } from "@/api/qcckApi.js";
|
||||
import { useRoute, useRouter } from 'vue-router';
|
||||
import { reactive, ref, onMounted, getCurrentInstance,watch, nextTick } from "vue";
|
||||
import { reactive, ref, onMounted, getCurrentInstance, watch, nextTick } from "vue";
|
||||
const router = useRouter();
|
||||
const { proxy } = getCurrentInstance();
|
||||
const { D_SG_SJLY,D_SG_TSYPGZ} = proxy.$dict("D_SG_SJLY","D_SG_TSYPGZ"); //获取字典数据
|
||||
const { D_SG_SJLY, D_SG_TSYPGZ } = proxy.$dict("D_SG_SJLY", "D_SG_TSYPGZ"); //获取字典数据
|
||||
const searchBox = ref(); //搜索框
|
||||
const showModel = ref(false);
|
||||
const textContent = ref('');
|
||||
@ -60,11 +67,11 @@ const searchConfiger = ref([
|
||||
{ label: "研判名称", prop: "ypMc", placeholder: "请输入研判名称", showType: "input" },
|
||||
]);
|
||||
const checkData = reactive({
|
||||
sjlxBtn:{
|
||||
sjlxBtn: {
|
||||
hasChoose: [],
|
||||
list: []
|
||||
},
|
||||
yplxBtn:{
|
||||
yplxBtn: {
|
||||
hasChoose: [],
|
||||
list: []
|
||||
},
|
||||
@ -74,25 +81,29 @@ const total = ref(0)
|
||||
const list = ref([])
|
||||
const loading = ref(false);
|
||||
const formData = ref({})
|
||||
watch(()=>[D_SG_SJLY.value,D_SG_TSYPGZ.value],val=>{
|
||||
checkData.sjlxBtn.list = val[0].map(v=>v.zdmc);
|
||||
checkData.yplxBtn.list = val[1].map(v=>v.zdmc);
|
||||
checkData.yplxBtn.hasChoose = val[1].map(v=>v.zdmc);
|
||||
},{immediate:true,deep:true});
|
||||
|
||||
onMounted(()=>{
|
||||
watch(() => [D_SG_SJLY.value, D_SG_TSYPGZ.value], val => {
|
||||
checkData.sjlxBtn.list = val[0].map(v => v.zdmc);
|
||||
checkData.yplxBtn.list = val[1].map(v => v.zdmc);
|
||||
checkData.yplxBtn.hasChoose = val[1].map(v => v.zdmc);
|
||||
}, { immediate: true, deep: true });
|
||||
const route = useRoute();
|
||||
onMounted(() => {
|
||||
show.value = true;
|
||||
getLits()
|
||||
tabHeightFn();
|
||||
if (route.query.id) {
|
||||
lookDeatl(route.query)
|
||||
} else {
|
||||
getLits()
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
// 数据类型
|
||||
const changeData_sjly = (val) =>{
|
||||
const changeData_sjly = (val) => {
|
||||
checkData.sjlxBtn.hasChoose = val;
|
||||
let dms = [];
|
||||
D_SG_SJLY.value.forEach(item => {
|
||||
if(val.includes(item.zdmc)) dms.push(item.dm);
|
||||
if (val.includes(item.zdmc)) dms.push(item.dm);
|
||||
});
|
||||
formData.value.sjLx = dms;
|
||||
page.value = 1;
|
||||
@ -100,68 +111,70 @@ const changeData_sjly = (val) =>{
|
||||
}
|
||||
|
||||
// 研判类型
|
||||
const changeData_yplx = (val) =>{
|
||||
const changeData_yplx = (val) => {
|
||||
checkData.yplxBtn.hasChoose = val;
|
||||
let dms = [];
|
||||
D_SG_TSYPGZ.value.forEach(item => {
|
||||
if(val.includes(item.zdmc)) dms.push(item.dm);
|
||||
if (val.includes(item.zdmc)) dms.push(item.dm);
|
||||
});
|
||||
formData.value.ypLx = dms;
|
||||
page.value = 1;
|
||||
getLits();
|
||||
}
|
||||
|
||||
const onSearch = (val) =>{
|
||||
formData.value = {...formData.value,...val,};
|
||||
const onSearch = (val) => {
|
||||
formData.value = { ...formData.value, ...val, };
|
||||
page.value = 1;
|
||||
getLits();
|
||||
}
|
||||
|
||||
const load = () =>{
|
||||
if(total.value == list.value.length) return;
|
||||
const load = () => {
|
||||
if (total.value == list.value.length) return;
|
||||
page.value++;
|
||||
getLits();
|
||||
}
|
||||
|
||||
const getLits = () =>{
|
||||
const getLits = () => {
|
||||
let params = {
|
||||
pageCurrent:page.value,
|
||||
pageSize:8,
|
||||
pageCurrent: page.value,
|
||||
pageSize: 8,
|
||||
...formData.value
|
||||
}
|
||||
loading.value = true;
|
||||
qcckPost(params,'/mosty-gsxt/tsyp/selectPage').then(res=>{
|
||||
console.log(params);
|
||||
|
||||
qcckPost(params, '/mosty-gsxt/tsyp/selectPage').then(res => {
|
||||
let arr = res.records || [];
|
||||
list.value = page.value == 1 ? arr : list.value.concat(arr);
|
||||
total.value = res.total;
|
||||
loading.value = false;
|
||||
}).catch(()=>{
|
||||
}).catch(() => {
|
||||
loading.value = false;
|
||||
})
|
||||
}
|
||||
|
||||
const handleYp = (val) =>{
|
||||
let params = { tsypid:val.id, }
|
||||
qcckPost(params,'/mosty-gsxt/wshs/getDcypbg').then(res=>{
|
||||
const handleYp = (val) => {
|
||||
let params = { tsypid: val.id, }
|
||||
qcckPost(params, '/mosty-gsxt/wshs/getDcypbg').then(res => {
|
||||
let data = res || {};
|
||||
let html = `<p class="html_bt">${data.bt}</p>`
|
||||
html+=`<p>${data.head}</p>`
|
||||
html+=`<p>${data.nr}</p>`
|
||||
html+=`<p>${data.bc}</p>`
|
||||
html+=`<p>${data.end}</p>`
|
||||
html += `<p>${data.head}</p>`
|
||||
html += `<p>${data.nr}</p>`
|
||||
html += `<p>${data.bc}</p>`
|
||||
html += `<p>${data.end}</p>`
|
||||
textContent.value = html;
|
||||
showModel.value = true;
|
||||
})
|
||||
}
|
||||
|
||||
const handleHs = (val) =>{
|
||||
router.push({path:'/MeetingRoom',query:{tsypid:val.id}})
|
||||
const handleHs = (val) => {
|
||||
router.push({ path: '/MeetingRoom', query: { tsypid: val.id } })
|
||||
}
|
||||
|
||||
// 查看详情
|
||||
const lookDeatl = (val) =>{
|
||||
nextTick(()=>{
|
||||
detailForm.value.init(val,formData.value.sjLx)
|
||||
const lookDeatl = (val) => {
|
||||
nextTick(() => {
|
||||
detailForm.value.init(val, formData.value.sjLx)
|
||||
})
|
||||
}
|
||||
|
||||
@ -229,13 +242,15 @@ const tabHeightFn = () => {
|
||||
margin-left: 10px;
|
||||
border-radius: 4px;
|
||||
box-sizing: border-box;
|
||||
.btnsBox{
|
||||
|
||||
.btnsBox {
|
||||
background: #fff;
|
||||
padding: 10px 5px;
|
||||
border-radius: 4px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.cntlsit{
|
||||
|
||||
.cntlsit {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-content: start;
|
||||
@ -245,16 +260,18 @@ const tabHeightFn = () => {
|
||||
background: #fff;
|
||||
padding: 4px;
|
||||
box-sizing: border-box;
|
||||
.cntItem{
|
||||
|
||||
.cntItem {
|
||||
width: 300px;
|
||||
border: 1px solid #ccc;
|
||||
color: #787878;
|
||||
border-radius: 4px;
|
||||
overflow: hidden;
|
||||
.foot{
|
||||
|
||||
.foot {
|
||||
text-align: right;
|
||||
margin-top: 4px;
|
||||
border-top:1px solid #ccc;
|
||||
border-top: 1px solid #ccc;
|
||||
padding: 4px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
@ -0,0 +1,68 @@
|
||||
<template>
|
||||
<div class="itemXs_Box">
|
||||
<div class="itemXs_Mc">
|
||||
情报描述情报描述情报描述情报措述情描述情报描述情报描述情报描,情报描述情报描述情报描述情报措述情描述情报描述情报描述情报描,
|
||||
</div>
|
||||
<div class="itemXs_Ms">
|
||||
情报描述情报描述情报描述情报措述情描述情报描述情报描述情报描,情报描述情报描述情报描述情报措述情描述情报描述情报描述情报描,
|
||||
</div>
|
||||
<div class="itemXs_Xs flex just-between align-center">
|
||||
<div class=" flex just-between align-center"><el-icon class="icon"><Histogram /></el-icon>1000</div>
|
||||
<div class=" flex just-between align-center"><el-icon class="icon"><ChatDotSquare /></el-icon>15522</div>
|
||||
<div class=" flex just-between align-center"><el-icon class="icon"><Clock /></el-icon>2025-10-10 10:10:10</div>
|
||||
<div class=" flex just-between align-center"><el-icon class="icon"><Avatar /></el-icon>张三</div>
|
||||
<div>情报类型:测试数据</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
||||
import Search from "@/components/aboutTable/Search.vue";
|
||||
import { qcckGet, qcckPost } from "@/api/qcckApi.js";
|
||||
import { reactive, ref, onMounted, getCurrentInstance, nextTick } from "vue";
|
||||
const props = defineProps({
|
||||
item: {
|
||||
type: Object,
|
||||
default: () => { },
|
||||
},
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.itemXs_Box {
|
||||
box-sizing: border-box;
|
||||
border: 1px solid red;
|
||||
// height: 100px;
|
||||
width: 40%;
|
||||
border-radius: 10px;
|
||||
padding: 10px 15px;
|
||||
|
||||
.itemXs_Mc {
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
color: #de0909;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
line-height: 20px;
|
||||
}
|
||||
|
||||
.itemXs_Ms {
|
||||
color: #ccc;
|
||||
font-size: 14px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
margin: 10px 0;
|
||||
}
|
||||
.itemXs_Xs{
|
||||
font-size: 16px;
|
||||
color: #ccc;
|
||||
line-height: 20px;
|
||||
.icon{
|
||||
font-size: 22px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
88
src/views/backOfficeSystem/MakeAcomment/index.vue
Normal file
88
src/views/backOfficeSystem/MakeAcomment/index.vue
Normal file
@ -0,0 +1,88 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="titleBox">
|
||||
<PageTitle title="情报评一评" />
|
||||
</div>
|
||||
<!-- 搜索 -->
|
||||
<div ref="searchBox">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" />
|
||||
</div>
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox " style="height: calc(100vh - 200px); display: flex;flex-wrap: wrap;">
|
||||
<div v-for="(item, index) in 1000" :key="index" class="tabBox_item flex ">
|
||||
<ItemXs :item="item" />
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
||||
import Search from "@/components/aboutTable/Search.vue";
|
||||
import { qcckGet, qcckPost } from "@/api/qcckApi.js";
|
||||
import ItemXs from './components/itemXs/itemXs.vue'
|
||||
import { reactive, ref, onMounted, getCurrentInstance, nextTick } from "vue";
|
||||
const { proxy } = getCurrentInstance();
|
||||
const { D_GS_XS_LX } = proxy.$dict("D_GS_XS_LX"); //获取字典数据
|
||||
const searchConfiger = reactive([
|
||||
|
||||
{
|
||||
label: "情报名称",
|
||||
showType: "input",
|
||||
prop: "xsMc",
|
||||
placeholder: "请输入情报名称",
|
||||
},
|
||||
{
|
||||
showType: "select",
|
||||
prop: "xlLx",
|
||||
options: D_GS_XS_LX,
|
||||
placeholder: "请选择情报类型",
|
||||
label: "情报类型"
|
||||
},
|
||||
])
|
||||
|
||||
|
||||
onMounted(() => {
|
||||
tabHeightFn()
|
||||
selectPagePbql()
|
||||
})
|
||||
// const tabHeight = ref(0)
|
||||
// 表格高度计算
|
||||
const tabHeightFn = () => {
|
||||
// pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
||||
window.onresize = function () {
|
||||
tabHeightFn();
|
||||
};
|
||||
};
|
||||
const pageData = reactive({
|
||||
parameter: {
|
||||
pageCurrent: 1,
|
||||
pageSize: 10
|
||||
},
|
||||
total: 0,
|
||||
loading: false,
|
||||
tableData: []
|
||||
})
|
||||
const onSearch = (val) => {
|
||||
pageData.parameter={...val, ...pageData.parameter}
|
||||
pageData.pageCurrent = 1;
|
||||
selectPagePbql()
|
||||
}
|
||||
const selectPagePbql = () => {
|
||||
qcckGet(pageData.parameter, "/mosty-gsxt/qbcj/selectPagePbql").then((res) => {
|
||||
pageData.tableData =pageData.pageCurrent==1? res.records:pageData.tableData.concat(res.records || []);
|
||||
pageData.total = res.total;
|
||||
pageData.loading = false;
|
||||
}).catch((err) => {
|
||||
console.log(err);
|
||||
}).finally(()=>{
|
||||
pageData.loading = false;
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
</style>
|
||||
|
@ -60,7 +60,7 @@ watch(() => props.lx, (val) => {
|
||||
case 2:
|
||||
nameData.value = { title: 'qtMc' }
|
||||
case 3:
|
||||
nameData.value = { title: 'qtMc' }
|
||||
nameData.value = { title: 'jymc' }
|
||||
break;
|
||||
}
|
||||
}, { immediate: true })
|
||||
|
@ -1,5 +1,6 @@
|
||||
<template>
|
||||
<DialogDragger title="预警详情" top="150px" v-model="props.show" @close="close">
|
||||
|
||||
<DialogDragger title="预警详情" top="150px" v-model="props.show" @close="close">
|
||||
|
||||
<ul class="warningList" ref="gjyjList">
|
||||
<li v-for="item in props.data" :key="item.id">
|
||||
@ -7,13 +8,21 @@
|
||||
</li>
|
||||
<MOSTY.Empty :show="props.data.length <= 0" :imgSize="150"></MOSTY.Empty>
|
||||
</ul>
|
||||
|
||||
<!-- :style="{height: `calc(100vh - ${handleHs}px)`}" -->
|
||||
|
||||
<div style="position:relative;width: 100%;" :style="{height: `calc(100vh - ${handleHs}px)`}">
|
||||
<GdMap v-if="showMap"></GdMap>
|
||||
</div>
|
||||
</DialogDragger>
|
||||
</template>
|
||||
<script setup>
|
||||
import * as MOSTY from "@/components/MyComponents/index";
|
||||
import GdMap from "@/components/GdMap/index.vue";
|
||||
|
||||
import DialogDragger from "@/views/home/layout/dialogDragger.vue";
|
||||
import YjItem from "@/views/home/components/yjItem.vue";
|
||||
import { ref, defineProps } from "vue";
|
||||
import { ref, defineProps, onMounted, watch } from "vue";
|
||||
import emitter from "@/utils/eventBus.js";
|
||||
const gjyjList = ref(null); //预警列表数据
|
||||
//参数传递
|
||||
@ -28,13 +37,43 @@ const props = defineProps({
|
||||
default:false
|
||||
},
|
||||
});
|
||||
console.log(props.show);
|
||||
|
||||
//关闭
|
||||
function close() {
|
||||
emitter.emit('deletePointArea','home_yj_map');
|
||||
emitter.emit("showHomeYJ",false);
|
||||
}
|
||||
const showMap=ref(false)
|
||||
onMounted(() => {
|
||||
setTimeout(() => {
|
||||
showMap.value = true
|
||||
setTimeout(() => {
|
||||
for (let i = 0; i < props.data.length; i++) {
|
||||
|
||||
const item = props.data[i];
|
||||
console.log(item);
|
||||
|
||||
emitter.emit('showHomeYJ',[item]);
|
||||
emitter.emit('deletePointArea','home_yj_map');
|
||||
if(!item.jd || !item.jd) return proxy.$message({ type: "warning", message: "该预警没有坐标!" });
|
||||
let icon = require('@/assets/point/yj.png');
|
||||
if(item.yjjb == '20') icon = require('@/assets/point/yj1.png');
|
||||
if(item.yjjb == '30') icon = require('@/assets/point/yj2.png');
|
||||
if(item.yjjb == '40') icon = require('@/assets/point/yj3.png');
|
||||
emitter.emit('addPointArea',{flag:'home_yj_map',icon,coords:[item]});
|
||||
emitter.emit('setMapCenter',{location:[item.jd,item.wd],zoomLevel:10});
|
||||
}
|
||||
}, 500);
|
||||
|
||||
|
||||
}, 200);
|
||||
})
|
||||
const handleHs=ref(0)
|
||||
watch(() => gjyjList.value, (val) => {
|
||||
console.log(val.clientHeight);
|
||||
handleHs.value=val.clientHeight+198+150+20
|
||||
},{deep:true})
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div style="pointer-events: none" :class="props.parentClass">
|
||||
<el-dialog :top="props.top" style="pointer-events: auto !important" :modal="false" draggable v-model="props.modelValue" :destroy-on-close="true"
|
||||
:show-close="false" :close-on-click-modal="false" custom-class="zdy-model-dialog">
|
||||
<el-dialog :top="props.top" style="pointer-events: auto !important;" :modal="false" draggable v-model="props.modelValue" :destroy-on-close="true"
|
||||
:show-close="false" :close-on-click-modal="false" :width="width" :custom-class="coumClass">
|
||||
<template #title>
|
||||
<div class="my-header">
|
||||
<span class="imgIcon"> {{props.title}}</span>
|
||||
@ -35,6 +35,14 @@ const props = defineProps({
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
width: {
|
||||
type: String,
|
||||
default: "50%"
|
||||
},
|
||||
coumClass: {
|
||||
type: String,
|
||||
default: "zdy-model-dialog"
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
@ -74,13 +82,19 @@ function closeDialog(params) {
|
||||
padding: 8px 10px;
|
||||
box-sizing: border-box;
|
||||
pointer-events: auto !important;
|
||||
width: 400px;
|
||||
left: -290px;
|
||||
top: 34px;
|
||||
height:calc(100% - 300px);
|
||||
overflow: auto;
|
||||
|
||||
}
|
||||
.zdy-model-dialog .el-dialog__header {
|
||||
padding: 0 !important;
|
||||
}
|
||||
:v-deep .el-dialog__header{
|
||||
padding: 0 !important;
|
||||
}
|
||||
:v-deep .el-dialog__body{
|
||||
padding: 0 !important;
|
||||
}
|
||||
.zdy-model-dialog .el-dialog__body {
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
@ -4,8 +4,8 @@
|
||||
</div>
|
||||
<div class="comom-cnt zdryBox">
|
||||
<ul class="ryBox" v-loading="loading" v-infinite-scroll="loadList" style="overflow: auto">
|
||||
<li v-for="item in personList" :key="item.id" >
|
||||
<Assessment :item="item" :dict="{D_SG_TSYPGZ}" :lx="2"/>
|
||||
<li v-for="item in personList" :key="item.id" @click="onClickPush(item)">
|
||||
<Assessment :item="item" :dict="{D_SG_TSYPGZ}" :lx="1"/>
|
||||
</li>
|
||||
<MOSTY.Empty :show="!loading && personList.length <= 0" :imgSize="100"></MOSTY.Empty>
|
||||
</ul>
|
||||
@ -18,35 +18,19 @@ import { qcckPost } from "@/api/qcckApi.js";
|
||||
import Assessment from "@/views/home/components/assessmentItem.vue";
|
||||
import * as MOSTY from "@/components/MyComponents/index";
|
||||
import CheckBox from "@/components/checkBox/index.vue";
|
||||
import { ref ,reactive, onMounted,getCurrentInstance} from 'vue';
|
||||
import { ref, reactive, onMounted, getCurrentInstance } from 'vue';
|
||||
import {useRouter} from 'vue-router'
|
||||
const { proxy } = getCurrentInstance();
|
||||
const {D_SG_TSYPGZ} =proxy.$dict('D_SG_TSYPGZ')
|
||||
const checkData = reactive({
|
||||
list: ["人员", "车辆"],
|
||||
hasChoose: ["人员", "车辆"],
|
||||
});
|
||||
const router = useRouter()
|
||||
const total = ref(0);
|
||||
const yjJb = ref('10,20,30,40');
|
||||
const pageNum = ref(1);
|
||||
const loading = ref(false); // 加载中
|
||||
const personList = ref([]);
|
||||
onMounted(()=>{
|
||||
getList()
|
||||
})
|
||||
// 复选框切换
|
||||
function changeData(val){
|
||||
pageNum.value = 1;
|
||||
personList.value = [];
|
||||
checkData.hasChoose = val;
|
||||
let ids = [];
|
||||
val.forEach(it => {
|
||||
if(it == '人员') ids.push(1);
|
||||
if(it == '车辆') ids.push(2);
|
||||
});
|
||||
yjJb.value = ids.join(',')
|
||||
if(val.length == 0) personList.value = [];
|
||||
else getList();
|
||||
}
|
||||
|
||||
|
||||
// 触底加载
|
||||
const loadList = () =>{
|
||||
@ -67,18 +51,15 @@ const getList = () =>{
|
||||
loading.value = false;
|
||||
})
|
||||
}
|
||||
|
||||
const chooseItem = (item) =>{
|
||||
emitter.emit('showHomeYJ',[item]);
|
||||
emitter.emit('deletePointArea','home_yj_map');
|
||||
if(!item.jd || !item.jd) return proxy.$message({ type: "warning", message: "该预警没有坐标!" });
|
||||
let icon = require('@/assets/point/yj.png');
|
||||
if(item.yjjb == '20') icon = require('@/assets/point/yj1.png');
|
||||
if(item.yjjb == '30') icon = require('@/assets/point/yj2.png');
|
||||
if(item.yjjb == '40') icon = require('@/assets/point/yj3.png');
|
||||
emitter.emit('addPointArea',{flag:'home_yj_map',icon,coords:[item]});
|
||||
emitter.emit('setMapCenter',{location:[item.jd,item.wd],zoomLevel:10});
|
||||
const onClickPush = (val) => {
|
||||
router.push({
|
||||
path: '/tsypHome',
|
||||
query: {
|
||||
id: val.id,
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
@ -71,7 +71,8 @@ const getList = () =>{
|
||||
})
|
||||
}
|
||||
|
||||
const chooseItem = (item) =>{
|
||||
const chooseItem = (item) => {
|
||||
console.log(item);
|
||||
emitter.emit('showHomeYJ',[item]);
|
||||
emitter.emit('deletePointArea','home_yj_map');
|
||||
if(!item.jd || !item.jd) return proxy.$message({ type: "warning", message: "该预警没有坐标!" });
|
||||
|
Reference in New Issue
Block a user