fix: BUG修改
This commit is contained in:
parent
21ef709e0c
commit
319d90b99d
@ -0,0 +1,113 @@
|
||||
<template>
|
||||
<div class="duty">
|
||||
<el-steps class="steps" :active="active" align-center>
|
||||
<el-step
|
||||
style="cursor: pointer"
|
||||
v-for="(item, i) in stepOptions"
|
||||
:key="item.dictCode"
|
||||
:title="item.dictValue?.slice(0, 2)"
|
||||
@click="active = i"
|
||||
/>
|
||||
</el-steps>
|
||||
|
||||
<duty-form :form-config="formConfig" />
|
||||
|
||||
<footer class="footer">
|
||||
<el-button class="btnStyle" :type="isAllowNext ? 'primary' : 'default'" @click="handleToPrevOrNext">{{
|
||||
isAllowNext ? "下一步" : "上一步"
|
||||
}}</el-button>
|
||||
</footer>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref, reactive, watch, computed, onMounted, onUnmounted } from "vue";
|
||||
import dutyForm from "./dutyForm.vue";
|
||||
import { formData, datas, rules, reset } from "./duty";
|
||||
import { getDicList } from "@/api/modules/jxjview";
|
||||
import type { ResDictData } from "@/api/types";
|
||||
import type { EngineeringMainList } from "./duty";
|
||||
import type { Type } from "./overview";
|
||||
import { GlobalStore } from "@/stores";
|
||||
import { ElMessage } from "element-plus";
|
||||
const store = GlobalStore();
|
||||
|
||||
const emit = defineEmits<{
|
||||
(e: "next", data: { engineeringMains: EngineeringMainList }): void;
|
||||
(e: "prev", data: void): void;
|
||||
}>();
|
||||
|
||||
const active = ref(0),
|
||||
stepOptions = ref<ResDictData["result"]>([]);
|
||||
|
||||
const formConfig = reactive({
|
||||
formData: formData.value[active.value],
|
||||
datas,
|
||||
rules
|
||||
});
|
||||
|
||||
const isAllowNext = computed(() => active.value >= stepOptions.value.length - 1);
|
||||
|
||||
const handleToPrevOrNext = () => {
|
||||
if (isAllowNext.value) {
|
||||
console.log(formData.value, 777888);
|
||||
const isInValid = formData.value.find((item: any) => {
|
||||
// return !item.enterpriseSn || !item.creditCode || ("contractType" in item && !item.contractType);
|
||||
return ![4, 5].includes(item.type) && (!item.enterpriseSn || !item.creditCode);
|
||||
});
|
||||
|
||||
if (isInValid) return ElMessage.warning("请输入必填项");
|
||||
emit("next", { engineeringMains: formData.value });
|
||||
} else {
|
||||
emit("prev");
|
||||
}
|
||||
};
|
||||
|
||||
watch(
|
||||
() => active.value,
|
||||
() => {
|
||||
console.log("datas", formData.value);
|
||||
formConfig.formData = formData.value[active.value];
|
||||
formConfig.datas.enterpriseSn = stepOptions.value[active.value].dictValue + "名称";
|
||||
}
|
||||
);
|
||||
|
||||
onMounted(async () => {
|
||||
const data = await getDicList({ dictType: "enterprise_main", status: 1, isDefault: "Y" });
|
||||
stepOptions.value = data.result;
|
||||
formData.value = formData.value.map((item, index) => ({
|
||||
...item,
|
||||
type: data.result[index].dictLabel as Type
|
||||
}));
|
||||
formConfig.formData = formData.value[active.value];
|
||||
formConfig.datas.enterpriseSn = stepOptions.value[active.value].dictValue + "名称";
|
||||
|
||||
if (store.Message && store.Message.engineeringMains.length) {
|
||||
formData.value = formData.value.map(item => {
|
||||
// console.log("main", store.Message.engineeringMains);
|
||||
let curr = store.Message.engineeringMains.find(main => item.type == main.type);
|
||||
if ("contractType" in item) {
|
||||
return (curr = {
|
||||
...curr,
|
||||
enterpriseSn: curr.enterpriseSn,
|
||||
creditCode: curr.creditCode,
|
||||
legalPerson: curr.legalPerson,
|
||||
legalPersonTel: curr.legalPersonTel,
|
||||
contractType: curr.contractType
|
||||
});
|
||||
} else {
|
||||
delete curr["contractType"];
|
||||
return curr;
|
||||
}
|
||||
});
|
||||
|
||||
formConfig.formData = formData.value[active.value];
|
||||
}
|
||||
});
|
||||
|
||||
onUnmounted(() => reset());
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import "./duty.scss";
|
||||
</style>
|
||||
@ -5,6 +5,13 @@
|
||||
.steps {
|
||||
padding: 2% 6%;
|
||||
}
|
||||
.add-btn {
|
||||
margin-bottom: 20px;
|
||||
margin-right: 6%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
v-deep {
|
||||
.is-process {
|
||||
color: #018bfe;
|
||||
|
||||
@ -12,50 +12,101 @@ export interface FormData {
|
||||
}
|
||||
|
||||
export type EngineeringMainList = Array<FormData & EngineeringMain>;
|
||||
|
||||
export const formData = ref<EngineeringMainList>([
|
||||
{
|
||||
enterpriseSn: "",
|
||||
creditCode: "",
|
||||
legalPerson: "",
|
||||
legalPersonTel: "",
|
||||
type: undefined,
|
||||
engineeringMainPersonList: []
|
||||
},
|
||||
{
|
||||
enterpriseSn: "",
|
||||
creditCode: "",
|
||||
legalPerson: "",
|
||||
legalPersonTel: "",
|
||||
type: undefined,
|
||||
engineeringMainPersonList: []
|
||||
},
|
||||
{
|
||||
enterpriseSn: "",
|
||||
creditCode: "",
|
||||
legalPerson: "",
|
||||
legalPersonTel: "",
|
||||
contractType: "",
|
||||
type: undefined,
|
||||
engineeringMainPersonList: []
|
||||
},
|
||||
{
|
||||
enterpriseSn: "",
|
||||
creditCode: "",
|
||||
legalPerson: "",
|
||||
legalPersonTel: "",
|
||||
type: undefined,
|
||||
engineeringMainPersonList: []
|
||||
},
|
||||
{
|
||||
enterpriseSn: "",
|
||||
creditCode: "",
|
||||
legalPerson: "",
|
||||
legalPersonTel: "",
|
||||
type: undefined,
|
||||
engineeringMainPersonList: []
|
||||
}
|
||||
export const formData = ref([
|
||||
[
|
||||
{
|
||||
enterpriseSn: "",
|
||||
creditCode: "",
|
||||
legalPerson: "",
|
||||
legalPersonTel: "",
|
||||
type: undefined,
|
||||
engineeringMainPersonList: []
|
||||
}
|
||||
],
|
||||
[
|
||||
{
|
||||
enterpriseSn: "",
|
||||
creditCode: "",
|
||||
legalPerson: "",
|
||||
legalPersonTel: "",
|
||||
type: undefined,
|
||||
engineeringMainPersonList: []
|
||||
}
|
||||
],
|
||||
[
|
||||
{
|
||||
enterpriseSn: "",
|
||||
creditCode: "",
|
||||
legalPerson: "",
|
||||
legalPersonTel: "",
|
||||
type: undefined,
|
||||
engineeringMainPersonList: []
|
||||
}
|
||||
],
|
||||
[
|
||||
{
|
||||
enterpriseSn: "",
|
||||
creditCode: "",
|
||||
legalPerson: "",
|
||||
legalPersonTel: "",
|
||||
type: undefined,
|
||||
engineeringMainPersonList: []
|
||||
}
|
||||
],
|
||||
[
|
||||
{
|
||||
enterpriseSn: "",
|
||||
creditCode: "",
|
||||
legalPerson: "",
|
||||
legalPersonTel: "",
|
||||
type: undefined,
|
||||
engineeringMainPersonList: []
|
||||
}
|
||||
]
|
||||
]);
|
||||
// export const formData = ref<EngineeringMainList>([
|
||||
// {
|
||||
// enterpriseSn: "",
|
||||
// creditCode: "",
|
||||
// legalPerson: "",
|
||||
// legalPersonTel: "",
|
||||
// type: undefined,
|
||||
// engineeringMainPersonList: []
|
||||
// },
|
||||
// {
|
||||
// enterpriseSn: "",
|
||||
// creditCode: "",
|
||||
// legalPerson: "",
|
||||
// legalPersonTel: "",
|
||||
// type: undefined,
|
||||
// engineeringMainPersonList: []
|
||||
// },
|
||||
// {
|
||||
// enterpriseSn: "",
|
||||
// creditCode: "",
|
||||
// legalPerson: "",
|
||||
// legalPersonTel: "",
|
||||
// contractType: "",
|
||||
// type: undefined,
|
||||
// engineeringMainPersonList: []
|
||||
// },
|
||||
// {
|
||||
// enterpriseSn: "",
|
||||
// creditCode: "",
|
||||
// legalPerson: "",
|
||||
// legalPersonTel: "",
|
||||
// type: undefined,
|
||||
// engineeringMainPersonList: []
|
||||
// },
|
||||
// {
|
||||
// enterpriseSn: "",
|
||||
// creditCode: "",
|
||||
// legalPerson: "",
|
||||
// legalPersonTel: "",
|
||||
// type: undefined,
|
||||
// engineeringMainPersonList: []
|
||||
// }
|
||||
// ]);
|
||||
|
||||
export const datas = ref<EngineeringMainList[number]>({
|
||||
enterpriseSn: "建设单位名称",
|
||||
|
||||
@ -9,7 +9,9 @@
|
||||
@click="active = i"
|
||||
/>
|
||||
</el-steps>
|
||||
|
||||
<div class="add-btn">
|
||||
<el-button class="btnStyle" type="primary" @click="addEnterpriseData">添加</el-button>
|
||||
</div>
|
||||
<duty-form :form-config="formConfig" />
|
||||
|
||||
<footer class="footer">
|
||||
@ -47,13 +49,28 @@ const formConfig = reactive({
|
||||
});
|
||||
|
||||
const isAllowNext = computed(() => active.value >= stepOptions.value.length - 1);
|
||||
|
||||
const addEnterpriseData = () => {
|
||||
formData.value[active.value].push({
|
||||
enterpriseSn: "",
|
||||
creditCode: "",
|
||||
legalPerson: "",
|
||||
legalPersonTel: "",
|
||||
type: stepOptions.value[active.value].dictLabel as any,
|
||||
engineeringMainPersonList: []
|
||||
});
|
||||
};
|
||||
const handleToPrevOrNext = () => {
|
||||
if (isAllowNext.value) {
|
||||
console.log(formData.value, 777888);
|
||||
const isInValid = formData.value.find((item: any) => {
|
||||
let isInValid = false;
|
||||
formData.value.map((item: any) => {
|
||||
item.map((item2: any) => {
|
||||
if (![4, 5].includes(item2.type) && (!item2.enterpriseSn || !item2.creditCode)) {
|
||||
isInValid = true;
|
||||
}
|
||||
});
|
||||
// return !item.enterpriseSn || !item.creditCode || ("contractType" in item && !item.contractType);
|
||||
return ![4, 5].includes(item.type) && (!item.enterpriseSn || !item.creditCode);
|
||||
return;
|
||||
});
|
||||
|
||||
if (isInValid) return ElMessage.warning("请输入必填项");
|
||||
@ -75,34 +92,39 @@ watch(
|
||||
onMounted(async () => {
|
||||
const data = await getDicList({ dictType: "enterprise_main", status: 1, isDefault: "Y" });
|
||||
stepOptions.value = data.result;
|
||||
formData.value = formData.value.map((item, index) => ({
|
||||
...item,
|
||||
type: data.result[index].dictLabel as Type
|
||||
}));
|
||||
console.log(formData.value, 778899);
|
||||
formData.value.map((item, index) => {
|
||||
console.log(item);
|
||||
item.map((item2, index2) => {
|
||||
console.log(item2);
|
||||
item2.type = data.result[index].dictLabel as Type;
|
||||
});
|
||||
});
|
||||
// console.log(formData.value, 112233);
|
||||
formConfig.formData = formData.value[active.value];
|
||||
formConfig.datas.enterpriseSn = stepOptions.value[active.value].dictValue + "名称";
|
||||
|
||||
if (store.Message && store.Message.engineeringMains.length) {
|
||||
formData.value = formData.value.map(item => {
|
||||
// console.log("main", store.Message.engineeringMains);
|
||||
let curr = store.Message.engineeringMains.find(main => item.type == main.type);
|
||||
if ("contractType" in item) {
|
||||
return (curr = {
|
||||
...curr,
|
||||
enterpriseSn: curr.enterpriseSn,
|
||||
creditCode: curr.creditCode,
|
||||
legalPerson: curr.legalPerson,
|
||||
legalPersonTel: curr.legalPersonTel,
|
||||
contractType: curr.contractType
|
||||
});
|
||||
} else {
|
||||
delete curr["contractType"];
|
||||
return curr;
|
||||
}
|
||||
});
|
||||
// if (store.Message && store.Message.engineeringMains.length) {
|
||||
// formData.value = formData.value.map(item => {
|
||||
// console.log("main", store.Message.engineeringMains);
|
||||
// let curr = store.Message.engineeringMains.find(main => item.type == main.type);
|
||||
// if ("contractType" in item) {
|
||||
// return (curr = {
|
||||
// ...curr,
|
||||
// enterpriseSn: curr.enterpriseSn,
|
||||
// creditCode: curr.creditCode,
|
||||
// legalPerson: curr.legalPerson,
|
||||
// legalPersonTel: curr.legalPersonTel,
|
||||
// contractType: curr.contractType
|
||||
// });
|
||||
// } else {
|
||||
// delete curr["contractType"];
|
||||
// return curr;
|
||||
// }
|
||||
// });
|
||||
|
||||
formConfig.formData = formData.value[active.value];
|
||||
}
|
||||
// formConfig.formData = formData.value[active.value];
|
||||
// }
|
||||
});
|
||||
|
||||
onUnmounted(() => reset());
|
||||
|
||||
@ -0,0 +1,189 @@
|
||||
<template>
|
||||
<div class="duty-form">
|
||||
<div class="add-btn">
|
||||
<el-button class="btnStyle" type="primary">添加</el-button>
|
||||
</div>
|
||||
<el-form class="form" ref="formRef" :model="formData" :rules="formConfig.rules" label-width="150px">
|
||||
<div class="row">
|
||||
<template v-for="(val, key) in formData" :key="datas[key]">
|
||||
<el-form-item
|
||||
v-if="Object.keys(datas).includes(key)"
|
||||
class="form-item"
|
||||
:prop="formData.type != 4 && formData.type != 5 ? key : ''"
|
||||
:label="datas[key]"
|
||||
>
|
||||
<el-select
|
||||
class="select"
|
||||
v-if="key === 'enterpriseSn'"
|
||||
style="width: 100%"
|
||||
@change="onChange"
|
||||
v-model="formData[key]"
|
||||
>
|
||||
<el-option value="" @click="openAddDialog" v-show="formData.type != 1">
|
||||
<div class="selectAdd">
|
||||
<el-icon><circle-plus /></el-icon>
|
||||
<span>新建</span>
|
||||
</div>
|
||||
</el-option>
|
||||
<el-option
|
||||
v-for="item in nameOptions"
|
||||
:key="item.enterpriseSn"
|
||||
:label="item.enterpriseName"
|
||||
:value="item.enterpriseSn"
|
||||
/>
|
||||
</el-select>
|
||||
<!-- <div v-if="key === 'enterpriseSn'" class="search">
|
||||
<el-icon class="icon"><Search /></el-icon>
|
||||
</div> -->
|
||||
<el-input v-else v-model="formData[key]" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</div>
|
||||
</el-form>
|
||||
|
||||
<el-table
|
||||
:data="formData.engineeringMainPersonList"
|
||||
height="400"
|
||||
max-height="500"
|
||||
class="el-table"
|
||||
:header-cell-style="{ textAlign: 'center' }"
|
||||
:cell-style="{ textAlign: 'center' }"
|
||||
>
|
||||
<el-table-column prop="name" label="姓名">
|
||||
<template #default="{ row }">
|
||||
<el-input style="text-align: center" class="test" v-model="row.name" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="jobId" label="职务">
|
||||
<template #default="{ row }">
|
||||
<el-select class="select" v-model="row.jobId">
|
||||
<el-option v-for="item in jobOptions" :key="item.dictCode" :label="item.dictValue" :value="item.dictLabel" />
|
||||
</el-select>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="station" label="职称/岗位">
|
||||
<template #default="{ row }">
|
||||
<el-input class="test" v-model="row.station" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="stationCode" label="职称证号/岗位证号">
|
||||
<template #default="{ row }">
|
||||
<el-input class="test" v-model="row.stationCode" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="idCard" label="身份证号">
|
||||
<template #default="{ row }">
|
||||
<el-input class="test" v-model="row.idCard" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="phone" label="联系电话">
|
||||
<template #default="{ row }">
|
||||
<el-input class="test" v-model="row.phone" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column fixed="right" width="100">
|
||||
<template #header>
|
||||
<el-button type="primary" round @click="addEngineeringMainPerson">新增</el-button>
|
||||
</template>
|
||||
|
||||
<template #default="{ row }">
|
||||
<el-button type="danger" link @click="removeEngineeringMainPerson(row)">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- 表格无数据情况 -->
|
||||
<template #empty>
|
||||
<div class="table-empty">
|
||||
<slot name="empty">
|
||||
<img src="@/assets/images/notData.png" alt="notData" />
|
||||
<div>暂无数据</div>
|
||||
</slot>
|
||||
</div>
|
||||
</template>
|
||||
</el-table>
|
||||
<addCompany v-model:detailsDialog="openAddCompany" :relativeInfo="companyType" @confirm="allConfirm"></addCompany>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref, computed, watch, onMounted, reactive } from "vue";
|
||||
import { Search } from "@element-plus/icons-vue";
|
||||
import { queryMainType } from "@/api/modules/project";
|
||||
import { getDicList } from "@/api/modules/jxjview";
|
||||
import type { FormRules } from "element-plus";
|
||||
import type { EngineeringMainPerson } from "@/api/types";
|
||||
import type { EngineeringMainList } from "./duty";
|
||||
import addCompany from "../../../assessmentManagement/unitList/components/addCompany.vue";
|
||||
|
||||
export interface formConfig {
|
||||
formData: EngineeringMainList[number];
|
||||
rules: FormRules;
|
||||
datas: EngineeringMainList[number];
|
||||
}
|
||||
const openAddCompany = ref(false);
|
||||
const companyType = ref({});
|
||||
const props = defineProps<{
|
||||
formConfig: formConfig;
|
||||
}>();
|
||||
|
||||
const formData = computed(() => props.formConfig.formData),
|
||||
datas = computed(() => props.formConfig.datas);
|
||||
|
||||
const nameOptions = ref([{ enterpriseSn: "", enterpriseName: "", creditCode: "", legalPerson: "", legalPersonTel: "" }]),
|
||||
jobOptions = ref([{ dictCode: "", dictValue: "", dictLabel: undefined }]);
|
||||
|
||||
watch(
|
||||
() => formData.value.type,
|
||||
(n, o) => {
|
||||
getMainData();
|
||||
}
|
||||
);
|
||||
const allConfirm = () => {
|
||||
getMainData();
|
||||
};
|
||||
const openAddDialog = () => {
|
||||
companyType.value = reactive({
|
||||
dictLabel: formData.value.type
|
||||
});
|
||||
openAddCompany.value = true;
|
||||
};
|
||||
const onChange = (option: any) => {
|
||||
// const value = nameOptions.value.find(item => item.enterpriseSn == option[option.length - 1]);
|
||||
const value = nameOptions.value.find(item => item.enterpriseSn == option);
|
||||
if (!value) return;
|
||||
formData.value.creditCode = value.creditCode;
|
||||
formData.value.legalPerson = value.legalPerson;
|
||||
formData.value.legalPersonTel = value.legalPersonTel;
|
||||
};
|
||||
|
||||
const addEngineeringMainPerson = () => {
|
||||
formData.value.engineeringMainPersonList?.push({
|
||||
name: "",
|
||||
jobId: "",
|
||||
station: "",
|
||||
stationCode: "",
|
||||
idCard: "",
|
||||
phone: ""
|
||||
});
|
||||
};
|
||||
|
||||
const removeEngineeringMainPerson = (row: EngineeringMainPerson) => {
|
||||
const index = formData.value.engineeringMainPersonList?.indexOf(row);
|
||||
// index && index >= 0 && formData.value.engineeringMainPersonList?.splice(index, 1);
|
||||
!index >= 0 && formData.value.engineeringMainPersonList?.splice(index, 1);
|
||||
};
|
||||
const getMainData = async () => {
|
||||
const data = await queryMainType({ mainType: formData.value.type });
|
||||
nameOptions.value = data.result;
|
||||
};
|
||||
onMounted(async () => {
|
||||
const res = await getDicList({ dictType: "engineering_post" });
|
||||
jobOptions.value = res.result;
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import "./dutyForm.scss";
|
||||
.test :deep(.el-input__inner) {
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
@ -1,11 +1,8 @@
|
||||
.duty-form {
|
||||
flex: 1;
|
||||
padding: 0 6%;
|
||||
.add-btn {
|
||||
margin-bottom: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
.form > div:not(:last-child) {
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
.row {
|
||||
display: flex;
|
||||
|
||||
@ -1,105 +1,109 @@
|
||||
<template>
|
||||
<div class="duty-form">
|
||||
<!-- <div class="add-btn">
|
||||
<el-button class="btnStyle" type="primary">添加</el-button>
|
||||
</div> -->
|
||||
<el-form class="form" ref="formRef" :model="formData" :rules="formConfig.rules" label-width="150px">
|
||||
<div class="row">
|
||||
<template v-for="(val, key) in formData" :key="datas[key]">
|
||||
<el-form-item
|
||||
v-if="Object.keys(datas).includes(key)"
|
||||
class="form-item"
|
||||
:prop="formData.type != 4 && formData.type != 5 ? key : ''"
|
||||
:label="datas[key]"
|
||||
>
|
||||
<el-select
|
||||
class="select"
|
||||
v-if="key === 'enterpriseSn'"
|
||||
style="width: 100%"
|
||||
@change="onChange"
|
||||
v-model="formData[key]"
|
||||
<div v-for="(item, index) in formData" :key="index">
|
||||
<div class="row">
|
||||
<template v-for="(val, key) in item" :key="datas[key]">
|
||||
<!-- :prop="item.type != 4 && item.type != 5 ? item[key] : ''" -->
|
||||
<el-form-item
|
||||
v-if="Object.keys(datas).includes(key)"
|
||||
class="form-item"
|
||||
:rules="
|
||||
item.type != 4 && item.type != 5 && key === 'enterpriseSn'
|
||||
? [{ required: true, message: '请选择', trigger: 'blur' }]
|
||||
: []
|
||||
"
|
||||
:label="datas[key]"
|
||||
>
|
||||
<el-option value="" @click="openAddDialog" v-show="formData.type != 1">
|
||||
<div class="selectAdd">
|
||||
<el-icon><circle-plus /></el-icon>
|
||||
<span>新建</span>
|
||||
</div>
|
||||
</el-option>
|
||||
<el-option
|
||||
v-for="item in nameOptions"
|
||||
:key="item.enterpriseSn"
|
||||
:label="item.enterpriseName"
|
||||
:value="item.enterpriseSn"
|
||||
/>
|
||||
</el-select>
|
||||
<!-- <div v-if="key === 'enterpriseSn'" class="search">
|
||||
<el-icon class="icon"><Search /></el-icon>
|
||||
</div> -->
|
||||
<el-input v-else v-model="formData[key]" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
<el-select
|
||||
class="select"
|
||||
v-if="key === 'enterpriseSn'"
|
||||
style="width: 100%"
|
||||
@change="option => onChange(option, index)"
|
||||
v-model="item[key]"
|
||||
>
|
||||
<el-option value="" @click="openAddDialog" v-show="item.type != 1">
|
||||
<div class="selectAdd">
|
||||
<el-icon><circle-plus /></el-icon>
|
||||
<span>新建</span>
|
||||
</div>
|
||||
</el-option>
|
||||
<el-option
|
||||
v-for="item2 in nameOptions"
|
||||
:key="item2.enterpriseSn"
|
||||
:label="item2.enterpriseName"
|
||||
:value="item2.enterpriseSn"
|
||||
/>
|
||||
</el-select>
|
||||
<!-- <div v-if="key === 'enterpriseSn'" class="search">
|
||||
<el-icon class="icon"><Search /></el-icon>
|
||||
</div> -->
|
||||
<el-input v-else v-model="item[key]" />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</div>
|
||||
|
||||
<el-table
|
||||
:data="item.engineeringMainPersonList"
|
||||
height="400"
|
||||
max-height="500"
|
||||
class="el-table"
|
||||
:header-cell-style="{ textAlign: 'center' }"
|
||||
:cell-style="{ textAlign: 'center' }"
|
||||
>
|
||||
<el-table-column prop="name" label="姓名">
|
||||
<template #default="{ row }">
|
||||
<el-input style="text-align: center" class="test" v-model="row.name" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="jobId" label="职务">
|
||||
<template #default="{ row }">
|
||||
<el-select class="select" v-model="row.jobId">
|
||||
<el-option v-for="item in jobOptions" :key="item.dictCode" :label="item.dictValue" :value="item.dictLabel" />
|
||||
</el-select>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="station" label="职称/岗位">
|
||||
<template #default="{ row }">
|
||||
<el-input class="test" v-model="row.station" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="stationCode" label="职称证号/岗位证号">
|
||||
<template #default="{ row }">
|
||||
<el-input class="test" v-model="row.stationCode" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="idCard" label="身份证号">
|
||||
<template #default="{ row }">
|
||||
<el-input class="test" v-model="row.idCard" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="phone" label="联系电话">
|
||||
<template #default="{ row }">
|
||||
<el-input class="test" v-model="row.phone" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column fixed="right" width="100">
|
||||
<template #header>
|
||||
<el-button type="primary" round @click="addEngineeringMainPerson(index)">新增</el-button>
|
||||
</template>
|
||||
|
||||
<template #default="{ row }">
|
||||
<el-button type="danger" link @click="removeEngineeringMainPerson(row, index)">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- 表格无数据情况 -->
|
||||
<template #empty>
|
||||
<div class="table-empty">
|
||||
<slot name="empty">
|
||||
<img src="@/assets/images/notData.png" alt="notData" />
|
||||
<div>暂无数据</div>
|
||||
</slot>
|
||||
</div>
|
||||
</template>
|
||||
</el-table>
|
||||
</div>
|
||||
</el-form>
|
||||
|
||||
<el-table
|
||||
:data="formData.engineeringMainPersonList"
|
||||
height="400"
|
||||
max-height="500"
|
||||
class="el-table"
|
||||
:header-cell-style="{ textAlign: 'center' }"
|
||||
:cell-style="{ textAlign: 'center' }"
|
||||
>
|
||||
<el-table-column prop="name" label="姓名">
|
||||
<template #default="{ row }">
|
||||
<el-input style="text-align: center" class="test" v-model="row.name" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="jobId" label="职务">
|
||||
<template #default="{ row }">
|
||||
<el-select class="select" v-model="row.jobId">
|
||||
<el-option v-for="item in jobOptions" :key="item.dictCode" :label="item.dictValue" :value="item.dictLabel" />
|
||||
</el-select>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="station" label="职称/岗位">
|
||||
<template #default="{ row }">
|
||||
<el-input class="test" v-model="row.station" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="stationCode" label="职称证号/岗位证号">
|
||||
<template #default="{ row }">
|
||||
<el-input class="test" v-model="row.stationCode" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="idCard" label="身份证号">
|
||||
<template #default="{ row }">
|
||||
<el-input class="test" v-model="row.idCard" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="phone" label="联系电话">
|
||||
<template #default="{ row }">
|
||||
<el-input class="test" v-model="row.phone" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column fixed="right" width="100">
|
||||
<template #header>
|
||||
<el-button type="primary" round @click="addEngineeringMainPerson">新增</el-button>
|
||||
</template>
|
||||
|
||||
<template #default="{ row }">
|
||||
<el-button type="danger" link @click="removeEngineeringMainPerson(row)">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- 表格无数据情况 -->
|
||||
<template #empty>
|
||||
<div class="table-empty">
|
||||
<slot name="empty">
|
||||
<img src="@/assets/images/notData.png" alt="notData" />
|
||||
<div>暂无数据</div>
|
||||
</slot>
|
||||
</div>
|
||||
</template>
|
||||
</el-table>
|
||||
<addCompany v-model:detailsDialog="openAddCompany" :relativeInfo="companyType" @confirm="allConfirm"></addCompany>
|
||||
</div>
|
||||
</template>
|
||||
@ -130,11 +134,13 @@ const formData = computed(() => props.formConfig.formData),
|
||||
|
||||
const nameOptions = ref([{ enterpriseSn: "", enterpriseName: "", creditCode: "", legalPerson: "", legalPersonTel: "" }]),
|
||||
jobOptions = ref([{ dictCode: "", dictValue: "", dictLabel: undefined }]);
|
||||
|
||||
watch(
|
||||
() => formData.value.type,
|
||||
() => props.formConfig,
|
||||
(n, o) => {
|
||||
getMainData();
|
||||
},
|
||||
{
|
||||
deep: true
|
||||
}
|
||||
);
|
||||
const allConfirm = () => {
|
||||
@ -142,21 +148,21 @@ const allConfirm = () => {
|
||||
};
|
||||
const openAddDialog = () => {
|
||||
companyType.value = reactive({
|
||||
dictLabel: formData.value.type
|
||||
dictLabel: formData.value[0].type
|
||||
});
|
||||
openAddCompany.value = true;
|
||||
};
|
||||
const onChange = (option: any) => {
|
||||
const onChange = (option: any, index: number) => {
|
||||
// const value = nameOptions.value.find(item => item.enterpriseSn == option[option.length - 1]);
|
||||
const value = nameOptions.value.find(item => item.enterpriseSn == option);
|
||||
if (!value) return;
|
||||
formData.value.creditCode = value.creditCode;
|
||||
formData.value.legalPerson = value.legalPerson;
|
||||
formData.value.legalPersonTel = value.legalPersonTel;
|
||||
formData.value[index].creditCode = value.creditCode;
|
||||
formData.value[index].legalPerson = value.legalPerson;
|
||||
formData.value[index].legalPersonTel = value.legalPersonTel;
|
||||
};
|
||||
|
||||
const addEngineeringMainPerson = () => {
|
||||
formData.value.engineeringMainPersonList?.push({
|
||||
const addEngineeringMainPerson = (index: any) => {
|
||||
formData.value[index].engineeringMainPersonList?.push({
|
||||
name: "",
|
||||
jobId: "",
|
||||
station: "",
|
||||
@ -166,18 +172,19 @@ const addEngineeringMainPerson = () => {
|
||||
});
|
||||
};
|
||||
|
||||
const removeEngineeringMainPerson = (row: EngineeringMainPerson) => {
|
||||
const index = formData.value.engineeringMainPersonList?.indexOf(row);
|
||||
const removeEngineeringMainPerson = (row: EngineeringMainPerson, ind: number) => {
|
||||
const index = formData.value[ind].engineeringMainPersonList?.indexOf(row);
|
||||
// index && index >= 0 && formData.value.engineeringMainPersonList?.splice(index, 1);
|
||||
!index >= 0 && formData.value.engineeringMainPersonList?.splice(index, 1);
|
||||
!index >= 0 && formData.value[ind].engineeringMainPersonList?.splice(index, 1);
|
||||
};
|
||||
const getMainData = async () => {
|
||||
const data = await queryMainType({ mainType: formData.value.type });
|
||||
const data = await queryMainType({ mainType: formData.value[0].type });
|
||||
nameOptions.value = data.result;
|
||||
};
|
||||
onMounted(async () => {
|
||||
const res = await getDicList({ dictType: "engineering_post" });
|
||||
jobOptions.value = res.result;
|
||||
getMainData();
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user