~chenshaoxiong/treatment_room_screen.git

long

2024-02-04 ae5ea1a3d06324d85f4b04f17bac0dc5572a5a8f

提交 \| 用户 \| age
459990	1	<template>
908dad	2	<div class="guest_info_box flex flex-col">
459990	3	<div v-if="roomInfo && roomInfo.roomNo" class="room_title">{{ roomInfo.roomNo }}</div>
908dad	4	<div class="room_content flex-1">
459990	5	<div class="tip">诊疗安排</div>
J	6	<!-- <div class="name">{{ occupyInfoView.userName }}</div> appellationName -->
	7	<div v-show="isShowAppellationName" class="flex flex-center">
	8	<div class="flex flex-ver">
	9	<div class="name">{{ occupyInfoView.appellationName }}</div>
	10	<div class="name_icon" @click="tapAppellationHandle">
	11	<img class="img" src="static/imgs/eye.png">
	12	</div>
	13	</div>
	14	</div>
	15	<div v-show="!isShowAppellationName" class="flex flex-center">
	16	<div class="flex flex-ver">
	17	<div class="name">
	18	<el-popover
	19	placement="top"
	20	width="400"
	21	popper-class="top_tx"
	22	trigger="click"
	23	:popper-options="{ removeOnDestroy: true }"
	24	>
	25	<div>{{ occupyInfoView.userName }}</div>
	26	<div slot="reference" class="tx ell">{{ occupyInfoView.userName }}</div>
	27	</el-popover>
	28	</div>
	29	<div class="name_icon" @click="tapAppellationHandle">
	30	<img class="img" src="static/imgs/eye.png">
	31	</div>
	32	</div>
	33	</div>
	34	<div v-if="occupyInfoView.ciq" class="ciq">({{ occupyInfoView.ciq }})</div>
	35	<div v-if="occupyInfoView.startTime" class="time">安排治疗时间：{{ occupyInfoView.startTime }} 开始</div>
	36	</div>
908dad	37	<div v-show="occupyInfoView" class="room_left_btn_box flex flex-ver">
12a2f1	38	<div v-show="occupyInfoView.treatRoomStatus == 0" class="room_left_btn_box__item flex flex-1 flex-center b-green btn_ani" @click="setStatus('敷麻中', 4, occupyInfoView)">开始敷麻</div>
J	39	<div v-show="occupyInfoView.treatRoomStatus == 0" class="room_left_btn_box__item flex flex-1 flex-center green btn_ani" style="margin-right: 0;" @click="setStatus('使用中', 1, occupyInfoView)">开始治疗</div>
	40	<div v-show="occupyInfoView.treatRoomStatus == 4" class="room_left_btn_box__item flex flex-center green btn_ani" @click="setStatus('使用中', 1, occupyInfoView)">开始治疗</div>
	41	<div v-show="occupyInfoView.treatRoomStatus == 1" class="room_left_btn_box__item flex-1 flex flex-center yellow btn_ani" @click="setStatus('客人休息', 2, occupyInfoView)">客人休息</div>
	42	<div v-show="occupyInfoView.treatRoomStatus == 1" class="room_left_btn_box__item flex-1 flex flex-center gray btn_ani" style="margin-right: 0;" @click="setStatus('打扫中', 3, occupyInfoView)">通知打扫</div>
	43	<div v-show="occupyInfoView.treatRoomStatus == 2" class="room_left_btn_box__item flex flex-center green btn_ani" @click="setStatus('打扫中', 3, occupyInfoView)">通知打扫</div>
	44	<div v-show="occupyInfoView.treatRoomStatus == 3" class="room_left_btn_box__item flex flex-center green btn_ani" @click="setStatus('空闲', 0, occupyInfoView)">结束打扫</div>
459990	45	</div>
583e10	46	<!-- MIC通知卸麻 -->
J	47	<XioRoomOffNarcosisNotice ref="XioRoomOffNarcosisNotice" @confirm="offNarcosisNoticeConfirm" />
459990	48	</div>
J	49	</template>
	50
	51	<script>
583e10	52	// 通知卸麻
J	53	import XioRoomOffNarcosisNotice from '@/components/xio_room_off_narcosis_notice'
459990	54	export default {
c1e103	55	name: 'XioRoomGuestInfoBox',
583e10	56	components: {
J	57	XioRoomOffNarcosisNotice
	58	},
459990	59	props: {
J	60	roomInfo: {
	61	type: Object,
	62	default: () => {
	63	return {}
	64	}
	65	},
	66	occupyInfoView: {
	67	type: [Object, Array],
	68	default: () => {
	69	return {}
	70	}
583e10	71	},
J	72	offNarcosisIds: {
	73	type: Array,
	74	default: () => {
	75	return []
	76	}
459990	77	}
J	78	},
	79	data() {
	80	return {
	81	isShowAppellationName: true
	82	}
	83	},
	84	methods: {
	85	noop() {
	86	return
	87	},
583e10	88	// 设置已通知卸麻id数组
J	89	setLocalStorageOffNarcosisIds() {
	90	localStorage.setItem('offNarcosisIds', JSON.stringify(this.offNarcosisIds))
	91	},
	92	// 卸麻通知确认
	93	offNarcosisNoticeConfirm() {
	94	if (this.occupyInfoView) {
	95	if (this.offNarcosisIds && this.offNarcosisIds.length) {
	96	var flag = this.offNarcosisIds.find((o) => { return o === this.occupyInfoView.userId })
	97	if (!flag) {
	98	this.offNarcosisIds.push(this.occupyInfoView.userId)
	99	}
	100	} else if (this.offNarcosisIds) {
	101	this.offNarcosisIds.push(this.occupyInfoView.userId)
	102	}
	103	this.setLocalStorageOffNarcosisIds()
	104	}
	105	},
	106	// 显示通知卸麻弹窗
	107	showOffNarcosisNotice() {
	108	// 打开弹窗
	109	this.$refs['XioRoomOffNarcosisNotice'].showDialog()
	110	this.$refs['XioRoomOffNarcosisNotice'].dataInit(this.occupyInfoView)
	111	},
459990	112	// 点击显示隐藏称谓
J	113	tapAppellationHandle() {
	114	this.isShowAppellationName = !this.isShowAppellationName
	115	},
583e10	116	setStatus(tx, status, item) {
J	117	this.$emit('setStatus', { tx, status, item })
459990	118	},
J	119	// 确认
	120	confirm() {
	121	this.isShow = false
	122	this.$emit('confirm', { })
	123	},
	124	// 显示弹窗
	125	showDialog() {
	126	this.isShow = true
	127	},
	128	// 关闭弹窗
	129	hideDialog() {
	130	this.isShow = false
	131	this.$emit('confirm', { })
	132	}
	133	}
	134	}
	135	</script>
	136
	137	<style scoped>
	138	.guest_info_box {
	139	width: 100%;
	140	height: 100%;
	141	box-sizing: border-box;
	142	padding-top: 39px;
583e10	143	position: relative;
459990	144	}
J	145	.guest_info_box .room_title {
	146	line-height: 50px;
	147	color: rgba(255,255,255,1);
	148	font-size: 36px;
	149	text-align: center;
	150	font-family: PingFangSC-medium;
	151	padding: 10px 0;
	152	background-color: rgba(34,123,235,1);
	153	width: 400px;
	154	margin: 0 auto 0 auto;
	155	}
	156	.guest_info_box .room_main_tip {
	157	line-height: 168px;
	158	font-size: 120px;
	159	color: rgba(46,77,124,1);
	160	text-align: center;
	161	font-family: PingFangSC-medium;
	162	margin-top: 107px;
	163	/* font-weight: bold; */
	164	}
	165	.guest_info_box .room_main_tip.gray {
	166	color: rgba(154,154,154,1);
	167	}
	168	.guest_info_box .btn_box {
	169	margin-top: 130px;
	170	}
	171	.guest_info_box .btn_box__item {
	172	width: 250px;
	173	height: 120px;
	174	border-radius: 10px;
	175	box-shadow: 0px 2px 6px 0px rgba(206,206,206,1);
	176	margin-right: 70px;
	177	cursor: pointer;
	178	}
	179	.guest_info_box .btn_box__item:last-child {
	180	margin-right: 0;
	181	}
	182	.guest_info_box .btn_box__item.white {
	183	background-color: rgba(255,255,255,1);
	184	}
	185	.guest_info_box .btn_box__item.blue {
	186	background-color: rgba(46,77,124,1);
	187	}
	188	.guest_info_box .btn_box__item.yellow {
	189	background-color: rgba(255,199,115,1);
	190	}
	191	.guest_info_box .btn_box__item.gray {
	192	background-color: rgba(206,206,206,1);
	193	}
	194	.guest_info_box .btn_box__item .icon {
	195	width: 60px;
	196	height: 60px;
	197	display: block;
	198	margin-right: 17px;
	199	}
	200	.guest_info_box .btn_box__item .icon .img {
	201	width: 100%;
	202	height: 100%;
	203	}
	204	.guest_info_box .btn_box__item .tx {
	205	line-height: 37px;
	206	color: rgba(51,51,51,1);
	207	font-size: 26px;
	208	text-align: center;
	209	font-family: PingFangSC-medium;
	210	}
	211	.guest_info_box .btn_box__item .tx.white {
	212	color: rgba(255,255,255,1);
	213	}
	214	.guest_info_box .room_left_btn_box {
	215	padding: 0 23px;
908dad	216	/* margin-top: 163px; */
L	217	margin-bottom: 40px;
459990	218	}
J	219	.guest_info_box .room_left_btn_box__item {
	220	width: 500px;
	221	height: 150px;
	222	line-height: 73px;
	223	border-radius: 10px;
	224	font-size: 50px;
	225	text-align: center;
	226	margin: auto;
	227	}
	228	.guest_info_box .room_left_btn_box__item.flex-1 {
	229	width: auto;
	230	height: 150px;
	231	line-height: 58px;
	232	border-radius: 10px;
	233	font-size: 40px;
	234	text-align: center;
	235	font-family: Microsoft Yahei;
	236	margin-right: 20px;
	237	font-weight: bold;
	238	}
	239	/* .guest_info_box .room_left_btn_box__item:last-child {
	240	margin-right: 0;
	241	} */
	242	.guest_info_box .room_left_btn_box__item.yellow {
	243	color: rgba(255,255,255,1);
	244	background-color: rgba(233,157,66,1);
	245	}
	246	.guest_info_box .room_left_btn_box__item.gray {
	247	background-color: rgba(206,206,206,1);
	248	color: rgba(79,79,79,1);
	249	}
	250	.guest_info_box .room_left_btn_box__item.green {
	251	background-color: rgba(47,174,206,1);
	252	color: rgba(255,255,255,1);
	253	}
	254	.guest_info_box .room_left_btn_box__item.b-green {
	255	background-color: rgba(79,167,114,1);
	256	color: rgba(255,255,255,1);
	257	}
	258	.guest_info_box .room_content {
	259	margin-top: 30px;
	260	}
	261	.guest_info_box .room_content .tip {
	262	line-height: 33px;
	263	color: rgba(79,79,79,1);
	264	font-size: 24px;
	265	text-align: center;
	266	font-family: PingFangSC-medium;
	267	}
	268	.guest_info_box .room_content .name {
	269	line-height: 168px;
	270	color: rgba(51,51,51,1);
	271	font-size: 120px;
	272	text-align: center;
	273	font-family: PingFangSC-medium;
	274	margin-top: 13px;
	275	}
	276	.guest_info_box .room_content .name .tx {
	277	max-width: 666px;
	278	margin: auto;
	279	text-align: center;
	280	}
	281	.guest_info_box .room_content .name_icon {
	282	width: 40px;
	283	height: 40px;
	284	display: block;
	285	margin-top: 13px;
	286	padding: 20px;
	287	}
	288	.guest_info_box .room_content .name_icon .img {
	289	width: 100%;
	290	height: 100%;
	291	}
	292	.guest_info_box .room_content .ciq {
	293	line-height: 42px;
	294	color: rgba(51,51,51,1);
	295	font-size: 30px;
	296	text-align: center;
	297	font-family: PingFangSC-regular;
	298	margin-top: -5px;
	299	}
	300	.guest_info_box .room_content .time {
	301	line-height: 42px;
	302	color: rgba(0,0,0,1);
	303	font-size: 30px;
	304	text-align: center;
	305	font-family: PingFangSC-medium;
	306	font-weight: bold;
	307	margin-top: 21px;
	308	}
	309	</style>