<template>
  <div style="background-color: #f0f2f5; padding-bottom: 20px; min-height: 100%; " >
    <div style="padding: 20px; background-color: #fff;">
      达人详情
    </div>
    <div class="content" >
      <div class="desct">
        达人信息
      </div>
      <el-descriptions title="" :column="3" border >
        <el-descriptions-item label="昵称"    >
            <span v-if="item!=null">{{item.nickName}}</span>
        </el-descriptions-item>
        <el-descriptions-item label="电话" >
          <span v-if="item!=null">{{item.phone}}</span>
        </el-descriptions-item>
        <el-descriptions-item label="头像" >
          <el-image v-if="item!=null"
              style="width: 100px"
              :src="item.avatar"
              :preview-src-list="[item.avatar]">
          </el-image>
        </el-descriptions-item>
        <el-descriptions-item label="所属用户" >
          <span v-if="item!=null">{{item.userId}}</span>
        </el-descriptions-item>
        <el-descriptions-item label="余额" >
          <span v-if="item!=null">{{item.balance}}</span>
        </el-descriptions-item>
        <el-descriptions-item label="状态" >
          <span v-if="item!=null">
            <dict-tag :options="statusOptions" :value="item.status"/>
          </span>
        </el-descriptions-item>
        <el-descriptions-item label="性别" >
          <span v-if="item!=null">
            <dict-tag :options="sexOptions" :value="item.sex"/>
          </span>
        </el-descriptions-item>
        <el-descriptions-item label="获赞数" >
          <span v-if="item!=null">{{item.likes}}</span>
        </el-descriptions-item>
        <el-descriptions-item label="粉丝数" >
          <span v-if="item!=null">{{item.fans}}</span>
        </el-descriptions-item>
        <el-descriptions-item label="达人等级" >
          <span v-if="item!=null">{{item.level}}</span>
        </el-descriptions-item>
        <el-descriptions-item label="位置" >
          <span v-if="item!=null">{{item.address}}</span>
        </el-descriptions-item>
        <el-descriptions-item label="标签" >
          <span v-if="item!=null">{{item.tags}}</span>
        </el-descriptions-item>

        <el-descriptions-item label="审核时间" >
          <span v-if="item!=null">{{item.auditTime}}</span>
        </el-descriptions-item>
        <el-descriptions-item label="审核状态" >
          <span v-if="item!=null">
            <dict-tag :options="isauditOptions" :value="item.isAudit"/>
          </span>
        </el-descriptions-item>
        <el-descriptions-item label="创建时间" >
          <span v-if="item!=null">{{item.createTime}}</span>
        </el-descriptions-item>
        <el-descriptions-item label="累计佣金" >
          <span v-if="item!=null">{{item.totalMoney}}</span>
        </el-descriptions-item>
        <el-descriptions-item label="冻结佣金" >
          <span v-if="item!=null">{{item.freezeMoney}}</span>
        </el-descriptions-item>
        <el-descriptions-item label="已提现佣金" >
          <span v-if="item!=null">{{item.extractMoney}}</span>
        </el-descriptions-item>
        <el-descriptions-item label="医生简介" span="6">
          <span v-if="item!=null">{{item.title}}</span>
        </el-descriptions-item>
        <el-descriptions-item label="抖音链接"  span="6" >
          <span v-if="item!=null" style="width: 100px;">{{item.tiktokLink}}</span>
        </el-descriptions-item>
        <el-descriptions-item label="快手链接"  span="6" >
          <span v-if="item!=null" style="width: 100px;">{{item.kwaiLink}}</span>
        </el-descriptions-item>
      </el-descriptions>
    </div>


    <div class="content" >
      <div class="desct">
        证件信息
      </div>
      <el-descriptions title="" :column="3" border>
        <el-descriptions-item label="证书编号" >
          <span v-if="item!=null">{{item.certificateCode}}</span>
        </el-descriptions-item>
        <el-descriptions-item label="专业证书">
          <span v-if="item!=null">
            <el-image v-for="img in item.certificateImages" :key="img"
              style="width: 100px"
              :src="img"
              :preview-src-list="[img]">
            </el-image>
          </span>
        </el-descriptions-item>
      </el-descriptions>
    </div>
  </div>
</template>
<script>
import { listUserTalent, getUserTalent, delUserTalent, addUserTalent, updateUserTalent, exportUserTalent } from "@/api/course/userTalent";
export default {
    name: "talentDetails",
    data() {
      return {
        orOptions: [],
        isauditOptions: [],
        positionOptions: [],
        statusOptions: [],
        sexOptions: [],
        item:null,
      }
    },
    created() {
      this.getDicts("sys_company_isaudit").then(response => {
        this.isauditOptions = response.data;
      });
     this.getDicts("sys_company_or").then(response => {
       this.orOptions = response.data;
     });
     this.getDicts("sys_doc_position").then(response => {
       this.positionOptions = response.data;
     });
     this.getDicts("sys_company_status").then(response => {
       this.statusOptions = response.data;
     });
     this.getDicts("sys_sex").then(response => {
       this.sexOptions = response.data;
     });
    },
    methods: {
      getDetails(talentId) {
        this.item=null;
        getUserTalent(talentId).then(response => {
          this.item = response.data;
          if (this.item.certificateImages!=null && this.item.certificateImages!=''){
            this.item.certificateImages = (this.item.certificateImages).split(",");
          }
        });
      },



    }
  }
</script>
<style>

  .content{
      height: 100%;
      background-color: #fff;
      padding: 0px 20px;

  }
</style>
<style>

  .el-descriptions-item__content {
    max-width: 150px;
    min-width: 100px;
  }
  .content{
      height: 100%;
      background-color: #fff;
       padding: 0px 20px 20px;
      margin: 20px;
  }
  .el-descriptions-item__label.is-bordered-label{
    font-weight: normal;
  }
  .desct{
      padding-top: 20px;
      padding-bottom: 20px;
      color: #524b4a;
      font-weight: bold;
    }
</style>
