| | |
| | | <div class="pagetab"> |
| | | <div class="item">宿¶çæµ</div> |
| | | </div> |
| | | <!-- SC01å··éä»»å¡ä¿¡æ¯ --> |
| | | <ItemWrap class="contetn_left-bottom contetn_lr-item" title="SC01å··éä»»å¡ä¿¡æ¯" style="padding: 0 10px 16px 0px"> |
| | | <sc01-task-info /> |
| | | </ItemWrap> |
| | | <!-- SC02å··éä»»å¡ä¿¡æ¯ --> |
| | | <ItemWrap class="contetn_left-bottom contetn_lr-item" title="SC02å··éä»»å¡ä¿¡æ¯"> |
| | | <sc02-task-info /> |
| | | <!-- å··éä»»å¡ä¿¡æ¯ --> |
| | | <ItemWrap class="contetn_left-bottom contetn_lr-item" title="å··éä»»å¡ä¿¡æ¯" style="padding: 0 10px 16px 0px; height: 92%;"> |
| | | <div class="task-content"> |
| | | <sc01-task-info v-if="currentTask === 'sc01'" /> |
| | | <sc02-task-info v-else-if="currentTask === 'sc02'" /> |
| | | </div> |
| | | </ItemWrap> |
| | | </div> |
| | | <div class="contetn_center"> |
| | |
| | | <inventory-stats /> |
| | | </ItemWrap> |
| | | <!-- æ¥åºå
¥åºæ±å½¢å¾å¯¹æ¯ --> |
| | | <ItemWrap class="contetn_left-bottom contetn_lr-item" title="æ¥åºå
¥åºå¯¹æ¯" style="padding: 0 10px 16px 10px"> |
| | | <ItemWrap class="contetn_left-bottom contetn_lr-item" title="æ¥è¦ä¿¡æ¯" style="padding: 0 10px 16px 10px"> |
| | | <daily-inout-chart /> |
| | | </ItemWrap> |
| | | </div> |
| | | <div class="contetn_right"> |
| | | <!-- SC01è´§ä½ç¶æ --> |
| | | <ItemWrap class="contetn_left-bottom contetn_lr-item" title="SC01è´§ä½ç¶æ"> |
| | | <sc01-location-status /> |
| | | </ItemWrap> |
| | | <!-- SC02è´§ä½ç¶æ --> |
| | | <ItemWrap class="contetn_left-bottom contetn_lr-item" title="SC02è´§ä½ç¶æ"> |
| | | <sc02-location-status /> |
| | | <!-- è´§ä½ç¶æ --> |
| | | <ItemWrap class="contetn_left-bottom contetn_lr-item" title="è´§ä½ç¶æ" style="padding: 0 10px 16px 0px; height: 92%;"> |
| | | <div class="task-content"> |
| | | <sc01-location-status v-if="currentLocation === 'sc01'" /> |
| | | <sc02-location-status v-else-if="currentLocation === 'sc02'" /> |
| | | </div> |
| | | </ItemWrap> |
| | | </div> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | import { mapState, mapMutations } from 'vuex' |
| | | import sc01TaskInfo from './sc01-task-info.vue' |
| | | import sc02TaskInfo from './sc02-task-info.vue' |
| | | import inventoryStats from './inventory-stats.vue' |
| | |
| | | sc01LocationStatus, |
| | | sc02LocationStatus |
| | | }, |
| | | data() { |
| | | return { |
| | | |
| | | }; |
| | | computed: { |
| | | ...mapState('setting', ['currentTask', 'currentLocation']) |
| | | }, |
| | | filters: { |
| | | numsFilter(msg) { |
| | |
| | | }, |
| | | |
| | | mounted() { }, |
| | | methods: { |
| | | methods: {}, |
| | | |
| | | }, |
| | | }; |
| | | </script> |
| | | <style lang="scss" scoped> |
| | |
| | | display: flex; |
| | | justify-content: center; |
| | | gap: 10px; |
| | | height: 100%; |
| | | |
| | | .contetn_left, |
| | | .contetn_right { |
| | | width: 600px; |
| | | // height: 100%; |
| | | box-sizing: border-box; |
| | | gap: 10px; |
| | | // padding: 16px 0; |
| | | display: flex; |
| | | flex-direction: column; |
| | | } |
| | | |
| | | .contetn_center { |
| | | width: 660px; |
| | | gap: 10px; |
| | | display: flex; |
| | | flex-direction: column; |
| | | } |
| | | |
| | | // 左侧SC01ä»»å¡ä¿¡æ¯ - ä¿æä¸å
¶ä»åºåç¸åçé«åº¦ |
| | | .contetn_left-item { |
| | | height: px; // æ¢å¤åæ¥çåºå®é«åº¦ï¼åå³ä¾§å个åçé«åº¦ä¸è´ |
| | | flex-shrink: 0; // 鲿¢å缩 |
| | | } |
| | | |
| | | //å·¦å³ä¸¤ä¾§ ä¸ä¸ªå |
| | | .contetn_lr-item { |
| | | gap: 10px; |
| | | height: 480px; |
| | | height: 480px; // æ¢å¤åæ¥çåºå®é«åº¦ |
| | | } |
| | | |
| | | .contetn_center_top { |
| | |
| | | display: flex; |
| | | flex-direction: column; |
| | | gap: 10px; |
| | | // justify-content: space-around; |
| | | } |
| | | |
| | | .contetn_center-bottom { |
| | |
| | | .contetn_right { |
| | | display: flex; |
| | | flex-direction: column; |
| | | // justify-content: space-around; |
| | | gap: 10px; |
| | | position: relative; |
| | | } |
| | |
| | | transform: rotate(360deg) scale(1); |
| | | } |
| | | } |
| | | </style> |
| | | |
| | | // ä»»å¡å
容åºå |
| | | .task-content { |
| | | width: 100%; |
| | | height: 100%; |
| | | overflow: hidden; |
| | | } |
| | | </style> |