riku
2023-07-14 2630f037f5f9b9ae23df8ae60900b6b361e3528e
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
import { ref, unref } from 'vue';
import { defineStore } from 'pinia';
import mapGrid from '@/components/map/mapGrid';
import baseMapUtil from '@/components/map/baseMapUtil';
 
export const useGridStore = defineStore('grid', () => {
  // 当前加载的网格数据集合
  const gridList = ref([]);
  // 当前选中操作的网格信息
  const selectedGrid = ref({});
  // 当前选中操作的网格是否处于可编辑状态
  const isEdit = ref(false);
 
  /**
   * 检查当前是否有选中的网格
   * @returns {Boolean}
   */
  function _checkGridExist() {
    return selectedGrid.value.gId != undefined;
  }
 
  /**数据增删**************************************************************/
  /**
   * 选择当前操作的网格
   * @param {Object} grid
   */
  function setGrid(index) {
    if (index >= 0 && index < gridList.value.length) {
      selectedGrid.value = gridList.value[index];
    }
  }
 
  /**
   * 设置网格数据
   * @param {Array<Object>} list
   */
  function setGridList(list) {
    gridList.value = list;
  }
 
  /**
   * 新增网格
   * @param  {...any} grids
   */
  function addGrid(...grids) {
    grids.forEach((g) => {
      gridList.value.unshift(g);
    });
  }
 
  /**
   * 网格删除
   */
  function deleteGrid(i) {
    closeGridEdit();
    if (gridList.value[i].overlays)
      baseMapUtil.removeView(this.gridList[i].overlays);
    gridList.value.splice(i, 1);
  }
 
  /**地图网格编辑**************************************************************/
  /**
   * 开启网格多边形编辑
   */
  function openGridEdit() {
    if (!_checkGridExist()) return;
    const adsorbPolygons = [];
    const overlays = selectedGrid.value.overlays;
    gridList.value.forEach((e) => {
      if (overlays != e.overlays) {
        adsorbPolygons.push(unref(e.overlays));
      }
    });
    mapGrid.openPolyGonEditor(overlays, adsorbPolygons);
    isEdit.value = true;
  }
 
  /**
   * 关闭网格多边形编辑
   */
  function closeGridEdit() {
    mapGrid.closePolyGonEditor();
    isEdit.value = false;
  }
 
  /**
   * 保存对当前网格的绘制变更
   */
  function saveSelectedGrid() {
    if (!_checkGridExist()) return;
    selectedGrid.value.gSide = selectedGrid.value.overlays.getPath();
  }
 
  /**
   * 取消对当前网格的绘制变更
   */
  function quitSelectedGrid() {
    if (!_checkGridExist()) return;
    baseMapUtil.removeView(selectedGrid.value.overlays);
    selectedGrid.value.overlays = mapGrid.drawPolygon(
      selectedGrid.value.gSide
    );
  }
 
  /**地图网格显示隐藏**************************************************************/
  /**
   * 网格集合显示
   */
  function showGrids() {
    const grids = [];
    gridList.value.forEach((l, i) => {
      showGrid(i);
      grids.push(l.overlays);
    });
    baseMapUtil.setFitView(grids, 1);
  }
 
  /**
   * 网格显示
   */
  function showGrid(index) {
    const item = gridList.value[index];
    if (item.overlays) {
      baseMapUtil.setFitView(item.overlays);
    } else {
      item.overlays = mapGrid.drawPolygon(item.gSide);
    }
  }
 
  return {
    gridList,
    selectedGrid,
    isEdit,
    setGrid,
    setGridList,
    addGrid,
    deleteGrid,
    openGridEdit,
    closeGridEdit,
    saveSelectedGrid,
    quitSelectedGrid,
    showGrids,
    showGrid
  };
});