<template>
  <BaseContainer class="visit-list">
    <!-- 搜索框 -->
    <template slot="search-container">
      <el-form :inline="true" class="base-search-form">
        <!-- 质疑状态 -->
        <el-form-item style="margin-bottom: 10px" :label="$t('trials:crcUpload:table:challengeState')">
          <el-select v-model="searchData.ChallengeState" clearable style="width: 120px">
            <el-option v-for="item of $d.CheckIsClosedEnum" :value="item.value" :key="item.label" :label="item.label" />
          </el-select>
        </el-form-item>
        <!-- 中心编号 -->
        <el-form-item style="margin-bottom: 10px" :label="$t('trials:crcUpload:table:siteId')">
          <el-select v-model="searchData.TrialSiteId" clearable filterable style="width: 120px">
            <el-option v-for="(item, index) of siteOptions" :key="index" :label="item.TrialSiteCode"
              :value="item.TrialSiteId" />
          </el-select>
        </el-form-item>
        <!-- 受试者编号 -->
        <el-form-item style="margin-bottom: 10px" :label="$t('trials:crcUpload:table:subjectId')">
          <el-input v-model="searchData.SubjectInfo" style="width: 100px" />
        </el-form-item>
        <!-- 访视名称 -->
        <el-form-item style="margin-bottom: 10px" class="my_multiple" :label="$t('trials:crcUpload:table:visitName')">
          <el-select v-model="searchData.VisitPlanArray" clearable multiple style="width: 140px">
            <el-option v-for="(item, index) of visitPlanOptions" :key="index" :label="item.VisitName"
              :value="item.VisitNum">
              <span style="float: left">{{ item.VisitName }}</span>
            </el-option>
            <el-option key="Other" label="Out of Plan" value="1.11" />
          </el-select>
        </el-form-item>

        <!-- 提交状态 -->
        <el-form-item style="margin-bottom: 10px" :label="$t('trials:crcUpload:table:submitState')">
          <el-select v-model="searchData.SubmitState" clearable style="width: 120px">
            <el-option v-for="item of $d.SubmitState" :value="item.value" :label="item.label" :key="item.label" />
          </el-select>
        </el-form-item>
        <!-- 受试者中止状态 -->
        <el-form-item style="margin-bottom: 10px" :label="$t('trials:crcUpload:table:IsSubjectQuit')">
          <el-select v-model="searchData.SubjectStatus" clearable style="width: 120px">
            <el-option v-for="item of $d.Subject_Visit_Status" :value="item.value" :label="item.label"
              :key="item.label" />
          </el-select>
        </el-form-item>
        <!-- 审核状态 -->
        <el-form-item style="margin-bottom: 10px" v-if="otherInfo.QCProcessEnum !== 0"
          :label="$t('trials:crcUpload:table:auditState')">
          <el-select v-if="otherInfo.QCProcessEnum === 2" v-model="searchData.AuditStateArray" style="width: 120px"
            multiple>
            <el-option v-for="(item, index) of $d.AuditStateRC" v-show="item.value <= 8" :value="item.value"
              :label="item.label" :key="`AuditStateRC${item.label}${index}`" />
          </el-select>
          <el-select v-if="otherInfo.QCProcessEnum === 1" v-model="searchData.AuditStateArray" style="width: 120px"
            multiple>
            <el-option v-for="(item, index) of $d.AuditStatePE" v-show="item.value <= 8"
              :key="`AuditStatePE${item.label}${index}`" :value="item.value" :label="item.label" />
          </el-select>
        </el-form-item>
        <el-form-item>
          <!-- 查询 -->
          <el-button type="primary" icon="el-icon-search" @click="handleSearch">
            {{ $t('common:button:search') }}
          </el-button>
          <!-- 重置 -->
          <el-button type="primary" icon="el-icon-refresh-left" @click="handleReset">
            {{ $t('common:button:reset') }}
          </el-button>
          <!--导出-->
          <el-button type="primary" icon="el-icon-download" @click="handleExport">
            {{ $t('common:button:export') }}
          </el-button>
          <!-- 批量提交 -->
          <el-button v-hasPermi="['trials:trials-panel:visit:crc-upload:submit']" type="primary" icon="el-icon-check"
            :disabled="selectArr.length === 0" @click="handleBulkSubmit">
            {{ $t('trials:crcUpload:button:submit') }}
          </el-button>
          <!-- 计划外访视 -->
          <el-button v-hasPermi="['trials:trials-panel:visit:crc-upload:new']" type="primary" icon="el-icon-plus"
            @click="handleAdd">
            {{ $t('trials:crcUpload:button:add') }}
          </el-button>
          <!--          <el-button v-hasPermi="['trials:trials-panel:visit:crc-upload:submit']" type="primary" @click="handleUpload">-->
          <!--            临床数据-->
          <!--          </el-button>-->
        </el-form-item>
      </el-form>
    </template>

    <!-- 访视计划列表 -->
    <template slot="main-container">
      <el-table ref="visitList" v-loading="loading" v-adaptive="{ bottomOffset: 60 }" :data="list" stripe height="100"
        @sort-change="handleSortByColumn" @selection-change="handleSelectionChange">
        <el-table-column type="selection" align="left" width="45" :selectable="handleSelectTable" />
        <!-- 质疑状态 -->
        <el-table-column prop="ChallengeState" :label="$t('trials:crcUpload:table:challengeState')"
          show-overflow-tooltip width="140" sortable="custom">
          <template slot-scope="scope">
            <span v-if="scope.row.ChallengeState === 0"> -- </span>
            <!-- 有质疑，且关闭 -->
            <span v-else-if="scope.row.ChallengeState === 1">
              <el-button style="font-size: 15px" size="mini" icon="el-icon-question" circle type="primary"
                :title="$t('trials:crcUpload:label:isClosed')" @click="handleOpenHistoryChat(scope.row)" />
            </span>
            <!-- 有质疑，且有质疑未关闭 -->
            <span v-else-if="scope.row.ChallengeState === 2">
              <el-button type="danger" style="font-size: 15px" size="mini" icon="el-icon-question" circle
                :title="$t('trials:crcUpload:label:isNotClose')" @click="handleOpenHistoryChat(scope.row)" />
            </span>
          </template>
        </el-table-column>
        <!-- 是否加急 -->
        <el-table-column prop="IsUrgent" :label="$t('trials:crcUpload:table:urgent')" show-overflow-tooltip
          min-width="110" sortable="custom">
          <template slot-scope="scope">
            <el-tag v-if="scope.row.IsUrgent" type="danger">{{
              $fd('YesOrNo', scope.row.IsUrgent)
            }}</el-tag>
            <el-tag v-else type="primary">{{
              $fd('YesOrNo', scope.row.IsUrgent)
            }}</el-tag>
          </template>
        </el-table-column>
        <!-- 中心 -->
        <el-table-column prop="TrialSiteCode" :label="$t('trials:crcUpload:table:siteId')" show-overflow-tooltip
          min-width="100" sortable="custom" />
        <!-- 受试者 -->
        <el-table-column prop="SubjectCode" :label="$t('trials:crcUpload:table:subjectId')" show-overflow-tooltip
          sortable="custom" min-width="150">
          <template slot-scope="scope">
            <span style="margin: 0 4px">{{ scope.row.SubjectCode }}</span>
            <!-- 基 -->
            <span v-if="scope.row.SubjectFirstGiveMedicineTime" class="status-primary-circle">
              {{ $t('trials:crcUpload:label:firstGiveMedicineTime') }}
            </span>
            <!-- 终止 -->
            <span v-if="scope.row.IsSubjectQuit" class="status-primary-circle">
              {{ $t('trials:crcUpload:label:ISQ') }}
            </span>
          </template>
        </el-table-column>
        <!-- 访视 -->
        <el-table-column prop="VisitNum" :label="$t('trials:crcUpload:table:visitName')" show-overflow-tooltip
          min-width="160" sortable="custom">
          <template slot-scope="scope">
            <el-button v-if="scope.row.VisitExecuted === 1" type="text" @click="handleOpenStudyDialog(scope.row)">
              <span>{{ scope.row.VisitName }}</span>
            </el-button>
            <span v-else>{{ scope.row.VisitName }}</span>
            <!-- PD -->
            <span v-if="scope.row.PDState" class="status-primary-circle">
              {{ $t('trials:crcUpload:label:pd') }}
            </span>
            <!-- 失 -->
            <span v-if="scope.row.IsLostVisit" class="status-primary-circle">
              {{ $t('trials:crcUpload:label:lostVisit') }}
            </span>
            <!-- 末 -->
            <span v-if="scope.row.IsFinalVisit" class="status-primary-circle">
              {{ $t('trials:crcUpload:label:finalVisit') }}
            </span>
            <!-- 入 -->
            <span v-if="scope.row.IsEnrollmentConfirm" class="status-primary-circle">
              {{ $t('trials:crcUpload:label:enrollmentConfirm') }}
            </span>
            <!-- 退回待审批 -->
            <span v-if="scope.row.IsImageBackApplying" class="status-primary-circle">
              {{ $t('trials:crcUpload:label:back') }}
            </span>
          </template>
        </el-table-column>
        <!-- 数据收集 -->
        <el-table-column prop="DicomStudyCount" :label="$t('trials:crcUpload:table:dataCollected')"
          show-overflow-tooltip min-width="120">
          <template slot-scope="scope">
            <el-tooltip placement="bottom">
              <div slot="content">
                <!-- DICOM/Non-DICOM/Clinical data -->
                <span>{{ $t('trials:crcUpload:label:dicom') }}:
                  {{ scope.row.DicomStudyCount }},
                </span>
                <!--                 v-if="
                    scope.row.IsBaseLine &&
                    otherInfo.ClinicalInformationTransmissionEnum > 0
                  "-->
                <span>
                  <span>{{ $t('trials:crcUpload:label:noneDicom') }}:
                    {{ scope.row.NoneDicomStudyCount }},
                  </span>
                  <span>{{ $t('trials:crcUpload:label:clinicalData') }}:
                    {{ scope.row.IsHaveClinicalData ? 'w/' : 'w/o' }}</span>
                </span>
                <!-- <span v-else
                  >{{ $t('trials:crcUpload:label:noneDicom') }}:
                  {{ scope.row.NoneDicomStudyCount }}</span
                > -->
              </div>
              <!--scope.row.IsBaseLine &&-->
              <span>
                {{
                  otherInfo.ClinicalInformationTransmissionEnum > 0
                    ? [
                      scope.row.DicomStudyCount,
                      scope.row.NoneDicomStudyCount,
                      scope.row.IsHaveClinicalData ? 'w/' : 'w/o',
                    ].join(', ')
                    : [
                      scope.row.DicomStudyCount,
                      scope.row.NoneDicomStudyCount,
                    ].join(', ')
                }}
              </span>
            </el-tooltip>
          </template>
        </el-table-column>
        <!-- 最早拍片日期 -->
        <!-- <el-table-column
          prop="EarliestScanDate"
          :label="$t('trials:crcUpload:table:earliestScanDate')"
          show-overflow-tooltip
          width="170"
          sortable="custom"
        >
          <template slot-scope="scope">
            {{
              scope.row.EarliestScanDate
                ? moment(scope.row.EarliestScanDate).format('YYYY-MM-DD')
                : ''
            }}
          </template>
        </el-table-column> -->
        <!-- 最晚拍片日期 $t('trials:crcUpload:table:latestScanDate') -->
        <el-table-column prop="LatestScanDate" :label="$t('trials:crcUpload:table:scanDate')" show-overflow-tooltip
          width="170" sortable="custom">
          <template slot-scope="scope">
            <el-tooltip class="item" effect="dark" :content="`${scope.row.EarliestScanDate
              ? moment(scope.row.EarliestScanDate).format('YYYY-MM-DD')
              : ''
              } ~ ${scope.row.LatestScanDate
                ? moment(scope.row.LatestScanDate).format('YYYY-MM-DD')
                : ''
              }`" placement="top">
              <span>
                {{
                  scope.row.LatestScanDate
                    ? moment(scope.row.LatestScanDate).format('YYYY-MM-DD')
                    : ''
                }}
              </span>
            </el-tooltip>
          </template>
        </el-table-column>
        <!-- 提交状态 -->
        <el-table-column prop="SubmitState" :label="$t('trials:crcUpload:table:submitState')" show-overflow-tooltip
          width="180" sortable="custom">
          <template slot-scope="scope">
            <el-tag v-if="scope.row.SubmitState * 1 === 0" type="warning">{{
              $fd('SubmitState', scope.row.SubmitState * 1)
            }}</el-tag>
            <el-tag v-else-if="scope.row.SubmitState * 1 === 1" type="danger">{{
              $fd('SubmitState', scope.row.SubmitState * 1)
            }}</el-tag>
            <el-tag v-else-if="scope.row.SubmitState * 1 === 2">{{
              $fd('SubmitState', scope.row.SubmitState * 1)
            }}</el-tag>
          </template>
        </el-table-column>
        <!-- 提交时间 -->
        <el-table-column prop="SubmitTime" :label="$t('trials:crcUpload:table:submitTime')" show-overflow-tooltip
          min-width="160" sortable="custom" />
        <!-- 审核状态 -->
        <el-table-column prop="AuditState" :label="$t('trials:crcUpload:table:auditState')" show-overflow-tooltip
          width="140" sortable="custom">
          <template slot-scope="scope">
            <span v-if="scope.row.AuditState * 1 === 0">--</span>
            <el-tag v-else-if="scope.row.AuditState * 1 === 3" type="warning">{{
              $fd('AuditStatePE', scope.row.AuditState * 1)
            }}</el-tag>
            <el-tag v-else-if="
              scope.row.AuditState * 1 === 4 && otherInfo.QCProcessEnum === 1
            " type="warning">{{ $fd('AuditStatePE', scope.row.AuditState * 1) }}</el-tag>
            <el-tag v-else-if="
              scope.row.AuditState * 1 === 4 && otherInfo.QCProcessEnum === 2
            " type="warning">{{ $fd('AuditStateRC', scope.row.AuditState * 1) }}</el-tag>
            <el-tag v-else-if="
              scope.row.AuditState * 1 === 5 && otherInfo.QCProcessEnum === 2
            " type="warning">{{ $fd('AuditStateRC', scope.row.AuditState * 1) }}</el-tag>
            <el-tag v-else-if="
              scope.row.AuditState * 1 === 6 && otherInfo.QCProcessEnum === 2
            " type="warning">{{ $fd('AuditStateRC', scope.row.AuditState * 1) }}</el-tag>
            <el-tag v-else-if="scope.row.AuditState * 1 === 7" type="danger">{{
              $fd('AuditStateRC', scope.row.AuditState * 1)
            }}</el-tag>
            <el-tag v-else-if="scope.row.AuditState * 1 === 8" type="primary">{{
              $fd('AuditStateRC', scope.row.AuditState * 1)
            }}</el-tag>
          </template>
        </el-table-column>
        <!-- 审核完成时间 -->
        <el-table-column prop="AuditTime" :label="$t('trials:crcUpload:table:auditTime')" show-overflow-tooltip
          width="170" />
        <el-table-column v-if="
          hasPermi(
            [
              'trials:trials-panel:visit:crc-upload:upload',
              'trials:trials-panel:visit:crc-upload:submit',
              'trials:trials-panel:visit:crc-upload:edit',
              'trials:trials-panel:visit:crc-upload:delete',
              'trials:trials-panel:visit:crc-upload:back',
              'trials:trials-panel:visit:crc-upload:authBack'
            ],
            '||'
          )
        " :label="$t('common:action:action')" width="250" fixed="right">
          <template slot-scope="scope">
            <!-- 上传 -->
            <el-button v-hasPermi="['trials:trials-panel:visit:crc-upload:upload']" icon="el-icon-upload2" :disabled="!isOCTorIVUS && (scope.row.SubmitState * 1 === 2 ||
              scope.row.VisitExecuted === 2 ||
              scope.row.IsLostVisit || (scope.row.IsSubjectQuit && scope.row.SubmitState * 1 !== 2))
              " circle :title="$t('trials:crcUpload:action:upload')" @click="CRChandleUpload(scope.row)" />
            <!-- 上传2 -->
            <el-button icon="el-icon-upload2" v-hasPermi="['trials:trials-panel:visit:crc-upload:upload2']" :disabled="!isOCTorIVUS && (scope.row.SubmitState * 1 === 2 ||
              scope.row.VisitExecuted === 2 ||
              scope.row.IsLostVisit || (scope.row.IsSubjectQuit && scope.row.SubmitState * 1 !== 2))
              " circle :title="$t('trials:crcUpload:action:upload')" @click="CRChandleUpload2(scope.row)" />
            <!-- 提交 -->
            <el-button v-hasPermi="['trials:trials-panel:visit:crc-upload:submit']" icon="el-icon-check" :disabled="scope.row.AuditState * 1 > 0 ||
              scope.row.SubmitState * 1 !== 1 ||
              scope.row.VisitExecuted === 2 ||
              scope.row.IsLostVisit || (scope.row.IsSubjectQuit && scope.row.SubmitState * 1 !== 2)
              " circle :title="$t('trials:crcUpload:action:submit')" @click="handleSubmit(scope.row)" />
            <!-- 退回 -->
            <el-button :disabled="scope.row.SubmitState * 1 < 2 || scope.row.IsImageBackApplying || scope.row.ChallengeState * 1 === 2 || (scope.row.IsSubjectQuit && scope.row.SubmitState * 1 !== 2)
              " v-hasPermi="['trials:trials-panel:visit:crc-upload:back']" icon="el-icon-back" circle
              :title="$t('trials:crcUpload:action:back')" @click="imageBack(scope.row)" />
            <!-- 编辑 -->
            <el-button v-hasPermi="['trials:trials-panel:visit:crc-upload:edit']" icon="el-icon-edit-outline" :disabled="scope.row.VisitExecuted === 2 ||
              (scope.row.SubmitState * 1 === 2 &&
                scope.row.IsBaseLine === true) || (scope.row.IsSubjectQuit && scope.row.SubmitState * 1 !== 2)
              " circle :title="$t('trials:crcUpload:action:edit')" @click="handleEdit(scope.row)" />
            <!-- 删除 -->
            <el-button v-hasPermi="['trials:trials-panel:visit:crc-upload:delete']" icon="el-icon-delete" :disabled="scope.row.SubmitState * 1 !== 0 ||
              scope.row.InPlan ||
              scope.row.IsLostVisit ||
              scope.row.IsFinalVisit || (scope.row.IsSubjectQuit && scope.row.SubmitState * 1 !== 2)
              " circle :title="$t('trials:crcUpload:action:delete')" @click="handleDelete(scope.row)" />
          </template>
        </el-table-column>
      </el-table>

      <!-- 分页组件 -->
      <pagination class="page" :total="total" :page.sync="searchData.PageIndex" :limit.sync="searchData.PageSize"
        @pagination="getList" />
    </template>
    <div class="remark">
      <!-- {{ $t('trials:crcUpload:tips:remark') }} -->
      <!-- √：已设置访视基准日期；末：末次访视；失：失访；PD：PD进展；入：入组确认 -->
      <span class="status-primary-circle">
        {{ $t('trials:crcUpload:label:firstGiveMedicineTime') }}
      </span>
      <span>: {{ $t('trials:crcUpload:label:firstGiveMedicineTimeD') }}</span>

      <span class="status-primary-circle" style="margin-left: 10px">
        {{ $t('trials:crcUpload:label:finalVisit') }}
      </span>
      <span>: {{ $t('trials:crcUpload:label:finalVisitDetail') }}</span>

      <span class="status-primary-circle" style="margin-left: 10px">
        {{ $t('trials:crcUpload:label:lostVisit') }}
      </span>
      <span>: {{ $t('trials:crcUpload:label:lostVisitDetail') }}</span>

      <span class="status-primary-circle" style="margin-left: 10px">
        {{ $t('trials:crcUpload:label:pd') }}
      </span>
      <span>: {{ $t('trials:crcUpload:label:pdDetail') }}</span>
      <span class="status-primary-circle" style="margin-left: 10px">
        {{ $t('trials:crcUpload:label:enrollmentConfirm') }}
      </span>
      <span>: {{ $t('trials:crcUpload:label:enrollmentConfirmDetail') }}</span>
      <span class="status-primary-circle" style="margin-left: 10px">
        {{ $t('trials:crcUpload:label:back') }}
      </span>
      <span>: {{ $t('trials:crcUpload:label:backAudit') }}</span>
      <span class="status-primary-circle" style="margin-left: 10px">
        {{ $t('trials:crcUpload:label:ISQ') }}
      </span>
      <span>: {{ $t('trials:crcUpload:label:IsSubjectQuit') }}</span>
    </div>
    <!-- 新增/编辑 -->
    <el-dialog v-if="edit_cfg.visible" :visible.sync="edit_cfg.visible" :close-on-click-modal="false"
      :title="edit_cfg.title" width="600px" custom-class="base-dialog-wrapper">
      <VisitForm v-if="edit_cfg.visible" :data="rowData" :other-info="otherInfo" @getList="getList"
        @closeDialog="closeEditDialog" />
    </el-dialog>

    <!-- 上传Dicom/非Dicom文件 -->
    <el-dialog v-if="uploadVisible" :visible.sync="uploadVisible" :fullscreen="true" :close-on-click-modal="false"
      custom-class="upload-dialog" :before-close="beforeCloseUploadDig" :modal="false">
      <span slot="title">
        <el-breadcrumb separator-class="el-icon-arrow-right">
          <label style="float: left; margin-right: 10px">Upload: </label>
          <!-- <el-breadcrumb-item>Upload</el-breadcrumb-item> -->
          <el-breadcrumb-item v-show="searchData.TrialCode">{{
            searchData.TrialCode
          }}</el-breadcrumb-item>
          <el-breadcrumb-item v-show="rowData.TrialSiteCode">{{
            rowData.TrialSiteCode
          }}</el-breadcrumb-item>
          <el-breadcrumb-item v-show="rowData.SubjectCode">{{
            rowData.SubjectCode
          }}</el-breadcrumb-item>
          <el-breadcrumb-item v-show="rowData.VisitName">{{
            `${rowData.VisitName} (${rowData.VisitNum})`
          }}</el-breadcrumb-item>
        </el-breadcrumb>
      </span>
      <div class="base-modal-body" style="display: flex; flex-direction: column">
        <el-form v-show="(rowData.IsBaseLine &&
          (otherInfo.IsHaveFirstGiveMedicineDate ||
            otherInfo.IsEnrollementQualificationConfirm)) ||
          (!rowData.IsBaseLine && otherInfo.IsPDProgressView)
          " :inline="true" class="base-search-form" style="height: 60px; padding: 10px">
          <!-- 访视基准日期 -->
          <el-form-item v-show="rowData.IsBaseLine && otherInfo.IsHaveFirstGiveMedicineDate"
            :label="$t('trials:crcUpload:form:baseDateOfVisit')">
            <el-date-picker v-model="rowData.SubjectFirstGiveMedicineTime" type="date" :picker-options="pickerOption"
              value-format="yyyy-MM-dd" format="yyyy-MM-dd" disabled />
          </el-form-item>
          <!-- 入组确认评估 -->
          <el-form-item v-show="rowData.IsBaseLine && otherInfo.IsEnrollementQualificationConfirm
            " :label="$t('trials:crcUpload:form:enrollmentConfirmation')">
            <el-radio-group v-model="rowData.IsEnrollmentConfirm" disabled>
              <el-radio v-for="item of $d.YesOrNo" :label="item.value" :key="`IsEnrollmentConfirm${item.label}`">{{
                item.label }}</el-radio>
            </el-radio-group>
          </el-form-item>
          <!-- 疾病进展确认评估 -->
          <el-form-item v-show="!rowData.IsBaseLine && otherInfo.IsPDProgressView"
            :label="$t('trials:crcUpload:form:pd')">
            <el-radio-group v-model="rowData.PDState" disabled>
              <el-radio v-for="item of $d.YesOrNoForInt" :label="item.value" :key="`PDState${item.label}`">{{ item.label
              }}</el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item v-show="(rowData.IsBaseLine &&
            (otherInfo.IsHaveFirstGiveMedicineDate ||
              otherInfo.IsEnrollementQualificationConfirm)) ||
            (!rowData.IsBaseLine && otherInfo.IsPDProgressView)
            ">
            <!-- 编辑 -->
            <el-button v-hasPermi="['trials:trials-panel:visit:crc-upload:edit']" type="primary" icon="el-icon-edit"
              style="margin-left: 10px" @click="relationVisible = true">
              {{ $t('common:button:edit') }}
            </el-button>
          </el-form-item>
        </el-form>
        <div class="tip" v-if="[0].includes($store.state.trials.config.CollectImagesEnum)">
          <i class="el-icon-warning-outline"></i>
          <div v-html="$t('trials:uploadedDicoms:tip:message')"></div>
        </div>
        <el-tabs v-model="activeName" type="border-card" style="flex: 1">
          <!-- DICOM影像上传 -->
          <el-tab-pane :label="$t('trials:uploadedDicoms:tab:uploadDicoms')" name="dicom"
            v-if="[0, 1].includes($store.state.trials.config.CollectImagesEnum)">
            <upload-dicom-files2 :data="rowData" :subject-id="rowData.SubjectId" :subject-visit-id="rowData.Id"
              @getList="getList" @close="closeUpload" :activeName.sync="activeName" />
            <!-- <upload-dicom-files  :data="rowData" :subject-id="rowData.SubjectId" :subject-visit-id="rowData.Id" @getList="getList" @close="closeUpload" @setOpenWindow="setOpenWindow"/> -->
          </el-tab-pane>
          <!-- 非DICOM影像上传 -->
          <el-tab-pane :label="$t('trials:uploadNonDicoms:tab:uploadNonDicoms')" name="non-dicom"
            v-if="[0, 2].includes($store.state.trials.config.CollectImagesEnum)">
            <upload-non-dicom-files v-if="activeName === 'non-dicom'" :data="rowData"
              :body-parts="otherInfo.BodyPartTypes" :modalities="otherInfo.Modalitys" :subject-visit-id="rowData.Id"
              :allow-add-or-edit="true" @getList="getList" />
          </el-tab-pane>
          <!-- 临床数据采集 -->
          <el-tab-pane v-if="
            rowData.IsBaseLine &&
            (otherInfo.IsHaveSubjectClinicalData ||
              otherInfo.IsHaveVisitClinicalData)
          " :label="$t('trials:uploadClinicalData:tab:uploadClinicalData')" name="clinical-data">
            <upload-clinical-data v-if="activeName === 'clinical-data'" :subject-visit-id="rowData.Id" :data="rowData"
              :enum-type="otherInfo.ClinicalInformationTransmissionEnum" :allow-add-or-edit="true" @getList="getList" />
          </el-tab-pane>
          <!-- 临床数据采集2 -->
          <el-tab-pane v-if="!rowData.IsBaseLine && otherInfo.IsHaveVisitClinicalData"
            :label="$t('trials:uploadClinicalData:tab:uploadClinicalData')" name="clinical-data">
            <upload-clinical-data v-if="activeName === 'clinical-data'" :subject-visit-id="rowData.Id" :data="rowData"
              :enum-type="otherInfo.ClinicalInformationTransmissionEnum" :allow-add-or-edit="true" @getList="getList" />
          </el-tab-pane>
        </el-tabs>
      </div>
    </el-dialog>

    <!-- 检查列表 -->
    <el-dialog v-if="studyVisible" :visible.sync="studyVisible" :close-on-click-modal="false" :fullscreen="true"
      :before-close="beforeCloseStudyDig">
      <span slot="title">
        <el-breadcrumb separator-class="el-icon-arrow-right">
          <el-breadcrumb-item v-show="searchData.TrialCode">{{
            searchData.TrialCode
          }}</el-breadcrumb-item>
          <el-breadcrumb-item v-show="rowData.TrialSiteCode">{{
            rowData.TrialSiteCode
          }}</el-breadcrumb-item>
          <el-breadcrumb-item v-show="rowData.SubjectCode">{{
            rowData.SubjectCode
          }}</el-breadcrumb-item>
          <el-breadcrumb-item v-show="rowData.VisitName">{{
            `${rowData.VisitName} (${rowData.VisitNum})`
          }}</el-breadcrumb-item>
        </el-breadcrumb>
      </span>
      <div class="base-modal-body">
        <el-form :inline="true" class="base-search-form" style="padding: 10px">
          <!-- 访视基准日期 -->
          <el-form-item v-show="rowData.IsBaseLine && otherInfo.IsHaveFirstGiveMedicineDate"
            :label="$t('trials:crcUpload:form:baseDateOfVisit')">
            <el-date-picker v-model="rowData.SubjectFirstGiveMedicineTime" type="date" :picker-options="pickerOption"
              value-format="yyyy-MM-dd" format="yyyy-MM-dd" disabled />
          </el-form-item>
          <!-- 入组确认评估 -->
          <el-form-item v-show="rowData.IsBaseLine && otherInfo.IsEnrollementQualificationConfirm
            " :label="$t('trials:crcUpload:form:enrollmentConfirmation')">
            <el-radio-group v-model="rowData.IsEnrollmentConfirm" disabled>
              <el-radio v-for="item of $d.YesOrNo" :label="item.value" :key="`IsEnrollmentConfirm${item.label}`">{{
                item.label }}</el-radio>
            </el-radio-group>
          </el-form-item>
          <!-- 疾病进展确认评估 -->
          <el-form-item v-show="(!rowData.IsBaseLine && otherInfo.IsPDProgressView) ||
            rowData.PDState === 1
            " :label="$t('trials:crcUpload:form:pd')">
            <el-radio-group v-model="rowData.PDState" disabled>
              <el-radio v-for="item of $d.YesOrNoForInt" :label="item.value" :key="`PDState${item.label}`">{{ item.label
              }}</el-radio>
            </el-radio-group>
          </el-form-item>
        </el-form>
        <!-- DICOM影像  -->
        <h4 class="box-title" v-if="[0, 1].includes($store.state.trials.config.CollectImagesEnum)">
          {{ $t('trials:crcUpload:label:dicom') }}
        </h4>
        <el-card class="box-card" v-if="[0, 1].includes($store.state.trials.config.CollectImagesEnum)">
          <StudyInfo v-if="rowData.Id" :data="rowData" @getList="getList" @setOpenWindow="setOpenWindow" />
        </el-card>
        <!-- 非DICOM影像 -->
        <h4 class="box-title" style="margin-top: 10px"
          v-if="[0, 2].includes($store.state.trials.config.CollectImagesEnum)">
          {{ $t('trials:crcUpload:label:noneDicom') }}
        </h4>
        <el-card class="box-card" v-if="[0, 2].includes($store.state.trials.config.CollectImagesEnum)">
          <UploadNonDicomFiles v-if="rowData.Id" :data="rowData" :subject-visit-id="rowData.Id"
            :body-parts="otherInfo.BodyPartTypes" :modalities="otherInfo.Modalitys" :allow-add-or-edit="false"
            @getList="getList" />
        </el-card>
        <!-- 临床数据 -->
        <!-- 基线显示受试者级别和方式级别的临床数据 -->
        <h4 v-if="
          rowData.IsBaseLine &&
          otherInfo.ClinicalInformationTransmissionEnum > 0 &&
          (otherInfo.IsHaveSubjectClinicalData ||
            otherInfo.IsHaveVisitClinicalData)
        " class="box-title" style="margin-top: 10px">
          {{ $t('trials:crcUpload:label:clinicalData') }}
        </h4>
        <el-card v-if="
          rowData.IsBaseLine &&
          otherInfo.ClinicalInformationTransmissionEnum > 0 &&
          (otherInfo.IsHaveSubjectClinicalData ||
            otherInfo.IsHaveVisitClinicalData)
        " class="box-card">
          <UploadClinicalData v-if="rowData.Id && rowData.IsBaseLine"
            :enum-type="otherInfo.ClinicalInformationTransmissionEnum" :allow-add-or-edit="false" :data="rowData"
            :subject-visit-id="rowData.Id" @getList="getList" />
        </el-card>
        <h4 v-if="!rowData.IsBaseLine && otherInfo.IsHaveVisitClinicalData" class="box-title" style="margin-top: 10px">
          {{ $t('trials:crcUpload:label:clinicalData') }}
        </h4>
        <el-card v-if="!rowData.IsBaseLine && otherInfo.IsHaveVisitClinicalData" class="box-card">
          <UploadClinicalData v-if="rowData.Id" :enum-type="otherInfo.ClinicalInformationTransmissionEnum"
            :allow-add-or-edit="false" :data="rowData" :subject-visit-id="rowData.Id" @getList="getList" />
        </el-card>
      </div>
    </el-dialog>

    <!-- 历史质疑 -->
    <base-model :config="chat_cfg">
      <template slot="dialog-body">
        <HistoryChat v-if="rowData.Id" :otherInfo="otherInfo" :data="rowData" :body-parts="otherInfo.BodyPartTypes"
          :modalities="otherInfo.Modalitys" :clinical-enum="otherInfo.ClinicalInformationTransmissionEnum"
          @getList="getList" />
      </template>
    </base-model>

    <!-- 编辑访视基准日期、入组合格性确认、PD进展 -->
    <el-dialog v-if="relationVisible" :visible.sync="relationVisible" :close-on-click-modal="false"
      :title="$t('trials:crcUpload:dialogTitle:edit')" width="500px" style="height: 600px"
      custom-class="base-dialog-wrapper" append-to-body>
      <el-form size="small">
        <div class="base-dialog-body">
          <!-- 访视基准日期 -->
          <el-form-item v-if="rowData.IsBaseLine && otherInfo.IsHaveFirstGiveMedicineDate"
            :label="$t('trials:crcUpload:form:baseDateOfVisit')">
            <el-date-picker v-model="rowData.SubjectFirstGiveMedicineTime" type="date" :picker-options="pickerOption"
              value-format="yyyy-MM-dd" format="yyyy-MM-dd" />
          </el-form-item>
          <!-- 入组确认评估 -->
          <el-form-item v-if="
            rowData.IsBaseLine && otherInfo.IsEnrollementQualificationConfirm
          " :label="$t('trials:crcUpload:form:enrollmentConfirmation')">
            <el-radio-group v-model="rowData.IsEnrollmentConfirm">
              <el-radio v-for="item of $d.YesOrNo" :label="item.value" :key="`IsEnrollmentConfirm${item.label}`">{{
                item.label }}</el-radio>
            </el-radio-group>
          </el-form-item>
          <!-- 疾病进展确认评估 -->
          <el-form-item v-if="!rowData.IsBaseLine && otherInfo.IsPDProgressView"
            :label="$t('trials:crcUpload:form:pd')">
            <el-radio-group v-model="rowData.PDState">
              <el-radio v-for="item of $d.YesOrNoForInt" :label="item.value" :key="`PDState${item.label}`">{{ item.label
              }}</el-radio>
            </el-radio-group>
          </el-form-item>
        </div>
        <div class="base-dialog-footer" style="text-align: right; margin-top: 10px">
          <el-form-item>
            <el-button size="small" type="primary" :disabled="btnLoading" @click="relationVisible = false">
              {{ $t('common:button:cancel') }}
            </el-button>
            <el-button size="small" type="primary" :loading="btnLoading" @click="saveRelationInfo">
              {{ $t('common:button:save') }}
            </el-button>
          </el-form-item>
        </div>
      </el-form>
    </el-dialog>

    <!-- 临床数据签名框 -->
    <el-dialog v-if="signVisible" :visible.sync="signVisible" :close-on-click-modal="false" width="600px" append-to-body
      custom-class="base-dialog-wrapper">
      <div slot="title">
        <span style="font-size: 18px">{{ $t('common:dialogTitle:sign') }}</span>
        <span style="font-size: 12px; margin-left: 5px">{{
          `(${$t('common:label:sign')}${currentUser})`
        }}</span>
      </div>
      <SignForm ref="signForm" :sign-code-enum="signCode" :sign-replace-text="signReplaceText"
        :subject-visit-id="rowData.Id" @closeDialog="closeSignDialog" />
    </el-dialog>
    <el-dialog v-if="SubjectVisible" :visible.sync="SubjectVisible" :close-on-click-modal="false" width="600px"
      append-to-body custom-class="base-dialog-wrapper">
      <div slot="title">
        <span style="font-size: 18px">{{
          $t('trials:crcUpload:dialogTitle:edit')
        }}</span>
      </div>
      <div style="color: #f66; margin-bottom: 20px; margin-left: 40px">
        <!-- 该受试者访视基准日期未填写，请补充后，再提交访视影像。 -->
        {{ $t('trials:crcUpload:message:baseDate') }}
      </div>
      <!-- <SubjectsForm :data="SubjectInfo" :other-info="otherInfo" @submit="handleSubmit(rowData, true)" /> -->
      <SubjectsForm v-if="SubjectVisible" :data="SubjectInfo" :other-info="otherInfo"
        @submitFirstGiveMedicineTime="submitFirstGiveMedicineTime" @close="closeSubjectVisible" />
    </el-dialog>

    <el-dialog v-if="configVisible" :visible.sync="configVisible" :close-on-click-modal="false" width="800px"
      :title="`确认临床数据(${TrialCode})`" custom-class="base-dialog-wrapper" :fullscreen="true">
      <el-tabs style="height: 100%" type="border-card" :before-leave="() => {
        handleUpload(subjectRowData)
      }
        ">
        <el-tab-pane :label="$t('trials:sysDocBeSigned:table:ToBeDealedCount')">
          <el-table :data="clinicalData" border v-adaptive="{ bottomOffset: 75 }" stripe height="100"
            v-loading="listLoading" style="width: 100%" size="small" :span-method="objectSpanMethod">
            <!-- 受试者 -->
            <el-table-column prop="SubjectCode" label="受试者" show-overflow-tooltip width="120" />
            <!-- 临床数据类型 -->
            <el-table-column prop="ClinicalDataSetName" :label="$t('trials:workbench:table:ClinicalNameList')"
              show-overflow-tooltip />
            <!-- 配置值 -->
            <el-table-column prop="ClinicalCount" label="记录数" show-overflow-tooltip />
            <el-table-column :label="$t('common:action:action')" width="150">
              <template slot-scope="scope">
                <el-button icon="el-icon-plus" :disabled="!(
                  scope.row.UploadRole === 0 &&
                  [2, 3].includes(scope.row.ClinicalDataLevel)
                ) && scope.row.ClinicalCount > 0
                  " circle title="添加" @click="handleAdd2(scope.row)" />
                <el-button icon="el-icon-view" circle title="查看" @click="handleView(scope.row)" />
              </template>
            </el-table-column>
          </el-table>
          <div class="pagination" style="text-align: right; margin-top: 5px">
            <pagination :total="clinicalPageTotal" :page.sync="clinicalPage.PageIndex"
              :limit.sync="clinicalPage.PageSize" @pagination="
                () => {
                  handleUpload(subjectRowData)
                }
              " />
          </div>
        </el-tab-pane>
        <el-tab-pane :label="$t('trials:sysDocBeSigned:table:ReadModuleCount')">
          <el-tabs style="height: 100%" v-adaptive="{ bottomOffset: 75 }" v-model="TrialReadingCriterionId"
            type="border-card">
            <el-tab-pane v-for="item of trialCriterionList" :key="item.TrialReadingCriterionId"
              :label="item.TrialReadingCriterionName" :name="item.TrialReadingCriterionId">
              <el-table :data="confirmData" v-loading="listLoading" v-adaptive="{ bottomOffset: 275 }" stripe
                height="100" border style="width: 100%" size="small">
                <el-table-column prop="SubjectCode" label="受试者" show-overflow-tooltip />
                <el-table-column prop="SubjectCode" label="截止日期" show-overflow-tooltip>
                  <template slot-scope="scope">
                    {{ scope.row.LatestScanDate.split(' ')[0] }}
                  </template>
                </el-table-column>
                <el-table-column prop="FormCount" label="记录数" show-overflow-tooltip />
                <el-table-column prop="" label="是否确认" show-overflow-tooltip>
                  <template slot-scope="scope">
                    {{ $fd('YesOrNo', scope.row.IsCRCConfirm) }}
                  </template>
                </el-table-column>
                <el-table-column :label="$t('common:action:action')" fixed="right" width="170">
                  <template slot-scope="scope">
                    <el-button icon="el-icon-view" circle :disabled="scope.row.FormCount === 0" size="mini" title="查看"
                      @click="getCRCBeConfirmList(scope.row, 'look')" />
                    <el-button icon="el-icon-check" :disabled="scope.row.IsCRCConfirm || scope.row.FormCount === 0
                      " circle size="mini" title="确认" @click="getCRCBeConfirmList(scope.row, 'confirm')" />
                    <el-button icon="el-icon-back" :disabled="!scope.row.IsCRCConfirm || scope.row.FormCount === 0
                      " circle size="mini" title="撤销确认" @click="handleUnConfirm(scope.row)" />
                  </template>
                </el-table-column>
              </el-table>
              <div class="pagination" style="text-align: right; margin-top: 5px">
                <pagination :total="confirmPageTotal" :page.sync="confirmPage.PageIndex"
                  :limit.sync="confirmPage.PageSize" @pagination="
                    () => {
                      handleUpload(subjectRowData)
                    }
                  " />
              </div>
            </el-tab-pane>
          </el-tabs>
        </el-tab-pane>
      </el-tabs>
    </el-dialog>
    <el-dialog v-if="confirmVisible" :visible.sync="confirmVisible" :close-on-click-modal="false" width="80%" :title="`${confirmType === 'look'
      ? '查看临床数据'
      : confirmType === 'confirm'
        ? '确认临床数据'
        : '已确认临床数据'
      }(${TrialCode}|${rowData.SubjectCode}|${TrialReadingCriterionName})`" custom-class="base-dialog-wrapper">
      <div class="base-dialog-body">
        <div v-if="!IsHaveTableQuestion">
          <div v-for="(item, index) of beConfirmList" :key="'beConfirmList' + index">
            <el-divider content-position="left">{{
              item.ClinicalDataSetName
            }}</el-divider>
            <el-table v-loading="listLoading" :data="item.AnswerList" :show-header="true"
              @sort-change="handleSortByColumn">
              <el-table-column v-for="ite of item.QuestionList" :prop="ite.Id" :label="ite.QuestionName"
                show-overflow-tooltip width="120" :key="ite.Id" />
            </el-table>
          </div>
        </div>
        <div v-else class="preview-wrapper">
          <div class="left-wrapper">
            <div v-if="cdList.length > 0" class="basic-content">
              <div v-for="item in cdList" :key="item.Id" class="cd-wrapper">
                <div class="cd-name-wrapper">
                  {{ item.ClinicalDataSetName }}
                </div>
                <div v-for="date in item.DateList" :key="date.Id" class="cd-item" :class="{
                  activeBtn: date.ClinicalFormId === selected.ClinicalFormId,
                }" @click="selectCheckDate(date)">
                  {{ date.CheckDate.split(' ')[0] }}
                </div>
              </div>
            </div>
          </div>
          <div class="right-wrapper">
            <clinicalDataQuestions v-if="isShow" :data="selected" :trial-clinical-id="selected.ClinicalDataTrialSetId"
              :is-viewer="false" :visit-id="selected.VisitId" :subject-id="selected.SubjectId"
              :trial-id="selected.TrialId" :reading-id="selected.ReadingId" :clinical-form-id="selected.ClinicalFormId"
              :open-type="'look'" @close="false" />
          </div>
        </div>
      </div>
      <div class="base-dialog-footer" v-if="confirmType !== 'look'" style="text-align: right; margin-top: 10px">
        <!-- 取消 -->
        <el-button size="small" type="primary" @click="confirmVisible = false">
          {{ $t('common:button:cancel') }}
        </el-button>
        <!-- 保存 -->
        <el-button size="small" type="primary" @click="confirmClinicalData">
          {{ $t('common:button:confirm') }}
        </el-button>
      </div>
    </el-dialog>
    <el-dialog v-if="preview.visible" :visible.sync="preview.visible" :close-on-click-modal="false"
      :title="preview.title" width="80%">
      <clinicalDataQuestions :data="rowData" :trial-clinical-id="rowData.ClinicalDataTrialSetId" :is-viewer="false"
        :visit-id="rowData.VisitId" :subject-id="rowData.SubjectId" :trial-id="rowData.TrialId"
        :reading-id="rowData.ReadingId" :clinical-form-id="rowData.ClinicalFormId"
        :subject-visit-id="rowData.BaseLineVisitId" :reading-clinical-data-id="ReadingClinicalDataId"
        :open-type="openType" :clinical-upload-type="clinicalUploadType"
        :Clinical-data-level="rowData.ClinicalDataLevel" @close="
          preview.visible = false
        handleUpload(subjectRowData)
        handleView(formRow, true)
          " />
    </el-dialog>
    <el-dialog v-if="preview2.visible" :visible.sync="preview2.visible" :close-on-click-modal="false"
      :title="preview2.title" width="80%">
      <el-table v-loading="listLoading" :data="AnswerList" :show-header="true" @sort-change="handleSortByColumn">
        <el-table-column v-for="item of QuestionList" :prop="item.Id" :label="item.QuestionName" show-overflow-tooltip
          width="120" :key="item.Id" />
        <el-table-column :label="$t('common:action:action')" width="150" fixed="right">
          <template slot-scope="scope">
            <el-button icon="el-icon-view" circle size="mini" title="查看" @click="handleView2(scope.row)" />
            <el-button icon="el-icon-edit-outline" circle size="mini" title="编辑" @click="handleEdit2(scope.row)" />
            <el-button icon="el-icon-delete" circle size="mini" title="删除" @click="handleDelete2(scope.row)" />
          </template>
        </el-table-column>
      </el-table>
    </el-dialog>
  </BaseContainer>
</template>
<script>
import {
  getCRCVisitList,
  getTrialSiteSelect,
  getTrialVisitStageSelect,
  verifyCRCRequestToQC,
  deleteSubjectVisit,
  updateSubjectAndSVInfo,
  getTrialCriterionList,
  getCRCSubjectClinicalList,
  deleteClinicalForm,
  getCRCConfirmList,
  cRCConfirmClinical,
  cRCCancelConfirmClinical,
  getClinicalTableList,
  getClinicalDateList,
  getVisitClinicalDataName,
} from '@/api/trials'
import { cRCRequestToQC, requestImageBack } from '@/api/trials/visit'
import { cRCVisitList_Export } from '@/api/export'
import BaseContainer from '@/components/BaseContainer'
import Pagination from '@/components/Pagination'
import VisitForm from './components/visitForm'
import UploadDicomFiles from './components/uploadDicomFiles'
import UploadDicomFiles2 from './components/uploadDicomFiles2'
import UploadNonDicomFiles from './components/uploadNonDicomFiles'
import UploadClinicalData from './components/uploadClinicalData'
import HistoryChat from './components/historyChat'
import StudyInfo from './components/studyInfo'
import SubjectsForm from './components/SubjectsForm'
import SignForm from '@/views/trials/components/newSignForm'
import BaseModel from '@/components/BaseModel'
import dicomStore from '@/utils/dicom-store'
import { getClinicalQuestionFormList } from '@/api/dictionary'
import moment from 'moment'
import const_ from '@/const/sign-code'
import { changeURLStatic } from '@/utils/history.js'
import clinicalDataQuestions from '@/components/clinicalDataQuestions'
const searchDataDefault = () => {
  return {
    SubjectInfo: '',
    TrialSiteId: '',
    PageIndex: 1,
    PageSize: 20,
    VisitPlanArray: [],
    AuditStateArray: [],
    SubmitState: null,
    ChallengeState: null,
    IsSubjectQuit: "",
    SubjectStatus: null
    // SortField: '',
    // Asc: false
  }
}
export default {
  name: 'VisitList',
  components: {
    clinicalDataQuestions,
    BaseContainer,
    Pagination,
    BaseModel,
    SignForm,
    VisitForm,
    UploadDicomFiles,
    UploadNonDicomFiles,
    UploadClinicalData,
    HistoryChat,
    StudyInfo,
    SubjectsForm,
    UploadDicomFiles2,
  },
  data() {
    return {
      edit_cfg: { visible: false, title: '', width: '600px', showClose: true },
      SubjectVisible: false,
      formRow: {},
      searchData: searchDataDefault(),
      loading: false,
      uploadVisible: false,
      qcVisible: false,
      list: [],
      total: 0,
      siteOptions: [],
      visitPlanOptions: [],
      rowData: {},
      moment,
      activeName: 'dicom',
      studyVisible: false,
      studyLoading: false,
      studyList: [],
      deleteArr: [],
      currentVisitId: '',
      urgentForm: { isUrgent: null },
      btnLoading: false,
      chat_cfg: { visible: false, title: '', width: '1000px', showClose: true },
      relationVisible: false,
      otherInfo: {},
      SubjectInfo: {},
      selectArr: [],
      signVisible: false,
      signCode: null,
      signReplaceText: null,
      currentUser: zzSessionStorage.getItem('userName'),
      pickerOption: {
        disabledDate: (time) => {
          return time.getTime() > Date.now()
        },
      },
      trialId: this.$route.query.trialId,
      uploadVisible2: false,
      openWindow: null,
      ReadingClinicalDataId: null,
      clinicalUploadType: null,
      isShow: false,
      selected: {},
      listLoading: false,
      configVisible: false,
      listQuery: searchDataDefault(),
      clinicalData: [],
      rowData2: {},
      spanArr: [],
      QuestionList: [],
      AnswerList: [],
      pos: 0,
      pos2: 0,
      spanArr2: 0,
      confirmData: [],
      preview: { visible: false, title: '临床数据自定义问题' },
      preview2: { visible: false, title: '已上传临床数据列表' },
      openType: 'look',
      formListData: {},
      confirmVisible: false,
      subjectRowData: {},
      beConfirmList: [],
      cdList: [],
      trialCriterionList: [],
      TrialReadingCriterionId: '0',
      confirmType: 'look',
      confirmPageTotal: 0,
      clinicalPageTotal: 0,
      clinicalPage: {
        PageIndex: 1,
        PageSize: 20,
      },
      confirmPage: {
        PageIndex: 1,
        PageSize: 20,
      },
      TrialReadingCriterionName: null,
      TrialCode: null,
      isOCTorIVUS: false
    }
  },
  watch: {
    list() {
      this.$nextTick(() => {
        this.$refs.visitList.doLayout()
      })
    },
    TrialReadingCriterionId(v, old) {
      if (v === '0') return
      if (old === '0' || old === null) {
        this.handleUpload2(this.subjectRowData, true)
      } else {
        this.handleUpload2(this.subjectRowData)
      }
      // if (v === '0') return
      this.TrialReadingCriterionName = this.trialCriterionList.find(
        (o) => v === o.TrialReadingCriterionId
      ).TrialReadingCriterionName
      // this.handleUpload2(this.subjectRowData)
    },
    uploadVisible() {
      if (!this.uploadVisible) {
        this.$store.state.trials.checkTaskId = null
      }
    },
  },
  mounted() {
    this.getSite()
    if (this.$route.query.subjectCode) {
      this.searchData.SubjectInfo = this.$route.query.subjectCode
      changeURLStatic('subjectCode', '')
    }

    if (this.$route.query.trialSiteId) {
      this.searchData.TrialSiteId = this.$route.query.trialSiteId
      changeURLStatic('trialSiteId', '')
    }
    this.TrialCode = this.$route.query.trialCode
    this.getList()
    this.getVisitPlanOptions()
    this.getTrialCriterionList()
  },
  methods: {
    // 申请影像退回
    async imageBack(row) {
      try {
        let title = `${this.$t('trials:crcUpload:confirmMessage:imageBackTitle').replace('xxx', row.SubjectCode).replace('yyy', row.VisitName)}`
        this.$prompt(`<p style="margin-left: 5px;">${title}</p><span style="color:#F56C6C">*</span><span>${this.$t("trials:crcUpload:confirmMessage:ApplyReason")}</span>`, this.$t("trials:crcUpload:confirmMessage:imageBack"), {
          confirmButtonText: this.$t("common:button:save"),
          cancelButtonText: this.$t("common:button:cancel"),
          dangerouslyUseHTMLString: true,
          inputValidator: (val) => {
            if (!val) return this.$t("common:ruleMessage:specify")
          },
          inputErrorMessage: this.$t("common:ruleMessage:specify")
        }).then(async ({ value }) => {
          let params = {
            SubjectVisitId: row.Id,
            ApplyReason: value
          }
          // return console.log(params)
          let res = await requestImageBack(params)

          if (res.IsSuccess) {
            this.getList()
          }
        }).catch(() => {

        });
        // let confirm = await this.$confirm(this.$t("trials:crcUpload:confirmMessage:imageBack"))
        // if (!confirm) return false
      } catch (err) {
        console.log(err)
      }
    },
    selectCheckDate(date) {
      this.isShow = false
      this.selected.ClinicalFormId = date.ClinicalFormId
      this.selected.ClinicalDataTrialSetId = date.ClinicalDataTrialSetId
      this.selected.TrialId = this.subjectRowData.TrialId
      this.selected.SubjectId = this.subjectRowData.SubjectId
      this.$nextTick(() => {
        this.isShow = true
      })
    },
    getTrialCriterionList(row) {
      this.TrialReadingCriterionId = '0'
      getTrialCriterionList(this.trialId, false)
        .then(async (res) => {
          this.trialCriterionList = res.Result
          this.TrialReadingCriterionId =
            this.trialCriterionList[0].TrialReadingCriterionId
          this.isOCTorIVUS = this.trialCriterionList.some(item => item.CriterionType === 19 || item.CriterionType === 20)
          // this.handleUpload2(this.subjectRowData)
        })
        .catch(() => { })
    },
    confirmClinicalData() {
      cRCConfirmClinical({
        TrialId: this.subjectRowData.TrialId,
        SubjectId: this.rowData.SubjectId,
        ReadModuleId: this.rowData.ReadModuleId,
      }).then((res) => {
        this.$message.success('确认成功')
        this.handleUpload2(this.subjectRowData)
        this.confirmVisible = false
      })
    },
    handleUnConfirm(row) {
      this.rowData = { ...row }
      this.$confirm('确定撤销确认吗？').then((res) => {
        cRCCancelConfirmClinical({
          TrialId: this.subjectRowData.TrialId,
          ReadModuleId: row.ReadModuleId,
        }).then((res) => {
          this.$message.success('撤销成功')
          this.handleUpload2(this.subjectRowData)
        })
      })
    },
    getCRCBeConfirmList(row, type) {
      this.rowData = { ...row }
      this.confirmVisible = true
      this.confirmType = type
      this.IsHaveTableQuestion = this.rowData.IsHaveTableQuestion
      if (!this.rowData.IsHaveTableQuestion) {
        getClinicalTableList({
          TrialId: this.subjectRowData.TrialId,
          ReadModuleId: row.ReadModuleId,
        }).then((res) => {
          this.beConfirmList = res.Result
        })
      } else {
        getClinicalDateList({
          TrialId: this.subjectRowData.TrialId,
          ReadModuleId: row.ReadModuleId,
        }).then((res) => {
          this.cdList = res.Result
          this.selected.ClinicalFormId =
            this.cdList[0].DateList[0].ClinicalFormId
          this.selected.ClinicalDataTrialSetId =
            this.cdList[0].DateList[0].ClinicalDataTrialSetId
          this.selected.TrialId = this.subjectRowData.TrialId
          this.selected.SubjectId = this.subjectRowData.SubjectId
          this.isShow = true
        })
      }
    },
    handleView2(row) {
      this.rowData = { ...row }
      this.openType = 'look'
      this.preview.visible = true
    },
    handleEdit2(row) {
      this.rowData = { ...row }
      this.openType = 'edit'
      this.preview.visible = true
    },
    handleDelete2(row) {
      this.$confirm('确定删除该条临床数据记录吗？').then(() => {
        this.listLoading = true
        deleteClinicalForm({
          ClinicalFormId: row.ClinicalFormId,
        }).then((res) => {
          this.$message.success('删除成功')
          this.listLoading = false
          this.handleView(row)
        })
      })
    },
    handleAdd2(row) {
      this.rowData = { ...row }
      this.clinicalUploadType = this.rowData.ClinicalUploadType
      this.ReadingClinicalDataId = this.rowData.ReadingClinicalDataId
      this.preview.visible = true
      this.preview.title = `录入临床数据(${this.subjectRowData.TrialCode}|${this.rowData.SubjectCode})`
      this.openType = 'add'
    },
    goVisit(row) {
      this.$router.push({
        path: `/trials/trials-panel/visit/crc-upload?trialId=${row.TrialId}&trialCode=${row.TrialCode}&researchProgramNo=${row.ResearchProgramNo}`,
      })
    },
    handleView(row, isOpen) {
      this.rowData = { ...row }
      this.formRow = { ...row }
      this.clinicalUploadType = this.rowData.ClinicalUploadType
      this.listLoading = true
      getClinicalQuestionFormList({
        TrialId: row.TrialId,
        SubjectId: row.SubjectId,
        ClinicalDataTrialSetId: row.ClinicalDataTrialSetId,
      }).then((res) => {
        if (!isOpen) {
          this.preview2.visible = true
          this.preview2.title = `已上传临床数据列表(${this.TrialCode}|${this.rowData.SubjectCode})`
        }
        this.listLoading = false
        this.QuestionList = res.Result.QuestionList
        this.AnswerList = res.Result.AnswerList
      })
    },
    getSpanArr(data) {
      for (var i = 0; i < data.length; i++) {
        if (i === 0) {
          this.spanArr.push(1)
          this.pos = 0
        } else {
          // 判断当前元素与上一个元素是否相同
          if (data[i].SubjectId === data[i - 1].SubjectId) {
            this.spanArr[this.pos] += 1
            this.spanArr.push(0)
          } else {
            this.spanArr.push(1)
            this.pos = i
          }
        }
      }
    },
    getSpanArr2(data) {
      for (var i = 0; i < data.length; i++) {
        if (i === 0) {
          this.spanArr2.push(1)
          this.pos2 = 0
        } else {
          // 判断当前元素与上一个元素是否相同
          if (data[i].SubjectId === data[i - 1].SubjectId) {
            this.spanArr2[this.pos2] += 1
            this.spanArr2.push(0)
          } else {
            this.spanArr2.push(1)
            this.pos2 = i
          }
        }
      }
    },
    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
      if (columnIndex === 0) {
        const _row = this.spanArr[rowIndex]
        const _col = _row > 0 ? 1 : 0
        return {
          rowspan: _row,
          colspan: _col,
        }
      }
    },
    handleUpload2(row, old) {
      this.listLoading = true
      this.rowData = { ...row }
      getCRCConfirmList({
        TrialId: this.trialId,
        IsPMConfirm: false,
        TrialReadingCriterionId: this.TrialReadingCriterionId,
        PageIndex: this.confirmPage.PageIndex,
        PageSize: this.confirmPage.PageSize,
      }).then((res) => {
        this.spanArr2 = []
        this.pos2 = 0
        if (!old) {
          this.configVisible = true
        }
        this.confirmData = res.Result.CurrentPageData
        this.confirmPageTotal = res.Result.TotalCount
        this.getSpanArr2(this.confirmData)
        this.listLoading = false
      })
    },
    handleUpload(row) {
      this.listLoading = true
      this.rowData = { ...row }
      this.subjectRowData = { ...row }
      getCRCSubjectClinicalList({
        TrialId: this.trialId,
        PageIndex: this.clinicalPage.PageIndex,
        PageSize: this.clinicalPage.PageSize,
      }).then((res) => {
        this.spanArr = []
        this.pos = 0
        this.configVisible = true
        this.clinicalData = res.Result.CurrentPageData
        this.clinicalPageTotal = res.Result.TotalCount
        this.getSpanArr(this.clinicalData)
        this.listLoading = false
      })
      this.getTrialCriterionList(row)
    },
    handleExport() {
      cRCVisitList_Export(this.searchData)
        .then((res) => { })
        .catch(() => {
          this.loading = false
        })
    },
    // 获取访视计划列表
    getList() {
      this.loading = true
      this.searchData.TrialId = this.trialId
      getCRCVisitList(this.searchData)
        .then((res) => {
          this.loading = false
          this.list = res.Result.CurrentPageData
          this.total = res.Result.TotalCount
          this.otherInfo = res.OtherInfo
        })
        .catch(() => {
          this.loading = false
        })
    },
    // 新建计划外的访视信息
    handleAdd() {
      this.rowData = {}
      this.edit_cfg.title = this.$t('trials:crcUpload:dialogTitle:new')
      this.edit_cfg.visible = true
    },
    // 编辑访视信息
    handleEdit(row) {
      this.rowData = row
      this.edit_cfg.title = this.$t('trials:crcUpload:dialogTitle:edit')
      this.edit_cfg.visible = true
    },
    closeEditDialog() {
      this.edit_cfg.visible = false
    },
    // 上传Dicoms/非Dicoms文件
    CRChandleUpload(row) {
      dicomStore.studyList = []
      this.activeName = 'dicom'
      this.rowData = { ...row }
      this.$store.state.trials.checkTaskId = row.Id
      this.uploadVisible = true
      this.uploadVisible2 = false
    },
    CRChandleUpload2(row) {
      dicomStore.studyList = []
      if ([0, 1].includes(this.$store.state.trials.config.CollectImagesEnum)) {
        this.activeName = 'dicom'
      } else {
        this.activeName = 'non-dicom'
      }

      this.rowData = { ...row }
      this.$store.state.trials.checkTaskId = row.Id
      this.uploadVisible = true
      this.uploadVisible2 = true
    },
    // 将影像提交给QC
    handleSubmit(row) {
      this.rowData = { ...row }
      // if (row.IsBaseLine) {
      //   if (this.otherInfo.ClinicalInformationTransmissionEnum > 0) {
      //     const { ClinicalDataConfirmation } = const_.processSignature
      //     this.signCode = ClinicalDataConfirmation
      //     this.signVisible = true
      //   } else {
      //     this.submit()
      //   }
      // } else {
      // 校验是否可提交
      this.verifyIsAllowSubmit()
      // }
    },
    verifyIsAllowSubmit() {
      this.loading = true
      var param = {
        trialId: this.trialId,
        subjectVisitIds: [this.rowData.Id],
      }
      verifyCRCRequestToQC(param)
        .then((res) => {
          this.loading = false
          if (res.IsSuccess) {
            let text = this.$t('trials:crcUpload:message:submit')
            if (this.rowData.IsHaveUploadFailed) {
              text = `<div>${this.$t('trials:crcUpload:message:submit')}</div>`
            }
            this.$confirm(text, {
              dangerouslyUseHTMLString: true,
              type: 'warning',
              distinguishCancelAndClose: true,
            })
              .then(() => {
                if (this.rowData.IsBaseLine) {
                  if (this.otherInfo.ClinicalInformationTransmissionEnum > 0) {
                    getVisitClinicalDataName({ id: this.rowData.Id })
                      .then((res) => {
                        this.signReplaceText = res.Result.ClinicalDataName
                        const { ClinicalDataConfirmation } =
                          const_.processSignature
                        this.signCode = ClinicalDataConfirmation
                        this.signVisible = true
                      })
                      .catch((err) => {
                        console.log(err)
                      })
                  } else {
                    this.submit()
                  }
                } else {
                  this.checkNeedSignAndSubmit()
                }
              })
              .catch(() => { })
          }
        })
        .catch((res) => {
          this.loading = false
          if (res.Result === 1) {
            this.$confirm(res.ErrorMessage, {
              showCancelButton: false,
              showConfirmButton: false,
              type: 'warning',
            })
          } else if (res.Result === 0) {
            this.$confirm(res.ErrorMessage, {
              distinguishCancelAndClose: true,
              type: 'warning',
            })
              .then(() => {
                this.checkNeedSignAndSubmit()
              })
              .catch(() => { })
          }
        })
    },
    checkNeedSignAndSubmit() {
      if (
        this.otherInfo.IsHaveFirstGiveMedicineDate &&
        (this.rowData.SubjectFirstGiveMedicineTime === null ||
          this.rowData.SubjectFirstGiveMedicineTime === '') &&
        !this.rowData.IsBaseLine
      ) {
        var item = Object.assign({}, this.rowData)
        item.Code = this.rowData.SubjectCode
        item.Id = this.rowData.SubjectId
        this.SubjectInfo = item
        this.SubjectVisible = true
      } else {
        if (
          this.otherInfo.ClinicalInformationTransmissionEnum > 0 &&
          this.rowData.IsBaseLine
        ) {
          getVisitClinicalDataName({ id: this.rowData.Id })
            .then((res) => {
              this.signReplaceText = res.Result.ClinicalDataName
              const { ClinicalDataConfirmation } = const_.processSignature
              this.signCode = ClinicalDataConfirmation
              this.signVisible = true
            })
            .catch((err) => {
              console.log(err)
            })
        } else {
          this.submit()
        }
      }
    },
    submitFirstGiveMedicineTime(firstGiveMedicineTime) {
      this.rowData.SubjectFirstGiveMedicineTime = firstGiveMedicineTime
      this.SubjectVisible = false
      this.checkNeedSignAndSubmit()
    },
    // 关闭签名框
    closeSignDialog(isSign, signInfo) {
      if (isSign) {
        this.submit(signInfo)
      } else {
        this.signVisible = false
      }
    },
    submit(signInfo) {
      this.loading = true
      var params = {
        data: { trialId: this.trialId, subjectVisitIds: [this.rowData.Id] },
      }
      if (signInfo) {
        params.signInfo = signInfo
      }
      cRCRequestToQC(params)
        .then((res) => {
          this.loading = false
          if (res.IsSuccess) {
            if (signInfo) {
              this.$refs['signForm'].btnLoading = false
              this.signVisible = false
            }
            this.getList()
            this.$message.success(
              this.$t('trials:crcUpload:message:submittedSuccessfully')
            )
          }
        })
        .catch((res) => {
          this.loading = false
          if (res.Result === 3) {
            this.getList()
            this.signVisible = false
            this.$confirm(res.ErrorMessage, {
              showCancelButton: false,
              showConfirmButton: true,
              type: 'warning',
            })
          } else {
            if (signInfo) {
              this.$refs['signForm'].btnLoading = false
            }
          }
        })
    },
    // 将影像批量提交给QC
    handleBulkSubmit() {
      this.$confirm(this.$t('trials:crcUpload:message:bulkSubmit'), {
        type: 'warning',
        distinguishCancelAndClose: true,
      })
        .then(() => {
          this.loading = true
          var params = {
            data: { trialId: this.trialId, subjectVisitIds: this.selectArr },
          }
          cRCRequestToQC(params)
            .then((res) => {
              if (res.IsSuccess) {
                this.getList()
                this.$message.success(
                  this.$t('trials:crcUpload:message:submittedSuccessfully')
                )
              }
            })
            .catch((res) => {
              this.loading = false
              if (res.Result === 3) {
                this.$confirm(res.ErrorMessage, {
                  showCancelButton: false,
                  showConfirmButton: true,
                  type: 'warning',
                })
              }
              this.getList()
            })
        })
        .catch(() => { })
    },
    // 获取某个访视下的检查信息
    handleOpenStudyDialog(row) {
      this.studyVisible = true
      this.currentVisitId = row.Id
      this.rowData = { ...row }
    },
    // 关闭上传弹框
    closeUpload() {
      this.uploadVisible = false
      this.$store.state.trials.checkTaskId = null
      if (this.openWindow) {
        this.openWindow.close()
      }
    },
    // 打开历史质疑记录
    handleOpenHistoryChat(row) {
      this.rowData = { ...row }
      this.chat_cfg.title = `${this.$t(
        'trials:crcUpload:dialogTitle:qsRecord'
      )} (${row.SubjectCode} ${row.VisitName})`
      this.chat_cfg.visible = true
    },
    // 删除
    handleDelete(row) {
      this.$confirm(this.$t('trials:crcUpload:message:deleteVisit'), {
        type: 'warning',
        distinguishCancelAndClose: true,
      }).then(() => {
        this.loading = true
        deleteSubjectVisit(this.trialId, row.Id)
          .then((res) => {
            if (res.IsSuccess) {
              // this.list.splice(this.list.findIndex(item => item.Id === row.Id), 1)
              this.getList()
              this.$message.success(
                this.$t('trials:crcUpload:message:deleteVisitSuccessfully')
              )
            }
            this.loading = false
          })
          .catch(() => {
            this.loading = false
          })
      })
    },
    // 重置
    handleReset() {
      this.searchData = searchDataDefault()
      this.getList()
    },
    closeSubjectVisible() {
      this.SubjectVisible = false
    },
    // 查询
    handleSearch() {
      this.searchData.PageIndex = 1
      this.getList()
    },
    // 排序
    handleSortByColumn(column) {
      if (column.order === 'ascending') {
        this.searchData.Asc = true
      } else {
        this.searchData.Asc = false
      }
      this.searchData.SortField = column.prop
      this.searchData.PageIndex = 1
      this.getList()
    },
    // 获取site下拉框数据
    getSite() {
      getTrialSiteSelect(this.trialId).then((res) => {
        this.siteOptions = res.Result
      })
    },
    // 获取访视下拉框数据
    getVisitPlanOptions() {
      getTrialVisitStageSelect(this.trialId).then((res) => {
        this.visitPlanOptions = res.Result
      })
    },
    // 保存关联信息
    saveRelationInfo() {
      this.btnLoading = true
      const param = {
        subjectVisitId: this.rowData.Id,
        subjectId: this.rowData.SubjectId,
        pdState: this.rowData.PDState,
        isEnrollmentConfirm: this.rowData.IsEnrollmentConfirm,
        subjectFirstGiveMedicineTime: this.rowData.SubjectFirstGiveMedicineTime,
      }
      updateSubjectAndSVInfo(this.trialId, param)
        .then((res) => {
          this.btnLoading = false
          this.$message.success(this.$t('common:message:savedSuccessfully'))
          this.relationVisible = false
          this.getList()
        })
        .catch(() => {
          this.btnLoading = false
        })
    },
    // 通过提交状态决定该行的 CheckBox 是否可以勾选
    handleSelectTable(row) {
      if (this.otherInfo.ClinicalInformationTransmissionEnum > 0) {
        return (
          row.SubmitState === 1 && row.IsBaseLine === false && row.PDState === 0
        )
      } else {
        return row.SubmitState === 1 && row.PDState === 1 // 待提交
      }
    },
    // 当选择项发生变化时会触发该事件
    handleSelectionChange(val) {
      const arr = []
      for (let index = 0; index < val.length; index++) {
        arr.push(val[index].Id)
      }
      this.selectArr = arr
    },
    beforeCloseUploadDig(done) {
      this.$store.state.trials.checkTaskId = null
      if (this.openWindow) {
        this.openWindow.close()
      }
      done()
    },
    beforeCloseStudyDig(done) {
      if (this.openWindow) {
        this.openWindow.close()
      }
      done()
    },
    setOpenWindow(window) {
      if (this.openWindow) {
        this.openWindow.close()
      }
      this.openWindow = window
    },
  },
}
</script>
<style lang="scss">
.visit-list {
  position: relative;

  .status-primary-circle {
    display: inline-block;
    width: 20px;
    height: 20px;
    text-align: center;
    line-height: 18px;
    border-radius: 50%;
    // background: #f56c6c;
    border: 1px solid #f56c6c;
    color: #f56c6c;
    font-size: 10px;
  }

  .remark {
    position: absolute;
    left: 5px;
    bottom: 7px;
    font-size: 12px;
  }

  .box-title {
    padding: 12px;
    margin-bottom: 10px;
    background-color: #dcdfe6;
  }

  .is-circle-urgent-red {
    border-radius: 50%;
    padding: 7px;
    line-height: 1;
    background-color: #f56c6c;
    width: 28px;
    color: #fff;
    border: 1px solid #dcdfe6;
  }

  .is-circle-urgent {
    border-radius: 50%;
    padding: 7px;
    line-height: 1;
    width: 28px;
    border: 1px solid #dcdfe6;
    font-size: 12px;
  }
}

.tip {
  display: flex;
  align-items: flex-start;
  margin: 3px 0;

  i {
    margin: 3px 5px 0 0;
  }
}
</style>
