过检
This commit is contained in:
@ -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>
|
||||
Reference in New Issue
Block a user