~chenshaoxiong/treatment_room_screen.git

long

2024-06-20 3fd2da453d30179571958c36153c6c0efe62ab9a

提交 \| 用户 \| age
3ac5f2	1	<!--room-list.vue-->
J	2	<template>
878885	3	<div class="page flex flex-col">
3ac5f2	4	<div class="page_header flex flex-ver">
878885	5	<div class="left flex flex-ver" @click="resetPage">
3fd2da	6	<!-- 全局标题图标配置！！！ -->
L	7	<div v-if="settingConfig.isLogo" class="page_logo_1">
601fbd	8	<!-- 全局标题图标配置！！！ -->
L	9	<img class="img" src="static/settingConfig/logo_1.png">
878885	10	</div>
601fbd	11	<!-- 全局标题图标配置！！！ -->
L	12	<div v-if="settingConfig.isLongLogo" class="page_logo_2">
	13	<!-- 全局标题图标配置！！！ -->
	14	<img class="img" src="static/settingConfig/logo_2.png">
878885	15	</div>
3ac5f2	16	</div>
1c200b	17	<div class="flex-1 flex flex-center">
J	18	<div class="select_shop_block flex flex-ver" @click="showChooseShop">
	19	<div v-if="!shopId" class="tx">请选择门店</div>
	20	<div v-if="shopId" class="tx">{{ shopName }}</div>
	21	<div class="icon_block">
	22	<img class="icon" src="static/imgs/down.png">
	23	</div>
	24	</div>
	25	</div>
	26	<div class="right flex flex-jcfe flex-ver">
	27	<!-- <div class="page_choose_shop">
6da3c1	28	<el-select v-model="shopId" placeholder="请选择" style="width:400px;" clearable @change="getRoomList">
J	29	<el-option v-for="item in shopList" :key="item.id" :label="item.name" :value="item.id" />
	30	</el-select>
1c200b	31	</div> -->
3ac5f2	32	<div class="page_date">
J	33	<div class="page_week">{{ timeObj.week }}</div>
	34	<div class="page_day">{{ timeObj.date }}</div>
	35	</div>
	36	<div class="page_time">{{ timeObj.timeMin }}</div>
	37	<!-- <div class="page_time">{{ timeObj.time }}</div> -->
	38	</div>
	39	</div>
878885	40	<div class="page_container flex-1 h1 flex flex-col">
J	41	<div class="list_container h1 flex-1 flex flex-col">
3ac5f2	42	<div class="list_container__title">请选择房间</div>
878885	43	<div class="list_block flex-1 h1">
6da3c1	44	<div v-if="list && list.length" class="list flex flex-ver flex-wrap">
3ac5f2	45	<!-- act -->
6da3c1	46	<div v-for="(item, index) in list" :key="index" class="list__item flex flex-center" @click="selectRoom(item)">{{ item.roomNo }}</div>
J	47	</div>
	48	<div v-if="!list \|\| !list.length" class="list flex flex-center">
	49	<!-- act -->
	50	<div class="notip flex flex-center">暂无数据</div>
3ac5f2	51	</div>
J	52	</div>
	53	</div>
	54	</div>
1c200b	55
J	56	<XioRoomListShopChg ref="XioRoomListShopChg" @confirm="confirmShop" />
3ac5f2	57	</div>
J	58	</template>
	59
	60	<script>
	61	// import Login from '../utils/jun_login.js'
6da3c1	62	import Req from '../../utils/jun_httpInstall' // http 请求
1d1095	63	// import xioFn from './utils/xio_fn.js'
1c200b	64	// 通知卸麻
J	65	import XioRoomListShopChg from '@/components/xio_room_list_shop_chg'
3ac5f2	66	export default {
J	67	name: 'RoomList',
1c200b	68	components: {
J	69	XioRoomListShopChg
	70	},
3ac5f2	71	inject: ['noop'],
J	72	data() {
	73	return {
6da3c1	74	shopList: [],
J	75	shopId: '',
1c200b	76	shopName: '',
6da3c1	77	list: [],
3ac5f2	78	timeObj: {}// week：星期，date：年月日，timeMin：时分，time：时分秒，timeStamp：时间戳
J	79	}
	80	},
	81	computed: {
	82
	83	},
bf4dca	84	activated() {},
3ac5f2	85	mounted() {
J	86	console.log('roomList mounted')
	87	this.init()
	88	},
	89	destroyed() {
	90
	91	},
	92	methods: {
1c200b	93	async init() {
cf3e3e	94	// 计时
bb2b08	95	this.countGetTime(this, 'timeObj', 'list')
1c200b	96	// await this.getShopList()
J	97	// this.getRoomList()
	98	this.showChooseShop()
	99	},
	100	// 确定选择门店
	101	confirmShop(item) {
	102	this.shopId = item.id
	103	this.shopName = item.name
6da3c1	104	this.getRoomList()
1c200b	105	},
J	106	// 显示选择门店列表弹窗
	107	showChooseShop() {
	108	// 打开弹窗
	109	this.$refs['XioRoomListShopChg'].showShopDialog(this.shopId)
6da3c1	110	},
1d1095	111	// 刷新浏览器页面
878885	112	resetPage() {
1d1095	113	window.location.reload()
J	114	// this.getRoomList()
878885	115	},
6da3c1	116	// 获取门店列表
J	117	getShopList() {
	118	var params = {}
1c200b	119	return new Promise((resolve, reject) => {
J	120	Req.http.post({
	121	url: 'guide/treat/screen/shop/list',
	122	data: params,
	123	header: { 'Content-Type': 'application/json' },
	124	mockData: {
	125	code: 100,
	126	msg: '',
	127	data: [{
	128	name: 'xx',
	129	id: 'xx'
	130	}]
	131	}
	132	}).then((res) => {
	133	this.shopList = res.data \|\| []
	134	resolve(res)
	135	})
6da3c1	136	})
J	137	},
	138	// 获取列表
	139	getRoomList() {
	140	var params = {}
	141	if (this.shopId) {
	142	params.shopId = this.shopId
	143	}
	144	Req.http.post({
878885	145	url: 'guide/treat/screen/room/list',
6da3c1	146	data: params,
J	147	header: { 'Content-Type': 'application/json' },
	148	mockData: {
	149	code: 100,
	150	msg: '',
878885	151	data: [{
J	152	id: 'xx', roomNo: 'xx'
	153	}]
6da3c1	154	}
J	155	}).then((res) => {
	156	this.list = res.data \|\| []
	157	})
aeb317	158	},
J	159	// 返回
	160	back() {
	161	this.stopCountGetTime('list')
	162	this.stopPollingAjaxFn('list')
	163	this.$router.go(-1)
	164	},
cf3e3e	165	// 跳转详情
aeb317	166	selectRoom(item = {}) {
bf4dca	167	// console.log(this.$router.options.routes)
J	168	// this.$router.options.routes
c4b6a2	169	localStorage.removeItem('curTreatIds')
bf4dca	170	if (this.$router && this.$router.options && this.$router.options.routes) {
J	171	this.$router.options.routes.forEach((o) => {
	172	if (o.name === 'roomDetail') {
	173	o.meta && (o.meta.isPush = true)
	174	}
	175	})
	176	}
aeb317	177	this.$router.push({
6da3c1	178	path: `./room/detail?id=${item.id \|\| ''}`
aeb317	179	})
3ac5f2	180	}
J	181	}
	182	}
	183	</script>
6da3c1	184	<style>
J	185	.page_choose_shop .el-input__inner {
	186	background-color: transparent;
	187	border: 0;
	188	line-height: 50px;
	189	color: rgba(255,255,255,1);
	190	font-size: 36px;
cf3e3e	191	text-align: right;
J	192	padding-right: 40px;
	193	}
	194	.page_choose_shop .el-select .el-input .el-select__caret {
	195	font-size: 30px;
	196	color: #fff;
6da3c1	197	}
J	198	</style>
3ac5f2	199	<style scoped>
1c200b	200	.page_header .left {
J	201	min-width: 300px;
	202	}
	203	.page_date {
	204	margin-left: 0;
	205	}
878885	206	/* .page_container {
J	207	overflow: hidden;
	208	} */
3ac5f2	209	.list_container {
J	210	width: 100%;
	211	background-color: #fff;
	212	border-radius: 10px;
878885	213	/* overflow: hidden; */
3ac5f2	214	}
J	215	.list_container__title {
	216	line-height: 56px;
	217	color: rgba(16,16,16,1);
	218	font-size: 40px;
	219	text-align: center;
	220	font-family: PingFangSC-medium;
	221	padding: 27px 0;
	222	/* font-weight: bold; */
	223	}
	224	.list_block {
	225	overflow: auto;
	226	}
	227	.list_block .list {
878885	228	margin-bottom: 20px;
3ac5f2	229	}
J	230	.list_block .list .list__item {
1c200b	231	cursor: pointer;
3ac5f2	232	padding: 40px 30px;
J	233	border-radius: 100px;
	234	background-color: rgba(229,238,253,1);
	235	color: rgba(0,0,0,1);
	236	font-size: 40px;
	237	text-align: center;
	238	font-family: Roboto;
	239	line-height: 1;
	240	margin-left: 48px;
	241	margin-bottom: 30px;
6da3c1	242	box-sizing: border-box;
J	243	min-width: 280px;
	244	cursor: pointer;
3ac5f2	245	}
J	246	.list_block .list .list__item.act {
	247	background-color: #5980FF;
	248	color: #fff;
	249	}
6da3c1	250	.list_block .list .notip {
J	251	color: rgba(0,0,0,.3);
	252	font-size: 40px;
	253	text-align: center;
	254	font-family: Roboto;
	255	}
1c200b	256	.select_shop_block {
J	257	cursor: pointer;
	258	}
	259	.select_shop_block .tx {
	260	line-height: 50px;
	261	color: rgba(255,255,255,1);
	262	font-size: 36px;
	263	text-align: center;
	264	font-family: PingFangSC-regular;
	265	}
	266	.select_shop_block .icon_block {
	267	width: 30px;
	268	height: 30px;
	269	display: block;
	270	}
	271	.select_shop_block .icon_block .icon {
	272	width: 100%;
	273	height: 100%;
	274	}
3ac5f2	275	</style>