| 提交 | 用户 | age | ||
| 3ac5f2 | 1 | <!--room-list.vue--> |
| J | 2 | <template> |
| 3 | <div class="page"> | |
| 4 | <div class="page_header flex flex-ver"> | |
| aeb317 | 5 | <div class="left flex flex-ver" @click="back"> |
| 3ac5f2 | 6 | <img class="page_logo_1" src="../../assets/img/logo_1.png"> |
| J | 7 | <img class="page_logo_2" src="../../assets/img/logo_2.png"> |
| 8 | </div> | |
| 9 | <div class="right flex-1 flex flex-jcfe flex-ver"> | |
| 10 | <div class="page_date"> | |
| 11 | <div class="page_week">{{ timeObj.week }}</div> | |
| 12 | <div class="page_day">{{ timeObj.date }}</div> | |
| 13 | </div> | |
| 14 | <div class="page_time">{{ timeObj.timeMin }}</div> | |
| 15 | <!-- <div class="page_time">{{ timeObj.time }}</div> --> | |
| 16 | </div> | |
| 17 | </div> | |
| 18 | <div class="page_container"> | |
| 19 | <div class="list_container flex flex-col"> | |
| 20 | <div class="list_container__title">请选择房间</div> | |
| 21 | <div class="list_block flex-1"> | |
| 22 | <div class="list flex flex-ver flex-wrap"> | |
| 23 | <!-- act --> | |
| aeb317 | 24 | <div v-for="(item, index) in list" :key="index" class="list__item flex flex-center" @click="selectRoom()">VIP诊疗室-1</div> |
| 3ac5f2 | 25 | </div> |
| J | 26 | </div> |
| 27 | </div> | |
| 28 | </div> | |
| 29 | </div> | |
| 30 | </template> | |
| 31 | ||
| 32 | <script> | |
| 33 | // import Login from '../utils/jun_login.js' | |
| 34 | ||
| 35 | export default { | |
| 36 | name: 'RoomList', | |
| 37 | components: {}, | |
| 38 | inject: ['noop'], | |
| 39 | data() { | |
| 40 | return { | |
| 41 | list: ['', '', '', '', '', '', '', '', '', '', '', '', '', '', '', '', '', '', '', '', '', '', '', '', '', '', '', '', '', '', '', '', '', '', '', '', '', '', '', '', '', '', ''], | |
| 42 | timeObj: {}// week：星期，date：年月日，timeMin：时分，time：时分秒，timeStamp：时间戳 | |
| 43 | } | |
| 44 | }, | |
| 45 | computed: { | |
| 46 | ||
| 47 | }, | |
| 48 | mounted() { | |
| 49 | console.log('roomList mounted') | |
| 50 | this.init() | |
| 51 | }, | |
| 52 | destroyed() { | |
| 53 | ||
| 54 | }, | |
| 55 | methods: { | |
| 56 | init() { | |
| bb2b08 | 57 | this.countGetTime(this, 'timeObj', 'list') |
| aeb317 | 58 | }, |
| J | 59 | // 返回 |
| 60 | back() { | |
| 61 | this.stopCountGetTime('list') | |
| 62 | this.stopPollingAjaxFn('list') | |
| 63 | this.$router.go(-1) | |
| 64 | }, | |
| 65 | selectRoom(item = {}) { | |
| 66 | this.$router.push({ | |
| 67 | path: `./detail?id=${item.id || ''}` | |
| 68 | }) | |
| 3ac5f2 | 69 | } |
| J | 70 | } |
| 71 | } | |
| 72 | </script> | |
| 73 | ||
| 74 | <style scoped> | |
| 75 | .list_container { | |
| 76 | width: 100%; | |
| 77 | height: 100%; | |
| 78 | background-color: #fff; | |
| 79 | border-radius: 10px; | |
| 80 | } | |
| 81 | .list_container__title { | |
| 82 | line-height: 56px; | |
| 83 | color: rgba(16,16,16,1); | |
| 84 | font-size: 40px; | |
| 85 | text-align: center; | |
| 86 | font-family: PingFangSC-medium; | |
| 87 | padding: 27px 0; | |
| 88 | /* font-weight: bold; */ | |
| 89 | } | |
| 90 | .list_block { | |
| bb2b08 | 91 | /* padding-right: 66px; */ |
| 3ac5f2 | 92 | margin-bottom: 50px; |
| J | 93 | overflow: auto; |
| 94 | } | |
| 95 | .list_block .list { | |
| 96 | ||
| 97 | } | |
| 98 | .list_block .list .list__item { | |
| 99 | padding: 40px 30px; | |
| 100 | border-radius: 100px; | |
| 101 | background-color: rgba(229,238,253,1); | |
| 102 | color: rgba(0,0,0,1); | |
| 103 | font-size: 40px; | |
| 104 | text-align: center; | |
| 105 | font-family: Roboto; | |
| 106 | line-height: 1; | |
| 107 | margin-left: 48px; | |
| 108 | margin-bottom: 30px; | |
| 109 | } | |
| 110 | .list_block .list .list__item.act { | |
| 111 | background-color: #5980FF; | |
| 112 | color: #fff; | |
| 113 | } | |
| 114 | </style> | |
