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