<template>
  <div>
    <a-card :bordered="false">
      <a-page-header
        style="background-color: #FFFFFF;margin-bottom:10px"
        title="客户详情"
        sub-title=""
        @back="back"
      >
        <a-descriptions :title="info.customerName" :column="3" :bordered="false">
          <a-descriptions-item label="提交材料日期">{{ info.submitSpecialDate }}</a-descriptions-item>
          <a-descriptions-item label="服务号码">{{ info.smsNumber }}</a-descriptions-item>
          <a-descriptions-item label="三级部门">{{ info.staffDeptLevel3 }}</a-descriptions-item>
          <a-descriptions-item label="负责人">{{ info.staffName }}</a-descriptions-item>
          <a-descriptions-item label="负责人工号" :span="2">{{ info.staffNo }}</a-descriptions-item>
        </a-descriptions>

      </a-page-header>

      <a-form-model
        ref="form"
        :label-col="labelCol"
        :wrapper-col="wrapperCol"
        :model="model"
      >
        <!--        基础信息-->
        <a-card :bordered="true">

          <div slot="title">
            基础信息
            <span v-show="specialResult.basicInfoState == '1'">✅</span>
            <span v-show="specialResult.basicInfoState == '0'">❌</span>
          </div>
          <a-row>
            <a-col :span="24">
              <a-form-model-item label="用户类型" prop="userOpenState" v-bind="labelCol1">
                <a-radio-group v-model="model.userLable" button-style="solid">
                  <a-radio-button v-if="model.userLable == '0'" value="0">个人户</a-radio-button>
                  <a-radio-button v-if="model.userLable == '1'" value="1">单位户</a-radio-button>
                </a-radio-group>
              </a-form-model-item>
            </a-col>
          </a-row>


          <a-col :span="24">
            <a-form-model-item label="申请复开号码" prop="openingNumber" v-bind="labelCol1">
              <a-input style="color: #000c17" :disabled="true" v-model="model.openingNumber"
                       placeholder="申请复开号码"></a-input>
            </a-form-model-item>
          </a-col>

          <a-col :span="24">
            <a-form-model-item label="客户名称(使用人)" prop="customerName" v-bind="labelCol1">
              <a-input style="color: #000c17" :disabled="true" v-model="model.customerName"
                       placeholder="客户名称/使用人名称"></a-input>
            </a-form-model-item>
          </a-col>

          <a-col :span="24" v-if="model.userLable == '1'">
            <a-form-model-item label="单位名称" prop="customerName" v-bind="labelCol1">
              <a-input style="color: #000c17" :disabled="true" v-model="model.unitName" placeholder="单位名称"></a-input>
            </a-form-model-item>
          </a-col>

          <a-col :span="24">
            <a-form-model-item label="关停时间" prop="shutdownTime" v-bind="labelCol1">
              <a-input style="color: #000c17" :disabled="true" v-model="model.shutdownTime"
                       placeholder="单位名称"></a-input>
            </a-form-model-item>
          </a-col>

          <a-col :span="24">
            <a-form-model-item label="申请复开原因" prop="reasonReopening" v-bind="labelCol1">
              <a-input style="color: #000c17" :disabled="true" v-model="model.reasonReopening"
                       placeholder="申请复开原因"></a-input>
            </a-form-model-item>
          </a-col>


          <a-col :span="24">
            <a-form-model-item label="材料标签选择" prop="userOpenState" v-bind="labelCol1">
              <a-radio-group v-model="model.materialLabel" button-style="solid">
                <a-radio-button v-if="model.materialLabel == '0'" value="0">材料不全（有特审）</a-radio-button>
                <a-radio-button v-if="model.materialLabel == '1'" value="1">材料齐全（无特审）</a-radio-button>
              </a-radio-group>
            </a-form-model-item>
          </a-col>


          <a-col :span="24">
            <a-form-model-item label="关停标签选择" prop="userOpenState" v-bind="labelCol1">
              <a-radio-group v-model="model.shutdownLabel" button-style="solid">
                <a-radio-button v-if="model.shutdownLabel == '0'" value="0">安防停机（高危漫游地）</a-radio-button>
                <a-radio-button v-if="model.shutdownLabel == '1'" value="1">安防关停（紫名单）</a-radio-button>
                <a-radio-button v-if="model.shutdownLabel == '2'" value="2">安防停机（专班研判）</a-radio-button>
                <a-radio-button v-if="model.shutdownLabel == '3'" value="3">安防停机（可复开)</a-radio-button>
                <a-radio-button v-if="model.shutdownLabel == '4'" value="4">沉默移动卡保护性单停</a-radio-button>
                <a-radio-button v-if="model.shutdownLabel == '5'" value="5">集团一点停复机（单停）</a-radio-button>
                <a-radio-button v-if="model.shutdownLabel == '6'" value="6">大数据保护停机单停</a-radio-button>
                <a-radio-button v-if="model.shutdownLabel == '7'" value="7">工信部断卡单停</a-radio-button>
                <a-radio-button v-if="model.shutdownLabel == '8'" value="8">实人核验未通过关停（单停）</a-radio-button>
              </a-radio-group>
            </a-form-model-item>
          </a-col>


          <div>
            <a-form-model-item label="稽核状态" prop="basicCheckState" v-bind="labelCol1">
              <a-radio-group v-model="specialResult.basicInfoState">
                <a-radio :value="0">未通过</a-radio>
                <a-radio :value="1">通过</a-radio>
              </a-radio-group>
            </a-form-model-item>
            <a-form-model-item label="稽核结果" prop="basicCheckNote" v-bind="labelCol1">
              <a-textarea
                v-model="specialResult.basicInfoNote"
                placeholder="请输入稽核结果"
              />
              <!--            :auto-size="{ minRows: 3, maxRows: 5 }"-->
            </a-form-model-item>
          </div>

        </a-card>
        <!--        系统实名制截图-->
        <a-card :bordered="true">
          <div slot="title">
            系统实名制截图
            <span v-show="specialResult.nameFindComplianceState == '1'">✅</span>
            <span v-show="specialResult.nameFindComplianceState == '0'">❌</span>
          </div>

          <div class="clearfix">
            <div style="width: 50%;left: 25%;position: relative">
              <!-- swiper1 -->
              <swiper
                class="swiper gallery-top"
                :options="swiperOptionTop"
                ref="swiperTop"
              >
                <swiper-slide class="slide-1" v-for="(item, index) in fileListNameFindCompliance" :key="item.id">
                  <iframe
                    v-if="item.urlBase"
                    frameborder="1"
                    :src="item.urlBase"
                    ref="ifr"
                    width="80%"
                    height="400px"
                    scrolling="auto">
                  </iframe>
                  <img style="width: 80%;height: 400px;border: 1px solid;"
                       v-if="!item.urlBase" :src="noDataPng" border="1">

                </swiper-slide>
              </swiper>
              <!-- swiper2 Thumbs -->
              <swiper
                class="swiper gallery-thumbs"
                :options="swiperOptionThumbs"
                ref="swiperThumbs"
              >
                <swiper-slide
                  class="slide"
                  style="width:100px;height:100px;"
                  v-for="(item, index) in fileListNameFindCompliance"
                  :key="item.id"
                >
                  <div v-if="item.urlBase" style="width: 100%;height: 96px;background: rgb(68,142,247);color: white">
                    <span style="white-space:normal; word-break:break-all;overflow:hidden;">{{ item.fileName }}</span>
                  </div>

                  <img style="width: 100%;height: 96px"
                       v-if="!item.urlBase" :src="noDataPng" border="1">

                </swiper-slide>

                <div class="swiper-button-next swiper-button-white" slot="button-next">
                  <div>
                    <!--                  <img src="../../../../assets/images/nextImg.png" alt=""/>-->
                  </div>
                </div>
                <div class="swiper-button-prev swiper-button-white" slot="button-prev">
                  <div>
                    <!--                  <img src="../../../../assets/images/prevImg.png" alt=""/>-->
                  </div>
                </div>
              </swiper>
            </div>
          </div>
          <div>
            <!--              备注-->
            <li style="left: 5%;width: 80%;color: blue;position: relative">
              系统实名质截图备注：{{ nameFindComplianceRemark }}
            </li>
            <a-form-model-item label="稽核状态" prop="basicCheckState" v-bind="labelCol1">
              <a-radio-group v-model="specialResult.nameFindComplianceState">
                <a-radio :value=0>未通过</a-radio>
                <a-radio :value=1>通过</a-radio>
              </a-radio-group>
            </a-form-model-item>
            <a-form-model-item label="稽核结果" prop="basicCheckNote" v-bind="labelCol1">
              <a-textarea
                v-model="specialResult.nameFindComplianceNote"
                placeholder="请输入稽核结果"
              />
              <!--            :auto-size="{ minRows: 3, maxRows: 5 }"-->
            </a-form-model-item>
          </div>

        </a-card>
        <!--        特审单-->
        <a-card v-if="model.materialLabel == '0'" :bordered="true">
          <div slot="title">
            特审单
            <span v-show="specialResult.specialReviewFormState == '1'">✅</span>
            <span v-show="specialResult.specialReviewFormState == '0'">❌</span>
          </div>

          <div class="clearfix">
            <div style="width: 50%;left: 25%;position: relative">
              <!-- swiper1 -->
              <swiper
                class="swiper gallery-top"
                :options="swiperOptionTop"
                ref="swiperTop"
              >
                <swiper-slide class="slide-1" v-for="(item, index) in fileListSpecialReviewForm" :key="item.id">
                  <iframe
                    v-if="item.urlBase"
                    frameborder="1"
                    :src="item.urlBase"
                    ref="ifr"
                    width="80%"
                    height="400px"
                    scrolling="auto">
                  </iframe>
                  <img style="width: 80%;height: 400px;border: 1px solid;"
                       v-if="!item.urlBase" :src="noDataPng" border="1">

                </swiper-slide>
              </swiper>
              <!-- swiper2 Thumbs -->
              <swiper
                class="swiper gallery-thumbs"
                :options="swiperOptionThumbs"
                ref="swiperThumbs"
              >
                <swiper-slide
                  class="slide"
                  style="width:100px;height:100px;"
                  v-for="(item, index) in fileListSpecialReviewForm"
                  :key="item.id"
                >
                  <div v-if="item.urlBase" style="width: 100%;height: 96px;background: rgb(68,142,247);color: white">
                    <span style="white-space:normal; word-break:break-all;overflow:hidden;">{{ item.fileName }}</span>
                  </div>

                  <img style="width: 100%;height: 96px"
                       v-if="!item.urlBase" :src="noDataPng" border="1">

                </swiper-slide>

                <div class="swiper-button-next swiper-button-white" slot="button-next">
                  <div>
                    <!--                  <img src="../../../../assets/images/nextImg.png" alt=""/>-->
                  </div>
                </div>
                <div class="swiper-button-prev swiper-button-white" slot="button-prev">
                  <div>
                    <!--                  <img src="../../../../assets/images/prevImg.png" alt=""/>-->
                  </div>
                </div>
              </swiper>
            </div>
          </div>

          <div>
            <a-form-model-item label="稽核状态" prop="basicCheckState" v-bind="labelCol1">
              <a-radio-group v-model="specialResult.specialReviewFormState">
                <a-radio :value="0">未通过</a-radio>
                <a-radio :value="1">通过</a-radio>
              </a-radio-group>
            </a-form-model-item>
            <a-form-model-item label="稽核结果" prop="basicCheckNote" v-bind="labelCol1">
              <a-textarea
                v-model="specialResult.specialReviewFormNote"
                placeholder="请输入稽核结果"
              />
              <!--            :auto-size="{ minRows: 3, maxRows: 5 }"-->
            </a-form-model-item>
          </div>

        </a-card>

        <!--        身份证照片/正反面-->
        <a-card :bordered="true">
          <div slot="title">
            身份证照片/正反面
            <span v-show="specialResult.idCardState == '1'">✅</span>
            <span v-show="specialResult.idCardState == '0'">❌</span>
          </div>

          <div class="clearfix">
            <div style="width: 50%;left: 25%;position: relative">
              <!-- swiper1 -->
              <swiper
                class="swiper gallery-top"
                :options="swiperOptionTop"
                ref="swiperTop"
              >
                <swiper-slide class="slide-1" v-for="(item, index) in fileListIdCard" :key="item.id">
                  <iframe
                    v-if="item.urlBase"
                    frameborder="1"
                    :src="item.urlBase"
                    ref="ifr"
                    width="80%"
                    height="400px"
                    scrolling="auto">
                  </iframe>
                  <img style="width: 80%;height: 400px;border: 1px solid;"
                       v-if="!item.urlBase" :src="noDataPng" border="1">

                </swiper-slide>
              </swiper>
              <!-- swiper2 Thumbs -->
              <swiper
                class="swiper gallery-thumbs"
                :options="swiperOptionThumbs"
                ref="swiperThumbs"
              >
                <swiper-slide
                  class="slide"
                  style="width:100px;height:100px;"
                  v-for="(item, index) in fileListIdCard"
                  :key="item.id"
                >
                  <div v-if="item.urlBase" style="width: 100%;height: 96px;background: rgb(68,142,247);color: white">
                    <span style="white-space:normal; word-break:break-all;overflow:hidden;">{{ item.fileName }}</span>
                  </div>

                  <img style="width: 100%;height: 96px"
                       v-if="!item.urlBase" :src="noDataPng" border="1">

                </swiper-slide>

                <div class="swiper-button-next swiper-button-white" slot="button-next">
                  <div>
                    <!--                  <img src="../../../../assets/images/nextImg.png" alt=""/>-->
                  </div>
                </div>
                <div class="swiper-button-prev swiper-button-white" slot="button-prev">
                  <div>
                    <!--                  <img src="../../../../assets/images/prevImg.png" alt=""/>-->
                  </div>
                </div>
              </swiper>
            </div>
          </div>

          <div>
            <a-form-model-item label="稽核状态" prop="basicCheckState" v-bind="labelCol1">
              <a-radio-group v-model="specialResult.idCardState">
                <a-radio :value="0">未通过</a-radio>
                <a-radio :value="1">通过</a-radio>
              </a-radio-group>
            </a-form-model-item>
            <a-form-model-item label="稽核结果" prop="basicCheckNote" v-bind="labelCol1">
              <a-textarea
                v-model="specialResult.idCardNote"
                placeholder="请输入稽核结果"
              />
              <!--            :auto-size="{ minRows: 3, maxRows: 5 }"-->
            </a-form-model-item>
          </div>

        </a-card>
        <!--        手持证件半身照片-->
        <a-card :bordered="true">
          <div slot="title">
            手持证件半身照片
            <span v-show="specialResult.handCertificateState == '1'">✅</span>
            <span v-show="specialResult.handCertificateState == '0'">❌</span>
          </div>

          <div class="clearfix">
            <div style="width: 50%;left: 25%;position: relative">
              <!-- swiper1 -->
              <swiper
                class="swiper gallery-top"
                :options="swiperOptionTop"
                ref="swiperTop"
              >
                <swiper-slide class="slide-1" v-for="(item, index) in fileListHandCertificate" :key="item.id">
                  <iframe
                    v-if="item.urlBase"
                    frameborder="1"
                    :src="item.urlBase"
                    ref="ifr"
                    width="80%"
                    height="400px"
                    scrolling="auto">
                  </iframe>
                  <img style="width: 80%;height: 400px;border: 1px solid;"
                       v-if="!item.urlBase" :src="noDataPng" border="1">

                </swiper-slide>
              </swiper>
              <!-- swiper2 Thumbs -->
              <swiper
                class="swiper gallery-thumbs"
                :options="swiperOptionThumbs"
                ref="swiperThumbs"
              >
                <swiper-slide
                  class="slide"
                  style="width:100px;height:100px;"
                  v-for="(item, index) in fileListHandCertificate"
                  :key="item.id"
                >
                  <div v-if="item.urlBase" style="width: 100%;height: 96px;background: rgb(68,142,247);color: white">
                    <span style="white-space:normal; word-break:break-all;overflow:hidden;">{{ item.fileName }}</span>
                  </div>

                  <img style="width: 100%;height: 96px"
                       v-if="!item.urlBase" :src="noDataPng" border="1">

                </swiper-slide>

                <div class="swiper-button-next swiper-button-white" slot="button-next">
                  <div>
                    <!--                  <img src="../../../../assets/images/nextImg.png" alt=""/>-->
                  </div>
                </div>
                <div class="swiper-button-prev swiper-button-white" slot="button-prev">
                  <div>
                    <!--                  <img src="../../../../assets/images/prevImg.png" alt=""/>-->
                  </div>
                </div>
              </swiper>
            </div>
          </div>

          <div>
            <a-form-model-item label="稽核状态" prop="basicCheckState" v-bind="labelCol1">
              <a-radio-group v-model="specialResult.handCertificateState">
                <a-radio :value="0">未通过</a-radio>
                <a-radio :value="1">通过</a-radio>
              </a-radio-group>
            </a-form-model-item>
            <a-form-model-item label="稽核结果" prop="basicCheckNote" v-bind="labelCol1">
              <a-textarea
                v-model="specialResult.handCertificateNote"
                placeholder="请输入稽核结果"
              />
              <!--            :auto-size="{ minRows: 3, maxRows: 5 }"-->
            </a-form-model-item>
          </div>

        </a-card>
        <!--        号卡照片-->
        <a-card v-if="model.userLable == '0'" :bordered="true">
          <div slot="title">
            号卡照片
            <span v-show="specialResult.numberCardState == '1'">✅</span>
            <span v-show="specialResult.numberCardState == '0'">❌</span>
          </div>
          <div class="clearfix">
            <div style="width: 50%;left: 25%;position: relative">
              <!-- swiper1 -->
              <swiper
                class="swiper gallery-top"
                :options="swiperOptionTop"
                ref="swiperTop"
              >
                <swiper-slide class="slide-1" v-for="(item, index) in fileListNumberCard" :key="item.id">
                  <iframe
                    v-if="item.urlBase"
                    frameborder="1"
                    :src="item.urlBase"
                    ref="ifr"
                    width="80%"
                    height="400px"
                    scrolling="auto">
                  </iframe>
                  <img style="width: 80%;height: 400px;border: 1px solid;"
                       v-if="!item.urlBase" :src="noDataPng" border="1">

                </swiper-slide>
              </swiper>
              <!-- swiper2 Thumbs -->
              <swiper
                class="swiper gallery-thumbs"
                :options="swiperOptionThumbs"
                ref="swiperThumbs"
              >
                <swiper-slide
                  class="slide"
                  style="width:100px;height:100px;"
                  v-for="(item, index) in fileListNumberCard"
                  :key="item.id"
                >
                  <div v-if="item.urlBase" style="width: 100%;height: 96px;background: rgb(68,142,247);color: white">
                    <span style="white-space:normal; word-break:break-all;overflow:hidden;">{{ item.fileName }}</span>
                  </div>

                  <img style="width: 100%;height: 96px"
                       v-if="!item.urlBase" :src="noDataPng" border="1">

                </swiper-slide>

                <div class="swiper-button-next swiper-button-white" slot="button-next">
                  <div>
                    <!--                  <img src="../../../../assets/images/nextImg.png" alt=""/>-->
                  </div>
                </div>
                <div class="swiper-button-prev swiper-button-white" slot="button-prev">
                  <div>
                    <!--                  <img src="../../../../assets/images/prevImg.png" alt=""/>-->
                  </div>
                </div>
              </swiper>
            </div>
          </div>

          <div>
            <a-form-model-item label="稽核状态" prop="basicCheckState" v-bind="labelCol1">
              <a-radio-group v-model="specialResult.numberCardState">
                <a-radio :value="0">未通过</a-radio>
                <a-radio :value="1">通过</a-radio>
              </a-radio-group>
            </a-form-model-item>
            <a-form-model-item label="稽核结果" prop="basicCheckNote" v-bind="labelCol1">
              <a-textarea
                v-model="specialResult.numberCardNote"
                placeholder="请输入稽核结果"
              />
              <!--            :auto-size="{ minRows: 3, maxRows: 5 }"-->
            </a-form-model-item>
          </div>
        </a-card>
        <!--        使用人证件-->
        <a-card v-if="model.userLable == '1'" :bordered="true">
          <div slot="title">
            使用人证件
            <span v-show="specialResult.userCertificateState == '1'">✅</span>
            <span v-show="specialResult.userCertificateState == '0'">❌</span>
          </div>
          <div class="clearfix">
            <div style="width: 50%;left: 25%;position: relative">
              <!-- swiper1 -->
              <swiper
                class="swiper gallery-top"
                :options="swiperOptionTop"
                ref="swiperTop"
              >
                <swiper-slide class="slide-1" v-for="(item, index) in fileListUserCertificate" :key="item.id">
                  <iframe
                    v-if="item.urlBase"
                    frameborder="1"
                    :src="item.urlBase"
                    ref="ifr"
                    width="80%"
                    height="400px"
                    scrolling="auto">
                  </iframe>
                  <img style="width: 80%;height: 400px;border: 1px solid;"
                       v-if="!item.urlBase" :src="noDataPng" border="1">

                </swiper-slide>
              </swiper>
              <!-- swiper2 Thumbs -->
              <swiper
                class="swiper gallery-thumbs"
                :options="swiperOptionThumbs"
                ref="swiperThumbs"
              >
                <swiper-slide
                  class="slide"
                  style="width:100px;height:100px;"
                  v-for="(item, index) in fileListUserCertificate"
                  :key="item.id"
                >
                  <div v-if="item.urlBase" style="width: 100%;height: 96px;background: rgb(68,142,247);color: white">
                    <span style="white-space:normal; word-break:break-all;overflow:hidden;">{{ item.fileName }}</span>
                  </div>

                  <img style="width: 100%;height: 96px"
                       v-if="!item.urlBase" :src="noDataPng" border="1">

                </swiper-slide>

                <div class="swiper-button-next swiper-button-white" slot="button-next">
                  <div>
                    <!--                  <img src="../../../../assets/images/nextImg.png" alt=""/>-->
                  </div>
                </div>
                <div class="swiper-button-prev swiper-button-white" slot="button-prev">
                  <div>
                    <!--                  <img src="../../../../assets/images/prevImg.png" alt=""/>-->
                  </div>
                </div>
              </swiper>
            </div>
          </div>
          <div>
            <a-form-model-item label="稽核状态" prop="basicCheckState" v-bind="labelCol1">
              <a-radio-group v-model="specialResult.userCertificateState">
                <a-radio :value="0">未通过</a-radio>
                <a-radio :value="1">通过</a-radio>
              </a-radio-group>
            </a-form-model-item>
            <a-form-model-item label="稽核结果" prop="basicCheckNote" v-bind="labelCol1">
              <a-textarea
                v-model="specialResult.userCertificateNote"
                placeholder="请输入稽核结果"
              />
              <!--            :auto-size="{ minRows: 3, maxRows: 5 }"-->
            </a-form-model-item>
          </div>
        </a-card>
        <!--        营业执照副本(盖公章)-->
        <a-card v-if="model.userLable == '1'" :bordered="true">

          <div slot="title">
            营业执照副本(盖公章)
            <span v-show="specialResult.businessLicenseState == '1'">✅</span>
            <span v-show="specialResult.businessLicenseState == '0'">❌</span>
          </div>
          <div class="clearfix">
            <div style="width: 50%;left: 25%;position: relative">
              <!-- swiper1 -->
              <swiper
                class="swiper gallery-top"
                :options="swiperOptionTop"
                ref="swiperTop"
              >
                <swiper-slide class="slide-1" v-for="(item, index) in fileListBusiness" :key="item.id">
                  <iframe
                    v-if="item.urlBase"
                    frameborder="1"
                    :src="item.urlBase"
                    ref="ifr"
                    width="80%"
                    height="400px"
                    scrolling="auto">
                  </iframe>
                  <img style="width: 80%;height: 400px;border: 1px solid;"
                       v-if="!item.urlBase" :src="noDataPng" border="1">

                </swiper-slide>
              </swiper>
              <!-- swiper2 Thumbs -->
              <swiper
                class="swiper gallery-thumbs"
                :options="swiperOptionThumbs"
                ref="swiperThumbs"
              >
                <swiper-slide
                  class="slide"
                  style="width:100px;height:100px;"
                  v-for="(item, index) in fileListBusiness"
                  :key="item.id"
                >
                  <div v-if="item.urlBase" style="width: 100%;height: 96px;background: rgb(68,142,247);color: white">
                    <span style="white-space:normal; word-break:break-all;overflow:hidden;">{{ item.fileName }}</span>
                  </div>

                  <img style="width: 100%;height: 96px"
                       v-if="!item.urlBase" :src="noDataPng" border="1">

                </swiper-slide>

                <div class="swiper-button-next swiper-button-white" slot="button-next">
                  <div>
                    <!--                  <img src="../../../../assets/images/nextImg.png" alt=""/>-->
                  </div>
                </div>
                <div class="swiper-button-prev swiper-button-white" slot="button-prev">
                  <div>
                    <!--                  <img src="../../../../assets/images/prevImg.png" alt=""/>-->
                  </div>
                </div>
              </swiper>
            </div>
          </div>
          <div>
            <a-form-model-item label="稽核状态" prop="basicCheckState" v-bind="labelCol1">
              <a-radio-group v-model="specialResult.businessLicenseState">
                <a-radio :value="0">未通过</a-radio>
                <a-radio :value="1">通过</a-radio>
              </a-radio-group>
            </a-form-model-item>
            <a-form-model-item label="稽核结果" prop="basicCheckNote" v-bind="labelCol1">
              <a-textarea
                v-model="specialResult.businessLicenseNote"
                placeholder="请输入稽核结果"
              />
              <!--            :auto-size="{ minRows: 3, maxRows: 5 }"-->
            </a-form-model-item>
          </div>
        </a-card>
        <!--        介绍信-->
        <a-card v-if="model.userLable == '1'" :bordered="true">
          <div slot="title">
            介绍信
            <span v-show="specialResult.letterIntroductionState == '1'">✅</span>
            <span v-show="specialResult.letterIntroductionState == '0'">❌</span>
          </div>
          <div class="clearfix">
            <div style="width: 50%;left: 25%;position: relative">
              <!-- swiper1 -->
              <swiper
                class="swiper gallery-top"
                :options="swiperOptionTop"
                ref="swiperTop"
              >
                <swiper-slide class="slide-1" v-for="(item, index) in fileListIntroduction" :key="item.id">
                  <iframe
                    v-if="item.urlBase"
                    frameborder="1"
                    :src="item.urlBase"
                    ref="ifr"
                    width="80%"
                    height="400px"
                    scrolling="auto">
                  </iframe>
                  <img style="width: 80%;height: 400px;border: 1px solid;"
                       v-if="!item.urlBase" :src="noDataPng" border="1">

                </swiper-slide>
              </swiper>
              <!-- swiper2 Thumbs -->
              <swiper
                class="swiper gallery-thumbs"
                :options="swiperOptionThumbs"
                ref="swiperThumbs"
              >
                <swiper-slide
                  class="slide"
                  style="width:100px;height:100px;"
                  v-for="(item, index) in fileListIntroduction"
                  :key="item.id"
                >
                  <div v-if="item.urlBase" style="width: 100%;height: 96px;background: rgb(68,142,247);color: white">
                    <span style="white-space:normal; word-break:break-all;overflow:hidden;">{{ item.fileName }}</span>
                  </div>

                  <img style="width: 100%;height: 96px"
                       v-if="!item.urlBase" :src="noDataPng" border="1">

                </swiper-slide>

                <div class="swiper-button-next swiper-button-white" slot="button-next">
                  <div>
                    <!--                  <img src="../../../../assets/images/nextImg.png" alt=""/>-->
                  </div>
                </div>
                <div class="swiper-button-prev swiper-button-white" slot="button-prev">
                  <div>
                    <!--                  <img src="../../../../assets/images/prevImg.png" alt=""/>-->
                  </div>
                </div>
              </swiper>
            </div>
          </div>

          <div>
            <a-form-model-item label="稽核状态" prop="basicCheckState" v-bind="labelCol1">
              <a-radio-group v-model="specialResult.letterIntroductionState">
                <a-radio :value="0">未通过</a-radio>
                <a-radio :value="1">通过</a-radio>
              </a-radio-group>
            </a-form-model-item>
            <a-form-model-item label="稽核结果" prop="basicCheckNote" v-bind="labelCol1">
              <a-textarea
                v-model="specialResult.letterIntroductionNote"
                placeholder="请输入稽核结果"
              />
              <!--            :auto-size="{ minRows: 3, maxRows: 5 }"-->
            </a-form-model-item>
          </div>
        </a-card>
        <!--        防诈骗承诺涵（使用人签署）-->
        <a-card :bordered="true">
          <div slot="title">
            防诈骗承诺涵（使用人签署）
            <span v-show="specialResult.fraudPreventionState == '1'">✅</span>
            <span v-show="specialResult.fraudPreventionState == '0'">❌</span>
          </div>
          <div class="clearfix">
            <div style="width: 50%;left: 25%;position: relative">
              <!-- swiper1 -->
              <swiper
                class="swiper gallery-top"
                :options="swiperOptionTop"
                ref="swiperTop"
              >
                <swiper-slide class="slide-1" v-for="(item, index) in fileListLetter" :key="item.id">
                  <iframe
                    v-if="item.urlBase"
                    frameborder="1"
                    :src="item.urlBase"
                    ref="ifr"
                    width="80%"
                    height="400px"
                    scrolling="auto">
                  </iframe>
                  <img style="width: 80%;height: 400px;border: 1px solid;"
                       v-if="!item.urlBase" :src="noDataPng" border="1">

                </swiper-slide>
              </swiper>
              <!-- swiper2 Thumbs -->
              <swiper
                class="swiper gallery-thumbs"
                :options="swiperOptionThumbs"
                ref="swiperThumbs"
              >
                <swiper-slide
                  class="slide"
                  style="width:100px;height:100px;"
                  v-for="(item, index) in fileListLetter"
                  :key="item.id"
                >
                  <div v-if="item.urlBase" style="width: 100%;height: 96px;background: rgb(68,142,247);color: white">
                    <span style="white-space:normal; word-break:break-all;overflow:hidden;">{{ item.fileName }}</span>
                  </div>

                  <img style="width: 100%;height: 96px"
                       v-if="!item.urlBase" :src="noDataPng" border="1">

                </swiper-slide>

                <div class="swiper-button-next swiper-button-white" slot="button-next">
                  <div>
                    <!--                  <img src="../../../../assets/images/nextImg.png" alt=""/>-->
                  </div>
                </div>
                <div class="swiper-button-prev swiper-button-white" slot="button-prev">
                  <div>
                    <!--                  <img src="../../../../assets/images/prevImg.png" alt=""/>-->
                  </div>
                </div>
              </swiper>
            </div>
          </div>

          <div>
            <a-form-model-item label="稽核状态" prop="basicCheckState" v-bind="labelCol1">
              <a-radio-group v-model="specialResult.fraudPreventionState">
                <a-radio :value=0>未通过</a-radio>
                <a-radio :value=1>通过</a-radio>
              </a-radio-group>
            </a-form-model-item>
            <a-form-model-item label="稽核结果" prop="basicCheckNote" v-bind="labelCol1">
              <a-textarea
                v-model="specialResult.fraudPreventionNote"
                placeholder="请输入稽核结果"
              />
              <!--            :auto-size="{ minRows: 3, maxRows: 5 }"-->
            </a-form-model-item>
          </div>
        </a-card>
        <!--        消费凭证-->
        <a-card v-if="model.shutdownLabel == '0'" :bordered="true">
          <div slot="title">
            消费凭证
            <span v-show="specialResult.consumptionVoucherState == '1'">✅</span>
            <span v-show="specialResult.consumptionVoucherState == '0'">❌</span>
          </div>
          <div class="clearfix">
            <div style="width: 50%;left: 25%;position: relative">
              <!-- swiper1 -->
              <swiper
                class="swiper gallery-top"
                :options="swiperOptionTop"
                ref="swiperTop"
              >
                <swiper-slide class="slide-1" v-for="(item, index) in fileListVoucher" :key="item.id">
                  <iframe
                    v-if="item.urlBase"
                    frameborder="1"
                    :src="item.urlBase"
                    ref="ifr"
                    width="80%"
                    height="400px"
                    scrolling="auto">
                  </iframe>
                  <img style="width: 80%;height: 400px;border: 1px solid;"
                       v-if="!item.urlBase" :src="noDataPng" border="1">

                </swiper-slide>
              </swiper>
              <!-- swiper2 Thumbs -->
              <swiper
                class="swiper gallery-thumbs"
                :options="swiperOptionThumbs"
                ref="swiperThumbs"
              >
                <swiper-slide
                  class="slide"
                  style="width:100px;height:100px;"
                  v-for="(item, index) in fileListVoucher"
                  :key="item.id"
                >
                  <div v-if="item.urlBase" style="width: 100%;height: 96px;background: rgb(68,142,247);color: white">
                    <span style="white-space:normal; word-break:break-all;overflow:hidden;">{{ item.fileName }}</span>
                  </div>

                  <img style="width: 100%;height: 96px"
                       v-if="!item.urlBase" :src="noDataPng" border="1">

                </swiper-slide>

                <div class="swiper-button-next swiper-button-white" slot="button-next">
                  <div>
                    <!--                  <img src="../../../../assets/images/nextImg.png" alt=""/>-->
                  </div>
                </div>
                <div class="swiper-button-prev swiper-button-white" slot="button-prev">
                  <div>
                    <!--                  <img src="../../../../assets/images/prevImg.png" alt=""/>-->
                  </div>
                </div>
              </swiper>
            </div>
          </div>
          <div>
            <a-form-model-item label="稽核状态" prop="basicCheckState" v-bind="labelCol1">
              <a-radio-group v-model="specialResult.consumptionVoucherState">
                <a-radio :value="0">未通过</a-radio>
                <a-radio :value="1">通过</a-radio>
              </a-radio-group>
            </a-form-model-item>
            <a-form-model-item label="稽核结果" prop="basicCheckNote" v-bind="labelCol1">
              <a-textarea
                v-model="specialResult.consumptionVoucherNote"
                placeholder="请输入稽核结果"
              />
              <!--            :auto-size="{ minRows: 3, maxRows: 5 }"-->
            </a-form-model-item>
          </div>

        </a-card>

        <!--        承诺视频-->
        <a-card v-if="model.shutdownLabel == '5'" :bordered="true">
          <div slot="title">
            承诺视频
            <span v-show="specialResult.commitmentVideoState == '1'">✅</span>
            <span v-show="specialResult.commitmentVideoState == '0'">❌</span>
          </div>
          <div class="clearfix">
            <div style="width: 50%;left: 25%;position: relative">
              <!-- swiper1 -->
              <swiper
                class="swiper gallery-top"
                :options="swiperOptionTop"
                ref="swiperTop"
              >
                <swiper-slide class="slide-1" v-for="(item, index) in fileListVideo" :key="item.id">
                  <iframe
                    v-if="item.urlBase"
                    frameborder="1"
                    :src="item.urlBase"
                    ref="ifr"
                    width="80%"
                    height="400px"
                    scrolling="auto">
                  </iframe>
                  <img style="width: 80%;height: 400px;border: 1px solid;"
                       v-if="!item.urlBase" :src="noDataPng" border="1">

                </swiper-slide>
              </swiper>
              <!-- swiper2 Thumbs -->
              <swiper
                class="swiper gallery-thumbs"
                :options="swiperOptionThumbs"
                ref="swiperThumbs"
              >
                <swiper-slide
                  class="slide"
                  style="width:100px;height:100px;"
                  v-for="(item, index) in fileListVideo"
                  :key="item.id"
                >
                  <div v-if="item.urlBase" style="width: 100%;height: 96px;background: rgb(68,142,247);color: white">
                    <span style="white-space:normal; word-break:break-all;overflow:hidden;">{{ item.fileName }}</span>
                  </div>

                  <img style="width: 100%;height: 96px"
                       v-if="!item.urlBase" :src="noDataPng" border="1">

                </swiper-slide>

                <div class="swiper-button-next swiper-button-white" slot="button-next">
                  <div>
                    <!--                  <img src="../../../../assets/images/nextImg.png" alt=""/>-->
                  </div>
                </div>
                <div class="swiper-button-prev swiper-button-white" slot="button-prev">
                  <div>
                    <!--                  <img src="../../../../assets/images/prevImg.png" alt=""/>-->
                  </div>
                </div>
              </swiper>
            </div>
          </div>
          <div>
            <a-form-model-item label="稽核状态" prop="basicCheckState" v-bind="labelCol1">
              <a-radio-group v-model="specialResult.commitmentVideoState">
                <a-radio :value="0">未通过</a-radio>
                <a-radio :value="1">通过</a-radio>
              </a-radio-group>
            </a-form-model-item>
            <a-form-model-item label="稽核结果" prop="basicCheckNote" v-bind="labelCol1">
              <a-textarea
                v-model="specialResult.commitmentVideoNote"
                placeholder="请输入稽核结果"
              />
              <!--            :auto-size="{ minRows: 3, maxRows: 5 }"-->
            </a-form-model-item>
          </div>
        </a-card>


      </a-form-model>

      <a-form-model
        ref="form"
        :label-col="labelCol"
        :wrapper-col="wrapperCol"
        :model="model"
      >
        <a-form-model-item style="margin-top: 30px;">
          <a-col :span="11">
          </a-col>
          <a-col :span="6">

            <a-col :span="6">
              <a-button style="width: 100px" type="primary" @click="submitSpecial">提交稽核</a-button>
            </a-col>
          </a-col>
        </a-form-model-item>


      </a-form-model>

    </a-card>
  </div>

</template>

<script>
import '@/assets/less/TableExpand.less'
import {httpAction, getAction, postAction} from '@api/manage'
import {message} from 'ant-design-vue'
import {JeecgListMixin} from "@/mixins/JeecgListMixin";
import Vue from "vue";
import {ACCESS_TOKEN, TENANT_ID} from "@/store/mutation-types";
/*无数据图片*/
import noDataPng from '@/assets/nodata.png'

let Base64 = require('js-base64').Base64
export default {
  mixins: [JeecgListMixin],
  inject: ['closeCurrent'],
  data() {
    return {
      //缩略与大图数据源
      swiperId: 0 + 1,
      //轮播配置
      swiperOptionTop: {
        zoom: true,
        loop: false,
        loopedSlides: 5, // looped slides should be the same
        spaceBetween: 10,
        observer: true, //修改swiper自己或子元素时，自动初始化swiper
        observeParents: true, //修改swiper的父元素时，自动初始化swiper
        // autoplay: {  //自动轮播
        //   delay: 2000,
        //   disableOnInteraction: false
        // },
        navigation: {
          nextEl: '.swiper-button-next',
          prevEl: '.swiper-button-prev'
        }
      },
      swiperOptionThumbs: {
        loop: false,
        loopedSlides: 5, // looped slides should be the same
        spaceBetween: 10,
        centeredSlides: true,
        slidesPerView: 'auto',
        touchRatio: 0.2,
        slideToClickedSlide: true,
        navigation: {
          nextEl: '.swiper-button-next',
          prevEl: '.swiper-button-prev'
        }
      },
      /**无数据图片*/
      noDataPng: noDataPng,
      dataId: "",
      description: '详情页面',
      specialNote: "",
      model: {
        "shutdownLabel": "0",
        "materialLabel": "0",
        "userLable": "0",
        "openingNumber": ""
      },
      //结果
      specialResult: {
        //基础信息
        basicInfoState: null,
        basicInfoNote: "",
        //系统实名截图
        nameFindComplianceState: null,
        nameFindComplianceNote: "",
        //特审单
        specialReviewFormState: null,
        specialReviewFormNote: "",
        //身份证照片/正反面
        idCardState: null,
        idCardNote: "",
        //手持证件半身照片
        handCertificateState: null,
        handCertificateNote: "",
        //号卡照片
        numberCardState: null,
        numberCardNote: "",
        //使用人证件
        userCertificateState: null,
        userCertificateNote: "",
        //营业执照
        businessLicenseState: null,
        businessLicenseNote: "",
        //介绍信
        letterIntroductionState: null,
        letterIntroductionNote: "",
        //防诈骗承诺函
        fraudPreventionState: null,
        fraudPreventionNote: "",
        //消费凭证
        consumptionVoucherState: null,
        consumptionVoucherNote: "",
        //承诺视频
        commitmentVideoState: null,
        commitmentVideoNote: "",
      },
      //系统实名制截图
      fileListNameFindCompliance: [],
      //系统实名制截图备注
      nameFindComplianceRemark: "",
      //特审单
      fileListSpecialReviewForm: [],
      //身份证正反面
      fileListIdCard: [],
      //手持证件照片
      fileListHandCertificate: [],
      //号卡照片
      fileListNumberCard: [],
      //防诈骗承诺涵
      fileListLetter: [],
      //营业执照副本
      fileListBusiness: [],
      //介绍信
      fileListIntroduction: [],
      //使用人证件
      fileListUserCertificate: [],
      //消费凭证
      fileListVoucher: [],
      //承诺视频
      fileListVideo: [],

      previewVisible: false,
      previewVideo: false,
      previewImage: "",

      adoptVisible: false,
      reopenTime: "",

      tipsMessage: "",
      tipType: "",

      labelCol: {span: 1},
      wrapperCol: {span: 23},
      // 1列
      labelCol1: {
        labelCol: {
          xs: {span: 24},
          sm: {span: 2},
        },
        wrapperCol: {
          xs: {span: 24},
          sm: {span: 21},
        }
      },
      // 2列
      labelCol2: {
        labelCol: {
          xs: {span: 24},
          sm: {span: 4},
        },
        wrapperCol: {
          xs: {span: 24},
          sm: {span: 18},
        }
      },
      info: {
        dataId: "",
      },
      url: {
        findById: "/special/examination/find/id",
        adopt: "/special/examination/status/adopt",
        queryInfo: "/smsCheck/customerInfo/queryById",
        submitSpecial: "/special/examination/check/info",
        //list:"",
      },
      result: {},

    }
  },
  computed: {
    importMinioUploadAction() {
      return window._CONFIG['domianURL'] + this.url.minioUpload;
    },
    tokenHeader() {
      let head = {'X-Access-Token': Vue.ls.get(ACCESS_TOKEN)}
      let tenantid = Vue.ls.get(TENANT_ID)
      if (tenantid) {
        head['tenant-id'] = tenantid
      }
      return head;
    }
  },
  created() {
    this.info.id = this.$route.query.id;
    this.queryInfoById(this.info.id);
  },
  mounted() {
    // 实现swiper双向控制
    this.$nextTick(() => {
      const swiperTop = this.$refs.swiperTop.swiper
      const swiperThumbs = this.$refs.swiperThumbs.swiper
      swiperTop.controller.control = swiperThumbs
      swiperThumbs.controller.control = swiperTop
    })
    this.findById(this.info.id)
  },
  methods: {
    /**提交稽核*/
    submitSpecial() {
      let that = this
      let specialResult = that.specialResult;
      let materialLabel = that.model.materialLabel;
      let userLable = that.model.userLable;
      //有特审
      if (materialLabel == '0') {
        if (specialResult.specialReviewFormState == null) {
          that.$message.warn("请完成相关稽核");
          return;
        }
      }
      //必稽核项
      if (specialResult.basicInfoState == null || specialResult.nameFindComplianceState == null
        || specialResult.idCardState == null || specialResult.handCertificateState == null ||
        specialResult.fraudPreventionState == null) {
        that.$message.warn("请完成相关稽核");
        return;
      }
      if (userLable == '0') {
        if (specialResult.numberCardState == null) {
          that.$message.warn("请完成相关稽核");
          return;
        }
      }
      if (userLable == '1') {
        if (specialResult.userCertificateState == null || specialResult.businessLicenseState == null
          || specialResult.letterIntroductionState) {
          that.$message.warn("请完成相关稽核");
          return;
        }
      }
      if (userLable == '5') {
        if (specialResult.commitmentVideoState == null) {
          that.$message.warn("请完成相关稽核");
          return;
        }
      }
      let SpecialParams = {}
      SpecialParams = that.specialResult
      SpecialParams['dataId'] = that.dataId
      SpecialParams['infoId'] = that.info.id
      postAction(that.url.submitSpecial, SpecialParams).then(res => {
        if (res.success) {
          this.$message.success("稽核完成");
          this.$router.go(-1);
          this.closeCurrent();
        }
      }).finally(() => {

      })
    },

    /**获取客户信息*/
    queryInfoById(id) {
      let url = this.url.queryInfo;
      let params = {
        id: id
      }
      let that = this;
      getAction(url, params).then(res => {
        if (res.success) {
          that.info = res.result
          //当前状态
          let checkState = that.info.checkState;
          //that.info.statusFilter = this.statusFilter(checkState);

        }
      }).finally(() => {

      })
    },
    /**返回上一级*/
    back() {
      //关闭当前页
      this.$router.go(-1);
      this.closeCurrent();
    },
    adoptOk() {
      if (this.reopenTime == null || this.reopenTime.length == 0) {
        message.error('请设置复开时间');
        return;
      }

      let model = {
        "infoId": this.info.id,
        reopenTime: this.reopenTime,
        status: 5
      }
      postAction(this.url.adopt, model)
        .then((res) => {
          if (res.success) {
            this.adoptVisible = false
            this.reopenTime = ""
            message.success('稽核完成')
            this.goBack();
          } else {
            this.$message.error(res.message);
          }
        }).finally(() => {

      })


    },


    //驳回
    rejectSpecial() {
      let model = {
        "infoId": this.info.id,
        specialNote: this.specialNote,
        status: 4
      }
      postAction(this.url.adopt, model)
        .then((res) => {
          if (res.success) {
            this.adoptVisible = false
            this.reopenTime = ""
            message.success('稽核完成')
            this.goBack();
          } else {
            this.$message.error(res.message);
          }
        }).finally(() => {

      })
    },

    //通过
    adoptSpecial() {
      this.adoptVisible = true;
    },
    handleVideoCancel() {
      this.previewVideo = false;
    },
    // 开启定时器
    openTimer() {
      this.timer = setInterval(() => {
        this.$emit("videoStudyTime", this.studyTime);
      }, 5000);
    },
    // 关闭定时器
    closeTimer() {
      clearInterval(this.timer);
      this.$emit("videoStudyTime", this.studyTime);
    },
    // 开启暂停定时器
    openPauseTimer() {
      this.pauseTimer = setInterval(() => {
        this.hintOperate();
      }, 600000);
    },
    // 关闭暂停定时器
    closePauseTimer() {
      clearInterval(this.pauseTimer);
    },
    // 提示操作
    hintOperate() {
      this.operateVideo();
      this.$alert("请点击确认继续学习", "提示", {
        confirmButtonText: "确定",
        confirmButtonClass: "hint-btn",
        showClose: false,
        callback: action => {
          this.$refs.myVideo.currentTime = this.videoData.currentTime;
          this.operateVideo();
          this.openPauseTimer();
        }
      });
    },
    // 获取当前播放位置
    timeupdate(e) {
      this.studyTime.currentTime = e.target.currentTime;
      this.studyTime.duration = e.target.duration ? e.target.duration : 0;
    },
    // 操作视频播放、暂停
    operateVideo() {
      if (!this.src) {
        this.$message({message: "暂无视频资源，请查看其他视频！"});
        return false;
      }
      if (this.$refs.myVideo.paused) {
        this.$refs.myVideo.play();
        this.videoState = true;
      } else {
        this.$refs.myVideo.pause();
        this.videoState = false;
      }
    },

    formateDate(date) {
      const arr = date.split('T');
      const d = arr[0];
      const darr = d.split('-');

      const t = arr[1];
      const tarr = t.split('.000');
      const marr = tarr[0].split(':');

      const dd =
        parseInt(darr[0]) +
        '-' +
        parseInt(darr[1]) +
        '-' +
        parseInt(darr[2]) +
        ' ' +
        parseInt(marr[0]) +
        ':' +
        parseInt(marr[1]) +
        ':' +
        parseInt(marr[2]);
      return dd;
    },


    // 返回上一级
    goBack() {
      this.$router.go(-1);
      this.closeCurrent();
    },
    /**包装轮播数据*/
    packageArr(data) {
      let id = 0;
      let newArr = []
      if (data == null) {
        newArr.push({})
        return newArr;
      }
      let splice = data.split(",");
      for (var i in splice) {
        id = id + 1;
        let filePath = splice[i];
        if (filePath == "") {
          break;
        }
        let fileName = filePath.split("/");
        fileName = fileName[fileName.length - 1];
        let swipData = {
          id: id,
          urlBase: window._CONFIG['onlinePreviewDomainURL'] + '?url='
            + encodeURIComponent(
              Base64.encode(
                (filePath)
              )),
          url: filePath,
          fileName: fileName
        }
        newArr.push(swipData);
      }
      return newArr;
    },
    /**查询特审复开初始数据文件*/
    findById(id) {
      let that = this;
      let model = {
        "infoId": id,
      }
      postAction(this.url.findById, model)
        .then((res) => {
          if (res.success) {
            this.result = res.result;
            that.dataId = this.result.id;
            this.model.userLable = this.result.userLable.toString();
            this.model.openingNumber = this.result.openingNumber;
            this.model.customerName = this.result.customerName;
            this.model.unitName = this.result.unitName;
            this.model.shutdownTime = this.result.shutdownTime
            this.model.reasonReopening = this.result.reasonReopening == null ? '无' : this.result.reasonReopening
            this.model.materialLabel = this.result.materialLabel.toString();
            this.model.shutdownLabel = this.result.shutdownLabel.toString();
            this.specialNote = this.result.specialNote;
            this.model.status = this.result.status;
            //系统实名质截图备注
            that.nameFindComplianceRemark = this.result.nameFindComplianceRemark;
            //身份证正反面
            this.fileListIdCard = this.packageArr(this.result.idCard);
            //手持证件照片
            this.fileListHandCertificate = this.packageArr(this.result.handCertificate);
            //号卡照片
            this.fileListNumberCard = this.packageArr(this.result.numberCard);
            //使用人证件
            this.fileListUserCertificate = this.packageArr(this.result.userCertificate);
            //营业执照副本
            this.fileListBusiness = this.packageArr(this.result.businessLicense);
            //介绍信
            this.fileListIntroduction = this.packageArr(this.result.letterIntroduction);
            //防诈骗承诺涵
            this.fileListLetter = this.packageArr(this.result.fraudPrevention);
            //消费凭证
            this.fileListVoucher = this.packageArr(this.result.consumptionVoucher);
            //承诺视频
            this.fileListVideo = this.packageArr(this.result.commitmentVideo);
            //系统实名制截图
            this.fileListNameFindCompliance = this.packageArr(this.result.nameFindCompliance);
            //特审单
            this.fileListSpecialReviewForm = this.packageArr(this.result.specialReviewForm);
          } else {
            this.$message.error("查询失败");
          }
        }).finally(() => {

      })
    },

    //点击关闭图片预览
    handleCancel() {//点击关闭图片预览
      this.previewVisible = false;
    },
    //点击查看大图
    async handlePreview(file) {//点击查看大图
      if (!file.url && !file.preview) {
        file.preview = await this.getBase64(file.originFileObj);
      }
      this.previewImage = file.url || file.preview;
      this.previewVisible = true;
    },

    //点击查看视频大图
    async handlePreviewVideo(file) {//点击查看大图
      if (!file.url && !file.preview) {
        file.preview = await this.getBase64(file.originFileObj);
      }
      this.previewImage = file.url || file.preview;
      this.previewVideo = true;
    },
  },


}
</script>

<style scoped lang="less">
.thumb-example {
  width: 864px;
  margin-top: 20px;
  // background: #000;
}

.swiper-slide {
  background-size: cover;
  background-position: center;
}

.gallery-top {
  // height: 80% !important;
  /*height: 600px;*/
  width: 100%;
  left: 10%;
  margin-bottom: 30px
}

.gallery-thumbs {
  height: 20% !important;
  box-sizing: border-box;
  padding: 10px 0px;
  /*  width: 864px;*/
  margin-left: 2px;

  .swiper-button-next {
    right: 0px;
  }

  .swiper-button-prev {
    left: 0px;
  }

  .swiper-button-next,
  .swiper-button-prev {
    background: #fff;
    width: 45px;
    text-align: center;
    height: 101px;
    top: 26%;

    div {
      margin-top: 30px;
      background: rgb(207, 205, 205);
      height: 45px;
      border-radius: 50%;

      img {
        margin: 7px 0 0 2px;
        width: 30px;
      }
    }
  }

  .swiper-button-next:hover div {
    background: rgb(189, 186, 186);
  }

  .swiper-button-prev:hover div {
    background: rgb(189, 186, 186);
  }
}

.gallery-thumbs .swiper-slide {
  width: 20%;
  height: 80px;
  // opacity: 0.4;
}

.gallery-thumbs .swiper-slide-active {
  border: 2px solid red;
}

.markdown ul > li {
  color: #000000d9;
  font-size: 15px;
  line-height: 3;
  margin-left: 20px;
  padding-left: 4px;
  list-style-type: circle;
}

</style>