| 提交 | 用户 | age | ||
| 3ac5f2 | 1 | <!--room-list.vue--> |
| J | 2 | <template> |
| 3 | <div class="page"> | |
| 4 | <div class="page_header flex flex-ver"> | |
| 5 | <div class="left flex flex-ver"> | |
| 6 | <img class="page_logo_1" src="../../assets/img/logo_1.png"> | |
| 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 --> | |
| 24 | <div v-for="(item, index) in list" :key="index" class="list__item flex flex-center">VIP诊疗室-1</div> | |
| 25 | </div> | |
| 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() { | |
| 57 | this.countGetTime(this, 'timeObj') | |
| 58 | } | |
| 59 | } | |
| 60 | } | |
| 61 | </script> | |
| 62 | ||
| 63 | <style scoped> | |
| 64 | .list_container { | |
| 65 | width: 100%; | |
| 66 | height: 100%; | |
| 67 | background-color: #fff; | |
| 68 | border-radius: 10px; | |
| 69 | } | |
| 70 | .list_container__title { | |
| 71 | line-height: 56px; | |
| 72 | color: rgba(16,16,16,1); | |
| 73 | font-size: 40px; | |
| 74 | text-align: center; | |
| 75 | font-family: PingFangSC-medium; | |
| 76 | padding: 27px 0; | |
| 77 | /* font-weight: bold; */ | |
| 78 | } | |
| 79 | .list_block { | |
| 80 | padding-right: 66px; | |
| 81 | margin-bottom: 50px; | |
| 82 | overflow: auto; | |
| 83 | } | |
| 84 | .list_block .list { | |
| 85 | ||
| 86 | } | |
| 87 | .list_block .list .list__item { | |
| 88 | padding: 40px 30px; | |
| 89 | border-radius: 100px; | |
| 90 | background-color: rgba(229,238,253,1); | |
| 91 | color: rgba(0,0,0,1); | |
| 92 | font-size: 40px; | |
| 93 | text-align: center; | |
| 94 | font-family: Roboto; | |
| 95 | line-height: 1; | |
| 96 | margin-left: 48px; | |
| 97 | margin-bottom: 30px; | |
| 98 | } | |
| 99 | .list_block .list .list__item.act { | |
| 100 | background-color: #5980FF; | |
| 101 | color: #fff; | |
| 102 | } | |
| 103 | </style> | |
