| | |
| | | message.info(data) |
| | | } |
| | | |
| | | /** |
| | | * 需求:右侧患者列表要把「就诊中 / 已过号 / 候诊中」用不同颜色区分,方便医生识别。 |
| | | * |
| | | * 颜色方案(左侧色条 + 浅色底 + 左侧竖线): |
| | | * · 就诊中(30) —— 蓝色(主色) :正在看的患者,最醒目 |
| | | * · 已过号(3/5) —— 红色 :需要关注(可能已错过叫号) |
| | | * · 候诊中(20/15) —— 绿色 :正常等待 |
| | | * · 其他 —— 灰色 :排队中/亲和/已领用/安装中等 |
| | | * |
| | | * 之所以不只靠 dict-tag 的文字:医生扫一眼列表时要能**快速定位**当前就诊者与过号者, |
| | | * 颜色比文字更快。 |
| | | */ |
| | | const rowClass = (item: any): string => { |
| | | const st = Number(item?.status) |
| | | if (st === 30) return 'row-onstage' // 就诊中 |
| | | if (st === 3 || st === 5) return 'row-passed' // 已过号(含"已过号-排队") |
| | | if (st === 20 || st === 15) return 'row-ready' // 候诊中 / 已召回 |
| | | return 'row-other' |
| | | } |
| | | </script> |
| | | |
| | | <template> |
| | | <div v-for="(item, index) in queue" :key="index"> |
| | | <span style="display:inline-block; width:30px;"> {{item.seqNum}} </span> |
| | | <span style="display:inline-block; width:40px;"> {{getCheckTypeSeqPrefix(item.bookCheckType)}}{{item.bookSeqNum}} </span> |
| | | <span style="display:inline-block; width:70px;"> {{item.patName}}{{item.passed === 0 ? "":"*"}} </span> |
| | | <dict-tag :type="DICT_TYPE.SYSTEM_USER_SEX" :value="item.patGender" /> |
| | | <!-- {{item.roomName}} {{item.bedNo}}--> |
| | | {{getCheckTypeName(item.bookCheckType)}} |
| | | <dict-tag :type="DICT_TYPE.ECG_QUEUE_STATUS" :value="item.status" /> |
| | | <el-button v-if="item.status === 5 || item.status === 7" @click="recall(item)"> 召回 </el-button> |
| | | <div class="queue-list"> |
| | | <div |
| | | v-for="(item, index) in queue" |
| | | :key="index" |
| | | class="queue-row" |
| | | :class="rowClass(item)" |
| | | > |
| | | <span class="col-seq"> {{item.seqNum}} </span> |
| | | <span class="col-bookseq"> {{getCheckTypeSeqPrefix(item.bookCheckType)}}{{item.bookSeqNum}} </span> |
| | | <span class="col-name"> {{item.patName}}{{item.passed === 0 ? "":"*"}} </span> |
| | | <dict-tag :type="DICT_TYPE.SYSTEM_USER_SEX" :value="item.patGender" /> |
| | | {{getCheckTypeName(item.bookCheckType)}} |
| | | <dict-tag :type="DICT_TYPE.ECG_QUEUE_STATUS" :value="item.status" /> |
| | | <el-button v-if="item.status === 5 || item.status === 7" size="small" @click="recall(item)"> 召回 </el-button> |
| | | </div> |
| | | </div> |
| | | </template> |
| | | |
| | | |
| | | <style scoped lang="scss"> |
| | | div { |
| | | /* 注意:原先写的是全局 `div { padding-left: 5px; padding-bottom: 5px; }`, |
| | | scoped 只加属性选择器、仍会命中本组件内**所有** div(含 dict-tag/el-button 内部), |
| | | 这里改为只作用于本列表的行元素。 */ |
| | | .queue-list { |
| | | padding-left: 5px; |
| | | padding-bottom: 5px; |
| | | } |
| | | |
| | | .queue-row { |
| | | padding: 3px 6px; |
| | | margin-bottom: 3px; |
| | | border-left: 4px solid transparent; |
| | | border-radius: 3px; |
| | | line-height: 22px; |
| | | } |
| | | |
| | | /* 就诊中:蓝色(主色)—— 当前正在处理的患者 */ |
| | | .row-onstage { |
| | | background-color: var(--el-color-primary-light-8); |
| | | border-left-color: var(--el-color-primary); |
| | | |
| | | .col-name { |
| | | font-weight: 700; |
| | | color: var(--el-color-primary); |
| | | } |
| | | } |
| | | |
| | | /* 已过号:红色 —— 需提醒医生注意 */ |
| | | .row-passed { |
| | | background-color: var(--el-color-danger-light-8); |
| | | border-left-color: var(--el-color-danger); |
| | | |
| | | .col-name { |
| | | font-weight: 600; |
| | | color: var(--el-color-danger); |
| | | } |
| | | } |
| | | |
| | | /* 候诊中 / 已召回:绿色 —— 正常等待 */ |
| | | .row-ready { |
| | | background-color: var(--el-color-success-light-8); |
| | | border-left-color: var(--el-color-success); |
| | | } |
| | | |
| | | /* 其他状态:灰色,弱化显示 */ |
| | | .row-other { |
| | | background-color: var(--el-fill-color-light); |
| | | border-left-color: var(--el-border-color); |
| | | color: var(--el-text-color-secondary); |
| | | } |
| | | |
| | | .col-seq, |
| | | .col-bookseq, |
| | | .col-name { |
| | | display: inline-block; |
| | | } |
| | | .col-seq { |
| | | width: 30px; |
| | | } |
| | | .col-bookseq { |
| | | width: 40px; |
| | | } |
| | | .col-name { |
| | | width: 70px; |
| | | } |
| | | </style> |