<style>
  .EmployeeDetails {
    margin: 0 20px;
  }

  .EmployeeDetails .role_Line {
    width: 3px;
    height: 11px;
    margin-right: 10px;
    background-color: #3FC4FF;
    display: inline-block;
  }

  .EmployyBaseInfo div {
    height: 50px;
    background-color: #F7F7F7;
    margin-right: 10px;
  }

  .EmployeeDetails .EmpList {
    background-color: #F7F7F7;
    height: 70px;
    margin-right: 15px;
    border-radius: 3px;
    padding: 15px;
  }

  .EmployeeDetails .EmpList:last-child {
    margin-right: 0;
  }

  .EmployeeDetails .baseInfo_Item {
    margin-bottom: 20px;
  }

</style>
<template>
  <div class="EmployeeDetails">
    <div class="baseInfo_Item">
      <span class="role_Line"></span>基本信息
    </div>
    <div class="row baseInfo_Item">
      <div class="col EmpList">
        <div class="normalName">姓名</div>
        <div class="normalInner">{{empData.EmployeeName}}</div>
      </div>
      <div class="col EmpList">
        <div class="normalName">性别</div>
        <div class="normalInner">{{empData.SexStr}}</div>
      </div>
      <div class="col EmpList">
        <div class="normalName">生日</div>
        <div class="normalInner">{{empData.BirthDateStr}}</div>
      </div>
      <div class="col EmpList">
        <div class="normalName">学历</div>
        <div class="normalInner">{{empData.EducationStr}}</div>
      </div>
    </div>
    <div class="row baseInfo_Item">
      <div class="col EmpList">
        <div class="normalName">电话</div>
        <div class="normalInner">{{empData.EmployeeTel}}</div>
      </div>
      <div class="col EmpList">
        <div class="normalName">身份证</div>
        <div class="normalInner">{{empData.IDCard}}</div>
      </div>
    </div>
    <div class="row baseInfo_Item">
      <div class="col EmpList">
        <div class="normalName">邮箱</div>
        <div class="normalInner">{{empData.Email}}</div>
      </div>
    </div>
    <div class="row baseInfo_Item">
      <div class="col EmpList">
        <div class="normalName">住址</div>
        <div class="normalInner">{{empData.Address}}</div>
      </div>
    </div>
    <div class="baseInfo_Item">
      <span class="role_Line"></span>职务信息
    </div>
    <div class="row baseInfo_Item">
      <div class="col EmpList">
        <div class="normalName">职位</div>
        <div class="normalInner">{{empData.PostName}}</div>
      </div>
      <div class="col EmpList">
        <div class="normalName">入职时间</div>
        <div class="normalInner">{{empData.EntryTime}}</div>
      </div>
      <div class="col EmpList">
        <div class="normalName">状态</div>
        <div class="normalInner">{{empData.LeaveStatusStr}}</div>
      </div>
    </div>
    <div class="row baseInfo_Item">
      <div class="col EmpList">
        <div class="normalName">公司</div>
        <div class="normalInner">{{empData.SchoolName}}</div>
      </div>
      <div class="col EmpList">
        <div class="normalName">部门</div>
        <div class="normalInner">{{empData.DeptName}}</div>
      </div>
    </div>
  </div>
</template>

<script>
  import {
    queryEmployeeInfo,
  } from '../../../api/school/index'
  export default {
    props: {
      saveObj: {
        type: Object,
        default: null
      }
    },
    name: "EmployeeDetails",
    data() {
      return {
        qMsg: {
          Id: 0, //账号表中的Id
          AccountId: 0, //账号表中的AccountId
          AccountType: 0, //账号表中的AccountType
        },
        empData: {}, //员工信息
      }
    },
    created() {
      if (this.saveObj) {
        this.qMsg.Id = this.saveObj.Id;
        this.qMsg.AccountId = this.saveObj.AccountId;
        this.qMsg.AccountType = this.saveObj.AccountType;
      }
    },
    mounted() {
      this.getEmpInfo();
    },
    methods: {
      getEmpInfo() {
        queryEmployeeInfo(this.qMsg).then(res => {
          if (res.Code == 1) {
            this.empData = res.Data;
          }
        })
      }
    },
    watch: {
      saveObj: function (val, oldval) {
        this.qMsg.AccountId = this.saveObj.AccountId;
        this.qMsg.AccountType = this.saveObj.AccountType;
        this.getEmpInfo();
      }
    }
  }

</script>
