添加员工基本信息

yz

2021-01-25 e778416c55052e5f7eb5588a41f6e7af0c060ca8

 src/views/user/Informationinput.vue

@@ -1,36 +1,32 @@
<template>
  <div>
    <el-row>
      <el-col :span="24">信息录入</el-col>
    </el-row>
    <el-divider />
    <el-container>
      <el-aside width="200px">
        <el-card class="info-card" shadow="always" @click.native="isShow(showArr[0],0)">
        <el-card class="info-card" shadow="always" @click.native="isShow(showArr[0].show,0)">
          基本信息
        </el-card>
        <el-card class="info-card" shadow="always" @click.native="isShow(showArr[1],1)">
        <el-card class="info-card" shadow="always" @click.native="isShow(showArr[1].show,1)">
          工作信息
        </el-card>
        <el-card class="info-card" shadow="always" @click.native="isShow(showArr[2],2)">
        <el-card class="info-card" shadow="always" @click.native="isShow(showArr[2].show,2)">
          工作经历
        </el-card>
        <el-card class="info-card" shadow="always" @click.native="isShow(showArr[3],3)">
        <el-card class="info-card" shadow="always" @click.native="isShow(showArr[3].show,3)">
          体检信息
        </el-card>
        <el-card class="info-card" shadow="always" @click.native="isShow(showArr[4],4)">
        <el-card class="info-card" shadow="always" @click.native="isShow(showArr[4].show,4)">
          合同信息
        </el-card>
        <el-card class="info-card" shadow="always" @click.native="isShow(showArr[5],5)">
        <el-card class="info-card" shadow="always" @click.native="isShow(showArr[5].show,5)">
          考勤情况
        </el-card>
        <el-card class="info-card" shadow="always" @click.native="isShow(showArr[6],6)">
        <el-card class="info-card" shadow="always" @click.native="isShow(showArr[6].show,6)">
          请假记录
        </el-card>
        <el-card class="info-card" shadow="always" @click.native="isShow(showArr[7],7)">
        <el-card class="info-card" shadow="always" @click.native="isShow(showArr[7].show,7)">
          调岗记录
        </el-card>
        <el-card class="info-card" shadow="always" @click.native="isShow(showArr[8],8)">
        <el-card class="info-card" shadow="always" @click.native="isShow(showArr[8].show,8)">
          备注
        </el-card>
        <el-card class="info-card" shadow="always" @click.native="isShow(showArr[9],9)">
@@ -38,8 +34,96 @@
        </el-card>
      </el-aside>
      <el-main>
        <el-button type="success" @click.native="dialogIsShow()">新增</el-button>
        <el-button type="info">删除</el-button>
        <el-table
          v-show="showArr[0]"
          v-show="showArr[0].show"
          :data="basicInformationData"
          style="width: 100%"
        >
          <el-table-column
            fixed="left"
            label="操作"
            width="100"
          >
            <template>
              <el-button type="text" size="small">编辑</el-button>
            </template>
          </el-table-column>
          <el-table-column
            prop="userNumb"
            label="员工编号"
            width="180"
          />
          <el-table-column
            prop="name"
            label="姓名"
            width="180"
          />
          <el-table-column
            prop="deptName"
            label="所属部门"
          />
          <el-table-column
            prop="jobName"
            label="岗位"
            width="180"
          />
          <el-table-column
            prop="sex"
            label="性别"
          />
          <el-table-column
            prop="national"
            label="民族"
          />
          <el-table-column
            prop="idNumber"
            label="身份证号码"
            width="180"
          />
          <el-table-column
            prop="marriage"
            label="婚姻状况"
          />
          <el-table-column
            prop="schooling"
            label="最高学历"
            width="180"
          />
          <el-table-column
            prop="entryDate"
            label="入职日期"
            width="180"
          />
          <el-table-column
            prop="insuranceType"
            label="保险类型"
            width="180"
          />
          <el-table-column
            prop="equipmentComputerNo"
            label="设备电脑号"
            width="180"
          />
          <el-table-column
            prop="securityIDNo"
            label="保安员证号"
            width="180"
          />
          <el-table-column
            prop="archivesNumber"
            label="档案编号"
            width="180"
          />
          <el-table-column
            prop="archives"
            label="档案情况"
            width="180"
          />
        </el-table>
        <el-table
          v-show="showArr[1].show"
          :data="tableData"
          style="width: 100%"
        >
@@ -59,7 +143,7 @@
          />
        </el-table>
        <el-table
          v-show="showArr[1]"
          v-show="showArr[2].show"
          :data="tableData"
          style="width: 100%"
        >
@@ -79,7 +163,7 @@
          />
        </el-table>
        <el-table
          v-show="showArr[2]"
          v-show="showArr[3].show"
          :data="tableData"
          style="width: 100%"
        >
@@ -99,7 +183,7 @@
          />
        </el-table>
        <el-table
          v-show="showArr[3]"
          v-show="showArr[4].show"
          :data="tableData"
          style="width: 100%"
        >
@@ -119,7 +203,7 @@
          />
        </el-table>
        <el-table
          v-show="showArr[4]"
          v-show="showArr[5].show"
          :data="tableData"
          style="width: 100%"
        >
@@ -139,7 +223,7 @@
          />
        </el-table>
        <el-table
          v-show="showArr[5]"
          v-show="showArr[6].show"
          :data="tableData"
          style="width: 100%"
        >
@@ -159,7 +243,7 @@
          />
        </el-table>
        <el-table
          v-show="showArr[6]"
          v-show="showArr[7].show"
          :data="tableData"
          style="width: 100%"
        >
@@ -179,7 +263,7 @@
          />
        </el-table>
        <el-table
          v-show="showArr[7]"
          v-show="showArr[8].show"
          :data="tableData"
          style="width: 100%"
        >
@@ -199,27 +283,7 @@
          />
        </el-table>
        <el-table
          v-show="showArr[8]"
          :data="tableData"
          style="width: 100%"
        >
          <el-table-column
            prop="date"
            label="日期"
            width="180"
          />
          <el-table-column
            prop="name"
            label="姓名"
            width="180"
          />
          <el-table-column
            prop="address"
            label="地址"
          />
        </el-table>
        <el-table
          v-show="showArr[9]"
          v-show="showArr[9].show"
          :data="tableData"
          style="width: 100%"
        >
@@ -240,20 +304,258 @@
        </el-table>
      </el-main>
    </el-container>
    <el-dialog title="基本信息" :visible.sync="dialogshowArr[0].show" width="50%">
      <el-form :model="baseicInformationForm" label-position="right" label-width="120px">
        <el-row>
          <el-col :span="12">
            <el-form-item label="档案号">
              <el-input v-model="baseicInformationForm.name" />
            </el-form-item>
            <el-form-item label="员工编号">
              <el-input v-model="baseicInformationForm.name" />
            </el-form-item>
            <el-form-item label="性别" prop="region">
              <el-select v-model="baseicInformationForm.name" placeholder="请选择性别">
                <el-option label="男" value="1" />
                <el-option label="女" value="2" />
              </el-select>
            </el-form-item>
            <el-form-item label="员工类型" prop="region">
              <el-select v-model="baseicInformationForm.name" placeholder="请选择员工类型">
                <el-option label="正式工" value="1" />
                <el-option label="临时工" value="2" />
              </el-select>
            </el-form-item>
            <el-form-item label="民族" prop="region">
              <el-select v-model="baseicInformationForm.name" placeholder="请选择民族">
                <el-option label="汉族" value="1" />
                <el-option label="维吾尔族" value="2" />
              </el-select>
            </el-form-item>

            <el-form-item label="婚姻状态" prop="region">
              <el-select v-model="baseicInformationForm.name" placeholder="请选择婚姻状态">
                <el-option label="未婚" value="1" />
                <el-option label="已婚" value="2" />
              </el-select>
            </el-form-item>
            <el-form-item label="身高">
              <el-input v-model="baseicInformationForm.name" />
            </el-form-item>

            <el-form-item label="政治面貌" prop="region">
              <el-select v-model="baseicInformationForm.name" placeholder="请选择政治面貌">
                <el-option label="党员" value="1" />
                <el-option label="团员" value="2" />
              </el-select>
            </el-form-item>
            <el-form-item label="最高学历" prop="region">
              <el-select v-model="baseicInformationForm.name" placeholder="请选择最高学历">
                <el-option label="本科" value="1" />
                <el-option label="专科" value="2" />
              </el-select>
            </el-form-item>
            <el-form-item label="籍贯" prop="region">
              <el-select v-model="baseicInformationForm.name" placeholder="请选择籍贯">
                <el-option label="湖南" value="1" />
                <el-option label="湖北" value="2" />
              </el-select>
            </el-form-item>
            <el-form-item label="现住址">
              <el-input v-model="baseicInformationForm.name" />
            </el-form-item>
            <el-form-item label="电话号码">
              <el-input v-model="baseicInformationForm.name" />
            </el-form-item>
            <el-form-item label="招聘介绍人">
              <el-input v-model="baseicInformationForm.name" />
            </el-form-item>
            <el-form-item label="银行名称">
              <el-input v-model="baseicInformationForm.name" />
            </el-form-item>
            <el-form-item label="保险类型" prop="region">
              <el-select v-model="baseicInformationForm.name" placeholder="请选择保险类型">
                <el-option label="（深户）五险一档" value="1" />
                <el-option label="（非深户）五险一档" value="2" />
              </el-select>
            </el-form-item>
            <el-form-item label="家庭成员及关系">
              <el-input v-model="baseicInformationForm.name" />
            </el-form-item>
            <el-form-item label="紧急联系电话">
              <el-input v-model="baseicInformationForm.name" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="所属部门">
              <el-input v-model="baseicInformationForm.name" />
            </el-form-item>
            <el-form-item label="姓名">
              <el-input v-model="baseicInformationForm.name" />
            </el-form-item>
            <el-form-item label="所属岗位">
              <el-input v-model="baseicInformationForm.name" />
            </el-form-item>
            <el-form-item label="身份证号码">
              <el-input v-model="baseicInformationForm.name" />
            </el-form-item>
            <el-form-item label="身份证有效期">
              <el-input v-model="baseicInformationForm.name" />
            </el-form-item>
            <el-form-item label="年龄">
              <el-input v-model="baseicInformationForm.name" />
            </el-form-item>
            <el-form-item label="出生日期">
              <el-input v-model="baseicInformationForm.name" />
            </el-form-item>
            <el-form-item label="入职日期">
              <el-input v-model="baseicInformationForm.name" />
            </el-form-item>
            <el-form-item label="入司工龄">
              <el-input v-model="baseicInformationForm.name" />
            </el-form-item>
            <el-form-item label="户籍地址">
              <el-input v-model="baseicInformationForm.name" />
            </el-form-item>
            <el-form-item label="保安员证号">
              <el-input v-model="baseicInformationForm.name" />
            </el-form-item>
            <el-form-item label="保安员回执">
              <el-input v-model="baseicInformationForm.name" />
            </el-form-item>
            <el-form-item label="档案情况" prop="region">
              <el-select v-model="baseicInformationForm.name" placeholder="请选择档案情况">
                <el-option label="未移交" value="1" />
                <el-option label="已移交" value="2" />
              </el-select>
            </el-form-item>
            <el-form-item label="银行账号">
              <el-input v-model="baseicInformationForm.name" />
            </el-form-item>
            <el-form-item label="社保电脑号">
              <el-input v-model="baseicInformationForm.name" />
            </el-form-item>
            <el-form-item label="员工手册" prop="region">
              <el-select v-model="baseicInformationForm.name" placeholder="请选择员工手册">
                <el-option label="未发" value="1" />
                <el-option label="已发" value="2" />
              </el-select>
            </el-form-item>
            <el-form-item label="工作证" prop="region">
              <el-select v-model="baseicInformationForm.name" placeholder="请选择工作证">
                <el-option label="未发" value="1" />
                <el-option label="已发" value="2" />
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>  <el-col span="24">  <el-form-item label="相关证件" prop="region">
          <el-select v-model="baseicInformationForm.name" 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 @click="dialogIsShow()">取 消</el-button>
        <el-button type="primary" @click="dialogIsShow()">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script>
export default {
  data() {
    return {
      formLabelWidth: '120px',
      thisShowIndex: 0,
      showArr: [true, false, false, false, false, false, false, false, false, false],
      tableData: [{
        date: '2016-05-02',
      dialogshowArr: [{ show: false }, { show: false }, { show: false }, { show: false }, { show: false }, { show: false }, { show: false }, { show: false }, { show: false }, { show: false }],
      // eslint-disable-next-line no-undef
      showArr: [{ show: true }, { show: false }, { show: false }, { show: false }, { show: false }, { show: false }, { show: false }, { show: false }, { show: false }, { show: false }],
      basicInformationData: [{
        userNumb: '12321222',
        name: '王小虎',
        address: '上海市普陀区金沙江路 1518 弄'
        deptName: '开发部',
        jobName: '开发工程师',
        sex: '女',
        national: '汉',
        idNumber: '430422199823222222',
        marriage: '已婚',
        schooling: '本科',
        entryDate: '2020-01-12',
        insuranceType: '社保',
        equipmentComputerNo: '1231',
        securityIDNo: '123',
        archivesNumber: '中保亚太',
        archives: '已移交'
      }, {
        userNumb: '12321222',
        name: '王小虎',
        deptName: '开发部',
        jobName: '开发工程师',
        sex: '女',
        national: '汉',
        idNumber: '430422199823222222',
        marriage: '已婚',
        schooling: '开发工程师',
        entryDate: '2020-01-12',
        insuranceType: '社保',
        equipmentComputerNo: '1231',
        securityIDNo: '123',
        archivesNumber: '中保亚太',
        archives: '已移交'
      }, {
        userNumb: '12321222',
        name: '王小虎',
        deptName: '开发部',
        jobName: '开发工程师',
        sex: '女',
        national: '汉',
        idNumber: '430422199823222222',
        marriage: '已婚',
        schooling: '开发工程师',
        entryDate: '2020-01-12',
        insuranceType: '社保',
        equipmentComputerNo: '1231',
        securityIDNo: '123',
        archivesNumber: '中保亚太',
        archives: '已移交'
      }, {
        userNumb: '12321222',
        name: '王小虎',
        deptName: '开发部',
        jobName: '开发工程师',
        sex: '女',
        national: '汉',
        idNumber: '430422199823222222',
        marriage: '已婚',
        schooling: '开发工程师',
        entryDate: '2020-01-12',
        insuranceType: '社保',
        equipmentComputerNo: '1231',
        securityIDNo: '123',
        archivesNumber: '中保亚太',
        archives: '已移交'
      }],
      baseicInformationForm: {
        userNumb: '',
        name: '',
        deptName: '',
        jobName: '',
        sex: '',
        national: '',
        idNumber: '',
        marriage: '',
        schooling: '',
        entryDate: '',
        insuranceType: '',
        equipmentComputerNo: '',
        securityIDNo: '',
        archivesNumber: '',
        archives: ''
      },
      tableData: [{
        date: '2016-05-04',
        name: '王小虎',
        address: '上海市普陀区金沙江路 1517 弄'
@@ -269,19 +571,29 @@
    }
  },
  methods: {
    dialogIsShow() {
      this.dialogshowArr[this.thisShowIndex].show = !this.dialogshowArr[this.thisShowIndex].show
    },
    isShow(tableShow, index) {
      if (tableShow) {
        this.showArr[index] = false
      } else {
        this.showArr[index] = true
      if (index === this.thisShowIndex) {
        return
      }
      this.showArr[this.thisShowIndex] = false
      if (tableShow) {
        this.showArr[index].show = false
      } else {
        this.showArr[index].show = true
        this.showArr[this.thisShowIndex].show = false
      }

      this.thisShowIndex = index
    }
  }
}
</script>
<style>
.el-select{
  width: 100%;
}
.info-card{
 margin-top: 20px;
}
@@ -296,11 +608,12 @@
    background-color: #D3DCE6;
    color: #333;
    text-align: center;
    height: 800px;
  }

  .el-main {
    background-color: #E9EEF3;
    color: #333;
    text-align: center;
    height: 800px;
  }
</style>