update_202312261911_卸麻通知和称谓显示v4

jazz

2023-12-26 4b4920c2d811f4a8b4fdc6cad7b06454905fc29c

 src/pages/room/detail.vue

@@ -11,7 +11,7 @@
        </div>
      </div>
      <div class="right flex-1 flex flex-jcfe flex-ver">
        <el-button type="primary" icon="el-icon-refresh" class="reset_btn flex flex-center" size="small" style="width: 100px;" @click="getData">刷新</el-button>
        <el-button type="primary" icon="el-icon-refresh" class="reset_btn flex flex-center" size="small" style="width: 100px;" @click="resetPage">刷新</el-button>
        <div class="reset_btn flex flex-center" @click="resetStatus">重置房间状态</div>
        <div class="page_date">
          <div class="page_week">{{ timeObj.week }}</div>
@@ -69,11 +69,11 @@
      <div class="main flex-1">
        <div v-if="roomInfo && roomInfo.roomNo" class="room_title">{{ roomInfo.roomNo }}</div>
        <div v-if="roomInfo" class="room_main_tip">-{{ statusTx[roomInfo.status] }}-</div>
        <div v-if="roomInfo && roomInfo.status >= 1" class="room_left_btn_box flex flex-ver">
          <div v-if="roomInfo.status == 1" class="room_left_btn_box__item flex-1 flex flex-center yellow btn_ani" @click="setStatus('客人休息', 2)">客人休息</div>
          <div v-if="roomInfo.status == 1" class="room_left_btn_box__item flex-1 flex flex-center gray btn_ani" @click="setStatus('打扫中', 3)">通知打扫</div>
          <div v-if="roomInfo.status == 2" class="room_left_btn_box__item flex flex-center green btn_ani" @click="setStatus('打扫中', 3)">通知打扫</div>
          <div v-if="roomInfo.status == 3" class="room_left_btn_box__item flex flex-center green btn_ani" @click="setStatus('空闲', 0)">结束打扫</div>
        <div v-show="roomInfo && roomInfo.status >= 1" class="room_left_btn_box flex flex-ver">
          <div v-show="roomInfo.status == 1" class="room_left_btn_box__item flex-1 flex flex-center yellow btn_ani" @click="setStatus('客人休息', 2)">客人休息</div>
          <div v-show="roomInfo.status == 1" class="room_left_btn_box__item flex-1 flex flex-center gray btn_ani" @click="setStatus('打扫中', 3)">通知打扫</div>
          <div v-show="roomInfo.status == 2" class="room_left_btn_box__item flex flex-center green btn_ani" @click="setStatus('打扫中', 3)">通知打扫</div>
          <div v-show="roomInfo.status == 3" class="room_left_btn_box__item flex flex-center green btn_ani" @click="setStatus('空闲', 0)">结束打扫</div>
        </div>
      </div>
      <div class="right">
@@ -115,28 +115,45 @@
        <div v-if="roomInfo && roomInfo.roomNo" class="room_title">{{ roomInfo.roomNo }}</div>
        <div class="room_content">
          <div class="tip">诊疗安排</div>
          <!-- <div class="name">{{ occupyInfoView.userName }}</div> -->
          <div class="name">
            <el-popover
              placement="top"
              width="400"
              popper-class="top_tx"
              trigger="click"
              :popper-options="{ removeOnDestroy: true }"
            >
              <div>{{ occupyInfoView.userName }}</div>
              <div slot="reference" class="tx ell">{{ occupyInfoView.userName }}</div>
            </el-popover>
          <!-- <div class="name">{{ occupyInfoView.userName }}</div> appellationName -->
          <div v-show="isShowAppellationName" class="flex flex-center">
            <div class="flex flex-ver">
              <div class="name">{{ occupyInfoView.appellationName }}</div>
              <div class="name_icon" @click="tapAppellationHandle">
                <img class="img" src="static/imgs/eye.png">
              </div>
            </div>
          </div>
          <div v-show="!isShowAppellationName" class="flex flex-center">
            <div class="flex flex-ver">
              <div class="name">
                <el-popover
                  placement="top"
                  width="400"
                  popper-class="top_tx"
                  trigger="click"
                  :popper-options="{ removeOnDestroy: true }"
                >
                  <div>{{ occupyInfoView.userName }}</div>
                  <div slot="reference" class="tx ell">{{ occupyInfoView.userName }}</div>
                </el-popover>
              </div>
              <div class="name_icon" @click="tapAppellationHandle">
                <img class="img" src="static/imgs/eye.png">
              </div>
            </div>
          </div>
          <div v-if="occupyInfoView.ciq" class="ciq">({{ occupyInfoView.ciq }})</div>
          <div v-if="occupyInfoView.startTime" class="time">安排治疗时间：{{ occupyInfoView.startTime }} 开始</div>
        </div>
        <div v-if="roomInfo" class="room_left_btn_box flex flex-ver" style="margin-top: 105px;">
          <div v-if="roomInfo.status == 0" class="room_left_btn_box__item flex flex-center green btn_ani" @click="setStatus('使用中', 1)">开始治疗</div>
          <div v-if="roomInfo.status == 1" class="room_left_btn_box__item flex-1 flex flex-center yellow btn_ani" @click="setStatus('客人休息', 2)">客人休息</div>
          <div v-if="roomInfo.status == 1" class="room_left_btn_box__item flex-1 flex flex-center gray btn_ani" @click="setStatus('打扫中', 3)">通知打扫</div>
          <div v-if="roomInfo.status == 2" class="room_left_btn_box__item flex flex-center green btn_ani" @click="setStatus('打扫中', 3)">通知打扫</div>
          <div v-if="roomInfo.status == 3" class="room_left_btn_box__item flex flex-center green btn_ani" @click="setStatus('空闲', 0)">结束打扫</div>
        <div v-show="roomInfo" class="room_left_btn_box flex flex-ver" style="margin-top: 105px;">
          <div v-show="roomInfo.status == 0" class="room_left_btn_box__item flex flex-1 flex-center b-green btn_ani" @click="setStatus('敷麻中', 4)">开始敷麻</div>
          <div v-show="roomInfo.status == 0" class="room_left_btn_box__item flex flex-1 flex-center green btn_ani" @click="setStatus('使用中', 1)">开始治疗</div>
          <div v-show="roomInfo.status == 4" class="room_left_btn_box__item flex flex-center green btn_ani" @click="setStatus('使用中', 1)">开始治疗</div>
          <div v-show="roomInfo.status == 1" class="room_left_btn_box__item flex-1 flex flex-center yellow btn_ani" @click="setStatus('客人休息', 2)">客人休息</div>
          <div v-show="roomInfo.status == 1" class="room_left_btn_box__item flex-1 flex flex-center gray btn_ani" @click="setStatus('打扫中', 3)">通知打扫</div>
          <div v-show="roomInfo.status == 2" class="room_left_btn_box__item flex flex-center green btn_ani" @click="setStatus('打扫中', 3)">通知打扫</div>
          <div v-show="roomInfo.status == 3" class="room_left_btn_box__item flex flex-center green btn_ani" @click="setStatus('空闲', 0)">结束打扫</div>
        </div>
      </div>
      <div class="right flex flex-col">
@@ -203,6 +220,8 @@
    <XioCustomerSelect ref="XioCustomerSelect" @cancel="selectCustomerCancel" @submit="selectCustomerSubmit" />
    <!-- 更改房间状态窗 -->
    <XioRoomStatusChg ref="XioRoomStatusChg" @changeStatus="changeStatus" />
    <!-- MIC通知卸麻 -->
    <XioRoomOffNarcosisNotice ref="XioRoomOffNarcosisNotice" @confirm="offNarcosisNoticeConfirm" />
  </div>
</template>

@@ -216,14 +235,20 @@
import XioCustomerSelect from '@/components/xio_customer_select'
// 更改房间状态窗
import XioRoomStatusChg from '@/components/xio_room_status_chg'
// 通知卸麻
import XioRoomOffNarcosisNotice from '@/components/xio_room_off_narcosis_notice'
import Req from '../../utils/jun_httpInstall' // http 请求
// import xioFn from './utils/xio_fn.js'
var isUseDefault = false // 是否已使用默认客人
var isUseDefaultChg = 0// 已使用默认客人后房间是否有改变状态
var offNarcosisIds = [] // 是否已通知卸麻id数组
var isOffNarcosisShow = false // 是否显示已通知卸麻弹窗
export default {
  name: 'RoomDetail',
  components: {
    XioCustomerSelect,
    XioRoomStatusChg
    XioRoomStatusChg,
    XioRoomOffNarcosisNotice
  },
  inject: ['noop'],
  data() {
@@ -232,9 +257,10 @@
      roomInfo: {},
      occupyInfo: '', // 当前占用人的信息
      assignTreatList: [],
      statusTx: ['空闲', '使用中', '客人休息', '打扫中'],
      statusTx: ['空闲', '使用中', '客人休息', '打扫中', '敷麻中'],
      timeObj: {}, // week：星期，date：年月日，timeMin：时分，time：时分秒，timeStamp：时间戳
      curTreatId: ''
      curTreatId: '',
      isShowAppellationName: true // 是否显示称谓
    }
  },
  computed: {
@@ -278,6 +304,18 @@
    console.log('roomDetail mounted')
    // 记录当前的治疗ID
    var curTreatId = localStorage.getItem('curTreatId')
    var localOffNarcosisIds = localStorage.getItem('offNarcosisIds')
    var localIsOffNarcosisShow = localStorage.getItem('isOffNarcosisShow')
    // 获取是否已通知卸麻数组
    if (localOffNarcosisIds) {
      offNarcosisIds = JSON.parse(localOffNarcosisIds)
    } else {
      offNarcosisIds = []
      this.setLocalStorageOffNarcosisIds()
    }
    if (localIsOffNarcosisShow) {
      isOffNarcosisShow = localIsOffNarcosisShow
    }
    this.curTreatId = curTreatId || ''
    this.id = this.$route.query.id || ''
    this.init()
@@ -297,11 +335,44 @@
      this.pollingAjaxFn(this, 'getData', 'detail', 8000)
      // this.getData()
    },
    // 设置已通知卸麻id数组
    setLocalStorageOffNarcosisIds() {
      localStorage.setItem('offNarcosisIds', JSON.stringify(offNarcosisIds))
    },
    // 卸麻通知确认
    offNarcosisNoticeConfirm() {
      if (this.occupyInfoView) {
        if (offNarcosisIds && offNarcosisIds.length) {
          var flag = offNarcosisIds.find((o) => { return o === this.occupyInfoView.userId })
          if (!flag) {
            offNarcosisIds.push(this.occupyInfoView.userId)
          }
        } else if (offNarcosisIds) {
          offNarcosisIds.push(this.occupyInfoView.userId)
        }
        this.setLocalStorageOffNarcosisIds()
      }
      isOffNarcosisShow = true
      localStorage.setItem('isOffNarcosisShow', true)
    },
    // 显示通知卸麻弹窗
    showOffNarcosisNotice() {
      // 打开弹窗
      this.$refs['XioRoomOffNarcosisNotice'].showDialog()
    },
    // 点击显示隐藏称谓
    tapAppellationHandle() {
      this.isShowAppellationName = !this.isShowAppellationName
    },
    // 获取当前治疗信息
    gatCurTreatInfo() {
      if (this.assignTreatList && this.assignTreatList.length) {
        return this.assignTreatList.find((o) => {return o.id === this.curTreatId})
        return this.assignTreatList.find((o) => { return o.id === this.curTreatId })
      }
    },
    // 刷新浏览器页面
    resetPage() {
      window.location.reload()
    },
    // 获取房间详情
    getData() {
@@ -321,7 +392,7 @@
          data: {
            roomInfo: {
              roomNo: 'xx',
              status: 0 // 0空闲 1使用 2休息 3打扫
              status: 0 // 0空闲 1使用 2休息 3打扫 4 敷麻中
            },
            assignTreatList: [{
              startTime: '2023-12-08 00:00:00'
@@ -336,7 +407,12 @@
            res.data.assignTreatList.forEach((o) => {
              var st = (o.startTime).split(' ')[1].split(':')
              o.startTime = `${st[0]}:${st[1]}`
              o.appellationName = o.userName[0] + `${o.gender ? ['女士', '先生', '女士'][o.gender] : '女士'}`
            })
          }
          // 已占用用户数据处理
          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] : '女士'}`
          }
          // 已有占用的，更改已使用默认客人的状态
          res.data.occupyInfo && (isUseDefaultChg = 1)
@@ -351,6 +427,20 @@
          }
        }
        // console.log('999999999999999999999999999', res)
        var offNarcosisTimer = null
        offNarcosisTimer = setTimeout(() => {
          console.log('================================>', this.occupyInfoView, 'offNarcosisIds:', offNarcosisIds, 'isOffNarcosisShow:', isOffNarcosisShow)
          if (this.occupyInfoView && this.occupyInfoView.hempStatus === 2 && this.occupyInfoView.userId) {
            var flag
            offNarcosisIds && offNarcosisIds.length && (flag = offNarcosisIds.find((o) => { return o === this.occupyInfoView.userId }))
            // flag = isOffNarcosisShow
            if (!flag) {
              this.showOffNarcosisNotice()
            }
          }
          clearTimeout(offNarcosisTimer)
          offNarcosisTimer = null
        }, 500)
      })
    },
    // 返回
@@ -427,12 +517,13 @@
          localStorage.removeItem('curTreatId')
          this.curTreatId = ''
        }
        // 正常流程结束打扫
        if (item && item.id && status === 0) {
          console.log('正常流程结束打扫')
        // 只要更改为空闲就重置参数
        if (status === 0) {
          console.log('更改为空闲')
          // 重置默认已使用客人的参数
          isUseDefault = false
          isUseDefaultChg = 0
          this.isShowAppellationName = true
        }
        // console.log('8888888888888888888888888888888888', res)
        cb && cb()
@@ -603,6 +694,16 @@
  margin-top: 163px;
}
.page_container .main .room_left_btn_box__item {
  width: 500px;
  height: 150px;
  line-height: 73px;
  border-radius: 10px;
  font-size: 50px;
  text-align: center;
  margin: auto;
}
.page_container .main .room_left_btn_box__item.flex-1 {
  width: auto;
  height: 150px;
  line-height: 58px;
  border-radius: 10px;
@@ -612,9 +713,9 @@
  margin-right: 20px;
  font-weight: bold;
}
.page_container .main .room_left_btn_box__item:last-child {
/* .page_container .main .room_left_btn_box__item:last-child {
  margin-right: 0;
}
} */
.page_container .main .room_left_btn_box__item.yellow {
  color: rgba(255,255,255,1);
  background-color: rgba(233,157,66,1);
@@ -624,15 +725,12 @@
  color: rgba(79,79,79,1);
}
.page_container .main .room_left_btn_box__item.green {
  width: 500px;
  height: 150px;
  line-height: 73px;
  border-radius: 10px;
  background-color: rgba(47,174,206,1);
  color: rgba(255,255,255,1);
  font-size: 50px;
  text-align: center;
  margin: auto;
}
.page_container .main .room_left_btn_box__item.b-green {
  background-color: rgba(79,167,114,1);
  color: rgba(255,255,255,1);
}
.page_container .main .room_content {
  margin-top: 30px;
@@ -655,6 +753,18 @@
.page_container .main .room_content .name .tx {
  max-width: 666px;
  margin: auto;
  text-align: center;
}
.page_container .main .room_content .name_icon {
  width: 40px;
  height: 40px;
  display: block;
  margin-top: 13px;
  padding: 20px;
}
.page_container .main .room_content .name_icon .img {
  width: 100%;
  height: 100%;
}
.page_container .main .room_content .ciq {
  line-height: 42px;