<template>
  <BaseContainer class="reread-task">
    <el-tabs v-model="TrialReadingCriterionId" type="border-card">
      <el-tab-pane v-for="item of trialCriterionList" :key="item.TrialReadingCriterionId" :label="item.TrialReadingCriterionName" :name="item.TrialReadingCriterionId">
        <div v-if="TrialReadingCriterionId === item.TrialReadingCriterionId">
          <div slot="search-container">
            <el-form :inline="true">
              <!-- 是否加急 -->
              <el-form-item
                style="margin-bottom:10px"
                :label="$t('trials:rereadTask:table:isUrgent')"
              >
                <el-select
                  v-model="searchData.IsUrgent"
                  clearable
                  style="width:120px;"
                >
                  <el-option
                    v-for="item of $d.YesOrNo"
                    :key="'IsUrgent' + item.label"
                    :value="item.value"
                    :label="item.label"
                  />
                </el-select>
              </el-form-item>
              <!-- 中心编号 -->
              <el-form-item :label="$t('trials:rereadTask:table:siteCode')">
                <el-select v-model="searchData.TrialSiteId" clearable filterable style="width:120px;">
                  <el-option
                    v-for="(i,index) of siteOptions"
                    :key="index"
                    :label="i.TrialSiteCode"
                    :value="i.TrialSiteId"
                  />
                </el-select>
              </el-form-item>
              <!-- 受试者编号 -->
              <el-form-item v-if="otherInfo && otherInfo.IsReadingTaskViewInOrder !== 0" :label="$t('trials:rereadTask:table:subjectCode')">
                <el-input v-model="searchData.SubjectCode" style="width:100px;" />
              </el-form-item>
              <!-- <el-form-item style="margin-bottom:10px" label="访视/阅片期名称">
                <el-input
                  v-model="searchData.TaskName"
                  style="width:100px;"
                  clearable
                />
              </el-form-item> -->
              <!-- 任务名称 -->
              <el-form-item :label="$t('trials:rereadTask:table:taskBlindName')">
                <el-input
                  v-model="searchData.TaskBlindName"
                  style="width:130px;"
                  clearable
                />
              </el-form-item>
              <el-form-item :label="$t('trials:rereadTask:table:taskState')">
                <el-select v-model="searchData.TaskState" clearable style="width:120px;">
                  <el-option v-for="i of $d.TaskState" :key="'TaskState' + i.label" :value="i.value" :label="i.label" />
                </el-select>
              </el-form-item>
              <el-form-item :label="$t('trials:rereadTask:table:readingCategory')">
                <el-select v-model="searchData.ReadingCategory" clearable style="width:120px;">
                  <el-option v-for="i of $d.ReadingCategory" :key="'ReadingCategory' + i.label" :value="i.value" :label="i.label" />
                </el-select>
              </el-form-item>
              <el-form-item :label="$t('trials:rereadTask:table:requestReReadingResultEnum')">
                <el-select v-model="searchData.RequestReReadingResultEnum" clearable style="width:120px;">
                  <el-option v-for="i of $d.RequestReReadingResult" :key="'RequestReReadingResultEnum' + i.label" :value="i.value" :label="i.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-form-item>
            </el-form>
          </div>
          <div slot="main-container">
            <el-table
              v-adaptive="{bottomOffset:75}"
              v-loading="loading"
              :data="list"
              stripe
              height="100"
              @sort-change="handleSortChange"
            >
              <el-table-column type="index" width="40" align="left" />
              <!-- 是否加急 -->
              <el-table-column
                prop="OriginalReReadingTask.IsUrgent"
                :label="$t('trials:rereadTask:table:isUrgent')"
                show-overflow-tooltip
                sortable="custom"
                min-width="80"
              >
                <template slot-scope="scope">
                  <el-tag v-if="scope.row.OriginalReReadingTask.IsUrgent" type="danger">{{ $fd('YesOrNo', scope.row.OriginalReReadingTask.IsUrgent) }}</el-tag>
                  <el-tag v-else type="primary">{{ $fd('YesOrNo', scope.row.OriginalReReadingTask.IsUrgent) }}</el-tag>
                </template>
              </el-table-column>
              <!-- 任务编号 -->
              <!-- <el-table-column
                prop="OriginalReReadingTask.TaskCode"
                min-width="100"
                :label="$t('trials:rereadTask:table:taskCode')"
                sortable="custom"
                show-overflow-tooltip
              /> -->
              <!-- 中心编号 -->
              <el-table-column
                prop="OriginalReReadingTask.TrialSiteCode"
                :label="$t('trials:rereadTask:table:siteCode')"
                min-width="90"
                sortable="custom"
                show-overflow-tooltip
              />
              <!-- 受试者编号 -->
              <el-table-column
                v-if="otherInfo && otherInfo.IsReadingTaskViewInOrder !== 0"
                prop="OriginalReReadingTask.SubjectCode"
                min-width="90"
                :label="$t('trials:rereadTask:table:subjectCode')"
                sortable="custom"
                show-overflow-tooltip
              />

              <!-- 盲态任务标识 -->
              <el-table-column
                prop="OriginalReReadingTask.TaskBlindName"
                min-width="100"
                :label="$t('trials:rereadTask:table:taskBlindName')"
                sortable="custom"
                show-overflow-tooltip
              />
              <!-- 阅片标准 -->
              <!-- <el-table-column
                prop="OriginalReReadingTask.TrialReadingCriterionName"
                :label="$t('trials:rereadTask:table:criterionName')"
                min-width="100"
                show-overflow-tooltip
                sortable="custom"
              /> -->
              <!-- 任务状态 -->
              <el-table-column
                prop="OriginalReReadingTask.TaskState"
                :label="$t('trials:rereadTask:table:taskState')"
                width="120"
                sortable="custom"
                show-overflow-tooltip
              >
                <template slot-scope="scope">
                  <el-tag v-if="scope.row.OriginalReReadingTask.TaskState === 0" type="primary">{{ $fd('TaskState', scope.row.OriginalReReadingTask.TaskState) }}</el-tag>
                  <el-tag v-if="scope.row.OriginalReReadingTask.TaskState === 1" type="info">{{ $fd('TaskState', scope.row.OriginalReReadingTask.TaskState) }}</el-tag>
                  <el-tag v-if="scope.row.OriginalReReadingTask.TaskState === 3" type="danger">{{ $fd('TaskState', scope.row.OriginalReReadingTask.TaskState) }}</el-tag>
                  <el-tag v-if="scope.row.OriginalReReadingTask.TaskState === 4" type="warning">{{ $fd('TaskState', scope.row.OriginalReReadingTask.TaskState) }}</el-tag>
                  <el-tag v-if="scope.row.OriginalReReadingTask.TaskState === 5" type="danger">{{ $fd('TaskState', scope.row.OriginalReReadingTask.TaskState) }}</el-tag>
                </template>
              </el-table-column>
              <!-- 任务类型 -->
              <el-table-column
                prop="OriginalReReadingTask.ReadingCategory"
                min-width="100"
                :label="$t('trials:rereadTask:table:readingCategory')"
                sortable="custom"
                show-overflow-tooltip
              >
                <template slot-scope="scope">
                  <el-tag v-if="scope.row.OriginalReReadingTask.ReadingCategory === 1" type="primary">{{ $fd('ReadingCategory', scope.row.OriginalReReadingTask.ReadingCategory) }}</el-tag>
                  <el-tag v-if="scope.row.OriginalReReadingTask.ReadingCategory === 2" type="info">{{ $fd('ReadingCategory', scope.row.OriginalReReadingTask.ReadingCategory) }}</el-tag>
                  <el-tag v-if="scope.row.OriginalReReadingTask.ReadingCategory === 4" type="danger">{{ $fd('ReadingCategory', scope.row.OriginalReReadingTask.ReadingCategory) }}</el-tag>
                  <el-tag v-if="scope.row.OriginalReReadingTask.ReadingCategory === 5" type="warning">{{ $fd('ReadingCategory', scope.row.OriginalReReadingTask.ReadingCategory) }}</el-tag>
                </template>
              </el-table-column>
              <!-- 完成阅片时间 -->
              <el-table-column
                prop="OriginalReReadingTask.SignTime"
                min-width="120"
                :label="$t('trials:rereadTask:table:signTime')"
                sortable="custom"
                show-overflow-tooltip
              />
              <!-- 重阅申请类型 -->
              <el-table-column
                prop="RequestReReadingType"
                width="130"
                :label="$t('trials:rereadTask:table:requestReReadingType')"
                sortable="custom"
                show-overflow-tooltip
              >
                <template slot-scope="scope">
                  <div v-if="scope.row.RequestReReadingType">
                    <el-tag v-if="scope.row.RequestReReadingType === 2" type="danger">{{ $fd('RequestReReadingType', scope.row.RequestReReadingType) }}</el-tag>
                    <el-tag v-else type="primary">{{ $fd('RequestReReadingType', scope.row.RequestReReadingType) }}</el-tag>
                  </div>
                </template>
              </el-table-column>
              <!-- 申请时间 -->
              <el-table-column
                prop="RequestReReadingTime"
                min-width="100"
                :label="$t('trials:rereadTask:table:requestReReadingTime')"
                sortable="custom"
                show-overflow-tooltip
              />
              <!-- 申请退回原因 -->
              <el-table-column
                prop="RequestReReadingReason"
                min-width="100"
                :label="$t('trials:rereadTask:table:requestReReadingReason')"
                show-overflow-tooltip
              />

              <!-- 审批结果 -->
              <el-table-column
                prop="RequestReReadingResultEnum"
                min-width="100"
                :label="$t('trials:rereadTask:table:requestReReadingResultEnum')"
                sortable="custom"
                show-overflow-tooltip
              >
                <template slot-scope="scope">
                  <div v-if="scope.row.RequestReReadingResultEnum || scope.row.RequestReReadingResultEnum === 0">
                    <el-tooltip v-if="scope.row.RequestReReadingResultEnum === 2" class="item" effect="dark" placement="top">
                      <div slot="content">
                        {{ scope.row.RequestReReadingRejectReason }}
                      </div>
                      <el-tag type="danger">{{ $fd('RequestReReadingResult', scope.row.RequestReReadingResultEnum) }}</el-tag>
                    </el-tooltip>
                    <el-tag v-if="scope.row.RequestReReadingResultEnum === 1" type="primary">{{ $fd('RequestReReadingResult', scope.row.RequestReReadingResultEnum) }}</el-tag>
                    <el-tag v-if="scope.row.RequestReReadingResultEnum === 0" type="warning">{{ $fd('RequestReReadingResult', scope.row.RequestReReadingResultEnum) }}</el-tag>
                  </div>
                </template>
              </el-table-column>
              <!-- 新任务编号 -->
              <!-- <el-table-column
                prop="ReReadingNewTaskCode"
                :label="$t('trials:rereadTask:table:reReadingNewTaskCode')"
                min-width="120"
                sortable="custom"
                show-overflow-tooltip
              /> -->
            </el-table>
            <!-- 分页组件 -->
            <pagination class="page" :total="total" :page.sync="searchData.PageIndex" :limit.sync="searchData.PageSize" @pagination="getList" />
            <el-dialog
              v-if="ConfirmReReadingVisible"
              title="驳回"
              :visible.sync="ConfirmReReadingVisible"
              width="600px"
              append-to-body
              :close-on-click-modal="false"
              custom-class="base-dialog-wrapper"
            >
              <div style="padding:10px;border: 1px solid #e0e0e0;max-height:650px;overflow-y: auto;">
                <el-form
                  ref="reasonForm"
                  :rules="rules"
                  :model="ConfirmReReadingForm"
                  class="demo-ruleForm"
                  size="small"
                  label-width="120px"
                >
                  <el-form-item label="驳回原因" prop="RequestReReadingRejectReason">
                    <el-input
                      v-model="ConfirmReReadingForm.RequestReReadingRejectReason"
                      type="textarea"
                      :autosize="{ minRows: 2, maxRows: 4}"
                      :placeholder="$t('common:ruleMessage:specify')"
                      maxlength="500"
                      show-word-limit
                    />
                  </el-form-item>
                </el-form>
              </div>
              <div slot="footer" class="dialog-footer">
                <!-- 取消 -->
                <el-button :disabled="btnLoading" size="small" type="primary" @click="ConfirmReReadingVisible = false;ConfirmReReadingForm = { RequestReReadingRejectReason: null }">
                  {{ $t('common:button:cancel') }}
                </el-button>
                <!-- 保存 -->
                <el-button :loading="btnLoading" size="small" type="primary" @click="handleConfirmReReading(rowData, 2)">
                  {{ $t('common:button:save') }}
                </el-button>
              </div>
            </el-dialog>
          </div>
        </div>
      </el-tab-pane>
    </el-tabs>
  </BaseContainer>
</template>
<script>
import { getIRReReadingTaskList, getTrialSiteSelect } from '@/api/trials'
import { confirmReReading, getTrialCriterionList } from '@/api/trials/reading'
import BaseContainer from '@/components/BaseContainer'
import Pagination from '@/components/Pagination'
import { changeURLStatic } from '@/utils/history.js'
const searchDataDefault = () => {
  return {
    IsUrgent: null,
    SubjectCode: '',
    TaskBlindName: '',
    TaskCode: '',
    PageIndex: 1,
    PageSize: 20,
    TaskState: null,
    ReadingCategory: null,
    RequestReReadingResultEnum: null,
  }
}
export default {
  name: 'RereadTask',
  components: { BaseContainer, Pagination },
  data() {
    return {
      searchData: searchDataDefault(),
      list: [],
      siteOptions: [],
      total: 0,
      loading: false,
      trialId: '',
      ConfirmReReadingForm: {
        RequestReReadingRejectReason: null
      },
      rules: {
        RequestReReadingRejectReason: [{ required: true, message: this.$t('common:ruleMessage:specify'), trigger: 'blur' }]
      },
      ConfirmReReadingVisible: false,
      trialCriterionList: [],
      TrialReadingCriterionId: '0',
      otherInfo: null
    }
  },
  watch: {
    TrialReadingCriterionId(v) {
      if (v) {
        this.searchData = searchDataDefault()
        this.getList()
      }
    }
  },
  mounted() {
    if (this.$route.query.TrialSiteId) {
      this.searchData.TrialSiteId = this.$route.query.TrialSiteId
      this.searchData.SubjectCode = this.$route.query.SubjectCode
      this.searchData.TaskName = this.$route.query.TaskName
      changeURLStatic('TrialSiteId', '')
      changeURLStatic('SubjectCode', '')
      changeURLStatic('TaskName', '')
    }
    this.trialId = this.$route.query.trialId
    this.getSite()
    // this.getList()
    this.getTrialCriterionList()
  },
  methods: {
    getTrialCriterionList() {
      getTrialCriterionList(this.trialId).then(res => {
        this.trialCriterionList = res.Result
        this.TrialReadingCriterionId = this.trialCriterionList[0].TrialReadingCriterionId
      }).catch(() => {})
    },
    getSite() {
      getTrialSiteSelect(this.trialId).then(res => {
        this.siteOptions = res.Result
      })
    },
    getList() {
      this.loading = true
      this.searchData.TrialId = this.trialId
      this.searchData.TrialReadingCriterionId = this.TrialReadingCriterionId
      getIRReReadingTaskList(this.searchData).then(res => {
        this.list = res.Result.CurrentPageData
        this.total = res.Result.TotalCount
        this.otherInfo = res.OtherInfo
        this.loading = false
      }).catch(() => { this.loading = false })
    },
    handleSearch() {
      this.searchData.PageIndex = 1
      this.getList()
    },
    handleReset() {
      this.searchData = searchDataDefault()
      this.getList()
    },
    handleConfirmReReading(row, type, open) {
      if (open) {
        this.rowData = { ...row }
        this.ConfirmReReadingVisible = true
        this.ConfirmReReadingForm = {
          RequestReReadingRejectReason: null
        }
        return
      }
      if (type === 2) {
        this.$refs.reasonForm.validate((valid) => {
          if (!valid) return
          var params = {
            ConfirmReReadingList: [
              {
                Id: row.Id,
                OriginalReReadingTaskId: row.OriginalReReadingTaskId,
                RootReReadingTaskId: row.RootReReadingTaskId,
                NewReReadingTaskId: row.NewReReadingTaskId
              }
            ],
            RequestReReadingRejectReason: this.ConfirmReReadingForm.RequestReReadingRejectReason,
            TrialId: this.$route.query.trialId,
            RequestReReadingResultEnum: type
          }
          this.loading = true
          this.btnLoading = true
          confirmReReading(params).then(() => {
            this.loading = false
            this.btnLoading = false
            this.$message.success(`${type === 1 ? '同意' : '拒绝'}申请成功`)
            this.getList()
            this.ConfirmReReadingVisible = false
          }).catch(() => {
            this.loading = false
            this.btnLoading = false
          })
        })
        return
      }
      this.$confirm(`确定${type === 1 ? '同意' : '拒绝'}该重阅申请？`).then(() => {
        var params = {
          ConfirmReReadingList: [
            {
              Id: row.Id,
              OriginalReReadingTaskId: row.OriginalReReadingTaskId,
              RootReReadingTaskId: row.RootReReadingTaskId,
              NewReReadingTaskId: row.NewReReadingTaskId
            }
          ],
          TrialId: this.$route.query.trialId,
          RequestReReadingResultEnum: type
        }
        this.loading = true
        this.btnLoading = true
        confirmReReading(params).then(() => {
          this.loading = false
          this.btnLoading = false
          this.$message.success(`${type === 1 ? '同意' : '拒绝'}申请成功`)
          this.getList()
        }).catch(() => {
          this.loading = false
          this.btnLoading = false
        })
      })
    },
    // 排序
    handleSortChange(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()
    }
  }
}
</script>
<style lang="scss" scoped>
  .reread-task{
    ::v-deep .search {
      padding: 0px !important;
    }
  }
</style>
