🅰 地图设计器初步完稿

src/api/platform/common/controller/mapLogisticPoint.ts

@@ -0,0 +1,28 @@
+/**
+ * 提供api模板规范代码参考,请尽量保证编写代码风格跟模板规范代码一致
+ * Copyright © 2020-2022 <a href="http://www.entfrm.com/">entfrm</a> All rights reserved.
+ * author entfrm开发团队-王翔
+ */
+import type { MapLogisticPointParams, MapLogisticPoint, MapLogisticPointResult } from '../entity/mapLogisticPoint';
+import { defHttp } from '/@/utils/http/axios';
+
+enum Api {
+  list = '/common_proxy/common/mapLogisticPoint/list',
+  get = '/common_proxy/common/mapLogisticPoint',
+  add = '/common_proxy/common/mapLogisticPoint/save',
+  edit = '/common_proxy/common/mapLogisticPoint/update',
+  del = '/common_proxy/common/mapLogisticPoint/remove',
+  getTaskPresetPointByCourierUserId = '/common_proxy/common/mapLogisticPoint/getTaskPresetPointByCourierUserId'
+}
+
+export const listMapLogisticPoint = (params?: Partial<MapLogisticPointParams>) => defHttp.get<MapLogisticPointResult>({ url: Api.list, params }, { isReturnResultResponse: true });
+
+export const addMapLogisticPoint = (params: Partial<MapLogisticPoint>) => defHttp.post({ url: Api.add, data: params });
+
+export const editMapLogisticPoint = (params: Partial<MapLogisticPoint>) => defHttp.put({ url: Api.edit, data: params });
+
+export const getMapLogisticPoint = (id: string) => defHttp.get<MapLogisticPoint>({ url: `${Api.get}/${id}` });
+
+export const getTaskPresetPointByCourierUserId = (courierUserId: string) => defHttp.get<MapLogisticPoint[]>({ url: `${Api.getTaskPresetPointByCourierUserId}/${courierUserId}` });
+
+export const delMapLogisticPoint = (ids: string) => defHttp.delete({ url: `${Api.del}/${ids}` });

src/api/platform/common/entity/mapLogistic.ts

@@ -32,6 +32,7 @@ export interface MapLogistic extends Partial<CommonEntity> {
     version?: number;
     mapTask: MapTask[];
     mapLogisticPoint: MapLogisticPoint[];
+    mapTaskPresetLogisticPoint: MapLogisticPoint[];
 }
 
 export type MapLogisticResult = R<MapLogistic[]>;

src/api/platform/common/entity/mapLogisticPoint.ts

@@ -21,6 +21,7 @@ export interface MapLogisticPoint extends Partial<CommonEntity> {
     hospitalId?: string;
     hospitalName?: string;
     batchCode?: string;
+    courierUserId: string;
     mapLogisticId?: string;
     mapTaskId?: string;
     key?: string;

src/api/platform/common/entity/mapTaskPreset.ts

@@ -23,7 +23,7 @@ export interface MapTaskPreset extends Partial<CommonEntity> {
     destinationPresetName?: string;
     destinationPresetLng?: number;
     destinationPresetLat?: number;
-    courierUserId?: string;
+    courierUserId: string;
     key?: string;
     fileId: string | string[];
     estimateTime?: string;

src/components/AMap/src/AMapDesigner/index.vue

@@ -106,12 +106,12 @@
   import { getCourierUserList, listUser } from '/@/api/platform/system/controller/user';
   import { listOrg } from '/@/api/platform/common/controller/org';
   import { useUserStore } from '/@/store/modules/user';
-  import { split, divide, subtract, merge, isEmpty, cloneDeep, add } from 'lodash-es';
+  import { split, divide, subtract, merge, isEmpty, cloneDeep, add, concat } from 'lodash-es';
   import componentSetting from '/@/settings/componentSetting';
   import { BasicUpload } from '/@/components/Upload';
   import { commonUpload } from '/@/api/platform/core/controller/upload';
   import { useMessage } from '/@/hooks/web/useMessage';
-  import { listMapTaskPreset } from '/@/api/platform/common/controller/mapTaskPreset';
+  import { getTaskPresetPointByCourierUserId } from '/@/api/platform/common/controller/mapLogisticPoint';
   import { defaultMapData } from '/@/enums/amapEnum';
   import Toolbar from '../components/Toolbar.vue';
   import { saveOrUpdateMapLogistic } from '/@/api/platform/common/controller/mapLogistic';
@@ -631,7 +631,7 @@
       mapState.mapData.courierUserName = courierUserMap.label;
       mapState.mapData.courierLng = courierUserMap.mapLng;
       mapState.mapData.courierLat = courierUserMap.mapLat;
-      drawMapNavigate(mapState.mapData.mapLogisticPoint);
+      drawMapNavigate(concat(mapState.mapData.mapLogisticPoint, mapState.mapData.mapTaskPresetLogisticPoint));
     } else notification.warn({
       message: '查找不到起点数据,请检查起点!',
       duration: 2
@@ -704,9 +704,7 @@
         }
       });
       setTableData(mapState.mapData.mapTask);
-      if (!isEmpty(mapState.mapData.mapLogisticPoint)) {
+      drawMapNavigate(concat(mapState.mapData.mapLogisticPoint, mapState.mapData.mapTaskPresetLogisticPoint));
-        drawMapNavigate(mapState.mapData.mapLogisticPoint);
-      }
     });
   }
 
@@ -795,7 +793,8 @@
         key: item.key,
         taskType: item.taskType,
         hospitalId: hospital.value,
-        hospitalName: hospital.label
+        hospitalName: hospital.label,
+        courierUserId: mapState.mapData.courierUserId
       }, {
         lng: org?.mapLng,
         lat: org?.mapLat,
@@ -803,43 +802,22 @@
         key: item.key,
         taskType: item.taskType,
         hospitalId: org?.value,
-        hospitalName: org?.label ?? item.orgName
+        hospitalName: org?.label ?? item.orgName,
+        courierUserId: mapState.mapData.courierUserId,
       });
     });
     // 查找并添加与自己有关的交接预设任务,只能添加设置了位置的标记点
-    await listMapTaskPreset({ size: 40, courierUserId: mapState.mapData.courierUserId }).then(res => {
+    mapState.mapData.mapTaskPresetLogisticPoint = await getTaskPresetPointByCourierUserId(mapState.mapData.courierUserId);
-      res.data?.map(item => {
-        const taskPresetHospital =  item.orginPresetId ? mapState.hospitalList.find(e => e.value == item.orginPresetId) : {} as MapPointType,
-              taskPresetOrg = item.destinationPresetId ? mapState.orgList.find(e => e.value == item.destinationPresetId) : {} as MapPointType;
-        pointData.push({
-          lng: taskPresetHospital?.mapLng ?? item.orginPresetLng,
-          lat: taskPresetHospital?.mapLat ?? item.orginPresetLat,
-          type: '0',
-          taskType: '1',
-          mapTaskId: item.id,
-          hospitalId: taskPresetHospital?.value ?? item.orginPresetId,
-          hospitalName: taskPresetHospital?.label ?? item.orginPresetName
-        }, {
-          lng: taskPresetOrg?.mapLng ?? item.destinationPresetLng,
-          lat: taskPresetOrg?.mapLat ?? item.destinationPresetLat,
-          type: '1',
-          taskType: '1',
-          mapTaskId: item.id,
-          hospitalId: taskPresetOrg?.value ?? item.destinationPresetId,
-          hospitalName: taskPresetOrg?.label ?? item.destinationPresetName
-        });
-      });
-    });
     pointData.forEach((item, index)=> item.sort = add(index, 1));
     mapState.mapData.mapLogisticPoint = pointData;
-    drawMapNavigate(pointData);
+    drawMapNavigate(concat(mapState.mapData.mapLogisticPoint, mapState.mapData.mapTaskPresetLogisticPoint));
   }
 
   /** 处理地图标记点数据 */
   function handleMapPoint(mapLogisticPoint: MapLogisticPoint[] = []) {
     if (!isEmpty(mapLogisticPoint)) {
       mapState.mapData.mapLogisticPoint = mapLogisticPoint;
-      drawMapNavigate(mapLogisticPoint);
+      concat(mapState.mapData.mapLogisticPoint, mapState.mapData.mapTaskPresetLogisticPoint);
     }
   }
 

src/components/AMap/src/amap.data.tsx

@@ -201,6 +201,7 @@ export const taskPresetChildColumns: BasicColumn[] = [
 /** 地图标记点表格列 */
 export const mapPointColumns: VxeTableDefines.ColumnOptions[] = [
   {
+    field: 'drag',
     width: '50px',
     align: 'center',
     slots: {

src/components/AMap/src/components/MapPointModal.vue

@@ -13,8 +13,11 @@
                       :toolbarControl="false"
         />
       </div>
-      <div class="rightLayout">
+      <div class="rightTopLayout">
-        <vxe-grid ref="VxeGridEl" v-bind="state.gridOptions"/>
+        <vxe-grid ref="MapLogisticPointVxeGridEl" v-bind="state.gridOptions"/>
+      </div>
+      <div class="rightBottomLayout">
+        <vxe-grid ref="MapTaskPresetPointVxeGridEl" v-bind="state.gridOptions"/>
       </div>
     </div>
   </BasicModal>
@@ -27,8 +30,9 @@
   import { VxeGridProps } from 'vxe-table';
   import { mapPointColumns } from '../amap.data';
   import { defaultMapData } from '/@/enums/amapEnum';
-  import { add, cloneDeep } from 'lodash-es';
+  import { add, cloneDeep, concat } from 'lodash-es';
   import { MapLogistic } from '/@/api/platform/common/entity/mapLogistic';
+  import { VxeTableDefines } from 'vxe-table/types/table';
 
   /** 类型规范统一声明定义区域 */
   interface WindowState {
@@ -38,7 +42,8 @@
   }
 
   /** 通用变量统一声明区域 */
-  const VxeGridEl = ref();
+  const MapLogisticPointVxeGridEl = ref();
+  const MapTaskPresetPointVxeGridEl = ref();
   const AMapDesignerEl = ref();
   const state = reactive<WindowState>({
     sortable: null,
@@ -60,18 +65,45 @@
     state.mapData = cloneDeep(data.mapData);
     const props: Partial<ModalProps> = { confirmLoading: false };
     props.title = '标记点配置';
+    const columns: VxeTableDefines.ColumnOptions[] = [
+      {
+        field: 'drag',
+        width: '50px',
+        align: 'center',
+        slots: {
+          default({row}) {
+            return [
+              <span>
+                <i class="vxe-icon-lock-fill"/>
+              </span>
+            ];
+          },
+          header({column}) {
+            return [
+              <vxe-tooltip content="此处数据只能展示不能操作!">
+                <i class="vxe-icon-info-circle-fill"/>
+              </vxe-tooltip>
+            ];
+          }
+        }
+      }
+    ];
     nextTick(()=> {
-      state.sortable = Sortable.create(VxeGridEl.value!.$el.querySelector('.body--wrapper>.vxe-table--body tbody'), {
+      state.sortable = Sortable.create(MapLogisticPointVxeGridEl.value!.$el.querySelector('.body--wrapper>.vxe-table--body tbody'), {
         handle: '.drag-btn',
         onEnd: ({ newIndex, oldIndex }) => {
           const currRow = state.mapData.mapLogisticPoint?.splice(oldIndex!, 1)[0];
           state.mapData.mapLogisticPoint?.splice(newIndex!, 0, currRow);
-          AMapDesignerEl.value?.drawMapNavigate(state.mapData.mapLogisticPoint);
+          AMapDesignerEl.value?.drawMapNavigate(concat(state.mapData.mapLogisticPoint, state.mapData.mapTaskPresetLogisticPoint));
         },
         ghostClass: 'ghostGrid'
       });
     });
-    VxeGridEl.value.reloadData(state.mapData.mapLogisticPoint);
+    MapLogisticPointVxeGridEl.value.reloadData(state.mapData.mapLogisticPoint);
+    MapTaskPresetPointVxeGridEl.value.reloadColumn(mapPointColumns.map(item =>
+        columns.find(e => e.field == item.field) || item
+    ));
+    MapTaskPresetPointVxeGridEl.value.reloadData(state.mapData.mapTaskPresetLogisticPoint);
     // 尾部:设置处理后的最终配置数据
     setModalProps(props);
   });
@@ -120,17 +152,24 @@
     left: 0;
     right: 50%;
     bottom: 0;
-
   }
 
-  .rightLayout {
+  .rightTopLayout {
     position: absolute;
-    top: 0;
+    top: 70%;
     left: 50%;
     right: 0;
     bottom: 0;
+  }
 
+  .rightBottomLayout {
+    position: absolute;
+    top: 0;
+    left: 50%;
+    right: 0;
+    bottom: 30%;
   }
+
 }
 
 

src/enums/amapEnum.ts

@@ -22,8 +22,10 @@ export const defaultMapData: ()=> MapLogistic = ()=> cloneDeep({
   fileId: [],
   estimateTime: '',
   requireTime: '',
-  /** 地图任务数据 */
+  /** 地图任务列表 */
   mapTask: [],
-  /** 地图预览点数据 */
+  /** 地图预览点列表 */
   mapLogisticPoint: [],
+  /** 地图转办任务预设标记点列表 */
+  mapTaskPresetLogisticPoint:[]
 });