| | |
| | | <!--room-list.vue--> |
| | | <template> |
| | | <div class="page"> |
| | | <div class="page flex flex-col"> |
| | | <div class="page_header flex flex-ver"> |
| | | <div class="left flex flex-ver" @click="back"> |
| | | <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="resetPage"> |
| | | <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="page_choose_shop"> |
| | | <div class="flex-1 flex flex-center"> |
| | | <div class="select_shop_block flex flex-ver" @click="showChooseShop"> |
| | | <div v-if="!shopId" class="tx">请选择门店</div> |
| | | <div v-if="shopId" class="tx">{{ shopName }}</div> |
| | | <div class="icon_block"> |
| | | <img class="icon" src="static/imgs/down.png"> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <div class="right flex flex-jcfe flex-ver"> |
| | | <!-- <div class="page_choose_shop"> |
| | | <el-select v-model="shopId" placeholder="请选择" style="width:400px;" clearable @change="getRoomList"> |
| | | <el-option v-for="item in shopList" :key="item.id" :label="item.name" :value="item.id" /> |
| | | </el-select> |
| | | </div> |
| | | </div> --> |
| | | <div class="page_date"> |
| | | <div class="page_week">{{ timeObj.week }}</div> |
| | | <div class="page_day">{{ timeObj.date }}</div> |
| | |
| | | <!-- <div class="page_time">{{ timeObj.time }}</div> --> |
| | | </div> |
| | | </div> |
| | | <div class="page_container"> |
| | | <div class="list_container flex flex-col"> |
| | | <div class="page_container flex-1 h1 flex flex-col"> |
| | | <div class="list_container h1 flex-1 flex flex-col"> |
| | | <div class="list_container__title">请选择房间</div> |
| | | <div class="list_block flex-1"> |
| | | <div class="list_block flex-1 h1"> |
| | | <div v-if="list && list.length" class="list flex flex-ver flex-wrap"> |
| | | <!-- act --> |
| | | <div v-for="(item, index) in list" :key="index" class="list__item flex flex-center" @click="selectRoom(item)">{{ item.roomNo }}</div> |
| | |
| | | </div> |
| | | </div> |
| | | </div> |
| | | |
| | | <XioRoomListShopChg ref="XioRoomListShopChg" @confirm="confirmShop" /> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | // import Login from '../utils/jun_login.js' |
| | | import Req from '../../utils/jun_httpInstall' // http 请求 |
| | | // import xioFn from './utils/xio_fn.js' |
| | | // 通知卸麻 |
| | | import XioRoomListShopChg from '@/components/xio_room_list_shop_chg' |
| | | export default { |
| | | name: 'RoomList', |
| | | components: {}, |
| | | components: { |
| | | XioRoomListShopChg |
| | | }, |
| | | inject: ['noop'], |
| | | data() { |
| | | return { |
| | | shopList: [], |
| | | shopId: '', |
| | | shopName: '', |
| | | list: [], |
| | | timeObj: {}// week:星期,date:年月日,timeMin:时分,time:时分秒,timeStamp:时间戳 |
| | | } |
| | |
| | | computed: { |
| | | |
| | | }, |
| | | activated() {}, |
| | | mounted() { |
| | | console.log('roomList mounted') |
| | | this.init() |
| | |
| | | |
| | | }, |
| | | methods: { |
| | | init() { |
| | | async init() { |
| | | // 计时 |
| | | this.countGetTime(this, 'timeObj', 'list') |
| | | this.getShopList() |
| | | // await this.getShopList() |
| | | // this.getRoomList() |
| | | this.showChooseShop() |
| | | }, |
| | | // 确定选择门店 |
| | | confirmShop(item) { |
| | | this.shopId = item.id |
| | | this.shopName = item.name |
| | | this.getRoomList() |
| | | }, |
| | | // 显示选择门店列表弹窗 |
| | | showChooseShop() { |
| | | // 打开弹窗 |
| | | this.$refs['XioRoomListShopChg'].showShopDialog(this.shopId) |
| | | }, |
| | | // 刷新浏览器页面 |
| | | resetPage() { |
| | | window.location.reload() |
| | | // this.getRoomList() |
| | | }, |
| | | // 获取门店列表 |
| | | getShopList() { |
| | | var params = {} |
| | | Req.http.post({ |
| | | url: 'treat/screen/shop/list', |
| | | data: params, |
| | | header: { 'Content-Type': 'application/json' }, |
| | | mockData: { |
| | | code: 100, |
| | | msg: '', |
| | | data: {} |
| | | } |
| | | }).then((res) => { |
| | | this.shopList = res.data || [] |
| | | return new Promise((resolve, reject) => { |
| | | Req.http.post({ |
| | | url: 'guide/treat/screen/shop/list', |
| | | data: params, |
| | | header: { 'Content-Type': 'application/json' }, |
| | | mockData: { |
| | | code: 100, |
| | | msg: '', |
| | | data: [{ |
| | | name: 'xx', |
| | | id: 'xx' |
| | | }] |
| | | } |
| | | }).then((res) => { |
| | | this.shopList = res.data || [] |
| | | resolve(res) |
| | | }) |
| | | }) |
| | | }, |
| | | // 获取列表 |
| | |
| | | params.shopId = this.shopId |
| | | } |
| | | Req.http.post({ |
| | | url: 'treat/screen/room/list', |
| | | url: 'guide/treat/screen/room/list', |
| | | data: params, |
| | | header: { 'Content-Type': 'application/json' }, |
| | | mockData: { |
| | | code: 100, |
| | | msg: '', |
| | | data: {} |
| | | data: [{ |
| | | id: 'xx', roomNo: 'xx' |
| | | }] |
| | | } |
| | | }).then((res) => { |
| | | this.list = res.data || [] |
| | |
| | | this.stopPollingAjaxFn('list') |
| | | this.$router.go(-1) |
| | | }, |
| | | // 跳转详情 |
| | | selectRoom(item = {}) { |
| | | // console.log(this.$router.options.routes) |
| | | // this.$router.options.routes |
| | | localStorage.removeItem('curTreatIds') |
| | | if (this.$router && this.$router.options && this.$router.options.routes) { |
| | | this.$router.options.routes.forEach((o) => { |
| | | if (o.name === 'roomDetail') { |
| | | o.meta && (o.meta.isPush = true) |
| | | } |
| | | }) |
| | | } |
| | | this.$router.push({ |
| | | path: `./room/detail?id=${item.id || ''}` |
| | | }) |
| | |
| | | line-height: 50px; |
| | | color: rgba(255,255,255,1); |
| | | font-size: 36px; |
| | | text-align: center; |
| | | text-align: right; |
| | | padding-right: 40px; |
| | | } |
| | | .page_choose_shop .el-select .el-input .el-select__caret { |
| | | font-size: 30px; |
| | | color: #fff; |
| | | } |
| | | </style> |
| | | <style scoped> |
| | | .page_header .left { |
| | | min-width: 300px; |
| | | } |
| | | .page_date { |
| | | margin-left: 0; |
| | | } |
| | | /* .page_container { |
| | | overflow: hidden; |
| | | } */ |
| | | .list_container { |
| | | width: 100%; |
| | | height: 100%; |
| | | background-color: #fff; |
| | | border-radius: 10px; |
| | | /* overflow: hidden; */ |
| | | } |
| | | .list_container__title { |
| | | line-height: 56px; |
| | |
| | | /* font-weight: bold; */ |
| | | } |
| | | .list_block { |
| | | /* padding-right: 66px; */ |
| | | margin-bottom: 50px; |
| | | overflow: auto; |
| | | } |
| | | .list_block .list { |
| | | |
| | | margin-bottom: 20px; |
| | | } |
| | | .list_block .list .list__item { |
| | | cursor: pointer; |
| | | padding: 40px 30px; |
| | | border-radius: 100px; |
| | | background-color: rgba(229,238,253,1); |
| | |
| | | text-align: center; |
| | | font-family: Roboto; |
| | | } |
| | | .select_shop_block { |
| | | cursor: pointer; |
| | | } |
| | | .select_shop_block .tx { |
| | | line-height: 50px; |
| | | color: rgba(255,255,255,1); |
| | | font-size: 36px; |
| | | text-align: center; |
| | | font-family: PingFangSC-regular; |
| | | } |
| | | .select_shop_block .icon_block { |
| | | width: 30px; |
| | | height: 30px; |
| | | display: block; |
| | | } |
| | | .select_shop_block .icon_block .icon { |
| | | width: 100%; |
| | | height: 100%; |
| | | } |
| | | </style> |