kanglai
/
kicc-ui
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

调整地图设计器数据结构

master
wangxiang 3 years ago
parent
9d34e758dd
commit
bd3420dff7
5 changed files with 184 additions and 197 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 36
      src/components/AMap/src/AMapDesigner/index.vue
  2. 48
      src/components/AMap/src/amap.data.ts
  3. 291
      src/components/AMap/src/components/MapTaskModal.vue
  4. 2
      src/utils/dateUtil.ts
  5. 2
      src/views/system/config/index.vue

36
src/components/AMap/src/AMapDesigner/index.vue
Unescape View File

@ -109,7 +109,7 @@ @@ -109,7 +109,7 @@
<script lang="ts" setup>
import AMapLoader from '@amap/amap-jsapi-loader';
import { reactive, watchEffect, getCurrentInstance, onBeforeMount, onUnmounted, ref } from 'vue';
import { operatePanelColumns } from '../amap.data';
import { operatePanelColumns, MapData, MapPointType } from '../amap.data';
import hospital from '/@/assets/images/hospital.svg';
import medicalKit from '/@/assets/images/medical-kit.svg';
import hospitalTwinkle from '/@/assets/images/hospital-twinkle.gif';
@ -132,45 +132,19 @@ @@ -132,45 +132,19 @@
import { commonUpload } from '/@/api/platform/core/controller/upload';
/** 类型规范统一声明定义区域 */
type MapCommonType = {
value: string;
label: string;
mapLng: number;
mapLat: number;
mapOrientation: number;
mapNotify?: boolean;
};
interface MapState {
loading: boolean;
defaultZoom: number;
toggleOperatePanelClass: Recordable;
toggleStatus: boolean;
courierUserList: MapCommonType[];
hospitalList: MapCommonType[];
orgList: MapCommonType[];
courierUserList: MapPointType[];
hospitalList: MapPointType[];
orgList: MapPointType[];
mapConfig: {
amapKey: string;
options: Recordable;
};
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;
};
mapData: MapData;
rulesRef: Recordable;
}

48
src/components/AMap/src/amap.data.ts
Unescape View File

@ -13,26 +13,34 @@ import { Tag } from 'ant-design-vue'; @@ -13,26 +13,34 @@ import { Tag } from 'ant-design-vue';
* @create: 2022/5/22
*/
type mapType = {
id: string;
title: string;
orientation: number;
lng: number;
lat: number;
notify?: boolean;
export type MapPointType = {
value: string;
label: string;
mapLng: number;
mapLat: number;
mapOrientation: number;
mapNotify?: boolean;
};
export const largeHospitalMapList: mapType[] = [
{id: '001', title: '上级医检医院:金域', orientation: 0, lng: 112.919043, lat: 28.288623},
{id: '002', title: '上级医检医院:康来', orientation: 0, lng: 112.919165, lat: 28.289924},
{id: '003', title: '上级医检医院:附一', orientation: 0, lng: 112.919965, lat: 28.289924}
];
export const smallHospitalMapList: mapType[] = [
{id: '001', title: '下级医院:湘雅医院', orientation: 0, lng: 112.918119, lat: 28.282891, notify: true},
{id: '002', title: '下级医院:神经病医院', orientation: 0, lng: 112.918919, lat: 28.282991, notify: true},
{id: '003', title: '下级医院:第三医院', orientation: 0, lng: 112.918019, lat: 28.283991, notify: true}
];
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[] = [
@ -180,6 +188,10 @@ export const taskPresetColumns: BasicColumn[] = [ @@ -180,6 +188,10 @@ export const taskPresetColumns: BasicColumn[] = [
}*/
];
export const formMutualTaskSettingColumns: BasicColumn[] = [
{
title: '收样员',

291
src/components/AMap/src/components/MapTaskModal.vue
Unescape View File

@ -1,75 +1,110 @@ @@ -1,75 +1,110 @@
<template>
<BasicModal v-bind="$attrs"
:width="920"
:width="990"
@register="registerModal"
@ok="handleSubmit"
>
<BasicTable @register="registerTable">
<!--普通任务表格-->
<BasicTable @register="taskOrdinaryRegisterTable">
<template #toolbar>
<a-button type="primary"
@click="handleTaskAdd()"
@click="handleTaskOrdinaryAdd"
>新增</a-button>
</template>
<template #action="{ record, column }">
<TableAction :actions="createActions(record, column)"/>
<TableAction :actions="createTaskOrdinaryActions(record, column).concat([
{
label: '删除',
icon: 'ant-design:delete-outlined',
color: 'error',
onClick: handleTaskOrdinaryDelete.bind(null, record)
}
])"
/>
</template>
</BasicTable>
<BasicTable @register="schemeRegisterTable">
<!--交接任务表格-->
<BasicTable @register="taskPresetRegisterTable">
<template #toolbar>
<a-button type="primary"
@click="handleMutualTaskAdd()"
@click="handleTaskPresetAdd"
>新增</a-button>
</template>
<template #action="{ record, column }">
<TableAction :actions="[
<TableAction :actions="createTaskPresetActions(record, column).concat([
{
label: '转办',
icon: 'fa6-regular:pen-to-square',
onClick: handleMutualTask.bind(null, record)
}]"
onClick: handleOpenTaskPreset.bind(null, record)
},
{
label: '删除',
icon: 'ant-design:delete-outlined',
color: 'error',
onClick: handleTaskPresetDelete.bind(null, record)
}
])"
/>
<TableAction :actions="createMutualActions(record, column)"/>
</template>
</BasicTable>
<TaskPresetModal @register="taskPresetRegisterModal" @success=""/>
<TaskPresetModal @register="taskPresetRegisterModal" @success="handleTaskPreset"/>
</BasicModal>
</template>
<script lang="ts" setup>
import { reactive } from 'vue';
import {BasicModal, ModalProps, useModal, useModalInner} from '/@/components/Modal';
import { BasicTable, useTable, EditRecordRow, BasicColumn, ActionItem, TableAction } from '/@/components/Table';
import { taskColumns, taskPresetColumns, largeHospitalMapList, smallHospitalMapList, } from '../amap.data';
import { buildUUID } from '/@/utils/uuid';
import { taskColumns, taskPresetColumns, MapData } from '../amap.data';
import TaskPresetModal from './MapTaskPresetModal.vue';
import { buildUUID } from '/@/utils/uuid';
import { useMessage } from '/@/hooks/web/useMessage';
/** 类型规范统一声明定义区域 */
interface WindowState {
currentEditKeyRef: string;
formData: Recordable;
taskOrdinaryCurrentEditKeyRef: string;
taskPresetCurrentEditKeyRef: string;
mapData: MapData | undefined;
}
/** 通用变量统一声明区域 */
let driving;
const state = reactive<WindowState>({
currentEditKeyRef: '',
formData: {}
});
const mutualState = reactive<WindowState>({
currentEditKeyRef: '',
formData: {}
taskOrdinaryCurrentEditKeyRef: '',
taskPresetCurrentEditKeyRef: '',
mapData: {
name: '',
courierUserId: '',
courierUserName: '',
courierLng: undefined,
courierLat: undefined,
sendOrderId: '',
sendOrderName: '',
sendOrderLng: undefined,
sendOrderLat: undefined,
fileId: [],
estimateTime: '',
requireTime: '',
/** 地图任务数据 */
mapTask: [],
/** 地图预览点数据 */
mapLogisticPoint: [],
}
});
const emit = defineEmits(['success', 'register']);
const [registerModal, { setModalProps, closeModal }] = useModalInner(async data => {
driving = data.driving;
state.formData = data.formData;
state.mapData.formData = data.formData;
const props: Partial<ModalProps> = { confirmLoading: false };
props.title = '任务配置';
// 尾部:设置处理后的最终配置数据
setModalProps(props);
});
const { createMessage } = useMessage();
const [taskPresetRegisterModal, { openModal }] = useModal();
const [registerTable, { reload, getDataSource }] = useTable({
const [taskOrdinaryRegisterTable, {
reload: taskOrdinaryReload,
getDataSource: getTaskOrdinaryDataSource,
setTableData: setTaskOrdinaryTableData
}] = useTable({
rowKey: 'id',
title: '普通任务',
columns: taskColumns,
pagination: {
@ -89,7 +124,12 @@ @@ -89,7 +124,12 @@
slots: { customRender: 'action' },
}
});
const [schemeRegisterTable, { reload: schemeReload, getDataSource: getTaskPresetDataSource, setProps }] = useTable({
const [taskPresetRegisterTable, {
reload: taskPresetReload,
getDataSource: getTaskPresetDataSource,
setTableData: setTaskPresetTableData
}] = useTable({
rowKey: 'id',
title: '交接任务',
columns: taskPresetColumns,
pagination: {
@ -103,165 +143,162 @@ @@ -103,165 +143,162 @@
showIndexColumn: false,
canResize: false,
actionColumn: {
width: 160,
width: 240,
title: '操作',
dataIndex: 'action',
slots: { customRender: 'action' },
}
});
/** 处理任务新增 */
function handleTaskAdd() {
getDataSource().push({
/** 处理普通任务新增 */
function handleTaskOrdinaryAdd() {
getTaskOrdinaryDataSource().push({
name: '',
hospitalId: '',
orgId: '',
fileId: []
fileId: [],
key: buildUUID()
});
}
/** 处理任务新增 */
function handleMutualTaskAdd() {
/** 处理普通任务删除 */
function handleTaskOrdinaryDelete(record) {
const index = getTaskOrdinaryDataSource().findIndex(item => item.key == record.key);
if (index != -1) {
getTaskOrdinaryDataSource().splice(record.index, 1);
} else createMessage.error(`找不到key:${record.key}的数据,请刷新页面重试!`);
}
/** 处理交接任务新增 */
function handleTaskPresetAdd() {
getTaskPresetDataSource().push({
name: '',
hospitalId: '',
orgId: '等待收样员设置!',
fileId: []
fileId: [],
key: buildUUID()
});
}
function createMutualActions(record: EditRecordRow, column: BasicColumn): ActionItem[] {
/** 处理交接任务删除 */
function handleTaskPresetDelete(record) {
const index = getTaskPresetDataSource().findIndex(item => item.key == record.key);
if (index != -1) {
getTaskPresetDataSource().splice(record.index, 1);
} else createMessage.error(`找不到key:${record.key}的数据,请刷新页面重试!`);
}
/** 创建普通任务操作列 */
function createTaskOrdinaryActions(record: EditRecordRow, column: BasicColumn): ActionItem[] {
if (!record.editable) {
return [
{
label: '编辑',
disabled: mutualState.currentEditKeyRef ? mutualState.currentEditKeyRef !== record.key : false,
onClick: handleMutualEdit.bind(null, record),
disabled: state.taskOrdinaryCurrentEditKeyRef ? state.taskOrdinaryCurrentEditKeyRef !== record.key : false,
onClick: handleTaskOrdinaryEdit.bind(null, record),
}
];
}
return [
{
label: '保存',
onClick: handleMutualSave.bind(null, record, column)
onClick: handleTaskOrdinarySave.bind(null, record, column)
},
{
label: '取消',
popConfirm: {
title: '是否取消编辑',
confirm: handleMutualCancel.bind(null, record, column)
confirm: handleTaskOrdinaryCancel.bind(null, record, column)
}
}
];
}
/** 创建操作列 */
function createActions(record: EditRecordRow, column: BasicColumn): ActionItem[] {
/** 处理普通任务表格编辑 */
function handleTaskOrdinaryEdit(record: EditRecordRow) {
state.taskOrdinaryCurrentEditKeyRef = record.key;
record.onEdit?.(true);
}
/** 处理普通任务表格编辑取消 */
function handleTaskOrdinaryCancel(record: EditRecordRow) {
state.taskOrdinaryCurrentEditKeyRef = '';
record.onEdit?.(false, false);
}
/** 处理普通任务表格编辑保存 */
async function handleTaskOrdinarySave(record: EditRecordRow) {
const valid = await record.onValid?.();
if (valid) {
const pass = await record.onEdit?.(false, true);
pass && (state.taskOrdinaryCurrentEditKeyRef = '');
}
}
/** 创建交接任务操作列 */
function createTaskPresetActions(record: EditRecordRow, column: BasicColumn): ActionItem[] {
if (!record.editable) {
return [
{
label: '编辑',
disabled: state.currentEditKeyRef ? state.currentEditKeyRef !== record.key : false,
onClick: handleEdit.bind(null, record),
disabled: state.taskPresetCurrentEditKeyRef ? state.taskPresetCurrentEditKeyRef !== record.key : false,
onClick: handleTaskPresetEdit.bind(null, record),
}
];
}
return [
{
label: '保存',
onClick: handleSave.bind(null, record, column)
onClick: handleTaskPresetSave.bind(null, record, column)
},
{
label: '取消',
popConfirm: {
title: '是否取消编辑',
confirm: handleCancel.bind(null, record, column)
confirm: handleTaskPresetCancel.bind(null, record, column)
}
}
];
}
function handleEdit(record: EditRecordRow) {
state.currentEditKeyRef = record.key;
/** 处理交接任务表格编辑 */
function handleTaskPresetEdit(record: EditRecordRow) {
state.taskPresetCurrentEditKeyRef = record.key;
record.onEdit?.(true);
}
function handleCancel(record: EditRecordRow) {
state.currentEditKeyRef = '';
/** 处理交接任务表格编辑取消 */
function handleTaskPresetCancel(record: EditRecordRow) {
state.taskPresetCurrentEditKeyRef = '';
record.onEdit?.(false, false);
}
async function handleSave(record: EditRecordRow) {
/** 处理交接任务表格编辑保存 */
async function handleTaskPresetSave(record: EditRecordRow) {
const valid = await record.onValid?.();
if (valid) {
const pass = await record.onEdit?.(false, true);
pass && (state.currentEditKeyRef = '');
computeScheme();
pass && (state.taskPresetCurrentEditKeyRef = '');
}
}
function handleMutualEdit(record: EditRecordRow) {
mutualState.currentEditKeyRef = record.key;
record.onEdit?.(true);
}
function handleMutualCancel(record: EditRecordRow) {
mutualState.currentEditKeyRef = '';
record.onEdit?.(false, false);
}
async function handleMutualSave(record: EditRecordRow) {
const valid = await record.onValid?.();
if (valid) {
const pass = await record.onEdit?.(false, true);
pass && (mutualState.currentEditKeyRef = '');
}
/** 处理打开交接任务 */
function handleOpenTaskPreset() {
openModal(true, {});
}
/** 智能计算方案 */
function computeScheme() {
const scheme = [];
const origin = state.formData.takeSpecimenId;
// 抽离计算属性
const taskDataSource = getDataSource();
const smallHospitalPositions:any[] = [];
const largeHospitalPositions:any[] = [];
taskDataSource.forEach(item => {
// 任务上下级医院唯一匹配ID
const key = buildUUID();
const smallHospital = smallHospitalMapList.find(index => index.id == item.hospitalId);
if(smallHospital) smallHospitalPositions.push([key, new AMap.LngLat(smallHospital.lng, smallHospital.lat)]);
const largeHospital = largeHospitalMapList.find(index => index.id == item.orgId);
if(largeHospital) largeHospitalPositions.push([key, new AMap.LngLat(largeHospital.lng, largeHospital.lat)]);
});
// 途径点
const waypoints:any[] = [];
// 目的地
let destination;
/** 1.计算预测大致的智能规划方案可行性数量 */
/** 处理地图任务预设点数据 */
function handleTaskPreset() {
// 下级医院规划方案二维数组
const smallHospitalScheme = Array.from({ length: smallHospitalPositions.length }, () => Array(smallHospitalPositions.length).fill(0));
for(let i = 0; i < smallHospitalPositions.length; ++i) {
// 提取一维数组,方案索引
const oneDimensionArray = smallHospitalScheme[i];
// 推动数组位置坐标,实现让每个方案的坐标位置都不一致
let indexs = Object.keys(smallHospitalPositions);
const reverseIndexs = indexs.slice(0, i);
indexs.splice(0, i);
indexs.push(...reverseIndexs);
// 处理二维数组坐标位置存储
for(let j = 0; j < indexs.length; ++j) {
const index = indexs[j];
const smallHospitalPosition = smallHospitalPositions[index];
oneDimensionArray[j] = smallHospitalPosition;
}
}
// 计算组合规范方案
const composeScheme = mapSchemePermuteUnique([]);
/** 处理弹出框提交 */
async function handleSubmit() {
console.log(getTaskOrdinaryDataSource());
}
/** todo:地图动态组合排序算法暂时保留,等待下一版谈论是否做智能地图最优方案 */
/** 地图方案组合排列算法,可确保二叉树当存在数组内容相同排列不重复 */
function mapSchemePermuteUnique(composeQueue: number[]) {
const ans: number[][] = [];
@ -296,40 +333,4 @@ @@ -296,40 +333,4 @@
return ans;
}
/** 处理打开交接任务 */
function handleMutualTask() {
openModal(true, { driving });
}
/** 处理路线预览 */
function handlePathPreview() {
}
/** 处理弹出框提交 */
async function handleSubmit() {
console.log(getDataSource());
/*try {
// 提取验证数据
const formData = await formElRef.value.validate();
console.log(formData);
// 处理提交之前逻辑
setModalProps({ confirmLoading: true });
// 采用tag标签区分操作
switch (state.tag) {
case 'add':
//await addConfig(formData);
break;
case 'edit':
//await editConfig(formData);
break;
}
// 处理提交完成之后逻辑
closeModal();
emit('success');
} finally {
setModalProps({ confirmLoading: false });
}*/
}
</script>

2
src/utils/dateUtil.ts
Unescape View File

@ -22,7 +22,7 @@ export function formatToDate(date: moment.MomentInput = undefined, format = DATE @@ -22,7 +22,7 @@ export function formatToDate(date: moment.MomentInput = undefined, format = DATE
}
/** 添加日期范围 */
export function convertDateRange(params: Recordable, dateRange: string): Recordable {
export function convertDateRange(params: Recordable, dateRange: string[]): Recordable {
const search = params;
search.beginTime = '';
search.endTime = '';

2
src/views/system/config/index.vue
Unescape View File

@ -30,7 +30,7 @@ @@ -30,7 +30,7 @@
</AFormItem>
<AFormItem label="创建时间">
<ARangePicker v-model:value="state.dateRange"
style="width: '100%'"
style="width: 100%"
valueFormat="YYYY-MM-DD"
:placeholder="['开始日期', '结束日期']"
/>

Write Preview
Loading…
Cancel
Save