diff --git a/src/components/MapBox.vue b/src/components/MapBox.vue
index 1f18079..ab68f84 100644
--- a/src/components/MapBox.vue
+++ b/src/components/MapBox.vue
@@ -339,37 +339,20 @@ export default {
}), 'top-left')
}
- // 禁飞区 设置组件
+ // 禁飞区 限飞区 设置组件
if (this.enableNofly) {
- const defaultPolygons = [
- [
- [113.0, 23.0],
- [113.1, 23.0],
- [113.1, 23.1],
- [113.0, 23.1],
- [113.0, 23.0]
- ],
- [
- [113.2, 23.2],
- [113.3, 23.2],
- [113.3, 23.3],
- [113.2, 23.3],
- [113.2, 23.2]
- ],
- [
- [113.2, 24.2],
- [113.5, 23.1],
- [113.5, 23.2],
- [113.3, 23.2],
- [113.3, 23.3],
- [113.2, 23.3],
- [113.4, 23.2]
- ]
- ]
+ const defaultPolygons = this.$store.state.noflyData[0]
+ const shopId = this.$store.state.user.shop_id
+
this.map.addControl(new NoFlyControl({
defaultPolygons,
+ shopId, // 传给 NoFlyControl
onSave: (polygons) => {
- console.log('polygons', polygons)
+ if (typeof this.onSave === 'function') {
+ this.onSave(polygons)
+ } else {
+ console.log('禁飞区保存数据:', polygons)
+ }
}
}), 'top-left')
}
@@ -802,9 +785,8 @@ export default {
},
beforeDestroy () {
if (this.map) {
- this.$store.commit('app/setDefaultLonLat', this.map.getCenter()) // 记录当前经纬度 缺省
- this.$store.commit('app/setDefaultZoom', this.map.getZoom()) // 记录当前经纬度 缺省
- this.map.remove() // 清除地图资源
+ this.$store.commit('app/setDefaultLonLat', this.map.getCenter())
+ this.$store.commit('app/setDefaultZoom', this.map.getZoom())
}
},
watch: {
diff --git a/src/components/PlaneStatus.vue b/src/components/PlaneStatus.vue
index 1f6424f..30c9342 100644
--- a/src/components/PlaneStatus.vue
+++ b/src/components/PlaneStatus.vue
@@ -180,6 +180,7 @@ export default {
watch: {
heartRandom: {
handler () {
+ console.log('心跳：', this.plane.heartBeat)
// 心跳动画
this.heartAnimation = true
setTimeout(() => {
diff --git a/src/store/index.js b/src/store/index.js
index b16ed4a..5a869ae 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -17,7 +17,7 @@ const store = new Vuex.Store({
airList: [], // 所有飞机列表
siteList: [], // 站点列表
routeList: [], // 航线列表
- noflyData: [], // 禁飞区数据
+ noflyData: [[], []], // [0]禁飞区数据 [1]限制飞区
categoryList: [], // 分类列表(小程序)
spuList: [], // 商品spu列表
skuList: [], // 商品sku列表
@@ -69,8 +69,15 @@ const store = new Vuex.Store({
/**
* @description: 设置禁飞区列表
*/
- setNoflyData (state, data) {
- state.noflyData = data
+ setNoflyData (state, payload) {
+ if (payload && payload.nofly_data && payload.restrictfly_data) {
+ state.noflyData = [
+ JSON.parse(payload.nofly_data || '[]'),
+ JSON.parse(payload.restrictfly_data || '[]')
+ ]
+ } else {
+ state.noflyData = [[], []]
+ }
},
/**
* @description: 设置分类列表
@@ -607,16 +614,21 @@ const store = new Vuex.Store({
},
/**
* @description: 获取禁飞区数据
+ * @param {str} shopId 需要传shopId（总管理员调用其他商铺禁飞区）
*/
- async fetchNoflyData ({ commit }) {
- const res = await api.get('getNoflyData')
+ async fetchNoflyData ({ commit }, shopId) {
+ const params = new FormData()
+ params.append('shop_id', shopId)
+
+ const res = await api.post('getNoflyData', params, 'Plane')
+
if (res.data.status === 1) {
commit('setNoflyData', res.data.noflyData)
} else {
- commit('setNoflyData', {})
- Message.warning(res.data.msg)
+ commit('setNoflyData', [[], []])
+ Message.warning(res.data.msg || '暂无禁飞区数据')
}
- return res.data.routeData
+ return res
},
/**
* @description: 获取分类列表
diff --git a/src/utils/api/table.js b/src/utils/api/table.js
index 9701265..89bb527 100644
--- a/src/utils/api/table.js
+++ b/src/utils/api/table.js
@@ -190,3 +190,31 @@ export async function saveFlyData (data) {
const res = await api.post('saveFlyData', params, 'Plane')
return res
}
+
+/**
+ * @description: 保存禁飞区数据
+ * @param {string|number} shop_id 商铺ID
+ * @param {Array} nofly_data 禁飞区数据数组
+ * @param {Array} restrictfly_data 限制飞区数据数组
+ * @returns {Object|null} 返回接口响应数据 或 null 表示失败
+ */
+export async function setNoflyData (shopId, noflyData, restrictflyData) {
+ try {
+ const params = new URLSearchParams()
+ params.append('shop_id', shopId || '')
+ params.append('nofly_data', JSON.stringify(noflyData || []))
+ params.append('restrictfly_data', JSON.stringify(restrictflyData || []))
+
+ const res = await api.post('setNoflyData', params)
+ if (res.data.status === 1) {
+ store.dispatch('fetchNoflyData', shopId)// 更新禁飞区数据
+ Message.success(res.data.msg)
+ } else {
+ Message.warning(res.data.msg)
+ }
+ return res.data
+ } catch (error) {
+ Message.error('保存禁飞区数据失败')
+ return null
+ }
+}
diff --git a/src/utils/mapboxgl_plugs/index.js b/src/utils/mapboxgl_plugs/index.js
index 31e07e6..0861ef3 100644
--- a/src/utils/mapboxgl_plugs/index.js
+++ b/src/utils/mapboxgl_plugs/index.js
@@ -1,6 +1,8 @@
import mapboxgl from 'mapbox-gl'
import MapboxDraw from '@mapbox/mapbox-gl-draw'
import '@mapbox/mapbox-gl-draw/dist/mapbox-gl-draw.css'
+import { setNoflyData } from '@/utils/api/table'
+import { Message } from 'element-ui'
/**
* 自定义地图样式切换控件
@@ -216,7 +218,7 @@ export class CustomFullscreenControl extends mapboxgl.FullscreenControl {
}
}
-// 禁飞区控件
+// 禁飞区 限飞区 保存 删除控件
export class NoFlyControl {
constructor (options = {}) {
this._map = null
@@ -224,7 +226,8 @@ export class NoFlyControl {
this._draw = null
this._onDrawFinish = options.onDrawFinish || function () {}
this._defaultPolygons = options.defaultPolygons || []
- this._onSave = options.onSave || function () {}
+ this._onSave = options.onSave || function () { }
+ this._shopId = options.shopId
}
onAdd (map) {
@@ -360,11 +363,22 @@ export class NoFlyControl {
}
}
- _savePolygons () {
+ async _savePolygons () {
if (!this._draw) return
const allFeatures = this._draw.getAll()
- const polygons = allFeatures.features.map(f => f.geometry.coordinates)
- // 调用传入的保存回调
+
+ const polygons = allFeatures.features
+ .filter(f => f.geometry.type === 'Polygon')
+ .map(f => f.geometry.coordinates[0]) // 解开一层数组 ✅
+
+ try {
+ const shopId = this._shopId
+ await setNoflyData(shopId, polygons, [])
+ } catch (error) {
+ Message.error('上传禁飞区数据时发生错误')
+ console.error(error)
+ }
+
this._onSave(polygons)
}
}
diff --git a/src/views/layout/components/main/nofly/set.vue b/src/views/layout/components/main/nofly/set.vue
index e8eb014..2c82f63 100644
--- a/src/views/layout/components/main/nofly/set.vue
+++ b/src/views/layout/components/main/nofly/set.vue
@@ -1,6 +1,6 @@
-
+
@@ -9,17 +9,19 @@ import MapBox from '@/components/MapBox'
export default {
name: 'Nofly',
- data () {
- return {
- }
- },
components: {
MapBox
},
+ data () {
+ return {
+ showMapbox: true,
+ mapboxKey: 0
+ }
+ },
computed: {
- /**
- * @description: 侧边栏显隐
- */
+ noflyData () {
+ return this.$store.state.noflyData
+ },
isCollapse () {
return this.$store.state.app.isCollapse
}
@@ -30,20 +32,25 @@ export default {
mounted () {
},
watch: {
- /**
- * @description: 侧边栏缩进有变化时 地图重新自适应
- */
- isCollapse: {
- handler (val) {
- if (val) {
- this.$refs.mapbox.handleResize()
- }
+ noflyData: {
+ deep: true,
+ immediate: true,
+ handler () {
+ this.showMapbox = false
+ this.$nextTick(() => {
+ this.mapboxKey++
+ this.showMapbox = true
+ })
+ }
+ },
+ isCollapse (val) {
+ if (val) {
+ this.$refs.mapbox.handleResize()
}
}
- },
- destroyed () {
}
}
+
-
+
diff --git a/src/views/layout/index.vue b/src/views/layout/index.vue
index 65f53ae..c4162d4 100644
--- a/src/views/layout/index.vue
+++ b/src/views/layout/index.vue
@@ -112,7 +112,7 @@ export default {
this.$store.dispatch('fetchAdminList')// 获取管理员列表
this.$store.dispatch('fetchSiteList')// 获取站点列表
this.$store.dispatch('fetchRouteList')// 获取航线列表
- this.$store.dispatch('fetchNoflyData')// 获取禁飞区数据
+ this.$store.dispatch('fetchNoflyData', this.shop_id)// 获取禁飞区数据 注意这里要有shopid 总管理员再操作其他商铺飞机时 要刷新此缓存 需要对应商铺的禁飞区数据
this.$store.dispatch('fetchCategoryList')// 获取分类列表（小程序）
this.$store.dispatch('fetchSpuList')// 获取商品spu列表
this.$store.dispatch('fetchSkuList')// 获取商品sku列表