forked from integrated_whb/integrated_whb_vue
423 lines
13 KiB
Vue
423 lines
13 KiB
Vue
<template>
|
|
<layout-card>
|
|
<el-form
|
|
ref="formRef"
|
|
:model="data.form"
|
|
:rules="rules"
|
|
label-width="175px"
|
|
>
|
|
<!-- 承运信息 -->
|
|
<el-divider content-position="left">承运信息</el-divider>
|
|
<el-row :gutter="20">
|
|
<el-col :span="8">
|
|
<el-form-item prop="DEPARTMENT_ID" label="部门">
|
|
<layout-department
|
|
v-model="data.form.DEPARTMENT_ID"
|
|
@update:model-value="fnDepartmentChange"
|
|
/>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item v-if="!LISTMANAGER_ID" label="调度人" prop="USER_IDS">
|
|
<el-select v-model="data.form.USER_IDS" multiple>
|
|
<el-option
|
|
v-for="item in data.userList"
|
|
:key="item.USER_ID"
|
|
:label="item.NAME"
|
|
:value="item.USER_ID"
|
|
/>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="承运日期" prop="SHIPPINGDATE">
|
|
<el-date-picker
|
|
v-model="data.form.SHIPPINGDATE"
|
|
type="date"
|
|
format="YYYY-MM-DD"
|
|
value-format="YYYY-MM-DD"
|
|
placeholder="选择时间"
|
|
/>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="运输车辆" prop="TRANSPORTVEHICLE">
|
|
<el-select
|
|
v-model="data.form.TRANSPORTVEHICLE"
|
|
placeholder="请选择运输车辆"
|
|
>
|
|
<el-option
|
|
v-for="item in data.OperationVehicle"
|
|
:key="item"
|
|
:label="item"
|
|
:value="item"
|
|
/>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="从业人员" prop="PRACTITIONER">
|
|
<el-select
|
|
v-model="data.form.PRACTITIONER"
|
|
placeholder="请选择从业人员"
|
|
>
|
|
<el-option
|
|
v-for="item in PRACTITIONERMENU"
|
|
:key="item.id"
|
|
:label="item.id"
|
|
:value="item.name"
|
|
/>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="货运挂车" prop="TRUCKCART">
|
|
<el-select
|
|
v-model="data.form.TRUCKCART"
|
|
placeholder="请选择货运挂车"
|
|
>
|
|
<el-option
|
|
v-for="item in TRUCKMENU"
|
|
:key="item.id"
|
|
:label="item.id"
|
|
:value="item.name"
|
|
/>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="人员电话" prop="EMPLOYEEPHONE">
|
|
<el-input
|
|
v-model="data.form.EMPLOYEEPHONE"
|
|
placeholder="请输入人员电话"
|
|
/>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="人员类型" prop="PRACTITIONERTYPE">
|
|
<el-select
|
|
v-model="data.form.PRACTITIONERTYPE"
|
|
placeholder="请选择人员类型"
|
|
>
|
|
<el-option
|
|
v-for="item in PERSONTYPEMENU"
|
|
:key="item.id"
|
|
:label="item.id"
|
|
:value="item.name"
|
|
/>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="身份证号" prop="IDENTITYID">
|
|
<el-input
|
|
v-model="data.form.IDENTITYID"
|
|
placeholder="请输入身份证号"
|
|
/>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<!-- 客户信息 -->
|
|
<el-divider content-position="left">客户信息</el-divider>
|
|
<el-row :gutter="20">
|
|
<el-col :span="8">
|
|
<el-form-item label="委托方" prop="CLIENT">
|
|
<el-select v-model="data.form.CLIENT" placeholder="请选择委托方">
|
|
<el-option
|
|
v-for="item in data.clientOptions"
|
|
:key="item.CONTACT"
|
|
:label="item.COMP_NAME"
|
|
:value="item.CONTACT"
|
|
/>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="联系人" prop="CLIENTCONTACTPERSON">
|
|
<el-input
|
|
v-model="data.form.CLIENTCONTACTPERSON"
|
|
placeholder="请输入联系人"
|
|
/>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="联系电话" prop="CLIENTCONTACTPHONE">
|
|
<el-input
|
|
v-model="data.form.CLIENTCONTACTPHONE"
|
|
placeholder="请输入联系电话"
|
|
/>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="确认方" prop="CONFIRMER">
|
|
<el-select v-model="data.form.CONFIRMER" placeholder="请选择确认方">
|
|
<el-option
|
|
v-for="item in data.confirmerOptions"
|
|
:key="item.CONTACT"
|
|
:label="item.COMP_NAME"
|
|
:value="item.CONTACT"
|
|
/>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="联系人" prop="CONFIRMINGPERSON">
|
|
<el-input
|
|
v-model="data.form.CONFIRMINGPERSON"
|
|
placeholder="请输入联系人"
|
|
/>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="联系电话" prop="CONFIRMINGPHONE">
|
|
<el-input
|
|
v-model="data.form.CONFIRMINGPHONE"
|
|
placeholder="请输入联系电话"
|
|
/>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<!-- 地点信息 -->
|
|
<el-divider content-position="left">地点信息</el-divider>
|
|
<el-row :gutter="20">
|
|
<el-col :span="8">
|
|
<el-form-item label="起运地点" prop="ORIGIN">
|
|
<el-select v-model="data.form.ORIGIN" placeholder="请选择起运地点">
|
|
<el-option
|
|
v-for="item in data.StartOptions"
|
|
:key="item.LOCATIONMANAGEMENT_ID"
|
|
:label="item.LOCATIONNAME"
|
|
:value="item.LOCATIONMANAGEMENT_ID"
|
|
/>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="起运地址" prop="SHIPPINGADDRESS">
|
|
<el-input
|
|
v-model="data.form.SHIPPINGADDRESS"
|
|
placeholder="请输入起运地址"
|
|
/>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="行政区域" prop="STARTADMINISTRATIVEAREA">
|
|
<el-input
|
|
v-model="data.form.STARTADMINISTRATIVEAREA"
|
|
placeholder="请输入行政区域"
|
|
/>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="目的地点" prop="DESTINATION">
|
|
<el-select
|
|
v-model="data.form.DESTINATION"
|
|
placeholder="请选择目的地点"
|
|
>
|
|
<el-option
|
|
v-for="item in data.EndOptions"
|
|
:key="item.LOCATIONMANAGEMENT_ID"
|
|
:label="item.LOCATIONNAME"
|
|
:value="item.LOCATIONMANAGEMENT_ID"
|
|
/>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="目的地址" prop="DESTINATIONADDRESS">
|
|
<el-input
|
|
v-model="data.form.DESTINATIONADDRESS"
|
|
placeholder="请输入目的地址"
|
|
/>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="8">
|
|
<el-form-item label="行政区域" prop="ENDDMINISTRATIVEAREA">
|
|
<el-input
|
|
v-model="data.form.ENDDMINISTRATIVEAREA"
|
|
placeholder="请输入行政区域"
|
|
/>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
</el-form>
|
|
<div class="tc mt-10">
|
|
<el-button type="primary" @click="fnSubmit">确定</el-button>
|
|
</div>
|
|
</layout-card>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { layoutFnGetMEETINGTYPEClassification } from "@/request/safety_production_related.js";
|
|
import {
|
|
PRACTITIONERMENU,
|
|
TRUCKMENU,
|
|
PERSONTYPEMENU,
|
|
} from "@/assets/js/constant";
|
|
import {
|
|
addSafetyThingsChecView,
|
|
getSecurityPerson,
|
|
} from "@/request/waybill_registration.js";
|
|
import { onMounted, reactive, ref, watchEffect } from "vue";
|
|
import useFormValidate from "@/assets/js/useFormValidate.js";
|
|
import { ElMessage } from "element-plus";
|
|
import LayoutDepartment from "@/components/department/index.vue";
|
|
import { getPostListAll, getUserListAll } from "@/request/data_dictionary.js";
|
|
import { getSecurityCustomerList } from "@/request/customer_management.js";
|
|
import { getSecurityLocationList } from "@/request/location_management.js";
|
|
import { getOperationVehicleList } from "@/request/operation_vehicle.js";
|
|
|
|
const formRef = ref(null);
|
|
const rules = {
|
|
TRANSPORTATIONCOMPANY: [
|
|
{ required: true, message: "请输入运输企业名称", trigger: "blur" },
|
|
],
|
|
DISPATCHER: [
|
|
{ required: true, message: "请输入调度人姓名", trigger: "blur" },
|
|
],
|
|
SHIPPINGDATE: [
|
|
{ required: true, message: "请选择承运日期", trigger: "change" },
|
|
],
|
|
CLIENT: [{ required: true, message: "请选择委托方名称", trigger: "change" }],
|
|
CLIENTCONTACTPERSON: [
|
|
{ required: true, message: "请输入联系人姓名", trigger: "blur" },
|
|
],
|
|
CLIENTCONTACTPHONE: [
|
|
{ required: true, message: "请输入联系电话", trigger: "blur" },
|
|
],
|
|
CONFIRMER: [
|
|
{ required: true, message: "请选择确认方名称", trigger: "change" },
|
|
],
|
|
ORIGIN: [{ required: true, message: "请选择起运地点", trigger: "change" }],
|
|
SHIPPINGADDRESS: [
|
|
{ required: true, message: "请输入起运地址", trigger: "blur" },
|
|
],
|
|
DESTINATION: [
|
|
{ required: true, message: "请选择目的地点", trigger: "change" },
|
|
],
|
|
DESTINATIONADDRESS: [
|
|
{ required: true, message: "请输入目的地址", trigger: "blur" },
|
|
],
|
|
};
|
|
|
|
const relatedClassificationTempList =
|
|
await layoutFnGetMEETINGTYPEClassification();
|
|
const relatedClassificationList = [];
|
|
JSON.parse(relatedClassificationTempList.value.zTreeNodes).forEach((e) => {
|
|
relatedClassificationList.push({ name: e.id, BIANMA: e.name });
|
|
});
|
|
|
|
const data = reactive({
|
|
form: {
|
|
TRANSPORTATIONCOMPANY: "",
|
|
DISPATCHER: "",
|
|
DEPARTMENT_ID: "",
|
|
POST_ID: "",
|
|
USER_IDS: [],
|
|
USER_ID: "",
|
|
SHIPPINGDATE: "",
|
|
IDENTITYID: "",
|
|
TRUCKCART: "",
|
|
EMPLOYEEPHONE: "",
|
|
PRACTITIONER: "",
|
|
TRANSPORTVEHICLE: "",
|
|
CLIENT: "",
|
|
CLIENTCONTACTPERSON: "",
|
|
CLIENTCONTACTPHONE: "",
|
|
CONFIRMER: "",
|
|
CONFIRMINGPERSON: "",
|
|
CONFIRMINGPHONE: "",
|
|
ORIGIN: "",
|
|
SHIPPINGADDRESS: "",
|
|
STARTADMINISTRATIVEAREA: "",
|
|
DESTINATION: "",
|
|
DESTINATIONADDRESS: "",
|
|
ENDDMINISTRATIVEAREA: "",
|
|
},
|
|
clientOptions: [], // 委托方选项
|
|
confirmerOptions: [], // 确认方选项
|
|
StartOptions: [], // 起始地
|
|
EndOptions: [], // 目的地
|
|
OperationVehicle: [], // 运输车辆
|
|
});
|
|
const fnVehicle = async () => {
|
|
const res = await getOperationVehicleList();
|
|
const varList = res.varList || [];
|
|
data.OperationVehicle = varList.map((item) => item.PLATE_NUMBER);
|
|
};
|
|
|
|
const fnCustomerType = async () => {
|
|
const res = await getSecurityCustomerList();
|
|
const varList = res.varList || [];
|
|
data.clientOptions = varList.filter((item) => item.CUSTOMERTYPE === "1");
|
|
data.confirmerOptions = varList.filter((item) => item.CUSTOMERTYPE === "2");
|
|
};
|
|
|
|
const fnLocation = async () => {
|
|
const res = await getSecurityLocationList();
|
|
const varList = res.varList || [];
|
|
data.StartOptions = varList.filter((item) => item.LOCATIONTYPE === "1");
|
|
data.EndOptions = varList.filter((item) => item.LOCATIONTYPE === "2");
|
|
};
|
|
const fnDepartmentChange = async () => {
|
|
data.userList = [];
|
|
data.form.USER_IDS = [];
|
|
data.form.USER_ID = "";
|
|
await fnGetUser(data.form.DEPARTMENT_ID);
|
|
};
|
|
const fnGetPost = async (DEPARTMENT_ID) => {
|
|
const resData = await getPostListAll({ DEPARTMENT_ID });
|
|
data.postList = resData.postList;
|
|
};
|
|
const fnGetUser = async (DEPARTMENT_ID) => {
|
|
const resData = await getUserListAll({ DEPARTMENT_ID });
|
|
data.userList = resData.userList;
|
|
};
|
|
watchEffect(() => {
|
|
if (data.form.DEPARTMENT_ID) fnGetPost(data.form.DEPARTMENT_ID);
|
|
});
|
|
|
|
onMounted(async () => {
|
|
await fnPerson();
|
|
await fnCustomerType();
|
|
await fnLocation();
|
|
await fnVehicle();
|
|
});
|
|
const fnPerson = async () => {
|
|
const resData = await getSecurityPerson({});
|
|
data.unitsList = [resData.pd];
|
|
};
|
|
|
|
const fnSubmit = async () => {
|
|
await useFormValidate(formRef);
|
|
const formData = new FormData();
|
|
|
|
Object.keys(data.form).forEach((key) => {
|
|
formData.append(key, data.form[key]);
|
|
});
|
|
|
|
await addSafetyThingsChecView(formData);
|
|
ElMessage.success("添加成功");
|
|
Object.keys(data.form).forEach((key) => {
|
|
if (Array.isArray(data.form[key])) {
|
|
data.form[key] = [];
|
|
} else {
|
|
data.form[key] = "";
|
|
}
|
|
});
|
|
};
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.flexBox {
|
|
display: flex;
|
|
align-items: flex-end;
|
|
|
|
.addBtn {
|
|
margin-left: 12px;
|
|
}
|
|
}
|
|
</style>
|