<template>
  <window-size>
    <van-cell title="检查" is-link :to="'/bookableExaminations/jc/' + patientId"></van-cell>
    <van-cell title="检验" is-link :to="'/bookableExaminations/jy/' + patientId"></van-cell>
    <van-tag type="primary" plain style="margin: 12px 0 0 8px">热门项目</van-tag>
    <van-cell v-for="item in bookableItems" :title="item.name" is-link @click="beforeOrderItem(item)"></van-cell>
  </window-size>
</template>

<script setup>
import { useRouter } from 'vue-router'
import {showConfirmDialog} from "vant";
import {getDirectBookableItems,applyDirectBookableItem} from "@/api/bookable";
import {onMounted, ref} from "vue";

const router = useRouter()
const patientId = router.currentRoute.value.params.patientId

const bookableItems = ref([])

const beforeOrderItem = (bookableItem) => {
  showConfirmDialog({
    title: '温馨提示',
    message: `<span>是否确认自助下单<span style="color: orangered">${bookableItem.name}</span>？</span>`,
    confirmButtonText: '确认',
    cancelButtonText: '取消',
    allowHtml: true
  }).then(() => {
    bookableItem.patientId = patientId
    applyDirectBookableItem(bookableItem).then(() => {
      router.push(`/unPaidList/${patientId}`)
    })
  }).catch(() => {
  })
}

onMounted(() => {
  getDirectBookableItems().then(res => {
    bookableItems.value = res
  })
})

</script>