From 70a87a18cca12dd0e43360f91a5be9754dc4cb37 Mon Sep 17 00:00:00 2001 From: gaosp <gaosp> Date: 星期五, 12 一月 2024 00:25:55 +0800 Subject: [PATCH] 1 --- src/container/Map/index.vue | 115 ++++++++++++++++----------------------------------------- 1 files changed, 32 insertions(+), 83 deletions(-) diff --git a/src/container/Map/index.vue b/src/container/Map/index.vue index 0800195..56cd2eb 100644 --- a/src/container/Map/index.vue +++ b/src/container/Map/index.vue @@ -1,7 +1,7 @@ <!-- * @Date: 2024-01-05 22:26:22 * @LastEditors: Sneed - * @LastEditTime: 2024-01-06 19:00:32 + * @LastEditTime: 2024-01-11 22:50:23 * @FilePath: /belleson-frontend/Users/mache/Documents/demo/mdc/src/container/Map/index.vue --> <template> @@ -9,10 +9,10 @@ <Map v-if="status===0 || status === 1" :status="status" :currentMap="currentMap" :name="plantName" :id="id" @out="out" /> <div v-else class="preview"> <div class="left"> - <div v-if="id" @click="editMap" class="edit-btn"> - 杩涘叆缂栬緫鐘舵�� + <div @click="editMap" class="edit-btn"> + {{id ? '杩涘叆缂栬緫鐘舵��' : '鏂板'}} </div> - <el-select size="mini" class="left-select" v-model="id" placeholder="璇烽�夋嫨"> + <el-select clearable class="left-select" v-model="id" placeholder="璇烽�夋嫨"> <el-option v-for="item in mapList" :key="item.id" @@ -42,28 +42,7 @@ </div> </div> <div class="right"> - <div class="top"> - <div class="top-item top-1"> - <div>16</div> - <div>鍋滄満鐘舵��</div> - </div> - <div class="top-item top-2"> - <div>16</div> - <div>鍋滄満鐘舵��</div> - </div> - <div class="top-item top-3"> - <div>16</div> - <div>鍋滄満鐘舵��</div> - </div> - <div class="top-item top-4"> - <div>16</div> - <div>鍋滄満鐘舵��</div> - </div> - <div class="top-item top-5"> - <div>16</div> - <div>鍋滄満鐘舵��</div> - </div> - </div> + <Status /> <div class="preview-map"> <Map :status="2" :currentMap="currentMap" @out="out" /> </div> @@ -73,12 +52,19 @@ </template> <script> import Map from './Map.vue' + import Status from '@/components/newComp/Status' export default { components: { - Map + Map, + Status }, watch: { - id () { + id (val) { + if (!val) { + this.currentMap = '' + this.plantName = '' + return + } this.currentMap = JSON.parse(this.mapList.find(item => item.id ===this.id).gridSetting) this.plantName = this.mapList.find(item => item.id ===this.id).name } @@ -94,7 +80,7 @@ }, methods: { getMapList() { - this.$http.get('/plant/list').then(res => { + this.$store.dispatch('GetPlanList', {}).then(res => { this.mapList = res.data.filter (v => v.gridSetting && v.gridSetting!='{}') if (this.mapList.length === 0) { this.status = 0 @@ -104,12 +90,16 @@ }) }, editMap () { - console.log('--------') - this.status = 1 + if (this.id) { + this.status = 1 + } else { + this.status = 0 + } }, out () { this.status = 2 - } + this.getMapList() + }, }, mounted () { this.getMapList() @@ -150,6 +140,7 @@ background: url('./img//btn.png') 100% center no-repeat; background-size: contain; font-size: 16px; + cursor: pointer; } .left-select { margin-top: 20px; @@ -195,58 +186,16 @@ } } .right { + width: calc(100% - 194px); padding-top: 30px; - flex: 1 1 auto; - .top { - display: flex; - align-items: center; - justify-content: center; - .top-item { - font-size: 29px; - color: #F7F8FA; - div:first-child { - width: 99px; - height: 99px; - text-align: center; - line-height: 99px; - background: url('./img/1.png') 0 0 no-repeat; - background-size: contain; - color: #D6EEEF; - } - div:last-child { - margin-top: 20px; - font-size: 24px; - font-family: PingFangSC, PingFang SC; - font-weight: 500; - color: #E4FFFE; - line-height: 29px; - text-shadow: 0px 1px 4px rgba(122,255,248,0.5); - } - } - .top-2 { - div:first-child { - background-image: url('./img/2.png') - } - - } - .top-3 { - div:first-child { - background-image: url('./img/3.png') - } - } - .top-4 { - div:first-child { - background-image: url('./img/4.png') - } - } - .top-5 { - div:first-child { - background-image: url('./img/5.png') - } - } - .top-item ~.top-item { - margin-left: 100px; - } + flex: 0 1 auto; + display: flex; + flex-direction: column; + + .preview-map { + margin-top: 20px; + flex: 1 1 auto; + overflow: hidden; } } } -- Gitblit v1.9.3