<template>
  <div v-loading="loading" class="study-wrapper">
    <h4 v-if="isReadingShowSubjectInfo" style="color: #ddd;padding: 5px 0px;margin: 0;text-align: center;background-color: #4c4c4c;">
      {{ subjectCode }}
    </h4>
    <h4 v-if="isReadingShowSubjectInfo" style="color: #ddd;padding: 5px 0px;margin: 0;text-align: center;background-color: #4c4c4c;margin-bottom: 5px;">
      {{ taskBlindName }}
    </h4>
    <div class="ps">
      <el-collapse v-model="activeNames">
        <el-collapse-item v-for="(study, index) in studyList" :key="`${study.StudyId}`" :name="`${study.StudyId}`">
          <template slot="title">
            <div v-if="study.IsCriticalSequence" class="dicom-desc">
              <!-- 关键序列 -->
              {{ $t('trials:reading:title:keySeries') }}
            </div>
            <div
              v-else
              class="dicom-desc"
              style="width: 150px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;"
            >
              <el-tooltip class="item" effect="dark" :content="`${study.StudyCode} ${study.Description?study.Description:''} ${study.Modalities} (${study.SeriesCount})`" placement="right">
                <div>
                  <span>{{ study.StudyCode }}  {{ study.Description }}</span>
                  <span> {{ study.Modalities }} ({{ study.SeriesCount }})</span>
                </div>
              </el-tooltip>

            </div>
          </template>
          <div class="series">
            <div
              v-for="(series, i) in study.SeriesList"
              :key="i"
              style="position:relative;margin:10px 0px;"
              series-type="current"
              @click="showSeriesImage(index,i,series)"
            >

              <div
                :class="{'series-active': i==seriesIndex && index === studyIndex}"
                class="series-wrapper"
              >
                <el-image
                  class="image-preview"
                  :src="series.previewImageUrl"
                  fit="fill"
                />
                <div class="image-desc">
                  <div class="flex-div">
                    <div>#{{ series.seriesNumber }} </div>
                    <div v-if="series.isDicom && series.prefetchInstanceCount<series.instanceCount">
                      <!-- 下载 -->
                      <el-tooltip v-if="!series.isLoading" class="item" effect="dark" :content="$t('trials:reading:button:download')" placement="bottom">
                        <i class="el-icon-video-play" style="font-size: 18px;margin-right: 5px;color: #ffeb3b;cursor: pointer;" @click.stop="loadSeries(series,index,i)" />
                      </el-tooltip>
                      <!-- 暂停 -->
                      <el-tooltip v-else class="item" effect="dark" :content="$t('trials:reading:button:pause')" placement="bottom">
                        <i class="el-icon-video-pause" style="font-size: 18px;margin-right: 5px;color: #ffeb3b;cursor: pointer;" @click.stop="stopLoadSeries(series,index,i)" />
                      </el-tooltip>
                    </div>
                    <el-tooltip v-else-if="series.prefetchInstanceCount === 0" class="item" effect="dark" :content="$t('trials:reading:button:download')" placement="bottom">
                      <i class="el-icon-video-play" style="font-size: 18px;margin-right: 5px;color: #ffeb3b;cursor: pointer;" @click.stop="loadSeries(series,index,i)" />
                    </el-tooltip>
                  </div>
                  <p v-show="series.description">
                    <el-tooltip class="item" effect="dark" :content="series.description" placement="right">
                      <div style="">{{ series.description }}</div>
                    </el-tooltip>
                  </p>

                  <p v-show="series.sliceThickness">
                    T: {{ series.sliceThickness }}
                  </p>
                  <p v-show="series.instanceCount">
                    {{ series.modality }}: {{ series.instanceCount }} image
                  </p>

                  <div class="flex-div">
                    <div v-if="measureData.findIndex(v=>v.SeriesId === series.seriesId) > -1">
                      <!-- 有标注 -->
                      <el-tooltip class="item" effect="dark" :content="$t('trials:reading:button:marked')" placement="right">
                        <i class="el-icon-star-on" style="font-size: 16px;color: #ff5722;" />
                      </el-tooltip>

                    </div>
                  </div>
                </div>
              </div>
              <div v-if="series.isDicom && series.prefetchInstanceCount>0 && series.prefetchInstanceCount<series.instanceCount" style="width: 100%;">
                <el-progress
                  :percentage="parseInt(((series.prefetchInstanceCount/series.instanceCount)*100).toFixed(2))"
                />
              </div>

            </div>
          </div>
        </el-collapse-item>
      </el-collapse>
    </div>
  </div>
</template>
<script>
import * as dicomParser from 'dicom-parser'
import * as cornerstone from 'cornerstone-core'
import * as cornerstoneWADOImageLoader from 'cornerstone-wado-image-loader'

import requestPoolManager from '@/utils/request-pool'
import DicomEvent from './DicomEvent'
import { mapGetters } from 'vuex'
import store from '@/store'
cornerstoneWADOImageLoader.external.dicomParser = dicomParser
cornerstoneWADOImageLoader.external.cornerstone = cornerstone
// const maximumSizeInBytes = 1024 * 1024 * 1024 // 1 GB
export default {
  name: 'StudyList',
  props: {
    trialId: {
      type: String,
      required: true
    },
    subjectVisitId: {
      type: String,
      required: true
    },
    visitTaskId: {
      type: String,
      required: true
    },
    isReading: {
      type: Number,
      default: 0
    },
    taskBlindName: {
      type: String,
      default: ''
    },
    isReadingShowSubjectInfo: {
      type: Boolean,
      required: true
    }
  },
  data() {
    return {
      studyList: [],
      cachedImages: [],
      studyIndex: null,
      seriesIndex: null,
      loading: false,
      measureData: [],
      isRender: false,
      subjectCode: '',
      activeNames: [],
      seriesArr: [],
      imageList: [],
      loopLoadStatus: 0 // -1暂停下载 0未下载完成  1下载完成
    }
  },
  computed: {
    ...mapGetters(['visitTaskList', 'currentTaskId', 'activeSeries'])
  },
  watch: {
    visitTaskList: {
      immediate: true,
      handler(val) {
        var idx = this.visitTaskList.findIndex(i => i.VisitTaskId === this.visitTaskId)
        if (idx === -1) return
        this.measureData = this.visitTaskList[idx].MeasureData
      }
    }
    // activeSeries: {
    //   immediate: true,
    //   handler(val) {
    //     console.log('activeSeries', val)
    //     this.studyIndex = val.studyIndex
    //     this.seriesIndex = val.seriesIndex
    //   }
    // }
  },
  mounted() {
    this.subjectCode = this.$router.currentRoute.query.subjectCode
    // DicomEvent.$on('getMeasureData', () => {
    //   var idx = this.visitTaskList.findIndex(i => i.VisitTaskId === this.visitTaskId)
    //   this.measureData = this.visitTaskList[idx].MeasureData
    // })

    // DicomEvent.$on('setReadingState', readingTaskState => {
    //   var idx = this.visitTaskList.findIndex(i => i.VisitTaskId === this.visitTaskId)
    //   if (idx > -1) {
    //     this.studyList = this.visitTaskList[idx].StudyList
    //   }
    // })

    cornerstone.events.addEventListener('cornerstoneimageloaded', this.cornerstoneImageLoaded)
  },
  beforeDestroy() {
    cornerstone.imageCache.purgeCache()
    // DicomEvent.$off('getMeasureData')
  },
  methods: {
    initStudyInfo() {
      const loading = this.$loading({ fullscreen: true })
      // 初始化待渲染序列
      this.getInitSeries().then((res) => {
        requestPoolManager.startTaskTimer()
        res.map((item) => {
          this.loadInitialImage(item)
        })
        var i = res.findIndex(s => s.isCurrentTask)
        if (i > -1) {
          var p = parseInt(new Date().getTime())// 非当前任务，符合自动下载的权重次之
          var idx = this.visitTaskList.findIndex(i => i.VisitTaskId === this.visitTaskId)
          if (idx > -1) {
            this.measureData = this.visitTaskList[idx].MeasureData
            this.studyList = this.visitTaskList[idx].StudyList

            this.studyList.map((study, studyIndex) => {
              study.SeriesList.map((series, seriesIndex) => {
                var sliceThickness = isNaN(parseInt(series.sliceThickness)) ? null : parseInt(series.sliceThickness)
                if (sliceThickness === 5 || series.instanceCount <= 100) {
                  series.imageIds.map(image => {
                    let priority = 0
                    if (series.seriesId === res[i].seriesId) {
                      priority = parseInt(new Date().getTime()) * 10
                    } else {
                      priority = --p
                    }
                    this.imageList.push({ imageId: image, seriesId: series.seriesId, studyIndex: studyIndex, seriesIndex: seriesIndex, visitTaskId: series.visitTaskId, priority })
                  })
                }
              })
            })
            this.loopLoad()
          }
        }
        DicomEvent.$emit('loadImageStacks', res)
        loading.close()
        this.isRender = true
      }).catch(() => {
        loading.close()
      })
    },
    // 获取初始化序列信息
    loadInitialImage(seriesInfo) {
      var p = parseInt(new Date().getTime())
      var imageId = seriesInfo.imageIds[seriesInfo.imageIdIndex]
      requestPoolManager.loadAndCacheImagePlus(imageId, seriesInfo.seriesId, p * 100).then(res => {
        this.imageLoaded(seriesInfo, res.data.string('x0020000e'))
      })
    },
    getStudyList() {
      if (!this.isRender) {
        var idx = this.visitTaskList.findIndex(i => i.VisitTaskId === this.visitTaskId)
        if (idx > -1 && this.visitTaskList[idx].StudyList && this.visitTaskList[idx].StudyList.length > 0) {
          this.measureData = this.visitTaskList[idx].MeasureData
          this.studyList = this.visitTaskList[idx].StudyList
          var sIdx = this.studyList.findIndex(s => s.IsDicom)
          if (sIdx > -1) {
            this.studyIndex = sIdx
            this.seriesIndex = 0
            this.activeNames = [`${this.studyList[sIdx].StudyId}`]

            this.loadImages(this.visitTaskList[idx])
          }
        }
        this.isRender = true
      }
    },

    async getInitSeries() {
      var seriesList = []
      var isReadingTaskViewInOrder = JSON.parse(this.$router.currentRoute.query.isReadingTaskViewInOrder)
      var idx = this.visitTaskList.findIndex(i => i.VisitTaskId === this.visitTaskId)
      this.studyList = this.visitTaskList[idx].StudyList
      if (this.visitTaskList[idx].IsBaseLineTask || !isReadingTaskViewInOrder) {
        // 基线
        const obj = this.getFirstMarkedSeries(this.visitTaskList[idx].MeasureData, [...this.visitTaskList[idx].StudyList])
        if (Object.keys(obj).length !== 0) {
          this.studyIndex = obj.studyIndex
          this.seriesIndex = obj.seriesIndex
          seriesList.push(obj.series)
          this.activeNames = [`${this.studyList[ this.studyIndex].StudyId}`]
          this.studyList[ obj.studyIndex].SeriesList[obj.seriesIndex].isFirstRender = true
        } else {
          // 初始化问题表单
          if (this.studyList.length > 0) {
            this.activeNames = [`${this.studyList[0].StudyId}`]
          }

          // DicomEvent.$emit('loadMeasurementList', { visitTaskId: this.visitTaskList[idx].VisitTaskId, taskBlindName: this.visitTaskList[idx].TaskBlindName })
        }
      } else {
        // 随访
        var bsIdx = null
        var criterionType = parseInt(localStorage.getItem('CriterionType'))
        if (criterionType === 10) {
          const i = this.visitTaskList.findIndex(i => i.IsCurrentTask)

          bsIdx = i - 1
        } else {
          bsIdx = this.visitTaskList.findIndex(i => i.IsBaseLineTask)
        }

        if (bsIdx > -1) {
          var trialId = this.$router.currentRoute.query.trialId
          await store.dispatch('reading/getMeasuredData', this.visitTaskList[bsIdx].VisitTaskId)
          await store.dispatch('reading/getStudyInfo', { trialId: trialId, subjectVisitId: this.visitTaskList[bsIdx].VisitId, visitTaskId: this.visitTaskList[bsIdx].VisitTaskId, taskBlindName: this.visitTaskList[bsIdx].TaskBlindName })

          const firstObj = this.getFirstMarkedSeries(this.visitTaskList[bsIdx].MeasureData, [...this.visitTaskList[bsIdx].StudyList])
          seriesList.push(firstObj.series)
          const secondObj = this.getSecondMarkedSeries(firstObj, { ...this.visitTaskList[idx] })
          this.studyIndex = secondObj.studyIndex
          this.seriesIndex = secondObj.seriesIndex
          seriesList.push(secondObj.series)
          this.studyList[ secondObj.studyIndex].SeriesList[secondObj.seriesIndex].isFirstRender = true
          this.studyIndex = secondObj.studyIndex
          this.seriesIndex = secondObj.seriesIndex

          this.activeNames = [`${this.studyList[secondObj.studyIndex].StudyId}`]
        } else {
          const sIdx = this.studyList.findIndex(s => s.IsDicom)
          const series = this.studyList[sIdx].SeriesList[0]
          series.imageIdIndex = Math.floor(series.imageIds.length / 2)
          seriesList.push(series)
          this.studyIndex = sIdx
          this.seriesIndex = 0

          this.activeNames = [`${this.studyList[sIdx].StudyId}`]
        }
      }

      return seriesList
    },
    getSecondMarkedSeries(baseObj, visitTaskInfo) {
      var obj = {}
      var studyList = visitTaskInfo.StudyList
      var measureDatas = visitTaskInfo.MeasureData
      if (baseObj.isMarked) {
        var i = measureDatas.findIndex(i => Object.keys(i.MeasureData).length > 0 && i.OrderMarkName === baseObj.measureData.OrderMarkName)
        if (i !== -1) {
          const sdIndx = studyList.findIndex(sd => sd.StudyId === measureDatas[i].StudyId)
          const seriesList = studyList[sdIndx].SeriesList
          const srIdx = seriesList.findIndex(sr => sr.seriesId === measureDatas[i].SeriesId)
          // const instanceList = seriesList[srIdx].imageIds
          const instanceList = seriesList[srIdx].instanceList
          const isIdx = instanceList.findIndex(is => is.includes(measureDatas[i].InstanceId))
          const series = seriesList[srIdx]
          series.imageIdIndex = isIdx

          obj.studyIndex = sdIndx
          obj.seriesIndex = srIdx
          obj.series = series
          obj.seriesId = series.seriesId
          return obj
        }
      }
      var seriesInfo = null
      var seriesList = studyList.map(s => s.SeriesList).flat()
      var similarArr = seriesList.map((i, index) => {
        return { similar: this.strSimilarity2Percent(i.description, baseObj.series.description), index }
      })
      similarArr = similarArr.sort((a, b) => {
        return b.similar - a.similar
      })
      var idx = similarArr[0] && similarArr[0].similar > 0.85 ? similarArr[0].index : -1
      if (idx > -1) {
        seriesInfo = seriesList[idx]
      }

      // const idx = seriesList.findIndex(series => series.description === baseSeries.description)
      // idx > -1 ? obj = seriesList[idx] : ''
      if (!seriesInfo) {
        // 描述不一致,则筛选层厚一致
        const idx = seriesList.findIndex(series => series.sliceThickness === baseObj.series.sliceThickness)
        idx > -1 ? seriesInfo = seriesList[idx] : ''
      }
      if (!seriesInfo) {
        // 层厚不一致,则筛选图像数量一致
        const idx = seriesList.findIndex(series => series.instanceCount === baseObj.series.instanceCount)
        idx > -1 ? seriesInfo = seriesList[idx] : ''
      }
      if (!seriesInfo) {
        // 都不符合要求， 判断是否存在层厚为5的序列，否则显示第一个检查的第一个序列
        const idx = seriesList.findIndex(series => series.isDicom && parseInt(series.instanceCount) === 5)
        idx > -1 ? seriesInfo = seriesList[idx] : seriesInfo = seriesList[0]
      }
      if (seriesInfo) {
        seriesInfo.imageIdIndex = Math.floor(seriesInfo.imageIds.length * (baseObj.series.imageIdIndex / baseObj.series.instanceCount))
        obj.studyIndex = seriesInfo.studyIndex
        obj.seriesIndex = seriesInfo.seriesIndex
        obj.series = seriesInfo
        obj.seriesId = seriesInfo.seriesId
      }
      return obj
    },
    findSerialNumberClosest(arr, n) {
      var absArr = []
      for (let i = 0; i < arr.length; i++) {
        const m = n - arr[i].seriesNumber
        absArr.push({ index: i, n: Math.abs(m) })
      }
      const num = Math.min.apply(null, absArr.map(item => item.n))
      var mIdx = absArr.findIndex(item => item.n === num)
      return mIdx
    },
    getFirstMarkedSeries(measureDatas, studyList) {
      var obj = {}
      var mIdx = measureDatas.findIndex(m => Object.keys(m.MeasureData).length > 0)
      if (mIdx !== -1) {
        // 有标记时，显示带标记影像所在序列
        const sdIndx = studyList.findIndex(sd => sd.StudyId === measureDatas[mIdx].StudyId && sd.IsDicom)
        if (sdIndx > -1) {
          const seriesList = studyList[sdIndx].SeriesList
          const srIdx = seriesList.findIndex(sr => sr.seriesId === measureDatas[mIdx].SeriesId)
          // const instanceList = seriesList[srIdx].imageIds
          const instanceList = seriesList[srIdx].instanceList
          const isIdx = instanceList.findIndex(is => is.includes(measureDatas[mIdx].InstanceId))
          const series = seriesList[srIdx]
          series.imageIdIndex = isIdx

          obj.studyIndex = sdIndx
          obj.seriesIndex = srIdx
          obj.series = series
          obj.seriesId = series.seriesId
          obj.isMarked = true
          obj.measureData = measureDatas[mIdx]
        }
      } else {
        var seriesObj = null
        for (let i = 0; i < studyList.length; i++) {
          const seriesIdx = studyList[i].SeriesList.findIndex(s => s.sliceThickness && parseInt(s.sliceThickness) === 5)
          if (seriesIdx > -1) {
            seriesObj = { studyIndex: i, seriesIdx, series: studyList[i].SeriesList[seriesIdx] }
            break
          }
        }
        if (seriesObj) {
          obj.studyIndex = seriesObj.studyIndex
          obj.seriesIndex = seriesObj.seriesIdx
          seriesObj.series.imageIdIndex = Math.floor(seriesObj.series.imageIds.length / 2)
          obj.series = seriesObj.series
          obj.seriesId = seriesObj.series.seriesId
          obj.isMarked = false
        } else {
          const sIdx = studyList.findIndex(s => s.IsDicom)
          if (sIdx > -1) {
          // 判断是否存在层厚为5的序列，否则显示第一个检查的第一个序列
            const series = studyList[sIdx].SeriesList[0]
            var imageIdIndex = Math.floor(series.imageIds.length / 2)
            obj.studyIndex = sIdx
            obj.seriesIndex = 0
            obj.series = series
            obj.series.imageIdIndex = imageIdIndex
            obj.seriesId = series.seriesId
            obj.isMarked = false
          }
        }
      }

      return obj
    },
    strSimilarity2Number(s, t) {
      var n = s.length; var m = t.length; var d = []
      var i, j, s_i, t_j, cost
      if (n === 0) return m
      if (m === 0) return n
      for (i = 0; i <= n; i++) {
        d[i] = []
        d[i][0] = i
      }
      for (j = 0; j <= m; j++) {
        d[0][j] = j
      }
      for (i = 1; i <= n; i++) {
        s_i = s.charAt(i - 1)
        for (j = 1; j <= m; j++) {
          t_j = t.charAt(j - 1)
          if (s_i === t_j) {
            cost = 0
          } else {
            cost = 1
          }
          d[i][j] = this.Minimum(d[i - 1][j] + 1, d[i][j - 1] + 1, d[i - 1][j - 1] + cost)
        }
      }
      return d[n][m]
    },
    // 两个字符串的相似程度，并返回相似度百分比
    strSimilarity2Percent(s, t) {
      var l = s.length > t.length ? s.length : t.length
      var d = this.strSimilarity2Number(s, t)
      return Number((1 - d / l).toFixed(4))
    },
    Minimum(a, b, c) {
      return a < b ? (a < c ? a : c) : (b < c ? b : c)
    },
    showSeriesImage(studyIndex, seriesIndex, series) {
      if (series.isDicom) {
        this.studyIndex = studyIndex
        this.seriesIndex = seriesIndex
        this.studyList[studyIndex].SeriesList[seriesIndex].measureData = this.measureData
        var dicomStatck = this.studyList[studyIndex].SeriesList[seriesIndex]
        this.$emit('loadImageStack', dicomStatck)
        if (!series.loadStatus) {
          this.loopLoadStatus = -1
          series.isLoading = true
          var p = parseInt(new Date().getTime())
          series.imageIds.map((imageId, i) => {
            var priority = ''
            if (i === 0) {
              priority = parseInt(new Date().getTime()) * 10
            } else {
              priority = --p
            }
            this.imageList.push({ imageId: imageId, seriesId: series.seriesId, studyIndex: studyIndex, seriesIndex: seriesIndex, visitTaskId: series.visitTaskId, priority })
          })
          if (this.imageList.length > 0) {
            this.loopLoadStatus = 0
            this.loopLoad()
          }
        }

        DicomEvent.$emit('loadMeasurementList', { visitTaskId: this.visitTaskId, taskBlindName: this.taskBlindName })
      } else {
        // 非Dicom预览
        this.$emit('previewNoneDicoms', { visitTaskId: this.visitTaskId })
      }

      store.dispatch('reading/setActiveSeries', series)
    },
    setSeriesActive(obj) {
      var idx = this.visitTaskList.findIndex(i => i.VisitTaskId === this.visitTaskId)
      if (idx === -1) return
      this.studyList = this.visitTaskList[idx].StudyList
      this.studyIndex = obj.studyIndex
      this.seriesIndex = obj.seriesIndex
      var activeNames = `${this.studyList[obj.studyIndex].StudyId}`
      if (this.activeNames.includes(activeNames)) return
      this.activeNames.push(activeNames)
      this.loadImages(this.visitTaskList[idx])
    },
    selectSeries(obj) {
      var seriseList = this.studyList.map(s => s.SeriesList).flat()
      var i = seriseList.findIndex(i => i.seriesId === obj.seriesId && i.studyId === obj.studyId)
      if (i === -1) return
      var idx = i + obj.offset
      if (idx < 0) {
        idx = 0
      } else if (idx >= seriseList.length) {
        idx = seriseList.length - 1
      }
      if (seriseList[idx].seriesIndex === this.seriesIndex && seriseList[idx].studyIndex === this.studyIndex) return
      this.showSeriesImage(seriseList[idx].studyIndex, seriseList[idx].seriesIndex, seriseList[idx])
      this.handleActiveSeries(seriseList[idx])
    },
    handleActiveSeries(series) {
      this.studyIndex = series.studyIndex
      this.seriesIndex = series.seriesIndex
      var idx = this.visitTaskList.findIndex(i => i.VisitTaskId === series.visitTaskId)
      if (idx === -1) return
      this.studyList = this.visitTaskList[idx].StudyList
      var activeNames = `${this.studyList[series.studyIndex].StudyId}`
      if (this.activeNames.includes(activeNames)) return
      this.activeNames.push(activeNames)
      this.loadImages(this.visitTaskList[idx])
      store.dispatch('reading/setActiveSeries', series)
    },
    loadImages(taskInfo) {
      var priority = taskInfo.IsCurrentTask ? parseInt(new Date().getTime()) : 999

      this.studyList.map((study, studyIndex) => {
        study.SeriesList.map((series, seriesIndex) => {
          if (!series.loadStatus) {
            var sliceThickness = isNaN(parseInt(series.sliceThickness)) ? null : parseInt(series.sliceThickness)
            if (series.isBeMark || sliceThickness === 5 || series.instanceCount <= 100) {
              series.imageIds.map(image => {
                priority = priority - 1
                this.imageList.push({ imageId: image, seriesId: series.seriesId, studyIndex: studyIndex, seriesIndex: seriesIndex, visitTaskId: series.visitTaskId, priority })
              })
            }
          }
        })
      })
      this.loopLoad()
    },
    loadImages2(taskInfo) {
      var priority = parseInt(new Date().getTime())
      // 当前任务只自动下载层厚为5mm  或者影像数量小于 100张
      if (taskInfo.IsCurrentTask) {
        this.studyList.map((study, studyIndex) => {
          study.SeriesList.map((series, seriesIndex) => {
            var sliceThickness = isNaN(parseInt(series.sliceThickness)) ? null : parseInt(series.sliceThickness)
            if (sliceThickness === 5 || series.instanceCount <= 100) {
              series.imageIds.map(image => {
                priority = priority - 1
                this.imageList.push({ imageId: image, seriesId: series.seriesId, studyIndex: studyIndex, seriesIndex: seriesIndex, visitTaskId: series.visitTaskId, priority })
              })
            }
          })
        })
        this.loopLoad()
      } else {
        // 非当前任务只自动下载关键序列
        var idx = this.studyList.findIndex(study => study.IsCriticalSequence)
        if (idx === -1) return

        this.studyList[idx].SeriesList.forEach((series, seriesIndex) => {
          if (!series.loadStatus) {
            series.imageIds.map(image => {
              priority--
              this.imageList.push({ imageId: image, seriesId: series.seriesId, studyIndex: idx, seriesIndex: seriesIndex, visitTaskId: series.visitTaskId, priority })
            })
          }
        })
        this.loopLoad()
      }
    },

    loopLoad() {
      if (this.imageList.length > 0) {
        requestPoolManager.startTaskTimer()
        this.imageList.map(image => {
          requestPoolManager.loadAndCacheImagePlus(image.imageId, image.seriesId, image.priority).then(res => {
            this.imageLoaded(image, res.data.string('x0020000e'))
          })
        })

        this.imageList = []
      }
    },
    // 启动下载序列
    loadSeries(series, studyIndex, seriesIndex) {
      console.log('loadSeries')
      this.loopLoadStatus = -1
      this.$set(this.studyList[studyIndex].SeriesList[seriesIndex], 'isLoading', true)
      const priority = parseInt(new Date().getTime())
      series.imageIds.map(image => {
        if (series.imageloadedArr.indexOf(image) === -1) {
          this.imageList.push({ imageId: image, seriesId: series.seriesId, studyIndex: studyIndex, seriesIndex: seriesIndex, visitTaskId: series.visitTaskId, priority })
        }
      })
      if (this.imageList.length > 0) {
        this.loopLoadStatus = 0
        this.loopLoad()
      }
    },
    // 暂停下载
    stopLoadSeries(series, studyIndex, seriesIndex) {
      console.log('stopLoadSeries')
      requestPoolManager.removeTask(series.seriesId)
      this.$set(this.studyList[studyIndex].SeriesList[seriesIndex], 'isLoading', false)
    },
    async imageLoaded(image, seriesUid) {
      await store.dispatch('reading/updateStudyList', { visitTaskId: image.visitTaskId, imageId: image.imageId, seriesUid })
    },
    // instance下载成功回调
    async cornerstoneImageLoaded(e) {
      await store.dispatch('reading/updateStudyList', { visitTaskId: this.visitTaskId, imageId: e.detail.image.imageId, seriesUid: e.detail.image.data.string('x0020000e') })
      var idx = this.visitTaskList.findIndex(i => i.VisitTaskId === this.visitTaskId)
      this.studyList = this.visitTaskList[idx].StudyList

      const uri = e.detail.image.sharedCacheKey
      const index = this.cachedImages.findIndex(item => item.uri === uri)
      if (index === -1) {
        this.cachedImages.push({ uri: uri, timestamp: new Date().getTime() })
      } else {
        this.cachedImages[index].timestamp = new Date().getTime()
      }
      var imageId = e.detail.image.imageId
      var seriesUid = e.detail.image.data.string('x0020000e')
      var studyIndex = -1
      var seriesIndex = -1
      for (let i = 0; i < this.studyList.length; ++i) {
        for (let j = 0; j < this.studyList[i].SeriesList.length; ++j) {
          if (this.studyList[i].SeriesList[j].seriesUid === seriesUid) {
            studyIndex = i
            seriesIndex = j
            break
          }
        }
        if (studyIndex > 0) break
      }
      if (seriesIndex < 0) return

      const imageIdIndex = this.studyList[studyIndex].SeriesList[seriesIndex].imageIds.indexOf(imageId)
      if (imageIdIndex < 0) return
      if (this.studyList[studyIndex].SeriesList[seriesIndex].imageloadedArr.indexOf(imageId) < 0) {
        if (this.studyList[studyIndex].SeriesList[seriesIndex].prefetchInstanceCount >= this.studyList[studyIndex].SeriesList[seriesIndex].instanceCount) {
          // 设置当前序列状态为已下载完成
          this.studyList[studyIndex].SeriesList[seriesIndex].loadStatus = true
        }
      }
    }
  }
}
</script>
<style lang="scss" scoped>
.study-wrapper{
  >>>.el-progress-bar__inner{
    transition: width 0s ease;
  }
  width:100%;
  height: 100%;
  overflow-y: auto;
  .dicom-desc{
    font-weight: bold;
    font-size: 13px;
    text-align: left;
    color: #d0d0d0;
    padding: 2px;
  }

  .ps {
    overflow-anchor: none;
    touch-action: auto;
  }
  .series-active {
    background-color: #607d8b!important;
    border: 1px solid #607d8b!important;
  }
  >>>.el-progress__text{
    color: #ccc;
    font-size: 12px;
  }
  .series{
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    .series-wrapper {
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      align-items: center;
      width: 100%;
      height: 95px;
      // padding: 1px 2px 1px 8px;
      // margin: 10px 0px;
      border-radius: 2px;
      border: 1px solid #404040;
      background-color: #3a3a3a;
      .el-progress__text{
        display: none;
      }
      .el-progress-bar{
        padding-right:0px;
      }

      .image-preview {
        height: 60px;
        width: 60px;
        border: 2px solid #252525;
        cursor: pointer;
      }
      .image-desc {
        vertical-align: top;
        p{
          width: 100px;
          white-space: nowrap;
          overflow: hidden;
          text-overflow: ellipsis;
          font-size: 12px;
          color: #ddd;
          margin: 0px;
          line-height: 1.5;
          div{
            width: 100px;
          }
        }
      }
      .flex-div{
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        padding: 1px;
        width: 100px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        font-size: 12px;
        color: #ddd;
        padding: 1px;
        margin: 0px;
      }
    }
  }
  .el-collapse{
    border: none;
    >>>.el-collapse-item{
      background-color: #000!important;
      color: #ddd;

    }
    >>>.el-collapse-item__content{
      padding-bottom:10px;
      background-color: #000!important;
    }
    >>>.el-collapse-item__header{
      background-color: #000!important;
      color: #ddd;
      border-bottom-color:#5a5a5a;
      padding-left: 5px;
      height: 40px;
      line-height: 20px;
    }
  }
}
</style>
