<template>
  <div v-loading.fullscreen.lock="fullscreenLoading" class="app-container aduit-detail">
    <div class="aduit-top">
      <div class="detail-basic">
        <div class="basic-left">
          <img :src="require('@/assets/img/natural_person.png')">
        </div>
        <div class="basic-right">
          <div class="basic-main">
            <div class="aduit-name">
              <span>{{ pageData.orderTypeName + '审核' }}</span>
              <!-- <span>'审核'</span> -->
              <span class="status-tag">
                <el-tag :type="pageData.orderStatus == 3 ? 'success' : 'warning'" size="mini">{{ form.verifyMsg ? form.verifyMsg.statusStr:'' }}</el-tag>
              </span>
            </div>
          </div>
          <div v-if="pageData" class="display-flex">
            <div class="after-line">车企/经销商名称: {{ pageData.orgName }}</div>
            <div class="after-line">业务类型: {{ pageData.orderTypeName }}</div>
            <div>实名时间: {{ pageData.rnrDate }}</div>
          </div>
        </div>
      </div>
    </div>
    <div class="aduit-bottom">
      <comp-certification ref="compCertification" :form-data="form" :audit-images="auditImages"/>
    </div>
    <audit-form
      ref="auditForm"
      v-if="form.verifyMsg && [0, 1, 2].includes(form.verifyMsg.orderStatus)"
      @submit-audit-click="handleSubmit"
      :form-data="form"
      :page-data="pageData"
    />
  </div>

</template>

<script>
import CompCertification from './certification'
import { queryPersonDetailAuditDetail, queryEnterpriseAuditDetail, queryEnterprisePersonAuditDetail, queryAuditsubmit, queryBase64List } from '@/api/audit'
import AuditForm from './rnr-audit-form'
export default {
  name: 'RnrDetail',
  components: {
    CompCertification,
    AuditForm
  },
  props: {
    pageData: {
      type: Object,
      default: () => {}
    }
  },
  data() {
    return {
      fullscreenLoading: false,
      form: {},
      auditImages: {
        ownerImages: [],
        liaisonImages: [],
        fileImages: [],
        authInfoImages: [],
        companyImages: [],
        corporationImages: [],
        auditVideoList: [],
        tableList: []
      }

    }
  },
  mounted() {
    if ([1, 2, 6, 7].includes(+this.pageData.orderType)) { // 自然人
      this.handlePersonAuditData()
    } else if ([3, 4, 5, 8].includes(+this.pageData.orderType)) { // 企业认证
      this.handleEnterpriseAuditData()
    } else { // 车企负责人

    }
  },
  methods: {
    getInItData() {

    },
    /**
    * 提交数据
    * @time 2022-06-09
    */
    handleSubmit(formData) {
      this.fullscreenLoading = true
      queryAuditsubmit(formData)
        .then((res) => {
          this.fullscreenLoading = false
          this.$emit('submit-click', formData)
        })
        .catch(() => {
          this.fullscreenLoading = false
        })
    },
    /**
    * 获取详情-自然人认证
    * @time 2022-06-09
    */
    handlePersonAuditData() {
      this.fullscreenLoading = true
      queryPersonDetailAuditDetail({
        rnrOrderInfoId: this.pageData.rnrOrderInfoId
      })
        .then((res) => {
          this.fullscreenLoading = false
          // console.log('我是自然人详情====' + JSON.stringify(res))
          res.verifyMsg.statusStr = this.setOrderStatus(res.verifyMsg.orderStatus)
          // 车主信息
          if (res.vinOwnerMsg) {
            res.vinOwnerMsg.isCompany = false
            // res.vinOwnerMsg.newCertList = []
            const tempImageIds = []
            tempImageIds[0] = res.vinOwnerMsg.idImageFace
            tempImageIds[1] = res.vinOwnerMsg.idImageEmblem
            const fileImages = {
              fileSystemIds: tempImageIds
            }
            console.log(fileImages)
            this.handleImageData(fileImages, 'owner')
          }
          // 代办人信息
          if (res.vinLiaisonMsg) {
            const tempImageIds = []
            tempImageIds[0] = res.vinLiaisonMsg.idImageFace
            tempImageIds[1] = res.vinLiaisonMsg.idImageEmblem
            const fileImages = {
              fileSystemIds: tempImageIds
            }
            this.handleImageData(fileImages, 'liaison')
          }
          // 认证信息
          if (res.verifyLivingMsg) {
            const newAuthList = []
            const faceImages = res.verifyLivingMsg.faceImage
            // 认证信息-图片相关
            for (const key in faceImages) {
              newAuthList[key] = faceImages[key]
            }
            const fileImages = {
              fileSystemIds: newAuthList
            }
            this.handleImageData(fileImages, 'auth')
            // 认证信息-视频相关
            if (res.verifyLivingMsg.livingVideo) {
              this.auditImages.auditVideoList.push(res.verifyLivingMsg.livingVideo)
            }
          }
          // 认证结果

          if (res.authResultInfo.length > 0) {
            this.auditImages.tableList = this.handleTableData(res.authResultInfo)
          }
          // 文件信息
          var imageList = []
          const pdfList = []
          // 需要处理的照片数据
          const keys = ['networkAccessContractImage', 'attorneyImage', 'buyBillImage', 'buyContractImage', 'transferOwnershipProveImage']
          // 处理数据
          keys.forEach(key => {
            // 当前图片对象
            const image = res.verifyFileMsg[key]
            for (const key in image) {
              if (image[key].indexOf('.pdf') > 0) {
                pdfList.push(image[key])
              } else {
                imageList.push(image[key])
              }
            }
          })

          this.handleImageData({ fileSystemIds: imageList }, 'newFile')
          this.handleImageData({ fileSystemIds: pdfList }, 'newFile', true)

          this.form = {
            ...res
          }
        })
        .catch(() => {
          this.fullscreenLoading = false
        })
    },
    /**
    * 获取详情-企业认证
    * @time 2022-06-09
    */
    handleEnterpriseAuditData() {
      this.fullscreenLoading = true
      queryEnterpriseAuditDetail({
        uuid: this.pageData.rnrOrderInfoId
      })
        .then((result) => {
          this.fullscreenLoading = false
          var res = result.data
          // console.log('我是企业详情:=========' + JSON.stringify(res))
          res.verifyMsg.statusStr = this.setOrderStatus(res.verifyMsg.orderStatus)
          res.verifyMsg.currentDate = res.verifyMsg.reviewDate
          res.verifyMsg.currentUserName = res.verifyMsg.reviewer
          // 企业信息
          if (res.companyInfoDetail) {
            res.companyInfoDetail.newCertList = []
            const fileMap = res.companyInfoDetail.companyLicenseFiles
            const tempImageIds = []
            for (const key in fileMap) {
              if (Object.hasOwnProperty.call(fileMap, key)) {
                tempImageIds[key] = fileMap[key].fileSystemId
              }
            }
            const OwnerFileImages = {
              fileSystemIds: tempImageIds
            }
            this.handleImageData(OwnerFileImages, 'company')
          }
          // 企业责任人
          if (res.corporationInfoDetail) {
            res.corporationInfoDetail.isCompany = true
            var newCertList = []
            // 正面
            const BackPic = res.corporationInfoDetail.corporationCertFrontPic
            if (BackPic !== '') {
              newCertList.push(BackPic.fileSystemId)
            }
            // // 反面
            const FrontPic = res.corporationInfoDetail.corporationCertBackPic
            if (res.corporationInfoDetail.corporationCertBackPic) {
              newCertList.push(FrontPic.fileSystemId)
            }
            const corporationImages = {
              fileSystemIds: newCertList
            }
            this.handleImageData(corporationImages, 'corporation')

            // 文件信息
            const comFileList = res.corporationInfoDetail.fileSystemList

            const comFiles = {
              fileSystemIds: comFileList
            }
            this.handleImageData(comFiles, 'comFiles')

            // 认证信息
            if (res.verifyLivingMsg) {
              if (res.verifyLivingMsg.livingVideo) {
                this.auditImages.auditVideoList.push(res.verifyLivingMsg.livingVideo.fileBase64)
              }
              const newAuthList = []
              const faceImages = res.verifyLivingMsg.faceImages
              // 认证信息-图片相关
              for (const key in faceImages) {
                newAuthList[key] = faceImages[key].fileSystemId
              }
              const fileImages = {
                fileSystemIds: newAuthList
              }
              this.handleImageData(fileImages, 'auth')
            }
            // 认证结果
            if (res.authResultInfo.length > 0) {
              if (res.authResultInfo.length > 0) {
                this.auditImages.tableList = this.handleTableData(res.authResultInfo)
              }
            }
          }
          this.form = {
            ...res
          }
        })
        .catch(() => {
          this.fullscreenLoading = false
        })
    },
    /**
    * 获取企业负责人变更审核详情
    * @time 2022-06-09
    */
    handleEnterprisePersonAuditData() {
      this.fullscreenLoading = true
      queryEnterprisePersonAuditDetail({
        uuid: this.pageData.rnrOrderInfoId
      })
        .then((res) => {
          this.fullscreenLoading = false
          // console.log(res)
          this.form = {
            ...res.data
          }
        })
        .catch(() => {
          this.fullscreenLoading = false
        })
    },

    /**
     *COMMIT(0, "已提交 ，待确认"),
     * ASSIGNMENT(1, "待分派/认领"),
     * TO_EXAMINE(2, "待审核"),
     * PASS(3, "审核通过"),
     * NOT_PASS(4, "未通过"),
     * CANCEL(9, "作废");
     * @status
     */
    setOrderStatus(status) {
      var statusStr = ''
      if (status === 0 || status === 1 || status === 2) {
        statusStr = '待审核'
      } else if (status === 4) {
        statusStr = '审核不通过'
      } else if (status === 3) {
        statusStr = '审核通过'
      } else {
        statusStr = '作废'
      }
      return statusStr
    },
    /**
     * 数据处理
     */
    async handleImageData(data, type, isPdf = false) {
      await queryBase64List(data)
        .then((res) => {
          var list = []
          for (const key in res) {
            list.push('data:image/jpeg;base64,' + res[key].base64)
          }
          if (type === 'owner') {
            this.auditImages.ownerImages = list
          } else if (type === 'liaison') {
            this.auditImages.liaisonImages = list
          } else if (type === 'newFile') {
            if (isPdf) {
              this.auditImages.filePdfs = list
            } else {
              this.auditImages.fileImages = list
            }
          } else if (type === 'auth') {
            this.auditImages.authInfoImages = list
          } else if (type === 'company') {
            this.auditImages.companyImages = list
          } else if (type === 'corporation') {
            this.auditImages.corporationImages = list
          } else if (type === 'comFiles') {
            this.auditImages.fileImages = list
          }
        })
        .catch(() => {
        })
    },
    /**
     * 处理认证结果信息
     */
    handleTableData(data) {
      var authInfoArr = []
      var tempOCRArr = []
      var tableList = []
      for (const key in data) {
        const item = data[key]
        if (item.tpAction === 'OCR') {
          tempOCRArr.push({
            tpActionName: 'OCR',
            success: item.success,
            message: item.message
          })
        }
      }

      for (const key in data) {
        const item = data[key]
        if (item.tpAction === 'LIVENESS') {
          authInfoArr.push({
            tpActionName: '人脸识别',
            success: item.success,
            message: item.message
          })
        } else if (item.tpAction === 'FACE_COMPARE') {
          authInfoArr.push({
            tpActionName: '人脸比对相似度',
            success: item.success,
            message: item.message
          })
        } else if (item.tpAction === 'CERT_CHECK') {
          authInfoArr.push({
            tpActionName: '人脸比对',
            success: item.success,
            message: item.message
          })
        } else if (item.tpAction === 'ID_COMPARE') {
          authInfoArr.push({
            tpActionName: '人证比对',
            success: item.success,
            message: item.message
          })
        }
      }
      authInfoArr.push(...tempOCRArr)
      let tempArr = []
      for (let i = 0; i < authInfoArr.length; i++) {
        if (i % 2 === 0) {
          tempArr = []
          tableList.push(tempArr)
        }
        tempArr.push({
          name: authInfoArr[i].tpActionName + '结果',
          className: 'custom-table-head w180'
        })
        tempArr.push({
          name: authInfoArr[i].success ? '成功' : authInfoArr[i].message,
          className: 'custom-table-td'

        })
      }
      // 最后一行需要判断是否只有两个td，是需要加上colspan
      const len = tableList.length - 1
      if (tableList[len].length === 2) {
        tableList[len][1].colspan = 3
      }
      return tableList
    }
  }
}
</script>

<style lang="scss">
.aduit-detail{
  padding: 0px;
  .aduit-top{
    padding: 10px 24px;
  }
  .aduit-bottom{
    border-top: 12px solid #F7F8FA;
    padding: 10px 24px;
  }
}
.detail-basic{
  display: flex;
  font-size: 14px;
  font-weight: 400;
  color: #778094;
  line-height: 20px;
  .el-image-viewer__close{
    color: #000;
  }
  .basic-left{
    margin-right: 20px;
    img{
      width: 60px;
    }
  }
  .basic-right{
    flex: 1;
  }
  .aduit-name{
    font-size: 18px;
    font-weight: 600;
    color: #333333;
    line-height: 25px;
  }
  .basic-main{
    margin-bottom: 16px;
  }
  .display-flex{
    display: flex;
  }
  .status-tag{
    font-size: 12px;
    margin-left: 10px;
  }
  .after-line{
    &::after{
      display: inline-block;
      content: " ";
      margin: 0 16px;
      width: 1px;
      height: 12px;
      background-color: #E8E8E8;
      vertical-align: middle;
    }
  }
}
.detail-group-box{
  .detail-group-title{
    font-size: 14px;
    font-weight: 400;
    color: #333333;
    line-height: 20px;
    margin-bottom: 12px;
    img{
      width: 18px;
      vertical-align: -4px;
    }
  }
  .detail-item-box{
    display: flex;
    border: 1px solid #F0F0F0;
    border-right: none;
    max-width: 747px;
    margin-bottom: 20px;
  }
  .detail-item{
    display: flex;
    font-size: 14px;
    font-weight: 400;
    line-height: 42px;
  }
  .detail-item-title{
    width: 138px;
    padding-left: 20px;
    background-color: rgba(247, 248, 250, 0.7);
    border-radius: 3px 0px 0px 3px;
    color: #1D2129;
    border-right: 1px solid #F0F0F0;
  }
  .detail-item-info{
    color: #333841;
    width: 215px;
    margin-left: 20px;
    border-right: 1px solid #F0F0F0;
  }
}
.custom-table{
  width: 100%;
  border-collapse: collapse;
  border-bottom: 1px solid #F0F0F0;
  border-left: 1px solid #F0F0F0;
  margin-bottom: 10px;
  tr{
    height: 40px;
  }
  td{
    border-right: 1px solid #F0F0F0;
    border-top: 1px solid #F0F0F0;
  }
  .custom-table-head{
    font-size: 14px;
    font-weight: 400;
    color: #494B53;
    width: 140px;
    background-color: rgba(247, 248, 250, 0.7);
    padding-left: 20px;
  }
  .custom-table-td{
    width: 200px;
    font-size: 14px;
    font-weight: 400;
    color: #333841;
    padding: 10px 20px 10px;
  }
  .w180{
    width: 180px;
  }
}
</style>
