地图和操作

src/pages/modules/device.vue

@@ -65,7 +65,8 @@
 
 <script>
 import SaveChain from './save-chain.vue'
-import { queryStation, queryTaskChain, queryTaskChainDtl, sendTask, saveTask, cancelTask, deleteTaskChain, updateStation } from '@config/getData.js'
+import { queryStation, queryTaskChain } from '@config/mork.js'
+import { queryTaskChainDtl, sendTask, saveTask, cancelTask, deleteTaskChain, updateStation } from '@config/getData.js'
 export default {
   components: {
     SaveChain
@@ -74,7 +75,7 @@ export default {
     return {
       activeName: 'zdy',
       stationName: '',
-      radioOption: [{label: '取货', text: '取', value: 'Ascend'}, {label: '放货', text: '放', value: 'Descend'}, {label: '移动', text: '移', value: 'Move'}, {label: '返回点', text: '返', value: 'Customize'}],
+      radioOption: [{label: '取货', text: '取', value: 'Ascend'}, {label: '放货', text: '放', value: 'Descend'}, {label: '移动', text: '移', value: 'Move'}, {label: '返回点', text: '返', value: 'Move'}],
       dataList: [],
       newData: [],
       linkData: [],
@@ -93,8 +94,27 @@ export default {
   },
   mounted () {
     this._queryStation()
+    document.addEventListener('click', this.handleGlobalClick)
+  },
+  beforeDestroy () {
+    document.removeEventListener('click', this.handleGlobalClick)
   },
   methods: {
+    handleGlobalClick (event) {
+      // 遍历所有 popover
+      for (let i = 0; i < this.dataList.length; i++) {
+        const popover = this.$refs[`popover-${i}`]
+        if (popover && popover[0]) {
+          if (popover[0].$el.contains(event.target)) {
+            return
+          }
+          if (document.querySelector('#keyboard') && document.querySelector('#keyboard').contains(event.target)) {
+            return
+          }
+          popover[0].doClose()
+        }
+      }
+    },
     // 站点查询
     async _queryStation () {
       try {
@@ -122,6 +142,11 @@ export default {
     openPopover (index) {
       const popover = this.$refs[`popover-${index}`]
       if (popover && popover[0]) {
+        for (let i = 0; i < this.dataList.length; i++) {
+          if (i !== index) {
+            this.closePopover(i)
+          }
+        }
         popover[0].doShow()
         this.stationName = ''
       }
@@ -177,6 +202,7 @@ export default {
     },
     // 选取动作类型
     radioInput (e, i, value) {
+      console.log(this.newData)
       const lastItem = this.newData.length > 0 ? this.newData[this.newData.length - 1].station_code : null
       if (lastItem === e.station_code) {
         this.$message('相邻的两个站点不能相同')
@@ -188,6 +214,9 @@ export default {
         this.closePopover(i)
         return
       }
+      if (this.newData.length > 0 && this.newData[this.newData.length - 1].action_type === 'Move') {
+        return
+      }
       e.action_type = value
       this.newData.push({station_code: e.station_code, station_name: e.station_name, action_type: e.action_type})
       this.closePopover(i)