lcw
This commit is contained in:
@ -395,25 +395,48 @@ export const publicRoutes = [
|
||||
icon: "article"
|
||||
},
|
||||
children: [
|
||||
// {
|
||||
// path: "/Inspector",
|
||||
// name: "Inspector",
|
||||
// component: () =>
|
||||
// import("@/views/backOfficeSystem/peopleManag/Inspector/index"),
|
||||
// meta: {
|
||||
// title: "过检人像管理",
|
||||
// icon: "article"
|
||||
// }
|
||||
// },
|
||||
// {
|
||||
// path: "/InspectedVehicle",
|
||||
// name: "InspectedVehicle",
|
||||
// component: () =>
|
||||
// import(
|
||||
// "@/views/backOfficeSystem/peopleManag/InspectedVehicle/index"
|
||||
// ),
|
||||
// meta: {
|
||||
// title: "过检车辆管理",
|
||||
// icon: "article"
|
||||
// }
|
||||
// },
|
||||
|
||||
{
|
||||
path: "/Inspector",
|
||||
name: "Inspector",
|
||||
path: "/transitPassengers",
|
||||
name: "transitPassengers",
|
||||
component: () =>
|
||||
import("@/views/backOfficeSystem/peopleManag/Inspector/index"),
|
||||
|
||||
import("@/views/backOfficeSystem/peopleManag/transitPassengers/index"),
|
||||
meta: {
|
||||
title: "过检人像管理",
|
||||
title: "过站人员管理",
|
||||
icon: "article"
|
||||
}
|
||||
},
|
||||
{
|
||||
path: "/InspectedVehicle",
|
||||
name: "InspectedVehicle",
|
||||
path: "/passingThroughVehicle",
|
||||
name: "passingThroughVehicle",
|
||||
component: () =>
|
||||
import(
|
||||
"@/views/backOfficeSystem/peopleManag/InspectedVehicle/index"
|
||||
),
|
||||
|
||||
import("@/views/backOfficeSystem/peopleManag/passingThroughVehicle/index"),
|
||||
meta: {
|
||||
title: "过检车辆管理",
|
||||
title: "过站车辆管理",
|
||||
icon: "article"
|
||||
}
|
||||
},
|
||||
|
||||
@ -0,0 +1,327 @@
|
||||
<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">
|
||||
<FormMessage v-model="listQuery" :formList="formData" ref="formRef" :rules="rules" :disabled="forbidden">
|
||||
<template #gczp>
|
||||
<el-image :src="listQuery.gczp" fit="fill" style="width: 100px; height: 100px;" />
|
||||
</template>
|
||||
</FormMessage>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, reactive, onMounted } from "vue";
|
||||
import { jczBkclEntity, jczBkclInsertEntity } from "@/api/mosty-jcz.js";
|
||||
import FormMessage from "@/components/aboutTable/FormMessage.vue"
|
||||
import { ElMessage } from "element-plus";
|
||||
import { qcckGet, qcckPost } from "@/api/qcckApi.js";
|
||||
const props = defineProps({
|
||||
dict: {
|
||||
type: Object,
|
||||
default: () => { }
|
||||
}
|
||||
});
|
||||
const rules = reactive({
|
||||
cph: [
|
||||
{
|
||||
required: true,
|
||||
message: "请输入布控姓名"
|
||||
}
|
||||
],
|
||||
|
||||
bkkk: [
|
||||
{
|
||||
required: true,
|
||||
message: "请选择布控卡口"
|
||||
}
|
||||
], cpys: [{
|
||||
required: true,
|
||||
message: "请选择车牌颜色"
|
||||
}],
|
||||
yjys: [
|
||||
{
|
||||
required: true,
|
||||
message: "请选择预警颜色"
|
||||
}
|
||||
],
|
||||
bkkssj: [
|
||||
{
|
||||
required: true,
|
||||
message: "请选择布控开始时间"
|
||||
}
|
||||
],
|
||||
|
||||
bkjssj: [
|
||||
{
|
||||
required: true,
|
||||
message: "请输入布控身份证号"
|
||||
}
|
||||
],
|
||||
bkfs: [
|
||||
{
|
||||
required: true,
|
||||
message: "请输入布控方式"
|
||||
}
|
||||
], czcs: [
|
||||
{
|
||||
required: true,
|
||||
message: "请输选择布控措施"
|
||||
}
|
||||
],
|
||||
bkyy: {
|
||||
required: true,
|
||||
message: "请输入布控原因"
|
||||
}
|
||||
});
|
||||
|
||||
const formData = reactive([
|
||||
{ label: "头像", prop: "gczp", type: "slot", width: "100%" },
|
||||
{ label: "车牌号", prop: "hphm", type: "input" },
|
||||
{ label: "过车时间", prop: "gzsj", type: "input" },
|
||||
{ label: "车辆识别代号", prop: "clsbdh", type: "input", disabled: true },
|
||||
{ label: "机动车所有人", prop: "jdcsyr", type: "input" },
|
||||
{ label: "所有人身份证号", prop: "jdcsyrsfzh", type: "input" },
|
||||
{ label: "驾驶员姓名", prop: "jsyxm", type: "input" },
|
||||
{ label: "驾驶员身份证号", prop: "jsysfzh", type: "input" },
|
||||
{ label: "品牌名称", prop: "zwppmc", type: "input" },
|
||||
{
|
||||
label: "车牌颜色", prop: "csysdm", type: "select", options: props.dict.D_BZ_CLYS
|
||||
},
|
||||
{
|
||||
label: "机动车档案编号", prop: "dabm", type: "input"
|
||||
},
|
||||
{
|
||||
label: "过站类型", prop: "gzlx", type: "select", options: [
|
||||
{ label: "入林", value: "01" },
|
||||
{ label: "出林", value: "02" }
|
||||
]
|
||||
},
|
||||
{ label: "摄像头编码", prop: "tdbm", type: "input" },
|
||||
{ label: "抓拍摄像头", prop: "tdmc", type: "input" },
|
||||
{ label: "抓拍地址", prop: "kkMc", type: "input" },
|
||||
{ label: "同行位置", prop: "txwz", type: "input" },
|
||||
{ label: "所属部门", prop: "ssbm", type: "input", disabled: true },
|
||||
]);
|
||||
|
||||
|
||||
|
||||
const formRef = ref(null);
|
||||
const emit = defineEmits(["getjczgetXfllList"]);
|
||||
const dialogForm = ref(false);
|
||||
const listQuery = ref({});
|
||||
const pageInfo = {
|
||||
edit: {
|
||||
title: "编辑",
|
||||
url: ""
|
||||
},
|
||||
add: {
|
||||
title: "新增",
|
||||
url: ""
|
||||
},
|
||||
detail: {
|
||||
title: "详情"
|
||||
}
|
||||
};
|
||||
|
||||
let pageType = ref("add");
|
||||
|
||||
// 初始化数据
|
||||
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
|
||||
}
|
||||
} else {
|
||||
listQuery.value = {};
|
||||
}
|
||||
};
|
||||
//保存
|
||||
const _onSave = () => {
|
||||
if (!formRef) return;
|
||||
|
||||
formRef.value.submit(() => {
|
||||
const promes = { ...listQuery.value };
|
||||
qcckPost(promes, '/mosty-jcz/jczGzcl/editEntity').then((res) => {
|
||||
ElMessage({ message: "修改成功", type: "success" });
|
||||
emit("getjczgetXfllList");
|
||||
close();
|
||||
});
|
||||
})
|
||||
|
||||
|
||||
// ((valid, fields) => {
|
||||
// if (valid) {
|
||||
// const promes = { ...listQuery.value };
|
||||
// if (pageType.value == "add") {
|
||||
// // jczBkclInsertEntity(promes).then((res) => {
|
||||
// // ElMessage({ message: "新增成功", type: "success" });
|
||||
// // emit("getjczgetXfllList");
|
||||
// // close();
|
||||
// // });
|
||||
// } else {
|
||||
// // /jczGzry/editEntity
|
||||
// qcckPost(promes,'/mosty-jcz/jczGzry/editEntity').then((res) => {
|
||||
// ElMessage({ message: "修改成功", type: "success" });
|
||||
// emit("getjczgetXfllList");
|
||||
// close();
|
||||
// });
|
||||
// }
|
||||
// } else {
|
||||
// console.log("error submit!", fields);
|
||||
// }
|
||||
// });
|
||||
// console.log();
|
||||
};
|
||||
|
||||
|
||||
//页面关闭
|
||||
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,218 @@
|
||||
<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 #gczp="{ row }">
|
||||
<el-image style="width: 70px; height: 80px" :src="row.gczp ? row.gczp : car" :fit="fit" />
|
||||
</template>
|
||||
<template #gzlx="{ row }">
|
||||
<span v-if="row.gzlx == '01'">入林</span>
|
||||
<span v-else>出林</span>
|
||||
</template>
|
||||
<!-- 操作 -->
|
||||
<template #controls="{ row }">
|
||||
<template v-if="Auth">
|
||||
<el-link type="primary" @click="addEdit('edit', row)">修改</el-link>
|
||||
<el-link type="primary" @click="delDictItem(row.id)">删除</el-link>
|
||||
</template>
|
||||
<el-link type="primary" @click="addEdit('detail', row)">详情</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_BKYS, D_BZ_CZCS, D_BZ_CPHYS
|
||||
}" @getjczgetXfllList="getjczgetXfllList" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
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 EditAddForm from "./components/editAddForm.vue";
|
||||
import { qcckGet, qcckPost } from "@/api/qcckApi.js";
|
||||
import { ElMessage } from "element-plus";
|
||||
import { isAuth } from '@/utils/tools.js'
|
||||
import { reactive, ref, onMounted, getCurrentInstance, watch } from "vue";
|
||||
const { proxy } = getCurrentInstance();
|
||||
const car = ref(require('@/assets/images/car.png'))
|
||||
const kkList = ref([])
|
||||
const searchConfiger = ref([
|
||||
{
|
||||
label: "车牌号",
|
||||
prop: "hphm",
|
||||
placeholder: "请输入车牌号",
|
||||
showType: "input"
|
||||
},
|
||||
{
|
||||
label: "过站时间",
|
||||
prop: "startTime",
|
||||
placeholder: "过站时间",
|
||||
showType: "daterange",
|
||||
}, {
|
||||
label: "检查站",
|
||||
prop: "kkId",
|
||||
placeholder: "请选择过站检查站",
|
||||
showType: "select",
|
||||
options: []
|
||||
},
|
||||
]);
|
||||
|
||||
const listGet = () => {
|
||||
qcckGet({}, "/mosty-jcz/jcz/selectJczFullList").then((res) => {
|
||||
kkList.value = res.map(item => {
|
||||
return {
|
||||
label: item.jczmc,
|
||||
value: item.id
|
||||
}
|
||||
})
|
||||
}).catch((err) => {
|
||||
|
||||
}).finally(() => {
|
||||
pageData.tableConfiger.loading = false;
|
||||
})
|
||||
}
|
||||
watch(() => kkList.value, (newVal, oldVal) => {
|
||||
if (newVal) {
|
||||
searchConfiger.value[2].options = newVal
|
||||
}
|
||||
}, { deep: true, immediate: true })
|
||||
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: "gczp", showOverflowTooltip: true, showSolt: true },
|
||||
{ label: "车牌号", prop: "hphm", showOverflowTooltip: true },
|
||||
{ label: "过车时间", prop: "gzsj", showOverflowTooltip: true },
|
||||
{ label: "卡口方向", prop: "gzlx", showOverflowTooltip: true, showSolt: true },
|
||||
{ label: "车辆种类", prop: "zwppmc", showOverflowTooltip: true },
|
||||
{ label: "摄像头编码", prop: "tdbm", showOverflowTooltip: true },
|
||||
{ label: "抓拍摄像头", prop: "tdmc", showOverflowTooltip: true, },
|
||||
{ label: "抓拍地址", prop: "kkMc", showOverflowTooltip: true },
|
||||
{ label: "标签", prop: "bq", showOverflowTooltip: true }
|
||||
]
|
||||
});
|
||||
const Auth = ref(false)
|
||||
onMounted(() => {
|
||||
tabHeightFn();
|
||||
Auth.value = isAuth()
|
||||
listGet()
|
||||
});
|
||||
|
||||
//查询条件
|
||||
const queryCondition = ref();
|
||||
// 获取数据
|
||||
const getjczgetXfllList = () => {
|
||||
pageData.tableConfiger.loading = true;
|
||||
const params = {
|
||||
...queryCondition.value,
|
||||
pageCurrent: pageData.pageConfiger.pageCurrent,
|
||||
pageSize: pageData.pageConfiger.pageSize,
|
||||
|
||||
}
|
||||
qcckGet(params, "/mosty-jcz/jczGzcl/selectPage").then((res) => {
|
||||
pageData.tableData = res.records
|
||||
pageData.total = res.total
|
||||
|
||||
}).catch((err) => {
|
||||
|
||||
}).finally(() => {
|
||||
pageData.tableConfiger.loading = false;
|
||||
});
|
||||
};
|
||||
getjczgetXfllList();
|
||||
// 搜索
|
||||
const onSearch = (val) => {
|
||||
queryCondition.value = {
|
||||
...val,
|
||||
startTime: val.startTime ? val.startTime[0] : "",
|
||||
endTime: val.startTime ? val.startTime[1] : ""
|
||||
}
|
||||
getjczgetXfllList();
|
||||
};
|
||||
|
||||
const changeNo = (val) => {
|
||||
pageData.pageConfiger.pageCurrent = val;
|
||||
};
|
||||
const changeSize = (val) => {
|
||||
pageData.pageConfiger.pageSize = val;
|
||||
};
|
||||
|
||||
// 获取列表
|
||||
// 删除
|
||||
const delDictItem = (ids) => {
|
||||
proxy
|
||||
.$confirm("确定删除该数据？", "警告", { type: "warning" })
|
||||
.then(() => {
|
||||
|
||||
qcckPost({
|
||||
ids: [ids]
|
||||
}, "/mosty-jcz/jczGzcl/deleteById").then((res) => {
|
||||
ElMessage({ message: "删除成功", type: "success" });
|
||||
pageData.pageConfiger.pageCurrent = 1;
|
||||
getjczgetXfllList();
|
||||
})
|
||||
.catch((err) => {
|
||||
console.log(err);
|
||||
});
|
||||
})
|
||||
.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>
|
||||
@ -0,0 +1,318 @@
|
||||
<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">
|
||||
<FormMessage v-model="listQuery" :formList="formData" ref="formRef" :rules="rules" :disabled="forbidden">
|
||||
<template #zp>
|
||||
<el-image :src="listQuery.zp" fit="fill" style="width: 100px; height: 100px;" />
|
||||
</template>
|
||||
</FormMessage>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, reactive, onMounted } from "vue";
|
||||
import { jczBkclEntity, jczBkclInsertEntity } from "@/api/mosty-jcz.js";
|
||||
import FormMessage from "@/components/aboutTable/FormMessage.vue"
|
||||
import { ElMessage } from "element-plus";
|
||||
import { qcckGet,qcckPost } from "@/api/qcckApi.js";
|
||||
const props = defineProps({
|
||||
dict: {
|
||||
type: Object,
|
||||
default: () => { }
|
||||
}
|
||||
});
|
||||
const rules = reactive({
|
||||
cph: [
|
||||
{
|
||||
required: true,
|
||||
message: "请输入布控姓名"
|
||||
}
|
||||
],
|
||||
|
||||
bkkk: [
|
||||
{
|
||||
required: true,
|
||||
message: "请选择布控卡口"
|
||||
}
|
||||
], cpys: [{
|
||||
required: true,
|
||||
message: "请选择车牌颜色"
|
||||
}],
|
||||
yjys: [
|
||||
{
|
||||
required: true,
|
||||
message: "请选择预警颜色"
|
||||
}
|
||||
],
|
||||
bkkssj: [
|
||||
{
|
||||
required: true,
|
||||
message: "请选择布控开始时间"
|
||||
}
|
||||
],
|
||||
|
||||
bkjssj: [
|
||||
{
|
||||
required: true,
|
||||
message: "请输入布控身份证号"
|
||||
}
|
||||
],
|
||||
bkfs: [
|
||||
{
|
||||
required: true,
|
||||
message: "请输入布控方式"
|
||||
}
|
||||
], czcs: [
|
||||
{
|
||||
required: true,
|
||||
message: "请输选择布控措施"
|
||||
}
|
||||
],
|
||||
bkyy: {
|
||||
required: true,
|
||||
message: "请输入布控原因"
|
||||
}
|
||||
});
|
||||
|
||||
const formData = reactive([
|
||||
{ label: "头像", prop: "zp", type: "slot", width: "100%" },
|
||||
{ label: "姓名", prop: "xm", type: "input" },
|
||||
{ label: "身份证号", prop: "zjhm", type: "input" },
|
||||
{ label: "出生日期", prop: "csrq", type: "input", disabled: true },
|
||||
|
||||
{ label: "过站时间", prop: "gzsj", type: "datetime" },
|
||||
{
|
||||
label: "过站类型", prop: "gzlx", type: "select", options: [
|
||||
{ label: "入林", value: "01" },
|
||||
{ label: "出林", value: "02" }
|
||||
]
|
||||
},
|
||||
{ label: "摄像头编码", prop: "tdbm", type: "input" },
|
||||
{ label: "抓拍摄像头", prop: "tdmc", type: "input" },
|
||||
{ label: "抓拍地址", prop: "kkMc", type: "input" },
|
||||
{ label: "同行位置", prop: "txwz", type: "input" },
|
||||
{ label: "所属部门", prop: "ssbm", type: "input", disabled: true },
|
||||
]);
|
||||
|
||||
|
||||
|
||||
const formRef = ref(null);
|
||||
const emit = defineEmits(["getjczgetXfllList"]);
|
||||
const dialogForm = ref(false);
|
||||
const listQuery = ref({});
|
||||
const pageInfo = {
|
||||
edit: {
|
||||
title: "编辑",
|
||||
url: ""
|
||||
},
|
||||
add: {
|
||||
title: "新增",
|
||||
url: ""
|
||||
},
|
||||
detail: {
|
||||
title: "详情"
|
||||
}
|
||||
};
|
||||
|
||||
let pageType = ref("add");
|
||||
|
||||
// 初始化数据
|
||||
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
|
||||
}
|
||||
} else {
|
||||
listQuery.value = {};
|
||||
}
|
||||
};
|
||||
//保存
|
||||
const _onSave = () => {
|
||||
if (!formRef) return;
|
||||
|
||||
formRef.value.submit(() => {
|
||||
const promes = { ...listQuery.value };
|
||||
qcckPost(promes,'/mosty-jcz/jczGzry/editEntity').then((res) => {
|
||||
ElMessage({ message: "修改成功", type: "success" });
|
||||
emit("getjczgetXfllList");
|
||||
close();
|
||||
});
|
||||
})
|
||||
|
||||
|
||||
// ((valid, fields) => {
|
||||
// if (valid) {
|
||||
// const promes = { ...listQuery.value };
|
||||
// if (pageType.value == "add") {
|
||||
// // jczBkclInsertEntity(promes).then((res) => {
|
||||
// // ElMessage({ message: "新增成功", type: "success" });
|
||||
// // emit("getjczgetXfllList");
|
||||
// // close();
|
||||
// // });
|
||||
// } else {
|
||||
// // /jczGzry/editEntity
|
||||
// qcckPost(promes,'/mosty-jcz/jczGzry/editEntity').then((res) => {
|
||||
// ElMessage({ message: "修改成功", type: "success" });
|
||||
// emit("getjczgetXfllList");
|
||||
// close();
|
||||
// });
|
||||
// }
|
||||
// } else {
|
||||
// console.log("error submit!", fields);
|
||||
// }
|
||||
// });
|
||||
// console.log();
|
||||
};
|
||||
|
||||
|
||||
//页面关闭
|
||||
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,218 @@
|
||||
<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 #zp="{ row }">
|
||||
<el-image style="width: 70px; height: 80px" :src="row.zp?row.zp:rxImg" :fit="fit" />
|
||||
</template>
|
||||
<template #gzlx="{ row }">
|
||||
<span v-if="row.gzlx == '01'">入林</span>
|
||||
<span v-else>出林</span>
|
||||
</template>
|
||||
<!-- 操作 -->
|
||||
<template #controls="{ row }">
|
||||
<template v-if="Auth">
|
||||
<el-link type="primary" @click="addEdit('edit', row)">修改</el-link>
|
||||
<el-link type="primary" @click="delDictItem(row.id)">删除</el-link>
|
||||
</template>
|
||||
<el-link type="primary" @click="addEdit('detail', row)">详情</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_BKYS, D_BZ_CZCS, D_BZ_CPHYS
|
||||
}" @getjczgetXfllList="getjczgetXfllList" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
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 EditAddForm from "./components/editAddForm.vue";
|
||||
import { qcckGet,qcckPost } from "@/api/qcckApi.js";
|
||||
import { ElMessage } from "element-plus";
|
||||
import { isAuth } from '@/utils/tools.js'
|
||||
import { reactive, ref, onMounted, getCurrentInstance,watch } from "vue";
|
||||
const { proxy } = getCurrentInstance();
|
||||
const rxImg=require('@/assets/images/default_male.png')
|
||||
const kkList = ref([])
|
||||
const searchConfiger = ref([
|
||||
{
|
||||
label: "姓名",
|
||||
prop: "xm",
|
||||
placeholder: "请输入姓名",
|
||||
showType: "input"
|
||||
},
|
||||
{
|
||||
label: "过站时间",
|
||||
prop: "startTime",
|
||||
placeholder: "过站时间",
|
||||
showType: "daterange",
|
||||
}, {
|
||||
label: "检查站",
|
||||
prop: "kkId",
|
||||
placeholder: "请选择过站检查站",
|
||||
showType: "select",
|
||||
options:[]
|
||||
},
|
||||
]);
|
||||
|
||||
const listGet = () => {
|
||||
qcckGet({}, "/mosty-jcz/jcz/selectJczFullList").then((res) => {
|
||||
kkList.value = res.map(item => {
|
||||
return {
|
||||
label: item.jczmc,
|
||||
value: item.id
|
||||
}
|
||||
})
|
||||
}).catch((err) => {
|
||||
|
||||
}).finally(() => {
|
||||
pageData.tableConfiger.loading = false;
|
||||
})
|
||||
}
|
||||
watch(() => kkList.value, (newVal, oldVal) => {
|
||||
if (newVal) {
|
||||
searchConfiger.value[2].options = newVal
|
||||
}
|
||||
},{deep:true,immediate:true})
|
||||
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: "zp", showSolt: true },
|
||||
{ label: "姓名", prop: "xm", showOverflowTooltip: true },
|
||||
{ label: "身份证号", prop: "zjhm", showOverflowTooltip: true,width: 200 },
|
||||
{ label: "过站类型", prop: "gzlx", showOverflowTooltip: true, showSolt: true },
|
||||
{ label: "摄像头编码", prop: "tdbm", showOverflowTooltip: true },
|
||||
{ label: "抓拍摄像头", prop: "tdmc", showOverflowTooltip: true, },
|
||||
{ label: "抓拍地址", prop: "kkMc", showOverflowTooltip: true },
|
||||
{ label: "标签", prop: "bq", showOverflowTooltip: true }
|
||||
]
|
||||
});
|
||||
const Auth = ref(false)
|
||||
onMounted(() => {
|
||||
tabHeightFn();
|
||||
Auth.value = isAuth()
|
||||
listGet()
|
||||
});
|
||||
|
||||
//查询条件
|
||||
const queryCondition = ref();
|
||||
// 获取数据
|
||||
const getjczgetXfllList = () => {
|
||||
pageData.tableConfiger.loading = true;
|
||||
const params = {
|
||||
...queryCondition.value,
|
||||
pageCurrent: pageData.pageConfiger.pageCurrent,
|
||||
pageSize: pageData.pageConfiger.pageSize,
|
||||
|
||||
}
|
||||
qcckGet(params, "/mosty-jcz/jczGzry/selectPage").then((res) => {
|
||||
pageData.tableData = res.records
|
||||
pageData.total = res.total
|
||||
|
||||
}).catch((err) => {
|
||||
|
||||
}).finally(() => {
|
||||
pageData.tableConfiger.loading = false;
|
||||
});
|
||||
};
|
||||
getjczgetXfllList();
|
||||
// 搜索
|
||||
const onSearch = (val) => {
|
||||
queryCondition.value = {
|
||||
...val,
|
||||
startTime: val.startTime ? val.startTime[0] : "",
|
||||
endTime: val.startTime ? val.startTime[1] : ""
|
||||
}
|
||||
getjczgetXfllList();
|
||||
};
|
||||
|
||||
const changeNo = (val) => {
|
||||
pageData.pageConfiger.pageCurrent = val;
|
||||
};
|
||||
const changeSize = (val) => {
|
||||
pageData.pageConfiger.pageSize = val;
|
||||
};
|
||||
|
||||
// 获取列表
|
||||
// 删除
|
||||
const delDictItem = (ids) => {
|
||||
proxy
|
||||
.$confirm("确定删除该数据？", "警告", { type: "warning" })
|
||||
.then(() => {
|
||||
|
||||
qcckPost({
|
||||
ids: [ids]
|
||||
}, "/mosty-jcz/jczGzry/deleteById").then((res) => {
|
||||
ElMessage({ message: "删除成功", type: "success" });
|
||||
pageData.pageConfiger.pageCurrent = 1;
|
||||
getjczgetXfllList();
|
||||
})
|
||||
.catch((err) => {
|
||||
console.log(err);
|
||||
});
|
||||
})
|
||||
.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>
|
||||
@ -18,7 +18,7 @@
|
||||
<div class="info-item">
|
||||
<span class="label">车牌号：</span>
|
||||
<span>{{ item.yjClcph }}</span>
|
||||
<span class="tag">{{ item.yjBt }}</span>
|
||||
<span class="tag">{{ item.yjbqmc }}</span>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<span class="label">相似度：</span>
|
||||
|
||||
@ -18,7 +18,7 @@
|
||||
<div class="info-item">
|
||||
<span class="label">姓名：</span>
|
||||
<span>{{ item.yjRyxm }}</span>
|
||||
<span class="tag">{{ item.yjBt }}</span>
|
||||
<span class="tag">{{ item.yjbqmc }}</span>
|
||||
</div>
|
||||
<div class="info-item flex">
|
||||
<span class="label">性别：{{ IdCard(item.yjRysfzh, 'all').sex }}</span>
|
||||
|
||||
@ -70,7 +70,9 @@
|
||||
<script setup>
|
||||
// 可以在这里添加需要的响应式数据和方法
|
||||
import { jczCountWay, jczgetcountCrl, jczGzrycountCrl } from "@/api/mosty-jcz";
|
||||
import { useRoute } from 'vue-router'
|
||||
import { ref } from "vue";
|
||||
const route = useRoute()
|
||||
const personnelData = ref({
|
||||
rzhy: 0,
|
||||
sczd: 0,
|
||||
@ -85,21 +87,21 @@ const carAccess = ref({
|
||||
rlsl: 0
|
||||
});
|
||||
const countWay = () => {
|
||||
jczCountWay()
|
||||
jczCountWay({kkId:route.query.id?route.query.id:""})
|
||||
.then((res) => {
|
||||
personnelData.value = res;
|
||||
})
|
||||
.catch((err) => {});
|
||||
};
|
||||
const getcountCrl = () => {
|
||||
jczgetcountCrl()
|
||||
jczgetcountCrl({kkId:route.query.id?route.query.id:""})
|
||||
.then((res) => {
|
||||
personneAccess.value = res;
|
||||
})
|
||||
.catch((err) => {});
|
||||
};
|
||||
const GzrycountCrl = () => {
|
||||
jczGzrycountCrl()
|
||||
jczGzrycountCrl({kkId:route.query.id?route.query.id:""})
|
||||
.then((res) => {
|
||||
carAccess.value = res;
|
||||
})
|
||||
|
||||
Reference in New Issue
Block a user