手动预约

eight

2024-11-20 fb4c89727ccee7c2d60c75ab9e765c8739b27d28

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
<script setup lang="ts">
import {defineComponent, PropType} from "vue";
import {useCheckTypeStore} from "@/store/modules/checkType";
import {AppointmentApi, AppointmentVO} from "@/api/ecg/appointment";
import {formatTimeslot} from "@/utils/formatter";
import {isCurrentDay} from "@/utils/dateUtil";
import {QueueSequenceApi, QueueSequenceVO} from "@/api/ecg/queuesequence";
import {formatDate} from "../../../utils/formatTime";
import { cloneDeep } from 'lodash-es'
 
defineComponent({
  name: 'CheckItemPanel'
})
 
const  props = defineProps({
  appointment: {
    type: Object as PropType<AppointmentVO>,
    required: true
  }
})
 
const checkTypeStore = useCheckTypeStore();
 
const checkTypeTimeslotList = ref<QueueSequenceVO>()
const bookTimeSlotVip = ref<number>()
 
const _confirmAppointment = async () => {
  if (!isCurrentDay(props.appointment.bookDate)) {
    ElMessageBox.confirm(
        '非当天预约项，确定要今天检查吗？',
        'Warning',
        {
          confirmButtonText: '好的',
          cancelButtonText: '不用',
          type: 'warning',
        }
    )
        .then(async () => {
          const tempAppointment = cloneDeep(props.appointment)
          if( undefined !== bookTimeSlotVip.value && null !== bookTimeSlotVip.value ) {
            tempAppointment.bookTimeslot = bookTimeSlotVip.value
          }
          const data = await AppointmentApi.confirmAppointmentVip(tempAppointment)
          ElNotification({
            title: '温馨提示',
            message: data,
            type: 'info'
          })
        })
        .catch(() => {
          ElNotification({
            title: '温馨提示',
            message: '确认失败',
            type: 'warning'
          })
        })
  } else {
    const data = await AppointmentApi.confirmAppointment(props.appointment)
    ElNotification({
      title: '温馨提示',
      message: data,
      type: 'warning'
    })
  }
}
 
onMounted( async () => {
  const data = await QueueSequenceApi.getTimeslotByCheckType(props.appointment.bookCheckType)
  console.info( data )
  checkTypeTimeslotList.value = data
})
 
</script>
 
<template>
  <el-card style="width: 200px" shadow="hover" >
    <template #header>{{checkTypeStore.getCheckTypeName(appointment.bookCheckType)}}</template>
    <div>{{formatDate(appointment.bookDate, 'YYYY-MM-DD')}}</div>
    <div>{{formatTimeslot(appointment.bookTimeslot)}}</div>
 
    <el-select v-if="!isCurrentDay(appointment.bookDate)" v-model="bookTimeSlotVip" placeholder="请选择预约时间段">
      <el-option
          v-for="item in checkTypeTimeslotList"
          :key="item.id"
          :label="formatTimeslot(item.timeSlot)"
          :value="item.timeSlot"
          :disabled="item.queueVipNo === item.queueVipFull"
      />
    </el-select>
 
    <el-divider/>
    <el-button :type="isCurrentDay(appointment.bookDate)?'primary':'warning'" @click="_confirmAppointment"><Icon icon="ep:refresh" class="mr-5px" /> 排队 </el-button>
  </el-card>
</template>
 
<style scoped lang="scss">
.el-card ::v-deep {
  .el-card__header {
    background-color: var(--el-color-primary-light-3);
    padding: 2px;
    text-align: center;
  }
  .el-card__body {
    //background-color: var(--el-color-primary-light-3);
    padding: 4px;
    text-align: center;
  }
}
</style>