wans

src/api/store/store.js

@@ -112,6 +112,21 @@ export function fetchStoreStore (parameter) {
     }
   })
 }
+/**
+ * fetch single func
+ * parameter: { }
+ * @param parameter
+ * @returns {*}
+ */
+export function fetchStoreSpare (parameter) {
+  return axios({
+    url: 'sqarepartmanage/spare-part-info/store?' + stringify(parameter),
+    method: 'get',
+    headers: {
+      'Content-Type': 'application/json;charset=UTF-8'
+    }
+  })
+}
 /**
  * query list func
  * parameter: { }

src/views/idle-assets-map/IdleAssetsStoreMap.vue

@@ -66,7 +66,7 @@ export default {
       } else {
         fetchStoreStore({ id: store.id }).then(res => {
           this.visible = false
-          this.$refs.storeDetailMap.base(res.data, store.backGroundMap)
+          this.$refs.storeDetailMap.base(res.data, store.backGroundMap, store.id)
         })
       }
     },

src/views/idle-assets-map/modules/StoreDetailMap.vue

@@ -1,7 +1,12 @@
 <template>
   <div v-show="visible">
     <div class="btn">
-      <a-button type="primary" @click="handleCancel">返回</a-button>
+      <a-space>
+        <a-button @click="handleView">
+          备件信息
+        </a-button>
+        <a-button type="primary" @click="handleCancel">返回</a-button>
+      </a-space>
     </div>
     <div style="position: relative;">
       <div class="point" v-for="store in dataList" :key="store.id" :style="computPosition(store.positionX, store.positionY)">
@@ -9,23 +14,40 @@
       </div>
       <img v-if="opcImg" :src="opcImg" width="100%" alt="">
     </div>
+    <a-drawer
+      title="备件信息"
+      placement="right"
+      :closable="false"
+      :visible="show"
+      @close="close"
+    >
+      <p>Some contents...</p>
+      <p>Some contents...</p>
+      <p>Some contents...</p>
+    </a-drawer>
   </div>
 </template>
 
 <script>
+import { fetchStoreSpare } from '@/api/store/store'
 export default {
   data () {
     return {
       visible: false,
+      show: false,
+      type: null,
+      storeId: null,
       dataList: [],
+      spareList: [],
       opcImg: ''
     }
   },
   methods: {
-    base (record, imgUrl) {
+    base (record, imgUrl, storeId) {
       this.visible = true
       this.dataList = record
       this.opcImg = imgUrl
+      this.storeId = storeId
     },
     computPosition (x, y) {
       const left = `calc(${x}% - 35px)`
@@ -35,6 +57,19 @@ export default {
         top
       }
     },
+    async handleView () {
+      await this.fetchStoreSpare()
+      this.show = true
+    },
+    fetchStoreSpare () {
+      fetchStoreSpare({ storeId: this.storeId, typeId: this.type }).then(res => {
+        this.spareList = res.data
+      })
+    },
+    close () {
+      this.show = false
+      this.type = null
+    },
     handleCancel () {
       this.$emit('ok')
       this.visible = false