From c6d3157eb616116c84d35e221ed9c57ef8da0ad6 Mon Sep 17 00:00:00 2001 From: long <515897141@qq.com> Date: 星期四, 01 二月 2024 16:24:11 +0800 Subject: [PATCH] 操作频繁锁(60秒) --- src/pages/room/detail.vue | 1026 +++++++++++++++++++++++++++++++++++++++++++------------- 1 files changed, 785 insertions(+), 241 deletions(-) diff --git a/src/pages/room/detail.vue b/src/pages/room/detail.vue index 9490937..b385645 100644 --- a/src/pages/room/detail.vue +++ b/src/pages/room/detail.vue @@ -1,13 +1,18 @@ <!--room-detail.vue--> <template> - <div class="page"> + <div class="page flex flex-col"> <div class="page_header flex flex-ver"> - <div class="left flex flex-ver"> - <img class="page_logo_1" src="../../assets/img/logo_1.png"> - <img class="page_logo_2" src="../../assets/img/logo_2.png"> + <div class="left flex flex-ver" @click="back"> + <div class="page_logo_1"> + <img class="img" src="static/imgs/logo_1.png"> + </div> + <div class="page_logo_2"> + <img class="img" src="static/imgs/logo_2.png"> + </div> </div> <div class="right flex-1 flex flex-jcfe flex-ver"> - <div class="reset_btn flex flex-center">閲嶇疆鎴块棿鐘舵��</div> + <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> <div class="page_day">{{ timeObj.date }}</div> @@ -16,34 +21,45 @@ <!-- <div class="page_time">{{ timeObj.time }}</div> --> </div> </div> + <div class="page_header_placeholer" /> <!-- 鏈湁瀹夋帓 --> - <div class="page_container flex flex-ver hide"> - <div class="main flex-1"> - <div class="room_title">VIP-璇婄枟瀹�-1</div> - <div class="room_main_tip" style="margin-top: 93px;line-height: 186px;font-size: 140px;">-浣跨敤涓�-</div> + <div v-if="(!occupyInfoViewArr || !occupyInfoViewArr.length) && (!assignTreatListView || !assignTreatListView.length)" class="page_container flex flex-1"> + <div class="main flex-1 flex flex-col"> + <div v-if="roomInfo && roomInfo.roomNo" class="room_title">{{ roomInfo.roomNo }}</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="绌洪棽"> + <div class="btn_box__item flex flex-center white" data-tx="绌洪棽" data-status="0" @click="statusChg"> <div class="flex flex-ver"> - <img class="icon" src="../../assets/img/free.png"> + <div class="icon"> + <img class="img" src="static/imgs/free.png"> + </div> <div class="tx">绌洪棽</div> </div> </div> - <div class="btn_box__item flex flex-center blue" data-tx="浣跨敤涓�"> + <div class="btn_box__item flex flex-center blue" data-tx="浣跨敤涓�" data-status="1" @click="statusChg"> <div class="flex flex-ver"> - <img class="icon" src="../../assets/img/using.png"> + <div class="icon"> + <img class="img" src="static/imgs/using.png"> + </div> <div class="tx white">浣跨敤涓�</div> </div> </div> - <div class="btn_box__item flex flex-center yellow" data-tx="瀹汉浼戞伅"> + <div class="btn_box__item flex flex-center yellow" data-tx="瀹汉浼戞伅" data-status="2" @click="statusChg"> <div class="flex flex-ver"> - <img class="icon" src="../../assets/img/rest.png"> + <div class="icon"> + <img class="img" src="static/imgs/rest.png"> + </div> <div class="tx">瀹汉浼戞伅</div> </div> </div> - <div class="btn_box__item flex flex-center gray" data-tx="閫氱煡鎵撴壂"> + <div class="btn_box__item flex flex-center gray" data-tx="閫氱煡鎵撴壂" data-status="3" @click="statusChg"> <div class="flex flex-ver"> - <img class="icon" src="../../assets/img/clear.png"> + <div class="icon"> + <img class="img" src="static/imgs/clear.png"> + </div> <div class="tx">閫氱煡鎵撴壂</div> </div> </div> @@ -51,155 +67,719 @@ </div> </div> </div> - <!-- 娌℃湁榛樿瀹汉鍜屾湁瀹夋帓 --> - <div class="page_container flex flex-ver hide"> + <!-- 娌℃湁瀹汉鍜屾湁瀹夋帓 --> + <div v-if="(!occupyInfoViewArr || !occupyInfoViewArr.length) && (assignTreatListView && assignTreatListView.length)" class="page_container flex flex-1"> <div class="main flex-1"> - <div class="room_title">VIP-璇婄枟瀹�-1</div> - <div class="room_main_tip">-浣跨敤涓�-</div> - <div class="room_left_btn_box flex flex-ver"> - <div class="room_left_btn_box__item flex-1 flex flex-center yellow">瀹汉浼戞伅</div> - <div class="room_left_btn_box__item flex-1 flex flex-center gray">閫氱煡鎵撴壂</div> - <!-- <div class="room_left_btn_box__item flex flex-center green">閫氱煡鎵撴壂</div> --> - <!-- <div class="room_left_btn_box__item flex flex-center green">缁撴潫鎵撴壂</div> --> + <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-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"> - <div class="right_block flex flex-col"> - <div class="guest_title flex flex-center">绛夊緟璇婄枟</div> - <div class="guest_block flex-1"> - <div class="guest_list"> - <div v-for="(item, index) in list" :key="index" class="guest_list__row flex flex-ver"> - <div class="guest_list__td flex flex-center"> - <div> - <div class="tx">寮�*姘�</div> - <div class="tx" style="font-size: 14px;line-height: 20px;">2300000000</div> - </div> - </div> - <div class="guest_list__td flex flex-center"> - <span class="tx">15:00寮�濮�</span> - </div> - <div class="guest_list__td flex flex-center"> - <span class="tx">寮犳��姘�(鍖荤敓)銆佸紶鎬�姘�(鎶ゅ+)</span> - </div> - <div class="guest_list__td flex flex-center"> - <img class="icon" src="../../assets/img/choose.png"> - </div> - </div> - </div> - </div> + <div class="right_block"> + <XioRoomGuestBox ref="XioRoomGuestBox" :assign-treat-list-view-com="assignTreatListView" @selectCustomer="selectCustomer" /> </div> </div> </div> - <!-- 榛樿瀹汉鍜屾湁瀹夋帓 --> - <div class="page_container flex flex-ver"> - <div class="main flex-1"> - <div class="room_title">VIP-璇婄枟瀹�-1</div> - <div class="room_content"> - <div class="tip">璇婄枟瀹夋帓</div> - <div class="name">寮犳��姘�</div> - <div class="ciq">(2300000000)</div> - <div class="time">瀹夋帓娌荤枟鏃堕棿锛�13:30 寮�濮�</div> - </div> - <div class="room_left_btn_box flex flex-ver" style="margin-top: 105px;"> - <div class="room_left_btn_box__item flex flex-center green btn_ani">寮�濮嬫不鐤�</div> - <!-- <div class="room_left_btn_box__item flex-1 flex flex-center yellow">瀹汉浼戞伅</div> - <div class="room_left_btn_box__item flex-1 flex flex-center gray">閫氱煡鎵撴壂</div> --> - <!-- <div class="room_left_btn_box__item flex flex-center green">閫氱煡鎵撴壂</div> --> - <!-- <div class="room_left_btn_box__item flex flex-center green">缁撴潫鎵撴壂</div> --> + <!-- 瀹汉鍜屾湁瀹夋帓 over-width --> + <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 && 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" /> </div> </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">寮犳��姘�</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">寮犲尰鐢�</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">寮犳姢澹�</div> - </div> - </div> - </div> - <div class="room_info_project"> - <div class="room_info_project_block"> - <div class="tx">phis-Fotona 瓒匳鍏夈�乸his-琛ユ按瀚╄偆(F)娑傛姽</div> - </div> - </div> + <div v-for="(item,index) in occupyInfoViewArr" :key="index" class="flex-1 right_room_info"> + <XioRoomInfoBlock ref="XioRoomInfoBlock" :occupy-info-view="item" :occupy-info-view-arr="occupyInfoViewArr" /> </div> - <div class="guest_box flex flex-col"> - <div class="guest_title flex flex-center">绛夊緟璇婄枟</div> - <div class="guest_block flex-1"> - <div class="guest_list"> - <div v-for="(item, index) in list" :key="index" class="guest_list__row flex flex-ver"> - <div class="guest_list__td flex flex-center"> - <div> - <div class="tx">寮�*姘�</div> - <div class="tx" style="font-size: 14px;line-height: 20px;">2300000000</div> - </div> - </div> - <div class="guest_list__td flex flex-center"> - <span class="tx">15:00寮�濮�</span> - </div> - <div class="guest_list__td flex flex-center"> - <span class="tx">寮犳��姘�(鍖荤敓)銆佸紶鎬�姘�(鎶ゅ+)</span> - </div> - <div class="guest_list__td flex flex-center"> - <img class="icon" src="../../assets/img/choose.png"> - </div> - </div> - </div> - </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" /> </div> </div> </div> - <XioCustomerSelect ref="XioCustomerSelect"></XioCustomerSelect> + <!-- 閫夋嫨瀹汉寮圭獥 --> + <XioCustomerSelect ref="XioCustomerSelect" @cancel="selectCustomerCancel" @submit="selectCustomerSubmit" /> + <!-- 鏇存敼鎴块棿鐘舵�佺獥 --> + <XioRoomStatusChg ref="XioRoomStatusChg" @changeStatus="changeStatus" /> + <!-- MIC閫氱煡鍗搁夯 --> + <!-- <XioRoomOffNarcosisNotice ref="XioRoomOffNarcosisNotice" @confirm="offNarcosisNoticeConfirm" /> --> </div> </template> <script> +// 绌洪棽 0 +// 浣跨敤涓� 1 +// 瀹汉浼戞伅 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' +// 鏇存敼鎴块棿鐘舵�佺獥 +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// 宸蹭娇鐢ㄩ粯璁ゅ浜哄悗鎴块棿鏄惁鏈夋敼鍙樼姸鎬� export default { name: 'RoomDetail', components: { - XioCustomerSelect + XioRoomGuestInfoBox, + XioRoomInfoBlock, + XioRoomGuestBox, + XioCustomerSelect, + XioRoomStatusChg + // XioRoomOffNarcosisNotice }, inject: ['noop'], data() { return { - list: ['', '', '', '', '', '', '', '', '', '', '', '', '', '', '', '', '', '', '', ''], - timeObj: {}// week锛氭槦鏈燂紝date锛氬勾鏈堟棩锛宼imeMin锛氭椂鍒嗭紝time锛氭椂鍒嗙锛宼imeStamp锛氭椂闂存埑 + id: this.$route.query.id || '', + roomInfo: {}, + occupyInfo: '', // 褰撳墠鍗犵敤浜虹殑淇℃伅 + assignTreatList: [], + statusTx: ['绌洪棽', '浣跨敤涓�', '瀹汉浼戞伅', '鎵撴壂涓�', '鏁烽夯涓�'], + timeObj: {}, // week锛氭槦鏈燂紝date锛氬勾鏈堟棩锛宼imeMin锛氭椂鍒嗭紝time锛氭椂鍒嗙锛宼imeStamp锛氭椂闂存埑 + curTreatId: '', + curTreatIds: '', // 宸查�変腑鐨勬不鐤楄褰昳d鏁扮粍 + offNarcosisIds: [], // 鏄惁宸查�氱煡鍗搁夯鐨勭敤鎴穒d鏁扮粍 + // isShowAppellationName: true // 鏄惁鏄剧ず绉拌皳 + + // 60绉掑垏鎹㈢姸鎬侀攣 鈫撯啌鈫撯啌鈫撯啌鈫撯啌鈫撯啌 + setStatusLock: false, // 鏇存柊鐘舵�侀攣 + setStatusLockDuration: 60000, // 鏇存柊鐘舵�侀攣鏃堕棿 + setStatusLockTimer: null + // 60绉掑垏鎹㈢姸鎬侀攣 鈫戔啈鈫戔啈鈫戔啈鈫戔啈鈫戔啈 } }, computed: { - + // 褰撳墠宸查�夋嫨鐢ㄦ埛鐨勬暟缁勬暟鎹� + occupyInfoViewArr() { + if (this.occupyInfo && this.occupyInfo.length) { + return this.occupyInfoViewArrIdsHandleArr() + } else { + if (this.curTreatIds && this.curTreatIds.length) { + return this.getCurTreatArr(this.curTreatIds) + } 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) + // 鏈夊綋鍓嶉�変腑鐨勶紝鏍规嵁闇�姹備慨鏀瑰鍔犻�変腑涓嶆洿鏀圭姸鎬侊紝鐢辩┖闂插紑濮� + if (this.curTreatId) { + return this.gatCurTreatInfo() + } else { + // 鏈夊崰鐢� + if (this.occupyInfo) { + return this.occupyInfo + // 娌℃湁鍗犵敤 + } else { + // 杩樻病浣跨敤榛樿瀹汉鍊兼垨鑰呭凡浣跨敤榛樿瀹汉鍊艰繕娌℃敼鍙樼姸鎬侊紙閫傞厤杞锛� + if ((!isUseDefault || (isUseDefault && isUseDefaultChg === 0)) && this.assignTreatList && this.assignTreatList.length) { + // isUseDefault = true + return this.assignTreatList[0] + // 宸蹭娇鐢ㄨ繃榛樿瀹汉鍊� + } else { + return '' + } + } + } + }, + // 璇ユ不鐤楀鐢ㄦ埛鍒楄〃 + assignTreatListView() { + if (this.assignTreatList && this.assignTreatList.length) { + this.assignTreatList.forEach((o) => { + if (this.occupyInfoViewArr && this.occupyInfoViewArr.length) { + this.occupyInfoViewArr.forEach((_o) => { + if (_o.id === o.id) { + o.act = true + } + }) + } + }) + return this.assignTreatList + } else { + return [] + } + } }, - mounted() { + activated() { console.log('roomDetail mounted') + // 璁板綍褰撳墠鐨勬不鐤桰D + // var curTreatId = localStorage.getItem('curTreatId') + // 璁板綍褰撳墠鐨勬不鐤楄褰旾D鏁扮粍 + var curTreatIds = localStorage.getItem('curTreatIds') + // 鍗搁夯鐩稿叧 + var localOffNarcosisIds = localStorage.getItem('offNarcosisIds') + // 鑾峰彇鏄惁宸查�氱煡鍗搁夯鏁扮粍 + if (localOffNarcosisIds) { + this.offNarcosisIds = JSON.parse(localOffNarcosisIds) + } else { + this.offNarcosisIds = [] + this.setLocalStorageOffNarcosisIds() + } + // 娌荤枟璁板綍ID鏁扮粍 + if (curTreatIds) { + try { + this.curTreatIds = JSON.parse(curTreatIds) + } catch (error) { + this.curTreatIds = '' + } + } + // this.curTreatId = curTreatId || '' + // 娌荤枟瀹d + this.id = this.$route.query.id || '' this.init() }, + mounted() {}, destroyed() { }, methods: { init() { + // 杩涘叆椤甸潰鍏堝垵濮嬪寲甯搁噺鏍囪瘑 + isUseDefault = false + isUseDefaultChg = 0 + // 璁℃椂 this.countGetTime(this, 'timeObj', 'detail') + // 杞getData锛�8绉掍竴娆� + this.pollingAjaxFn(this, 'getData', 'detail', 8000) + // this.getData() + }, + // 鍒濆榛樿閫夋嫨鐨刬d鏁扮粍澶勭悊 + occupyInfoViewArrIdsHandle(item) { + if (!this.curTreatIds) { + this.curTreatIds = [] + } + this.curTreatIds.push(item.id) + this.setLocalCurTreatIds() + }, + // 鍒濆榛樿閫夋嫨鐨刬d鏁扮粍澶勭悊 + 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)) + }, + // 鍗搁夯閫氱煡纭 + // 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() + // } + // }, + // // 鏄剧ず閫氱煡鍗搁夯寮圭獥 + // showOffNarcosisNotice() { + // // 鎵撳紑寮圭獥 + // this.$refs['XioRoomOffNarcosisNotice'].showDialog() + // }, + // 鏄剧ず閫氱煡鍗搁夯寮圭獥锛堝涓級 + showOffNarcosisNoticeMulti(id) { + // 鎵撳紑寮圭獥锛屽姩鎬佺殑ref瀵硅薄鑾峰彇 + // eslint-disable-next-line no-eval + var ref = eval('this.$refs.XioRoomGuestInfoBox_' + id)[0] + ref.showOffNarcosisNotice() + }, + // 鐐瑰嚮鏄剧ず闅愯棌绉拌皳 + // 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) + } + }) + } + }) + // 鍩烘湰涓嶄細鍑虹幇杩欑鎯呭喌锛屼絾鏄互闃蹭竾涓�锛岃嫢鏈湴缂撳瓨id瀛樺湪锛屼絾瀵逛笉涓婂垪琛ㄥ垯缂撳瓨绗竴鏉℃暟鎹甶d + if (!arr.length) { + arr.push(this.assignTreatList[0]) + this.curTreatIds = [] + this.curTreatIds.push(this.assignTreatList[0].id) + this.setLocalCurTreatIds() + } + } + return arr + }, + // 鑾峰彇褰撳墠娌荤枟淇℃伅 + gatCurTreatInfo() { + if (this.assignTreatList && this.assignTreatList.length) { + return this.assignTreatList.find((o) => { return o.id === this.curTreatId }) + } + }, + // 鍒锋柊娴忚鍣ㄩ〉闈� + resetPage() { + window.location.reload() + }, + // 鑾峰彇鎴块棿璇︽儏 + getData() { + var params = {} + // 鎴块棿id + if (this.id) { + params.shopRoomId = this.id + } + Req.http.post({ + url: 'guide/treat/screen/room/info', + data: params, + udData: { noLoading: true }, + header: { 'Content-Type': 'application/json' }, + mockData: { + code: 100, + msg: '', + data: { + roomInfo: { + roomNo: 'xx', + status: 0 // 0绌洪棽 1浣跨敤 2浼戞伅 3鎵撴壂 4 鏁烽夯涓� + }, + assignTreatList: [ + { + id: 'a111', + startTime: '2023-12-08 00:00:00', + userName: '榛勫槈鑽�', + gender: 1, + hempStatus: 2, + treatRoomStatus: 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: 2, + treatRoomStatus: 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: 2, + treatRoomStatus: 0, + ciq: '789', + adviserName: 'g鍚�', + aDoctorName: 'h鍚�', + aNurseName: 'i鍚�', + projectName: 'xxxxXXxxx', + userId: '333' + } + ], + occupyInfo: null + } + } + }).then((res) => { + if (res && res.data) { + if (res.data.assignTreatList && res.data.assignTreatList.length) { + 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.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] : '濂冲+'}` + }) + } + 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] + } + } + // console.log('999999999999999999999999999', res) + // 鍗搁夯寮圭獥閫昏緫 + var offNarcosisTimer = null + offNarcosisTimer = setTimeout(() => { + console.log('================================>鍒ゆ柇鍗搁夯寮圭獥', this.occupyInfoViewArr, 'offNarcosisIds:', this.offNarcosisIds) + if (this.occupyInfoViewArr && this.occupyInfoViewArr.length && this.offNarcosisIds) { + this.occupyInfoViewArr.forEach((o) => { + // 鍒ゆ柇鏀圭敤鎴锋槸鍚﹀脊鍑鸿繃鍗搁夯寮圭獥 + var flag + flag = this.offNarcosisIds.find((_o) => { return _o === o.userId }) + // 鐘舵��2涓旀病鏈夊脊鍑鸿繃寮圭獥 + if (o.hempStatus === 2 && !flag) { + // 寮瑰嚭瀵瑰簲id寮圭獥 + this.showOffNarcosisNoticeMulti(o.id) + } + }) + } + clearTimeout(offNarcosisTimer) + offNarcosisTimer = null + }, 500) + }) + }, + // 杩斿洖 + back() { + // 閲嶇疆榛樿宸蹭娇鐢ㄥ浜虹殑鍙傛暟 + isUseDefault = false + isUseDefaultChg = 0 + // 鍏抽棴璁℃椂 + this.stopCountGetTime('detail') + // 鍏抽棴杞 + this.stopPollingAjaxFn('detail') + // 杩斿洖 + // console.log('111111111', this.$route.meta.isPush) + if (this.$route && this.$route.meta && this.$route.meta.isPush) { + this.$router.go(-1) + } else { + this.$router.push({ + path: `/` + }) + } + }, + // 鏈湁瀹夋帓鐩存帴鐘舵�佸彉鏇� + statusChg(e) { + var { tx, status } = e.currentTarget.dataset + // var { occupyInfoView, roomInfo } = this + console.log('==========================>娌℃湁瀹夋帓鏃舵病鏈夊浜虹洿鎺ュ彉鏇寸姸鎬�', tx, status) + // if (roomInfo && status * 1 == roomInfo.status) { + // return + // } + this.changeStatusFn({}, status, () => { + this.getData() + }) + }, + // 娌℃湁瀹汉鐨勬寜娴佺▼璁剧疆鎴块棿鐘舵�� + setStatus(tx, status) { + // var { occupyInfoView, roomInfo } = this + console.log('============================>鏈夊畨鎺掓病鏈夊浜鸿缃埧闂寸姸鎬�', tx, status) + this.changeStatusFn({}, status, () => { + // 鍒锋柊璇︽儏 + this.getData() + }) + }, + // 鎸夋祦绋嬭缃埧闂寸姸鎬侊紙缁勪欢锛� + setComStatus(opt) { + // var { occupyInfoView, roomInfo } = this + console.log('============================>瀹汉淇℃伅缁勪欢鐐瑰嚮鏇存敼鐘舵��', opt.tx, opt.status, opt.item) + this.changeStatusFn(opt.item, opt.status, () => { + // 鍒锋柊璇︽儏 + this.getData() + }) + }, + // 鏀瑰彉鎴块棿鐘舵�佸紓姝ユ柟娉� + changeStatusFn(item = {}, status, cb) { + // 鏈В閿� 20240201 long + if (this.setStatusLock) { + return this.$messageWarn('鎿嶄綔棰戠箒锛岃绋嶅悗鍐嶈瘯') + } + this.setStatusLock = true + clearInterval(this.setStatusLockTimer) + this.setStatusLockTimer = null + + var params = {} + // 鎴块棿id + if (this.id) { + params.shopRoomId = this.id + } + // 娌荤枟璁板綍id this.curTreatIds occupyInfoViewArr + // 1.浣跨敤涓�/鏁烽夯涓� 鏁烽夯涓� 2 浜哄崰鐢� + // 2.浣跨敤涓�/浣跨敤涓� 浣跨敤涓� 2 浜哄崰鐢� + // 3.浣跨敤涓�/浼戞伅涓� 浣跨敤涓� 1 浜哄崰鐢� + var arr = JSON.parse(JSON.stringify(this.occupyInfoViewArr)) + if (item && 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, + header: { 'Content-Type': 'application/json' }, + mockData: { + code: 100, + msg: '', + data: {} + } + }).then((res) => { + // 鍦ㄥ凡鏈夐粯璁ゅ浜虹殑鎯呭喌涓嬶紝鏀瑰彉鐘舵�佹洿鏀规爣璇嗭紙閫傞厤杞锛� + if (isUseDefault) { + console.log('鍦ㄥ凡鏈夐粯璁ゅ浜虹殑鎯呭喌涓嬶紝鏀瑰彉鐘舵�佹洿鏀规爣璇�') + isUseDefaultChg = 1 + } + // 鍙鏇存敼涓虹┖闂插氨閲嶇疆鍙傛暟 + if (params.status === 0) { + console.log('鎴块棿鏇存敼涓虹┖闂�') + // 閲嶇疆榛樿宸蹭娇鐢ㄥ浜虹殑鍙傛暟 + isUseDefault = false + isUseDefaultChg = 0 + // this.isShowAppellationName = true + } + // console.log('8888888888888888888888888888888888', res) + cb && cb() + + // 30s鍚庤В閿� 20240201 long + this.setStatusLockTimer = setInterval(() => { + this.setStatusLock = false + }, this.setStatusLockDuration) + }, () => { + setTimeout(() => { + this.setStatusLock = false + }, 1000) + }) + }, + // 閲嶇疆鐘舵�� + resetStatus() { + // 鎵撳紑寮圭獥 + this.$refs['XioRoomStatusChg'].showDialog() + }, + // 鏇存敼鎴块棿鐘舵�侊紙閲嶇疆鐘舵�佺殑鏇存敼鏂规硶锛� + changeStatus(opt) { + // var { occupyInfoView, roomInfo } = this + console.log('============================>閲嶇疆鎴块棿鐘舵��', opt.statusTx, opt.status) + // if (roomInfo && opt.status * 1 == roomInfo.status) { + // return + // } + // 娓呴櫎閫変腑鍖荤枟璁板綍id + // localStorage.removeItem('curTreatId') + // this.curTreatId = '' + // 娓呴櫎閫変腑鍖荤枟璁板綍ids鏁扮粍 + localStorage.removeItem('curTreatIds') + this.curTreatIds = '' + // 鍙樻洿鎴块棿鐘舵�佹柟娉� + this.changeStatusFn({}, opt.status, () => { + // 鍒锋柊璇︽儏 + this.getData() + // 鍏抽棴寮圭獥 + this.$refs['XioRoomStatusChg'].hideDialog() + }) + }, + // 閫夋嫨瀹㈡埛 + selectCustomer(item = {}) { + if (item.act) { + return + } + // 鎵撳紑寮圭獥 + this.$refs['XioCustomerSelect'].showDialog() + // 缁勪欢瀹㈡埛鏁版嵁澶勭悊 + this.$refs['XioCustomerSelect'].dataInit(item) + }, + // 閫夋嫨瀹㈡埛鍙栨秷 + selectCustomerCancel(opt) { + console.log('cancel', opt) + this.$refs['XioCustomerSelect'].hideDialog() + }, + // 閫夋嫨瀹㈡埛纭畾 + selectCustomerSubmit(opt) { + console.log('=======================>submit', opt) + // 纭畾閫夋嫨鐨勭敤鎴凤紝璁板綍id + // localStorage.setItem('curTreatId', opt.id) + // this.curTreatId = opt.id + // 褰撳墠閫夋嫨瀹㈡埛鐨勬暟缁勫鍔犲鎴� + this.occupyInfoViewArrDataHandle('add', opt) + // 閲嶇疆鎴块棿鐘舵�� + // if (this.roomInfo) { + // this.changeStatusFn({}, 0, () => { + // // 鍒锋柊璇︽儏 + // this.getData() + // }) + // } + // 鍏抽棴寮圭獥 + this.$refs['XioCustomerSelect'].hideDialog() + }, + // 鍒犻櫎宸查�夋嫨鐨勫鎴锋暟鎹� + cancelCustomerItem(item) { + // 褰撳墠閫夋嫨瀹㈡埛鐨勬暟缁勫垹闄ゅ鎴� + this.occupyInfoViewArrDataHandle('cancel', item, true) + }, + // 褰撳墠閫夋嫨瀹㈡埛鐨勬暟缁勫鍒犲鐞嗘柟娉� + occupyInfoViewArrDataHandle(key, item, isReset) { + // 澧炲姞锛堥�夋嫨锛� + if (key === 'add') { + // id鏁扮粍澶勭悊 + if (this.curTreatIds && this.curTreatIds.length) { + // 褰撳墠娌荤枟璁板綍id娌℃湁鎵�閫夌敤鎴风殑娌荤枟璁板綍id + var flag = this.curTreatIds.find((o) => { return o === item.id }) + if (!flag) { + this.curTreatIds.push(item.id) + } + // 缂撳瓨 + this.setLocalCurTreatIds() + } + if (this.curTreatIds && !this.curTreatIds.length) { + this.curTreatIds.push(item.id) + // 缂撳瓨 + this.setLocalCurTreatIds() + } + // 鏁扮粍鏁版嵁澶勭悊 + // if (this.occupyInfoViewArr && this.occupyInfoViewArr.length) { + // this.occupyInfoViewArr.push(item) + // } + } + // 鍒犻櫎 + if (key === 'cancel') { + // id鏁扮粍澶勭悊 + if (this.curTreatIds && this.curTreatIds.length) { + // 娣卞鍒� + var ids = JSON.parse(JSON.stringify(this.curTreatIds)) + this.curTreatIds = ids.filter((o) => { return o !== item.id }) + // 缂撳瓨 + this.setLocalCurTreatIds() + // 鍒锋柊 + if (isReset) { + // 鍒锋柊璇︽儏 + this.getData() + } + } + // 鏁扮粍鏁版嵁澶勭悊 + // if (this.occupyInfoViewArr && this.occupyInfoViewArr.length) { + // // 娣卞鍒� + // var arr = JSON.parse(JSON.stringify(this.occupyInfoViewArr)) + // this.occupyInfoViewArr = arr.filter((o) => { o.id !== item.id }) + // } + } + }, + // 璁剧疆鏈湴缂撳瓨ids鏁扮粍 + setLocalCurTreatIds() { + localStorage.setItem('curTreatIds', JSON.stringify(this.curTreatIds)) } } } </script> +<style> +.el-popper.top_tx { + text-align: center; + font-size: 25px; +} +</style> + <style scoped> +.page{ + overflow: auto; +} +.page_header_placeholer { + height: 100px; + width: 100%; + display: block; + flex-shrink: 0; +} +.page_header { + position: fixed; + top: 0; + left: 23px; + right: 23px; + z-index: 1; +} .page_header .reset_btn { width: 200px; height: 60px; @@ -210,15 +790,40 @@ font-size: 24px; text-align: center; font-family: Microsoft Yahei; + cursor: pointer; + border: 0; + margin-left: 20px; +} +.page_container.over-width { + width: 150%; } .page_container .main { - height: 100%; + /* height: 100%; */ border-radius: 10px; background-color: rgba(255,255,255,1); color: rgba(16,16,16,1); font-size: 14px; /* text-align: center; */ font-family: Roboto; + position: relative; +} +.page_container.over-width .main { + margin-right: 50px; +} +.page_container.over-width .main:last-child { + margin-right: 0; +} +.page_container .main .cancel_icon_block { + width: 50px; + height: 50px; + position: absolute; + top: 12px; + right: 11px; + z-index: 1; +} +.page_container .main .cancel_icon_block .img { + width: 100%; + height: 100%; } .page_container .main .room_title { line-height: 50px; @@ -244,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; @@ -252,6 +858,7 @@ border-radius: 10px; box-shadow: 0px 2px 6px 0px rgba(206,206,206,1); margin-right: 70px; + cursor: pointer; } .page_container .main .btn_box__item:last-child { margin-right: 0; @@ -274,6 +881,10 @@ display: block; margin-right: 17px; } +.page_container .main .btn_box__item .icon .img { + width: 100%; + height: 100%; +} .page_container .main .btn_box__item .tx { line-height: 37px; color: rgba(51,51,51,1); @@ -289,6 +900,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; @@ -298,9 +919,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); @@ -310,15 +931,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; @@ -337,6 +955,22 @@ text-align: center; font-family: PingFangSC-medium; margin-top: 13px; +} +.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; @@ -358,122 +992,32 @@ .page_container .right { width: 686px; margin-left: 30px; - height: 100%; + /* height: 100%; */ +} +.page_container.over-width .right_room_info { + margin-bottom: 58px; +} +.page_container.over-width .right_room_info:last-child { + margin-bottom: 0; } .page_container .right_block { 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 { - 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__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; -} -.page_container .right .guest_list__td .icon { - width: 20px; - height: 20px; - display: block; -} -.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; +.page_container .right_block .guest_box { + margin-top: 0; 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> -- Gitblit v1.8.0