From 878885c5872fe2fcd153a6571e75a27cb1025e97 Mon Sep 17 00:00:00 2001 From: jazz <jazzxhunter@163.com> Date: 星期五, 08 十二月 2023 12:17:12 +0800 Subject: [PATCH] update_202312071736_项目-治疗室屏幕web-样式调整,适配ios浏览器v1 --- src/pages/room/detail.vue | 702 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++- 1 files changed, 687 insertions(+), 15 deletions(-) diff --git a/src/pages/room/detail.vue b/src/pages/room/detail.vue index 03022fe..244a76c 100644 --- a/src/pages/room/detail.vue +++ b/src/pages/room/detail.vue @@ -1,38 +1,249 @@ <!--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" @click="resetStatus">閲嶇疆鎴块棿鐘舵��</div> <div class="page_date"> - <div class="page_week">{{timeObj.week}}</div> - <div class="page_day">{{timeObj.date}}</div> + <div class="page_week">{{ timeObj.week }}</div> + <div class="page_day">{{ timeObj.date }}</div> </div> - <div class="page_time">{{timeObj.timeMin}}</div> - <!-- <div class="page_time">{{timeObj.time}}</div> --> + <div class="page_time">{{ timeObj.timeMin }}</div> + <!-- <div class="page_time">{{ timeObj.time }}</div> --> </div> </div> - <div>123</div> + <!-- 鏈湁瀹夋帓 --> + <div v-if="!occupyInfoView && (!assignTreatList || !assignTreatList.length)" class="page_container flex flex-1"> + <div class="main flex-1"> + <div v-if="roomInfo && roomInfo.roomNo" class="room_title">{{ roomInfo.roomNo }}</div> + <div v-if="roomInfo" class="room_main_tip" style="margin-top: 93px;line-height: 186px;font-size: 140px;">-{{ statusTx[roomInfo.status] }}-</div> + <div class="btn_box flex flex-center"> + <div class="flex flex-ver"> + <div class="btn_box__item flex flex-center white" data-tx="绌洪棽" data-status="0" @click="statusChg"> + <div class="flex flex-ver"> + <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="浣跨敤涓�" data-status="1" @click="statusChg"> + <div class="flex flex-ver"> + <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="瀹汉浼戞伅" data-status="2" @click="statusChg"> + <div class="flex flex-ver"> + <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="閫氱煡鎵撴壂" data-status="3" @click="statusChg"> + <div class="flex flex-ver"> + <div class="icon"> + <img class="img" src="static/imgs/clear.png"> + </div> + <div class="tx">閫氱煡鎵撴壂</div> + </div> + </div> + </div> + </div> + </div> + </div> + <!-- 娌℃湁瀹汉鍜屾湁瀹夋帓 --> + <div v-if="!occupyInfoView && (assignTreatList && assignTreatList.length)" class="page_container flex flex-1"> + <div class="main flex-1"> + <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-if="roomInfo && roomInfo.status >= 1" class="room_left_btn_box flex flex-ver"> + <div v-if="roomInfo.status == 1" class="room_left_btn_box__item flex-1 flex flex-center yellow" @click="setStatus('瀹汉浼戞伅', 2)">瀹汉浼戞伅</div> + <div v-if="roomInfo.status == 1" class="room_left_btn_box__item flex-1 flex flex-center gray" @click="setStatus('鎵撴壂涓�', 3)">閫氱煡鎵撴壂</div> + <div v-if="roomInfo.status == 2" class="room_left_btn_box__item flex flex-center green" @click="setStatus('鎵撴壂涓�', 3)">閫氱煡鎵撴壂</div> + <div v-if="roomInfo.status == 3" class="room_left_btn_box__item flex flex-center green" @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 assignTreatList" :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 class="icon"> + <img class="img" src="static/imgs/choose.png"> + </div> + </div> + </div> + </div> + </div> + </div> + </div> + </div> + <!-- 瀹汉鍜屾湁瀹夋帓 --> + <div v-if="occupyInfoView && (assignTreatList && assignTreatList.length)" 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> --> + <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 v-if="occupyInfoView.ciq" class="ciq">({{ occupyInfoView.ciq }})</div> + <div v-if="occupyInfoView.startTime" class="time">瀹夋帓娌荤枟鏃堕棿锛歿{ occupyInfoView.startTime }} 寮�濮�</div> + </div> + <div v-if="roomInfo" class="room_left_btn_box flex flex-ver" style="margin-top: 105px;"> + <div v-if="roomInfo.status == 0" class="room_left_btn_box__item flex flex-center green btn_ani" @click="setStatus('浣跨敤涓�', 1)">寮�濮嬫不鐤�</div> + <div v-if="roomInfo.status == 1" class="room_left_btn_box__item flex-1 flex flex-center yellow" @click="setStatus('瀹汉浼戞伅', 2)">瀹汉浼戞伅</div> + <div v-if="roomInfo.status == 1" class="room_left_btn_box__item flex-1 flex flex-center gray" @click="setStatus('鎵撴壂涓�', 3)">閫氱煡鎵撴壂</div> + <div v-if="roomInfo.status == 2" class="room_left_btn_box__item flex flex-center green" @click="setStatus('鎵撴壂涓�', 3)">閫氱煡鎵撴壂</div> + <div v-if="roomInfo.status == 3" class="room_left_btn_box__item flex flex-center green" @click="setStatus('绌洪棽', 0)">缁撴潫鎵撴壂</div> + </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">{{ 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> + <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 assignTreatList" :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 class="icon"> + <img class="img" src="static/imgs/choose.png"> + </div> + </div> + </div> + </div> + </div> + </div> + </div> + </div> + <!-- 閫夋嫨瀹汉寮圭獥 --> + <XioCustomerSelect ref="XioCustomerSelect" @cancel="selectCustomerCancel" @submit="selectCustomerSubmit" /> + <!-- 鏇存敼鎴块棿鐘舵�佺獥 --> + <XioRoomStatusChg ref="XioRoomStatusChg" @changeStatus="changeStatus" /> </div> </template> <script> +// 绌洪棽 0 +// 浣跨敤涓� 1 +// 瀹汉浼戞伅 2 +// 寰呮墦鎵�/閫氱煡鎵撴壂 3 // import Login from '../utils/jun_login.js' - +// 閫夋嫨瀹汉寮圭獥 +import XioCustomerSelect from '@/components/xio_customer_select' +// 鏇存敼鎴块棿鐘舵�佺獥 +import XioRoomStatusChg from '@/components/xio_room_status_chg' +import Req from '../../utils/jun_httpInstall' // http 璇锋眰 +var isUseDefault = false // 鏄惁宸蹭娇鐢ㄩ粯璁ゅ浜� +var isUseDefaultChg = 0// 宸蹭娇鐢ㄩ粯璁ゅ浜哄悗鎴块棿鏄惁鏈夋敼鍙樼姸鎬� export default { name: 'RoomDetail', - components: {}, + components: { + XioCustomerSelect, + XioRoomStatusChg + }, inject: ['noop'], data() { return { - timeObj: {}// week锛氭槦鏈燂紝date锛氬勾鏈堟棩锛宼imeMin锛氭椂鍒嗭紝time锛氭椂鍒嗙锛宼imeStamp锛氭椂闂存埑 + id: this.$route.query.id || '', + roomInfo: {}, + occupyInfo: '', // 褰撳墠鍗犵敤浜虹殑淇℃伅 + assignTreatList: [], + statusTx: ['绌洪棽', '浣跨敤涓�', '瀹汉浼戞伅', '鎵撴壂涓�'], + timeObj: {} // week锛氭槦鏈燂紝date锛氬勾鏈堟棩锛宼imeMin锛氭椂鍒嗭紝time锛氭椂鍒嗙锛宼imeStamp锛氭椂闂存埑 } }, computed: { - + occupyInfoView() { + // 鏈夊崰鐢� + 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 '' + } + } + } }, mounted() { console.log('roomDetail mounted') @@ -43,11 +254,472 @@ }, methods: { init() { - this.countGetTime(this, 'timeObj') + // 璁℃椂 + this.countGetTime(this, 'timeObj', 'detail') + // 杞getData锛�8绉掍竴娆� + this.pollingAjaxFn(this, 'getData', 'detail', 8000) + // this.getData() + }, + // 鑾峰彇鎴块棿璇︽儏 + 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鎵撴壂 + }, + assignTreatList: [{ + startTime: '2023-12-08 00:00:00' + }], + 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]}` + }) + } + // 宸叉湁鍗犵敤鐨勶紝鏇存敼宸蹭娇鐢ㄩ粯璁ゅ浜虹殑鐘舵�� + res.data.occupyInfo && (isUseDefaultChg = 1) + res.data.occupyInfo && (isUseDefault = 1) + // 鍗犵敤淇℃伅娌荤枟鏃堕棿澶勭悊 + if (res.data.occupyInfo && res.data.occupyInfo.startTime) { + var ost = (res.data.occupyInfo.startTime).split(' ')[1].split(':') + res.data.occupyInfo.startTime = `${ost[0]}:${ost[1]}` + } + for (const key in res.data) { + this[key] = res.data[key] + } + } + // console.log('999999999999999999999999999', res) + }) + }, + // 杩斿洖 + back() { + isUseDefault = false + isUseDefaultChg = 0 + // 鍏抽棴璁℃椂 + this.stopCountGetTime('detail') + // 鍏抽棴杞 + this.stopPollingAjaxFn('detail') + // 杩斿洖 + this.$router.go(-1) + }, + // 鏈湁瀹夋帓鐩存帴鐘舵�佸彉鏇� + 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(occupyInfoView, status, () => { + this.getData() + }) + }, + // 鎸夋祦绋嬭缃埧闂寸姸鎬� + setStatus(tx, status) { + var { occupyInfoView, roomInfo } = this + console.log(tx, status) + this.changeStatusFn(occupyInfoView, status, () => { + // 鍒锋柊璇︽儏 + this.getData() + }) + }, + // 鏀瑰彉鎴块棿鐘舵�佸紓姝ユ柟娉� + changeStatusFn(item = {}, status, cb) { + var params = {} + // 鏇存敼鐨勭姸鎬� + params.status = status * 1 + // 鎴块棿id + if (this.id) { + params.shopRoomId = this.id + } + // 娌荤枟璁板綍id + if (item && item.id) { + params.treatRecordId = item.id + } + 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) { + isUseDefaultChg = 1 + } + // console.log('8888888888888888888888888888888888', res) + cb && cb() + }) + }, + // 閲嶇疆鐘舵�� + 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 + // } + this.changeStatusFn(occupyInfoView, opt.status, () => { + // 鍒锋柊璇︽儏 + this.getData() + // 鍏抽棴寮圭獥 + this.$refs['XioRoomStatusChg'].hideDialog() + }) + }, + // 閫夋嫨瀹㈡埛 + selectCustomer(item = {}) { + // 鎵撳紑寮圭獥 + 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) + this.changeStatusFn(opt, 1, () => { + // 鍒锋柊璇︽儏 + this.getData() + // 鍏抽棴寮圭獥 + this.$refs['XioCustomerSelect'].hideDialog() + }) } } } </script> +<style> +.el-popper.top_tx { + text-align: center; + font-size: 25px; +} +</style> + <style scoped> -</style> \ No newline at end of file +.page{ + overflow: auto; +} +.page_header .reset_btn { + width: 200px; + height: 60px; + line-height: 35px; + border-radius: 5px; + background-color: rgba(47,174,206,1); + color: rgba(255,255,255,1); + font-size: 24px; + text-align: center; + font-family: Microsoft Yahei; + cursor: pointer; +} +.page_container .main { + /* 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; +} +.page_container .main .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: 39px auto 0 auto; +} +.page_container .main .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; */ +} +.page_container .main .room_main_tip.gray { + color: rgba(154,154,154,1); +} +.page_container .main .btn_box { + margin-top: 130px; +} +.page_container .main .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; +} +.page_container .main .btn_box__item:last-child { + margin-right: 0; +} +.page_container .main .btn_box__item.white { + background-color: rgba(255,255,255,1); +} +.page_container .main .btn_box__item.blue { + background-color: rgba(46,77,124,1); +} +.page_container .main .btn_box__item.yellow { + background-color: rgba(255,199,115,1); +} +.page_container .main .btn_box__item.gray { + background-color: rgba(206,206,206,1); +} +.page_container .main .btn_box__item .icon { + width: 60px; + height: 60px; + 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); + font-size: 26px; + text-align: center; + font-family: PingFangSC-medium; +} +.page_container .main .btn_box__item .tx.white { + color: rgba(255,255,255,1); +} +.page_container .main .room_left_btn_box { + padding: 0 23px; + margin-top: 163px; +} +.page_container .main .room_left_btn_box__item { + height: 150px; + line-height: 58px; + border-radius: 10px; + font-size: 40px; + text-align: center; + font-family: Microsoft Yahei; + margin-right: 20px; + font-weight: bold; +} +.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); +} +.page_container .main .room_left_btn_box__item.gray { + background-color: rgba(206,206,206,1); + 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_content { + margin-top: 30px; +} +.page_container .main .room_content .tip { + line-height: 33px; + color: rgba(79,79,79,1); + font-size: 24px; + text-align: center; + font-family: PingFangSC-medium; +} +.page_container .main .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; +} +.page_container .main .room_content .name .tx { + max-width: 666px; + margin: auto; +} +.page_container .main .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; +} +.page_container .main .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; +} +.page_container .right { + width: 686px; + margin-left: 30px; + /* height: 100%; */ +} +.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 { + 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__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 { + 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; +} +</style> -- Gitblit v1.8.0