923 lines
26 KiB
Vue
923 lines
26 KiB
Vue
<template>
|
||
<el-popover
|
||
popper-class="dinw"
|
||
:visible="visible"
|
||
:width="getConfiger.width"
|
||
:trigger="getConfiger.trigger"
|
||
>
|
||
<template #reference
|
||
><span class="deBtn" @click="handleClick">{{
|
||
getConfiger.selectName
|
||
}}</span></template
|
||
>
|
||
<div class="flex just-between align-center">
|
||
<span>{{ title }}</span>
|
||
<span @click="visible = false">
|
||
<el-icon>
|
||
<Close />
|
||
</el-icon>
|
||
</span>
|
||
</div>
|
||
<Search :searchArr="common.searchConfiger" @submit="onSearch" />
|
||
<div class="tableBox flex" v-if="visible">
|
||
<!-- 左边 -->
|
||
<div class="table">
|
||
<MyTable
|
||
@chooseData="chooseDataL"
|
||
:tableData="pageDataL.tableData"
|
||
:tableColumn="pageDataL.tableColumn"
|
||
:tableHeight="common.tableHeight"
|
||
:key="common.keyCount"
|
||
:tableConfiger="common.tableConfiger"
|
||
>
|
||
<!-- 是否报备 -->
|
||
<template #sfbb="{ row }">
|
||
<dict-tag
|
||
:options="props.dic.D_BZ_SF"
|
||
:value="row.sfbb"
|
||
:tag="false"
|
||
/>
|
||
</template>
|
||
<!-- 警种类型 -->
|
||
<template #lx="{ row }">
|
||
<dict-tag
|
||
:options="props.dic.D_BZ_RYJZLB"
|
||
:value="row.lx"
|
||
:tag="false"
|
||
/>
|
||
</template>
|
||
<!-- 人员类型 -->
|
||
<template #fl="{ row }">
|
||
<dict-tag
|
||
:options="props.dic.D_BZ_RYMFJLB"
|
||
:value="row.fl"
|
||
:tag="false"
|
||
/>
|
||
</template>
|
||
<!-- 设备类型 -->
|
||
<template #pddtlx="{ row }">
|
||
<dict-tag
|
||
:options="props.dic.D_BZ_PDDTLX"
|
||
:value="row.pddtlx"
|
||
:tag="false"
|
||
/>
|
||
</template>
|
||
<!-- 班次类型 -->
|
||
<template #bcQwBbzl="{ row }">
|
||
<dict-tag
|
||
:options="props.dic.D_QW_BBZL"
|
||
:value="row.bcQwBbzl"
|
||
:tag="false"
|
||
></dict-tag>
|
||
</template>
|
||
<!-- 跨越天数 -->
|
||
<template #bcKtsDict="{ row }">
|
||
<dict-tag
|
||
:options="props.dic.D_QW_BC_KTS"
|
||
:value="row.bcKtsDict"
|
||
:tag="false"
|
||
></dict-tag>
|
||
</template>
|
||
<!-- 请选择大类别 -->
|
||
<template #jyjtfwlb="{ row }">
|
||
<dict-tag
|
||
:options="props.dic.D_JCGL_JYCL_JYJTFWLB"
|
||
:value="row.jyjtfwlb"
|
||
:tag="false"
|
||
></dict-tag>
|
||
</template>
|
||
<!-- 请选择小类别 -->
|
||
<template #jyjtgjlb="{ row }">
|
||
<dict-tag
|
||
:options="props.dic.D_JCGL_JYCL_JYJTGJLB"
|
||
:value="row.jyjtgjlb"
|
||
:tag="false"
|
||
></dict-tag>
|
||
</template>
|
||
<!-- 设备类型 -->
|
||
<template #sblx="{ row }">
|
||
<dict-tag
|
||
:options="props.dic.D_JCGL_ZDSB_SBLX"
|
||
:value="row.sblx"
|
||
:tag="false"
|
||
></dict-tag>
|
||
</template>
|
||
<!-- 终端类别 -->
|
||
<template #sblb="{ row }">
|
||
<dict-tag
|
||
:options="props.dic.D_JCGL_ZDSB_SBLB"
|
||
:value="row.sblb"
|
||
:tag="false"
|
||
></dict-tag>
|
||
</template>
|
||
<!-- 器械类型 -->
|
||
<template #qxlx="{ row }">
|
||
<dict-tag
|
||
:options="props.dic.D_JCGL_JYQX_QXLX"
|
||
:value="row.qxlx"
|
||
:tag="false"
|
||
></dict-tag>
|
||
</template>
|
||
<!-- 报备种类 -->
|
||
<template #jzQwBbzl="{ row }">
|
||
<dict-tag
|
||
:options="props.dic.D_QW_BBZL"
|
||
:value="row.jzQwBbzl"
|
||
:tag="false"
|
||
></dict-tag>
|
||
</template>
|
||
<!-- 巡防区域类别 -->
|
||
<template #xqlb="{ row }">
|
||
<dict-tag
|
||
:options="props.dic.D_QW_XQLB"
|
||
:value="row.xqlb"
|
||
:tag="false"
|
||
></dict-tag>
|
||
</template>
|
||
<!-- 巡防区域类型 -->
|
||
<template #xqlx="{ row }">
|
||
<dict-tag
|
||
:options="props.dic.D_QW_XQLX"
|
||
:value="row.xqlx"
|
||
:tag="false"
|
||
></dict-tag>
|
||
</template>
|
||
<!-- 警务站类型： -->
|
||
<template #jwzLx="{ row }">
|
||
<dict-tag
|
||
:options="props.dic.D_BZ_JWZLX"
|
||
:value="row.jwzLx"
|
||
:tag="false"
|
||
></dict-tag>
|
||
</template>
|
||
<!-- 时间段 -->
|
||
<template #sdList="{ row }">
|
||
<div v-for="(it, idxx) in row.sdList" :key="idxx">
|
||
{{ it.kssj }} - {{ it.jssj }}
|
||
</div>
|
||
</template>
|
||
<!-- 检查站 -->
|
||
<template #jczlx="{ row }">
|
||
<span v-if="row.jczlx == '1'">固定检查站</span>
|
||
<span v-if="row.jczlx == '2'">临时检查站</span>
|
||
<span v-if="row.jczlx == '3'">动态检查站</span>
|
||
</template>
|
||
</MyTable>
|
||
</div>
|
||
<!-- 切换按钮 -->
|
||
<div
|
||
class="cnt flex just-center align-center"
|
||
v-if="!getConfiger.isRadio"
|
||
>
|
||
<el-button :icon="Back" circle @click="upLeft" />
|
||
<el-button :icon="Right" circle @click="upRight" />
|
||
</div>
|
||
<!-- 右边 -->
|
||
<div class="table" v-if="!getConfiger.isRadio">
|
||
<MyTable
|
||
@chooseData="chooseDataR"
|
||
:tableData="pageDataR.tableData"
|
||
:tableColumn="pageDataR.tableColumn"
|
||
:tableHeight="common.tableHeight"
|
||
:key="common.keyCount"
|
||
:tableConfiger="common.tableConfiger"
|
||
>
|
||
<!-- 是否报备 -->
|
||
<template #sfbb="{ row }">
|
||
<dict-tag
|
||
:options="props.dic.D_BZ_SF"
|
||
:value="row.sfbb"
|
||
:tag="false"
|
||
/>
|
||
</template>
|
||
<!-- 警种类型 -->
|
||
<template #lx="{ row }">
|
||
<dict-tag
|
||
:options="props.dic.D_BZ_RYJZLB"
|
||
:value="row.lx"
|
||
:tag="false"
|
||
/>
|
||
</template>
|
||
<!-- 人员类型 -->
|
||
<template #fl="{ row }">
|
||
<dict-tag
|
||
:options="props.dic.D_BZ_RYMFJLB"
|
||
:value="row.fl"
|
||
:tag="false"
|
||
/>
|
||
</template>
|
||
<!-- 设备类型 -->
|
||
<template #pddtlx="{ row }">
|
||
<dict-tag
|
||
:options="props.dic.D_BZ_PDDTLX"
|
||
:value="row.pddtlx"
|
||
:tag="false"
|
||
/>
|
||
</template>
|
||
<!-- 班次类型 -->
|
||
<template #bcQwBbzl="{ row }">
|
||
<dict-tag
|
||
:options="props.dic.D_QW_BBZL"
|
||
:value="row.bcQwBbzl"
|
||
:tag="false"
|
||
></dict-tag>
|
||
</template>
|
||
<!-- 跨越天数 -->
|
||
<template #bcKtsDict="{ row }">
|
||
<dict-tag
|
||
:options="props.dic.D_QW_BC_KTS"
|
||
:value="row.bcKtsDict"
|
||
:tag="false"
|
||
></dict-tag>
|
||
</template>
|
||
<!-- 请选择大类别 -->
|
||
<template #jyjtfwlb="{ row }">
|
||
<dict-tag
|
||
:options="props.dic.D_JCGL_JYCL_JYJTFWLB"
|
||
:value="row.jyjtfwlb"
|
||
:tag="false"
|
||
></dict-tag>
|
||
</template>
|
||
<!-- 请选择小类别 -->
|
||
<template #jyjtgjlb="{ row }">
|
||
<dict-tag
|
||
:options="props.dic.D_JCGL_JYCL_JYJTGJLB"
|
||
:value="row.jyjtgjlb"
|
||
:tag="false"
|
||
></dict-tag>
|
||
</template>
|
||
<!-- 设备类型 -->
|
||
<template #sblx="{ row }">
|
||
<dict-tag
|
||
:options="props.dic.D_JCGL_ZDSB_SBLX"
|
||
:value="row.sblx"
|
||
:tag="false"
|
||
></dict-tag>
|
||
</template>
|
||
<!-- 终端类别 -->
|
||
<template #sblb="{ row }">
|
||
<dict-tag
|
||
:options="props.dic.D_JCGL_ZDSB_SBLB"
|
||
:value="row.sblb"
|
||
:tag="false"
|
||
></dict-tag>
|
||
</template>
|
||
<!-- 器械类型 -->
|
||
<template #qxlx="{ row }">
|
||
<dict-tag
|
||
:options="props.dic.D_JCGL_JYQX_QXLX"
|
||
:value="row.qxlx"
|
||
:tag="false"
|
||
></dict-tag>
|
||
</template>
|
||
<!-- 报备种类 -->
|
||
<template #jzQwBbzl="{ row }">
|
||
<dict-tag
|
||
:options="props.dic.D_QW_BBZL"
|
||
:value="row.jzQwBbzl"
|
||
:tag="false"
|
||
></dict-tag>
|
||
</template>
|
||
<!-- 巡防区域类别 -->
|
||
<template #xqlb="{ row }">
|
||
<dict-tag
|
||
:options="props.dic.D_QW_XQLB"
|
||
:value="row.xqlb"
|
||
:tag="false"
|
||
></dict-tag>
|
||
</template>
|
||
<!-- 巡防区域类型 -->
|
||
<template #xqlx="{ row }">
|
||
<dict-tag
|
||
:options="props.dic.D_QW_XQLX"
|
||
:value="row.xqlx"
|
||
:tag="false"
|
||
></dict-tag>
|
||
</template>
|
||
<!-- 时间段 -->
|
||
<template #sdList="{ row }">
|
||
<div v-for="(it, idxx) in row.sdList" :key="idxx">
|
||
{{ it.kssj }} - {{ it.jssj }}
|
||
</div>
|
||
</template>
|
||
<!-- 检查站 -->
|
||
<template #jczlx="{ row }">
|
||
<span v-if="row.jczlx == '01'">固定检查站</span>
|
||
<span v-if="row.jczlx == '02'">临时检查站</span>
|
||
<span v-if="row.jczlx == '03'">动态检查站</span>
|
||
</template>
|
||
</MyTable>
|
||
</div>
|
||
</div>
|
||
<div class="footInfoBtn flex just-between align-center">
|
||
<Pages
|
||
@changeNo="changeNo"
|
||
@changeSize="changeSize"
|
||
:tableHeight="common.tableHeight"
|
||
:pageConfiger="{ ...listQuery }"
|
||
/>
|
||
<el-button type="primary" @click="submitDate">确定选择</el-button>
|
||
</div>
|
||
</el-popover>
|
||
</template>
|
||
|
||
<script setup>
|
||
import { Right, Back } from "@element-plus/icons-vue";
|
||
import { qcckGet, qcckPost } from "@/api/qcckApi.js";
|
||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||
import emitter from "@/utils/eventBus.js";
|
||
import Pages from "@/components/aboutTable/Pages.vue";
|
||
import Search from "@/components/aboutTable/Search.vue";
|
||
import {
|
||
reactive,
|
||
defineProps,
|
||
ref,
|
||
watch,
|
||
getCurrentInstance,
|
||
watchEffect,
|
||
onMounted,
|
||
onUnmounted,
|
||
nextTick
|
||
} from "vue";
|
||
const { proxy } = getCurrentInstance();
|
||
const props = defineProps({
|
||
configer: {
|
||
type: Object,
|
||
default: {}
|
||
},
|
||
dic: Object,
|
||
modelValue: {
|
||
type: Array,
|
||
default: []
|
||
},
|
||
rightData: {
|
||
type: Array,
|
||
default: []
|
||
},
|
||
deptment: {
|
||
type: Object,
|
||
default: {
|
||
bmdm: JSON.parse(localStorage.getItem("deptId"))[0].deptCode,
|
||
bmmc: JSON.parse(localStorage.getItem("deptId"))[0].deptName
|
||
}
|
||
}
|
||
});
|
||
const emits = defineEmits(["update:modelValue", "change"]);
|
||
|
||
const common = reactive({
|
||
tableHeight: 360,
|
||
keyCount: 0,
|
||
total: 0,
|
||
pageConfiger: {
|
||
pageSize: 20,
|
||
pageCurrent: 1
|
||
}, //分页
|
||
tableConfiger: {
|
||
loading: false,
|
||
rowHieght: 61,
|
||
showSelectType: "checkBox",
|
||
haveControls: false,
|
||
showIndex: false,
|
||
defaultSelectKeys: [] // 默认选中的key集合
|
||
},
|
||
searchConfiger: [
|
||
{
|
||
showType: "input",
|
||
prop: "key",
|
||
placeholder: "请输入关键字",
|
||
label: "关键字"
|
||
}
|
||
] //搜索
|
||
});
|
||
const pageDataL = reactive({
|
||
tableData: [],
|
||
tableColumn: [{ label: "班次名称", prop: "bcmc" }]
|
||
});
|
||
const pageDataR = reactive({
|
||
tableData: [],
|
||
tableColumn: [{ label: "班次名称", prop: "bcmc" }]
|
||
});
|
||
let getConfiger = reactive({
|
||
placement: "right", //方向 right/left/bottom/top/top-start/top-end .....
|
||
trigger: "click", //气泡框类型 = click (点击),hover(鼠标滑过),
|
||
isRadio: false, //是否单选
|
||
width: 1000, //宽度
|
||
selectName: "选择",
|
||
lx: null, //查询的类型 - 民警(mj)
|
||
rowKey: "id"
|
||
});
|
||
const visible = ref(false);
|
||
const title = ref("");
|
||
|
||
const listQuery = ref({
|
||
total: 0,
|
||
pageSize: 20,
|
||
pageCurrent: 1
|
||
});
|
||
const url = ref("");
|
||
const hasChoosedL = ref([]); //左边选择的数据
|
||
const hasChoosedR = ref([]); //右边选择的数据
|
||
|
||
const handleClick = () => {
|
||
const deptId = localStorage.getItem("deptId")
|
||
? JSON.parse(localStorage.getItem("deptId"))
|
||
: [];
|
||
(listQuery.value.ssbmdm = deptId[0].deptCode),
|
||
(visible.value = !visible.value);
|
||
if (visible.value) handleData(getConfiger.lx);
|
||
};
|
||
// 接收数据类型
|
||
const handleData = (val, type) => {
|
||
let arr = [];
|
||
switch (val) {
|
||
case "mj":
|
||
case "fj":
|
||
title.value = "选择人员";
|
||
url.value = "/mosty-jcz/tbQwXfll/getXfllList";
|
||
arr = [
|
||
{ label: "报备", prop: "sfbb", showSolt: true },
|
||
{ label: "姓名", prop: "xm" },
|
||
{ label: "警号", prop: "jh" },
|
||
{ label: "所属部门", prop: "ssbm", showOverflowTooltip: true },
|
||
|
||
{ label: "人员类型", prop: "fl", showSolt: true },
|
||
{ label: "警种", prop: "lx", showSolt: true }
|
||
];
|
||
pageDataL.tableColumn = arr;
|
||
pageDataR.tableColumn = arr.filter((v) => {
|
||
return v.label != "报备";
|
||
});
|
||
if (!type) {
|
||
common.searchConfiger = [
|
||
{
|
||
showType: "department",
|
||
prop: "ssbmdm",
|
||
label: "所属部门",
|
||
lazy: false
|
||
},
|
||
{
|
||
showType: "input",
|
||
prop: "xm",
|
||
placeholder: "请输入姓名",
|
||
label: "姓名"
|
||
},
|
||
{
|
||
showType: "input",
|
||
prop: "jh",
|
||
placeholder: "请输入警号",
|
||
label: "警号"
|
||
}
|
||
];
|
||
}
|
||
break;
|
||
case "pdh":
|
||
title.value = "频道号选择";
|
||
url.value = "/mosty-base/sysDeptExtendPdh/selectPage";
|
||
pageDataL.tableColumn = [
|
||
{ label: "频道名称", prop: "pdmc" },
|
||
{ label: "频道号", prop: "pdh" },
|
||
{ label: "频道电台类型", prop: "pddtlx", showSolt: true }
|
||
];
|
||
if (!type) {
|
||
common.searchConfiger = [
|
||
{
|
||
showType: "input",
|
||
prop: "pdmc",
|
||
placeholder: "请输入频道名称",
|
||
label: "频道名称"
|
||
},
|
||
{
|
||
showType: "input",
|
||
prop: "pdh",
|
||
placeholder: "请输入频道号",
|
||
label: "频道号"
|
||
},
|
||
{
|
||
showType: "select",
|
||
prop: "pddtlx",
|
||
placeholder: "请输入频道电台类型",
|
||
label: "频道电台类型",
|
||
options: props.dic.D_BZ_PDDTLX
|
||
}
|
||
];
|
||
}
|
||
break;
|
||
case "zbbc":
|
||
title.value = "班次选择";
|
||
url.value = "/mosty-qwzx/tbQwglQwbc/selectPage";
|
||
pageDataL.tableColumn = [
|
||
{ label: "班次名称", prop: "bcMc" },
|
||
{ label: "班次类型", prop: "bcQwBbzl", showSolt: true },
|
||
{ label: "开始时间", prop: "bcKssj" },
|
||
{ label: "结束时间", prop: "bcJssj" },
|
||
{ label: "跨越天数", prop: "bcKtsDict", showSolt: true }
|
||
];
|
||
if (!type) {
|
||
common.searchConfiger = [
|
||
{
|
||
showType: "input",
|
||
prop: "bcMc",
|
||
placeholder: "请输入班次名称",
|
||
label: "班次名称"
|
||
}
|
||
];
|
||
}
|
||
break;
|
||
case "xfq":
|
||
case "bxd":
|
||
case "bxx":
|
||
title.value =
|
||
val == "xfq" ? "巡防区名称" : val == "bxd" ? "必巡点" : "必巡线";
|
||
url.value = "/mosty-qwzx/tbQwglXfqy/selectPage";
|
||
pageDataL.tableColumn = [
|
||
{ label: "名称", prop: "xqmc" },
|
||
{ label: "类别", prop: "xqlb", showSolt: true },
|
||
{ label: "类型", prop: "xqlx", showSolt: true }
|
||
];
|
||
pageDataR.tableColumn = [
|
||
{ label: "名称", prop: "xqmc" },
|
||
{ label: "类别", prop: "xqlb", showSolt: true },
|
||
{ label: "类型", prop: "xqlx", showSolt: true }
|
||
];
|
||
if (!type) {
|
||
common.searchConfiger = [
|
||
{
|
||
showType: "input",
|
||
prop: "xqmc",
|
||
placeholder: "请输入名称",
|
||
label: "名称"
|
||
}
|
||
];
|
||
}
|
||
break;
|
||
case "cl":
|
||
title.value = "车辆选择";
|
||
url.value = "/mosty-jcz/tpJczXfcl/getXfclList";
|
||
arr = [
|
||
{ label: "号牌号码", prop: "cph" },
|
||
{ label: "车辆名称", prop: "clmc" },
|
||
{ label: "大类别", prop: "jyjtfwlb", showSolt: true },
|
||
{ label: "小类别", prop: "jyjtgjlb", showSolt: true }
|
||
];
|
||
pageDataL.tableColumn = arr;
|
||
pageDataR.tableColumn = arr;
|
||
if (!type) {
|
||
common.searchConfiger = [
|
||
{
|
||
showType: "input",
|
||
prop: "cph",
|
||
placeholder: "请输入车辆名称",
|
||
label: "车辆名称"
|
||
}
|
||
];
|
||
}
|
||
break;
|
||
case "zdsb":
|
||
title.value = "终端选择";
|
||
url.value = "/mosty-jcgl/tbJcglZdsb/selectPage";
|
||
arr = [
|
||
{ label: "设备编号", prop: "sbbh" },
|
||
{ label: "设备名称", prop: "sbmc" },
|
||
{ label: "终端类别", prop: "sblb", showSolt: true },
|
||
{ label: "设备类型", prop: "sblx", showSolt: true }
|
||
];
|
||
pageDataL.tableColumn = arr;
|
||
pageDataR.tableColumn = arr;
|
||
if (!type) {
|
||
common.searchConfiger = [
|
||
{
|
||
showType: "input",
|
||
prop: "sbmc",
|
||
placeholder: "请输入设备名称",
|
||
label: "设备名称"
|
||
},
|
||
{
|
||
showType: "select",
|
||
prop: "sblb",
|
||
placeholder: "请选择设备类型",
|
||
label: "设备类型",
|
||
options: props.dic.D_JCGL_ZDSB_SBLX
|
||
}
|
||
];
|
||
}
|
||
|
||
break;
|
||
case "jyqx":
|
||
title.value = "装备选择";
|
||
url.value = "/mosty-jcz/tpJczJyqx/selectJyqx";
|
||
arr = [
|
||
{ label: "器械名称", prop: "qxMc" },
|
||
{ label: "器械编号", prop: "qxbh" },
|
||
{ label: "器械类型", prop: "qxlx", showSolt: true },
|
||
{ label: "数量", prop: "sl" }
|
||
];
|
||
pageDataL.tableColumn = arr;
|
||
pageDataR.tableColumn = arr;
|
||
if (!type) {
|
||
common.searchConfiger = [
|
||
{
|
||
showType: "input",
|
||
prop: "qxMc",
|
||
placeholder: "请输入器械名称",
|
||
label: "器械名称"
|
||
}
|
||
];
|
||
}
|
||
break;
|
||
case "jz":
|
||
title.value = "警组";
|
||
url.value = "/mosty-qwzx/tbQwglJz/selectPage";
|
||
pageDataL.tableColumn = [
|
||
{ label: "警组名称", prop: "jzMc" },
|
||
{ label: "报备类型", prop: "jzQwBbzl", showSolt: true }
|
||
];
|
||
if (!type) {
|
||
common.searchConfiger = [
|
||
{
|
||
showType: "input",
|
||
prop: "jzMc",
|
||
placeholder: "警组名称",
|
||
label: "警组名称"
|
||
}
|
||
];
|
||
}
|
||
break;
|
||
case "kfd":
|
||
title.value = "快反点";
|
||
url.value = "/mosty-jcgl/tpJcglKfd/selectKfdList";
|
||
pageDataL.tableColumn = [
|
||
{ label: "快反点名称", prop: "kfdMc" },
|
||
{ label: "快反点地址", prop: "kfdDz" }
|
||
];
|
||
if (!type) {
|
||
common.searchConfiger = [
|
||
{
|
||
showType: "input",
|
||
prop: "kfdMc",
|
||
placeholder: "请输入名称",
|
||
label: "快反点名称"
|
||
}
|
||
];
|
||
}
|
||
break;
|
||
case "jcz":
|
||
title.value = "检查站";
|
||
url.value = "/mosty-jcz/jcz/selectJczList";
|
||
pageDataL.tableColumn = [
|
||
{ label: "检查站名称", prop: "jczmc" },
|
||
{ label: "检查站类型", prop: "jczlx", showSolt: true }
|
||
];
|
||
if (!type) {
|
||
common.searchConfiger = [
|
||
{
|
||
showType: "input",
|
||
prop: "jczmc",
|
||
placeholder: "检查站名称",
|
||
label: "检查站名称"
|
||
}
|
||
];
|
||
}
|
||
break;
|
||
case "znzb":
|
||
title.value = "智能装备";
|
||
url.value = "/mosty-jcz/tbJczTcsb/selectPage";
|
||
let crr = [
|
||
{ label: "设备名称", prop: "sbmc" },
|
||
{ label: "设备编号", prop: "sbbh" },
|
||
{ label: "所属部门", prop: "gldwmc" }
|
||
];
|
||
pageDataL.tableColumn = crr;
|
||
pageDataR.tableColumn = crr;
|
||
if (!type) {
|
||
common.searchConfiger = [
|
||
{
|
||
showType: "input",
|
||
prop: "sbmc",
|
||
placeholder: "请输入设备名称",
|
||
label: "设备名称"
|
||
}
|
||
];
|
||
}
|
||
break;
|
||
case "hxg":
|
||
title.value = "选择护学岗";
|
||
url.value = "/mosty-jcgl/tbNbhyXxjbxx/selectPage";
|
||
let zrr = [
|
||
{ label: "学校名称", prop: "xxMc" },
|
||
{ label: "学校地址", prop: "xxDz" },
|
||
{ label: "时间段", prop: "sdList", showSolt: true }
|
||
];
|
||
pageDataL.tableColumn = zrr;
|
||
pageDataR.tableColumn = zrr;
|
||
if (!type) {
|
||
common.searchConfiger = [
|
||
{
|
||
showType: "input",
|
||
prop: "xxMc",
|
||
placeholder: "请输入学校名称",
|
||
label: "学校名称"
|
||
}
|
||
];
|
||
}
|
||
break;
|
||
case "jwz":
|
||
title.value = "选择警务站";
|
||
url.value = "/mosty-jcgl/tbJcglJwz/selectJwzList";
|
||
pageDataL.tableColumn = [
|
||
{ label: "警务站名称", prop: "jwzMc" },
|
||
{ label: "负责人姓名", prop: "fzrXm" },
|
||
{ label: "警务站类型", prop: "jwzLx", showSolt: true }
|
||
];
|
||
if (!type) {
|
||
common.searchConfiger = [
|
||
{
|
||
showType: "input",
|
||
prop: "jwzMc",
|
||
placeholder: "请输入警务站名称",
|
||
label: "警务站名称"
|
||
}
|
||
];
|
||
}
|
||
break;
|
||
}
|
||
if (val && visible.value) getData();
|
||
};
|
||
|
||
// 搜索
|
||
const onSearch = (val) => {
|
||
common.pageConfiger.pageCurrent = 1;
|
||
listQuery.value = { ...listQuery.value, ...val };
|
||
handleData(getConfiger.lx, "look");
|
||
};
|
||
// 获取数据
|
||
const getData = () => {
|
||
if (getConfiger.lx == "jyqx")
|
||
listQuery.value.pageNo = listQuery.value.pageCurrent;
|
||
if (getConfiger.lx == "mj") listQuery.value.jllx = "01";
|
||
if (getConfiger.lx == "fj") listQuery.value.jllx = "02";
|
||
if (getConfiger.lx == "zbbc") listQuery.value.bcQwBbzl = getConfiger.bclx;
|
||
if (getConfiger.lx == "jz") listQuery.value.jzQwBbzl = getConfiger.jzlx;
|
||
if (getConfiger.lx == "kfd") listQuery.value.dwlxs = "01";
|
||
if (getConfiger.lx == "zfjly") listQuery.value.sblx = "06";
|
||
if (getConfiger.lx == "bxd") listQuery.value.xqlx = "01";
|
||
if (getConfiger.lx == "xfq") listQuery.value.xqlx = "03";
|
||
if (getConfiger.lx == "bxx") listQuery.value.xqlx = "02";
|
||
common.tableConfiger.loading = true;
|
||
|
||
let params = { ...listQuery.value };
|
||
// params.ssbmdm = props.deptment.bmdm;
|
||
params.pageNo = params.pageCurrent;
|
||
qcckGet(params, url.value)
|
||
.then((res) => {
|
||
if (getConfiger.lx == "cl") {
|
||
pageDataL.tableData =
|
||
res.records.map((item) => {
|
||
return { id: item.cid, ...item };
|
||
}) || [];
|
||
} else {
|
||
pageDataL.tableData = res.records || [];
|
||
}
|
||
listQuery.value.total = res.total;
|
||
common.tableConfiger.loading = false;
|
||
})
|
||
.catch(() => {
|
||
common.tableConfiger.loading = false;
|
||
});
|
||
};
|
||
// 左边选择z
|
||
const chooseDataL = (val) => {
|
||
if (getConfiger.isRadio) {
|
||
hasChoosedL.value = val[0];
|
||
} else {
|
||
hasChoosedL.value = val;
|
||
}
|
||
};
|
||
// 右边选择的数据
|
||
const chooseDataR = (val) => {
|
||
console.log(val);
|
||
hasChoosedR.value = val;
|
||
};
|
||
// 添加数据
|
||
const upRight = () => {
|
||
const data = [...pageDataR.tableData, ...hasChoosedL.value];
|
||
pageDataR.tableData = data.reduce((acc, curr) => {
|
||
const x = acc.find((item) => item.id == curr.id);
|
||
if (!x) {
|
||
return acc.concat([curr]);
|
||
} else {
|
||
return acc;
|
||
}
|
||
}, []);
|
||
// pageDataR.tableData = [...map.values]
|
||
};
|
||
// 移除数据
|
||
const upLeft = () => {
|
||
pageDataR.tableData = pageDataR.tableData.filter((item) => {
|
||
return !hasChoosedR.value.includes(item);
|
||
});
|
||
};
|
||
|
||
// 提交数据
|
||
const submitDate = () => {
|
||
if (getConfiger.isRadio) {
|
||
console.log(hasChoosedL.value);
|
||
|
||
emits("update:modelValue", hasChoosedL.value); //单选
|
||
emits("change", hasChoosedL.value);
|
||
} else {
|
||
if (pageDataR.tableData.length == 0)
|
||
return proxy.$message.warning("请选择数据");
|
||
emits("update:modelValue", pageDataR.tableData); //多选
|
||
emits("change", pageDataR.tableData);
|
||
}
|
||
visible.value = false;
|
||
};
|
||
|
||
// 改变分页
|
||
const changeNo = (val) => {
|
||
listQuery.value.pageCurrent = val;
|
||
handleData(getConfiger.lx);
|
||
};
|
||
// 页数
|
||
const changeSize = (val) => {
|
||
listQuery.value.pageSize = val;
|
||
handleData(getConfiger.lx);
|
||
};
|
||
|
||
watch(
|
||
() => props.configer,
|
||
(val) => {
|
||
getConfiger = { ...getConfiger, ...val };
|
||
|
||
if (getConfiger.lx) handleData(getConfiger.lx);
|
||
if (getConfiger.isRadio) common.tableConfiger.showSelectType = "radio";
|
||
if (getConfiger.rowKey) common.tableConfiger.rowKey = getConfiger.rowKey;
|
||
},
|
||
{ immediate: true }
|
||
);
|
||
|
||
watch(
|
||
() => props.modelValue,
|
||
(val) => {
|
||
if (val && val.length > 0) {
|
||
common.tableConfiger.defaultSelectKeys = props.modelValue.map((it) => {
|
||
return it.id || it.cid;
|
||
});
|
||
pageDataR.tableData = props.modelValue;
|
||
} else {
|
||
common.tableConfiger.defaultSelectKeys = [];
|
||
pageDataR.tableData = [];
|
||
}
|
||
},
|
||
{ immediate: true, deep: true }
|
||
);
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
.tableBox .cnt {
|
||
width: 100px;
|
||
}
|
||
|
||
.tableBox .table {
|
||
flex: 1 0 0;
|
||
overflow: hidden;
|
||
}
|
||
|
||
.deBtn {
|
||
display: inline-block;
|
||
border-radius: 40px;
|
||
width: 70px;
|
||
height: 28px;
|
||
line-height: 28px;
|
||
text-align: center;
|
||
color: #fff;
|
||
background-color: #3e85c3;
|
||
border-color: #2b669a;
|
||
box-shadow: 0 1px 1px rgb(90 90 90 / 30%);
|
||
margin: 0 10px;
|
||
}
|
||
|
||
::v-deep .el-table tr {
|
||
color: #000;
|
||
}
|
||
|
||
::v-deep .el-table td.el-table__cell {
|
||
color: #505152;
|
||
}
|
||
|
||
// ::v-deep .el-popper{
|
||
// position: fixed !important;
|
||
// top: 50% !important;
|
||
// left: 50% !important;
|
||
// transform: translate(-50%, -50%) !important;
|
||
// }
|
||
.dinw {
|
||
position: absolute !important;
|
||
left: 50% !important;
|
||
transform: translate(-50%, -50%) !important;
|
||
top: 50% !important;
|
||
// width: 1000px;
|
||
margin: 0px !important;
|
||
}
|
||
</style>
|