过检
This commit is contained in:
给我
@ -6,6 +6,7 @@
|
|||||||
:data="tableData"
|
:data="tableData"
|
||||||
@selection-change="handleSelectionChange"
|
@selection-change="handleSelectionChange"
|
||||||
@row-click="singleElection"
|
@row-click="singleElection"
|
||||||
|
@cell-click="cellClick"
|
||||||
:row-key="getConfiger.rowKey"
|
:row-key="getConfiger.rowKey"
|
||||||
:border="getConfiger.border"
|
:border="getConfiger.border"
|
||||||
:default-expand-all="getConfiger.defaultExpandAll"
|
:default-expand-all="getConfiger.defaultExpandAll"
|
||||||
@ -123,7 +124,7 @@ const props = defineProps({
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
// 可选的时候选择的数据
|
// 可选的时候选择的数据
|
||||||
const emit = defineEmits(["chooseData"]);
|
const emit = defineEmits(["chooseData","columnInfo"]);
|
||||||
const multipleTableRef = ref();
|
const multipleTableRef = ref();
|
||||||
let getConfiger = reactive({
|
let getConfiger = reactive({
|
||||||
showSelectType: null, // 显示多选还是单选还是没有选择 checkBox/radio/null
|
showSelectType: null, // 显示多选还是单选还是没有选择 checkBox/radio/null
|
||||||
@ -164,6 +165,9 @@ const singleElection = (val) => {
|
|||||||
emit("chooseData", [val]);
|
emit("chooseData", [val]);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
const cellClick = (row, column) => {
|
||||||
|
emit("columnInfo", {row,column});
|
||||||
|
};
|
||||||
// 懒加载数据的方法
|
// 懒加载数据的方法
|
||||||
const load = (date, treeNode, resolve) => {
|
const load = (date, treeNode, resolve) => {
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
|
|||||||
@ -1,26 +1,13 @@
|
|||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<el-dialog
|
<el-dialog :title="titleValue" width="1400px" v-model="modelValue" @close="closed">
|
||||||
:title="titleValue"
|
|
||||||
width="1400px"
|
|
||||||
v-model="modelValue"
|
|
||||||
@close="closed"
|
|
||||||
>
|
|
||||||
<div v-if="modelValue">
|
<div v-if="modelValue">
|
||||||
<el-form :model="listQuery" class="mosty-from-wrap" :inline="true">
|
<el-form :model="listQuery" class="mosty-from-wrap" :inline="true">
|
||||||
<el-form-item label="所属部门">
|
<el-form-item label="所属部门">
|
||||||
<MOSTY.Department
|
<MOSTY.Department width="100%" clearable v-model="listQuery.ssbmdm" />
|
||||||
width="100%"
|
|
||||||
clearable
|
|
||||||
v-model="listQuery.ssbmdm"
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="环林卡口名称">
|
<el-form-item label="环林卡口名称">
|
||||||
<el-input
|
<el-input v-model="listQuery.jczmc" placeholder="请输入环林卡口名称" clearable />
|
||||||
v-model="listQuery.jczmc"
|
|
||||||
placeholder="请输入环林卡口名称"
|
|
||||||
clearable
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
|
|
||||||
<el-form-item>
|
<el-form-item>
|
||||||
@ -29,98 +16,34 @@
|
|||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
<div class="tabBox" style="margin-top: 0px" v-if="modelValue">
|
<div class="tabBox" style="margin-top: 0px" v-if="modelValue">
|
||||||
<el-table
|
<el-table ref="multipleUserRef" @selection-change="handleSelectionChange" :data="tableData"
|
||||||
ref="multipleUserRef"
|
:highlight-current-row="props.Single" border v-loading="loading" style="width: 100%" :row-key="keyid"
|
||||||
@selection-change="handleSelectionChange"
|
height="450">
|
||||||
:data="tableData"
|
<el-table-column type="selection" width="55" :reserve-selection="true" v-if="!props.Single" />
|
||||||
: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-table-column width="55" #default="{ row }" v-else>
|
||||||
<el-radio v-model="ridioIndex" :label="row.id"></el-radio>
|
<el-radio v-model="ridioIndex" :label="row.id"></el-radio>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column
|
<el-table-column label="序号" type="index" align="center" sortable width="80" />
|
||||||
label="序号"
|
<el-table-column sortable prop="ssbm" label="所属部门" show-overflow-tooltip align="center"></el-table-column>
|
||||||
type="index"
|
<el-table-column sortable prop="jczmc" show-overflow-tooltip align="center" label="环林卡口名称">
|
||||||
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>
|
||||||
<el-table-column
|
<el-table-column show-overflow-tooltip align="center" label="环林卡口类型" prop="jczlx">
|
||||||
show-overflow-tooltip
|
|
||||||
align="center"
|
|
||||||
label="环林卡口类型"
|
|
||||||
prop="jczlx"
|
|
||||||
>
|
|
||||||
<template #default="{ row }">
|
<template #default="{ row }">
|
||||||
<dict-tag
|
<dict-tag :options="D_BZ_JCZLX" :value="row.jczlx" :tag="false" />
|
||||||
:options="D_BZ_JCZLX"
|
|
||||||
:value="row.jczlx"
|
|
||||||
:tag="false"
|
|
||||||
/>
|
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column
|
<el-table-column prop="xxdz" show-overflow-tooltip align="center" label="环林卡口地址">
|
||||||
prop="xxdz"
|
|
||||||
show-overflow-tooltip
|
|
||||||
align="center"
|
|
||||||
label="环林卡口地址"
|
|
||||||
>
|
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column
|
<el-table-column sortable prop="jd" show-overflow-tooltip label="经度" align="center">
|
||||||
sortable
|
|
||||||
prop="jd"
|
|
||||||
show-overflow-tooltip
|
|
||||||
label="经度"
|
|
||||||
align="center"
|
|
||||||
>
|
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column
|
<el-table-column sortable prop="wd" show-overflow-tooltip label="纬度" align="center">
|
||||||
sortable
|
|
||||||
prop="wd"
|
|
||||||
show-overflow-tooltip
|
|
||||||
label="纬度"
|
|
||||||
align="center"
|
|
||||||
>
|
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
</el-table>
|
</el-table>
|
||||||
</div>
|
</div>
|
||||||
<div class="fenye">
|
<div class="fenye">
|
||||||
<el-pagination
|
<el-pagination class="pagination" @size-change="handleSizeChange" @current-change="handleCurrentChange"
|
||||||
class="pagination"
|
:current-page="listQuery.pageCurrent" :page-sizes="[2, 5, 10, 20]" :page-size="listQuery.pageSize"
|
||||||
@size-change="handleSizeChange"
|
layout="total, sizes, prev, pager, next, jumper" :total="total"></el-pagination>
|
||||||
@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>
|
||||||
</div>
|
</div>
|
||||||
<template #footer>
|
<template #footer>
|
||||||
@ -327,9 +250,11 @@ watch(
|
|||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import "@/assets/css/layout.scss";
|
@import "@/assets/css/layout.scss";
|
||||||
@import "@/assets/css/element-plus.scss";
|
@import "@/assets/css/element-plus.scss";
|
||||||
|
|
||||||
::v-deep .el-form--inline {
|
::v-deep .el-form--inline {
|
||||||
padding-left: 0 !important;
|
padding-left: 0 !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
::v-deep .el-radio__label {
|
::v-deep .el-radio__label {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|||||||
281
src/components/loder/gjclloder.vue
Normal file
281
src/components/loder/gjclloder.vue
Normal file
@ -0,0 +1,281 @@
|
|||||||
|
<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.clztwptzdm" placeholder="请输入环林卡口名称" clearable />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="车后部物品特征代码">
|
||||||
|
<el-input v-model="listQuery.chbwptzdm" placeholder="请输入车后部物品特征代码" clearable />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="车前部物品特征代码">
|
||||||
|
<el-input v-model="listQuery.cqbwptzdm" placeholder="请输入车前部物品特征代码" clearable />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item>
|
||||||
|
<el-button type="success" @click="handleFilter">查询</el-button>
|
||||||
|
<el-button type="info" @click="reset()"> 重置 </el-button>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
<div class="tabBox" 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 && props.chooseShow" />
|
||||||
|
<el-table-column width="55" #default="{ row }" v-if="props.Single && props.chooseShow">
|
||||||
|
<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 show-overflow-tooltip align="center" label="车前盖图" prop="swrltx">
|
||||||
|
<template #default="{ row }">
|
||||||
|
<div class="phone">
|
||||||
|
<el-image v-if="row.cqgt" :src="urlImg + row.cqgt" fit="cover" lazy />
|
||||||
|
<el-image v-else :src="Person" fit="cover" lazy />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column sortable prop="kkMc" show-overflow-tooltip align="center" label="卡口名称"></el-table-column>
|
||||||
|
<el-table-column sortable prop="ssbm" label="所属部门" show-overflow-tooltip align="center"></el-table-column>
|
||||||
|
<el-table-column sortable prop="clztwptzdm" show-overflow-tooltip align="center" label="车辆张贴物品特征代码"></el-table-column>
|
||||||
|
<el-table-column sortable prop="chbwptzdm" show-overflow-tooltip align="center" label="车后部物品特征代码"></el-table-column>
|
||||||
|
<el-table-column sortable prop="zqlx" show-overflow-tooltip align="center" label="车前部物品特征代码"></el-table-column>
|
||||||
|
<el-table-column sortable prop="clychjdm" show-overflow-tooltip align="center" label="车辆异常痕迹代码"></el-table-column>
|
||||||
|
<el-table-column sortable prop="hphm" show-overflow-tooltip align="center" label="机动车号牌号码"></el-table-column>
|
||||||
|
<el-table-column sortable prop="txsj" show-overflow-tooltip align="center" label="通行时间"></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 Person from '@/assets/images/default_male.png'
|
||||||
|
import * as MOSTY from "@/components/MyComponents/index";
|
||||||
|
import { qcckGet, qcckPost } from "@/api/qcckApi.js";
|
||||||
|
import {
|
||||||
|
defineProps,
|
||||||
|
watch,
|
||||||
|
ref,
|
||||||
|
onMounted,
|
||||||
|
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: []
|
||||||
|
},
|
||||||
|
// 是否显示选择框
|
||||||
|
chooseShow:{
|
||||||
|
type: Boolean,
|
||||||
|
default: true
|
||||||
|
},
|
||||||
|
// 搜索条件
|
||||||
|
searchData:{
|
||||||
|
type:Object,
|
||||||
|
default:{}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
const urlImg = "/mosty-api/mosty-base/minio/image/download/";
|
||||||
|
const keyid = (row) => {
|
||||||
|
return row.id;
|
||||||
|
};
|
||||||
|
const ridioIndex = ref(null);
|
||||||
|
const total = ref(0);
|
||||||
|
const listQuery = ref({
|
||||||
|
pageCurrent: 1,
|
||||||
|
pageSize: 20,
|
||||||
|
jczmc: "",
|
||||||
|
ssbmdm: ""
|
||||||
|
});
|
||||||
|
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;
|
||||||
|
qcckGet({...listQuery.value,...props.searchData}, "/mosty-jcz/jczGjcltx/selectPage")
|
||||||
|
.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>
|
||||||
293
src/components/loder/gjrxloder.vue
Normal file
293
src/components/loder/gjrxloder.vue
Normal file
@ -0,0 +1,293 @@
|
|||||||
|
<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.gjryxm" placeholder="请输入过检人员姓名" clearable />
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
<el-form-item>
|
||||||
|
<el-button type="success" @click="handleFilter">查询</el-button>
|
||||||
|
<el-button type="info" @click="reset()"> 重置 </el-button>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
<div class="tabBox" 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 && props.chooseShow" />
|
||||||
|
<el-table-column width="55" #default="{ row }" v-if="props.Single && props.chooseShow">
|
||||||
|
<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="gjryxm" show-overflow-tooltip align="center" label="过检人员姓名" />
|
||||||
|
<el-table-column sortable prop="gjrysfzh" show-overflow-tooltip align="center" label="过检人员身份证号" />
|
||||||
|
<el-table-column sortable prop="kkMc" show-overflow-tooltip align="center" label="卡口名称" />
|
||||||
|
<el-table-column show-overflow-tooltip align="center" label="三维人脸图像" prop="swrltx">
|
||||||
|
<template #default="{ row }">
|
||||||
|
<div class="phone">
|
||||||
|
<el-image v-if="row.swrltx" :src="urlImg + row.swrltx" fit="cover" lazy />
|
||||||
|
<el-image v-else :src="Person" fit="cover" lazy />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column show-overflow-tooltip align="center" label="人脸图" prop="swrltx">
|
||||||
|
<template #default="{ row }">
|
||||||
|
<div class="phone">
|
||||||
|
<el-image v-if="row.rlt" :src="urlImg + row.rlt" fit="cover" lazy />
|
||||||
|
<el-image v-else :src="Person" fit="cover" lazy />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column show-overflow-tooltip align="center" label="人员图" prop="swrltx">
|
||||||
|
<template #default="{ row }">
|
||||||
|
<div class="phone">
|
||||||
|
<el-image v-if="row.ryt" :src="urlImg + row.ryt" fit="cover" lazy />
|
||||||
|
<el-image v-else :src="Person" fit="cover" lazy />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="txsj" show-overflow-tooltip align="center" label="通行时间">
|
||||||
|
</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 Person from '@/assets/images/default_male.png'
|
||||||
|
import * as MOSTY from "@/components/MyComponents/index";
|
||||||
|
import { ElMessage } from "element-plus";
|
||||||
|
import { qcckGet, qcckPost } from "@/api/qcckApi.js";
|
||||||
|
import {
|
||||||
|
defineProps,
|
||||||
|
watch,
|
||||||
|
ref,
|
||||||
|
onMounted,
|
||||||
|
nextTick,
|
||||||
|
getCurrentInstance
|
||||||
|
} from "vue";
|
||||||
|
const { proxy } = getCurrentInstance();
|
||||||
|
const urlImg = "/mosty-api/mosty-base/minio/image/download/";
|
||||||
|
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: []
|
||||||
|
},
|
||||||
|
// 是否显示选择框
|
||||||
|
chooseShow:{
|
||||||
|
type: Boolean,
|
||||||
|
default: true
|
||||||
|
},
|
||||||
|
// 搜索条件
|
||||||
|
searchData:{
|
||||||
|
type:Object,
|
||||||
|
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 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(() => {
|
||||||
|
|
||||||
|
});
|
||||||
|
/**
|
||||||
|
* pageSize 改变触发
|
||||||
|
*/
|
||||||
|
const handleSizeChange = (currentSize) => {
|
||||||
|
listQuery.value.pageSize = currentSize;
|
||||||
|
getListData();
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 页码改变触发
|
||||||
|
*/
|
||||||
|
const handleCurrentChange = (currentPage) => {
|
||||||
|
listQuery.value.pageCurrent = currentPage;
|
||||||
|
getListData();
|
||||||
|
};
|
||||||
|
//检查站数据
|
||||||
|
const getListData = async () => {
|
||||||
|
loading.value = true;
|
||||||
|
qcckGet({...listQuery.value,...props.searchData}, "/mosty-jcz/jczGjrytx/selectPage")
|
||||||
|
.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>
|
||||||
277
src/components/loder/gjwploder.vue
Normal file
277
src/components/loder/gjwploder.vue
Normal file
@ -0,0 +1,277 @@
|
|||||||
|
<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.gjryxm" placeholder="请输入过检人员姓名" clearable />
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
<el-form-item>
|
||||||
|
<el-button type="success" @click="handleFilter">查询</el-button>
|
||||||
|
<el-button type="info" @click="reset()"> 重置 </el-button>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
<div class="tabBox" 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 && props.chooseShow" />
|
||||||
|
<el-table-column width="55" #default="{ row }" v-if="props.Single && props.chooseShow">
|
||||||
|
<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="kkMc" show-overflow-tooltip align="center" label="卡口名称" />
|
||||||
|
<el-table-column sortable prop="ssbm" label="所属部门" show-overflow-tooltip align="center"></el-table-column>
|
||||||
|
<el-table-column sortable prop="ryxm" show-overflow-tooltip align="center" label="人员姓名" />
|
||||||
|
<el-table-column sortable prop="rysfzh" show-overflow-tooltip align="center" label="人员身份证号" />
|
||||||
|
<el-table-column sortable prop="hphm" show-overflow-tooltip align="center" label="过检车辆" />
|
||||||
|
<el-table-column show-overflow-tooltip align="center" label="物品类型" prop="wplx">
|
||||||
|
<template #default="{ row }">
|
||||||
|
<dict-tag :value="row.wplx" :options="D_BZ_WPLX" :tag="false" />
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="wpsl" show-overflow-tooltip align="center" label="物品数量">
|
||||||
|
</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 Person from "@/assets/images/default_male.png";
|
||||||
|
import * as MOSTY from "@/components/MyComponents/index";
|
||||||
|
import { ElMessage } from "element-plus";
|
||||||
|
import { qcckGet, qcckPost } from "@/api/qcckApi.js";
|
||||||
|
import {
|
||||||
|
defineProps,
|
||||||
|
watch,
|
||||||
|
ref,
|
||||||
|
onMounted,
|
||||||
|
nextTick,
|
||||||
|
getCurrentInstance
|
||||||
|
} from "vue";
|
||||||
|
const { proxy } = getCurrentInstance();
|
||||||
|
const urlImg = "/mosty-api/mosty-base/minio/image/download/";
|
||||||
|
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: []
|
||||||
|
},
|
||||||
|
// 是否显示选择框
|
||||||
|
chooseShow: {
|
||||||
|
type: Boolean,
|
||||||
|
default: true
|
||||||
|
},
|
||||||
|
// 搜索条件
|
||||||
|
searchData: {
|
||||||
|
type: Object,
|
||||||
|
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 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(() => { });
|
||||||
|
/**
|
||||||
|
* pageSize 改变触发
|
||||||
|
*/
|
||||||
|
const handleSizeChange = (currentSize) => {
|
||||||
|
listQuery.value.pageSize = currentSize;
|
||||||
|
getListData();
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 页码改变触发
|
||||||
|
*/
|
||||||
|
const handleCurrentChange = (currentPage) => {
|
||||||
|
listQuery.value.pageCurrent = currentPage;
|
||||||
|
getListData();
|
||||||
|
};
|
||||||
|
//检查站数据
|
||||||
|
const getListData = async () => {
|
||||||
|
loading.value = true;
|
||||||
|
qcckGet(
|
||||||
|
{ ...listQuery.value, ...props.searchData },
|
||||||
|
"/mosty-jcz/tbJczBpcWp/getPagelist"
|
||||||
|
)
|
||||||
|
.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>
|
||||||
@ -416,6 +416,30 @@ export const publicRoutes = [
|
|||||||
title: "过检车辆管理",
|
title: "过检车辆管理",
|
||||||
icon: "article"
|
icon: "article"
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: "/InspectionItemManage",
|
||||||
|
name: "InspectionItemManage",
|
||||||
|
component: () =>
|
||||||
|
import(
|
||||||
|
"@/views/backOfficeSystem/peopleManag/InspectionItemManage/index"
|
||||||
|
),
|
||||||
|
meta: {
|
||||||
|
title: "过检物品管理",
|
||||||
|
icon: "article"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: "/crossStation",
|
||||||
|
name: "crossStation",
|
||||||
|
component: () =>
|
||||||
|
import(
|
||||||
|
"@/views/backOfficeSystem/peopleManag/crossStation/index"
|
||||||
|
),
|
||||||
|
meta: {
|
||||||
|
title: "过站汇总管理",
|
||||||
|
icon: "article"
|
||||||
|
}
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
|
|||||||
@ -0,0 +1,303 @@
|
|||||||
|
<template>
|
||||||
|
<div class="dialog" v-if="dialogForm">
|
||||||
|
<div class="head_box">
|
||||||
|
<span class="title">{{ pageInfo[pageType].title }}</span>
|
||||||
|
<div>
|
||||||
|
<el-button size="small" type="primary" v-if="['add', 'edit'].includes(pageType)" @click="_onSave">保存</el-button>
|
||||||
|
<el-button size="small" @click="close">关闭</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="cntinfo">
|
||||||
|
<el-form ref="formRef" :model="listQuery" :disabled="forbidden" :rules="rules" :inline="true"
|
||||||
|
label-position="top">
|
||||||
|
<el-form-item style="width: 46%" prop="ssbmdm" label="所属部门">
|
||||||
|
<MOSTY.Department width="100%" clearable v-model="listQuery.ssbmdm"
|
||||||
|
:placeholder="listQuery.ssbm ? listQuery.ssbm : '请选择所属部门'" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item style="width: 46%" prop="kkMc" label="环林卡口名称">
|
||||||
|
<div class="diviput" @click="forbidden ? '' : showJcz = true">
|
||||||
|
<span v-if="listQuery.kkMc">{{ listQuery.kkMc }}</span>
|
||||||
|
<span class="placeholder" v-else> 请选择布控卡口</span>
|
||||||
|
</div>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item style="width: 46%" prop="ryxm" label="过检人员姓名">
|
||||||
|
<div class="diviput" @click="forbidden ? '' : showGjry = true">
|
||||||
|
<span v-if="listQuery.ryxm">{{ listQuery.ryxm }}</span>
|
||||||
|
<span class="placeholder" v-else> 请选择过检人员</span>
|
||||||
|
</div>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item style="width: 46%" prop="hphm" label="过检车辆">
|
||||||
|
<div class="diviput" @click="forbidden ? '' : showGjcl = true">
|
||||||
|
<span v-if="listQuery.hphm">{{ listQuery.hphm }}</span>
|
||||||
|
<span class="placeholder" v-else> 请选择过检车辆</span>
|
||||||
|
</div>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item prop="wplx" label="物品类型" style="width: 46%">
|
||||||
|
<el-select clearable v-model="listQuery.wplx" placeholder="请选择物品类型" style="width: 100%">
|
||||||
|
<el-option v-for="(item, index) in dict.D_BZ_WPLX" :key="index" :label="item.label"
|
||||||
|
:value="item.value"></el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="物品数量" prop="wpsl" style="width: 46%">
|
||||||
|
<el-input-number style="width: 100%" v-model="listQuery.wpsl" placeholder="请输入物品数量" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="物品说明" prop="wpms" style="width: 100%">
|
||||||
|
<el-input type="textarea" rows="3" v-model="listQuery.wpms" placeholder="物品说明" />
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<Jczloder v-model="showJcz" :Single="true" @choosedJcz="JczMsg" :data="[]" />
|
||||||
|
<Gjrxloder v-model="showGjry" :Single="true" @choosedJcz="GjryMsg" :data="[]" />
|
||||||
|
<Gjclloder v-model="showGjcl" :Single="true" @choosedJcz="GjclMsg" :data="[]" />
|
||||||
|
</template>
|
||||||
|
<script setup>
|
||||||
|
import { qcckGet, qcckPost } from "@/api/qcckApi.js";
|
||||||
|
import { ref, reactive, onMounted } from "vue";
|
||||||
|
import Jczloder from "@/components/loder/Jczloder.vue";
|
||||||
|
import Gjrxloder from "@/components/loder/gjrxloder.vue";
|
||||||
|
import Gjclloder from "@/components/loder/gjclloder.vue";
|
||||||
|
import { GjrytxinsertEntity, GjrytxeditEntity } from "@/api/mosty-jcz.js";
|
||||||
|
import * as MOSTY from "@/components/MyComponents/index";
|
||||||
|
import emitter from "@/utils/eventBus.js";
|
||||||
|
import GdMap from "@/components/GdMap/index.vue";
|
||||||
|
import { ElMessage } from "element-plus";
|
||||||
|
const props = defineProps({
|
||||||
|
dict: {
|
||||||
|
type: Object,
|
||||||
|
default: () => { }
|
||||||
|
}
|
||||||
|
});
|
||||||
|
const rules = reactive({
|
||||||
|
ssbmdm: [
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: "请选择所属部门"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
wplx: [
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: "请选择物品类型"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
wpsl: [
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: "请输入物品数量",
|
||||||
|
trigger: "change"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
});
|
||||||
|
const formRef = ref(null);
|
||||||
|
const emit = defineEmits(["getjczgetXfllList"]);
|
||||||
|
const dialogForm = ref(false);
|
||||||
|
const listQuery = ref({
|
||||||
|
ssbmdm:""
|
||||||
|
});
|
||||||
|
const pageInfo = {
|
||||||
|
edit: {
|
||||||
|
title: "编辑",
|
||||||
|
url: ""
|
||||||
|
},
|
||||||
|
add: {
|
||||||
|
title: "新增",
|
||||||
|
url: ""
|
||||||
|
},
|
||||||
|
detail: {
|
||||||
|
title: "详情"
|
||||||
|
}
|
||||||
|
};
|
||||||
|
onMounted(() => { });
|
||||||
|
let pageType = ref("add");
|
||||||
|
const showJcz = ref(false);
|
||||||
|
const showGjry = ref(false);
|
||||||
|
const showGjcl = ref(false);
|
||||||
|
const JczMsg = (val) => {
|
||||||
|
listQuery.value.kkMc = val.jczmc;
|
||||||
|
listQuery.value.kkId = val.id;
|
||||||
|
listQuery.value.jczmsm = val.id;
|
||||||
|
};
|
||||||
|
const GjryMsg = (val) => {
|
||||||
|
listQuery.value.ryxm = val.gjryxm;
|
||||||
|
listQuery.value.rysfzh = val.gjrysfzh;
|
||||||
|
listQuery.value.ryid = val.id;
|
||||||
|
}
|
||||||
|
const GjclMsg = (val) => {
|
||||||
|
listQuery.value.hphm = val.hphm;
|
||||||
|
listQuery.value.clid = val.id;
|
||||||
|
}
|
||||||
|
const forbidden = ref(false)
|
||||||
|
// 初始化数据
|
||||||
|
const init = (type, row) => {
|
||||||
|
pageType.value = type;
|
||||||
|
dialogForm.value = true;
|
||||||
|
// 根据type和row初始化表单数据
|
||||||
|
tabHeightFn();
|
||||||
|
if (type == "edit" || type == "detail") {
|
||||||
|
listQuery.value = { ...row };
|
||||||
|
if (type == "detail") {
|
||||||
|
forbidden.value = true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
//保存
|
||||||
|
const _onSave = () => {
|
||||||
|
if (!formRef) return;
|
||||||
|
formRef.value.validate((valid, fields) => {
|
||||||
|
if (valid) {
|
||||||
|
if (pageType.value == "add") {
|
||||||
|
qcckPost(listQuery.value , "/mosty-jcz/tbJczBpcWp/addBpcWp").then((res) => {
|
||||||
|
ElMessage({ message: "新增成功", type: "success" });
|
||||||
|
emit("getjczgetXfllList");
|
||||||
|
close();
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
qcckPost(listQuery.value ,"/mosty-jcz/tbJczBpcWp/updateById").then((res) => {
|
||||||
|
ElMessage({ message: "修改成功", type: "success" });
|
||||||
|
emit("getjczgetXfllList");
|
||||||
|
close();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
console.log("error submit!", fields);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
//页面关闭
|
||||||
|
const close = () => {
|
||||||
|
dialogForm.value = false;
|
||||||
|
forbidden.value = false
|
||||||
|
listQuery.value = {};
|
||||||
|
};
|
||||||
|
// 表格高度计算
|
||||||
|
const tableHeight1 = ref();
|
||||||
|
const tabHeightFn = () => {
|
||||||
|
tableHeight1.value = window.innerHeight - 450;
|
||||||
|
};
|
||||||
|
|
||||||
|
defineExpose({ init });
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.dialog {
|
||||||
|
padding: 20px;
|
||||||
|
|
||||||
|
.head_box {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cntinfo {
|
||||||
|
height: calc(100% - 70px);
|
||||||
|
overflow: hidden;
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.my_transfer {
|
||||||
|
height: calc(100% - 50px);
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
.btn {
|
||||||
|
width: 50px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
margin: 0 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.left {
|
||||||
|
margin: 12px;
|
||||||
|
flex: 1;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
.tableBox {
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.serch {
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
|
// height: 96px;
|
||||||
|
>.el-form--inline {
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
padding: 0;
|
||||||
|
|
||||||
|
>.el-form-item--default {
|
||||||
|
width: 31%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.tableBox {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.right {
|
||||||
|
width: 380px;
|
||||||
|
margin: 12px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.phone {
|
||||||
|
width: 95px;
|
||||||
|
height: 120px;
|
||||||
|
|
||||||
|
.el-image {
|
||||||
|
width: 95px;
|
||||||
|
max-height: 120px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
::v-deep .el-upload {
|
||||||
|
width: 90px;
|
||||||
|
height: 100px;
|
||||||
|
border: 1px dashed #000000;
|
||||||
|
margin-bottom: 14px;
|
||||||
|
|
||||||
|
.el-icon {
|
||||||
|
margin-top: 34px;
|
||||||
|
font-size: 26px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.mapbox {
|
||||||
|
width: 1000px;
|
||||||
|
padding: 0 10px;
|
||||||
|
height: 400px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
background: #000;
|
||||||
|
}
|
||||||
|
|
||||||
|
.diviput {
|
||||||
|
width: 100%;
|
||||||
|
background-color: #ffffff;
|
||||||
|
border: 1px solid #c0c4cc;
|
||||||
|
color: #000;
|
||||||
|
height: 32px;
|
||||||
|
line-height: 32px;
|
||||||
|
padding: 0 10px;
|
||||||
|
border-radius: 5px;
|
||||||
|
|
||||||
|
.placeholder {
|
||||||
|
color: #b5b5b5;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
::v-deep .el-icon svg {
|
||||||
|
color: #000000 !important;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,202 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<div class="titleBox">
|
||||||
|
<PageTitle title="过检物品管理">
|
||||||
|
<el-button type="primary" @click="addEdit('add', '')" v-if="Auth">
|
||||||
|
<el-icon style="vertical-align: middle">
|
||||||
|
<CirclePlus />
|
||||||
|
</el-icon>
|
||||||
|
<span style="vertical-align: middle" @click="addEdit('add', row)"
|
||||||
|
>新增</span
|
||||||
|
>
|
||||||
|
</el-button>
|
||||||
|
</PageTitle>
|
||||||
|
</div>
|
||||||
|
<!-- 表格 -->
|
||||||
|
<div ref="searchBox">
|
||||||
|
<Search :searchArr="searchConfiger" @submit="onSearch" />
|
||||||
|
</div>
|
||||||
|
<div class="tabBox">
|
||||||
|
<MyTable
|
||||||
|
:tableData="pageData.tableData"
|
||||||
|
:tableColumn="pageData.tableColumn"
|
||||||
|
:tableHeight="pageData.tableHeight"
|
||||||
|
:key="pageData.keyCount"
|
||||||
|
:tableConfiger="pageData.tableConfiger"
|
||||||
|
:controlsWidth="pageData.controlsWidth"
|
||||||
|
>
|
||||||
|
<template #wplx="{ row }">
|
||||||
|
<dict-tag :value="row.wplx" :options="D_BZ_WPLX" :tag="false" />
|
||||||
|
</template>
|
||||||
|
<!-- 操作 -->
|
||||||
|
<template #controls="{ row }">
|
||||||
|
<el-link type="primary" @click="addEdit('edit', row)">修改</el-link>
|
||||||
|
<el-link type="primary" @click="addEdit('detail', row)">详情</el-link>
|
||||||
|
<el-link type="danger" @click="delDictItem(row.id)">删除</el-link>
|
||||||
|
</template>
|
||||||
|
</MyTable>
|
||||||
|
<Pages
|
||||||
|
@changeNo="changeNo"
|
||||||
|
@changeSize="changeSize"
|
||||||
|
:tableHeight="pageData.tableHeight"
|
||||||
|
:pageConfiger="{
|
||||||
|
...pageData.pageConfiger,
|
||||||
|
total: pageData.total
|
||||||
|
}"
|
||||||
|
></Pages>
|
||||||
|
</div>
|
||||||
|
<!-- 编辑详情 -->
|
||||||
|
<EditAddForm
|
||||||
|
ref="detailDiloag"
|
||||||
|
:dict="{ D_BZ_WPLX }"
|
||||||
|
@getjczgetXfllList="getjczgetXfllList"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import { qcckGet, qcckPost } from "@/api/qcckApi.js";
|
||||||
|
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
||||||
|
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||||
|
import Pages from "@/components/aboutTable/Pages.vue";
|
||||||
|
import Search from "@/components/aboutTable/Search.vue";
|
||||||
|
import { isAuth } from "@/utils/tools.js";
|
||||||
|
import { ElMessage } from "element-plus";
|
||||||
|
import EditAddForm from "./components/editAddForm.vue";
|
||||||
|
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
|
||||||
|
const { proxy } = getCurrentInstance();
|
||||||
|
const { D_BZ_WPLX } = proxy.$dict("D_BZ_WPLX");
|
||||||
|
const searchConfiger = ref([
|
||||||
|
{
|
||||||
|
showType: "department",
|
||||||
|
prop: "ssbmdm",
|
||||||
|
placeholder: "请选择所属部门",
|
||||||
|
label: "所属部门"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "过检卡口",
|
||||||
|
prop: "kkMc",
|
||||||
|
placeholder: "请输入过检卡口",
|
||||||
|
showType: "input"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "物品类型",
|
||||||
|
prop: "wplx",
|
||||||
|
placeholder: "请输入物品类型",
|
||||||
|
showType: "select",
|
||||||
|
options: D_BZ_WPLX
|
||||||
|
}
|
||||||
|
]);
|
||||||
|
|
||||||
|
const detailDiloag = ref();
|
||||||
|
const pageData = reactive({
|
||||||
|
tableData: [], //表格数据
|
||||||
|
keyCount: 0,
|
||||||
|
tableConfiger: {
|
||||||
|
rowHieght: 61,
|
||||||
|
showSelectType: "null",
|
||||||
|
loading: false
|
||||||
|
},
|
||||||
|
total: 0,
|
||||||
|
pageConfiger: {
|
||||||
|
pageSize: 20,
|
||||||
|
pageCurrent: 1
|
||||||
|
}, //分页
|
||||||
|
controlsWidth: 250, //操作栏宽度
|
||||||
|
tableColumn: [
|
||||||
|
{ label: "所属部门", prop: "ssbm", showOverflowTooltip: true },
|
||||||
|
{ label: "人员姓名", prop: "ryxm", showOverflowTooltip: true },
|
||||||
|
{ label: "人员身份证号", prop: "rysfzh", showOverflowTooltip: true },
|
||||||
|
{ label: "过检车辆", prop: "hphm", showOverflowTooltip: true },
|
||||||
|
{
|
||||||
|
label: "卡口名称",
|
||||||
|
prop: "kkMc",
|
||||||
|
showOverflowTooltip: true
|
||||||
|
},
|
||||||
|
|
||||||
|
{
|
||||||
|
label: "物品类型",
|
||||||
|
prop: "wplx",
|
||||||
|
showSolt: true,
|
||||||
|
showOverflowTooltip: true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "物品数量",
|
||||||
|
prop: "wpsl",
|
||||||
|
showOverflowTooltip: true
|
||||||
|
}
|
||||||
|
]
|
||||||
|
});
|
||||||
|
const Auth = ref(true);
|
||||||
|
onMounted(() => {
|
||||||
|
// Auth.value = isAuth()
|
||||||
|
tabHeightFn();
|
||||||
|
});
|
||||||
|
|
||||||
|
//查询条件
|
||||||
|
const queryCondition = ref({});
|
||||||
|
// 获取数据
|
||||||
|
const getjczgetXfllList = () => {
|
||||||
|
pageData.tableConfiger.loading = true;
|
||||||
|
const promes = { ...queryCondition.value, ...pageData.pageConfiger };
|
||||||
|
qcckGet(promes, "/mosty-jcz/tbJczBpcWp/getPagelist")
|
||||||
|
.then((res) => {
|
||||||
|
pageData.tableData = res.records;
|
||||||
|
pageData.total = res.total;
|
||||||
|
})
|
||||||
|
.finally(() => {
|
||||||
|
pageData.tableConfiger.loading = false;
|
||||||
|
});
|
||||||
|
};
|
||||||
|
getjczgetXfllList();
|
||||||
|
// 搜索
|
||||||
|
const onSearch = (val) => {
|
||||||
|
queryCondition.value = { ...queryCondition.value, ...val };
|
||||||
|
getjczgetXfllList();
|
||||||
|
};
|
||||||
|
|
||||||
|
const changeNo = (val) => {
|
||||||
|
pageData.pageConfiger.pageCurrent = val;
|
||||||
|
};
|
||||||
|
const changeSize = (val) => {
|
||||||
|
pageData.pageConfiger.pageSize = val;
|
||||||
|
};
|
||||||
|
|
||||||
|
// 获取列表
|
||||||
|
// 删除
|
||||||
|
const delDictItem = (id) => {
|
||||||
|
proxy
|
||||||
|
.$confirm("确定删除该数据？", "警告", { type: "warning" })
|
||||||
|
.then(() => {
|
||||||
|
qcckPost({ id }, "/mosty-jcz/tbJczBpcWp/deleteById").then((res) => {
|
||||||
|
ElMessage({ message: "删除成功", type: "success" });
|
||||||
|
pageData.pageConfiger.pageCurrent = 1;
|
||||||
|
getjczgetXfllList();
|
||||||
|
});
|
||||||
|
})
|
||||||
|
.catch(() => {
|
||||||
|
proxy.$message.info("已取消");
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
// 新增
|
||||||
|
const addEdit = (type, row) => {
|
||||||
|
detailDiloag.value.init(type, row);
|
||||||
|
};
|
||||||
|
|
||||||
|
const searchBox = ref(null);
|
||||||
|
// 表格高度计算
|
||||||
|
const tabHeightFn = () => {
|
||||||
|
pageData.tableHeight =
|
||||||
|
window.innerHeight - searchBox.value.offsetHeight - 280;
|
||||||
|
window.onresize = function () {
|
||||||
|
tabHeightFn();
|
||||||
|
};
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.el-loading-mask {
|
||||||
|
background: rgba(0, 0, 0, 0.5) !important;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -24,15 +24,6 @@
|
|||||||
:controlsWidth="pageData.controlsWidth"
|
:controlsWidth="pageData.controlsWidth"
|
||||||
@chooseData="chooseData"
|
@chooseData="chooseData"
|
||||||
>
|
>
|
||||||
<template #jczlx="{ row }">
|
|
||||||
<dict-tag :value="row.jczlx" :options="D_BZ_JCZLX" :tag="false" />
|
|
||||||
</template>
|
|
||||||
<template #zqlx="{ row }">
|
|
||||||
<dict-tag :options="D_BZ_ZQLX" :value="row.zqlx" :tag="false" />
|
|
||||||
</template>
|
|
||||||
<template #jczjb="{ row }">
|
|
||||||
<dict-tag :options="D_BZ_JCZJB" :value="row.jczjb" :tag="false" />
|
|
||||||
</template>
|
|
||||||
<template #swrltx="{ row }">
|
<template #swrltx="{ row }">
|
||||||
<div class="phone">
|
<div class="phone">
|
||||||
<el-image
|
<el-image
|
||||||
@ -78,7 +69,7 @@
|
|||||||
<!-- 编辑详情 -->
|
<!-- 编辑详情 -->
|
||||||
<EditAddForm
|
<EditAddForm
|
||||||
ref="detailDiloag"
|
ref="detailDiloag"
|
||||||
:dict="{ D_BZ_JCZLX, D_BZ_ZQLX, D_BZ_DLLX, D_BZ_JCZJB }"
|
:dict="{ D_BZ_ZQLX, D_BZ_DLLX }"
|
||||||
@getjczgetXfllList="getjczgetXfllList"
|
@getjczgetXfllList="getjczgetXfllList"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
@ -91,15 +82,14 @@ import Pages from "@/components/aboutTable/Pages.vue";
|
|||||||
import Search from "@/components/aboutTable/Search.vue";
|
import Search from "@/components/aboutTable/Search.vue";
|
||||||
import { isAuth } from '@/utils/tools.js'
|
import { isAuth } from '@/utils/tools.js'
|
||||||
import { ElMessage } from "element-plus";
|
import { ElMessage } from "element-plus";
|
||||||
|
import Person from '@/assets/images/default_male.png'
|
||||||
import EditAddForm from "./components/editAddForm.vue";
|
import EditAddForm from "./components/editAddForm.vue";
|
||||||
import { GjrytxselectPage, GjrytxdeleteById } from "@/api/mosty-jcz.js";
|
import { GjrytxselectPage, GjrytxdeleteById } from "@/api/mosty-jcz.js";
|
||||||
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
|
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
|
||||||
const { proxy } = getCurrentInstance();
|
const { proxy } = getCurrentInstance();
|
||||||
const { D_BZ_JCZLX, D_BZ_ZQLX, D_BZ_DLLX, D_BZ_JCZJB } = proxy.$dict(
|
const { D_BZ_ZQLX, D_BZ_DLLX } = proxy.$dict(
|
||||||
"D_BZ_JCZLX",
|
|
||||||
"D_BZ_ZQLX",
|
"D_BZ_ZQLX",
|
||||||
"D_BZ_DLLX",
|
"D_BZ_DLLX"
|
||||||
"D_BZ_JCZJB"
|
|
||||||
);
|
);
|
||||||
const urlImg = "/mosty-api/mosty-base/minio/image/download/";
|
const urlImg = "/mosty-api/mosty-base/minio/image/download/";
|
||||||
const searchConfiger = ref([
|
const searchConfiger = ref([
|
||||||
|
|||||||
263
src/views/backOfficeSystem/peopleManag/crossStation/index.vue
Normal file
263
src/views/backOfficeSystem/peopleManag/crossStation/index.vue
Normal file
@ -0,0 +1,263 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<div class="titleBox">
|
||||||
|
<PageTitle title="过站汇总管理"> </PageTitle>
|
||||||
|
</div>
|
||||||
|
<!-- 表格 -->
|
||||||
|
<div ref="searchBox">
|
||||||
|
<Search :searchArr="searchConfiger" @submit="onSearch" />
|
||||||
|
</div>
|
||||||
|
<div class="top_box">
|
||||||
|
<div class="item_box">
|
||||||
|
<div>过站总人数：{{ totalObj.gzryNum }}</div>
|
||||||
|
<div class="fl_box">
|
||||||
|
<div>入林人数：{{ totalObj.rlclNum }}</div>
|
||||||
|
<div>出林人数：{{ totalObj.clryNum }}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="item_box">
|
||||||
|
<div>过站总车数：{{ totalObj.gzclNum }}</div>
|
||||||
|
<div class="fl_box">
|
||||||
|
<div>入林车数：{{ totalObj.rlclNum }}</div>
|
||||||
|
<div>出林车数：{{ totalObj.clclNum }}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="item_box">
|
||||||
|
<div>过站物品数：{{ totalObj.gzwpNum }}</div>
|
||||||
|
<div class="fl_box">
|
||||||
|
<div>入林物品数：{{ totalObj.rlwpNum }}</div>
|
||||||
|
<div>出林物品数：{{ totalObj.clwpNum }}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="tabBox">
|
||||||
|
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
|
||||||
|
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth"
|
||||||
|
@columnInfo="columnInfo">
|
||||||
|
</MyTable>
|
||||||
|
<Pages @changeNo="changeNo" @changeSize="changeSize" :tableHeight="pageData.tableHeight" :pageConfiger="{
|
||||||
|
...pageData.pageConfiger,
|
||||||
|
total: pageData.total
|
||||||
|
}"></Pages>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<Gjrxloder v-model="showGjry" :chooseShow="false" :searchData="dialogSearch" />
|
||||||
|
<Gjclloder v-model="showGjcl" :chooseShow="false" :searchData="dialogSearch" />
|
||||||
|
<Gjwploder v-model="showGjwp" :chooseShow="false" :searchData="dialogSearch" />
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import { qcckGet, qcckPost } from "@/api/qcckApi.js";
|
||||||
|
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
||||||
|
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||||
|
import Pages from "@/components/aboutTable/Pages.vue";
|
||||||
|
import Search from "@/components/aboutTable/Search.vue";
|
||||||
|
import Gjrxloder from "@/components/loder/gjrxloder.vue";
|
||||||
|
import Gjclloder from "@/components/loder/gjclloder.vue";
|
||||||
|
import Gjwploder from "@/components/loder/gjwploder.vue";
|
||||||
|
import { isAuth } from "@/utils/tools.js";
|
||||||
|
import { ElMessage } from "element-plus";
|
||||||
|
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
|
||||||
|
const { proxy } = getCurrentInstance();
|
||||||
|
const { D_BZ_WPLX } = proxy.$dict("D_BZ_WPLX");
|
||||||
|
const searchConfiger = ref([
|
||||||
|
{
|
||||||
|
showType: "datetimerange",
|
||||||
|
prop: "time",
|
||||||
|
placeholder: "请选择时间",
|
||||||
|
label: "时间"
|
||||||
|
}
|
||||||
|
]);
|
||||||
|
const totalObj = ref({});
|
||||||
|
const showGjry = ref(false);
|
||||||
|
const showGjcl = ref(false);
|
||||||
|
const showGjwp = ref(false);
|
||||||
|
const detailDiloag = ref();
|
||||||
|
const dialogSearch = ref({});
|
||||||
|
const pageData = reactive({
|
||||||
|
tableData: [], //表格数据
|
||||||
|
keyCount: 0,
|
||||||
|
tableConfiger: {
|
||||||
|
rowHieght: 61,
|
||||||
|
showSelectType: "null",
|
||||||
|
loading: false,
|
||||||
|
haveControls: false
|
||||||
|
},
|
||||||
|
total: 0,
|
||||||
|
pageConfiger: {
|
||||||
|
pageSize: 20,
|
||||||
|
pageCurrent: 1
|
||||||
|
}, //分页
|
||||||
|
controlsWidth: 250, //操作栏宽度
|
||||||
|
tableColumn: [
|
||||||
|
{
|
||||||
|
label: "检查站名称",
|
||||||
|
prop: "kkMc",
|
||||||
|
showOverflowTooltip: true
|
||||||
|
},
|
||||||
|
{ label: "过站总人数", prop: "gzryNum", showOverflowTooltip: true },
|
||||||
|
{ label: "入林人数", prop: "rlclNum", showOverflowTooltip: true },
|
||||||
|
{ label: "出林人数", prop: "clryNum", showOverflowTooltip: true },
|
||||||
|
{
|
||||||
|
label: "过站总车辆",
|
||||||
|
prop: "gzclNum",
|
||||||
|
showOverflowTooltip: true
|
||||||
|
},
|
||||||
|
|
||||||
|
{
|
||||||
|
label: "入林车辆",
|
||||||
|
prop: "rlclNum",
|
||||||
|
showOverflowTooltip: true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "出林车辆",
|
||||||
|
prop: "clclNum",
|
||||||
|
showOverflowTooltip: true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "过站物品数",
|
||||||
|
prop: "gzwpNum",
|
||||||
|
showOverflowTooltip: true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "入林物品数",
|
||||||
|
prop: "rlwpNum",
|
||||||
|
showOverflowTooltip: true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "出林物品数",
|
||||||
|
prop: "clwpNum",
|
||||||
|
showOverflowTooltip: true
|
||||||
|
}
|
||||||
|
]
|
||||||
|
});
|
||||||
|
const Auth = ref(true);
|
||||||
|
onMounted(() => {
|
||||||
|
tabHeightFn();
|
||||||
|
});
|
||||||
|
|
||||||
|
//查询条件
|
||||||
|
const queryCondition = ref({});
|
||||||
|
// 统计
|
||||||
|
const getjczgetXfllTj = () => {
|
||||||
|
qcckGet(queryCondition.value, "/mosty-jcz/jczGjrytx/getGjrytxhzTj").then(
|
||||||
|
(res) => {
|
||||||
|
console.log(res, "res");
|
||||||
|
totalObj.value = res;
|
||||||
|
}
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
const getjczgetXfllList = () => {
|
||||||
|
qcckGet(queryCondition.value, "/mosty-jcz/jczGjrytx/getGjrytxhzlb")
|
||||||
|
.then((res) => {
|
||||||
|
pageData.tableData = res.records;
|
||||||
|
pageData.total = res.total;
|
||||||
|
})
|
||||||
|
.finally(() => {
|
||||||
|
pageData.tableConfiger.loading = false;
|
||||||
|
});
|
||||||
|
};
|
||||||
|
getjczgetXfllTj();
|
||||||
|
getjczgetXfllList();
|
||||||
|
// 搜索
|
||||||
|
const onSearch = (val) => {
|
||||||
|
if (val.time) {
|
||||||
|
queryCondition.value.kssj = val.time[0];
|
||||||
|
queryCondition.value.jssj = val.time[1];
|
||||||
|
} else {
|
||||||
|
queryCondition.value.kssj = "";
|
||||||
|
queryCondition.value.jssj = "";
|
||||||
|
}
|
||||||
|
getjczgetXfllTj();
|
||||||
|
getjczgetXfllList();
|
||||||
|
};
|
||||||
|
const columnInfo = (val) => {
|
||||||
|
// 过站类型（01 入林 02 出林） 01 入林 02 出林
|
||||||
|
dialogSearch.value.kkId = val.row.kkId;
|
||||||
|
switch (val.column.property) {
|
||||||
|
case "gzryNum":
|
||||||
|
dialogSearch.value.gzlx = "";
|
||||||
|
showGjry.value = true;
|
||||||
|
break;
|
||||||
|
case "rlclNum":
|
||||||
|
dialogSearch.value.gzlx = "01";
|
||||||
|
showGjry.value = true;
|
||||||
|
break;
|
||||||
|
case "clryNum":
|
||||||
|
dialogSearch.value.gzlx = "02";
|
||||||
|
showGjry.value = true;
|
||||||
|
break;
|
||||||
|
case "gzclNum":
|
||||||
|
dialogSearch.value.gzlx = "";
|
||||||
|
showGjcl.value = true;
|
||||||
|
break;
|
||||||
|
case "rlclNum":
|
||||||
|
dialogSearch.value.gzlx = "01";
|
||||||
|
showGjcl.value = true;
|
||||||
|
break;
|
||||||
|
case "clclNum":
|
||||||
|
dialogSearch.value.gzlx = "02";
|
||||||
|
showGjcl.value = true;
|
||||||
|
break;
|
||||||
|
case "gzwpNum":
|
||||||
|
dialogSearch.value.gzlx = "";
|
||||||
|
showGjwp.value = true;
|
||||||
|
break;
|
||||||
|
case "rlwpNum":
|
||||||
|
dialogSearch.value.gzlx = "01";
|
||||||
|
showGjwp.value = true;
|
||||||
|
break;
|
||||||
|
case "clwpNum":
|
||||||
|
dialogSearch.value.gzlx = "02";
|
||||||
|
showGjwp.value = true;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
const changeNo = (val) => {
|
||||||
|
pageData.pageConfiger.pageCurrent = val;
|
||||||
|
};
|
||||||
|
const changeSize = (val) => {
|
||||||
|
pageData.pageConfiger.pageSize = val;
|
||||||
|
};
|
||||||
|
|
||||||
|
// 新增
|
||||||
|
const addEdit = (type, row) => {
|
||||||
|
detailDiloag.value.init(type, row);
|
||||||
|
};
|
||||||
|
|
||||||
|
const searchBox = ref(null);
|
||||||
|
// 表格高度计算
|
||||||
|
const tabHeightFn = () => {
|
||||||
|
pageData.tableHeight =
|
||||||
|
window.innerHeight - searchBox.value.offsetHeight - 280;
|
||||||
|
window.onresize = function () {
|
||||||
|
tabHeightFn();
|
||||||
|
};
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.el-loading-mask {
|
||||||
|
background: rgba(0, 0, 0, 0.5) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.top_box {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-around;
|
||||||
|
color: #000;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
|
||||||
|
.item_box {
|
||||||
|
text-align: center;
|
||||||
|
width: 22%;
|
||||||
|
font-size: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fl_box {
|
||||||
|
display: flex;
|
||||||
|
font-size: 16px;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Reference in New Issue
Block a user