| | |
| | | <div> |
| | | <el-dialog |
| | | v-model="dialogFormVisible" |
| | | :title="operationType === 'add' ? '新增离职' : '编辑人员'" |
| | | :title="operationType === 'add' ? '新增离职' : '编辑离职'" |
| | | width="70%" |
| | | @close="closeDia" |
| | | > |
| | | <el-form :model="form" label-width="140px" label-position="top" :rules="rules" ref="formRef"> |
| | | <el-row :gutter="30"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="员工编号:" prop="purchaseContractNumber"> |
| | | <el-input v-model="form.purchaseContractNumber" placeholder="请输入" clearable/> |
| | | <el-form-item label="姓名:" prop="staffName"> |
| | | <!-- <el-input v-model="form.staffName" placeholder="请输入" clearable/> --> |
| | | <el-select v-model="form.staffName" placeholder="请选择人员" style="width: 100%" @change="handleSelect"> |
| | | <el-option |
| | | v-for="item in personList" |
| | | :key="item.id" |
| | | :label="item.staffName" |
| | | :value="item.staffName" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="姓名:" prop="salesLedgerId"> |
| | | <el-input v-model="form.purchaseContractNumber" placeholder="请输入" clearable/> |
| | | <el-form-item label="员工编号:" prop="staffNo"> |
| | | <el-input v-model="form.staffNo" placeholder="请输入" clearable disabled/> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row :gutter="30"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="性别:" prop="purchaseContractNumber"> |
| | | <el-input v-model="form.purchaseContractNumber" placeholder="请输入" clearable/> |
| | | <el-form-item label="性别:" prop="sex"> |
| | | <el-select v-model="form.sex" disabled> |
| | | <el-option label="男" value="男" /> |
| | | <el-option label="女" value="女" /> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="籍贯:" prop="salesLedgerId"> |
| | | <el-input v-model="form.purchaseContractNumber" placeholder="请输入" clearable/> |
| | | <el-form-item label="籍贯:" prop="nativePlace"> |
| | | <el-input v-model="form.nativePlace" placeholder="请输入" clearable disabled/> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row :gutter="30"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="岗位:" prop="purchaseContractNumber"> |
| | | <el-input v-model="form.purchaseContractNumber" placeholder="请输入" clearable/> |
| | | <el-form-item label="岗位:" prop="postJob"> |
| | | <el-input v-model="form.postJob" placeholder="请输入" clearable disabled/> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="家庭住址:" prop="salesLedgerId"> |
| | | <el-input v-model="form.purchaseContractNumber" placeholder="请输入" clearable/> |
| | | <el-form-item label="家庭住址:" prop="adress"> |
| | | <el-input v-model="form.adress" placeholder="请输入" clearable disabled/> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row :gutter="30"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="第一学历:" prop="purchaseContractNumber"> |
| | | <el-input v-model="form.purchaseContractNumber" placeholder="请输入" clearable/> |
| | | <el-form-item label="第一学历:" prop="firstStudy"> |
| | | <el-input v-model="form.firstStudy" placeholder="请输入" clearable disabled/> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="专业:" prop="salesLedgerId"> |
| | | <el-input v-model="form.purchaseContractNumber" placeholder="请输入" clearable/> |
| | | <el-form-item label="专业:" prop="profession"> |
| | | <el-input v-model="form.profession" placeholder="请输入" clearable disabled/> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row :gutter="30"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="身份证号:" prop="purchaseContractNumber"> |
| | | <el-input v-model="form.purchaseContractNumber" placeholder="请输入" clearable/> |
| | | <el-form-item label="身份证号:" prop="identityCard"> |
| | | <el-input v-model="form.identityCard" placeholder="请输入" clearable disabled/> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="年龄:" prop="salesLedgerId"> |
| | | <el-input v-model="form.purchaseContractNumber" placeholder="请输入" clearable/> |
| | | <el-form-item label="年龄:" prop="age"> |
| | | <el-input-number v-model="form.age" :precision="0" :step="1" style="width: 100%" disabled/> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row :gutter="30"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="联系电话:" prop="purchaseContractNumber"> |
| | | <el-input v-model="form.purchaseContractNumber" placeholder="请输入" clearable/> |
| | | <el-form-item label="联系电话:" prop="phone"> |
| | | <el-input v-model="form.phone" placeholder="请输入" clearable disabled/> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="紧急联系人:" prop="salesLedgerId"> |
| | | <el-input v-model="form.purchaseContractNumber" placeholder="请输入" clearable/> |
| | | <el-form-item label="紧急联系人:" prop="emergencyContact"> |
| | | <el-input v-model="form.emergencyContact" placeholder="请输入" clearable disabled/> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row :gutter="30"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="紧急联系人联系电话:" prop="purchaseContractNumber"> |
| | | <el-input v-model="form.purchaseContractNumber" placeholder="请输入" clearable/> |
| | | <el-form-item label="紧急联系人联系电话:" prop="emergencyContactPhone"> |
| | | <el-input v-model="form.emergencyContactPhone" placeholder="请输入" clearable disabled/> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="合同年限:" prop="salesLedgerId"> |
| | | <el-input v-model="form.purchaseContractNumber" placeholder="请输入" clearable/> |
| | | <el-form-item label="合同年限:" prop="contractTerm"> |
| | | <el-input-number v-model="form.contractTerm" :precision="0" :step="1" style="width: 100%" disabled/> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row :gutter="30"> |
| | | <el-col :span="12"> |
| | | <el-form-item label="合同开始日期:" prop="purchaseContractNumber"> |
| | | <el-input v-model="form.purchaseContractNumber" placeholder="请输入" clearable/> |
| | | <el-form-item label="合同开始日期:" prop="contractStartTime"> |
| | | <el-date-picker |
| | | disabled |
| | | v-model="form.contractStartTime" |
| | | type="date" |
| | | placeholder="请选择日期" |
| | | value-format="YYYY-MM-DD" |
| | | format="YYYY-MM-DD" |
| | | clearable |
| | | style="width: 100%" |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="合同结束日期:" prop="salesLedgerId"> |
| | | <el-input v-model="form.purchaseContractNumber" placeholder="请输入" clearable/> |
| | | <el-form-item label="合同结束日期:" prop="contractEndTime"> |
| | | <el-date-picker |
| | | disabled |
| | | v-model="form.contractEndTime" |
| | | type="date" |
| | | placeholder="请选择日期" |
| | | value-format="YYYY-MM-DD" |
| | | format="YYYY-MM-DD" |
| | | clearable |
| | | style="width: 100%" |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | |
| | | |
| | | <script setup> |
| | | import {ref} from "vue"; |
| | | import {getStaffJoinInfo, staffJoinAdd, staffJoinUpdate,getStaffOnJob} from "@/api/personnelManagement/onboarding.js"; |
| | | const { proxy } = getCurrentInstance() |
| | | const emit = defineEmits(['close']) |
| | | |
| | | const dialogFormVisible = ref(false); |
| | | const operationType = ref('') |
| | | const data = reactive({ |
| | | searchForm: { |
| | | purchaseContractNumber: "", |
| | | }, |
| | | form: { |
| | | purchaseContractNumber: "", |
| | | salesLedgerId: "", |
| | | projectName: "", |
| | | recorderId: "", |
| | | entryDate: "", |
| | | productData: [], |
| | | supplierName: "", |
| | | supplierId: "", |
| | | staffNo: "", |
| | | staffName: "", |
| | | sex: "", |
| | | nativePlace: "", |
| | | postJob: "", |
| | | adress: "", |
| | | firstStudy: "", |
| | | profession: "", |
| | | identityCard: "", |
| | | age: 0, |
| | | phone: "", |
| | | emergencyContact: "", |
| | | emergencyContactPhone: "", |
| | | contractTerm: 0, |
| | | contractStartTime: "", |
| | | contractEndTime: "", |
| | | staffState: "", |
| | | }, |
| | | rules: { |
| | | purchaseContractNumber: [ |
| | | { required: true, message: "请输入", trigger: "blur" }, |
| | | ], |
| | | projectName: [{ required: true, message: "请输入", trigger: "blur" }], |
| | | supplierId: [{ required: true, message: "请输入", trigger: "blur" }], |
| | | staffNo: [{ required: true, message: "请输入", trigger: "blur" },], |
| | | staffName: [{ required: true, message: "请输入", trigger: "blur" }], |
| | | sex: [{ required: true, message: "请输入", trigger: "blur" }], |
| | | nativePlace: [{ required: true, message: "请输入", trigger: "blur" }], |
| | | postJob: [{ required: true, message: "请输入", trigger: "blur" }], |
| | | adress: [{ required: true, message: "请输入", trigger: "blur" }], |
| | | firstStudy: [{ required: true, message: "请输入", trigger: "blur" }], |
| | | profession: [{ required: true, message: "请输入", trigger: "blur" }], |
| | | identityCard: [{ required: true, message: "请输入", trigger: "blur" }], |
| | | age: [{ required: true, message: "请输入", trigger: "blur" }], |
| | | phone: [{ required: true, message: "请输入", trigger: "blur" }], |
| | | emergencyContact: [{ required: true, message: "请输入", trigger: "blur" }], |
| | | emergencyContactPhone: [{ required: true, message: "请输入", trigger: "blur" }], |
| | | contractTerm: [{ required: true, message: "请输入", trigger: "blur" }], |
| | | contractStartTime: [{ required: true, message: "请输入", trigger: "blur" }], |
| | | contractEndTime: [{ required: true, message: "请输入", trigger: "blur" }], |
| | | }, |
| | | }); |
| | | const { form, rules } = toRefs(data); |
| | | |
| | | // 打开弹框 |
| | | const openDialog = (type, row) => { |
| | | getList() |
| | | operationType.value = type; |
| | | dialogFormVisible.value = true; |
| | | if (operationType.value === 'edit') { |
| | | getStaffJoinInfo(row.id).then(res => { |
| | | form.value = {...res.data} |
| | | }) |
| | | } |
| | | } |
| | | // 提交产品表单 |
| | | const submitForm = () => { |
| | | |
| | | proxy.$refs.formRef.validate(valid => { |
| | | if (valid) { |
| | | form.value.staffState = 0 |
| | | if (operationType.value === "add") { |
| | | staffJoinAdd(form.value).then(res => { |
| | | proxy.$modal.msgSuccess("提交成功"); |
| | | closeDia(); |
| | | }) |
| | | } else { |
| | | staffJoinUpdate(form.value).then(res => { |
| | | proxy.$modal.msgSuccess("提交成功"); |
| | | closeDia(); |
| | | }) |
| | | } |
| | | } |
| | | }) |
| | | } |
| | | // 关闭弹框 |
| | | const closeDia = () => { |
| | | // proxy.resetForm("formRef"); |
| | | proxy.resetForm("formRef"); |
| | | dialogFormVisible.value = false; |
| | | emit('close') |
| | | }; |
| | | |
| | | const personList = ref([]); |
| | | |
| | | /** |
| | | * 获取当前在职人员列表 |
| | | */ |
| | | const getList = () => { |
| | | getStaffOnJob().then(res => { |
| | | personList.value = res.data |
| | | }) |
| | | }; |
| | | |
| | | const handleSelect = (val) => { |
| | | let obj = personList.value.find(item => item.staffName === val) |
| | | let { |
| | | sex, |
| | | phone, |
| | | staffNo, |
| | | nativePlace, |
| | | postJob, |
| | | adress, |
| | | firstStudy, |
| | | profession, |
| | | identityCard, |
| | | age, |
| | | emergencyContact, |
| | | emergencyContactPhone, |
| | | contractTerm, |
| | | contractStartTime, |
| | | contractEndTime, |
| | | staffName |
| | | } = obj |
| | | form.value = { |
| | | sex, |
| | | phone, |
| | | staffNo, |
| | | nativePlace, |
| | | postJob, |
| | | adress, |
| | | firstStudy, |
| | | profession, |
| | | identityCard, |
| | | age, |
| | | emergencyContact, |
| | | emergencyContactPhone, |
| | | contractTerm, |
| | | contractStartTime, |
| | | contractEndTime, |
| | | staffName |
| | | } |
| | | |
| | | } |
| | | defineExpose({ |
| | | openDialog, |
| | | }); |