<template>
  <window-size>
    <van-cell title="选择日期区间" :value="date" @click="showDateRange = true" />
    <van-calendar v-model:show="showDateRange" :min-date="minDate" type="range" @confirm="onConfirm" />
    <div v-show="examIndex.length > 0">
      <div style="height: 5px"></div>
      <van-tag type="success" size="large" round plain>已发布报告</van-tag>
      <div style="height: 5px"></div>
      <div :style="scrollStyle">
        <div v-for="item in examIndex" :key="item.ordr_ID">
          <van-cell
            :title="item.aply_CTNT"
            :label="item.ordr_CREATE_DATE"
            is-link
            center
            :to="'/checkExamDetail/' + item.ordr_ID"
          >
          </van-cell>
          <div style="height: 5px"></div>
        </div>
      </div>
    </div>
    <van-empty :image="empty" description="您当前没有报告项目" v-show="examIndex.length === 0" />
  </window-size>
</template>

<script>
import store from '../../../store'
import empty from '../../../assets/empty.png'
import { useRouter } from 'vue-router'
import { computed, onMounted, ref } from 'vue'
import { checkExamIndex } from '../../../api/check-exam'
import { formatDate, getOneMonthOffset } from '../../../utils/date'
export default {
  name: 'CheckExamIndex',
  setup() {
    const router = useRouter()
    const patientId = router.currentRoute.value.params.patientId
    const scrollStyle = {
      height: store.state.windowSize.h - 125 + 'px',
      overflowY: 'auto',
    }
    const date = ref('')
    const showDateRange = ref(false)
    const examIndex = computed(() => {
      return store.state.examIndexArray
    })

    const onConfirm = (values) => {
      showDateRange.value = false
      const start = formatDate(values[0])
      const end = formatDate(values[1])
      store.commit('SET_EXAMDATERANGE', [start, end])
      date.value = `${start} - ${end}`
      const param = {
        patientId,
        start,
        end,
      }
      checkExamIndex(param).then((res) => {
        store.commit('SET_EXAMINDEXARRAY', res)
      })
    }

    onMounted(() => {
      const range = store.state.examDateRange
      if (range.length === 0) {
        const temp = getOneMonthOffset()
        range[0] = temp.start
        range[1] = temp.end
        store.commit('SET_EXAMDATERANGE', range)
      }
      date.value = range[0] + ' - ' + range[1]
      if (examIndex.value.length === 0) {
        const param = {
          patientId,
          start: range[0],
          end: range[1],
        }
        checkExamIndex(param).then((res) => {
          store.commit('SET_EXAMINDEXARRAY', res)
        })
      }
      showDateRange.value = false
    })
    return {
      scrollStyle,
      empty,
      minDate: new Date(2010, 0, 1),
      date,
      examIndex,
      onConfirm,
      showDateRange,
    }
  },
}
</script>