调整地图设计器数据结构

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

@@ -2,6 +2,7 @@
   <BasicModal v-bind="$attrs"
               :width="1050"
               :minHeight="500"
+              @visible-change="handleModalVisibleChange"
               @register="registerModal"
               @ok="handleSubmit"
   >
@@ -63,15 +64,15 @@
 
   /** 类型规范统一声明定义区域 */
   interface WindowState {
-    taskOrdinaryCurrentEditKeyRef: string;
-    taskPresetCurrentEditKeyRef: string;
+    taskOrdinaryCurrentEditRowRef: Nullable<Recordable>;
+    taskPresetCurrentEditRowRef: Nullable<Recordable>;
     mapData: MapData;
   }
 
   /** 通用变量统一声明区域 */
   const state = reactive<WindowState>({
-    taskOrdinaryCurrentEditKeyRef: '',
-    taskPresetCurrentEditKeyRef: '',
+    taskOrdinaryCurrentEditRowRef: null,
+    taskPresetCurrentEditRowRef: null,
     mapData: {
       name: '',
       courierUserId: '',
@@ -200,7 +201,7 @@
       return [
         {
           label: '编辑',
-          disabled: state.taskOrdinaryCurrentEditKeyRef ? state.taskOrdinaryCurrentEditKeyRef !== record.key : false,
+          disabled: state.taskOrdinaryCurrentEditRowRef ? state.taskOrdinaryCurrentEditRowRef.key !== record.key : false,
           onClick: handleTaskOrdinaryEdit.bind(null, record),
         }
       ];
@@ -222,13 +223,13 @@
 
   /** 处理普通任务表格编辑 */
   function handleTaskOrdinaryEdit(record: EditRecordRow) {
-    state.taskOrdinaryCurrentEditKeyRef = record.key;
+    state.taskOrdinaryCurrentEditRowRef = record;
     record.onEdit?.(true);
   }
 
   /** 处理普通任务表格编辑取消 */
   function handleTaskOrdinaryCancel(record: EditRecordRow) {
-    state.taskOrdinaryCurrentEditKeyRef = '';
+    state.taskOrdinaryCurrentEditRowRef = null;
     record.onEdit?.(false, false);
   }
 
@@ -237,7 +238,7 @@
     const valid = await record.onValid?.();
     if (valid) {
       const pass = await record.onEdit?.(false, true);
-      pass && (state.taskOrdinaryCurrentEditKeyRef = '');
+      pass && (state.taskOrdinaryCurrentEditRowRef = null);
     }
   }
 
@@ -247,7 +248,7 @@
       return [
         {
           label: '编辑',
-          disabled: state.taskPresetCurrentEditKeyRef ? state.taskPresetCurrentEditKeyRef !== record.key : false,
+          disabled: state.taskPresetCurrentEditRowRef ? state.taskPresetCurrentEditRowRef.key !== record.key : false,
           onClick: handleTaskPresetEdit.bind(null, record),
         }
       ];
@@ -269,13 +270,13 @@
 
   /** 处理交接任务表格编辑 */
   function handleTaskPresetEdit(record: EditRecordRow) {
-    state.taskPresetCurrentEditKeyRef = record.key;
+    state.taskPresetCurrentEditRowRef = record;
     record.onEdit?.(true);
   }
 
   /** 处理交接任务表格编辑取消 */
   function handleTaskPresetCancel(record: EditRecordRow) {
-    state.taskPresetCurrentEditKeyRef = '';
+    state.taskPresetCurrentEditRowRef = null;
     record.onEdit?.(false, false);
   }
 
@@ -284,7 +285,7 @@
     const valid = await record.onValid?.();
     if (valid) {
       const pass = await record.onEdit?.(false, true);
-      pass && (state.taskPresetCurrentEditKeyRef = '');
+      pass && (state.taskPresetCurrentEditRowRef = null);
     }
   }
 
@@ -293,13 +294,23 @@
     openModal(true, { row: record, courierUserId: state.mapData.courierUserId });
   }
 
+  /** 处理模态框状态修改 */
+  function handleModalVisibleChange (visible: boolean) {
+    if (!visible) {
+      state.taskOrdinaryCurrentEditRowRef && handleTaskOrdinaryCancel(state.taskOrdinaryCurrentEditRowRef);
+      state.taskPresetCurrentEditRowRef && handleTaskPresetCancel(state.taskPresetCurrentEditRowRef);
+    }
+  }
+
   /** 处理弹出框提交 */
   async function handleSubmit() {
     try {
-      setModalProps({ confirmLoading: true });
       // 处理提交之前逻辑
+      setModalProps({ confirmLoading: true });
       const taskOrdinaryData = toRaw(getTaskOrdinaryDataSource());
       const taskPresetData = toRaw(getTaskPresetDataSource());
+      if (state.taskOrdinaryCurrentEditRowRef || state.taskPresetCurrentEditRowRef) return createMessage.error('表格行未保存,请检查!');
+      if (taskOrdinaryData.length === 0 && taskPresetData.length === 0) return createMessage.error('表格数据不能为空!');
       // 校验表格是否通过
       const validateData:Promise<boolean>[] = [];
       taskOrdinaryData.forEach(item => {
@@ -309,7 +320,7 @@
         validateData.push(item.onValid?.() || Promise.resolve(true));
       });
       const validateResult = await Promise.all(validateData);
-      if (!validateResult.every(item => item)) return createMessage.error('表格校验未通过,请检查!');
+      if (!validateResult.every(item => item)) return createMessage.error('表格行校验未通过,请检查!');
       state.mapData.mapTask = [...taskOrdinaryData, ...taskPresetData];
       // 处理提交完成之后逻辑
       closeModal();