治疗室屏幕web
查看 | 历史 | 提交 | 提交对比
jazz
2024-01-09 c1e10385c164520dceec34576ed506b28bad1e71
提交 | 用户 | age
459990 1 <template>
J 2   <div class="guest_info_box">
3     <div v-if="roomInfo && roomInfo.roomNo" class="room_title">{{ roomInfo.roomNo }}</div>
4     <div class="room_content">
5       <div class="tip">诊疗安排</div>
6       <!-- <div class="name">{{ occupyInfoView.userName }}</div> appellationName -->
7       <div v-show="isShowAppellationName" class="flex flex-center">
8         <div class="flex flex-ver">
9           <div class="name">{{ occupyInfoView.appellationName }}</div>
10           <div class="name_icon" @click="tapAppellationHandle">
11             <img class="img" src="static/imgs/eye.png">
12           </div>
13         </div>
14       </div>
15       <div v-show="!isShowAppellationName" class="flex flex-center">
16         <div class="flex flex-ver">
17           <div class="name">
18             <el-popover
19               placement="top"
20               width="400"
21               popper-class="top_tx"
22               trigger="click"
23               :popper-options="{ removeOnDestroy: true }"
24             >
25               <div>{{ occupyInfoView.userName }}</div>
26               <div slot="reference" class="tx ell">{{ occupyInfoView.userName }}</div>
27             </el-popover>
28           </div>
29           <div class="name_icon" @click="tapAppellationHandle">
30             <img class="img" src="static/imgs/eye.png">
31           </div>
32         </div>
33       </div>
34       <div v-if="occupyInfoView.ciq" class="ciq">({{ occupyInfoView.ciq }})</div>
35       <div v-if="occupyInfoView.startTime" class="time">安排治疗时间：{{ occupyInfoView.startTime }} 开始</div>
36     </div>
12a2f1 37     <div v-show="occupyInfoView" class="room_left_btn_box flex flex-ver" style="margin-top: 105px;">
J 38       <div v-show="occupyInfoView.treatRoomStatus == 0" class="room_left_btn_box__item flex flex-1 flex-center b-green btn_ani" @click="setStatus('敷麻中', 4, occupyInfoView)">开始敷麻</div>
39       <div v-show="occupyInfoView.treatRoomStatus == 0" class="room_left_btn_box__item flex flex-1 flex-center green btn_ani" style="margin-right: 0;" @click="setStatus('使用中', 1, occupyInfoView)">开始治疗</div>
40       <div v-show="occupyInfoView.treatRoomStatus == 4" class="room_left_btn_box__item flex flex-center green btn_ani" @click="setStatus('使用中', 1, occupyInfoView)">开始治疗</div>
41       <div v-show="occupyInfoView.treatRoomStatus == 1" class="room_left_btn_box__item flex-1 flex flex-center yellow btn_ani" @click="setStatus('客人休息', 2, occupyInfoView)">客人休息</div>
42       <div v-show="occupyInfoView.treatRoomStatus == 1" class="room_left_btn_box__item flex-1 flex flex-center gray btn_ani" style="margin-right: 0;" @click="setStatus('打扫中', 3, occupyInfoView)">通知打扫</div>
43       <div v-show="occupyInfoView.treatRoomStatus == 2" class="room_left_btn_box__item flex flex-center green btn_ani" @click="setStatus('打扫中', 3, occupyInfoView)">通知打扫</div>
44       <div v-show="occupyInfoView.treatRoomStatus == 3" class="room_left_btn_box__item flex flex-center green btn_ani" @click="setStatus('空闲', 0, occupyInfoView)">结束打扫</div>
459990 45     </div>
583e10 46     <!-- MIC通知卸麻 -->
J 47     <XioRoomOffNarcosisNotice ref="XioRoomOffNarcosisNotice" @confirm="offNarcosisNoticeConfirm" />
459990 48   </div>
J 49 </template>
50
51 <script>
583e10 52 // 通知卸麻
J 53 import XioRoomOffNarcosisNotice from '@/components/xio_room_off_narcosis_notice'
459990 54 export default {
c1e103 55   name: 'XioRoomGuestInfoBox',
583e10 56   components: {
J 57     XioRoomOffNarcosisNotice
58   },
459990 59   props: {
J 60     roomInfo: {
61       type: Object,
62       default: () => {
63         return {}
64       }
65     },
66     occupyInfoView: {
67       type: [Object, Array],
68       default: () => {
69         return {}
70       }
583e10 71     },
J 72     offNarcosisIds: {
73       type: Array,
74       default: () => {
75         return []
76       }
459990 77     }
J 78   },
79   data() {
80     return {
81       isShowAppellationName: true
82     }
83   },
84   methods: {
85     noop() {
86       return
87     },
583e10 88     // 设置已通知卸麻id数组
J 89     setLocalStorageOffNarcosisIds() {
90       localStorage.setItem('offNarcosisIds', JSON.stringify(this.offNarcosisIds))
91     },
92     // 卸麻通知确认
93     offNarcosisNoticeConfirm() {
94       if (this.occupyInfoView) {
95         if (this.offNarcosisIds && this.offNarcosisIds.length) {
96           var flag = this.offNarcosisIds.find((o) => { return o === this.occupyInfoView.userId })
97           if (!flag) {
98             this.offNarcosisIds.push(this.occupyInfoView.userId)
99           }
100         } else if (this.offNarcosisIds) {
101           this.offNarcosisIds.push(this.occupyInfoView.userId)
102         }
103         this.setLocalStorageOffNarcosisIds()
104       }
105     },
106     // 显示通知卸麻弹窗
107     showOffNarcosisNotice() {
108       // 打开弹窗
109       this.$refs['XioRoomOffNarcosisNotice'].showDialog()
110       this.$refs['XioRoomOffNarcosisNotice'].dataInit(this.occupyInfoView)
111     },
459990 112     // 点击显示隐藏称谓
J 113     tapAppellationHandle() {
114       this.isShowAppellationName = !this.isShowAppellationName
115     },
583e10 116     setStatus(tx, status, item) {
J 117       this.$emit('setStatus', { tx, status, item })
459990 118     },
J 119     // 确认
120     confirm() {
121       this.isShow = false
122       this.$emit('confirm', { })
123     },
124     // 显示弹窗
125     showDialog() {
126       this.isShow = true
127     },
128     // 关闭弹窗
129     hideDialog() {
130       this.isShow = false
131       this.$emit('confirm', { })
132     }
133   }
134 }
135 </script>
136
137 <style scoped>
138 .guest_info_box {
139   width: 100%;
140   height: 100%;
141   box-sizing: border-box;
142   padding-top: 39px;
583e10 143   position: relative;
459990 144 }
J 145 .guest_info_box .room_title {
146   line-height: 50px;
147   color: rgba(255,255,255,1);
148   font-size: 36px;
149   text-align: center;
150   font-family: PingFangSC-medium;
151   padding: 10px 0;
152   background-color: rgba(34,123,235,1);
153   width: 400px;
154   margin: 0 auto 0 auto;
155 }
156 .guest_info_box .room_main_tip {
157   line-height: 168px;
158   font-size: 120px;
159   color: rgba(46,77,124,1);
160   text-align: center;
161   font-family: PingFangSC-medium;
162   margin-top: 107px;
163   /* font-weight: bold; */
164 }
165 .guest_info_box .room_main_tip.gray {
166   color: rgba(154,154,154,1);
167 }
168 .guest_info_box .btn_box {
169   margin-top: 130px;
170 }
171 .guest_info_box .btn_box__item {
172   width: 250px;
173   height: 120px;
174   border-radius: 10px;
175   box-shadow: 0px 2px 6px 0px rgba(206,206,206,1);
176   margin-right: 70px;
177   cursor: pointer;
178 }
179 .guest_info_box .btn_box__item:last-child {
180   margin-right: 0;
181 }
182 .guest_info_box .btn_box__item.white {
183   background-color: rgba(255,255,255,1);
184 }
185 .guest_info_box .btn_box__item.blue {
186   background-color: rgba(46,77,124,1);
187 }
188 .guest_info_box .btn_box__item.yellow {
189   background-color: rgba(255,199,115,1);
190 }
191 .guest_info_box .btn_box__item.gray {
192   background-color: rgba(206,206,206,1);
193 }
194 .guest_info_box .btn_box__item .icon {
195   width: 60px;
196   height: 60px;
197   display: block;
198   margin-right: 17px;
199 }
200 .guest_info_box .btn_box__item .icon .img {
201   width: 100%;
202   height: 100%;
203 }
204 .guest_info_box .btn_box__item .tx {
205   line-height: 37px;
206   color: rgba(51,51,51,1);
207   font-size: 26px;
208   text-align: center;
209   font-family: PingFangSC-medium;
210 }
211 .guest_info_box .btn_box__item .tx.white {
212   color: rgba(255,255,255,1);
213 }
214 .guest_info_box .room_left_btn_box {
215   padding: 0 23px;
216   margin-top: 163px;
217 }
218 .guest_info_box .room_left_btn_box__item {
219   width: 500px;
220   height: 150px;
221   line-height: 73px;
222   border-radius: 10px;
223   font-size: 50px;
224   text-align: center;
225   margin: auto;
226 }
227 .guest_info_box .room_left_btn_box__item.flex-1 {
228   width: auto;
229   height: 150px;
230   line-height: 58px;
231   border-radius: 10px;
232   font-size: 40px;
233   text-align: center;
234   font-family: Microsoft Yahei;
235   margin-right: 20px;
236   font-weight: bold;
237 }
238 /* .guest_info_box .room_left_btn_box__item:last-child {
239   margin-right: 0;
240 } */
241 .guest_info_box .room_left_btn_box__item.yellow {
242   color: rgba(255,255,255,1);
243   background-color: rgba(233,157,66,1);
244 }
245 .guest_info_box .room_left_btn_box__item.gray {
246   background-color: rgba(206,206,206,1);
247   color: rgba(79,79,79,1);
248 }
249 .guest_info_box .room_left_btn_box__item.green {
250   background-color: rgba(47,174,206,1);
251   color: rgba(255,255,255,1);
252 }
253 .guest_info_box .room_left_btn_box__item.b-green {
254   background-color: rgba(79,167,114,1);
255   color: rgba(255,255,255,1);
256 }
257 .guest_info_box .room_content {
258   margin-top: 30px;
259 }
260 .guest_info_box .room_content .tip {
261   line-height: 33px;
262   color: rgba(79,79,79,1);
263   font-size: 24px;
264   text-align: center;
265   font-family: PingFangSC-medium;
266 }
267 .guest_info_box .room_content .name {
268   line-height: 168px;
269   color: rgba(51,51,51,1);
270   font-size: 120px;
271   text-align: center;
272   font-family: PingFangSC-medium;
273   margin-top: 13px;
274 }
275 .guest_info_box .room_content .name .tx {
276   max-width: 666px;
277   margin: auto;
278   text-align: center;
279 }
280 .guest_info_box .room_content .name_icon {
281   width: 40px;
282   height: 40px;
283   display: block;
284   margin-top: 13px;
285   padding: 20px;
286 }
287 .guest_info_box .room_content .name_icon .img {
288   width: 100%;
289   height: 100%;
290 }
291 .guest_info_box .room_content .ciq {
292   line-height: 42px;
293   color: rgba(51,51,51,1);
294   font-size: 30px;
295   text-align: center;
296   font-family: PingFangSC-regular;
297   margin-top: -5px;
298 }
299 .guest_info_box .room_content .time {
300   line-height: 42px;
301   color: rgba(0,0,0,1);
302   font-size: 30px;
303   text-align: center;
304   font-family: PingFangSC-medium;
305   font-weight: bold;
306   margin-top: 21px;
307 }
308 </style>