update_202312272015_单个治疗室多个客人的逻辑编写

jazz

2023-12-27 45999097f0705704a2ba9a70b339e18c28fc03b3

update_202312272015_单个治疗室多个客人的逻辑编写

 src/components/xio_room_guest_box/index.vue

New file
@@ -0,0 +1,142 @@
<template>
  <div class="guest_box">
    <div class="guest_title flex flex-center">等待诊疗</div>
    <div class="guest_block flex-1">
      <div v-if="assignTreatListViewCom && assignTreatListViewCom.length" class="guest_list">
        <div v-for="(item, index) in assignTreatListViewCom" :key="index" class="guest_list__row flex flex-ver" @click="selectCustomer(item)">
          <div class="guest_list__td">
            <div class="tx flex flex-ver">
              <div class="flex-1 flex-1-w1 ell">{{ item.userName }}</div>
            </div>
            <div class="tx" style="font-size: 14px;line-height: 20px;">{{ item.ciq || '' }}</div>
          </div>
          <div class="guest_list__td flex flex-center">
            <span class="tx">{{ item.startTime?item.startTime+'开始':'' }}</span>
          </div>
          <div class="guest_list__td flex flex-center">
            <span class="tx flex-1 flex-1-w1 ell">{{ item.aDoctorName?item.aDoctorName+'(医生)、':'' }}{{ item.aNurseName?item.aNurseName+'(护士)':'' }}</span>
          </div>
          <div class="guest_list__td flex flex-center">
            <div v-if="!item.act" class="tx" style="text-decoration: underline;color: #227beb;">切换</div>
            <!-- <div class="icon">
                    <img class="img" src="static/imgs/choose.png">
                  </div> -->
          </div>
        </div>
      </div>
      <div v-if="!assignTreatListViewCom || !assignTreatListViewCom.length" class="guest_list">
        <div class="guest_list__row flex flex-center rowtip">暂无数据</div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'XioRoomStatusChg',
  props: {
    assignTreatListViewCom: {
      type: Array,
      default: () => {
        return []
      }
    }
  },
  data() {
    return {
      isShow: false
    }
  },
  methods: {
    noop() {
      return
    },
    // 确认
    selectCustomer(item) {
      this.$emit('selectCustomer', item)
    },
    // 显示弹窗
    showDialog() {
      this.isShow = true
    },
    // 关闭弹窗
    hideDialog() {
      this.isShow = false
      this.$emit('confirm', { })
    }
  }
}
</script>

<style scoped>
.guest_title {
  height: 60px;
  line-height: 28px;
  border-radius: 10px 10px 0px 0px;
  background-color: rgba(255,255,255,1);
  color: rgba(34,123,235,1);
  font-size: 20px;
  text-align: center;
  font-family: Roboto;
  font-weight: bold;
}
.guest_block {
  background-color: #fff;
  overflow: auto;
}
.guest_list {
  background-color: #fff;
  padding-bottom: 23px;
}
.guest_list__row {
  min-height: 75px;
  background-color: rgba(34,123,235,0.1);
}
.guest_list__row:nth-child(2n) {
  background-color: #fff;
}
.guest_list__row.rowtip {
  background-color: #fff;
  line-height: 30px;
  color: rgba(0,0,0,.5);
  font-size: 22px;
}
.guest_list__td {}
.guest_list__td .tx {
  line-height: 30px;
  color: rgba(16,16,16,1);
  font-size: 22px;
  text-align: center;
  font-family: PingFangSC-regular;
  box-sizing: border-box;
  padding: 0 5px;
}
.guest_list__td .icon {
  width: 20px;
  height: 20px;
  display: block;
}
.guest_list__td .icon .img {
  width: 100%;
  height: 100%;
}
.guest_list__td:nth-child(1) {
  width: 19.54%;
}
.guest_list__td:nth-child(2) {
  width: 21.86%;
}
.guest_list__td:nth-child(3) {
  width: 46.06%;
}
.guest_list__td:nth-child(4) {
  width: 12.54%;
}
.guest_box {
  margin-top: 65px;
  width: 100%;
  height: 345px;
  background-color: #fff;
  overflow: hidden;
}
</style>

 src/components/xio_room_guest_info_box/index.vue

New file
@@ -0,0 +1,270 @@
<template>
  <div class="guest_info_box">
    <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> 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-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" style="margin-right: 0;" @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" style="margin-right: 0;" @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>
</template>

<script>
export default {
  name: 'XioRoomStatusChg',
  props: {
    roomInfo: {
      type: Object,
      default: () => {
        return {}
      }
    },
    occupyInfoView: {
      type: [Object, Array],
      default: () => {
        return {}
      }
    }
  },
  data() {
    return {
      isShowAppellationName: true
    }
  },
  methods: {
    noop() {
      return
    },
    // 点击显示隐藏称谓
    tapAppellationHandle() {
      this.isShowAppellationName = !this.isShowAppellationName
    },
    setStatus(tx, status) {
      this.$emit('setStatus', { tx, status })
    },
    // 确认
    confirm() {
      this.isShow = false
      this.$emit('confirm', { })
    },
    // 显示弹窗
    showDialog() {
      this.isShow = true
    },
    // 关闭弹窗
    hideDialog() {
      this.isShow = false
      this.$emit('confirm', { })
    }
  }
}
</script>

<style scoped>
.guest_info_box {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  padding-top: 39px;
}
.guest_info_box .room_title {
  line-height: 50px;
  color: rgba(255,255,255,1);
  font-size: 36px;
  text-align: center;
  font-family: PingFangSC-medium;
  padding: 10px 0;
  background-color: rgba(34,123,235,1);
  width: 400px;
  margin: 0 auto 0 auto;
}
.guest_info_box .room_main_tip {
  line-height: 168px;
  font-size: 120px;
  color: rgba(46,77,124,1);
  text-align: center;
  font-family: PingFangSC-medium;
  margin-top: 107px;
  /* font-weight: bold; */
}
.guest_info_box .room_main_tip.gray {
  color: rgba(154,154,154,1);
}
.guest_info_box .btn_box {
  margin-top: 130px;
}
.guest_info_box .btn_box__item {
  width: 250px;
  height: 120px;
  border-radius: 10px;
  box-shadow: 0px 2px 6px 0px rgba(206,206,206,1);
  margin-right: 70px;
  cursor: pointer;
}
.guest_info_box .btn_box__item:last-child {
  margin-right: 0;
}
.guest_info_box .btn_box__item.white {
  background-color: rgba(255,255,255,1);
}
.guest_info_box .btn_box__item.blue {
  background-color: rgba(46,77,124,1);
}
.guest_info_box .btn_box__item.yellow {
  background-color: rgba(255,199,115,1);
}
.guest_info_box .btn_box__item.gray {
  background-color: rgba(206,206,206,1);
}
.guest_info_box .btn_box__item .icon {
  width: 60px;
  height: 60px;
  display: block;
  margin-right: 17px;
}
.guest_info_box .btn_box__item .icon .img {
  width: 100%;
  height: 100%;
}
.guest_info_box .btn_box__item .tx {
  line-height: 37px;
  color: rgba(51,51,51,1);
  font-size: 26px;
  text-align: center;
  font-family: PingFangSC-medium;
}
.guest_info_box .btn_box__item .tx.white {
  color: rgba(255,255,255,1);
}
.guest_info_box .room_left_btn_box {
  padding: 0 23px;
  margin-top: 163px;
}
.guest_info_box .room_left_btn_box__item {
  width: 500px;
  height: 150px;
  line-height: 73px;
  border-radius: 10px;
  font-size: 50px;
  text-align: center;
  margin: auto;
}
.guest_info_box .room_left_btn_box__item.flex-1 {
  width: auto;
  height: 150px;
  line-height: 58px;
  border-radius: 10px;
  font-size: 40px;
  text-align: center;
  font-family: Microsoft Yahei;
  margin-right: 20px;
  font-weight: bold;
}
/* .guest_info_box .room_left_btn_box__item:last-child {
  margin-right: 0;
} */
.guest_info_box .room_left_btn_box__item.yellow {
  color: rgba(255,255,255,1);
  background-color: rgba(233,157,66,1);
}
.guest_info_box .room_left_btn_box__item.gray {
  background-color: rgba(206,206,206,1);
  color: rgba(79,79,79,1);
}
.guest_info_box .room_left_btn_box__item.green {
  background-color: rgba(47,174,206,1);
  color: rgba(255,255,255,1);
}
.guest_info_box .room_left_btn_box__item.b-green {
  background-color: rgba(79,167,114,1);
  color: rgba(255,255,255,1);
}
.guest_info_box .room_content {
  margin-top: 30px;
}
.guest_info_box .room_content .tip {
  line-height: 33px;
  color: rgba(79,79,79,1);
  font-size: 24px;
  text-align: center;
  font-family: PingFangSC-medium;
}
.guest_info_box .room_content .name {
  line-height: 168px;
  color: rgba(51,51,51,1);
  font-size: 120px;
  text-align: center;
  font-family: PingFangSC-medium;
  margin-top: 13px;
}
.guest_info_box .room_content .name .tx {
  max-width: 666px;
  margin: auto;
  text-align: center;
}
.guest_info_box .room_content .name_icon {
  width: 40px;
  height: 40px;
  display: block;
  margin-top: 13px;
  padding: 20px;
}
.guest_info_box .room_content .name_icon .img {
  width: 100%;
  height: 100%;
}
.guest_info_box .room_content .ciq {
  line-height: 42px;
  color: rgba(51,51,51,1);
  font-size: 30px;
  text-align: center;
  font-family: PingFangSC-regular;
  margin-top: -5px;
}
.guest_info_box .room_content .time {
  line-height: 42px;
  color: rgba(0,0,0,1);
  font-size: 30px;
  text-align: center;
  font-family: PingFangSC-medium;
  font-weight: bold;
  margin-top: 21px;
}
</style>

 src/components/xio_room_info_block/index.vue

New file
@@ -0,0 +1,127 @@
<template>
  <div class="room_info">
    <div class="staff_box flex flex-ver flex-sb">
      <div class="staff_box_item flex-1 flex flex-center">
        <div>
          <div class="staff_box_item__title">分诊顾问</div>
          <div class="staff_box_item__name">{{ occupyInfoView.adviserName || '' }}</div>
        </div>
      </div>
      <div class="staff_box_item flex-1 flex flex-center">
        <div>
          <div class="staff_box_item__title">执行医生</div>
          <div class="staff_box_item__name">{{ occupyInfoView.aDoctorName || '' }}</div>
        </div>
      </div>
      <div class="staff_box_item flex-1 flex flex-center">
        <div>
          <div class="staff_box_item__title">执行护士</div>
          <div class="staff_box_item__name">{{ occupyInfoView.aNurseName || '' }}</div>
        </div>
      </div>
    </div>
    <div class="room_info_project">
      <div class="room_info_project_block">
        <div class="tx">{{ occupyInfoView.projectName || '' }}</div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'XioRoomStatusChg',
  props: {
    occupyInfoView: {
      type: [Object, Array],
      default: () => {
        return {}
      }
    }
  },
  data() {
    return {

    }
  },
  methods: {
    noop() {
      return
    },
    // 确认
    confirm() {
      this.isShow = false
      this.$emit('confirm', { })
    },
    // 显示弹窗
    showDialog() {
      this.isShow = true
    },
    // 关闭弹窗
    hideDialog() {
      this.isShow = false
      this.$emit('confirm', { })
    }
  }
}
</script>

<style scoped>
.room_info {
  width: 100%;
  height: 100%;
  border-radius: 10px;
  background-color: rgba(255,255,255,0.3);
  box-sizing: border-box;
  padding-top: 30px;
}
.room_info .staff_box {
}
.room_info .staff_box_item {
  height: 180px;
}
.room_info .staff_box_item:nth-child(1) {
  background-color: rgba(255,255,255,0.1);
}
.room_info .staff_box_item:nth-child(2) {
  background-color: rgba(255,255,255,0.3);
  margin: 0 10px;
}
.room_info .staff_box_item:nth-child(3) {
  background-color: rgba(255,255,255,0.1);
}
.room_info .staff_box_item__title {
  line-height: 28px;
  color: rgba(255,255,255,1);
  font-size: 20px;
  text-align: center;
  font-family: PingFangSC-regular;
}
.room_info .staff_box_item__name {
  line-height: 56px;
  color: rgba(255,255,255,1);
  font-size: 40px;
  text-align: center;
  font-family: PingFangSC-medium;
  margin-top: 5px;
}
.room_info .room_info_project {
  padding: 36px 20px 20px 20px;
  height: 138px;
  box-sizing: border-box;
  overflow: hidden;
}
.room_info .room_info_project_block {
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  overflow: auto;
}
.room_info .room_info_project .tx {
  line-height: 39px;
  color: rgba(255,255,255,1);
  font-size: 28px;
  text-align: center;
  font-family: PingFangSC-regular;
}
</style>

 src/config/index.js

@@ -7,7 +7,7 @@

import appId from './appid.js'

var ismock = 0// 虚拟数据 0不使用 1使用
var ismock = 1// 虚拟数据 0不使用 1使用
var istest = 2// 0线上 1本地 2测试环境
var isConsole = 1// 是否屏蔽console 0屏蔽 1开放
var debug = isConsole
@@ -25,7 +25,6 @@
  if (is_use_test_server) {
    isTestView = 1
  }

}

const pdomain = '/' // 线上
@@ -50,8 +49,8 @@
  const search = location.search
  // 参数数组
  let querys = []
  if (search && search.indexOf('?')>-1) {
    querys = search.split('?')[1].split('&').filter((str)=>{
  if (search && search.indexOf('?') > -1) {
    querys = search.split('?')[1].split('&').filter((str) => {
      const key = str.split('=')[0]
      const value = str.split('=')[1]
      return (key != 'code' && key != 'state')
@@ -62,7 +61,7 @@

  // 补充参数
  if (querys.length) {
    indexUrl += '?'+querys.join('&')
    indexUrl += '?' + querys.join('&')
  }

  return long.replace('{{appid}}', appid).replace('{{scope}}', scope).replace('{{url}}', encodeURIComponent(indexUrl))
@@ -73,7 +72,7 @@
  console.log = () => {}
}

var domain;
var domain

if (istest == 0) domain = pdomain // 线上
if (istest == 1) domain = tdomain // 本地

 src/pages/room/detail.vue

@@ -21,6 +21,7 @@
        <!-- <div class="page_time">{{ timeObj.time }}</div> -->
      </div>
    </div>
    <div class="page_header_placeholer" />
    <!-- 未有安排 -->
    <div v-if="!occupyInfoView && (!assignTreatListView || !assignTreatListView.length)" class="page_container flex flex-1">
      <div class="main flex-1">
@@ -77,142 +78,22 @@
        </div>
      </div>
      <div class="right">
        <div class="right_block flex flex-col">
          <div class="guest_title flex flex-center">等待诊疗</div>
          <div class="guest_block flex-1" style="border-radius: 0 0 10px 10px;">
            <div v-if="assignTreatListView && assignTreatListView.length" class="guest_list">
              <div v-for="(item, index) in assignTreatListView" :key="index" class="guest_list__row flex flex-ver" @click="selectCustomer(item)">
                <div class="guest_list__td">
                  <div class="tx flex flex-ver">
                    <div class="flex-1 flex-1-w1 ell">{{ item.userName }}</div>
                  </div>
                  <div class="tx" style="font-size: 14px;line-height: 20px;">{{ item.ciq || '' }}</div>
                </div>
                <div class="guest_list__td flex flex-center">
                  <span class="tx">{{ item.startTime?item.startTime+'开始':'' }}</span>
                </div>
                <div class="guest_list__td flex flex-center">
                  <span class="tx flex-1 flex-1-w1 ell">{{ item.aDoctorName?item.aDoctorName+'(医生)、':'' }}{{ item.aNurseName?item.aNurseName+'(护士)':'' }}</span>
                </div>
                <div class="guest_list__td flex flex-center">
                  <div v-if="!item.act" class="tx" style="text-decoration: underline;color: #227beb;">切换</div>
                  <!-- <div class="icon">
                    <img class="img" src="static/imgs/choose.png">
                  </div> -->
                </div>
              </div>
            </div>
            <div v-if="!assignTreatListView || !assignTreatListView.length" class="guest_list">
              <div class="guest_list__row flex flex-center rowtip">暂无数据</div>
            </div>
          </div>
        <div class="right_block">
          <XioRoomGuestBox ref="XioRoomGuestBox" :assign-treat-list-view-com="assignTreatListView" @selectCustomer="selectCustomer" />
        </div>
      </div>
    </div>
    <!-- 客人和有安排 -->
    <!-- 客人和有安排 over-width -->
    <div v-if="occupyInfoView" class="page_container flex flex-1">
      <div class="main flex-1">
        <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> 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-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>
        <XioRoomGuestInfoBox ref="XioRoomGuestInfoBox" :room-info="roomInfo" :occupy-info-view="occupyInfoView" @setStatus="setComStatus" />
      </div>
      <div class="right flex flex-col">
        <div class="room_info flex-1">
          <div class="staff_box flex flex-ver flex-sb">
            <div class="staff_box_item flex-1 flex flex-center">
              <div>
                <div class="staff_box_item__title">分诊顾问</div>
                <div class="staff_box_item__name">{{ occupyInfoView.adviserName || '' }}</div>
              </div>
            </div>
            <div class="staff_box_item flex-1 flex flex-center">
              <div>
                <div class="staff_box_item__title">执行医生</div>
                <div class="staff_box_item__name">{{ occupyInfoView.aDoctorName || '' }}</div>
              </div>
            </div>
            <div class="staff_box_item flex-1 flex flex-center">
              <div>
                <div class="staff_box_item__title">执行护士</div>
                <div class="staff_box_item__name">{{ occupyInfoView.aNurseName || '' }}</div>
              </div>
            </div>
          </div>
          <div class="room_info_project">
            <div class="room_info_project_block">
              <div class="tx">{{ occupyInfoView.projectName || '' }}</div>
            </div>
          </div>
        <div class="flex-1">
          <XioRoomInfoBlock ref="XioRoomInfoBlock" :occupy-info-view="occupyInfoView" />
        </div>
        <div class="guest_box flex flex-col" style="border-radius: 10px;">
          <div class="guest_title flex flex-center">等待诊疗</div>
          <div class="guest_block flex-1">
            <div v-if="assignTreatListView && assignTreatListView.length" class="guest_list">
              <div v-for="(item, index) in assignTreatListView" :key="index" class="guest_list__row flex flex-ver" @click="selectCustomer(item)">
                <div class="guest_list__td">
                  <div class="tx flex flex-ver">
                    <div class="flex-1 flex-1-w1 ell">{{ item.userName }}</div>
                  </div>
                  <div class="tx" style="font-size: 14px;line-height: 20px;">{{ item.ciq || '' }}</div>
                </div>
                <div class="guest_list__td flex flex-center">
                  <span class="tx">{{ item.startTime?item.startTime+'开始':'' }}</span>
                </div>
                <div class="guest_list__td flex flex-center">
                  <span class="tx flex-1 flex-1-w1 ell">{{ item.aDoctorName?item.aDoctorName+'(医生)、':'' }}{{ item.aNurseName?item.aNurseName+'(护士)':'' }}</span>
                </div>
                <div class="guest_list__td flex flex-center">
                  <div v-if="!item.act" class="tx" style="text-decoration: underline;color: #227beb;">切换</div>
                  <!-- <div class="icon">
                    <img class="img" src="static/imgs/choose.png">
                  </div> -->
                </div>
              </div>
            </div>
            <div v-if="!assignTreatListView || !assignTreatListView.length" class="guest_list">
              <div class="guest_list__row flex flex-center rowtip">暂无数据</div>
            </div>
          </div>
        <div class="flex flex-col" style="border-radius: 10px;">
          <XioRoomGuestBox ref="XioRoomGuestBox" :assign-treat-list-view-com="assignTreatListView" @selectCustomer="selectCustomer" />
        </div>
      </div>
    </div>
@@ -231,6 +112,12 @@
// 客人休息 2
// 待打扫/通知打扫 3
// import Login from '../utils/jun_login.js'
// 房间客人信息
import XioRoomGuestInfoBox from '@/components/xio_room_guest_info_box'
// 房间负责员工信息
import XioRoomInfoBlock from '@/components/xio_room_info_block'
// 房间客户预约列表信息
import XioRoomGuestBox from '@/components/xio_room_guest_box'
// 选择客人弹窗
import XioCustomerSelect from '@/components/xio_customer_select'
// 更改房间状态窗
@@ -246,6 +133,9 @@
export default {
  name: 'RoomDetail',
  components: {
    XioRoomGuestInfoBox,
    XioRoomInfoBlock,
    XioRoomGuestBox,
    XioCustomerSelect,
    XioRoomStatusChg,
    XioRoomOffNarcosisNotice
@@ -260,10 +150,31 @@
      statusTx: ['空闲', '使用中', '客人休息', '打扫中', '敷麻中'],
      timeObj: {}, // week：星期，date：年月日，timeMin：时分，time：时分秒，timeStamp：时间戳
      curTreatId: '',
      isShowAppellationName: true // 是否显示称谓
      curTreatIds: ''
      // isShowAppellationName: true // 是否显示称谓
    }
  },
  // todo 页面显示及数组处理
  computed: {
    occupyInfoViewArr() {
      // 缓存记录
      if (this.curTreatIds) {
        return this.getCurTreatArr(this.curTreatIds)
      } else {
        if (this.occupyInfo) {
          this.occupyInfoViewArrIdsHandle(this.occupyInfo)
          return [this.occupyInfo]
        } else {
          if ((!isUseDefault || (isUseDefault && isUseDefaultChg === 0)) && this.assignTreatList && this.assignTreatList.length) {
            isUseDefault = true
            this.occupyInfoViewArrIdsHandle(this.assignTreatList[0])
            return [this.assignTreatList[0]]
          } else {
            return ''
          }
        }
      }
    },
    occupyInfoView() {
      console.log('00000000000000000000000', this.occupyInfo, isUseDefault, isUseDefaultChg)
      // 有当前选中的，根据需求修改增加选中不更改状态，由空闲开始
@@ -304,6 +215,9 @@
    console.log('roomDetail mounted')
    // 记录当前的治疗ID
    var curTreatId = localStorage.getItem('curTreatId')
    // 记录当前的治疗ID数组
    var curTreatIds = localStorage.getItem('curTreatIds')
    // 卸麻相关
    var localOffNarcosisIds = localStorage.getItem('offNarcosisIds')
    var localIsOffNarcosisShow = localStorage.getItem('isOffNarcosisShow')
    // 获取是否已通知卸麻数组
@@ -315,6 +229,14 @@
    }
    if (localIsOffNarcosisShow) {
      isOffNarcosisShow = localIsOffNarcosisShow
    }
    // 数组
    if (curTreatIds) {
      try {
        this.curTreatIds = JSON.parse(curTreatIds)
      } catch (error) {
        this.curTreatIds = ''
      }
    }
    this.curTreatId = curTreatId || ''
    this.id = this.$route.query.id || ''
@@ -334,6 +256,14 @@
      // 轮询getData，8秒一次
      this.pollingAjaxFn(this, 'getData', 'detail', 8000)
      // this.getData()
    },
    // 初始占用id数组处理
    occupyInfoViewArrIdsHandle(item) {
      if (!this.curTreatIds) {
        this.curTreatIds = []
      }
      this.curTreatIds.push(item.id)
      this.setLocalCurTreatIds()
    },
    // 设置已通知卸麻id数组
    setLocalStorageOffNarcosisIds() {
@@ -361,8 +291,24 @@
      this.$refs['XioRoomOffNarcosisNotice'].showDialog()
    },
    // 点击显示隐藏称谓
    tapAppellationHandle() {
      this.isShowAppellationName = !this.isShowAppellationName
    // tapAppellationHandle() {
    //   this.isShowAppellationName = !this.isShowAppellationName
    // },
    // 获取当前治疗信息(数组)
    getCurTreatArr(ids) {
      var arr = []
      if (this.assignTreatList && this.assignTreatList.length) {
        this.assignTreatList.forEach((o) => {
          if (ids && ids.length) {
            ids.forEach((_o) => {
              if (_o === o.id) {
                arr.push(o)
              }
            })
          }
        })
      }
      return arr
    },
    // 获取当前治疗信息
    gatCurTreatInfo() {
@@ -394,9 +340,47 @@
              roomNo: 'xx',
              status: 0 // 0空闲 1使用 2休息 3打扫 4 敷麻中
            },
            assignTreatList: [{
              startTime: '2023-12-08 00:00:00'
            }],
            assignTreatList: [
              {
                id: 'a111',
                startTime: '2023-12-08 00:00:00',
                userName: '黄嘉荣',
                gender: 1,
                hempStatus: 0,
                ciq: '123',
                adviserName: 'a君',
                aDoctorName: 'b君',
                aNurseName: 'c君',
                projectName: 'xxxxXXxxx',
                userId: '111'
              },
              {
                id: 'a222',
                startTime: '2023-12-08 00:15:00',
                userName: '李德华',
                gender: 1,
                hempStatus: 0,
                ciq: '456',
                adviserName: 'd君',
                aDoctorName: 'e君',
                aNurseName: 'f君',
                projectName: 'xxxxXXxxx',
                userId: '222'
              },
              {
                id: 'a333',
                startTime: '2023-12-08 00:20:00',
                userName: '猛学友',
                gender: 2,
                hempStatus: 0,
                ciq: '789',
                adviserName: 'g君',
                aDoctorName: 'h君',
                aNurseName: 'i君',
                projectName: 'xxxxXXxxx',
                userId: '333'
              }
            ],
            occupyInfo: null
          }
        }
@@ -483,6 +467,15 @@
        this.getData()
      })
    },
    // 按流程设置房间状态
    setComStatus(opt) {
      var { occupyInfoView, roomInfo } = this
      console.log(opt.tx, opt.status)
      this.changeStatusFn(occupyInfoView, opt.status, () => {
        // 刷新详情
        this.getData()
      })
    },
    // 改变房间状态异步方法
    changeStatusFn(item = {}, status, cb) {
      var params = {}
@@ -523,7 +516,7 @@
          // 重置默认已使用客人的参数
          isUseDefault = false
          isUseDefaultChg = 0
          this.isShowAppellationName = true
          // this.isShowAppellationName = true
        }
        // console.log('8888888888888888888888888888888888', res)
        cb && cb()
@@ -568,12 +561,22 @@
    },
    // 选择客户确定
    selectCustomerSubmit(opt) {
      console.log('submit', opt)
      console.log('=======================>submit', opt)
      // 确定选择的用户，记录id
      localStorage.setItem('curTreatId', opt.id)
      this.curTreatId = opt.id
      if (this.curTreatIds && this.curTreatIds.length) {
        var flag = this.curTreatIds.find((o) => { return o === opt.id })
        if (!flag) {
          this.curTreatIds.push(opt.id)
        }
        this.setLocalCurTreatIds()
      }
      if (this.occupyInfoViewArr && this.occupyInfoViewArr.length) {
        this.occupyInfoViewArr.push(opt)
      }
      // 重置房间状态
      if (this.roomInfo && this.roomInfo.status) {
      if (this.roomInfo) {
        this.changeStatusFn({}, 0, () => {
          // 刷新详情
          this.getData()
@@ -581,6 +584,10 @@
      }
      // 关闭弹窗
      this.$refs['XioCustomerSelect'].hideDialog()
    },
    // 设置本地缓存ids数组
    setLocalCurTreatIds() {
      localStorage.setItem('curTreatIds', JSON.stringify(this.curTreatIds))
    }
  }
}
@@ -597,6 +604,16 @@
.page{
  overflow: auto;
}
.page_header_placeholer {
  height: 100px;
}
.page_header {
  position: fixed;
  top: 0;
  left: 23px;
  right: 23px;
  z-index: 1;
}
.page_header .reset_btn {
  width: 200px;
  height: 60px;
@@ -610,6 +627,9 @@
  cursor: pointer;
  border: 0;
  margin-left: 20px;
}
.page_container.over-width {
  width: 150%;
}
.page_container .main {
  /* height: 100%; */
@@ -792,129 +812,20 @@
  width: 100%;
  height: 100%;
}
.page_container .right .guest_title {
  height: 60px;
  line-height: 28px;
  border-radius: 10px 10px 0px 0px;
  background-color: rgba(255,255,255,1);
  color: rgba(34,123,235,1);
  font-size: 20px;
  text-align: center;
  font-family: Roboto;
  font-weight: bold;
}
.page_container .right .guest_block {
  background-color: #fff;
  overflow: auto;
}
.page_container .right .guest_list {
  background-color: #fff;
  padding-bottom: 23px;
}
.page_container .right .guest_list__row {
  min-height: 75px;
  background-color: rgba(34,123,235,0.1);
}
.page_container .right .guest_list__row:nth-child(2n) {
  background-color: #fff;
}
.page_container .right .guest_list__row.rowtip {
  background-color: #fff;
  line-height: 30px;
  color: rgba(0,0,0,.5);
  font-size: 22px;
}
.page_container .right .guest_list__td {}
.page_container .right .guest_list__td .tx {
  line-height: 30px;
  color: rgba(16,16,16,1);
  font-size: 22px;
  text-align: center;
  font-family: PingFangSC-regular;
  box-sizing: border-box;
  padding: 0 5px;
}
.page_container .right .guest_list__td .icon {
  width: 20px;
  height: 20px;
  display: block;
}
.page_container .right .guest_list__td .icon .img {
.page_container .right_block .guest_box {
  margin-top: 0;
  width: 100%;
  height: 100%;
}
.page_container .right .guest_list__td:nth-child(1) {
  width: 19.54%;
}
.page_container .right .guest_list__td:nth-child(2) {
  width: 21.86%;
}
.page_container .right .guest_list__td:nth-child(3) {
  width: 46.06%;
}
.page_container .right .guest_list__td:nth-child(4) {
  width: 12.54%;
}
.page_container .right .room_info {
  width: 100%;
  border-radius: 10px;
  background-color: rgba(255,255,255,0.3);
}
.page_container .right .room_info .staff_box {
  margin-top: 30px;
}
.page_container .right .room_info .staff_box_item {
  height: 180px;
}
.page_container .right .room_info .staff_box_item:nth-child(1) {
  background-color: rgba(255,255,255,0.1);
}
.page_container .right .room_info .staff_box_item:nth-child(2) {
  background-color: rgba(255,255,255,0.3);
  margin: 0 10px;
}
.page_container .right .room_info .staff_box_item:nth-child(3) {
  background-color: rgba(255,255,255,0.1);
}
.page_container .right .room_info .staff_box_item__title {
  line-height: 28px;
  color: rgba(255,255,255,1);
  font-size: 20px;
  text-align: center;
  font-family: PingFangSC-regular;
}
.page_container .right .room_info .staff_box_item__name {
  line-height: 56px;
  color: rgba(255,255,255,1);
  font-size: 40px;
  text-align: center;
  font-family: PingFangSC-medium;
  margin-top: 5px;
}
.page_container .right .room_info .room_info_project {
  padding: 36px 20px 20px 20px;
  height: 138px;
  box-sizing: border-box;
  overflow: hidden;
}
.page_container .right .room_info .room_info_project_block {
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  overflow: auto;
}
.page_container .right .room_info .room_info_project .tx {
  line-height: 39px;
  color: rgba(255,255,255,1);
  font-size: 28px;
  text-align: center;
  font-family: PingFangSC-regular;
}
.page_container .right .guest_box {
  margin-top: 65px;
  width: 100%;
  height: 345px;
  background-color: #fff;
  overflow: hidden;
  -webkit-flex-flow: column;
  flex-flow: column;
  display: box;
  display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
  display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox;      /* TWEENER - IE 10 */
  display: -webkit-flex;     /* NEW - Chrome */
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
}
</style>