long
2024-02-01 c6d3157eb616116c84d35e221ed9c57ef8da0ad6
提交 | 用户 | age
3ac5f2 1 <!--room-detail.vue-->
J 2 <template>
878885 3   <div class="page flex flex-col">
6da3c1 4     <div class="page_header flex flex-ver">
J 5       <div class="left flex flex-ver" @click="back">
878885 6         <div class="page_logo_1">
J 7           <img class="img" src="static/imgs/logo_1.png">
8         </div>
9         <div class="page_logo_2">
10           <img class="img" src="static/imgs/logo_2.png">
11         </div>
3ac5f2 12       </div>
J 13       <div class="right flex-1 flex flex-jcfe flex-ver">
1d1095 14         <el-button type="primary" icon="el-icon-refresh" class="reset_btn flex flex-center" size="small" style="width: 100px;" @click="resetPage">刷新</el-button>
aeb317 15         <div class="reset_btn flex flex-center" @click="resetStatus">重置房间状态</div>
3ac5f2 16         <div class="page_date">
bb2b08 17           <div class="page_week">{{ timeObj.week }}</div>
J 18           <div class="page_day">{{ timeObj.date }}</div>
3ac5f2 19         </div>
bb2b08 20         <div class="page_time">{{ timeObj.timeMin }}</div>
J 21         <!-- <div class="page_time">{{ timeObj.time }}</div> -->
3ac5f2 22       </div>
J 23     </div>
459990 24     <div class="page_header_placeholer" />
bb2b08 25     <!-- 未有安排 -->
583e10 26     <div v-if="(!occupyInfoViewArr || !occupyInfoViewArr.length) && (!assignTreatListView || !assignTreatListView.length)" class="page_container flex flex-1">
0e11d7 27       <div class="main flex-1 flex flex-col">
6da3c1 28         <div v-if="roomInfo && roomInfo.roomNo" class="room_title">{{ roomInfo.roomNo }}</div>
0e11d7 29         <div class="flex-1" />
L 30         <div v-if="roomInfo" class="room_main_tip" style="line-height: 186px;font-size: 140px;margin-top: 0">-{{ statusTx[roomInfo.status] }}-</div>
31         <div class="flex-1" />
bb2b08 32         <div class="btn_box flex flex-center">
J 33           <div class="flex flex-ver">
6da3c1 34             <div class="btn_box__item flex flex-center white" data-tx="空闲" data-status="0" @click="statusChg">
bb2b08 35               <div class="flex flex-ver">
878885 36                 <div class="icon">
J 37                   <img class="img" src="static/imgs/free.png">
38                 </div>
bb2b08 39                 <div class="tx">空闲</div>
J 40               </div>
41             </div>
6da3c1 42             <div class="btn_box__item flex flex-center blue" data-tx="使用中" data-status="1" @click="statusChg">
bb2b08 43               <div class="flex flex-ver">
878885 44                 <div class="icon">
J 45                   <img class="img" src="static/imgs/using.png">
46                 </div>
bb2b08 47                 <div class="tx white">使用中</div>
J 48               </div>
49             </div>
6da3c1 50             <div class="btn_box__item flex flex-center yellow" data-tx="客人休息" data-status="2" @click="statusChg">
bb2b08 51               <div class="flex flex-ver">
878885 52                 <div class="icon">
J 53                   <img class="img" src="static/imgs/rest.png">
54                 </div>
bb2b08 55                 <div class="tx">客人休息</div>
J 56               </div>
57             </div>
6da3c1 58             <div class="btn_box__item flex flex-center gray" data-tx="通知打扫" data-status="3" @click="statusChg">
bb2b08 59               <div class="flex flex-ver">
878885 60                 <div class="icon">
J 61                   <img class="img" src="static/imgs/clear.png">
62                 </div>
bb2b08 63                 <div class="tx">通知打扫</div>
J 64               </div>
65             </div>
66           </div>
67         </div>
68       </div>
69     </div>
6da3c1 70     <!-- 没有客人和有安排 -->
583e10 71     <div v-if="(!occupyInfoViewArr || !occupyInfoViewArr.length) && (assignTreatListView && assignTreatListView.length)" class="page_container flex flex-1">
bb2b08 72       <div class="main flex-1">
6da3c1 73         <div v-if="roomInfo && roomInfo.roomNo" class="room_title">{{ roomInfo.roomNo }}</div>
J 74         <div v-if="roomInfo" class="room_main_tip">-{{ statusTx[roomInfo.status] }}-</div>
1d1095 75         <div v-show="roomInfo && roomInfo.status >= 1" class="room_left_btn_box flex flex-ver">
J 76           <div v-show="roomInfo.status == 1" class="room_left_btn_box__item flex-1 flex flex-center yellow btn_ani" @click="setStatus('客人休息', 2)">客人休息</div>
77           <div v-show="roomInfo.status == 1" class="room_left_btn_box__item flex-1 flex flex-center gray btn_ani" @click="setStatus('打扫中', 3)">通知打扫</div>
78           <div v-show="roomInfo.status == 2" class="room_left_btn_box__item flex flex-center green btn_ani" @click="setStatus('打扫中', 3)">通知打扫</div>
79           <div v-show="roomInfo.status == 3" class="room_left_btn_box__item flex flex-center green btn_ani" @click="setStatus('空闲', 0)">结束打扫</div>
bb2b08 80         </div>
J 81       </div>
82       <div class="right">
459990 83         <div class="right_block">
J 84           <XioRoomGuestBox ref="XioRoomGuestBox" :assign-treat-list-view-com="assignTreatListView" @selectCustomer="selectCustomer" />
bb2b08 85         </div>
J 86       </div>
87     </div>
459990 88     <!-- 客人和有安排 over-width -->
583e10 89     <div v-if="occupyInfoViewArr && occupyInfoViewArr.length" class="page_container flex flex-1" :class="[occupyInfoViewArr && occupyInfoViewArr.length>1?'over-width':'']">
J 90       <div class="flex flex-1">
91         <div v-for="(item,index) in occupyInfoViewArr" :key="index" class="main flex-1">
12a2f1 92           <div v-if="occupyInfoViewArr.length>1 && item.treatRoomStatus === 0" class="cancel_icon_block" @click="cancelCustomerItem(item)">
583e10 93             <img class="img" src="static/imgs/cancel.png">
J 94           </div>
95           <XioRoomGuestInfoBox :ref="`XioRoomGuestInfoBox_${item.id}`" :room-info="roomInfo" :occupy-info-view="item" :off-narcosis-ids="offNarcosisIds" @setStatus="setComStatus" />
96         </div>
bb2b08 97       </div>
J 98       <div class="right flex flex-col">
583e10 99         <div v-for="(item,index) in occupyInfoViewArr" :key="index" class="flex-1 right_room_info">
c1e103 100           <XioRoomInfoBlock ref="XioRoomInfoBlock" :occupy-info-view="item" :occupy-info-view-arr="occupyInfoViewArr" />
bb2b08 101         </div>
583e10 102         <div v-if="occupyInfoViewArr.length<=1" class="flex flex-col" style="border-radius: 10px;">
459990 103           <XioRoomGuestBox ref="XioRoomGuestBox" :assign-treat-list-view-com="assignTreatListView" @selectCustomer="selectCustomer" />
bb2b08 104         </div>
J 105       </div>
106     </div>
aeb317 107     <!-- 选择客人弹窗 -->
J 108     <XioCustomerSelect ref="XioCustomerSelect" @cancel="selectCustomerCancel" @submit="selectCustomerSubmit" />
109     <!-- 更改房间状态窗 -->
110     <XioRoomStatusChg ref="XioRoomStatusChg" @changeStatus="changeStatus" />
1fa546 111     <!-- MIC通知卸麻 -->
583e10 112     <!-- <XioRoomOffNarcosisNotice ref="XioRoomOffNarcosisNotice" @confirm="offNarcosisNoticeConfirm" /> -->
3ac5f2 113   </div>
J 114 </template>
115
116 <script>
6da3c1 117 // 空闲 0
J 118 // 使用中 1
119 // 客人休息 2
120 // 待打扫/通知打扫 3
3ac5f2 121 // import Login from '../utils/jun_login.js'
459990 122 // 房间客人信息
J 123 import XioRoomGuestInfoBox from '@/components/xio_room_guest_info_box'
124 // 房间负责员工信息
125 import XioRoomInfoBlock from '@/components/xio_room_info_block'
126 // 房间客户预约列表信息
127 import XioRoomGuestBox from '@/components/xio_room_guest_box'
aeb317 128 // 选择客人弹窗
bb2b08 129 import XioCustomerSelect from '@/components/xio_customer_select'
aeb317 130 // 更改房间状态窗
J 131 import XioRoomStatusChg from '@/components/xio_room_status_chg'
1fa546 132 // 通知卸麻
583e10 133 // import XioRoomOffNarcosisNotice from '@/components/xio_room_off_narcosis_notice'
6da3c1 134 import Req from '../../utils/jun_httpInstall' // http 请求
1d1095 135 // import xioFn from './utils/xio_fn.js'
6da3c1 136 var isUseDefault = false // 是否已使用默认客人
878885 137 var isUseDefaultChg = 0// 已使用默认客人后房间是否有改变状态
3ac5f2 138 export default {
J 139   name: 'RoomDetail',
bb2b08 140   components: {
459990 141     XioRoomGuestInfoBox,
J 142     XioRoomInfoBlock,
143     XioRoomGuestBox,
aeb317 144     XioCustomerSelect,
583e10 145     XioRoomStatusChg
J 146     // XioRoomOffNarcosisNotice
bb2b08 147   },
3ac5f2 148   inject: ['noop'],
J 149   data() {
150     return {
6da3c1 151       id: this.$route.query.id || '',
J 152       roomInfo: {},
153       occupyInfo: '', // 当前占用人的信息
154       assignTreatList: [],
1d1095 155       statusTx: ['空闲', '使用中', '客人休息', '打扫中', '敷麻中'],
34cb2b 156       timeObj: {}, // week:星期,date:年月日,timeMin:时分,time:时分秒,timeStamp:时间戳
1fa546 157       curTreatId: '',
583e10 158       curTreatIds: '', // 已选中的治疗记录id数组
c6d315 159       offNarcosisIds: [], // 是否已通知卸麻的用户id数组
459990 160       // isShowAppellationName: true // 是否显示称谓
c6d315 161
L 162       // 60秒切换状态锁 ↓↓↓↓↓↓↓↓↓↓
163       setStatusLock: false, // 更新状态锁
164       setStatusLockDuration: 60000, // 更新状态锁时间
165       setStatusLockTimer: null
166       // 60秒切换状态锁 ↑↑↑↑↑↑↑↑↑↑
3ac5f2 167     }
J 168   },
169   computed: {
583e10 170     // 当前已选择用户的数组数据
459990 171     occupyInfoViewArr() {
12a2f1 172       if (this.occupyInfo && this.occupyInfo.length) {
J 173         return this.occupyInfoViewArrIdsHandleArr()
459990 174       } else {
12a2f1 175         if (this.curTreatIds && this.curTreatIds.length) {
J 176           return this.getCurTreatArr(this.curTreatIds)
459990 177         } else {
J 178           if ((!isUseDefault || (isUseDefault && isUseDefaultChg === 0)) && this.assignTreatList && this.assignTreatList.length) {
179             isUseDefault = true
180             this.occupyInfoViewArrIdsHandle(this.assignTreatList[0])
181             return [this.assignTreatList[0]]
182           } else {
183             return ''
184           }
185         }
186       }
187     },
583e10 188     // 当前已选择用户的数据(单个)(暂无用)
6da3c1 189     occupyInfoView() {
583e10 190       // console.log('00000000000000000000000', this.occupyInfo, isUseDefault, isUseDefaultChg)
34cb2b 191       // 有当前选中的,根据需求修改增加选中不更改状态,由空闲开始
J 192       if (this.curTreatId) {
193         return this.gatCurTreatInfo()
6da3c1 194       } else {
34cb2b 195         // 有占用
J 196         if (this.occupyInfo) {
197           return this.occupyInfo
198         // 没有占用
6da3c1 199         } else {
34cb2b 200           // 还没使用默认客人值或者已使用默认客人值还没改变状态(适配轮询)
J 201           if ((!isUseDefault || (isUseDefault && isUseDefaultChg === 0)) && this.assignTreatList && this.assignTreatList.length) {
c4b6a2 202             // isUseDefault = true
34cb2b 203             return this.assignTreatList[0]
J 204           // 已使用过默认客人值
205           } else {
206             return ''
207           }
6da3c1 208         }
34cb2b 209       }
J 210     },
583e10 211     // 该治疗室用户列表
34cb2b 212     assignTreatListView() {
J 213       if (this.assignTreatList && this.assignTreatList.length) {
214         this.assignTreatList.forEach((o) => {
583e10 215           if (this.occupyInfoViewArr && this.occupyInfoViewArr.length) {
J 216             this.occupyInfoViewArr.forEach((_o) => {
217               if (_o.id === o.id) {
218                 o.act = true
219               }
220             })
34cb2b 221           }
J 222         })
223         return this.assignTreatList
224       } else {
225         return []
6da3c1 226       }
J 227     }
3ac5f2 228   },
bf4dca 229   activated() {
3ac5f2 230     console.log('roomDetail mounted')
34cb2b 231     // 记录当前的治疗ID
583e10 232     // var curTreatId = localStorage.getItem('curTreatId')
J 233     // 记录当前的治疗记录ID数组
459990 234     var curTreatIds = localStorage.getItem('curTreatIds')
J 235     // 卸麻相关
df74f0 236     var localOffNarcosisIds = localStorage.getItem('offNarcosisIds')
J 237     // 获取是否已通知卸麻数组
238     if (localOffNarcosisIds) {
583e10 239       this.offNarcosisIds = JSON.parse(localOffNarcosisIds)
df74f0 240     } else {
583e10 241       this.offNarcosisIds = []
df74f0 242       this.setLocalStorageOffNarcosisIds()
2471a9 243     }
583e10 244     // 治疗记录ID数组
459990 245     if (curTreatIds) {
J 246       try {
247         this.curTreatIds = JSON.parse(curTreatIds)
248       } catch (error) {
249         this.curTreatIds = ''
250       }
1fa546 251     }
583e10 252     // this.curTreatId = curTreatId || ''
J 253     // 治疗室id
bf4dca 254     this.id = this.$route.query.id || ''
3ac5f2 255     this.init()
J 256   },
bf4dca 257   mounted() {},
3ac5f2 258   destroyed() {
J 259
260   },
261   methods: {
262     init() {
bf4dca 263       // 进入页面先初始化常量标识
J 264       isUseDefault = false
265       isUseDefaultChg = 0
6da3c1 266       // 计时
bb2b08 267       this.countGetTime(this, 'timeObj', 'detail')
6da3c1 268       // 轮询getData,8秒一次
878885 269       this.pollingAjaxFn(this, 'getData', 'detail', 8000)
J 270       // this.getData()
459990 271     },
583e10 272     // 初始默认选择的id数组处理
459990 273     occupyInfoViewArrIdsHandle(item) {
J 274       if (!this.curTreatIds) {
275         this.curTreatIds = []
276       }
277       this.curTreatIds.push(item.id)
278       this.setLocalCurTreatIds()
12a2f1 279     },
J 280     // 初始默认选择的id数组处理
281     occupyInfoViewArrIdsHandleArr() {
282       if (!this.curTreatIds) {
283         this.curTreatIds = []
284       }
285       if (this.occupyInfo && this.occupyInfo.length === 1) {
286         var res = []
287         res.push(this.occupyInfo[0])
288         if (this.curTreatIds && this.curTreatIds.length) {
289           this.curTreatIds = this.curTreatIds.filter((o) => { return o !== this.occupyInfo[0].id })
290           if (this.assignTreatList && this.assignTreatList.length && this.curTreatIds && this.curTreatIds.length) {
291             var curTreatItem = this.assignTreatList.find((o) => { return o.id === this.curTreatIds[0] })
292             if (curTreatItem) {
293               res.push(curTreatItem)
294             }
295           }
296         }
297         this.setLocalCurTreatIds()
298         return res
299       } else if (this.occupyInfo && this.occupyInfo.length > 1) {
300         this.occupyInfo.forEach((o) => {
301           this.curTreatIds.push(o.id)
302         })
303         return this.occupyInfo
304       }
1fa546 305     },
df74f0 306     // 设置已通知卸麻id数组
J 307     setLocalStorageOffNarcosisIds() {
583e10 308       localStorage.setItem('offNarcosisIds', JSON.stringify(this.offNarcosisIds))
df74f0 309     },
1fa546 310     // 卸麻通知确认
583e10 311     // offNarcosisNoticeConfirm() {
J 312     //   if (this.occupyInfoView) {
313     //     if (offNarcosisIds && offNarcosisIds.length) {
314     //       var flag = offNarcosisIds.find((o) => { return o === this.occupyInfoView.userId })
315     //       if (!flag) {
316     //         offNarcosisIds.push(this.occupyInfoView.userId)
317     //       }
318     //     } else if (offNarcosisIds) {
319     //       offNarcosisIds.push(this.occupyInfoView.userId)
320     //     }
321     //     this.setLocalStorageOffNarcosisIds()
322     //   }
323     // },
324     // // 显示通知卸麻弹窗
325     // showOffNarcosisNotice() {
326     //   // 打开弹窗
327     //   this.$refs['XioRoomOffNarcosisNotice'].showDialog()
328     // },
329     // 显示通知卸麻弹窗(多个)
330     showOffNarcosisNoticeMulti(id) {
331       // 打开弹窗,动态的ref对象获取
332       // eslint-disable-next-line no-eval
333       var ref = eval('this.$refs.XioRoomGuestInfoBox_' + id)[0]
334       ref.showOffNarcosisNotice()
1fa546 335     },
J 336     // 点击显示隐藏称谓
459990 337     // tapAppellationHandle() {
J 338     //   this.isShowAppellationName = !this.isShowAppellationName
339     // },
340     // 获取当前治疗信息(数组)
341     getCurTreatArr(ids) {
342       var arr = []
343       if (this.assignTreatList && this.assignTreatList.length) {
344         this.assignTreatList.forEach((o) => {
345           if (ids && ids.length) {
346             ids.forEach((_o) => {
347               if (_o === o.id) {
348                 arr.push(o)
349               }
350             })
351           }
352         })
c4b6a2 353         // 基本不会出现这种情况,但是以防万一,若本地缓存id存在,但对不上列表则缓存第一条数据id
J 354         if (!arr.length) {
355           arr.push(this.assignTreatList[0])
356           this.curTreatIds = []
357           this.curTreatIds.push(this.assignTreatList[0].id)
358           this.setLocalCurTreatIds()
359         }
459990 360       }
J 361       return arr
34cb2b 362     },
J 363     // 获取当前治疗信息
364     gatCurTreatInfo() {
365       if (this.assignTreatList && this.assignTreatList.length) {
1d1095 366         return this.assignTreatList.find((o) => { return o.id === this.curTreatId })
34cb2b 367       }
1d1095 368     },
J 369     // 刷新浏览器页面
370     resetPage() {
371       window.location.reload()
6da3c1 372     },
J 373     // 获取房间详情
374     getData() {
375       var params = {}
376       // 房间id
377       if (this.id) {
378         params.shopRoomId = this.id
379       }
380       Req.http.post({
878885 381         url: 'guide/treat/screen/room/info',
6da3c1 382         data: params,
J 383         udData: { noLoading: true },
384         header: { 'Content-Type': 'application/json' },
385         mockData: {
386           code: 100,
387           msg: '',
878885 388           data: {
J 389             roomInfo: {
390               roomNo: 'xx',
1d1095 391               status: 0 // 0空闲 1使用 2休息 3打扫 4 敷麻中
878885 392             },
459990 393             assignTreatList: [
J 394               {
395                 id: 'a111',
396                 startTime: '2023-12-08 00:00:00',
397                 userName: '黄嘉荣',
398                 gender: 1,
583e10 399                 hempStatus: 2,
c1e103 400                 treatRoomStatus: 0,
459990 401                 ciq: '123',
J 402                 adviserName: 'a君',
403                 aDoctorName: 'b君',
404                 aNurseName: 'c君',
405                 projectName: 'xxxxXXxxx',
406                 userId: '111'
407               },
408               {
409                 id: 'a222',
410                 startTime: '2023-12-08 00:15:00',
411                 userName: '李德华',
412                 gender: 1,
583e10 413                 hempStatus: 2,
c1e103 414                 treatRoomStatus: 0,
459990 415                 ciq: '456',
J 416                 adviserName: 'd君',
417                 aDoctorName: 'e君',
418                 aNurseName: 'f君',
419                 projectName: 'xxxxXXxxx',
420                 userId: '222'
421               },
422               {
423                 id: 'a333',
424                 startTime: '2023-12-08 00:20:00',
425                 userName: '猛学友',
426                 gender: 2,
583e10 427                 hempStatus: 2,
c1e103 428                 treatRoomStatus: 0,
459990 429                 ciq: '789',
J 430                 adviserName: 'g君',
431                 aDoctorName: 'h君',
432                 aNurseName: 'i君',
433                 projectName: 'xxxxXXxxx',
434                 userId: '333'
435               }
436             ],
878885 437             occupyInfo: null
J 438           }
6da3c1 439         }
J 440       }).then((res) => {
441         if (res && res.data) {
cf3e3e 442           if (res.data.assignTreatList && res.data.assignTreatList.length) {
J 443             res.data.assignTreatList.forEach((o) => {
583e10 444               // 治疗时间处理
cf3e3e 445               var st = (o.startTime).split(' ')[1].split(':')
J 446               o.startTime = `${st[0]}:${st[1]}`
583e10 447               // 称谓处理
1fa546 448               o.appellationName = o.userName[0] + `${o.gender ? ['女士', '先生', '女士'][o.gender] : '女士'}`
cf3e3e 449             })
J 450           }
12a2f1 451           if (res.data.occupyInfo && res.data.occupyInfo.length) {
J 452             res.data.occupyInfo.forEach((o) => {
453               // 治疗时间处理
454               var st = (o.startTime).split(' ')[1].split(':')
455               o.startTime = `${st[0]}:${st[1]}`
456               // 称谓处理
457               o.appellationName = o.userName[0] + `${o.gender ? ['女士', '先生', '女士'][o.gender] : '女士'}`
458             })
40660a 459           }
12a2f1 460           res.data.occupyInfo && res.data.occupyInfo.length && (isUseDefaultChg = 1)
J 461           res.data.occupyInfo && res.data.occupyInfo.length && (isUseDefault = 1)
6da3c1 462           for (const key in res.data) {
J 463             this[key] = res.data[key]
464           }
465         }
466         // console.log('999999999999999999999999999', res)
583e10 467         // 卸麻弹窗逻辑
df74f0 468         var offNarcosisTimer = null
J 469         offNarcosisTimer = setTimeout(() => {
583e10 470           console.log('================================>判断卸麻弹窗', this.occupyInfoViewArr, 'offNarcosisIds:', this.offNarcosisIds)
J 471           if (this.occupyInfoViewArr && this.occupyInfoViewArr.length && this.offNarcosisIds) {
472             this.occupyInfoViewArr.forEach((o) => {
473               // 判断改用户是否弹出过卸麻弹窗
474               var flag
475               flag = this.offNarcosisIds.find((_o) => { return _o === o.userId })
476               // 状态2且没有弹出过弹窗
477               if (o.hempStatus === 2 && !flag) {
478                 // 弹出对应id弹窗
479                 this.showOffNarcosisNoticeMulti(o.id)
480               }
481             })
df74f0 482           }
J 483           clearTimeout(offNarcosisTimer)
484           offNarcosisTimer = null
485         }, 500)
6da3c1 486       })
aeb317 487     },
J 488     // 返回
489     back() {
34cb2b 490       // 重置默认已使用客人的参数
cf3e3e 491       isUseDefault = false
878885 492       isUseDefaultChg = 0
6da3c1 493       // 关闭计时
aeb317 494       this.stopCountGetTime('detail')
6da3c1 495       // 关闭轮询
aeb317 496       this.stopPollingAjaxFn('detail')
6da3c1 497       // 返回
bf4dca 498       // console.log('111111111', this.$route.meta.isPush)
J 499       if (this.$route && this.$route.meta && this.$route.meta.isPush) {
500         this.$router.go(-1)
501       } else {
502         this.$router.push({
503           path: `/`
504         })
505       }
6da3c1 506     },
cf3e3e 507     // 未有安排直接状态变更
6da3c1 508     statusChg(e) {
J 509       var { tx, status } = e.currentTarget.dataset
583e10 510       // var { occupyInfoView, roomInfo } = this
J 511       console.log('==========================>没有安排时没有客人直接变更状态', tx, status)
6da3c1 512       // if (roomInfo && status * 1 == roomInfo.status) {
J 513       //   return
514       // }
583e10 515       this.changeStatusFn({}, status, () => {
6da3c1 516         this.getData()
J 517       })
518     },
583e10 519     // 没有客人的按流程设置房间状态
6da3c1 520     setStatus(tx, status) {
583e10 521       // var { occupyInfoView, roomInfo } = this
J 522       console.log('============================>有安排没有客人设置房间状态', tx, status)
523       this.changeStatusFn({}, status, () => {
6da3c1 524         // 刷新详情
J 525         this.getData()
526       })
527     },
583e10 528     // 按流程设置房间状态(组件)
459990 529     setComStatus(opt) {
583e10 530       // var { occupyInfoView, roomInfo } = this
J 531       console.log('============================>客人信息组件点击更改状态', opt.tx, opt.status, opt.item)
532       this.changeStatusFn(opt.item, opt.status, () => {
459990 533         // 刷新详情
J 534         this.getData()
535       })
536     },
cf3e3e 537     // 改变房间状态异步方法
6da3c1 538     changeStatusFn(item = {}, status, cb) {
c6d315 539       // 未解锁 20240201 long
L 540       if (this.setStatusLock) {
541         return this.$messageWarn('操作频繁,请稍后再试')
542       }
543       this.setStatusLock = true
544       clearInterval(this.setStatusLockTimer)
545       this.setStatusLockTimer = null
546
6da3c1 547       var params = {}
J 548       // 房间id
549       if (this.id) {
550         params.shopRoomId = this.id
551       }
12a2f1 552       // 治疗记录id this.curTreatIds occupyInfoViewArr
J 553       // 1.使用中/敷麻中 敷麻中 2 人占用
554       // 2.使用中/使用中 使用中 2 人占用
555       // 3.使用中/休息中  使用中 1 人占用
556       var arr = JSON.parse(JSON.stringify(this.occupyInfoViewArr))
6da3c1 557       if (item && item.id) {
12a2f1 558         if (arr && arr.length) {
J 559           arr.forEach((o) => {
560             if (o.id === item.id) {
561               o.treatRoomStatus = status * 1
562             }
563           })
564           // 是否有人使用中
565           var status_1 = arr.find((o) => { return o.treatRoomStatus === 1 })
566           // 是否有客人休息
567           var status_2 = arr.find((o) => { return o.treatRoomStatus === 2 })
568           // 是否有人打扫中
569           var status_3 = arr.find((o) => { return o.treatRoomStatus === 3 })
570           // 是否有人敷麻
571           var status_4 = arr.find((o) => { return o.treatRoomStatus === 4 })
572           // 更改的状态 敷麻中 > 使用中 > 休息中 > 待打扫
573           params.status = status * 1
574           if (status_3) {
575             params.status = 3
576           }
577           if (status_2) {
578             params.status = 2
579           }
580           if (status_1) {
581             params.status = 1
582           }
583           if (status_4) {
584             params.status = 4
585           }
586         }
587
588         // 当前选择客户的数组删除客户
589         this.occupyInfoViewArrDataHandle('cancel', item)
5311b8 590         params.treatRoomList = []
J 591         if (arr && arr.length) {
592           arr.forEach((o) => {
593             params.treatRoomList.push({
594               treatRecordId: o.id,
595               status: o.treatRoomStatus
596             })
597           })
598         }
12a2f1 599       } else {
J 600         // 更改的状态
601         params.status = status * 1
602       }
603
6da3c1 604       Req.http.post({
878885 605         url: 'guide/treat/screen/room/status/update',
6da3c1 606         data: params,
J 607         header: { 'Content-Type': 'application/json' },
608         mockData: {
609           code: 100,
610           msg: '',
611           data: {}
612         }
613       }).then((res) => {
878885 614         // 在已有默认客人的情况下,改变状态更改标识(适配轮询)
J 615         if (isUseDefault) {
34cb2b 616           console.log('在已有默认客人的情况下,改变状态更改标识')
878885 617           isUseDefaultChg = 1
34cb2b 618         }
d73f98 619         // 只要更改为空闲就重置参数
c4b6a2 620         if (params.status === 0) {
583e10 621           console.log('房间更改为空闲')
34cb2b 622           // 重置默认已使用客人的参数
J 623           isUseDefault = false
624           isUseDefaultChg = 0
459990 625           // this.isShowAppellationName = true
878885 626         }
6da3c1 627         // console.log('8888888888888888888888888888888888', res)
J 628         cb && cb()
c6d315 629
L 630         // 30s后解锁 20240201 long
631         this.setStatusLockTimer = setInterval(() => {
632           this.setStatusLock = false
633         }, this.setStatusLockDuration)
634       }, () => {
635         setTimeout(() => {
636           this.setStatusLock = false
637         }, 1000)
6da3c1 638       })
aeb317 639     },
J 640     // 重置状态
641     resetStatus() {
642       // 打开弹窗
643       this.$refs['XioRoomStatusChg'].showDialog()
644     },
cf3e3e 645     // 更改房间状态(重置状态的更改方法)
aeb317 646     changeStatus(opt) {
583e10 647       // var { occupyInfoView, roomInfo } = this
J 648       console.log('============================>重置房间状态', opt.statusTx, opt.status)
6da3c1 649       // if (roomInfo && opt.status * 1 == roomInfo.status) {
J 650       //   return
651       // }
34cb2b 652       // 清除选中医疗记录id
583e10 653       // localStorage.removeItem('curTreatId')
J 654       // this.curTreatId = ''
655       // 清除选中医疗记录ids数组
656       localStorage.removeItem('curTreatIds')
657       this.curTreatIds = ''
658       // 变更房间状态方法
34cb2b 659       this.changeStatusFn({}, opt.status, () => {
6da3c1 660         // 刷新详情
J 661         this.getData()
662         // 关闭弹窗
663         this.$refs['XioRoomStatusChg'].hideDialog()
664       })
aeb317 665     },
J 666     // 选择客户
667     selectCustomer(item = {}) {
34cb2b 668       if (item.act) {
J 669         return
670       }
aeb317 671       // 打开弹窗
J 672       this.$refs['XioCustomerSelect'].showDialog()
6da3c1 673       // 组件客户数据处理
aeb317 674       this.$refs['XioCustomerSelect'].dataInit(item)
J 675     },
676     // 选择客户取消
677     selectCustomerCancel(opt) {
678       console.log('cancel', opt)
679       this.$refs['XioCustomerSelect'].hideDialog()
680     },
681     // 选择客户确定
682     selectCustomerSubmit(opt) {
459990 683       console.log('=======================>submit', opt)
34cb2b 684       // 确定选择的用户,记录id
583e10 685       // localStorage.setItem('curTreatId', opt.id)
J 686       // this.curTreatId = opt.id
687       // 当前选择客户的数组增加客户
688       this.occupyInfoViewArrDataHandle('add', opt)
34cb2b 689       // 重置房间状态
12a2f1 690       // if (this.roomInfo) {
J 691       //   this.changeStatusFn({}, 0, () => {
692       //     // 刷新详情
693       //     this.getData()
694       //   })
695       // }
34cb2b 696       // 关闭弹窗
J 697       this.$refs['XioCustomerSelect'].hideDialog()
583e10 698     },
J 699     // 删除已选择的客户数据
700     cancelCustomerItem(item) {
701       // 当前选择客户的数组删除客户
702       this.occupyInfoViewArrDataHandle('cancel', item, true)
703     },
704     // 当前选择客户的数组增删处理方法
705     occupyInfoViewArrDataHandle(key, item, isReset) {
706       // 增加(选择)
707       if (key === 'add') {
708         // id数组处理
709         if (this.curTreatIds && this.curTreatIds.length) {
710           // 当前治疗记录id没有所选用户的治疗记录id
711           var flag = this.curTreatIds.find((o) => { return o === item.id })
712           if (!flag) {
713             this.curTreatIds.push(item.id)
714           }
715           // 缓存
716           this.setLocalCurTreatIds()
717         }
12a2f1 718         if (this.curTreatIds && !this.curTreatIds.length) {
J 719           this.curTreatIds.push(item.id)
720           // 缓存
721           this.setLocalCurTreatIds()
722         }
583e10 723         // 数组数据处理
J 724         // if (this.occupyInfoViewArr && this.occupyInfoViewArr.length) {
725         //   this.occupyInfoViewArr.push(item)
726         // }
727       }
728       // 删除
729       if (key === 'cancel') {
730         // id数组处理
731         if (this.curTreatIds && this.curTreatIds.length) {
732           // 深复制
733           var ids = JSON.parse(JSON.stringify(this.curTreatIds))
734           this.curTreatIds = ids.filter((o) => { return o !== item.id })
735           // 缓存
736           this.setLocalCurTreatIds()
737           // 刷新
738           if (isReset) {
739             // 刷新详情
740             this.getData()
741           }
742         }
743         // 数组数据处理
744         // if (this.occupyInfoViewArr && this.occupyInfoViewArr.length) {
745         //   // 深复制
746         //   var arr = JSON.parse(JSON.stringify(this.occupyInfoViewArr))
747         //   this.occupyInfoViewArr = arr.filter((o) => { o.id !== item.id })
748         // }
749       }
459990 750     },
J 751     // 设置本地缓存ids数组
752     setLocalCurTreatIds() {
753       localStorage.setItem('curTreatIds', JSON.stringify(this.curTreatIds))
3ac5f2 754     }
J 755   }
756 }
757 </script>
cf3e3e 758
J 759 <style>
760 .el-popper.top_tx {
761   text-align: center;
762   font-size: 25px;
763 }
764 </style>
3ac5f2 765
J 766 <style scoped>
878885 767 .page{
J 768   overflow: auto;
769 }
459990 770 .page_header_placeholer {
J 771   height: 100px;
908dad 772   width: 100%;
L 773   display: block;
774   flex-shrink: 0;
459990 775 }
J 776 .page_header {
777   position: fixed;
778   top: 0;
779   left: 23px;
780   right: 23px;
781   z-index: 1;
782 }
bb2b08 783 .page_header .reset_btn {
J 784   width: 200px;
785   height: 60px;
786   line-height: 35px;
787   border-radius: 5px;
788   background-color: rgba(47,174,206,1);
789   color: rgba(255,255,255,1);
790   font-size: 24px;
791   text-align: center;
792   font-family: Microsoft Yahei;
6da3c1 793   cursor: pointer;
bf4dca 794   border: 0;
J 795   margin-left: 20px;
459990 796 }
J 797 .page_container.over-width {
798   width: 150%;
bb2b08 799 }
J 800 .page_container .main {
878885 801   /* height: 100%; */
bb2b08 802   border-radius: 10px;
J 803   background-color: rgba(255,255,255,1);
804   color: rgba(16,16,16,1);
805   font-size: 14px;
806   /* text-align: center; */
807   font-family: Roboto;
583e10 808   position: relative;
J 809 }
810 .page_container.over-width .main {
811   margin-right: 50px;
812 }
813 .page_container.over-width .main:last-child {
814   margin-right: 0;
815 }
816 .page_container .main .cancel_icon_block {
817   width: 50px;
818   height: 50px;
819   position: absolute;
820   top: 12px;
821   right: 11px;
822   z-index: 1;
823 }
824 .page_container .main .cancel_icon_block .img {
825   width: 100%;
826   height: 100%;
bb2b08 827 }
J 828 .page_container .main .room_title {
829   line-height: 50px;
830   color: rgba(255,255,255,1);
831   font-size: 36px;
832   text-align: center;
833   font-family: PingFangSC-medium;
834   padding: 10px 0;
835   background-color: rgba(34,123,235,1);
836   width: 400px;
837   margin: 39px auto 0 auto;
838 }
839 .page_container .main .room_main_tip {
840   line-height: 168px;
841   font-size: 120px;
842   color: rgba(46,77,124,1);
843   text-align: center;
844   font-family: PingFangSC-medium;
845   margin-top: 107px;
846   /* font-weight: bold; */
847 }
848 .page_container .main .room_main_tip.gray {
849   color: rgba(154,154,154,1);
850 }
851 .page_container .main .btn_box {
0e11d7 852   /* margin-top: 130px; */
L 853   margin-bottom: 40px;
bb2b08 854 }
J 855 .page_container .main .btn_box__item {
856   width: 250px;
857   height: 120px;
858   border-radius: 10px;
859   box-shadow: 0px 2px 6px 0px rgba(206,206,206,1);
860   margin-right: 70px;
6da3c1 861   cursor: pointer;
bb2b08 862 }
J 863 .page_container .main .btn_box__item:last-child {
864   margin-right: 0;
865 }
866 .page_container .main .btn_box__item.white {
867   background-color: rgba(255,255,255,1);
868 }
869 .page_container .main .btn_box__item.blue {
870   background-color: rgba(46,77,124,1);
871 }
872 .page_container .main .btn_box__item.yellow {
873   background-color: rgba(255,199,115,1);
874 }
875 .page_container .main .btn_box__item.gray {
876   background-color: rgba(206,206,206,1);
877 }
878 .page_container .main .btn_box__item .icon {
879   width: 60px;
880   height: 60px;
881   display: block;
882   margin-right: 17px;
878885 883 }
J 884 .page_container .main .btn_box__item .icon .img {
885   width: 100%;
886   height: 100%;
bb2b08 887 }
J 888 .page_container .main .btn_box__item .tx {
889   line-height: 37px;
890   color: rgba(51,51,51,1);
891   font-size: 26px;
892   text-align: center;
893   font-family: PingFangSC-medium;
894 }
895 .page_container .main .btn_box__item .tx.white {
896   color: rgba(255,255,255,1);
897 }
898 .page_container .main .room_left_btn_box {
899   padding: 0 23px;
900   margin-top: 163px;
901 }
902 .page_container .main .room_left_btn_box__item {
1d1095 903   width: 500px;
J 904   height: 150px;
905   line-height: 73px;
906   border-radius: 10px;
907   font-size: 50px;
908   text-align: center;
909   margin: auto;
910 }
911 .page_container .main .room_left_btn_box__item.flex-1 {
912   width: auto;
bb2b08 913   height: 150px;
J 914   line-height: 58px;
915   border-radius: 10px;
916   font-size: 40px;
917   text-align: center;
918   font-family: Microsoft Yahei;
919   margin-right: 20px;
920   font-weight: bold;
921 }
1d1095 922 /* .page_container .main .room_left_btn_box__item:last-child {
bb2b08 923   margin-right: 0;
1d1095 924 } */
bb2b08 925 .page_container .main .room_left_btn_box__item.yellow {
J 926   color: rgba(255,255,255,1);
927   background-color: rgba(233,157,66,1);
928 }
929 .page_container .main .room_left_btn_box__item.gray {
930   background-color: rgba(206,206,206,1);
931   color: rgba(79,79,79,1);
932 }
933 .page_container .main .room_left_btn_box__item.green {
934   background-color: rgba(47,174,206,1);
935   color: rgba(255,255,255,1);
1d1095 936 }
J 937 .page_container .main .room_left_btn_box__item.b-green {
938   background-color: rgba(79,167,114,1);
939   color: rgba(255,255,255,1);
bb2b08 940 }
J 941 .page_container .main .room_content {
942   margin-top: 30px;
943 }
944 .page_container .main .room_content .tip {
945   line-height: 33px;
946   color: rgba(79,79,79,1);
947   font-size: 24px;
948   text-align: center;
949   font-family: PingFangSC-medium;
950 }
951 .page_container .main .room_content .name {
952   line-height: 168px;
953   color: rgba(51,51,51,1);
954   font-size: 120px;
955   text-align: center;
956   font-family: PingFangSC-medium;
957   margin-top: 13px;
958 }
cf3e3e 959 .page_container .main .room_content .name .tx {
J 960   max-width: 666px;
961   margin: auto;
1fa546 962   text-align: center;
J 963 }
964 .page_container .main .room_content .name_icon {
965   width: 40px;
966   height: 40px;
967   display: block;
968   margin-top: 13px;
969   padding: 20px;
970 }
971 .page_container .main .room_content .name_icon .img {
972   width: 100%;
973   height: 100%;
cf3e3e 974 }
bb2b08 975 .page_container .main .room_content .ciq {
J 976   line-height: 42px;
977   color: rgba(51,51,51,1);
978   font-size: 30px;
979   text-align: center;
980   font-family: PingFangSC-regular;
981   margin-top: -5px;
982 }
983 .page_container .main .room_content .time {
984   line-height: 42px;
985   color: rgba(0,0,0,1);
986   font-size: 30px;
987   text-align: center;
988   font-family: PingFangSC-medium;
989   font-weight: bold;
990   margin-top: 21px;
991 }
992 .page_container .right {
993   width: 686px;
994   margin-left: 30px;
878885 995   /* height: 100%; */
bb2b08 996 }
583e10 997 .page_container.over-width .right_room_info {
J 998   margin-bottom: 58px;
999 }
1000 .page_container.over-width .right_room_info:last-child {
1001   margin-bottom: 0;
1002 }
bb2b08 1003 .page_container .right_block {
J 1004   width: 100%;
1005   height: 100%;
1006 }
459990 1007 .page_container .right_block .guest_box {
J 1008   margin-top: 0;
878885 1009   width: 100%;
J 1010   height: 100%;
459990 1011   -webkit-flex-flow: column;
J 1012   flex-flow: column;
1013   display: box;
1014   display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
1015   display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
1016   display: -ms-flexbox;      /* TWEENER - IE 10 */
1017   display: -webkit-flex;     /* NEW - Chrome */
1018   display: -moz-flex;
1019   display: -ms-flex;
1020   display: -o-flex;
1021   display: flex;
bb2b08 1022 }
J 1023 </style>