long
2024-02-01 c6d3157eb616116c84d35e221ed9c57ef8da0ad6
src/pages/room/detail.vue
@@ -24,9 +24,11 @@
    <div class="page_header_placeholer" />
    <!-- 未有安排 -->
    <div v-if="(!occupyInfoViewArr || !occupyInfoViewArr.length) && (!assignTreatListView || !assignTreatListView.length)" class="page_container flex flex-1">
      <div class="main flex-1">
      <div class="main flex-1 flex flex-col">
        <div v-if="roomInfo && roomInfo.roomNo" class="room_title">{{ roomInfo.roomNo }}</div>
        <div v-if="roomInfo" class="room_main_tip" style="margin-top: 93px;line-height: 186px;font-size: 140px;">-{{ statusTx[roomInfo.status] }}-</div>
        <div class="flex-1" />
        <div v-if="roomInfo" class="room_main_tip" style="line-height: 186px;font-size: 140px;margin-top: 0">-{{ statusTx[roomInfo.status] }}-</div>
        <div class="flex-1" />
        <div class="btn_box flex flex-center">
          <div class="flex flex-ver">
            <div class="btn_box__item flex flex-center white" data-tx="空闲" data-status="0" @click="statusChg">
@@ -87,7 +89,7 @@
    <div v-if="occupyInfoViewArr && occupyInfoViewArr.length" class="page_container flex flex-1" :class="[occupyInfoViewArr && occupyInfoViewArr.length>1?'over-width':'']">
      <div class="flex flex-1">
        <div v-for="(item,index) in occupyInfoViewArr" :key="index" class="main flex-1">
          <div v-if="occupyInfoViewArr.length>1" class="cancel_icon_block" @click="cancelCustomerItem(item)">
          <div v-if="occupyInfoViewArr.length>1 && item.treatRoomStatus === 0" class="cancel_icon_block" @click="cancelCustomerItem(item)">
            <img class="img" src="static/imgs/cancel.png">
          </div>
          <XioRoomGuestInfoBox :ref="`XioRoomGuestInfoBox_${item.id}`" :room-info="roomInfo" :occupy-info-view="item" :off-narcosis-ids="offNarcosisIds" @setStatus="setComStatus" />
@@ -95,7 +97,7 @@
      </div>
      <div class="right flex flex-col">
        <div v-for="(item,index) in occupyInfoViewArr" :key="index" class="flex-1 right_room_info">
          <XioRoomInfoBlock ref="XioRoomInfoBlock" :occupy-info-view="item" />
          <XioRoomInfoBlock ref="XioRoomInfoBlock" :occupy-info-view="item" :occupy-info-view-arr="occupyInfoViewArr" />
        </div>
        <div v-if="occupyInfoViewArr.length<=1" class="flex flex-col" style="border-radius: 10px;">
          <XioRoomGuestBox ref="XioRoomGuestBox" :assign-treat-list-view-com="assignTreatListView" @selectCustomer="selectCustomer" />
@@ -154,22 +156,24 @@
      timeObj: {}, // week:星期,date:年月日,timeMin:时分,time:时分秒,timeStamp:时间戳
      curTreatId: '',
      curTreatIds: '', // 已选中的治疗记录id数组
      offNarcosisIds: [] // 是否已通知卸麻的用户id数组
      offNarcosisIds: [], // 是否已通知卸麻的用户id数组
      // isShowAppellationName: true // 是否显示称谓
      // 60秒切换状态锁 ↓↓↓↓↓↓↓↓↓↓
      setStatusLock: false, // 更新状态锁
      setStatusLockDuration: 60000, // 更新状态锁时间
      setStatusLockTimer: null
      // 60秒切换状态锁 ↑↑↑↑↑↑↑↑↑↑
    }
  },
  computed: {
    // 当前已选择用户的数组数据
    occupyInfoViewArr() {
      // 缓存记录
      if (this.curTreatIds && this.curTreatIds.length) {
        // todo 存在缓存且存在占用数据的时候,根据后端返回再补充逻辑
        return this.getCurTreatArr(this.curTreatIds)
      if (this.occupyInfo && this.occupyInfo.length) {
        return this.occupyInfoViewArrIdsHandleArr()
      } else {
        // todo 存在占用数据的时候,根据后端返回再补充逻辑
        if (this.occupyInfo) {
          this.occupyInfoViewArrIdsHandle(this.occupyInfo)
          return [this.occupyInfo]
        if (this.curTreatIds && this.curTreatIds.length) {
          return this.getCurTreatArr(this.curTreatIds)
        } else {
          if ((!isUseDefault || (isUseDefault && isUseDefaultChg === 0)) && this.assignTreatList && this.assignTreatList.length) {
            isUseDefault = true
@@ -195,7 +199,7 @@
        } else {
          // 还没使用默认客人值或者已使用默认客人值还没改变状态(适配轮询)
          if ((!isUseDefault || (isUseDefault && isUseDefaultChg === 0)) && this.assignTreatList && this.assignTreatList.length) {
            isUseDefault = true
            // isUseDefault = true
            return this.assignTreatList[0]
          // 已使用过默认客人值
          } else {
@@ -273,6 +277,32 @@
      this.curTreatIds.push(item.id)
      this.setLocalCurTreatIds()
    },
    // 初始默认选择的id数组处理
    occupyInfoViewArrIdsHandleArr() {
      if (!this.curTreatIds) {
        this.curTreatIds = []
      }
      if (this.occupyInfo && this.occupyInfo.length === 1) {
        var res = []
        res.push(this.occupyInfo[0])
        if (this.curTreatIds && this.curTreatIds.length) {
          this.curTreatIds = this.curTreatIds.filter((o) => { return o !== this.occupyInfo[0].id })
          if (this.assignTreatList && this.assignTreatList.length && this.curTreatIds && this.curTreatIds.length) {
            var curTreatItem = this.assignTreatList.find((o) => { return o.id === this.curTreatIds[0] })
            if (curTreatItem) {
              res.push(curTreatItem)
            }
          }
        }
        this.setLocalCurTreatIds()
        return res
      } else if (this.occupyInfo && this.occupyInfo.length > 1) {
        this.occupyInfo.forEach((o) => {
          this.curTreatIds.push(o.id)
        })
        return this.occupyInfo
      }
    },
    // 设置已通知卸麻id数组
    setLocalStorageOffNarcosisIds() {
      localStorage.setItem('offNarcosisIds', JSON.stringify(this.offNarcosisIds))
@@ -320,6 +350,13 @@
            })
          }
        })
        // 基本不会出现这种情况,但是以防万一,若本地缓存id存在,但对不上列表则缓存第一条数据id
        if (!arr.length) {
          arr.push(this.assignTreatList[0])
          this.curTreatIds = []
          this.curTreatIds.push(this.assignTreatList[0].id)
          this.setLocalCurTreatIds()
        }
      }
      return arr
    },
@@ -360,6 +397,7 @@
                userName: '黄嘉荣',
                gender: 1,
                hempStatus: 2,
                treatRoomStatus: 0,
                ciq: '123',
                adviserName: 'a君',
                aDoctorName: 'b君',
@@ -373,6 +411,7 @@
                userName: '李德华',
                gender: 1,
                hempStatus: 2,
                treatRoomStatus: 0,
                ciq: '456',
                adviserName: 'd君',
                aDoctorName: 'e君',
@@ -386,6 +425,7 @@
                userName: '猛学友',
                gender: 2,
                hempStatus: 2,
                treatRoomStatus: 0,
                ciq: '789',
                adviserName: 'g君',
                aDoctorName: 'h君',
@@ -408,18 +448,17 @@
              o.appellationName = o.userName[0] + `${o.gender ? ['女士', '先生', '女士'][o.gender] : '女士'}`
            })
          }
          // todo 已占用用户数据处理,待后端修改再处理
          if (res.data.occupyInfo && res.data.occupyInfo.userName) {
            res.data.occupyInfo.appellationName = res.data.occupyInfo.userName[0] + `${res.data.occupyInfo.gender ? ['女士', '先生', '女士'][res.data.occupyInfo.gender] : '女士'}`
          if (res.data.occupyInfo && res.data.occupyInfo.length) {
            res.data.occupyInfo.forEach((o) => {
              // 治疗时间处理
              var st = (o.startTime).split(' ')[1].split(':')
              o.startTime = `${st[0]}:${st[1]}`
              // 称谓处理
              o.appellationName = o.userName[0] + `${o.gender ? ['女士', '先生', '女士'][o.gender] : '女士'}`
            })
          }
          // todo 已有占用的,更改已使用默认客人的状态
          res.data.occupyInfo && (isUseDefaultChg = 1)
          res.data.occupyInfo && (isUseDefault = 1)
          // todo 占用信息治疗时间处理
          if (res.data.occupyInfo && res.data.occupyInfo.startTime) {
            var ost = (res.data.occupyInfo.startTime).split(' ')[1].split(':')
            res.data.occupyInfo.startTime = `${ost[0]}:${ost[1]}`
          }
          res.data.occupyInfo && res.data.occupyInfo.length && (isUseDefaultChg = 1)
          res.data.occupyInfo && res.data.occupyInfo.length && (isUseDefault = 1)
          for (const key in res.data) {
            this[key] = res.data[key]
          }
@@ -497,17 +536,71 @@
    },
    // 改变房间状态异步方法
    changeStatusFn(item = {}, status, cb) {
      // 未解锁 20240201 long
      if (this.setStatusLock) {
        return this.$messageWarn('操作频繁,请稍后再试')
      }
      this.setStatusLock = true
      clearInterval(this.setStatusLockTimer)
      this.setStatusLockTimer = null
      var params = {}
      // 更改的状态
      params.status = status * 1
      // 房间id
      if (this.id) {
        params.shopRoomId = this.id
      }
      // 治疗记录id
      // 治疗记录id this.curTreatIds occupyInfoViewArr
      // 1.使用中/敷麻中 敷麻中 2 人占用
      // 2.使用中/使用中 使用中 2 人占用
      // 3.使用中/休息中  使用中 1 人占用
      var arr = JSON.parse(JSON.stringify(this.occupyInfoViewArr))
      if (item && item.id) {
        params.treatRecordId = item.id
        if (arr && arr.length) {
          arr.forEach((o) => {
            if (o.id === item.id) {
              o.treatRoomStatus = status * 1
            }
          })
          // 是否有人使用中
          var status_1 = arr.find((o) => { return o.treatRoomStatus === 1 })
          // 是否有客人休息
          var status_2 = arr.find((o) => { return o.treatRoomStatus === 2 })
          // 是否有人打扫中
          var status_3 = arr.find((o) => { return o.treatRoomStatus === 3 })
          // 是否有人敷麻
          var status_4 = arr.find((o) => { return o.treatRoomStatus === 4 })
          // 更改的状态 敷麻中 > 使用中 > 休息中 > 待打扫
          params.status = status * 1
          if (status_3) {
            params.status = 3
          }
          if (status_2) {
            params.status = 2
          }
          if (status_1) {
            params.status = 1
          }
          if (status_4) {
            params.status = 4
          }
        }
        // 当前选择客户的数组删除客户
        this.occupyInfoViewArrDataHandle('cancel', item)
        params.treatRoomList = []
        if (arr && arr.length) {
          arr.forEach((o) => {
            params.treatRoomList.push({
              treatRecordId: o.id,
              status: o.treatRoomStatus
            })
          })
        }
      } else {
        // 更改的状态
        params.status = status * 1
      }
      Req.http.post({
        url: 'guide/treat/screen/room/status/update',
        data: params,
@@ -523,28 +616,25 @@
          console.log('在已有默认客人的情况下,改变状态更改标识')
          isUseDefaultChg = 1
        }
        // 当前选中的用户房间更改了状态,已经成为占用时,清除选中医疗记录id
        // if (item && item.id && item.id === this.curTreatId) {
        //   console.log('当前选中的用户房间更改了状态,已经成为占用时,清除选中医疗记录id')
        //   localStorage.removeItem('curTreatId')
        //   this.curTreatId = ''
        // }
        // 只要更改为空闲就重置参数
        if (status === 0) {
        if (params.status === 0) {
          console.log('房间更改为空闲')
          // 重置默认已使用客人的参数
          isUseDefault = false
          isUseDefaultChg = 0
          // this.isShowAppellationName = true
        }
        // todo 用户结束治疗后,将其从缓存中删除, 待测试
        if (item && item.id && this.curTreatIds && this.curTreatIds.length && status === 0) {
          console.log('当前用户所在房间更改了状态为结束,清除当前的医疗记录id')
          // 当前选择客户的数组删除客户
          this.occupyInfoViewArrDataHandle('cancel', item)
        }
        // console.log('8888888888888888888888888888888888', res)
        cb && cb()
        // 30s后解锁 20240201 long
        this.setStatusLockTimer = setInterval(() => {
          this.setStatusLock = false
        }, this.setStatusLockDuration)
      }, () => {
        setTimeout(() => {
          this.setStatusLock = false
        }, 1000)
      })
    },
    // 重置状态
@@ -597,12 +687,12 @@
      // 当前选择客户的数组增加客户
      this.occupyInfoViewArrDataHandle('add', opt)
      // 重置房间状态
      if (this.roomInfo) {
        this.changeStatusFn({}, 0, () => {
          // 刷新详情
          this.getData()
        })
      }
      // if (this.roomInfo) {
      //   this.changeStatusFn({}, 0, () => {
      //     // 刷新详情
      //     this.getData()
      //   })
      // }
      // 关闭弹窗
      this.$refs['XioCustomerSelect'].hideDialog()
    },
@@ -622,6 +712,11 @@
          if (!flag) {
            this.curTreatIds.push(item.id)
          }
          // 缓存
          this.setLocalCurTreatIds()
        }
        if (this.curTreatIds && !this.curTreatIds.length) {
          this.curTreatIds.push(item.id)
          // 缓存
          this.setLocalCurTreatIds()
        }
@@ -674,6 +769,9 @@
}
.page_header_placeholer {
  height: 100px;
  width: 100%;
  display: block;
  flex-shrink: 0;
}
.page_header {
  position: fixed;
@@ -751,7 +849,8 @@
  color: rgba(154,154,154,1);
}
.page_container .main .btn_box {
  margin-top: 130px;
  /* margin-top: 130px; */
  margin-bottom: 40px;
}
.page_container .main .btn_box__item {
  width: 250px;