在职员工增加添加功能

yijiusmile

2021-02-07 dd175a2b396fafc72a17739b41b90c3cbe733e4e

在职员工增加添加功能

 src/views/user/inemployees.vue

@@ -125,7 +125,7 @@
        <el-main>

          <el-row>

            <el-col :span="24">

              <el-button type="danger">新增员工</el-button>

              <el-button type="danger" @click="showXzyg">新增员工</el-button>

              <el-button type="primary">删除员工</el-button>

              <el-button type="danger" @click="showYgdg">员工调岗</el-button>

              <el-button type="danger" @click="showDryg">导入员工</el-button>

@@ -168,7 +168,277 @@
          />

        </el-main>

      </el-container>

    </el-container>

    </el-container>
    <el-dialog title="新增员工" :visible.sync="dialogShowXzyg" width="50%">
      <el-form ref="empBaseInfoForm" :model="empBaseInfoForm" :rules="rules" label-position="right" label-width="120px">
        <el-row>
          <el-col :span="12">
            <el-form-item label="档案号">
              <el-input v-model="empBaseInfoForm.archivesNumb" />
            </el-form-item>
            <el-form-item label="员工编号" prop="empNumb">
              <el-input v-model="empBaseInfoForm.empNumb" />
            </el-form-item>
            <el-form-item label="身份证号码">
              <el-input
                v-model="empBaseInfoForm.certificateNumb"
                @input="generateUserInfo(0,empBaseInfoForm.certificateNumb)"
              />
            </el-form-item>
            <el-form-item label="员工类别" prop="empType">
              <el-select v-model="empBaseInfoForm.empType" placeholder="请选择员工类型">
                <el-option label="正式工" value="1" />
                <el-option label="临时工" value="2" />
              </el-select>
            </el-form-item>
            <el-form-item label="民族">
              <el-select v-model="empBaseInfoForm.nation" placeholder="请选择民族">
                <el-option label="汉族" value="01" />
                <el-option label="蒙古族" value="02" />
                <el-option label="回族" value="03" />
                <el-option label="藏族" value="04" />
                <el-option label="维吾尔族" value="05" />
                <el-option label="苗族" value="06" />
                <el-option label="彝族" value="07" />
                <el-option label="壮族" value="08" />
                <el-option label="布衣族" value="09" />
                <el-option label="朝鲜族" value="10" />
                <el-option label="满族" value="11" />
                <el-option label="侗族" value="12" />
                <el-option label="瑶族" value="13" />
                <el-option label="白族" value="14" />
                <el-option label="土家族" value="15" />
                <el-option label="哈尼族" value="16" />
                <el-option label="哈萨克族" value="17" />
                <el-option label="傣族" value="18" />
                <el-option label="黎族" value="19" />
                <el-option label="傈傈族" value="20" />
                <el-option label="瓦族" value="21" />
                <el-option label="畲族" value="22" />
                <el-option label="高山族" value="23" />
                <el-option label="拉祜族" value="24" />
                <el-option label="水族" value="25" />
                <el-option label="东乡族" value="26" />
                <el-option label="纳西族" value="27" />
                <el-option label="景颇族" value="28" />
                <el-option label="柯尔克孜族" value="29" />
                <el-option label="土族" value="30" />
                <el-option label="达斡尔族" value="31" />
                <el-option label="仫佬族" value="32" />
                <el-option label="羌族" value="33" />
                <el-option label="布朗族" value="34" />
                <el-option label="撒拉族" value="35" />
                <el-option label="毛难族" value="36" />
                <el-option label="仡佬族" value="37" />
                <el-option label="锡伯族" value="38" />
                <el-option label="阿昌族" value="39" />
                <el-option label="普米族" value="40" />
                <el-option label="塔吉克族" value="41" />
                <el-option label="怒族" value="42" />
                <el-option label="乌孜别克族" value="43" />
                <el-option label="俄罗斯族" value="44" />
                <el-option label="鄂温克族" value="45" />
                <el-option label="崩龙族" value="46" />
                <el-option label="保安族" value="47" />
                <el-option label="裕固族" value="48" />
                <el-option label="京族" value="49" />
                <el-option label="塔塔尔族" value="50" />
                <el-option label="独龙族" value="51" />
                <el-option label="鄂伦春" value="52" />
                <el-option label="郝哲族" value="53" />
                <el-option label="门巴族" value="54" />
                <el-option label="珞巴族" value="55" />
                <el-option label="基诺族" value="56" />
                <el-option label="其他族" value="91" />
                <el-option label="外国民族" value="98" />
              </el-select>
            </el-form-item>
            <el-form-item label="婚姻状态">
              <el-select v-model="empBaseInfoForm.marriage" placeholder="请选择婚姻状态">
                <el-option label="未婚" value="1" />
                <el-option label="已婚" value="2" />
                <el-option label="丧偶" value="3" />
                <el-option label="离婚" value="4" />
                <el-option label="再婚" value="5" />
                <el-option label="其它" value="9" />
              </el-select>
            </el-form-item>
            <el-form-item label="身高(cm)">
              <el-input v-model="empBaseInfoForm.stature" />
            </el-form-item>
            <el-form-item label="政治面貌">
              <el-select v-model="empBaseInfoForm.politics" placeholder="请选择政治面貌">
                <el-option label="中共党员" value="01" />
                <el-option label="预备党员" value="02" />
                <el-option label="共青团员" value="03" />
                <el-option label="民革会员" value="04" />
                <el-option label="民盟盟员" value="05" />
                <el-option label="民建会员" value="06" />
                <el-option label="民进会员" value="07" />
                <el-option label="农工党员" value="08" />
                <el-option label="致公党员" value="09" />
                <el-option label="九三社员" value="10" />
                <el-option label="台盟盟员" value="11" />
                <el-option label="民主人士" value="12" />
                <el-option label="群众" value="13" />
              </el-select>
            </el-form-item>
            <el-form-item label="最高学历">
              <el-select v-model="empBaseInfoForm.education" placeholder="请选择最高学历">
                <el-option label="博士" value="10" />
                <el-option label="硕士" value="11" />
                <el-option label="大学本科" value="21" />
                <el-option label="大学专科" value="31" />
                <el-option label="中专" value="41" />
                <el-option label="中技" value="42" />
                <el-option label="高中" value="61" />
                <el-option label="初中" value="71" />
                <el-option label="小学" value="81" />
                <el-option label="无学历" value="91" />
              </el-select>
            </el-form-item>
            <el-form-item label="籍贯">
              <el-autocomplete
                v-model="empBaseInfoForm.nativePlaceName"
                class="inline-input"
                :fetch-suggestions="querySearch"
                placeholder="请输入籍贯"
                @select="placeNameSelect"
              />
            </el-form-item>
            <el-form-item label="现住址">
              <el-input v-model="empBaseInfoForm.currentAddress" />
            </el-form-item>
            <el-form-item label="电话号码">
              <el-input v-model="empBaseInfoForm.telePhone" />
            </el-form-item>
            <el-form-item label="招聘介绍人">
              <el-input v-model="empBaseInfoForm.introducer" />
            </el-form-item>
            <el-form-item label="银行名称">
              <el-input v-model="empBaseInfoForm.bankName" />
            </el-form-item>
            <el-form-item label="保险类型">
              <el-select v-model="empBaseInfoForm.insuranceType" placeholder="请选择保险类型">
                <el-option label="（深户）五险一档" value="1" />
                <el-option label="（非深户）五险一档" value="2" />
                <el-option label="（非深户）五险二档" value="3" />
                <el-option label="（非深户）五险三档" value="4" />
                <el-option label="（非深户）四险一档" value="5" />
              </el-select>
            </el-form-item>
            <el-form-item label="家庭成员及关系">
              <el-input v-model="empBaseInfoForm.family" />
            </el-form-item>
            <el-form-item label="紧急联系电话">
              <el-input v-model="empBaseInfoForm.urgencyPhone" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="姓名" prop="empName">
              <el-input v-model="empBaseInfoForm.empName" />
            </el-form-item>
            <el-form-item label="部门(护卫点)" required message="请选择护卫点" prop="deptId">
              <treeselect
                v-model="empBaseInfoForm.deptId"
                :multiple="false"
                :options="depts"
                :clear-value-text="$t('common.clear')"
                placeholder="请选择部门(护卫点)"
                style="width:100%"
              />
            </el-form-item>
            <el-form-item label="岗位" prop="jobName">
              <el-autocomplete
                v-model="empBaseInfoForm.jobName"
                class="inline-input"
                :fetch-suggestions="querySearchJob"
                placeholder="请输入岗位"
                @select="jobNameSelect"
              />
            </el-form-item>
            <el-form-item label="性别" prop="sex">
              <el-select v-model="empBaseInfoForm.sex" placeholder="请选择性别">
                <el-option label="男" value="1" />
                <el-option label="女" value="2" />
              </el-select>
            </el-form-item>
            <el-form-item label="身份证有效期">
              <el-input v-model="empBaseInfoForm.certificateValidity" />
            </el-form-item>
            <el-form-item label="年龄">
              <el-input v-model="empBaseInfoForm.age" />
            </el-form-item>
            <el-form-item label="出生日期">
              <el-date-picker
                v-model="empBaseInfoForm.birthdate"
                type="date"
                value-format="yyyy-MM-dd"
                placeholder="选择日期"
              />
            </el-form-item>
            <el-form-item label="入职日期">
              <el-date-picker
                v-model="empBaseInfoForm.entryDate"
                type="date"
                value-format="yyyy-MM-dd"
                placeholder="选择日期"
              />
            </el-form-item>
            <el-form-item label="入司工龄">
              <el-input v-model="empBaseInfoForm.seniority" />
            </el-form-item>
            <el-form-item label="户籍地址">
              <el-input v-model="empBaseInfoForm.censusAddress" />
            </el-form-item>
            <el-form-item label="保安员证号">
              <el-input v-model="empBaseInfoForm.guardNumb" />
            </el-form-item>
            <el-form-item label="保安员回执">
              <el-input v-model="empBaseInfoForm.returnReceipt" />
            </el-form-item>
            <el-form-item label="档案情况">
              <el-select v-model="empBaseInfoForm.archivesStatus" placeholder="请选择档案情况">
                <el-option label="未移交" value="0" />
                <el-option label="已移交" value="1" />
              </el-select>
            </el-form-item>
            <el-form-item label="银行账号">
              <el-input v-model="empBaseInfoForm.bankNumb" />
            </el-form-item>
            <el-form-item label="社保电脑号">
              <el-input v-model="empBaseInfoForm.socialNumb" />
            </el-form-item>
            <el-form-item label="员工手册">
              <el-select v-model="empBaseInfoForm.handbookStatus" placeholder="请选择员工手册">
                <el-option label="未发" value="0" />
                <el-option label="已发" value="1" />
              </el-select>
            </el-form-item>
            <el-form-item label="工作证">
              <el-select v-model="empBaseInfoForm.empCardStatus" placeholder="请选择工作证">
                <el-option label="未发" value="0" />
                <el-option label="已发" value="1" />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="相关证件">
              <el-select v-model="empBaseInfoForm.certificateList" placeholder="请选择相关证件">
                <el-option label="高中毕业证" value="1" />
                <el-option label="专科毕业证" value="2" />
                <el-option label="本科毕业证" value="3" />
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="putEmpBase('empBaseInfoForm')">保 存</el-button>
        <el-button type="primary" @click="putEmpBaseContinue('empBaseInfoForm')">保存并继续新增</el-button>
        <el-button @click="showXzyg()">取 消</el-button>
      </div>
    </el-dialog>

    <el-dialog id="ygxq" title="" width="100%" :visible.sync="dialogTableVisible">

      <div>

        <el-divider />

@@ -845,7 +1115,6 @@
          </el-main>

        </el-container>

      </div>



    </el-dialog>



    <el-dialog title="员工调岗" :visible.sync="dialogShowYgdg" width="50%">

@@ -941,10 +1210,12 @@
  </div>

</template>

<script>

import Pagination from '@/components/Pagination'

import Pagination from '@/components/Pagination'
import Treeselect from '@riophae/vue-treeselect'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'

export default {

  components: {

    Pagination

    Pagination, Treeselect

  },

  data() {

    return {

@@ -954,10 +1225,73 @@
      pagination: { // 分页参数

        size: 5,

        num: 1

      },
      empBaseInfoForm: {},
      depts: [],
      rules: {
        archivesNumb: [{ required: true, message: '请输入档案号', trigger: 'blur' }],
        empName: [{ required: true, message: '请输入员工姓名', trigger: 'blur' },
          { min: 2, max: 50, message: '长度在 2 到 50 个字符', trigger: 'blur' }],
        empNumb: [{ required: true, message: '请输入员工编号', trigger: 'blur' },
          { min: 2, max: 50, message: '长度在 2 到 50 个字符', trigger: 'blur' }],
        deptName: [
          { required: true, message: '请选择护卫点', trigger: 'input' }
        ],
        certificateNumb: [{ required: true, message: '请输入身份证号', trigger: 'blur' }],
        jobName: [{ required: true, message: '请选择岗位', trigger: 'change' }],
        nativePlaceName: [{ required: true, message: '请选择籍贯', trigger: 'change' }],
        bankName: [{ required: true, message: '请输入银行名称', trigger: 'blur' }],
        insuranceType: [{ required: true, message: '请选择保险类型', trigger: 'change' }],
        entryDate: [{ required: true, message: '请选择入职日期', trigger: 'change' }],
        seniority: [{ required: true, message: '请输入入司工龄', trigger: 'blur' }],
        archivesStatus: [{ required: true, message: '请选择档案情况', trigger: 'change' }],
        bankNumb: [{ required: true, message: '请输入银行账号', trigger: 'blur' }],
        empType: [{ required: true, message: '请选择员工类型', trigger: 'change' }],
        workUnit: [{ required: true, message: '请输入工作单位', trigger: 'blur' }],
        beginDate: [{ required: true, message: '请选择开始日期', trigger: 'change' }],
        endDate: [{ required: true, message: '请选择结束日期', trigger: 'change' }],
        hospital: [{ required: true, message: '请输入体检医院', trigger: 'blur' }],
        physicalExamDate: [{ required: true, message: '请选择体检日期', trigger: 'change' }],
        conclusion: [{ required: true, message: '请输入体检结论', trigger: 'blur' }],
        signingDate: [{ required: true, message: '请选择合同签订日期', trigger: 'change' }],
        contractStatus: [{ required: true, message: '请选择合同状态', trigger: 'change' }],
        attendMonth: [{ required: true, message: '请选择出勤月份', trigger: 'change' }],
        deduct: [{ required: true, message: '请输入代扣填款项', trigger: 'blur' }],
        attendDays: [{ required: true, message: '请输入出勤天数', trigger: 'blur' }],
        beginTime: [{ required: true, message: '请选择请假开始时间', trigger: 'change' }],
        leaveType: [{ required: true, message: '请选择请假类型', trigger: 'change' }],
        reporter: [{ required: true, message: '请输入报备人', trigger: 'blur' }],
        endTime: [{ required: true, message: '请选择请假结束时间', trigger: 'change' }],
        applayDate: [{ required: true, message: '请选择申请日期', trigger: 'change' }],
        reason: [{ required: true, message: '请输入辞职事由', trigger: 'blur' }],
        applayReason: [{ required: true, message: '请输入申报事由', trigger: 'blur' }],
        insuranceGaers: [{ required: true, message: '请选择社保档位', trigger: 'change' }],
        applayStatus: [{ required: true, message: '请选择申请状态', trigger: 'change' }],
        proposer: [{ required: true, message: '请输入申请人', trigger: 'blur' }],
        injuredTime: [{ required: true, message: '请选择受伤时间', trigger: 'blur' }],
        injuredPart: [{ required: true, message: '请输入受伤部位', trigger: 'blur' }],
        injuredDescribe: [{ required: true, message: '请输入受伤经过描述', trigger: 'blur' }],
        hospitalName: [{ required: true, message: '请输入就诊医院', trigger: 'blur' }],
        hospitalizatioFlag: [{ required: true, message: '请选择是否住院', trigger: 'blur' }],
        innsureFee: [{ required: true, message: '请输入保险赔付费用', trigger: 'blur' }],
        settleDate: [{ required: true, message: '请选择案结时间', trigger: 'change' }],
        expensesFee: [{ required: true, message: '请输入医疗总费用', trigger: 'blur' }],
        settleStatus: [{ required: true, message: '请选择结案状态', trigger: 'change' }],
        injuredAddress: [{ required: true, message: '请输入受伤地点', trigger: 'blur' }],
        compensated: [{ required: true, message: '请输入已赔付医药费用', trigger: 'blur' }],
        companyCompensation: [{ required: true, message: '请输入公司赔偿总费用', trigger: 'blur' }],
        arbitrationDate: [{ required: true, message: '请选择仲裁日期', trigger: 'change' }],
        arbitrationReason: [{ required: true, message: '请输入仲裁事由', trigger: 'blur' }],
        arbitrationStatus: [{ required: true, message: '请选择结案状态', trigger: 'change' }],
        badDate: [{ required: true, message: '请选择不良记录日期', trigger: 'change' }],
        badContent: [{ required: true, message: '请输入不良记录描述', trigger: 'blur' }],
        remarkDate: [{ required: true, message: '请选择备注日期', trigger: 'change' }],
        remarkContent: [{ required: true, message: '请输入备注内容', trigger: 'blur' }]
      },

      headerHeight: '70px',

      advancedQueryShow: false,

      dialogTableVisible: false,

      dialogTableVisible: false,
      dialogShowXzyg: false,

      dialogShowYgdg: false,

      dialogShowDryg: false,

      dialogShowGbda: false,

@@ -965,7 +1299,8 @@
    }

  },

  mounted() {

    this.fetch()

    this.fetch()
    this.initDept()

  },

  methods: {

    // 翻页方法

@@ -997,6 +1332,18 @@
        case 2:

          return '暂存'

      }

    },
    initDept() {
      this.$get('system/dept').then((r) => {
        this.depts = r.data.data.rows
        this.deptTree = this.depts
      }).catch((error) => {
        console.error(error)
        this.$message({
          message: this.$t('tips.getDataFail'),
          type: 'error'
        })
      })
    },

    advancedQueryShowMethods() {

      if (this.advancedQueryShow) {

@@ -1006,9 +1353,61 @@
        this.headerHeight = '300px'

        this.advancedQueryShow = true

      }

    },
    putEmpBase(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          if (this.isAdd) {
            this.$post('hr/empBaseInfo', { ...this.empBaseInfoForm }).then(() => {
              this.buttonLoading = false
              this.$message({
                message: this.$t('tips.createSuccess'),
                type: 'success'
              })
              this.cleanEmpBase()
              this.selectEmpBase()
            })
          } else {
            this.$put('hr/empBaseInfo', { ...this.empBaseInfoForm }).then(() => {
              this.$message({
                message: this.$t('tips.updateSuccess'),
                type: 'success'
              })
              this.$emit('success')
              this.cleanEmpBase()
              this.selectEmpBase()
            })
          }
          this.dialogIsShow()
        }
      })
    },
    putEmpBaseContinue(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          if (this.isAdd) {
            this.$post('hr/empBaseInfo', { ...this.empBaseInfoForm }).then(() => {
              this.buttonLoading = false
              this.$message({
                message: this.$t('tips.createSuccess'),
                type: 'success'
              })
              this.cleanEmpBase()
              this.selectEmpBase()
            })
          }
        }
      })
    },

    showEmpInfo() {

      this.dialogTableVisible = true

    },
    showXzyg() {
      if (!this.dialogShowXzyg) {
        this.dialogShowXzyg = true
      } else {
        this.dialogShowXzyg = false
      }
    },

    showYgdg() {

      this.dialogShowYgdg = true

@@ -1025,6 +1424,12 @@
<style lang="scss" scoped>

  .el-main {

    height: 600px;

  }
  .el-autocomplete {
    width: 100%;
  }
  .el-select {
    width: 100%;
  }

  .el-aside {

    padding: 20px;