<script setup lang="ts" name="UserInfo">
import { ref, reactive, computed, onMounted } from 'vue'
import { storeToRefs } from 'pinia'
import useUserStore from '@/store/modules/user'
import MyAvatar from '@/components/Avatar/MyAvatar.vue'
import { parseTime, selectDictLabel } from '@/common/utils/ruoyi'
import { selectEmployeesDetailByCode } from '@/api/user'
import { useDict } from '@/common/utils/dict'
import request from '@/common/utils/request'

const userStore = useUserStore()

const { userInfo } = storeToRefs(userStore)

const {
  post_type,
  work_schedule,
  sys_job_level,
  sys_job_grade
} = useDict(
  'post_type',
  'work_schedule',
  'sys_job_level',
  'sys_job_grade'
)

const detail = ref < any > ({})

// 获取用户信息
function getUserInfoByCode() {
  selectEmployeesDetailByCode({
    employeesCode: userInfo.value.userCode
  }).then(res => {
    detail.value = res.data
  })
}
getUserInfoByCode()
</script>

<template>
  <div class="container">
    <div class="container__card">
      <div class="head-box">
        <MyAvatar width="8rem" height="8rem" :src="userInfo.avatar" />

      </div>
      <van-cell-group>
        <van-cell title="姓名" :value="detail.name" />
        <van-cell title="员工编号" :value="detail.employeesCode" />
        <van-cell title="部门" :value="detail.serviceDeptName" />
        <van-cell title="岗位" :value="detail.servicePostName" />
        <van-cell title="岗位类型" :value="selectDictLabel(post_type, detail.postType)" />
        <van-cell title="工作制" :value="selectDictLabel(work_schedule, detail.workTime)" />
        <van-cell title="职等" :value="selectDictLabel(sys_job_grade, detail.postGrade)" />
        <van-cell title="职级" :value="selectDictLabel(sys_job_level, detail.postLevel)" />
        <van-cell title="入职日期" :value="detail.entryDate" />
        <van-cell title="住宿房间号" :value="detail.roomNum" />
        <van-cell title="剩余年假" :value="detail.remainAnnualLeave + '天'" />
        <van-cell title="剩余调休假" :value="detail.remainRestHour + '小时'" />
        <van-cell title="上级员工编号" :value="detail.parentUserCode" />
        <van-cell title="上级员工姓名" :value="detail.parentUserName" />
        <van-cell title="手机号" :value="detail.phonenumber" />
        <van-cell title="证件号" :value="detail.documentNumber" />
        <van-cell title="微信号" :value="detail.wxOpenId" />
        <!-- <van-cell title="婚姻状态" :value="detail.postName" /> -->
        <van-cell title="出生日期" :value="detail.birthday" />
        <!-- <van-cell title="毕业学校" :value="detail.email" /> -->
        <van-cell title="专业" :value="detail.major" />
        <van-cell title="家庭住址" :value="detail.currentAddress" />
      </van-cell-group>
    </div>
  </div>
</template>

<style lang="less" scoped>
.container {
  &__body {
    overflow: hidden;
  }
}
.head-box {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 2rem 0;
  background-color: #fff;
  border-radius: 1.2rem;
  :deep(.van-uploader) {
    .van-uploader__upload {
      margin: 0;
      border-radius: 100%;
      overflow: hidden;
    }
    .van-uploader__preview {
      margin: 0;
      border-radius: 100%;
      overflow: hidden;
    }
  }
  .upload-tips {
    margin-top: 1rem;
    font-size: 1.2rem;
    color: #999;
  }
}

:deep(.van-cell-group) {
  .van-cell {
    .van-cell__title {
      flex: none;
      width: 10rem;
    }
    .van-cell__value {
      display: flex;
      justify-content: flex-end;
      overflow: hidden;
      color: var(--van-cell-text-color);
      span {
        text-align: left;
      }
    }
  }
}
</style>
