124
This commit is contained in:
278
src/components/DanLoding/JyqxLoad.vue
Normal file
278
src/components/DanLoding/JyqxLoad.vue
Normal file
@ -0,0 +1,278 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
title="选择警用器械"
|
||||
width="1400px"
|
||||
v-model="modelValue"
|
||||
@close="closed"
|
||||
>
|
||||
<div v-if="modelValue">
|
||||
<el-form :model="listQuery" class="mosty-from-wrap" :inline="true">
|
||||
<el-form-item label="器械类型">
|
||||
<el-select
|
||||
v-model="listQuery.scode"
|
||||
class="m-2"
|
||||
placeholder="请选择器械类型"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in D_BZ_JYQXFL"
|
||||
:label="item.label"
|
||||
:key="item.value"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="所属部门">
|
||||
<MOSTY.Department
|
||||
width="100%"
|
||||
clearable
|
||||
v-model="listQuery.ssbmdm"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="购置日期">
|
||||
<el-date-picker
|
||||
v-model="listQuery.cgrq"
|
||||
format="YYYY-MM-DD"
|
||||
value-format="YYYY-MM-DD"
|
||||
type="date"
|
||||
unlink-panels
|
||||
placeholder="请选择日期"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="success" @click="handleFilter">查询</el-button>
|
||||
<el-button type="success" @click="reset()"> 重置 </el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div class="tabBox" style="margin-top: 0px">
|
||||
<el-table
|
||||
ref="multipleUserRef"
|
||||
@selection-change="handleSelectionChange"
|
||||
:data="tableData"
|
||||
border
|
||||
:row-key="keyid"
|
||||
style="width: 100%"
|
||||
height="450"
|
||||
>
|
||||
<el-table-column
|
||||
type="selection"
|
||||
width="55"
|
||||
:reserve-selection="true"
|
||||
/>
|
||||
<el-table-column
|
||||
type="index"
|
||||
show-overflow-tooltip
|
||||
align="center"
|
||||
width="60px"
|
||||
label="序号"
|
||||
>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
sortable
|
||||
prop="ssbm"
|
||||
label="所属部门"
|
||||
width="200px"
|
||||
align="center"
|
||||
></el-table-column>
|
||||
<el-table-column
|
||||
sortable
|
||||
prop="scode"
|
||||
show-overflow-tooltip
|
||||
align="center"
|
||||
label="器械类型"
|
||||
>
|
||||
<template #default="{ row }">
|
||||
<dict-tag
|
||||
:options="D_BZ_JYQXFL"
|
||||
:value="row.scode"
|
||||
:tag="false"
|
||||
/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
sortable
|
||||
prop="qxMc"
|
||||
show-overflow-tooltip
|
||||
align="center"
|
||||
label="器械名称"
|
||||
>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
sortable
|
||||
prop="qxbh"
|
||||
show-overflow-tooltip
|
||||
align="center"
|
||||
label="器械型号"
|
||||
>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
sortable
|
||||
prop="cgrq"
|
||||
show-overflow-tooltip
|
||||
label="生产日期"
|
||||
align="center"
|
||||
width="200px"
|
||||
>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
sortable
|
||||
prop="qxPch"
|
||||
show-overflow-tooltip
|
||||
label="录入批次"
|
||||
align="center"
|
||||
width="200px"
|
||||
>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="fenye">
|
||||
<el-pagination
|
||||
class="pagination"
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="handleCurrentChange"
|
||||
:current-page="listQuery.pageNo"
|
||||
:page-sizes="[2, 5, 10, 20]"
|
||||
:page-size="listQuery.pageSize"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="total"
|
||||
></el-pagination>
|
||||
</div>
|
||||
</div>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button @click="closed">取消</el-button>
|
||||
<el-button type="primary" @click="onComfirm">确认</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import * as rule from "@/utils/rules.js";
|
||||
import * as MOSTY from "@/components/MyComponents/index";
|
||||
import { ElMessage } from "element-plus";
|
||||
import {
|
||||
defineProps,
|
||||
watch,
|
||||
ref,
|
||||
onMounted,
|
||||
nextTick,
|
||||
getCurrentInstance
|
||||
} from "vue";
|
||||
import { getJyqx } from "@/api/file.js";
|
||||
const { proxy } = getCurrentInstance();
|
||||
const { D_BZ_JYQXFL } = proxy.$dict("D_BZ_JYQXFL");
|
||||
const props = defineProps({
|
||||
modelValue: {
|
||||
type: Boolean,
|
||||
required: true
|
||||
},
|
||||
roleIds: {
|
||||
type: Array,
|
||||
default: []
|
||||
}
|
||||
});
|
||||
const total = ref(0);
|
||||
const listQuery = ref({
|
||||
pageNo: 1,
|
||||
pageSize: 20
|
||||
});
|
||||
const form = ref({});
|
||||
const tableData = ref([]);
|
||||
const emits = defineEmits(["update:modelValue", "choosedUsers"]);
|
||||
onMounted(() => {
|
||||
handleFilter();
|
||||
});
|
||||
const closed = () => {
|
||||
emits("update:modelValue", false);
|
||||
};
|
||||
const reset = () => {
|
||||
listQuery.value = {
|
||||
pageNo: 1,
|
||||
pageSize: 20
|
||||
};
|
||||
getListData();
|
||||
};
|
||||
const keyid = (row) => {
|
||||
return row.id;
|
||||
};
|
||||
// 为用户分配角色
|
||||
const onComfirm = () => {
|
||||
const userList = JSON.parse(JSON.stringify(multipleSelectionUser.value));
|
||||
let list = []
|
||||
let listId = []
|
||||
userList.forEach(val=>{
|
||||
if(listId.indexOf(val.id) == -1) {
|
||||
list.push(val);
|
||||
listId.push(val.id);
|
||||
}
|
||||
})
|
||||
emits("choosedUsers", list);
|
||||
closed();
|
||||
};
|
||||
/**
|
||||
* pageSize 改变触发
|
||||
*/
|
||||
const handleSizeChange = (currentSize) => {
|
||||
listQuery.value.pageSize = currentSize;
|
||||
getListData();
|
||||
};
|
||||
|
||||
/**
|
||||
* 页码改变触发
|
||||
*/
|
||||
const handleCurrentChange = (currentPage) => {
|
||||
listQuery.value.pageNo = currentPage;
|
||||
getListData();
|
||||
};
|
||||
const getListData = async () => {
|
||||
const params = listQuery.value;
|
||||
const res = await getJyqx(params);
|
||||
tableData.value = res?.records;
|
||||
total.value = Number(res.total);
|
||||
multipleUser();
|
||||
};
|
||||
|
||||
//列表回显
|
||||
function multipleUser(row) {
|
||||
tableData.value.forEach(item=>{
|
||||
if(props.roleIds.some(id=>id == item.id)){
|
||||
multipleUserRef.value.toggleRowSelection(item, true);
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const handleFilter = () => {
|
||||
listQuery.value.pageNo = 1;
|
||||
getListData();
|
||||
};
|
||||
|
||||
const multipleUserRef = ref(null);
|
||||
const multipleSelectionUser = ref([]);
|
||||
const handleSelectionChange = (val) => {
|
||||
multipleSelectionUser.value = val;
|
||||
};
|
||||
|
||||
watch(
|
||||
() => props.modelValue,
|
||||
(val) => {
|
||||
if (val === true) {
|
||||
handleFilter();
|
||||
}
|
||||
}
|
||||
);
|
||||
</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>
|
234
src/components/DanLoding/JzLoad.vue
Normal file
234
src/components/DanLoding/JzLoad.vue
Normal file
@ -0,0 +1,234 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog title="选择警组" width="1400px" :model-value="modelValue" @close="closed">
|
||||
<div v-if="modelValue">
|
||||
<el-form :model="listQuery" :inline="true">
|
||||
<el-form-item label="所属部门">
|
||||
<MOSTY.Department
|
||||
width="280px"
|
||||
clearable
|
||||
v-model="listQuery.ssbmdm"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="警组名称">
|
||||
<el-input
|
||||
v-model="listQuery.jzMc"
|
||||
placeholder="请输入警组名称"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="负责人">
|
||||
<el-input
|
||||
v-model="listQuery.ddMjxm"
|
||||
placeholder="请输入负责人"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button @click="handleFilter"> 查询 </el-button>
|
||||
<el-button @click="reset()"> 重置 </el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div class="tabBox" :class="props.Single?'tabBoxRadio':''" style="margin-top: 0px">
|
||||
<el-table
|
||||
ref="multipleUserRef"
|
||||
@selection-change="handleSelectionChange"
|
||||
:data="tableData"
|
||||
border
|
||||
style="width: 100%"
|
||||
:row-key="keyid"
|
||||
height="450"
|
||||
>
|
||||
<el-table-column
|
||||
type="selection"
|
||||
width="55"
|
||||
:reserve-selection="true"
|
||||
/>
|
||||
<el-table-column
|
||||
label="序号"
|
||||
type="index"
|
||||
align="center"
|
||||
sortable
|
||||
width="80"
|
||||
/>
|
||||
<el-table-column
|
||||
prop="jzMc"
|
||||
show-overflow-tooltip
|
||||
align="center"
|
||||
label="警组名称"
|
||||
>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="ssbm"
|
||||
label="所属部门"
|
||||
align="center"
|
||||
></el-table-column>
|
||||
<el-table-column
|
||||
prop="ddMjxm"
|
||||
show-overflow-tooltip
|
||||
label="警组负责人"
|
||||
align="center"
|
||||
>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="fenye">
|
||||
<el-pagination
|
||||
class="pagination"
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="handleCurrentChange"
|
||||
:current-page="listQuery.pageCurrent"
|
||||
:page-sizes="[2, 5, 10, 20]"
|
||||
:page-size="listQuery.pageSize"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="total"
|
||||
></el-pagination>
|
||||
</div>
|
||||
</div>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button @click="closed">取消</el-button>
|
||||
<el-button type="primary" @click="onComfirm">确认</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import * as rule from "@/utils/rules.js";
|
||||
import * as MOSTY from "@/components/MyComponents/index";
|
||||
import { ElMessage } from "element-plus";
|
||||
import { defineProps, watch, ref, onMounted, nextTick } from "vue";
|
||||
import { getJzList } from "@/api/file.js";
|
||||
const props = defineProps({
|
||||
modelValue: {
|
||||
type: Boolean,
|
||||
required: true
|
||||
},
|
||||
roleId: {
|
||||
type: String || Array,
|
||||
default: "" || []
|
||||
},
|
||||
jczid:{
|
||||
type:String,
|
||||
default:""
|
||||
},
|
||||
//是否单选
|
||||
Single: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
});
|
||||
const keyid = (row) => {
|
||||
return row.id;
|
||||
};
|
||||
const total = ref(0);
|
||||
const listQuery = ref({
|
||||
pageCurrent: 1,
|
||||
pageSize: 20,
|
||||
jczid:props.jczid
|
||||
});
|
||||
const multipleUserRef = ref(null);
|
||||
const multipleSelectionUser = ref([]);
|
||||
const form = ref({});
|
||||
const tableData = ref([]);
|
||||
const emits = defineEmits(["update:modelValue", "choosedUsers"]);
|
||||
const closed = () => {
|
||||
emits("update:modelValue", false);
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
handleFilter();
|
||||
});
|
||||
|
||||
// 重置
|
||||
const reset = () => {
|
||||
listQuery.value = { pageCurrent: 1, pageSize: 20, jczid:props.jczid };
|
||||
getListData();
|
||||
};
|
||||
|
||||
// 为用户分配角色
|
||||
const onComfirm = () => {
|
||||
const userList = JSON.parse(JSON.stringify(multipleSelectionUser.value));
|
||||
if (props.Single&&userList.length>1&&userList.length==0) {
|
||||
ElMessage({ type: "warning", message: "请每次选择一个警组!" });
|
||||
} else {
|
||||
emits("choosedUsers", userList);
|
||||
closed();
|
||||
}
|
||||
};
|
||||
// pageSize 改变触发
|
||||
const handleSizeChange = (currentSize) => {
|
||||
listQuery.value.pageSize = currentSize;
|
||||
getListData();
|
||||
};
|
||||
|
||||
// 页码改变触发
|
||||
const handleCurrentChange = (currentPage) => {
|
||||
listQuery.value.pageCurrent = currentPage;
|
||||
getListData();
|
||||
};
|
||||
const getListData = async () => {
|
||||
const params = listQuery.value;
|
||||
const res = await getJzList(params);
|
||||
tableData.value = res?.records;
|
||||
total.value = Number(res.total);
|
||||
multipleUser()
|
||||
};
|
||||
|
||||
//列表回显
|
||||
function multipleUser(row) {
|
||||
tableData.value.forEach(item=>{
|
||||
if(Array.isArray(props.roleId)){
|
||||
props.roleId.forEach(v=>{
|
||||
if(v == item.id){
|
||||
multipleUserRef.value.toggleRowSelection(item, true);
|
||||
}
|
||||
})
|
||||
}else{
|
||||
if(props.roleId == item.id){
|
||||
multipleUserRef.value.toggleRowSelection(item, true);
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 分页
|
||||
const handleFilter = () => {
|
||||
listQuery.value.pageCurrent = 1;
|
||||
getListData();
|
||||
};
|
||||
|
||||
// 多选
|
||||
const handleSelectionChange = (val) => {
|
||||
if(props.Single){
|
||||
if(val.length>1){
|
||||
let del_row = val.shift()
|
||||
multipleUserRef.value.toggleRowSelection(del_row,false)
|
||||
}
|
||||
multipleSelectionUser.value = val;
|
||||
}else{
|
||||
multipleSelectionUser.value = val;
|
||||
}
|
||||
};
|
||||
|
||||
watch(() => props.modelValue,(val) => {
|
||||
if (val === true) handleFilter();
|
||||
}
|
||||
);
|
||||
|
||||
</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>
|
270
src/components/DanLoding/JzclLoad.vue
Normal file
270
src/components/DanLoding/JzclLoad.vue
Normal file
@ -0,0 +1,270 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
title="选择警用车辆"
|
||||
width="1400px"
|
||||
:model-value="modelValue"
|
||||
@close="closed"
|
||||
>
|
||||
<div v-if="modelValue">
|
||||
<el-form :model="listQuery" class="mosty-from-wrap" :inline="true">
|
||||
<el-form-item label="所属部门">
|
||||
<MOSTY.Department
|
||||
width="100%"
|
||||
clearable
|
||||
v-model="listQuery.ssbmdm"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="车牌号">
|
||||
<el-input
|
||||
v-model="listQuery.cph"
|
||||
placeholder="请输入车牌号"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="车辆品牌">
|
||||
<el-select
|
||||
filterable
|
||||
v-model="listQuery.clpp"
|
||||
class="m-2"
|
||||
placeholder="请选择"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in D_BZ_CLPP"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="success" @click="handleFilter">查询</el-button>
|
||||
<el-button type="success" @click="reset()"> 重置 </el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div
|
||||
class="tabBox"
|
||||
:class="props.Single ? 'tabBoxRadio' : ''"
|
||||
style="margin-top: 0px"
|
||||
>
|
||||
<el-table
|
||||
ref="multipleUserRef"
|
||||
@selection-change="handleSelectionChange"
|
||||
:data="tableData"
|
||||
border
|
||||
:row-key="keyid"
|
||||
style="width: 100%"
|
||||
height="450"
|
||||
>
|
||||
<el-table-column type="selection" width="55" :reserve-selection="true" />
|
||||
<el-table-column
|
||||
type="index"
|
||||
show-overflow-tooltip
|
||||
align="center"
|
||||
width="60px"
|
||||
label="序号"
|
||||
>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
sortable
|
||||
prop="ssbm"
|
||||
show-overflow-tooltip
|
||||
align="center"
|
||||
width="250px"
|
||||
label="所属部门"
|
||||
>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
sortable
|
||||
prop="cplx"
|
||||
show-overflow-tooltip
|
||||
align="center"
|
||||
width="150px"
|
||||
label="号牌种类"
|
||||
>
|
||||
<template #default="{ row }">
|
||||
<dict-tag :options="D_BZ_HPZL" :value="row.cplx" :tag="false" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
sortable
|
||||
prop="cph"
|
||||
label="车牌号"
|
||||
width="250px"
|
||||
align="center"
|
||||
></el-table-column>
|
||||
<el-table-column
|
||||
sortable
|
||||
prop="clpp"
|
||||
show-overflow-tooltip
|
||||
label="车辆品牌"
|
||||
align="center"
|
||||
width="250px"
|
||||
>
|
||||
<template #default="{ row }">
|
||||
<dict-tag :options="D_BZ_CLPP" :value="row.clpp" :tag="false" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
sortable
|
||||
prop="clnk"
|
||||
show-overflow-tooltip
|
||||
label="车辆年款"
|
||||
align="center"
|
||||
></el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="fenye">
|
||||
<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>
|
||||
</div>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button @click="closed">取消</el-button>
|
||||
<el-button type="primary" @click="onComfirm">确认</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import * as rule from "@/utils/rules.js";
|
||||
import * as MOSTY from "@/components/MyComponents/index";
|
||||
import { ElMessage } from "element-plus";
|
||||
import {
|
||||
defineProps,
|
||||
ref,
|
||||
onMounted,
|
||||
nextTick,
|
||||
getCurrentInstance
|
||||
} from "vue";
|
||||
import { getXfcl } from "@/api/file.js";
|
||||
const { proxy } = getCurrentInstance();
|
||||
const { D_BZ_HPZL, D_BZ_CLYS, D_BZ_CLPP } = proxy.$dict(
|
||||
"D_BZ_HPZL",
|
||||
"D_BZ_CLYS",
|
||||
"D_BZ_CLPP"
|
||||
);
|
||||
const props = defineProps({
|
||||
modelValue: {
|
||||
type: Boolean,
|
||||
required: true
|
||||
},
|
||||
roleIds: {
|
||||
type: Array,
|
||||
default: []
|
||||
},
|
||||
//是否单选
|
||||
Single: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
});
|
||||
const total = ref(0);
|
||||
const listQuery = ref({
|
||||
pageCurrent: 1,
|
||||
pageSize: 20
|
||||
});
|
||||
const form = ref({});
|
||||
const tableData = ref([]);
|
||||
const multipleUserRef = ref(null);
|
||||
const multipleSelectionUser = ref([]);
|
||||
const emits = defineEmits(["update:modelValue", "choosedUsers"]);
|
||||
onMounted(() => {
|
||||
handleFilter();
|
||||
});
|
||||
const closed = () => {
|
||||
emits("update:modelValue", false);
|
||||
};
|
||||
const keyid = (row) => {
|
||||
return row.cid;
|
||||
};
|
||||
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.cid) == -1) {
|
||||
list.push(val);
|
||||
listId.push(val.cid);
|
||||
}
|
||||
})
|
||||
emits("choosedUsers", list);
|
||||
closed();
|
||||
};
|
||||
/**
|
||||
* pageSize 改变触发
|
||||
*/
|
||||
const handleSizeChange = (currentSize) => {
|
||||
listQuery.value.pageSize = currentSize;
|
||||
getListData();
|
||||
};
|
||||
|
||||
/**
|
||||
* 页码改变触发
|
||||
*/
|
||||
const handleCurrentChange = (currentPage) => {
|
||||
listQuery.value.pageCurrent = currentPage;
|
||||
getListData();
|
||||
};
|
||||
const getListData = async () => {
|
||||
const params = listQuery.value;
|
||||
const res = await getXfcl(params);
|
||||
tableData.value = res?.records;
|
||||
total.value = Number(res.total);
|
||||
multipleUser()
|
||||
};
|
||||
|
||||
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;
|
||||
}
|
||||
};
|
||||
//列表回显
|
||||
function multipleUser() {
|
||||
tableData.value.forEach(item=>{
|
||||
if(props.roleIds.some(id=>id == item.cid)){
|
||||
multipleUserRef.value.toggleRowSelection(item, 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>
|
182
src/components/DanLoding/MjLoad.vue
Normal file
182
src/components/DanLoding/MjLoad.vue
Normal file
@ -0,0 +1,182 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog :title="titleValue" width="1400px" :model-value="modelValue" @close="closed" :append-to-body="true">
|
||||
<div v-if="modelValue">
|
||||
<el-form :model="listQuery" class="mosty-from-wrap" :inline="true">
|
||||
<el-form-item label="姓名">
|
||||
<el-input v-model="listQuery.xm" placeholder="请输入姓名" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="身份证号码">
|
||||
<el-input v-model="listQuery.sfzh" placeholder="请输入身份证号码" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="所属部门">
|
||||
<MOSTY.Department width="100%" clearable v-model="listQuery.ssbmdm" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="success" @click="handleFilter">查询</el-button>
|
||||
<el-button type="success" @click="reset()"> 重置 </el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div class="tabBox" :class="props.Single?'tabBoxRadio':''" style="margin-top: 0px">
|
||||
<el-table ref="multipleUserRef" @selection-change="handleSelectionChange" :data="tableData" border style="width: 100%" :row-key="keyid" height="450">
|
||||
<el-table-column type="selection" width="55" :reserve-selection="true" />
|
||||
<el-table-column label="序号" type="index" align="center" sortable width="80" />
|
||||
<el-table-column sortable prop="xm" show-overflow-tooltip align="center" label="民警姓名">
|
||||
</el-table-column>
|
||||
<el-table-column sortable prop="sfzh" show-overflow-tooltip align="center" label="身份证号码">
|
||||
</el-table-column>
|
||||
<el-table-column sortable prop="ssbm" label="所属部门" align="center"></el-table-column>
|
||||
<el-table-column sortable prop="jh" label="警号" align="center"></el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="fenye">
|
||||
<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>
|
||||
</div>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button @click="closed">取消</el-button>
|
||||
<el-button type="primary" @click="onComfirm">确认</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import * as rule from "@/utils/rules.js";
|
||||
import * as MOSTY from "@/components/MyComponents/index";
|
||||
import { ElMessage } from "element-plus";
|
||||
import { defineProps, watch, ref, onMounted, nextTick, watchEffect } from "vue";
|
||||
import { getTbJcglXfll } from "@/api/xfll";
|
||||
const props = defineProps({
|
||||
modelValue: {
|
||||
type: Boolean,
|
||||
required: true
|
||||
},
|
||||
titleValue: {
|
||||
type: String,
|
||||
default: "选择民警"
|
||||
},
|
||||
roleId: {
|
||||
type: String,
|
||||
default: ""
|
||||
},
|
||||
//是否单选
|
||||
Single: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
data: {
|
||||
type: Array,
|
||||
default: []
|
||||
}
|
||||
});
|
||||
const keyid = (row) => {
|
||||
return row.ryid;
|
||||
};
|
||||
const total = ref(0);
|
||||
const listQuery = ref({
|
||||
pageCurrent: 1,
|
||||
pageSize: 20,
|
||||
fl: "01"
|
||||
});
|
||||
const form = ref({});
|
||||
const tableData = ref([]);
|
||||
const emits = defineEmits(["update:modelValue", "choosedUsers"]);
|
||||
const closed = () => {
|
||||
emits("update:modelValue", false);
|
||||
};
|
||||
const reset = () => {
|
||||
listQuery.value = {
|
||||
pageCurrent: 1,
|
||||
pageSize: 20,
|
||||
fl: "01"
|
||||
};
|
||||
getListData();
|
||||
};
|
||||
|
||||
// 为用户分配角色
|
||||
const onComfirm = () => {
|
||||
const userList = multipleSelectionUser.value;
|
||||
emits("choosedUsers", userList);
|
||||
closed();
|
||||
};
|
||||
onMounted(() => {
|
||||
getListData();
|
||||
});
|
||||
/**
|
||||
* pageSize 改变触发
|
||||
*/
|
||||
const handleSizeChange = (currentSize) => {
|
||||
listQuery.value.pageSize = currentSize;
|
||||
getListData();
|
||||
};
|
||||
|
||||
/**
|
||||
* 页码改变触发
|
||||
*/
|
||||
const handleCurrentChange = (currentPage) => {
|
||||
listQuery.value.pageCurrent = currentPage;
|
||||
getListData();
|
||||
};
|
||||
const getListData = async () => {
|
||||
const params = listQuery.value;
|
||||
const res = await getTbJcglXfll(params);
|
||||
tableData.value = res?.records;
|
||||
total.value = Number(res.total);
|
||||
multipleUser(props.data);
|
||||
};
|
||||
const handleFilter = () => {
|
||||
listQuery.value.pageCurrent = 1;
|
||||
getListData();
|
||||
};
|
||||
|
||||
const multipleUserRef = ref(null);
|
||||
const multipleSelectionUser = ref([]);
|
||||
const handleSelectionChange = (val) => {
|
||||
if (props.Single) {
|
||||
if (val.length > 1) {
|
||||
let del_row = val.shift();
|
||||
multipleUserRef.value.toggleRowSelection(del_row, false);
|
||||
}
|
||||
multipleSelectionUser.value = val;
|
||||
} else {
|
||||
multipleSelectionUser.value = val;
|
||||
}
|
||||
};
|
||||
|
||||
watch(
|
||||
() => props.modelValue,
|
||||
(val) => {
|
||||
if (val === true) {
|
||||
handleFilter();
|
||||
}
|
||||
}
|
||||
);
|
||||
|
||||
//列表回显
|
||||
function multipleUser(row) {
|
||||
if (row) {
|
||||
tableData.value.forEach((item) => {
|
||||
if (row.some((id) => id == item.ryid)) {
|
||||
multipleUserRef.value.toggleRowSelection(item, 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>
|
258
src/components/DanLoding/ZjkLoad.vue
Normal file
258
src/components/DanLoding/ZjkLoad.vue
Normal file
@ -0,0 +1,258 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog :title="titleValue" width="1400px" v-model="modelValue" @close="closed">
|
||||
<div v-if="modelValue">
|
||||
<el-form :model="listQuery" class="mosty-from-wrap" :inline="true">
|
||||
<el-form-item label="所属部门">
|
||||
<MOSTY.Department width="100%" clearable v-model="listQuery.ssbmdm" />
|
||||
</el-form-item>
|
||||
<el-form-item label="专家姓名">
|
||||
<el-input v-model="listQuery.zjxm" placeholder="请输入专家姓名" clearable />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item>
|
||||
<el-button type="success" @click="handleFilter">查询</el-button>
|
||||
<el-button type="success" @click="reset()"> 重置 </el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div class="tabBox" style="margin-top: 0px" v-if="modelValue">
|
||||
<el-table ref="multipleUserRef" @selection-change="handleSelectionChange" :data="tableData" :highlight-current-row="props.Single" border v-loading="loading" style="width: 100%" :row-key="keyid" height="450">
|
||||
<el-table-column type="selection" width="55" :reserve-selection="true" v-if="!props.Single" />
|
||||
<el-table-column width="55" #default="{ row }" v-else>
|
||||
<el-radio v-model="ridioIndex" :label="row.id"></el-radio>
|
||||
</el-table-column>
|
||||
<el-table-column label="序号" type="index" align="center" sortable width="80" />
|
||||
<el-table-column sortable prop="ssbm" label="所属部门" show-overflow-tooltip align="center"></el-table-column>
|
||||
<el-table-column sortable prop="xm" show-overflow-tooltip align="center" label="专家姓名">
|
||||
</el-table-column>
|
||||
<el-table-column show-overflow-tooltip align="center" label="擅长领域" prop="scly"/>
|
||||
|
||||
<el-table-column prop="szdw" show-overflow-tooltip align="center" label="所在单位">
|
||||
</el-table-column>
|
||||
<el-table-column sortable prop="lxdh" show-overflow-tooltip label=" 联系电话" align="center">
|
||||
</el-table-column>
|
||||
<el-table-column sortable prop="xl" show-overflow-tooltip label="学历" align="center">
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="fenye">
|
||||
<el-pagination class="pagination" @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="listQuery.pageCurrent" :page-sizes="[2, 5, 10, 20]" :page-size="listQuery.pageSize"
|
||||
layout="total, sizes, prev, pager, next, jumper" :total="total"></el-pagination>
|
||||
</div>
|
||||
</div>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button @click="closed">取消</el-button>
|
||||
<el-button type="primary" @click="onComfirm">确认</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import * as rule from "@/utils/rules.js";
|
||||
import * as MOSTY from "@/components/MyComponents/index";
|
||||
import { ElMessage } from "element-plus";
|
||||
import { selectJczList, zjkselectPage } from "@/api/file.js";
|
||||
import {
|
||||
defineProps,
|
||||
watch,
|
||||
ref,
|
||||
onMounted,
|
||||
nextTick,
|
||||
getCurrentInstance
|
||||
} from "vue";
|
||||
const { proxy } = getCurrentInstance();
|
||||
const { D_BZ_JCZLX } = proxy.$dict("D_BZ_JCZLX");
|
||||
const props = defineProps({
|
||||
//是否显示
|
||||
modelValue: {
|
||||
type: Boolean,
|
||||
required: true
|
||||
},
|
||||
//标题
|
||||
titleValue: {
|
||||
type: String,
|
||||
default: "选择专家"
|
||||
},
|
||||
//是否单选
|
||||
Single: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
//已经选中得数据回显
|
||||
data: {
|
||||
type: Array,
|
||||
default: []
|
||||
}
|
||||
});
|
||||
const keyid = (row) => {
|
||||
return row.id;
|
||||
};
|
||||
const ridioIndex = ref(null);
|
||||
const total = ref(0);
|
||||
const listQuery = ref({
|
||||
pageCurrent: 1,
|
||||
pageSize: 20,
|
||||
zjxm: "",
|
||||
ssbmdm: ""
|
||||
});
|
||||
const form = ref({});
|
||||
const tableData = ref([]);
|
||||
const loading = ref(false);
|
||||
const emits = defineEmits(["update:modelValue", "choosedJcz"]);
|
||||
const closed = () => {
|
||||
listQuery.value.jczmc = "";
|
||||
emits("update:modelValue", false);
|
||||
};
|
||||
const reset = () => {
|
||||
listQuery.value = {
|
||||
pageCurrent: 1,
|
||||
pageSize: 20,
|
||||
jczmc: "",
|
||||
ssbmdm: ""
|
||||
};
|
||||
getListData();
|
||||
};
|
||||
// 判断传进来的选中数据和加载的选中数据不满足的数据
|
||||
const checkopenList = ref([]);
|
||||
|
||||
// 确定选中
|
||||
const onComfirm = () => {
|
||||
//单选
|
||||
if (props.Single) {
|
||||
if (![ridioIndex.value][0]) {
|
||||
proxy.$message.warning("请选择专家");
|
||||
return;
|
||||
}
|
||||
const info = tableData.value.find((item) => {
|
||||
return item.id === ridioIndex.value;
|
||||
});
|
||||
emits("choosedJcz", [JSON.parse(JSON.stringify(info))]);
|
||||
} else {
|
||||
//多选
|
||||
const jczList = JSON.parse(JSON.stringify(multipleSelectionUser.value));
|
||||
if (jczList.length === 0) {
|
||||
proxy.$message.warning("请选择专家");
|
||||
return;
|
||||
}
|
||||
emits("choosedJcz", [...jczList, ...checkopenList.value]);
|
||||
}
|
||||
closed();
|
||||
};
|
||||
onMounted(() => {
|
||||
getListData();
|
||||
});
|
||||
/**
|
||||
* pageSize 改变触发
|
||||
*/
|
||||
const handleSizeChange = (currentSize) => {
|
||||
listQuery.value.pageSize = currentSize;
|
||||
getListData();
|
||||
};
|
||||
|
||||
/**
|
||||
* 页码改变触发
|
||||
*/
|
||||
const handleCurrentChange = (currentPage) => {
|
||||
listQuery.value.pageCurrent = currentPage;
|
||||
getListData();
|
||||
};
|
||||
//专家数据
|
||||
const getListData = async () => {
|
||||
loading.value = true;
|
||||
zjkselectPage(listQuery.value)
|
||||
.then((res) => {
|
||||
tableData.value = res?.records;
|
||||
loading.value = false;
|
||||
multipleUser(props.data, tableData.value);
|
||||
total.value = Number(res.total);
|
||||
})
|
||||
.catch(() => {
|
||||
loading.value = false;
|
||||
});
|
||||
};
|
||||
const handleFilter = () => {
|
||||
listQuery.value.pageCurrent = 1;
|
||||
getListData();
|
||||
};
|
||||
|
||||
const multipleUserRef = ref(null);
|
||||
const multipleSelectionUser = ref([]);
|
||||
const handleSelectionChange = (val) => {
|
||||
multipleSelectionUser.value = val;
|
||||
if (checkopenList.value) {
|
||||
for (let i = 0; i < multipleSelectionUser.value.length; i++) {
|
||||
const l = multipleSelectionUser.value[i];
|
||||
for (let j = 0; j < checkopenList.value.length; j++) {
|
||||
const z = checkopenList.value[j];
|
||||
if (l.id == z.id) {
|
||||
checkopenList.value.splice(j, 1);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
//回显--用于多选表格
|
||||
function multipleUser(row, list) {
|
||||
if (row) {
|
||||
if (props.Single) {
|
||||
row.forEach((item) => {
|
||||
list.forEach((select) => {
|
||||
if (typeof item == "object") {
|
||||
if (item.id == select.id) {
|
||||
ridioIndex.value = item.id;
|
||||
}
|
||||
} else {
|
||||
if (item == select.id) {
|
||||
ridioIndex.value = item;
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
} else {
|
||||
row.forEach((item) => {
|
||||
list.forEach((select) => {
|
||||
if (item.id == select.id) {
|
||||
if (multipleUserRef.value) {
|
||||
multipleUserRef.value.toggleRowSelection(select, true);
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
watch(
|
||||
() => props.modelValue,
|
||||
(val) => {
|
||||
if (val === true) {
|
||||
ridioIndex.value = "";
|
||||
handleFilter();
|
||||
}
|
||||
}
|
||||
);
|
||||
watch(
|
||||
() => props.data,
|
||||
(val) => {
|
||||
if (multipleUserRef.value) multipleUser(val, tableData.value);
|
||||
checkopenList.value = JSON.parse(JSON.stringify(val));
|
||||
}
|
||||
);
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import "@/assets/css/layout.scss";
|
||||
@import "@/assets/css/element-plus.scss";
|
||||
::v-deep .el-form--inline {
|
||||
padding-left: 0 !important;
|
||||
}
|
||||
::v-deep .el-radio__label {
|
||||
display: none;
|
||||
}
|
||||
|
||||
::v-deep .el-table__body tr.current-row > td.el-table__cell {
|
||||
background: #106fdc;
|
||||
}
|
||||
</style>
|
266
src/components/DanLoding/ZnzbLoad.vue
Normal file
266
src/components/DanLoding/ZnzbLoad.vue
Normal file
@ -0,0 +1,266 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
title="选择智能装备"
|
||||
width="1400px"
|
||||
:model-value="modelValue"
|
||||
@close="closed"
|
||||
:append-to-body="true"
|
||||
>
|
||||
<div v-if="modelValue">
|
||||
<el-form :model="listQuery" class="mosty-from-wrap" :inline="true">
|
||||
<el-form-item label="所属部门">
|
||||
<MOSTY.Department
|
||||
width="100%"
|
||||
clearable
|
||||
v-model="listQuery.ssbmdm"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="装备类型">
|
||||
<el-select
|
||||
clearableupdate
|
||||
v-model="listQuery.scode"
|
||||
placeholder="请选择装备类型"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in D_BZ_ZNZBFL"
|
||||
:label="item.label"
|
||||
:key="item.value"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="生产日期">
|
||||
<el-date-picker
|
||||
format="YYYY-MM-DD"
|
||||
value-format="YYYY-MM-DD"
|
||||
v-model="listQuery.gzrq"
|
||||
type="date"
|
||||
placeholder="请选择日期"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="success" @click="handleFilter">查询</el-button>
|
||||
<el-button type="success" @click="reset()"> 重置 </el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div class="tabBox" :class="props.Single?'tabBoxRadio':''" style="margin-top: 0px">
|
||||
<el-table
|
||||
ref="multipleUserRef"
|
||||
@selection-change="handleSelectionChange"
|
||||
:data="tableData"
|
||||
border
|
||||
:row-key="keyid"
|
||||
style="width: 100%"
|
||||
height="450"
|
||||
>
|
||||
<el-table-column type="selection" width="55" :reserve-selection="true" />
|
||||
<el-table-column
|
||||
type="index"
|
||||
show-overflow-tooltip
|
||||
align="center"
|
||||
width="60px"
|
||||
label="序号"
|
||||
>
|
||||
</el-table-column
|
||||
><el-table-column
|
||||
sortable
|
||||
prop="ssbm"
|
||||
label="所属部门"
|
||||
width="250px"
|
||||
align="center"
|
||||
></el-table-column>
|
||||
<el-table-column
|
||||
sortable
|
||||
prop="scode"
|
||||
show-overflow-tooltip
|
||||
align="center"
|
||||
width="350px"
|
||||
label="装备类型"
|
||||
>
|
||||
<template #default="{ row }">
|
||||
<dict-tag
|
||||
:options="D_BZ_ZNZBFL"
|
||||
:value="row.scode"
|
||||
:tag="false"
|
||||
/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
sortable
|
||||
prop="xh"
|
||||
show-overflow-tooltip
|
||||
label="装备型号"
|
||||
align="center"
|
||||
></el-table-column>
|
||||
<el-table-column
|
||||
sortable
|
||||
prop="sbmc"
|
||||
show-overflow-tooltip
|
||||
label="装备名称"
|
||||
align="center"
|
||||
></el-table-column>
|
||||
<el-table-column
|
||||
sortable
|
||||
prop="cgrq"
|
||||
show-overflow-tooltip
|
||||
label="生产日期"
|
||||
align="center"
|
||||
width="200px"
|
||||
>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="fenye">
|
||||
<el-pagination
|
||||
class="pagination"
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="handleCurrentChange"
|
||||
:current-page="listQuery.pageNo"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
:page-size="listQuery.pageSize"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="total"
|
||||
></el-pagination>
|
||||
</div>
|
||||
</div>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button @click="closed">取消</el-button>
|
||||
<el-button type="primary" @click="onComfirm">确认</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import * as rule from "@/utils/rules.js";
|
||||
import * as MOSTY from "@/components/MyComponents/index";
|
||||
import { ElMessage } from "element-plus";
|
||||
import { defineProps, watch, ref, onMounted, nextTick,getCurrentInstance } from "vue";
|
||||
import { getZnzb } from "@/api/file.js";
|
||||
const { proxy } = getCurrentInstance();
|
||||
const { D_BZ_ZNZBFL } = proxy.$dict("D_BZ_ZNZBFL");
|
||||
const props = defineProps({
|
||||
modelValue: {
|
||||
type: Boolean,
|
||||
required: true
|
||||
},
|
||||
roleId: {
|
||||
type: String,
|
||||
default: ""
|
||||
},
|
||||
//是否单选
|
||||
Single: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
zblx: {
|
||||
type: String,
|
||||
default: ""
|
||||
},
|
||||
data: {
|
||||
type: Array,
|
||||
default: []
|
||||
},
|
||||
});
|
||||
const total = ref(0);
|
||||
const listQuery = ref({
|
||||
pageNo: 1,
|
||||
pageSize: 20
|
||||
})
|
||||
const form = ref({});
|
||||
const tableData = ref([]);
|
||||
const emits = defineEmits(["update:modelValue", "choosedUsers"]);
|
||||
const closed = () => {
|
||||
emits("update:modelValue", false);
|
||||
};
|
||||
const reset = () => {
|
||||
listQuery.value = {
|
||||
pageNo: 1,
|
||||
pageSize: 20
|
||||
};
|
||||
getListData();
|
||||
};
|
||||
|
||||
const keyid = (row) => {
|
||||
return row.id;
|
||||
};
|
||||
|
||||
// 为用户分配角色
|
||||
const onComfirm = () => {
|
||||
const userList = multipleSelectionUser.value
|
||||
emits("choosedUsers", userList);
|
||||
closed();
|
||||
};
|
||||
/**
|
||||
* pageSize 改变触发
|
||||
*/
|
||||
const handleSizeChange = (currentSize) => {
|
||||
listQuery.value.pageSize = currentSize;
|
||||
getListData();
|
||||
};
|
||||
|
||||
/**
|
||||
* 页码改变触发
|
||||
*/
|
||||
const handleCurrentChange = (currentPage) => {
|
||||
listQuery.value.pageNo = currentPage;
|
||||
getListData();
|
||||
};
|
||||
const getListData = async () => {
|
||||
const params = listQuery.value;
|
||||
params.scode = props.zblx
|
||||
const res = await getZnzb(params);
|
||||
tableData.value = res?.records;
|
||||
total.value = Number(res.total);
|
||||
multipleUser(props.data)
|
||||
};
|
||||
|
||||
//列表回显
|
||||
function multipleUser(row) {
|
||||
if (row) {
|
||||
tableData.value.forEach(item=>{
|
||||
if(row.some(id=>id == item.id)){
|
||||
multipleUserRef.value.toggleRowSelection(item, true);
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
const handleFilter = () => {
|
||||
listQuery.value.pageNo = 1;
|
||||
getListData();
|
||||
};
|
||||
|
||||
const multipleUserRef = ref(null);
|
||||
const multipleSelectionUser = ref([]);
|
||||
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;
|
||||
}
|
||||
};
|
||||
|
||||
onMounted(()=>{
|
||||
handleFilter();
|
||||
})
|
||||
</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>
|
190
src/components/DanLoding/flLoad.vue
Normal file
190
src/components/DanLoding/flLoad.vue
Normal file
@ -0,0 +1,190 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog :title="titleValue" width="1400px" v-model="modelValue" @close="closed" destroy-on-close>
|
||||
<div class="hedie">
|
||||
<el-form ref="flform">
|
||||
<div v-for="(item,index) in flzyList" :key="index" class="box">
|
||||
<el-form-item label="颁布机构:" class="item">
|
||||
<el-input v-model="item.bbjg" class="input" />
|
||||
</el-form-item>
|
||||
<el-form-item label="法律条款:" class="item">
|
||||
<el-input v-model="item.fltk" class="input" />
|
||||
</el-form-item>
|
||||
<el-form-item label="法律标题:" class="item">
|
||||
<el-input v-model="item.title" class="input" />
|
||||
</el-form-item>
|
||||
<el-form-item label="类型:" class="item">
|
||||
<el-input v-model="item.type" class="input" />
|
||||
</el-form-item>
|
||||
<el-form-item label="适用范围:" class="item">
|
||||
<el-input v-model="item.syfw" class="input" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注:" class="item">
|
||||
<el-input type="textarea" v-model="item.bz" class="input" />
|
||||
</el-form-item>
|
||||
<el-button type="primary" @click="rovem(item)" class="but">删除</el-button>
|
||||
</div>
|
||||
|
||||
</el-form>
|
||||
</div>
|
||||
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button @click="addflzy">增加法律指引</el-button>
|
||||
<el-button type="primary" @click="onComfirm">确认</el-button>
|
||||
<el-button @click="closed">取消</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
defineProps,
|
||||
watch,
|
||||
ref,
|
||||
getCurrentInstance,
|
||||
} from "vue";
|
||||
const { proxy } = getCurrentInstance();
|
||||
const { D_BZ_JCZLX } = proxy.$dict("D_BZ_JCZLX");
|
||||
const emits = defineEmits(["update:modelValue", "choosedJcz"]);
|
||||
const props = defineProps({
|
||||
//是否显示
|
||||
modelValue: {
|
||||
type: Boolean,
|
||||
required: true
|
||||
},
|
||||
//标题
|
||||
titleValue: {
|
||||
type: String,
|
||||
default: "法律指引"
|
||||
},
|
||||
//是否单选
|
||||
Single: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
//已经选中得数据回显
|
||||
data: {
|
||||
type: Array,
|
||||
default: []
|
||||
}
|
||||
});
|
||||
const flzyList = ref([
|
||||
{
|
||||
bbjg: "",
|
||||
bz: "",
|
||||
fltk: "",
|
||||
syfw: "",
|
||||
title: "",
|
||||
type: ""
|
||||
}
|
||||
]);
|
||||
const a = () => {
|
||||
if (props.data.length > 0) {
|
||||
flzyList.value = props.data;
|
||||
} else {
|
||||
flzyList.value = [
|
||||
{
|
||||
bbjg: "",
|
||||
bz: "",
|
||||
fltk: "",
|
||||
syfw: "",
|
||||
title: "",
|
||||
type: ""
|
||||
}
|
||||
];
|
||||
}
|
||||
};
|
||||
a()
|
||||
const addflzy = () => {
|
||||
flzyList.value.push({
|
||||
bbjg: "",
|
||||
bz: "",
|
||||
fltk: "",
|
||||
syfw: "",
|
||||
title: "",
|
||||
type: ""
|
||||
});
|
||||
};
|
||||
const rovem = (val) => {
|
||||
const index = flzyList.value.indexOf(val);
|
||||
if (index !== -1) {
|
||||
flzyList.value.splice(index, 1);
|
||||
}
|
||||
};
|
||||
const closed = () => {
|
||||
// flzyList.value = [{
|
||||
// bbjg: "",
|
||||
// bz: "",
|
||||
// fltk: "",
|
||||
// syfw: "",
|
||||
// title: "",
|
||||
// type: ""
|
||||
// }];
|
||||
emits("update:modelValue", false);
|
||||
};
|
||||
|
||||
watch(
|
||||
() => props.data,
|
||||
(val) => {
|
||||
console.log(val);
|
||||
if (val.length > 0) {
|
||||
flzyList.value = val;
|
||||
}else{
|
||||
flzyList.value = [
|
||||
{
|
||||
bbjg: "",
|
||||
bz: "",
|
||||
fltk: "",
|
||||
syfw: "",
|
||||
title: "",
|
||||
type: ""
|
||||
}
|
||||
];
|
||||
}
|
||||
},
|
||||
{ deep: true, immediate: true }
|
||||
);
|
||||
const onComfirm = () => {
|
||||
emits("choosedJcz", flzyList.value);
|
||||
closed();
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import "@/assets/css/layout.scss";
|
||||
@import "@/assets/css/element-plus.scss";
|
||||
::v-deep .el-form--inline {
|
||||
padding-left: 0 !important;
|
||||
}
|
||||
::v-deep .el-radio__label {
|
||||
display: none;
|
||||
}
|
||||
|
||||
::v-deep .el-table__body tr.current-row > td.el-table__cell {
|
||||
background: #106fdc;
|
||||
}
|
||||
.hedie {
|
||||
padding: 0 30px;
|
||||
height: 600px;
|
||||
overflow: auto;
|
||||
}
|
||||
.box {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.item {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width: 50%;
|
||||
|
||||
.input {
|
||||
width: 90%;
|
||||
}
|
||||
.but {
|
||||
margin-left: 20px;
|
||||
}
|
||||
}
|
||||
</style>
|
337
src/components/DanLoding/jczLoad.vue
Normal file
337
src/components/DanLoding/jczLoad.vue
Normal file
@ -0,0 +1,337 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:title="titleValue"
|
||||
width="1400px"
|
||||
v-model="modelValue"
|
||||
@close="closed"
|
||||
>
|
||||
<div v-if="modelValue">
|
||||
<el-form :model="listQuery" class="mosty-from-wrap" :inline="true">
|
||||
<el-form-item label="所属部门">
|
||||
<MOSTY.Department
|
||||
width="100%"
|
||||
clearable
|
||||
v-model="listQuery.ssbmdm"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="检查站名称">
|
||||
<el-input
|
||||
v-model="listQuery.jczmc"
|
||||
placeholder="请输入检查站名称"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item>
|
||||
<el-button type="success" @click="handleFilter">查询</el-button>
|
||||
<el-button type="success" @click="reset()"> 重置 </el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div class="tabBox" style="margin-top: 0px" v-if="modelValue">
|
||||
<el-table
|
||||
ref="multipleUserRef"
|
||||
@selection-change="handleSelectionChange"
|
||||
:data="tableData"
|
||||
:highlight-current-row="props.Single"
|
||||
border
|
||||
v-loading="loading"
|
||||
style="width: 100%"
|
||||
:row-key="keyid"
|
||||
height="450"
|
||||
>
|
||||
<el-table-column
|
||||
type="selection"
|
||||
width="55"
|
||||
:reserve-selection="true"
|
||||
v-if="!props.Single"
|
||||
/>
|
||||
<el-table-column width="55" #default="{ row }" v-else>
|
||||
<el-radio v-model="ridioIndex" :label="row.id"></el-radio>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="序号"
|
||||
type="index"
|
||||
align="center"
|
||||
sortable
|
||||
width="80"
|
||||
/>
|
||||
<el-table-column
|
||||
sortable
|
||||
prop="ssbm"
|
||||
label="所属部门"
|
||||
show-overflow-tooltip
|
||||
align="center"
|
||||
></el-table-column>
|
||||
<el-table-column
|
||||
sortable
|
||||
prop="jczmc"
|
||||
show-overflow-tooltip
|
||||
align="center"
|
||||
label="检查站名称"
|
||||
>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
show-overflow-tooltip
|
||||
align="center"
|
||||
label="检查站类型"
|
||||
prop="jczlx"
|
||||
>
|
||||
<template #default="{ row }">
|
||||
<dict-tag
|
||||
:options="D_BZ_JCZLX"
|
||||
:value="row.jczlx"
|
||||
:tag="false"
|
||||
/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="xxdz"
|
||||
show-overflow-tooltip
|
||||
align="center"
|
||||
label="检查站地址"
|
||||
>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
sortable
|
||||
prop="jd"
|
||||
show-overflow-tooltip
|
||||
label="经度"
|
||||
align="center"
|
||||
>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
sortable
|
||||
prop="wd"
|
||||
show-overflow-tooltip
|
||||
label="纬度"
|
||||
align="center"
|
||||
>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="fenye" >
|
||||
<el-pagination
|
||||
class="pagination"
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="handleCurrentChange"
|
||||
:current-page="listQuery.pageCurrent"
|
||||
:page-sizes="[2, 5, 10, 20]"
|
||||
:page-size="listQuery.pageSize"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="total"
|
||||
></el-pagination>
|
||||
</div>
|
||||
</div>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button @click="closed">取消</el-button>
|
||||
<el-button type="primary" @click="onComfirm">确认</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import * as rule from "@/utils/rules.js";
|
||||
import * as MOSTY from "@/components/MyComponents/index";
|
||||
import { ElMessage } from "element-plus";
|
||||
import { JczSelectJczList } from "@/api/lzjcz/index.js";
|
||||
import {
|
||||
defineProps,
|
||||
watch,
|
||||
ref,
|
||||
onMounted,
|
||||
nextTick,
|
||||
getCurrentInstance
|
||||
} from "vue";
|
||||
const { proxy } = getCurrentInstance();
|
||||
const { D_BZ_JCZLX } = proxy.$dict("D_BZ_JCZLX");
|
||||
const props = defineProps({
|
||||
//是否显示
|
||||
modelValue: {
|
||||
type: Boolean,
|
||||
required: true
|
||||
},
|
||||
//标题
|
||||
titleValue: {
|
||||
type: String,
|
||||
default: "选择检查站"
|
||||
},
|
||||
//是否单选
|
||||
Single: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
//已经选中得数据回显
|
||||
data: {
|
||||
type: Array,
|
||||
default: []
|
||||
}
|
||||
});
|
||||
const keyid = (row) => {
|
||||
return row.id;
|
||||
};
|
||||
const ridioIndex = ref(null);
|
||||
const total = ref(0);
|
||||
const listQuery = ref({
|
||||
pageCurrent: 1,
|
||||
pageSize: 20,
|
||||
jczmc: "",
|
||||
ssbmdm: ""
|
||||
});
|
||||
const form = ref({});
|
||||
const tableData = ref([]);
|
||||
const loading = ref(false)
|
||||
const emits = defineEmits(["update:modelValue", "choosedJcz"]);
|
||||
const closed = () => {
|
||||
listQuery.value.jczmc = "";
|
||||
emits("update:modelValue", false);
|
||||
};
|
||||
const reset = () => {
|
||||
listQuery.value = {
|
||||
pageCurrent: 1,
|
||||
pageSize: 20,
|
||||
jczmc: "",
|
||||
ssbmdm: ""
|
||||
};
|
||||
getListData();
|
||||
};
|
||||
// 判断传进来的选中数据和加载的选中数据不满足的数据
|
||||
const checkopenList = ref([]);
|
||||
|
||||
// 确定选中
|
||||
const onComfirm = () => {
|
||||
//单选
|
||||
if (props.Single) {
|
||||
if (![ridioIndex.value][0]) {
|
||||
proxy.$message.warning("请选择检查站");
|
||||
return;
|
||||
}
|
||||
const info = tableData.value.find((item) => {
|
||||
return item.id === ridioIndex.value;
|
||||
});
|
||||
emits("choosedJcz", [JSON.parse(JSON.stringify(info))]);
|
||||
} else {
|
||||
//多选
|
||||
const jczList = JSON.parse(JSON.stringify(multipleSelectionUser.value));
|
||||
if (jczList.length === 0) {
|
||||
proxy.$message.warning("请选择检查站");
|
||||
return;
|
||||
}
|
||||
emits("choosedJcz", [...jczList, ...checkopenList.value]);
|
||||
}
|
||||
closed();
|
||||
};
|
||||
onMounted(() => {
|
||||
getListData();
|
||||
});
|
||||
/**
|
||||
* pageSize 改变触发
|
||||
*/
|
||||
const handleSizeChange = (currentSize) => {
|
||||
listQuery.value.pageSize = currentSize;
|
||||
getListData();
|
||||
};
|
||||
|
||||
/**
|
||||
* 页码改变触发
|
||||
*/
|
||||
const handleCurrentChange = (currentPage) => {
|
||||
listQuery.value.pageCurrent = currentPage;
|
||||
getListData();
|
||||
};
|
||||
//检查站数据
|
||||
const getListData = async () => {
|
||||
loading.value = true
|
||||
JczSelectJczList(listQuery.value).then((res) => {
|
||||
tableData.value = res?.records;
|
||||
loading.value = false
|
||||
multipleUser(props.data, tableData.value);
|
||||
total.value = Number(res.total);
|
||||
}).catch(()=>{ loading.value = false });
|
||||
};
|
||||
const handleFilter = () => {
|
||||
listQuery.value.pageCurrent = 1;
|
||||
getListData();
|
||||
};
|
||||
|
||||
const multipleUserRef = ref(null);
|
||||
const multipleSelectionUser = ref([]);
|
||||
const handleSelectionChange = (val) => {
|
||||
multipleSelectionUser.value = val;
|
||||
if (checkopenList.value) {
|
||||
for (let i = 0; i < multipleSelectionUser.value.length; i++) {
|
||||
const l = multipleSelectionUser.value[i];
|
||||
for (let j = 0; j < checkopenList.value.length; j++) {
|
||||
const z = checkopenList.value[j];
|
||||
if (l.id == z.id) {
|
||||
checkopenList.value.splice(j, 1);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
//回显--用于多选表格
|
||||
function multipleUser(row, list) {
|
||||
if (row) {
|
||||
if (props.Single) {
|
||||
row.forEach((item) => {
|
||||
list.forEach((select) => {
|
||||
if (typeof item == "object") {
|
||||
if (item.id == select.id) {
|
||||
ridioIndex.value = item.id;
|
||||
}
|
||||
} else {
|
||||
if (item == select.id) {
|
||||
ridioIndex.value = item;
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
} else {
|
||||
row.forEach((item) => {
|
||||
list.forEach((select) => {
|
||||
if (item.id == select.id) {
|
||||
if (multipleUserRef.value) {
|
||||
multipleUserRef.value.toggleRowSelection(select, true);
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
watch(
|
||||
() => props.modelValue,
|
||||
(val) => {
|
||||
if (val === true) {
|
||||
ridioIndex.value = "";
|
||||
handleFilter();
|
||||
}
|
||||
}
|
||||
);
|
||||
watch(
|
||||
() => props.data,
|
||||
(val) => {
|
||||
if (multipleUserRef.value) multipleUser(val, tableData.value);
|
||||
checkopenList.value = JSON.parse(JSON.stringify(val));
|
||||
}
|
||||
);
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import "@/assets/css/layout.scss";
|
||||
@import "@/assets/css/element-plus.scss";
|
||||
::v-deep .el-form--inline {
|
||||
padding-left: 0 !important;
|
||||
}
|
||||
::v-deep .el-radio__label {
|
||||
display: none;
|
||||
}
|
||||
|
||||
::v-deep .el-table__body tr.current-row > td.el-table__cell {
|
||||
background: #106fdc;
|
||||
}
|
||||
</style>
|
337
src/components/DanLoding/jwzLoad.vue
Normal file
337
src/components/DanLoding/jwzLoad.vue
Normal file
@ -0,0 +1,337 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:title="titleValue"
|
||||
width="1400px"
|
||||
v-model="modelValue"
|
||||
@close="closed"
|
||||
>
|
||||
<div v-if="modelValue">
|
||||
<el-form :model="listQuery" class="mosty-from-wrap" :inline="true">
|
||||
<el-form-item label="所属部门">
|
||||
<MOSTY.Department
|
||||
width="100%"
|
||||
clearable
|
||||
v-model="listQuery.ssbmdm"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="警务站名称">
|
||||
<el-input
|
||||
v-model="listQuery.jwzMc"
|
||||
placeholder="请输入警务站名称"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item>
|
||||
<el-button type="success" @click="handleFilter">查询</el-button>
|
||||
<el-button type="success" @click="reset()"> 重置 </el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div class="tabBox" style="margin-top: 0px" v-if="modelValue">
|
||||
<el-table
|
||||
ref="multipleUserRef"
|
||||
@selection-change="handleSelectionChange"
|
||||
:data="tableData"
|
||||
:highlight-current-row="props.Single"
|
||||
border
|
||||
v-loading="loading"
|
||||
style="width: 100%"
|
||||
:row-key="keyid"
|
||||
height="450"
|
||||
>
|
||||
<el-table-column
|
||||
type="selection"
|
||||
width="55"
|
||||
:reserve-selection="true"
|
||||
v-if="!props.Single"
|
||||
/>
|
||||
<el-table-column width="55" #default="{ row }" v-else>
|
||||
<el-radio v-model="ridioIndex" :label="row.id"></el-radio>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="序号"
|
||||
type="index"
|
||||
align="center"
|
||||
sortable
|
||||
width="80"
|
||||
/>
|
||||
<el-table-column
|
||||
sortable
|
||||
prop="ssbm"
|
||||
label="所属部门"
|
||||
show-overflow-tooltip
|
||||
align="center"
|
||||
></el-table-column>
|
||||
<el-table-column
|
||||
sortable
|
||||
prop="jwzMc"
|
||||
show-overflow-tooltip
|
||||
align="center"
|
||||
label="警务站名称"
|
||||
>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
show-overflow-tooltip
|
||||
align="center"
|
||||
label="警务站类型"
|
||||
prop="jwzLx"
|
||||
>
|
||||
<template #default="{ row }">
|
||||
<dict-tag
|
||||
:options="D_BZ_JWZLX"
|
||||
:value="row.jwzLx"
|
||||
:tag="false"
|
||||
/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="fzrXm"
|
||||
show-overflow-tooltip
|
||||
align="center"
|
||||
label="负责人"
|
||||
>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
sortable
|
||||
prop="jd"
|
||||
show-overflow-tooltip
|
||||
label="经度"
|
||||
align="center"
|
||||
>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
sortable
|
||||
prop="wd"
|
||||
show-overflow-tooltip
|
||||
label="纬度"
|
||||
align="center"
|
||||
>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="fenye" >
|
||||
<el-pagination
|
||||
class="pagination"
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="handleCurrentChange"
|
||||
:current-page="listQuery.pageCurrent"
|
||||
:page-sizes="[2, 5, 10, 20]"
|
||||
:page-size="listQuery.pageSize"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="total"
|
||||
></el-pagination>
|
||||
</div>
|
||||
</div>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button @click="closed">取消</el-button>
|
||||
<el-button type="primary" @click="onComfirm">确认</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import * as rule from "@/utils/rules.js";
|
||||
import * as MOSTY from "@/components/MyComponents/index";
|
||||
import { ElMessage } from "element-plus";
|
||||
import { JwzselectJwzList } from "@/api/lzjmxf/index.js";
|
||||
import {
|
||||
defineProps,
|
||||
watch,
|
||||
ref,
|
||||
onMounted,
|
||||
nextTick,
|
||||
getCurrentInstance
|
||||
} from "vue";
|
||||
const { proxy } = getCurrentInstance();
|
||||
const { D_BZ_JWZLX } = proxy.$dict("D_BZ_JWZLX");
|
||||
const props = defineProps({
|
||||
//是否显示
|
||||
modelValue: {
|
||||
type: Boolean,
|
||||
required: true
|
||||
},
|
||||
//标题
|
||||
titleValue: {
|
||||
type: String,
|
||||
default: "选择警务站"
|
||||
},
|
||||
//是否单选
|
||||
Single: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
//已经选中得数据回显
|
||||
data: {
|
||||
type: Array,
|
||||
default: []
|
||||
}
|
||||
});
|
||||
const keyid = (row) => {
|
||||
return row.id;
|
||||
};
|
||||
const ridioIndex = ref(null);
|
||||
const total = ref(0);
|
||||
const listQuery = ref({
|
||||
pageCurrent: 1,
|
||||
pageSize: 20,
|
||||
jwzMc: "",
|
||||
ssbmdm: ""
|
||||
});
|
||||
const form = ref({});
|
||||
const tableData = ref([]);
|
||||
const loading = ref(false)
|
||||
const emits = defineEmits(["update:modelValue", "choosedJcz"]);
|
||||
const closed = () => {
|
||||
listQuery.value.jwzMc = "";
|
||||
emits("update:modelValue", false);
|
||||
};
|
||||
const reset = () => {
|
||||
listQuery.value = {
|
||||
pageCurrent: 1,
|
||||
pageSize: 20,
|
||||
jwzMc: "",
|
||||
ssbmdm: ""
|
||||
};
|
||||
getListData();
|
||||
};
|
||||
// 判断传进来的选中数据和加载的选中数据不满足的数据
|
||||
const checkopenList = ref([]);
|
||||
|
||||
// 确定选中
|
||||
const onComfirm = () => {
|
||||
//单选
|
||||
if (props.Single) {
|
||||
if (![ridioIndex.value][0]) {
|
||||
proxy.$message.warning("请选择检查站");
|
||||
return;
|
||||
}
|
||||
const info = tableData.value.find((item) => {
|
||||
return item.id === ridioIndex.value;
|
||||
});
|
||||
emits("choosedJcz", [JSON.parse(JSON.stringify(info))]);
|
||||
} else {
|
||||
//多选
|
||||
const jczList = JSON.parse(JSON.stringify(multipleSelectionUser.value));
|
||||
if (jczList.length === 0) {
|
||||
proxy.$message.warning("请选择检查站");
|
||||
return;
|
||||
}
|
||||
emits("choosedJcz", [...jczList, ...checkopenList.value]);
|
||||
}
|
||||
closed();
|
||||
};
|
||||
onMounted(() => {
|
||||
getListData();
|
||||
});
|
||||
/**
|
||||
* pageSize 改变触发
|
||||
*/
|
||||
const handleSizeChange = (currentSize) => {
|
||||
listQuery.value.pageSize = currentSize;
|
||||
getListData();
|
||||
};
|
||||
|
||||
/**
|
||||
* 页码改变触发
|
||||
*/
|
||||
const handleCurrentChange = (currentPage) => {
|
||||
listQuery.value.pageCurrent = currentPage;
|
||||
getListData();
|
||||
};
|
||||
//检查站数据
|
||||
const getListData = async () => {
|
||||
loading.value = true
|
||||
JwzselectJwzList(listQuery.value).then((res) => {
|
||||
tableData.value = res?.records;
|
||||
loading.value = false
|
||||
multipleUser(props.data, tableData.value);
|
||||
total.value = Number(res.total);
|
||||
}).catch(()=>{ loading.value = false });
|
||||
};
|
||||
const handleFilter = () => {
|
||||
listQuery.value.pageCurrent = 1;
|
||||
getListData();
|
||||
};
|
||||
|
||||
const multipleUserRef = ref(null);
|
||||
const multipleSelectionUser = ref([]);
|
||||
const handleSelectionChange = (val) => {
|
||||
multipleSelectionUser.value = val;
|
||||
if (checkopenList.value) {
|
||||
for (let i = 0; i < multipleSelectionUser.value.length; i++) {
|
||||
const l = multipleSelectionUser.value[i];
|
||||
for (let j = 0; j < checkopenList.value.length; j++) {
|
||||
const z = checkopenList.value[j];
|
||||
if (l.id == z.id) {
|
||||
checkopenList.value.splice(j, 1);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
//回显--用于多选表格
|
||||
function multipleUser(row, list) {
|
||||
if (row) {
|
||||
if (props.Single) {
|
||||
row.forEach((item) => {
|
||||
list.forEach((select) => {
|
||||
if (typeof item == "object") {
|
||||
if (item.id == select.id) {
|
||||
ridioIndex.value = item.id;
|
||||
}
|
||||
} else {
|
||||
if (item == select.id) {
|
||||
ridioIndex.value = item;
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
} else {
|
||||
row.forEach((item) => {
|
||||
list.forEach((select) => {
|
||||
if (item.id == select.id) {
|
||||
if (multipleUserRef.value) {
|
||||
multipleUserRef.value.toggleRowSelection(select, true);
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
watch(
|
||||
() => props.modelValue,
|
||||
(val) => {
|
||||
if (val === true) {
|
||||
ridioIndex.value = "";
|
||||
handleFilter();
|
||||
}
|
||||
}
|
||||
);
|
||||
watch(
|
||||
() => props.data,
|
||||
(val) => {
|
||||
if (multipleUserRef.value) multipleUser(val, tableData.value);
|
||||
checkopenList.value = JSON.parse(JSON.stringify(val));
|
||||
}
|
||||
);
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import "@/assets/css/layout.scss";
|
||||
@import "@/assets/css/element-plus.scss";
|
||||
::v-deep .el-form--inline {
|
||||
padding-left: 0 !important;
|
||||
}
|
||||
::v-deep .el-radio__label {
|
||||
display: none;
|
||||
}
|
||||
|
||||
::v-deep .el-table__body tr.current-row > td.el-table__cell {
|
||||
background: #106fdc;
|
||||
}
|
||||
</style>
|
347
src/components/DanLoding/zykLoad.vue
Normal file
347
src/components/DanLoding/zykLoad.vue
Normal file
@ -0,0 +1,347 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:title="titleValue"
|
||||
width="1400px"
|
||||
v-model="modelValue"
|
||||
@close="closed"
|
||||
>
|
||||
<div v-if="modelValue">
|
||||
<el-form :model="listQuery" class="mosty-from-wrap" :inline="true">
|
||||
<el-form-item label="所属部门">
|
||||
<MOSTY.Department
|
||||
width="100%"
|
||||
clearable
|
||||
v-model="listQuery.ssbmdm"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="检务站名称">
|
||||
<el-input
|
||||
v-model="listQuery.jwzMc"
|
||||
placeholder="请输入检务站名称"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item>
|
||||
<el-button type="success" @click="handleFilter">查询</el-button>
|
||||
<el-button type="success" @click="reset()"> 重置 </el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div class="tabBox" style="margin-top: 0px" v-if="modelValue">
|
||||
<el-table
|
||||
ref="multipleUserRef"
|
||||
@selection-change="handleSelectionChange"
|
||||
:data="tableData"
|
||||
:highlight-current-row="props.Single"
|
||||
border
|
||||
v-loading="loading"
|
||||
style="width: 100%"
|
||||
:row-key="keyid"
|
||||
height="450"
|
||||
>
|
||||
<el-table-column
|
||||
type="selection"
|
||||
width="55"
|
||||
:reserve-selection="true"
|
||||
v-if="!props.Single"
|
||||
/>
|
||||
<el-table-column width="55" #default="{ row }" v-else>
|
||||
<el-radio v-model="ridioIndex" :label="row.id"></el-radio>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="序号"
|
||||
type="index"
|
||||
align="center"
|
||||
sortable
|
||||
width="80"
|
||||
/>
|
||||
<el-table-column
|
||||
sortable
|
||||
prop="ssbm"
|
||||
label="所属部门"
|
||||
show-overflow-tooltip
|
||||
align="center"
|
||||
></el-table-column>
|
||||
<el-table-column
|
||||
sortable
|
||||
prop="zymc"
|
||||
show-overflow-tooltip
|
||||
label="资源名称"
|
||||
align="center"
|
||||
>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
sortable
|
||||
prop="zysl"
|
||||
show-overflow-tooltip
|
||||
label="资源数量"
|
||||
align="center"
|
||||
>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
sortable
|
||||
prop="zywz"
|
||||
show-overflow-tooltip
|
||||
label="资源位置"
|
||||
align="center"
|
||||
>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
sortable
|
||||
prop="sccs"
|
||||
show-overflow-tooltip
|
||||
align="center"
|
||||
label="生产厂商"
|
||||
>
|
||||
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="xtCjr"
|
||||
show-overflow-tooltip
|
||||
align="center"
|
||||
label="创建人名称"
|
||||
>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
sortable
|
||||
prop="gqrq"
|
||||
show-overflow-tooltip
|
||||
label=" 过期日期"
|
||||
align="center"
|
||||
>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
show-overflow-tooltip
|
||||
align="center"
|
||||
label="生产日期"
|
||||
prop="scrq"
|
||||
/>
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="fenye" >
|
||||
<el-pagination
|
||||
class="pagination"
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="handleCurrentChange"
|
||||
:current-page="listQuery.pageCurrent"
|
||||
:page-sizes="[2, 5, 10, 20]"
|
||||
:page-size="listQuery.pageSize"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="total"
|
||||
></el-pagination>
|
||||
</div>
|
||||
</div>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button @click="closed">取消</el-button>
|
||||
<el-button type="primary" @click="onComfirm">确认</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import * as rule from "@/utils/rules.js";
|
||||
import * as MOSTY from "@/components/MyComponents/index";
|
||||
import { ElMessage } from "element-plus";
|
||||
import { zyselectPage} from "@/api/file.js";
|
||||
import {
|
||||
defineProps,
|
||||
watch,
|
||||
ref,
|
||||
onMounted,
|
||||
nextTick,
|
||||
getCurrentInstance
|
||||
} from "vue";
|
||||
const { proxy } = getCurrentInstance();
|
||||
const { D_BZ_JWZLX } = proxy.$dict("D_BZ_JWZLX");
|
||||
const props = defineProps({
|
||||
//是否显示
|
||||
modelValue: {
|
||||
type: Boolean,
|
||||
required: true
|
||||
},
|
||||
//标题
|
||||
titleValue: {
|
||||
type: String,
|
||||
default: "选择资源"
|
||||
},
|
||||
//是否单选
|
||||
Single: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
//已经选中得数据回显
|
||||
data: {
|
||||
type: Array,
|
||||
default: []
|
||||
}
|
||||
});
|
||||
const keyid = (row) => {
|
||||
return row.id;
|
||||
};
|
||||
const ridioIndex = ref(null);
|
||||
const total = ref(0);
|
||||
const listQuery = ref({
|
||||
pageCurrent: 1,
|
||||
pageSize: 20,
|
||||
jwzMc: "",
|
||||
ssbmdm: ""
|
||||
});
|
||||
const form = ref({});
|
||||
const tableData = ref([]);
|
||||
const loading = ref(false)
|
||||
const emits = defineEmits(["update:modelValue", "choosedJcz"]);
|
||||
const closed = () => {
|
||||
listQuery.value.jwzMc = "";
|
||||
emits("update:modelValue", false);
|
||||
};
|
||||
const reset = () => {
|
||||
listQuery.value = {
|
||||
pageCurrent: 1,
|
||||
pageSize: 20,
|
||||
jwzMc: "",
|
||||
ssbmdm: ""
|
||||
};
|
||||
getListData();
|
||||
};
|
||||
// 判断传进来的选中数据和加载的选中数据不满足的数据
|
||||
const checkopenList = ref([]);
|
||||
|
||||
// 确定选中
|
||||
const onComfirm = () => {
|
||||
//单选
|
||||
if (props.Single) {
|
||||
if (![ridioIndex.value][0]) {
|
||||
proxy.$message.warning("请选择资源");
|
||||
return;
|
||||
}
|
||||
const info = tableData.value.find((item) => {
|
||||
return item.id === ridioIndex.value;
|
||||
});
|
||||
emits("choosedJcz", [JSON.parse(JSON.stringify(info))]);
|
||||
} else {
|
||||
//多选
|
||||
const jczList = JSON.parse(JSON.stringify(multipleSelectionUser.value));
|
||||
if (jczList.length === 0) {
|
||||
proxy.$message.warning("请选择资源");
|
||||
return;
|
||||
}
|
||||
emits("choosedJcz", [...jczList, ...checkopenList.value]);
|
||||
}
|
||||
closed();
|
||||
};
|
||||
onMounted(() => {
|
||||
getListData();
|
||||
});
|
||||
/**
|
||||
* pageSize 改变触发
|
||||
*/
|
||||
const handleSizeChange = (currentSize) => {
|
||||
listQuery.value.pageSize = currentSize;
|
||||
getListData();
|
||||
};
|
||||
|
||||
/**
|
||||
* 页码改变触发
|
||||
*/
|
||||
const handleCurrentChange = (currentPage) => {
|
||||
listQuery.value.pageCurrent = currentPage;
|
||||
getListData();
|
||||
};
|
||||
//资源数据
|
||||
const getListData = async () => {
|
||||
loading.value = true
|
||||
zyselectPage(listQuery.value).then((res) => {
|
||||
tableData.value = res?.records;
|
||||
loading.value = false
|
||||
multipleUser(props.data, tableData.value);
|
||||
total.value = Number(res.total);
|
||||
}).catch(()=>{ loading.value = false });
|
||||
};
|
||||
const handleFilter = () => {
|
||||
listQuery.value.pageCurrent = 1;
|
||||
getListData();
|
||||
};
|
||||
|
||||
const multipleUserRef = ref(null);
|
||||
const multipleSelectionUser = ref([]);
|
||||
const handleSelectionChange = (val) => {
|
||||
multipleSelectionUser.value = val;
|
||||
if (checkopenList.value) {
|
||||
for (let i = 0; i < multipleSelectionUser.value.length; i++) {
|
||||
const l = multipleSelectionUser.value[i];
|
||||
for (let j = 0; j < checkopenList.value.length; j++) {
|
||||
const z = checkopenList.value[j];
|
||||
if (l.id == z.id) {
|
||||
checkopenList.value.splice(j, 1);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
//回显--用于多选表格
|
||||
function multipleUser(row, list) {
|
||||
if (row) {
|
||||
if (props.Single) {
|
||||
row.forEach((item) => {
|
||||
list.forEach((select) => {
|
||||
if (typeof item == "object") {
|
||||
if (item.id == select.id) {
|
||||
ridioIndex.value = item.id;
|
||||
}
|
||||
} else {
|
||||
if (item == select.id) {
|
||||
ridioIndex.value = item;
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
} else {
|
||||
row.forEach((item) => {
|
||||
list.forEach((select) => {
|
||||
if (item.id == select.id) {
|
||||
if (multipleUserRef.value) {
|
||||
multipleUserRef.value.toggleRowSelection(select, true);
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
watch(
|
||||
() => props.modelValue,
|
||||
(val) => {
|
||||
if (val === true) {
|
||||
ridioIndex.value = "";
|
||||
handleFilter();
|
||||
}
|
||||
}
|
||||
);
|
||||
watch(
|
||||
() => props.data,
|
||||
(val) => {
|
||||
if (multipleUserRef.value) multipleUser(val, tableData.value);
|
||||
checkopenList.value = JSON.parse(JSON.stringify(val));
|
||||
}
|
||||
);
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import "@/assets/css/layout.scss";
|
||||
@import "@/assets/css/element-plus.scss";
|
||||
::v-deep .el-form--inline {
|
||||
padding-left: 0 !important;
|
||||
}
|
||||
::v-deep .el-radio__label {
|
||||
display: none;
|
||||
}
|
||||
|
||||
::v-deep .el-table__body tr.current-row > td.el-table__cell {
|
||||
background: #106fdc;
|
||||
}
|
||||
</style>
|
Reference in New Issue
Block a user