<script>
import {getDetailById} from "@/api/cso_sys_user";
import {getDictMap} from "@/api/cso_sys_dict";
import dayjs from "@/plugins/dayjs";

export default {
  name: "CsoSysUserDetails",
  data(){
    return {
      data:{},
      visible:false,
      degreeDict:{}
    }
  },
  created() {
    this.init()
  },
  computed:{
    subCertStatusList(){
      if(!this.data.subCertStatus){
        return []
      }
      const items = this.data.subCertStatus.split(',')
      return items.map(item=>{
        return item.split(':')
      })
    }
  },
  methods:{
    async init(){
      this.degreeDict = await getDictMap('user_degree')
    },
    async open(id){
      this.$modal.loading("加载中...")
      try {
        this.data=await getDetailById(id)
        this.visible=true
      } finally {
        this.$modal.closeLoading()
      }
    },
    formatGender(value){
      return value==='1'?'男':value==='2'?'女':value
    },
    getAge(idCardNumber) {
      if (!idCardNumber) {
        return ''
      }
      const birthday = idCardNumber.substr(6, 8)
      return dayjs().diff(dayjs(birthday, 'YYYYMMDD'), 'year')
    },
    formatDegree(value){
      return this.degreeDict[value]
    },
    formatCreateTime(value){
      if(!value){
        return ''
      }
      return dayjs(value).toNow(true)
    },
    getVerifiedTaskRate(data){
      if(data.verifiedTasks>=0&&data.completedTasks>0){
        return (data.verifiedTasks/data.completedTasks*100).toFixed(2)+'%'
      }else{
        return ''
      }
    }
  }
}
</script>

<template>
  <el-dialog
    :title="this.data.realname+'个人名片'"
    :visible.sync="visible"
    width="600px" :close-on-click-modal="false">
    <el-row>
      <el-col :span="12">
        <el-descriptions title="基本信息" :column="1">
          <el-descriptions-item label="姓名">{{data.realname}}</el-descriptions-item>
          <el-descriptions-item label="性别">{{formatGender(data.gender)}}</el-descriptions-item>
          <el-descriptions-item label="身份证号">{{data.idCardNumber}}</el-descriptions-item>
          <el-descriptions-item label="手机号">{{data.phone}}</el-descriptions-item>
          <el-descriptions-item label="年龄">{{getAge(data.idCardNumber)}}</el-descriptions-item>
          <el-descriptions-item label="学历">{{formatDegree(data.degree)}}</el-descriptions-item>
          <el-descriptions-item label="所属区域">{{data.province}}{{data.city}}{{data.area}}</el-descriptions-item>
        </el-descriptions>
      </el-col>
      <el-col :span="12">
        <el-descriptions title="平台经历" :column="1">
          <el-descriptions-item label="角色">{{data.roles}}</el-descriptions-item>
          <el-descriptions-item label="派工方">{{data.deptName}}</el-descriptions-item>
          <el-descriptions-item label="服务企业">{{data.drugEntName}}</el-descriptions-item>
          <el-descriptions-item label="服务时长">{{formatCreateTime(data.createTime)}}</el-descriptions-item>
          <el-descriptions-item label="完成任务量">{{data.completedTasks}}</el-descriptions-item>
          <el-descriptions-item label="通过任务量">{{data.verifiedTasks}}</el-descriptions-item>
          <el-descriptions-item label="审核通过率">{{getVerifiedTaskRate(data)}}</el-descriptions-item>
          <el-descriptions-item label="结算渠道">{{data.gigTypes}}</el-descriptions-item>
        </el-descriptions>
      </el-col>
    </el-row>
    <el-row>
      <el-col :span="12">
        <el-descriptions title="专业技能" :column="1">
          <el-descriptions-item label="医药代表资质备案号">{{data.qualificationRecordNumber}}</el-descriptions-item>
          <el-descriptions-item label="资质证书">{{data.qualificationsUrl}}</el-descriptions-item>
          <el-descriptions-item label="测评结果">{{data.quizResult}}</el-descriptions-item>
        </el-descriptions>
      </el-col>
      <el-col :span="12">
        <el-descriptions title="认证状态" :column="1">
          <el-descriptions-item  v-for="i in subCertStatusList" :key="i[0]" :label="i[0]">{{i[1]}}</el-descriptions-item>
        </el-descriptions>
      </el-col>
    </el-row>
    <span slot="footer" class="dialog-footer">
      <el-button type="primary" @click="visible = false">关闭</el-button>
    </span>
  </el-dialog>
</template>

<style scoped lang="scss">

</style>
