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