feat(dashboard): 添加四险提醒功能并优化员工管理界面

yubo

2026-03-11 4c72dd4e55dbfae3dca4a7ac4342220e93f25a8b

 src/views/dashboard/onTheJobUser.vue

@@ -2,9 +2,11 @@
  <el-dialog
    :title="title"
    top="50px"
    width="80%"
    :close-on-click-modal="false"
    :close-on-press-escape="false"
    :visible.sync="isVisible"
    :before-close="beforeClose"
  >
    <div class="app-container">
      <div class="filter-container" style="margin-left: -340px;">
@@ -20,33 +22,31 @@
        ref="multipleTable"
        :data="list"
        row-key="prop1"
        width="50%"
        stripe
        border
        :cell-style="{padding:'7px 0','text-align':'center'}"
        :header-cell-style="{'height':'5.3vh','background-color':'#e6e6e6','text-align':'center'}"
        style="width: 100%;"
      >
        <el-table-column type="selection" :reserve-selection="false" width="55" />
        <el-table-column prop="empNumb" label="员工编号" width="100" />
        <el-table-column prop="empName" label="姓名" width="100" />
        <el-table-column prop="deptName" label="护卫点" width="100" />
        <el-table-column prop="jobName" label="岗位" width="100" />
        <el-table-column prop="empTypeName" label="员工类别" width="100" />
        <el-table-column prop="dimissionDate" label="离职日期" width="100" />
        <el-table-column prop="dimissionTypeName" label="离职类别" width="100" />
        <el-table-column prop="applayDate" label="辞职申请日期" width="180" />
        <el-table-column prop="reason" label="辞职事由" width="180" />
        <el-table-column prop="reporter" label="汇报人" width="180" />
        <el-table-column prop="sexName" label="性别" width="50" />
        <el-table-column prop="age" label="年龄" width="50" />
        <el-table-column prop="nationName" label="民族" width="100" />
        <el-table-column prop="certificateNumb" label="身份证号码" width="180" />
        <el-table-column prop="certificateValidity" label="身份证号码有效期" width="180" />
        <el-table-column prop="marriageName" label="婚姻状况" width="80" />
        <el-table-column prop="politicsName" label="政治面貌" width="100" />
        <el-table-column prop="educationName" label="最高学历" width="100" />
        <el-table-column prop="entryDate" label="入职日期" width="100" />
        <el-table-column prop="insuranceType" label="保险类型" width="100" />
        <el-table-column prop="socialNumb" label="社保电脑号" width="150" />
        <el-table-column prop="guardNumb" label="保安员证号" width="100" />
        <el-table-column prop="archivesNumb" label="档案编号" width="100" />
        <el-table-column prop="archivesStatusName" label="档案情况" width="100" />
        <el-table-column show-overflow-tooltip type="index" width="55" label="序号" />
        <el-table-column show-overflow-tooltip prop="empNumb" label="编号" width="80" />
        <el-table-column show-overflow-tooltip prop="allDeptName" label="部门(护卫点)" width="300" />
        <el-table-column show-overflow-tooltip prop="jobName" label="岗位" width="80" />
        <el-table-column show-overflow-tooltip prop="empName" label="姓名" width="100" />
        <el-table-column show-overflow-tooltip prop="certificateNumb" label="身份证号码" min-width="120" />
        <el-table-column show-overflow-tooltip prop="sex" :formatter="sexFormat" label="性别" width="60" />
        <el-table-column show-overflow-tooltip prop="age" label="年龄" width="60" />
        <el-table-column show-overflow-tooltip prop="education" :formatter="educationFormat" label="最高学历" width="80" />
        <el-table-column show-overflow-tooltip prop="empType" :formatter="empTypeFormat" label="员工类别" width="80" />
        <el-table-column show-overflow-tooltip prop="nativePlace" :formatter="nativePlaceFormat" label="籍贯" width="80" />
        <el-table-column show-overflow-tooltip prop="telePhone" label="联系电话" width="110" />
        <el-table-column show-overflow-tooltip prop="entryDate" label="入职日期" width="110" />
        <el-table-column show-overflow-tooltip prop="insuranceTypeName" label="社保档位" min-width="120" />
        <el-table-column show-overflow-tooltip prop="empStatus" label="员工状态" width="80">
          <template slot-scope="scope">
            <span>{{ gzdStateList[scope.row.empStatus] }}&nbsp;</span>
          </template>
        </el-table-column>
      </el-table>
      <pagination
        v-show="total>0"
@@ -82,6 +82,11 @@
  },
  data() {
    return {
      gzdStateList: {
        0: '在职',
        1: '离职',
        2: '退休'
      },
      show: false,
      headerHeight: '70px',
      deptTree: [],
@@ -104,7 +109,13 @@
      defaultProps: {
        children: 'children',
        label: 'label'
      }
      },
      educationOptions: [],
      nativePlaceOptions: [],
      insuranceOptions: [],
      sexOptions: [],
      empTypeOptions: [],
      nationOptions: []
    }
  },
  computed: {
@@ -114,7 +125,48 @@
      }
    }
  },
  mounted() {
    this.getDicts('EDUCATION').then(response => {
      this.educationOptions = response.data
    })
    this.getDicts('NATIVEPLACE').then(response => {
      this.nativePlaceOptions = response.data
    })
    this.getDicts('sex').then(response => {
      this.sexOptions = response.data
    })
    this.getDicts('empType').then(response => {
      this.empTypeOptions = response.data
    })
    this.getDicts('NATION').then(response => {
      this.nationOptions = response.data
    })
    this.getDicts('INSURANCETYPE').then(response => {
      this.insuranceTypeOptions = response.data
    })
  },
  methods: {
    educationFormat(row, column) {
      return this.selectDictLabel(this.educationOptions, row.education)
    },
    nativePlaceFormat(row, column) {
      return this.selectDictLabel(this.nativePlaceOptions, row.nativePlace)
    },
    insuranceTypeFormat(row,colum){
      return this.selectDictLabel(this.insuranceTypeOptions, row.insuranceType)
    },
    empTypeFormat(row, column) {
      return this.selectDictLabel(this.empTypeOptions, row.empType)
    },
    sexFormat(row, column) {
      return this.selectDictLabel(this.sexOptions, row.sex)
    },
    nationFormat(row, column) {
      return this.selectDictLabel(this.nationOptions, row.nation)
    },
    beforeClose(done) {
      this.$emit('cancleChooseUser')
    },
    search() {
      this.fetch({
        ...this.queryParams