ylrz_his_scrm_adminUI/src/views/hisStore/components/storeDetails.vue

<template>
  <div style="background-color: #f0f2f5; padding-bottom: 20px; min-height: 100%; " >
    <div style="padding: 20px; background-color: #fff;">
      店铺详情
    </div>
    <div class="content" v-if="item!=null">
      <div class="desct">
        店铺信息
      </div>
      <el-descriptions title="" :column="3" border>
        <el-descriptions-item label="店铺名称" >
          <span v-if="item!=null">{{item.storeName}}</span>
        </el-descriptions-item>
        <el-descriptions-item label="店铺介绍" >
          <span v-if="item!=null">{{item.descs}}</span>
        </el-descriptions-item>
        <el-descriptions-item label="店铺LOGO" >
          <el-image
            style="width: 100px"
            :src="item.logoUrl"
            :preview-src-list="[item.logoUrl]">
          </el-image>
        </el-descriptions-item>
        <el-descriptions-item label="商家ID" >
          <span v-if="item!=null">{{item.merchantId}}</span>
        </el-descriptions-item>
        <el-descriptions-item label="店铺ID" >
          <span v-if="item!=null">{{item.storeSeq}}</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.phone}}</span>
        </el-descriptions-item>
<!--        <el-descriptions-item label="资质证书">-->
<!--          <el-image-->
<!--            style="width: 100px"-->
<!--            :src="item.licenseImages"-->
<!--            :preview-src-list="[item.licenseImages]">-->
<!--          </el-image>-->
<!--        </el-descriptions-item>-->
        <el-descriptions-item label="商品总数" >
          <span v-if="item!=null">{{item.productCount}}</span>
        </el-descriptions-item>
        <el-descriptions-item label="状态" >
          <dict-tag :options="statusOptions" :value="item.status"/>
        </el-descriptions-item>
        <el-descriptions-item label="销量" >
          <span v-if="item!=null">{{item.salesCount}}</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">{{item.totalMoney}}</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.account}}</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.updateTime}}</span>
        </el-descriptions-item>

        <!--  // 重置证书相关字段
        businessLicense: null,                    // 营业执照文件
        businessLicenseExpireStart: null,              // 营业执照失效日期
        businessLicenseExpireEnd: null,              // 营业执照失效日期
        drugLicense: null,             // 药品经营许可证有效期
        drugLicenseExpiryStart: null,               // 药品经营许可证文件
        drugLicenseExpiryEnd: null,               // 药品经营许可证文件
        // 医疗器械相关证书
        medicalDevice1: null,          // 一类医疗器械备案证书
        medicalDevice1ExpiryStart: null,        // 二类医疗器械备案有效期
        medicalDevice1ExpiryEnd: null,        // 二类医疗器械备案有效期
        medicalDevice2: null,          // 二类器械生产备案文件
        medicalDevice2ExpiryStart: null,        // 一类生产备案有效期
        medicalDevice2ExpiryEnd: null,        // 一类生产备案有效期
        medicalDevice3: null,         // 三类器械经营许可证文件
        medicalDevice3ExpiryStart: null,       // 三类器械经营许可证有效期
        medicalDevice3ExpiryEnd: null,       // 三类器械经营许可证有效期
        // 其他许可证相关字段
        foodLicense: null,               // 食品经营许可证文件
        foodLicenseExpiryStart: null,             // 食品经营许可证有效期
        foodLicenseExpiryEnd: null,             // 食品经营许可证有效期
        medicalLicense: null,  // 医疗机构执业许可证文件
        medicalLicenseExpiryStart: null // 医疗机构执业许可证有效期
        medicalLicenseExpiryEnd: null // 医疗机构执业许可证有效期
        -->
        <el-descriptions-item label="营业执照" >
          <el-image
            style="width: 100px"
            :src="item.businessLicense"
            :preview-src-list="[item.businessLicense]">
          </el-image>
        </el-descriptions-item>
        <el-descriptions-item label="营业执照有效期" >
          <span v-if="item!=null && item.isBusinessLicensePermanent == 1">长期有效</span>
          <span v-else-if="item!=null">{{item.businessLicenseExpireStart}} - {{item.businessLicenseExpireEnd}}</span>
        </el-descriptions-item>
        <el-descriptions-item label="药品经营许可证" v-if="medicalMallConfig.isMedicalMall">
          <el-image
            style="width: 100px"
            :src="item.drugLicense"
            :preview-src-list="[item.drugLicense]">
          </el-image>
        </el-descriptions-item>
        <el-descriptions-item label="药品经营许可证有效期" v-if="medicalMallConfig.isMedicalMall">
          <span v-if="item!=null && item.isDrugLicensePermanent == 1">长期有效</span>
          <span v-else-if="item!=null">{{item.drugLicenseExpiryStart}} - {{item.drugLicenseExpiryEnd}}</span>
        </el-descriptions-item>
        <el-descriptions-item label="1类器械生产" v-if="medicalMallConfig.isMedicalMall">
          <el-image
            style="width: 100px"
            :src="item.medicalDevice1"
            :preview-src-list="[item.medicalDevice1]">
          </el-image>
        </el-descriptions-item>
        <el-descriptions-item label="1类器械生产有效期" v-if="medicalMallConfig.isMedicalMall">
          <span v-if="item!=null && item.isMedicalDevice1ExpiryPermanent == 1">长期有效</span>
          <span v-else-if="item!=null">{{item.medicalDevice1ExpiryStart}} - {{item.medicalDevice1ExpiryEnd}}</span>
        </el-descriptions-item>
        <el-descriptions-item label="2类器械备案" v-if="medicalMallConfig.isMedicalMall">
          <el-image
            style="width: 100px"
            :src="item.medicalDevice2"
            :preview-src-list="[item.medicalDevice2]">
          </el-image>
        </el-descriptions-item>
        <el-descriptions-item label="2类器械备案有效期" v-if="medicalMallConfig.isMedicalMall">
          <span v-if="item!=null && item.isMedicalDevice2ExpiryPermanent == 1">长期有效</span>
          <span v-else-if="item!=null">{{item.medicalDevice2ExpiryStart}} - {{item.medicalDevice2ExpiryEnd}}</span>
        </el-descriptions-item>
        <el-descriptions-item label="3类器械营业许可证" v-if="medicalMallConfig.isMedicalMall">
          <el-image
            style="width: 100px"
            :src="item.medicalDevice3"
            :preview-src-list="[item.medicalDevice3]">
          </el-image>
        </el-descriptions-item>
        <el-descriptions-item label="3类器械营业许可证有效期" v-if="medicalMallConfig.isMedicalMall">
          <span v-if="item!=null && item.isMedicalDevice3ExpiryPermanent == 1">长期有效</span>
          <span v-else-if="item!=null">{{item.medicalDevice3ExpiryStart}} - {{item.medicalDevice3ExpiryEnd}}</span>
        </el-descriptions-item>
        <el-descriptions-item label="食品许可证" v-if="medicalMallConfig.isMedicalMall">
          <el-image
            style="width: 100px"
            :src="item.foodLicense"
            :preview-src-list="[item.foodLicense]">
          </el-image>
        </el-descriptions-item>
        <el-descriptions-item label="食品许可证有效期" v-if="medicalMallConfig.isMedicalMall">
          <span v-if="item!=null && item.isFoodLicenseExpiryPermanent == 1">长期有效</span>
          <span v-else-if="item!=null">{{item.foodLicenseExpiryStart}} - {{item.foodLicenseExpiryEnd}}</span>
        </el-descriptions-item>
        <el-descriptions-item label="药品许可证" v-if="medicalMallConfig.isMedicalMall">
          <el-image
            style="width: 100px"
            :src="item.medicalLicense"
            :preview-src-list="[item.medicalLicense]">
          </el-image>
        </el-descriptions-item>
        <el-descriptions-item label="药品许可证有效期" v-if="medicalMallConfig.isMedicalMall">
          <span v-if="item!=null && item.isMedicalLicenseExpiryPermanent == 1">长期有效</span>
          <span v-else-if="item!=null">{{item.medicalLicenseExpiryStart}} - {{item.medicalLicenseExpiryEnd}}</span>
        </el-descriptions-item>

        <el-descriptions-item label="营业范围" v-if="medicalMallConfig.isMedicalMall">
          <span>{{item.businessScope}}</span>
        </el-descriptions-item>


      </el-descriptions>
      <div v-if="item.isAudit===0 && this.showAudit" class="dialog">
        <el-divider content-position="left">审核</el-divider>
        <el-form ref="form1" :model="form1" :rules="rules1" label-width="80px">
          <el-form-item label="审核理由" prop="reason">
            <el-input v-model="form1.reason" type="textarea" placeholder="请输入审核理由" />
          </el-form-item>
          <el-form-item label="图片说明" prop="attachment">
            <ImageUpload  v-model="form1.attachImage" type="image" :limit=5 :width="150"
                          :height="150"/>
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="handleUpdate(1)">审核通过</el-button>
          <el-button type="primary" @click="handleUpdate(-1)">审核退回</el-button>
        </div>
      </div>
      <div v-if="item.isAudit!==0 && medicalMallConfig.isAudit" class="dialog">
        <el-divider content-position="left">审核记录</el-divider>
        <el-table :data="item.auditLogs" border >
          <el-table-column label="描述" align="center" prop="des" :show-overflow-tooltip="true" />
          <el-table-column label="操作人员" align="center" prop="operName" width="100" :show-overflow-tooltip="true" sortable="custom" :sort-orders="['descending', 'ascending']" />
          <el-table-column label="操作日期" align="center" prop="operTime" sortable="custom" :sort-orders="['descending', 'ascending']" width="180">
            <template slot-scope="scope">
              <span>{{ parseTime(scope.row.operTime) }}</span>
            </template>
          </el-table-column>
          <el-table-column label="审核理由" align="center" prop="reason" ></el-table-column>
          <el-table-column label="图片" align="center" prop="attachImage" width="100" >
            <template slot-scope="scope">
              <el-image
                style="width: 100px"
                :src="scope.row.attachImage"
                :preview-src-list="[scope.row.attachImage]"
                v-if="scope.row.attachImage">
              </el-image>
              <span v-else >无图片</span >
            </template>
          </el-table-column>
        </el-table>
      </div>
    </div>

    <div class="dialog">
      <el-divider content-position="left">药师信息</el-divider>
      <el-table :data="item.doctorList" border>
        <el-table-column label="药师名称" align="center" prop="doctorName" />
        <el-table-column label="职业证书编号" align="center" prop="practiseCode" />
        <el-table-column label="药师签名" align="center" width="200">
          <template slot-scope="scope">
            <div v-if="scope.row.signUrl" style="display: flex; gap: 10px; flex-wrap: wrap;">
              <el-image
                v-for="(img, index) in scope.row.signUrl.split(',')"
                :key="index"
                style="width: 100px; height: 100px; object-fit: contain;"
                :src="img"
                :preview-src-list="scope.row.signUrl.split(',')"
              />
            </div>
            <span v-else>无图片</span>
          </template>
        </el-table-column>
        <el-table-column label="证书" align="center" width="200">
          <template slot-scope="scope">
            <div v-if="scope.row.practiseImages" style="display: flex; gap: 10px; flex-wrap: wrap;">
              <el-image
                v-for="(img, index) in scope.row.practiseImages.split(',')"
                :key="index"
                style="width: 100px; height: 100px; object-fit: contain;"
                :src="img"
                :preview-src-list="scope.row.practiseImages.split(',')"
              />
            </div>
            <span v-else>无图片</span>
          </template>
        </el-table-column>
      </el-table>
    </div>
  </div>
</template>

<script>
import { audit, getStore, getStoreAuditLog } from '@/api/hisStore/store'
import { getConfigByKey } from '@/api/system/config'
export default {
  name: 'user',
  props:['data'],
  data() {
    return {
      showAudit: true,
      statusOptions: [],
      // 审核状态字典
      isAuditOptions: [],
      medicalMallConfig:{},
      item:null,
      logoUrl:[],
      form: {
        sreason: ''
      },
      form1: {},
      rules1: {
        auditReason: [
          { required: true, message: '审核理由不能为空', trigger: 'blur' }
        ]
      }
    }
  },
  created() {
    getConfigByKey("medicalMall.func.switch").then(response => {
      if(response.data && response.data.configValue) {
        this.medicalMallConfig = JSON.parse(response.data.configValue);
      }
    });
    this.getDicts('sys_company_status').then(response => {
      this.statusOptions = response.data
    })
    this.getDicts('sys_company_isaudit').then(response => {
      this.isAuditOptions = response.data
    })
  },
  destroyed() {
    this.item = null
    this.form1 = {}
  },
  methods: {
    _console(param){
      console.log(param)
      return true;
    },
    getDetails(orderId,showAudit) {
      if(showAudit === 0) {
        this.showAudit = false
      }
      this.item = null
      Promise.all([getStore(orderId), getStoreAuditLog(orderId)])
        .then(([storeResponse, auditResponse]) => {
          this.item = storeResponse.data
          console.log("xiashjahajajjahj",this.item)
          // 确保 item 不为 null 后再设置 auditLogs
          this.$set(this.item, 'auditLogs', auditResponse.auditLog)

        })
    },
    handleUpdate(oper) {
      let operStr = oper === 1 ? '审核通过' : '审核退回'
      this.$confirm('是否确认'+operStr+'店铺?', '警告', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(()=> {
        let param = {}
        param.storeId = this.item.storeId
        param.reason = this.form1.reason
        param.attachImage = this.form1.attachImage
        param.isAudit=oper
        return audit(param)
      }).then(res => {
        if(res.code === 200){
          this.$message.success("审核成功");
          this.getDetails(this.item.storeId);
          this.$emit('fresh');
        }else{
          this.$message.error("审核失败",res.msg);
        }
      }).catch(function() {

      }).finally(()=>{
        this.form1.auditReason = null
        this.form1.attachment = null
      })
    },
    handelImageUrl(urls){
      return urls.split(",");
    }
  }
}
</script>
<style>
.content{
  height: 100%;
  background-color: #fff;
  padding: 0px 20px;
  padding-bottom: 20px;
  margin: 20px;
}
.el-descriptions-item__label.is-bordered-label{
  font-weight: normal;
}
.el-descriptions-item__content {
  max-width: 150px;
  min-width: 100px;
}
.desct{
  padding-top: 20px;
  padding-bottom: 20px;
  color: #524b4a;
  font-weight: bold;
}
</style>