feat: 数据源选项拖拽

src/pages/Schema/Option/index.tsx

@@ -45,7 +45,7 @@ const Option = () => {
     menuDataItems: [],
     current: null
   })
-  console.log(state.menuDataItems)
+  // console.log(state.menuDataItems)
 
   const { run: tryFetchList } = useRequest(queryDataSource, {
     onSuccess: (result: API.DataSourceMenuItem) => {
@@ -139,19 +139,18 @@ const Option = () => {
   ]
 
   const onSortEnd = ({ oldIndex, newIndex }: SortEnd) => {
+    const { menuDataItems } = state
     if (oldIndex !== newIndex) {
-      const newData = arrayMoveImmutable(dataSource.slice(), oldIndex, newIndex).filter(
+      const newData = arrayMoveImmutable([].concat(menuDataItems), oldIndex, newIndex).filter(
         (el: DataType) => !!el
       )
-      const newMenuData = menuData.map(item => {
-        const newItem = { ...item }
-        if (item.ID === state.activeID) {
-          newItem.items = newData
-          return newItem
-        }
-        return item
-      })
-      setState({ ...state, menuData: newMenuData })
+      setState({ ...state, menuDataItems: newData })
+      const oldIndexItem = menuDataItems?.find(item => item.index === oldIndex)
+      const newIndexItem = menuDataItems?.find(item => item.index === newIndex)
+      if (oldIndexItem && newIndexItem) {
+        tryUpdateDataSourceItem({ ID: state.activeID, items: newData })
+        message.success('编辑成功')
+      }
     }
   }
 
@@ -166,9 +165,7 @@ const Option = () => {
   )
 
   const DraggableBodyRow = ({ className, style, ...restProps }) => {
-    const index = state.menuData
-      .find(item => item.ID === state.activeID)
-      ?.items.findIndex(x => x.index === restProps['data-row-key'])
+    const index = state.menuDataItems?.findIndex(x => x.index === restProps['data-row-key'])
     return <SortableItem index={index} {...restProps} />
   }
 
@@ -184,8 +181,8 @@ const Option = () => {
         <ProTable<API.DataSourceItem>
           columns={columns}
           search={false}
-          dataSource={state.menuData.find(item => item.ID === state.activeID)?.items || []}
-          rowKey="ID"
+          dataSource={state.menuDataItems || []}
+          rowKey="index"
           toolbar={{
             actions: [
               <Button

src/services/api/typings.d.ts

@@ -353,5 +353,6 @@ declare namespace API {
     ID?: string
     name?: string
     enable?: string
+    index?: number
   }
 }