ylrz_his_scrm_adminUI/src/views/components/his/doctorDetails.vue

<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.doctorName}}</span>
     </el-descriptions-item>
     <el-descriptions-item label="职称" >
         <span v-if="item!=null"><dict-tag :options="positionOptions" :value="item.position"/></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.hospitalName}}</span>
     </el-descriptions-item>
     <el-descriptions-item label="科室名称" >
         <span v-if="item!=null">{{item.deptName}}</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">{{item.province}}{{item.city}}{{item.district}}</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">
         <el-rate
           v-model="item.pingStar"
           disabled
           show-score
           text-color="#ff9900"
           score-template="{value}">
         </el-rate>
</span>
     </el-descriptions-item>
     <el-descriptions-item label="咨询量" >
         <span v-if="item!=null">{{item.orderNumber}}</span>
     </el-descriptions-item>
     <el-descriptions-item label="平均响应速度" >
         <span v-if="item!=null">{{item.speed}}</span>
     </el-descriptions-item>
      <el-descriptions-item label="手机号" >
         <span v-if="item!=null">{{item.mobile}}</span>
     </el-descriptions-item>
    <el-descriptions-item label="性别" >
      <dict-tag :options="sexOptions" :value="item.sex"/>
    </el-descriptions-item>
    <el-descriptions-item label="出生年月" >
        <span v-if="item!=null">{{item.bitthday}}</span>
    </el-descriptions-item>
    <el-descriptions-item label="登录账号" >
        <span v-if="item!=null">{{item.account}}</span>
    </el-descriptions-item>
    <el-descriptions-item label="医生签名" >
     <el-popover v-if="item.signUrl!=null"
                 placement="right"
                 title=""
                 trigger="hover">
                 <img slot="reference" :src="item.signUrl" width="50px">
                 <img :src="item.signUrl" style="max-width: 200px;">
      </el-popover>
    </el-descriptions-item>

    <el-descriptions-item label="是否推荐" >
      <dict-tag :options="orOptions" :value="item.isTui"/>
    </el-descriptions-item>
    <el-descriptions-item label="是否专家" >
      <dict-tag :options="orOptions" :value="item.isExpert"/>
    </el-descriptions-item>
    <el-descriptions-item label="接诊状态" >
        <dict-tag :options="statusOptions" :value="item.workStatus"/>
    </el-descriptions-item>
    <el-descriptions-item label="是否自营" >
      <dict-tag :options="orOptions" :value="item.isSelf"/>
    </el-descriptions-item>
    <el-descriptions-item label="是否处方医生" >
        <dict-tag :options="orOptions" :value="item.isPrescribeDoctor"/>
    </el-descriptions-item>
    <el-descriptions-item label="处方医生名称" >
      <span v-if="item!=null">{{item.prescribeDoctorName}}</span>
    </el-descriptions-item>
    <el-descriptions-item label="套餐包" >
      <span v-if="item!=null">{{item.packageName}}</span>
    </el-descriptions-item>
    <el-descriptions-item label="审核时间" >
        <span v-if="item!=null">{{item.auditTime}}</span>
    </el-descriptions-item>
    <el-descriptions-item label="审核状态" >
      <dict-tag :options="isauditOptions" :value="item.isAudit"/>
    </el-descriptions-item>
    <el-descriptions-item label="创建时间" >
        <span v-if="item!=null">{{item.createTime}}</span>
    </el-descriptions-item>
    <el-descriptions-item label="医生简介" span="6">
        <span v-if="item!=null">{{item.introduction}}</span>
    </el-descriptions-item>
     <el-descriptions-item label="擅长领域"  span="6" >
         <span v-if="item!=null" style="width: 100px;">{{item.speciality}}</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.idCard}}</span>
  </el-descriptions-item>

  <el-descriptions-item label="身份证正面">
    <el-image v-if="item.idCardFrontUrl!=null"
        style="width: 100px"
        :src="item.idCardFrontUrl"
        :preview-src-list="[item.idCardFrontUrl]">
    </el-image>
  </el-descriptions-item>

  <el-descriptions-item label="身份证反面">
    <el-image v-if="item.idCardBackUrl!=null"
        style="width: 100px"
        :src="item.idCardBackUrl"
        :preview-src-list="[item.idCardBackUrl]">
    </el-image>
  </el-descriptions-item>

  <el-descriptions-item label="资格证编号" >
    <span v-if="item!=null">{{item.certificateCode}}</span>
  </el-descriptions-item>

  <el-descriptions-item label="资格证">
     <el-image v-for="img in item.certificateImages" :key="img"
         style="width: 100px"
         :src="img"
         :preview-src-list="[img]">
     </el-image>


  </el-descriptions-item>
  <el-descriptions-item label="执业证编号">
    <span v-if="item!=null">{{item.practiseCode}}</span>
  </el-descriptions-item>
<el-descriptions-item label="执业证">
     <el-image v-for="img in item.practiseImages" :key="img"
         style="width: 100px"
         :src="img"
         :preview-src-list="[img]">
     </el-image>
  </el-descriptions-item>
</el-descriptions>
</div>
</div>
</template>
<script>
  import {getDoctor} from '../../../api/his/doctor.js';
  import{listDepartment} from "@/api/his/disease";
  import{listHospital} from "@/api/his/hospital";
  export default {
    name: "doctordetails",
    props:["data"],
    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(orderId) {
          this.item=null;
          getDoctor(orderId).then(response => {
              this.item = response.data;
              this.item.certificateImages= (this.item.certificateImages).split(",");
              this.item.practiseImages= (this.item.practiseImages).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>