| | |
| | | width: 80px; |
| | | font-weight: bold; |
| | | color: #5b8cff; |
| | | font-size: 0.95rem; |
| | | font-size: 1.5rem; |
| | | font-weight: 600; |
| | | overflow: hidden; |
| | | text-overflow: ellipsis; |
| | | } |
| | | |
| | | .patient-name { |
| | | width: 100px; |
| | | font-size: 0.95rem; |
| | | font-size: 1.2rem; |
| | | font-weight: 600; |
| | | overflow: hidden; |
| | | text-overflow: ellipsis; |
| | | } |
| | | |
| | | .patient-check-type { |
| | | flex: 1; |
| | | font-size: 0.95rem; |
| | | font-size: 1.2rem; |
| | | font-weight: 600; |
| | | overflow: hidden; |
| | | text-overflow: ellipsis; |
| | | } |
| | | |
| | | .patient-status { |
| | | width: 70px; |
| | | font-size: 0.8rem; |
| | | font-size: 1.2rem; |
| | | font-weight: bold; |
| | | text-align: center; |
| | | padding: 3px 8px; |
| | |
| | | } |
| | | |
| | | .clinic-info { |
| | | font-size: 0.8rem; |
| | | font-size: 1.2rem; |
| | | } |
| | | |
| | | .panel { |
| | |
| | | } |
| | | |
| | | .panel-header { |
| | | font-size: 0.9rem; |
| | | font-size: 1.6rem; |
| | | font-weight: 700; |
| | | padding: 6px 10px; |
| | | } |
| | | |
| | |
| | | .patient-number, |
| | | .patient-name { |
| | | width: 60px; |
| | | font-size: 0.9rem; |
| | | font-size: 1.2rem; |
| | | } |
| | | |
| | | .patient-status { |
| | | width: 60px; |
| | | font-size: 0.7rem; |
| | | font-size: 1.2rem; |
| | | } |
| | | |
| | | .patient-bed { |
| | |
| | | |
| | | <body> |
| | | <div id="app"> |
| | | <div class="search-bar" style="display: none;"> |
| | | <div class="search-bar" > |
| | | <input class="search-input" type="text" placeholder="请输入房间号查询" id="searchRoomInput"> |
| | | <button class="search-btn" id="searchRoomBtn">查询</button> |
| | | </div> |
| | | |
| | | <div class="header" style="display: none;"> |
| | | <div class="clinic-title">心电图诊间叫号系统</div> |
| | | <div class="clinic-info"> |
| | | <div class="header" > |
| | | <div class="clinic-title" id="titleroomName">心电图诊间叫号系统</div> |
| | | <!-- <div class="clinic-info"> |
| | | <div class="room-name" id="roomName">诊间加载中...</div> |
| | | <div class="screen-type" id="screenType">模式:加载中...</div> |
| | | </div> |
| | | </div> --> |
| | | </div> |
| | | |
| | | <div class="main-content"> |
| | |
| | | roomId: 1, |
| | | timer: null, |
| | | speechSynthesis: window.speechSynthesis || null, |
| | | apiBaseUrl: 'http://10.0.2.193/admin-api' |
| | | // apiBaseUrl: 'http://localhost:48080/admin-api' |
| | | // apiBaseUrl: 'http://10.0.2.193/admin-api' |
| | | apiBaseUrl: 'http://localhost:48080/admin-api' |
| | | }; |
| | | |
| | | // 页面加载完成后初始化 |
| | |
| | | var response = JSON.parse(xhr.responseText); |
| | | appState.roomProfile = response.data || response; |
| | | updateRoomInfo(); |
| | | updateAnnouncement('已加载 ' + appState.roomProfile.roomName + ' 信息'); |
| | | updatetitleroomName(appState.roomProfile[0].roomName); |
| | | getList(); // 获取该房间的患者列表 |
| | | } catch (e) { |
| | | updateAnnouncement('解析响应数据失败'); |
| | |
| | | function updateAnnouncement(text) { |
| | | $('#announcementText').text(text); |
| | | } |
| | | function updatetitleroomName(text) { |
| | | $('#titleroomName').text(text); |
| | | } |
| | | |
| | | // 工具函数 |
| | | function nameDesensitize(patName) { |
| | |
| | | curSpeakPat: null, |
| | | timer: null, |
| | | speechSynthesis: window.speechSynthesis || null, |
| | | // apiBaseUrl: 'http://localhost:48080/admin-api' |
| | | apiBaseUrl: 'http://10.0.2.193/admin-api' |
| | | apiBaseUrl: 'http://localhost:48080/admin-api' |
| | | // apiBaseUrl: 'http://10.0.2.193/admin-api' |
| | | }; |
| | | |
| | | // 页面加载完成后初始化 |
| | |
| | | <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 {calculateAge, formatTimestamp, isCurrentDay} from "@/utils/dateUtil"; |
| | | import {QueueSequenceApi, QueueSequenceVO} from "@/api/ecg/queuesequence"; |
| | | import {formatDate} from "../../../utils/formatTime"; |
| | | import { defineComponent, PropType } from 'vue' |
| | | import { useCheckTypeStore } from '@/store/modules/checkType' |
| | | import { AppointmentApi, AppointmentVO } from '@/api/ecg/appointment' |
| | | import { formatTimeslot } from '@/utils/formatter' |
| | | import { calculateAge, formatTimestamp, isCurrentDay } from '@/utils/dateUtil' |
| | | import { QueueSequenceApi, QueueSequenceVO } from '@/api/ecg/queuesequence' |
| | | import { formatDate } from '../../../utils/formatTime' |
| | | import { cloneDeep } from 'lodash-es' |
| | | import {hiprint} from "vue-plugin-hiprint"; |
| | | import {calGender, getBookBeginTime} from "@/utils"; |
| | | import {getCheckTypeName} from "@/utils/checkTypeFormatter"; |
| | | import { hiprint } from 'vue-plugin-hiprint' |
| | | import { calGender, getBookBeginTime } from '@/utils' |
| | | import { getCheckTypeName } from '@/utils/checkTypeFormatter' |
| | | |
| | | defineComponent({ |
| | | name: 'CheckItemPanel' |
| | |
| | | |
| | | const emit = defineEmits(['event_appoint_confirm']) // 定义 success 事件,用于操作成功后的回调 |
| | | |
| | | const checkTypeStore = useCheckTypeStore(); |
| | | const checkTypeStore = useCheckTypeStore() |
| | | |
| | | const checkTypeTimeslotList = ref<QueueSequenceVO>() |
| | | const bookTimeSlotVip = ref<number>() |
| | |
| | | |
| | | const _confirmAppointment = async () => { |
| | | if (!isCurrentDay(props.appointment.bookDate)) { |
| | | ElMessageBox.confirm( |
| | | '非当天预约项,确定要今天检查吗?', |
| | | 'Warning', |
| | | { |
| | | ElMessageBox.confirm('非当天预约项,确定要今天检查吗?', 'Warning', { |
| | | confirmButtonText: '好的', |
| | | cancelButtonText: '不用', |
| | | type: 'warning', |
| | | } |
| | | ) |
| | | type: 'warning' |
| | | }) |
| | | .then(async () => { |
| | | const tempAppointment = cloneDeep(props.appointment) |
| | | if (undefined !== bookTimeSlotVip.value && null !== bookTimeSlotVip.value) { |
| | |
| | | }) |
| | | */ |
| | | }) |
| | | } else if (undefined !== bookTimeSlotVip.value && null !== bookTimeSlotVip.value && props.appointment.bookTimeslot !== bookTimeSlotVip.value) { |
| | | ElMessageBox.confirm( |
| | | '当天预约项,确定要走VIP吗?', |
| | | 'Warning', |
| | | { |
| | | } else if ( |
| | | undefined !== bookTimeSlotVip.value && |
| | | null !== bookTimeSlotVip.value && |
| | | props.appointment.bookTimeslot !== bookTimeSlotVip.value |
| | | ) { |
| | | ElMessageBox.confirm('当天预约项,确定要走VIP吗?', 'Warning', { |
| | | confirmButtonText: '好的', |
| | | cancelButtonText: '不用', |
| | | type: 'warning', |
| | | } |
| | | ) |
| | | type: 'warning' |
| | | }) |
| | | .then(async () => { |
| | | const tempAppointment = cloneDeep(props.appointment) |
| | | if (undefined !== bookTimeSlotVip.value && null !== bookTimeSlotVip.value) { |
| | |
| | | bookSeqNum.value = data |
| | | // 发送操作成功的事件 |
| | | emit('event_appoint_confirm') |
| | | _printNote() |
| | | // _printNote() |
| | | ElNotification({ |
| | | title: '温馨提示', |
| | | message: data, |
| | | type: 'info' |
| | | message: '排队成功', |
| | | type: 'success' |
| | | }) |
| | | } |
| | | } |
| | |
| | | hiprint.init({ |
| | | // host: 'http://192.168.2.100:17521', |
| | | token: '111111' |
| | | }); |
| | | }) |
| | | // 下列方法都是没有拖拽设计页面的, 相当于代码模式, 使用代码设计页面 |
| | | // 想要实现拖拽设计页面,请往下看 '自定义设计' |
| | | var hiprintTemplate = new hiprint.PrintTemplate(); // 可传参数 |
| | | var hiprintTemplate = new hiprint.PrintTemplate() // 可传参数 |
| | | //var panel = hiprintTemplate.addPrintPanel({ width: 100, height: 130, paperFooter: 340, paperHeader: 10 }); 导致走三页 |
| | | var panel = hiprintTemplate.addPrintPanel({ width: 140, height: 130, paperNumberDisabled:true}); |
| | | var panel = hiprintTemplate.addPrintPanel({ width: 140, height: 130, paperNumberDisabled: true }) |
| | | //文本 |
| | | const checkTypeName = getCheckTypeName(props.appointment.bookCheckType) |
| | | panel.addPrintText({ options: { width: 150, height: 15, top: 2, left: 10, title: checkTypeName, textAlign: 'center', fontSize: 15, fontFamily: '微软雅黑', fontWeight: '700', } }); |
| | | const patientBaisc = props.appointment.patName + " " + calGender(props.appointment.patGender) + " " + calculateAge(props.appointment.patBirthday) + "岁" |
| | | panel.addPrintText({ options: { width: 150, height: 15, top: 27, left: 10, title: patientBaisc, textAlign: 'center' , fontSize: 15, fontFamily: '微软雅黑', fontWeight: '700', } }); |
| | | const ward_bed = props.appointment.patWardDesc + "-" + props.appointment.patBedNo |
| | | panel.addPrintText({ options: { width: 150, height: 15, top: 52, left: 10, title: ward_bed, textAlign: 'center', fontSize: 15, fontFamily: '微软雅黑', fontWeight: '700', } }); |
| | | const bookTime = formatTimestamp(props.appointment.bookDate) + " " + getBookBeginTime(props.appointment.bookTimeslot) |
| | | panel.addPrintText({ options: { width: 150, height: 15, top: 77, left: 10, title: bookTime, textAlign: 'center', fontSize: 15, fontFamily: '微软雅黑', fontWeight: '700', } }); |
| | | panel.addPrintText({ |
| | | options: { |
| | | width: 150, |
| | | height: 15, |
| | | top: 2, |
| | | left: 10, |
| | | title: checkTypeName, |
| | | textAlign: 'center', |
| | | fontSize: 15, |
| | | fontFamily: '微软雅黑', |
| | | fontWeight: '700' |
| | | } |
| | | }) |
| | | const patientBaisc = |
| | | props.appointment.patName + |
| | | ' ' + |
| | | calGender(props.appointment.patGender) + |
| | | ' ' + |
| | | calculateAge(props.appointment.patBirthday) + |
| | | '岁' |
| | | panel.addPrintText({ |
| | | options: { |
| | | width: 150, |
| | | height: 15, |
| | | top: 27, |
| | | left: 10, |
| | | title: patientBaisc, |
| | | textAlign: 'center', |
| | | fontSize: 15, |
| | | fontFamily: '微软雅黑', |
| | | fontWeight: '700' |
| | | } |
| | | }) |
| | | const ward_bed = props.appointment.patWardDesc + '-' + props.appointment.patBedNo |
| | | panel.addPrintText({ |
| | | options: { |
| | | width: 150, |
| | | height: 15, |
| | | top: 52, |
| | | left: 10, |
| | | title: ward_bed, |
| | | textAlign: 'center', |
| | | fontSize: 15, |
| | | fontFamily: '微软雅黑', |
| | | fontWeight: '700' |
| | | } |
| | | }) |
| | | const bookTime = |
| | | formatTimestamp(props.appointment.bookDate) + |
| | | ' ' + |
| | | getBookBeginTime(props.appointment.bookTimeslot) |
| | | panel.addPrintText({ |
| | | options: { |
| | | width: 150, |
| | | height: 15, |
| | | top: 77, |
| | | left: 10, |
| | | title: bookTime, |
| | | textAlign: 'center', |
| | | fontSize: 15, |
| | | fontFamily: '微软雅黑', |
| | | fontWeight: '700' |
| | | } |
| | | }) |
| | | //panel.addPrintText({ options: { width: 150, height: 12, top: 58, left: 10, title: props.appointment.patId, textAlign: 'center', fontSize: 8 } }); |
| | | //panel.addPrintText({ options: { width: 150, height: 12, top: 72, left: 10, title: props.appointment.patMobile, textAlign: 'center', fontSize: 8, fontFamily: '微软雅黑', fontWeight: '700', } }); |
| | | |
| | | // 条码 就诊流水号 |
| | | panel.addPrintText({ options: { width: 150, height: 22, top: 107, left: 10, title: props.appointment.episodeId, textType: 'barcode' } }); |
| | | panel.addPrintText({ |
| | | options: { |
| | | width: 150, |
| | | height: 22, |
| | | top: 107, |
| | | left: 10, |
| | | title: props.appointment.episodeId, |
| | | textType: 'barcode' |
| | | } |
| | | }) |
| | | |
| | | // 右侧 Pane 输出 |
| | | const _bookSeqNum = bookSeqNum.value??props.appointment?.bookSeqNum |
| | | panel.addPrintText({ options: { width: 130, height: 20, top: 7, left: 170, title: ''+_bookSeqNum, textAlign: 'center', fontSize: 30, fontFamily: '微软雅黑', fontWeight: '1200' } }); |
| | | panel.addPrintText({ |
| | | options: { |
| | | width: 130, |
| | | height: 20, |
| | | top: 7, |
| | | left: 170, |
| | | title: '' + _bookSeqNum, |
| | | textAlign: 'center', |
| | | fontSize: 30, |
| | | fontFamily: '微软雅黑', |
| | | fontWeight: '1200' |
| | | } |
| | | }) |
| | | |
| | | // 注意事项 |
| | | const notes = checkTypeStore.getCheckTypeNotes(props.appointment.bookCheckType) |
| | | panel.addPrintLongText({ options: { width: 130, height: 80, top: 35, left: 170, lineHeight: 15, title: notes, textAlign: 'center', fontSize: 13, fontFamily: '微软雅黑', fontWeight: '700', } }); |
| | | panel.addPrintLongText({ |
| | | options: { |
| | | width: 130, |
| | | height: 80, |
| | | top: 35, |
| | | left: 170, |
| | | lineHeight: 15, |
| | | title: notes, |
| | | textAlign: 'center', |
| | | fontSize: 13, |
| | | fontFamily: '微软雅黑', |
| | | fontWeight: '700' |
| | | } |
| | | }) |
| | | |
| | | //打印 |
| | | if (undefined === printMode) |
| | | hiprintTemplate.print2([{}]); // 可以传 [定位参数] http://https://ccsimple.github.io/sv-print-docs/config/template.html#%E8%87%AA%E5%AE%9A%E4%B9%89%E8%AE%BE%E8%AE%A1%E4%BD%BF%E7%94%A8%E7%A4%BA%E4%BE%8B |
| | | else |
| | | hiprintTemplate.print([{}]); |
| | | hiprintTemplate.print2([{}]) // 可以传 [定位参数] http://https://ccsimple.github.io/sv-print-docs/config/template.html#%E8%87%AA%E5%AE%9A%E4%B9%89%E8%AE%BE%E8%AE%A1%E4%BD%BF%E7%94%A8%E7%A4%BA%E4%BE%8B |
| | | else hiprintTemplate.print([{}]) |
| | | } |
| | | |
| | | onMounted( async () => { |
| | |
| | | console.info( data ) |
| | | checkTypeTimeslotList.value = data |
| | | }) |
| | | |
| | | </script> |
| | | |
| | | <template> |
| | |
| | | </el-select> |
| | | {{bookSeqNum??appointment.bookSeqNum}} |
| | | <el-divider/> |
| | | <el-button @click="_confirmAppointment" :type="isCurrentDay(appointment.bookDate)?'primary':'warning'"><Icon icon="ep:list" class="mr-5px" /> 排队 </el-button> |
| | | <el-button |
| | | @click="_confirmAppointment" |
| | | :type="isCurrentDay(appointment.bookDate) ? 'primary' : 'warning'" |
| | | ><Icon icon="ep:list" class="mr-5px" /> 排队 |
| | | </el-button> |
| | | <el-button @click="_printNote(8)"><Icon icon="ep:printer" class="mr-5px" /> 打印号 </el-button> |
| | | </el-card> |
| | | </template> |