~chenshaoxiong/treatment_room_screen.git

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

jazz

2024-01-09 c1e10385c164520dceec34576ed506b28bad1e71

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