Browse Source

🚀 地图设计器调整完毕

master
wangxiang 3 years ago
parent
commit
32a0d7d4b1
  1. 7
      src/api/platform/common/controller/mapLogistic.ts
  2. 20
      src/api/platform/common/entity/mapLogistic.ts
  3. 1
      src/api/platform/common/entity/mapTaskPreset.ts
  4. 51
      src/components/AMap/src/AMapDesigner/index.vue
  5. 20
      src/components/AMap/src/amap.data.tsx
  6. 7
      src/components/AMap/src/components/MapPointModal.vue
  7. 5
      src/components/AMap/src/components/MapTaskModal.vue
  8. 19
      src/enums/amapEnum.ts
  9. 30
      src/views/common/mapLogistic/MapLogisticModal.vue
  10. 2
      src/views/common/mapLogistic/index.vue

7
src/api/platform/common/controller/mapLogistic.ts

@ -9,16 +9,13 @@ import { defHttp } from '/@/utils/http/axios';
enum Api { enum Api {
list = '/common_proxy/common/mapLogistic/list', list = '/common_proxy/common/mapLogistic/list',
get = '/common_proxy/common/mapLogistic', get = '/common_proxy/common/mapLogistic',
add = '/common_proxy/common/mapLogistic/save', saveOrUpdate = '/common_proxy/common/mapLogistic/saveOrUpdate',
edit = '/common_proxy/common/mapLogistic/update',
del = '/common_proxy/common/mapLogistic/remove' del = '/common_proxy/common/mapLogistic/remove'
} }
export const listMapLogistic = (params?: Partial<MapLogisticParams>) => defHttp.get({ url: Api.list, params }, { isReturnResultResponse: true }); export const listMapLogistic = (params?: Partial<MapLogisticParams>) => defHttp.get({ url: Api.list, params }, { isReturnResultResponse: true });
export const addMapLogistic = (params: Partial<MapLogistic>) => defHttp.post({ url: Api.add, data: params }); export const saveOrUpdateMapLogistic = (params: Partial<MapLogistic>) => defHttp.post({ url: Api.saveOrUpdate, data: params });
export const editMapLogistic = (params: Partial<MapLogistic>) => defHttp.put({ url: Api.edit, data: params });
export const getMapLogistic = (id: string) => defHttp.get<MapLogistic>({ url: `${Api.get}/${id}` }); export const getMapLogistic = (id: string) => defHttp.get<MapLogistic>({ url: `${Api.get}/${id}` });

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

@ -11,22 +11,24 @@ import type { CommonEntity, Page } from '/@/api/common/data/entity';
export type MapLogisticParams = Page & MapLogistic; export type MapLogisticParams = Page & MapLogistic;
export interface MapLogistic extends CommonEntity { export interface MapLogistic extends Partial<CommonEntity> {
id: string; id?: string;
name: string; name: string;
courierUserId: string; courierUserId: string;
courierUserName: string; courierUserName: string;
courierLng: number; courierLng: Nullable<number>;
courierLat: number; courierLat: Nullable<number>;
sendOrderId: string; sendOrderId: string;
sendOrderName: string; sendOrderName: string;
sendOrderLng: number; sendOrderLng: Nullable<number>;
sendOrderLat: number; sendOrderLat: Nullable<number>;
fileId: string; fileId: string | string[];
estimateTime: string; estimateTime: string;
requireTime: string; requireTime: string;
batchCode: string; batchCode?: string;
version: string; version?: string;
mapTask: Recordable[];
mapLogisticPoint: Recordable[];
} }
export type MapLogisticResult = R<MapLogistic[]>; export type MapLogisticResult = R<MapLogistic[]>;

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

@ -23,6 +23,7 @@ export interface MapTaskPreset extends CommonEntity {
destinationPresetLng: number; destinationPresetLng: number;
destinationPresetLat: number; destinationPresetLat: number;
courierUserId: string; courierUserId: string;
key: string;
fileId: string; fileId: string;
estimateTime: string; estimateTime: string;
requireTime: string; requireTime: string;

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

@ -69,8 +69,20 @@
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import AMapLoader from '@amap/amap-jsapi-loader'; import AMapLoader from '@amap/amap-jsapi-loader';
import { reactive, watchEffect, getCurrentInstance, onBeforeMount, onUnmounted, ref, PropType, watch, toRefs, nextTick } from 'vue'; import {
import { operatePanelColumns, MapData, MapPointType } from '../amap.data'; reactive,
watchEffect,
getCurrentInstance,
onBeforeMount,
onUnmounted,
ref,
PropType,
watch,
toRefs,
nextTick,
toRaw
} from 'vue';
import { operatePanelColumns, MapPointType } from '../amap.data';
import hospital from '/@/assets/images/hospital.svg'; import hospital from '/@/assets/images/hospital.svg';
import medicalKit from '/@/assets/images/medical-kit.svg'; import medicalKit from '/@/assets/images/medical-kit.svg';
import hospitalTwinkle from '/@/assets/images/hospital-twinkle.gif'; import hospitalTwinkle from '/@/assets/images/hospital-twinkle.gif';
@ -93,6 +105,8 @@
import { listMapTaskPreset } from '/@/api/platform/common/controller/mapTaskPreset'; import { listMapTaskPreset } from '/@/api/platform/common/controller/mapTaskPreset';
import { defaultMapData } from '/@/enums/amapEnum'; import { defaultMapData } from '/@/enums/amapEnum';
import Toolbar from '../components/Toolbar.vue'; import Toolbar from '../components/Toolbar.vue';
import { saveOrUpdateMapLogistic } from '/@/api/platform/common/controller/mapLogistic';
import { MapLogistic } from '/@/api/platform/common/entity/mapLogistic';
/** 类型规范统一声明定义区域 */ /** 类型规范统一声明定义区域 */
interface MapState { interface MapState {
@ -107,13 +121,13 @@
amapKey: string; amapKey: string;
options: Recordable; options: Recordable;
}; };
mapData: MapData; mapData: MapLogistic;
rulesRef: Recordable; rulesRef: Recordable;
} }
const mapProps = defineProps({ const mapProps = defineProps({
options: { options: {
type: [Object, String] as PropType<MapData | string>, type: [Object, String] as PropType<MapLogistic | string>,
default: () => ({}) default: () => ({})
}, },
sidebarControl: propTypes.bool.def(true), sidebarControl: propTypes.bool.def(true),
@ -138,6 +152,7 @@
let scanCourierUserCircleRange; let scanCourierUserCircleRange;
let driving; let driving;
const emit = defineEmits(['success']);
const userStore = useUserStore(); const userStore = useUserStore();
const instance = getCurrentInstance(); const instance = getCurrentInstance();
const { createMessage } = useMessage(); const { createMessage } = useMessage();
@ -614,6 +629,7 @@
lat: hospital.mapLat, lat: hospital.mapLat,
sort: undefined, sort: undefined,
type: '0', type: '0',
key: item.key,
hospitalId: hospital.value, hospitalId: hospital.value,
hospitalName: hospital.label hospitalName: hospital.label
}); });
@ -622,6 +638,7 @@
lat: org.mapLat, lat: org.mapLat,
sort: undefined, sort: undefined,
type: '1', type: '1',
key: item.key,
hospitalId: org.value, hospitalId: org.value,
hospitalName: org.label hospitalName: org.label
}); });
@ -634,6 +651,7 @@
lat: item.orginPresetLat, lat: item.orginPresetLat,
sort: undefined, sort: undefined,
type: '0', type: '0',
key: item.key,
hospitalId: item.orginPresetId, hospitalId: item.orginPresetId,
hospitalName: item.orginPresetName hospitalName: item.orginPresetName
}); });
@ -642,6 +660,7 @@
lat: item.destinationPresetLat, lat: item.destinationPresetLat,
sort: undefined, sort: undefined,
type: '0', type: '0',
key: item.key,
hospitalId: item.destinationPresetId, hospitalId: item.destinationPresetId,
hospitalName: item.destinationPresetName hospitalName: item.destinationPresetName
}); });
@ -661,8 +680,20 @@
} }
/** 处理地图保存并发布 */ /** 处理地图保存并发布 */
function handleMapSave() { async function handleMapSave() {
await formElRef.value.validate();
const mapData = toRaw(mapState.mapData);
mapData.fileId = (mapData.fileId as [] || []).join(',');
mapData.mapTask.forEach(item => {
item.fileId = (item.fileId as [] || []).join(',');
if (~~item.taskType == 1) {
item?.mapTaskPreset?.forEach(childItem => {
childItem.fileId = (childItem.fileId as [] || [])?.join(',');
});
}
});
await saveOrUpdateMapLogistic(toRaw(mapState.mapData));
emit('success');
} }
/** 处理地图重置 */ /** 处理地图重置 */
@ -676,11 +707,11 @@
formElRef.value?.clearValidate(); formElRef.value?.clearValidate();
// //
mapState.mapData.courierUserName = ''; mapState.mapData.courierUserName = '';
mapState.mapData.courierLng = undefined; mapState.mapData.courierLng = null;
mapState.mapData.courierLat = undefined; mapState.mapData.courierLat = null;
mapState.mapData.sendOrderName = ''; mapState.mapData.sendOrderName = '';
mapState.mapData.sendOrderLng = undefined; mapState.mapData.sendOrderLng = null;
mapState.mapData.sendOrderLat = undefined; mapState.mapData.sendOrderLat = null;
mapState.mapData.mapTask = []; mapState.mapData.mapTask = [];
mapState.mapData.mapLogisticPoint = []; mapState.mapData.mapLogisticPoint = [];
setTableData([]); setTableData([]);

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

@ -22,26 +22,6 @@ export type MapPointType = {
mapNotify?: boolean; mapNotify?: boolean;
}; };
export interface MapData {
name: string;
courierUserId: string;
courierUserName: string;
courierLng: number | undefined;
courierLat: number | undefined;
sendOrderId: string;
sendOrderName: string;
sendOrderLng: number | undefined;
sendOrderLat: number | undefined;
fileId: string[];
estimateTime: string;
requireTime: string;
/** 地图任务数据 */
mapTask: Recordable[];
/** 地图预览点数据 */
mapLogisticPoint: Recordable[];
[key: string]: any;
}
/** 操作面板表格列 */ /** 操作面板表格列 */
export const operatePanelColumns: BasicColumn[] = [ export const operatePanelColumns: BasicColumn[] = [
{ {

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

@ -24,15 +24,16 @@
import { AMapDesigner } from '/@/components/AMap'; import { AMapDesigner } from '/@/components/AMap';
import Sortable from 'sortablejs'; import Sortable from 'sortablejs';
import { VxeGridProps } from 'vxe-table'; import { VxeGridProps } from 'vxe-table';
import { MapData, mapPointColumns } from '../amap.data'; import { mapPointColumns } from '../amap.data';
import { defaultMapData } from '/@/enums/amapEnum'; import { defaultMapData } from '/@/enums/amapEnum';
import { add, cloneDeep } from 'lodash-es'; import { add, cloneDeep } from 'lodash-es';
import { MapLogistic } from '/@/api/platform/common/entity/mapLogistic';
/** 类型规范统一声明定义区域 */ /** 类型规范统一声明定义区域 */
interface WindowState { interface WindowState {
sortable: Nullable<object>; sortable: Nullable<object>;
gridOptions: VxeGridProps; gridOptions: VxeGridProps;
mapData: MapData; mapData: MapLogistic;
} }
/** 通用变量统一声明区域 */ /** 通用变量统一声明区域 */
@ -81,7 +82,7 @@
// //
setModalProps({ confirmLoading: true }); setModalProps({ confirmLoading: true });
// //
state.mapData.mapLogisticPoint.forEach((item, index)=> { item.sort = add(index, 1); }); state.mapData.mapLogisticPoint?.forEach((item, index)=> { item.sort = add(index, 1); });
// //
closeModal(); closeModal();
emit('success', state.mapData.mapLogisticPoint); emit('success', state.mapData.mapLogisticPoint);

5
src/components/AMap/src/components/MapTaskModal.vue

@ -61,18 +61,19 @@
import { reactive, toRaw } from 'vue'; import { reactive, toRaw } from 'vue';
import {BasicModal, ModalProps, useModal, useModalInner} from '/@/components/Modal'; import {BasicModal, ModalProps, useModal, useModalInner} from '/@/components/Modal';
import { BasicTable, useTable, EditRecordRow, BasicColumn, ActionItem, TableAction } from '/@/components/Table'; import { BasicTable, useTable, EditRecordRow, BasicColumn, ActionItem, TableAction } from '/@/components/Table';
import { taskColumns, taskPresetColumns, MapData } from '../amap.data'; import { taskColumns, taskPresetColumns } from '../amap.data';
import TaskPresetModal from './MapTaskPresetModal.vue'; import TaskPresetModal from './MapTaskPresetModal.vue';
import { buildUUID } from '/@/utils/uuid'; import { buildUUID } from '/@/utils/uuid';
import { useMessage } from '/@/hooks/web/useMessage'; import { useMessage } from '/@/hooks/web/useMessage';
import { cloneDeep } from 'lodash-es'; import { cloneDeep } from 'lodash-es';
import { defaultMapData } from '/@/enums/amapEnum'; import { defaultMapData } from '/@/enums/amapEnum';
import { MapLogistic } from '/@/api/platform/common/entity/mapLogistic';
/** 类型规范统一声明定义区域 */ /** 类型规范统一声明定义区域 */
interface WindowState { interface WindowState {
taskOrdinaryCurrentEditRowRef: Nullable<Recordable>; taskOrdinaryCurrentEditRowRef: Nullable<Recordable>;
taskPresetCurrentEditRowRef: Nullable<Recordable>; taskPresetCurrentEditRowRef: Nullable<Recordable>;
mapData: MapData; mapData: MapLogistic;
} }
/** 通用变量统一声明区域 */ /** 通用变量统一声明区域 */

19
src/enums/amapEnum.ts

@ -5,29 +5,24 @@
* @create: 2022/4/9 * @create: 2022/4/9
*/ */
import { MapData } from '/@/components/AMap/src/amap.data'; import { MapLogistic } from '/@/api/platform/common/entity/mapLogistic';
import { cloneDeep } from 'lodash-es'; import { cloneDeep } from 'lodash-es';
export const defaultMapData: ()=> MapData = ()=> cloneDeep({ export const defaultMapData: ()=> MapLogistic = ()=> cloneDeep({
name: '', name: '',
courierUserId: '', courierUserId: '',
courierUserName: '', courierUserName: '',
courierLng: undefined, courierLng: null,
courierLat: undefined, courierLat: null,
sendOrderId: '', sendOrderId: '',
sendOrderName: '', sendOrderName: '',
sendOrderLng: undefined, sendOrderLng: null,
sendOrderLat: undefined, sendOrderLat: null,
fileId: [], fileId: [],
estimateTime: '', estimateTime: '',
requireTime: '', requireTime: '',
/** 地图任务数据 */ /** 地图任务数据 */
mapTask: [{ mapTask: [],
id: '001',
name: '宇宙任务',
taskType: '0',
mapTaskPreset: []
}],
/** 地图预览点数据 */ /** 地图预览点数据 */
mapLogisticPoint: [], mapLogisticPoint: [],
}); });

30
src/views/common/mapLogistic/MapLogisticModal.vue

@ -5,7 +5,7 @@
:showCancelBtn="false" :showCancelBtn="false"
@register="registerModal" @register="registerModal"
> >
<AMapDesigner/> <AMapDesigner @success="handleSubmit"/>
</BasicModal> </BasicModal>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
@ -15,34 +15,26 @@
* Copyright © 2020-2022 <a href="http://www.entfrm.com/">entfrm</a> All rights reserved. * Copyright © 2020-2022 <a href="http://www.entfrm.com/">entfrm</a> All rights reserved.
* author entfrm开发团队-王翔 * author entfrm开发团队-王翔
*/ */
import { ref, unref } from 'vue';
import { BasicModal, ModalProps, useModalInner } from '/@/components/Modal'; import { BasicModal, ModalProps, useModalInner } from '/@/components/Modal';
import { AMapDesigner } from '/@/components/AMap'; import { AMapDesigner } from '/@/components/AMap';
/** 通用变量统一声明区域 */ /** 通用变量统一声明区域 */
const tag = ref<Nullable<string>>('');
/** https://v3.cn.vuejs.org/api/options-data.html#emits */ /** https://v3.cn.vuejs.org/api/options-data.html#emits */
const emit = defineEmits(['success', 'register']); const emit = defineEmits(['success', 'register']);
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data: WindowInnerData = { _tag: '' }) => { const [registerModal, { setModalProps, closeModal }] = useModalInner(async data => {
// const mapId = data?.id;
//
tag.value = data._tag;
const deptId = data.record?.deptId;
const props: Partial<ModalProps> = { confirmLoading: false, title: '地图设计器' }; const props: Partial<ModalProps> = { confirmLoading: false, title: '地图设计器' };
// tag
switch (unref(tag)) {
case 'add':
break;
case 'edit':
break;
}
// : // :
setModalProps(props); setModalProps(props);
}); });
/** 处理弹出框提交 */
async function handleSubmit() {
closeModal();
emit('success');
}
</script> </script>

2
src/views/common/mapLogistic/index.vue

@ -3,7 +3,7 @@
<BasicTable @register="registerTable"> <BasicTable @register="registerTable">
<template #toolbar> <template #toolbar>
<a-button type="primary" <a-button type="primary"
@click="" @click="() => {}"
>预览</a-button> >预览</a-button>
<a-button type="primary" <a-button type="primary"
@click="handleAdd()" @click="handleAdd()"

Loading…
Cancel
Save