@yorha2b-lab/autodev 7.7.2 → 7.7.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yorha2b-lab/autodev",
-  "version": "7.7.2",
+  "version": "7.7.3",
   "description": "基于 AI 视觉与语义协议的前端 (React+Antd) 代码构筑与旧系统重构引擎",
   "bin": {
     "bunker": "bin/bunker.js"

package/src/workshop/react/standardParts/DraggableContainer.js

@@ -0,0 +1,21 @@
+import { SortableContainer } from 'react-sortable-hoc'
+
+const SortableBody = SortableContainer(props => <tbody {...props} />)
+
+const arrayMoveImmutable = (array, oldIndex, newIndex) => {
+    const newArray = [...array]
+    const [item] = newArray.splice(oldIndex, 1)
+    newArray.splice(newIndex, 0, item)
+    return newArray
+}
+
+export const DraggableContainer = ({ props, setDataSource }) => {
+
+    const onSortEnd = ({ oldIndex, newIndex }) => {
+        if (oldIndex !== newIndex) {
+            setDataSource(prev => arrayMoveImmutable(prev.slice(), oldIndex, newIndex))
+        }
+    }
+
+    return <SortableBody useDragHandle disableAutoscroll helperClass='row-dragging' onSortEnd={onSortEnd} {...props} />
+}

package/src/workshop/react/standardParts/EditableCell.js

@@ -1,3 +1,4 @@
+import { SortableElement } from 'react-sortable-hoc'
 import { Form, Input, InputNumber, Select, Checkbox } from 'antd'
 import React, { useRef, useState, useEffect, useContext } from 'react'
 
@@ -7,6 +8,8 @@ import React, { useRef, useState, useEffect, useContext } from 'react'
  */
 const EditableContext = React.createContext(null)
 
+const SortableItem = SortableElement((props) => <tr {...props} />)
+
 /**
  * @component EditableRow
  * @description [地堡战术行容器] 每一行都是一个独立的逻辑闭环。
@@ -33,7 +36,7 @@ export const EditableRow = ({ index, record, ...props }) => {
     return (
         <Form form={form} component={false} onValuesChange={(changedValue, allValue) => props?.onValuesChange?.({ changedValue, allValue, form })}>
             <EditableContext.Provider value={form}>
-                <tr {...props} />
+                <SortableItem index={index} {...props} />
             </EditableContext.Provider>
         </Form>
     )

package/src/workshop/react/standardParts/MyForm.js

@@ -88,7 +88,7 @@ export const MyForm = ({ formItems, externalForm, labelCol, wrapperCol, tablePro
     const form = externalForm || internalForm
 
     return (
-        <Form form={form} layout={layout} preserve={false} labelCol={labelCol} wrapperCol={wrapperCol} onValuesChange={onValuesChange}>
+        <Form form={form} layout={layout} preserve={false} labelCol={labelCol} wrapperCol={wrapperCol} onValuesChange={onValuesChange} scrollToFirstError={{ behavior: 'smooth', block: 'center' }}>
             <Row gutter={[24, 0]}>
                 <FormRenderer form={form} formItems={formItems} tableProps={tableProps} />
             </Row>

package/src/workshop/react/standardParts/MyTable.js

@@ -1,4 +1,5 @@
-import { Space, Table } from 'antd'
+import { Table } from 'antd'
+import { DraggableContainer } from './DraggableContainer'
 import { EditableRow, EditableCell } from './EditableCell'
 import { useRef, useMemo, useEffect, useCallback } from 'react'
 
@@ -54,12 +55,10 @@ import { useRef, useMemo, useEffect, useCallback } from 'react'
  *   }}
  * />
  */
-export const MyTable = ({ size, query, total, search, autoScroll, onChange, setSearch, pagination, renderAction, rowClassName, customSave, setDataSource, lineFormChange, columns = [], rowSelection, rowKey = 'id', loading = false, dataSource = [], scroll = { x: 'max-content' }, isLocalPaging = false, ...restProps }) => {
+export const MyTable = ({ size, query, total, search, autoScroll, onChange, pagination, renderAction, rowClassName, customSave, setDataSource, lineFormChange, columns = [], rowSelection, rowKey = 'id', loading = false, dataSource = [], scroll = { x: 'max-content' }, isLocalPaging = false, ...restProps }) => {
 
     const tableRef = useRef(null)
     const hasScrolledRef = useRef(false)
-    const dataSourceRef = useRef(dataSource)
-    dataSourceRef.current = dataSource
 
     /**
      * @description [权限侦察] 自动扫描列配置。若存在 editType 型号，则激活“骇入模式（编辑模式）”。
@@ -69,18 +68,19 @@ export const MyTable = ({ size, query, total, search, autoScroll, onChange, setS
     /**
      * @function handleSave
      * @description [原子级物理封存] 执行数据更新协议。
+     * 采用函数式状态更新（prev => ...）以彻底消除闭航陷阱（Stale Closure），确保数据高频修改时的绝对准确。
+     *
      * @param {Object} row - 修改后的行片段
      */
     const handleSave = useCallback((row) => {
-        const prev = dataSourceRef.current
-        const index = prev.findIndex(item => row[rowKey] === item[rowKey])
-        if (index === -1) return
-        const item = prev[index]
-        const updatedRow = { ...item, ...row }
-        const newData = [...prev]
-        newData.splice(index, 1, updatedRow)
-        setDataSource(newData)
-        customSave?.(updatedRow, newData)
+        setDataSource(prev => {
+            const newData = [...prev]
+            const index = newData.findIndex(item => row[rowKey] === item[rowKey])
+            const item = newData[index]
+            newData.splice(index, 1, { ...item, ...row })
+            customSave?.({ ...item, ...row }, newData)
+            return newData
+        })
     }, [rowKey, customSave, setDataSource])
 
     /**
@@ -91,8 +91,9 @@ export const MyTable = ({ size, query, total, search, autoScroll, onChange, setS
         body: {
             row: EditableRow,
             cell: EditableCell,
+            wrapper: props => <DraggableContainer props={props} setDataSource={setDataSource} />,
         }
-    }), [])
+    }), [setDataSource])
 
     /**
      * @constant mergedColumns
@@ -102,37 +103,10 @@ export const MyTable = ({ size, query, total, search, autoScroll, onChange, setS
     const mergedColumns = useMemo(() => {
         return columns.map(col => {
             if (!col.editType) {
-                let currentCol = { ...col }
                 if (col.renderAction && renderAction?.[col.dataIndex]) {
-                    currentCol.render = renderAction[col.dataIndex]
-                }
-                if (col.search) {
-                    currentCol = {
-                        ...currentCol,
-                        filterSearch: true,
-                        onFilter: (value, record) => col.remote ? undefined : col.customFilter({ value, record, dataIndex: col.dataIndex }),
-                        filterDropdown: ({ close, confirm, selectedKeys, clearFilters, setSelectedKeys }) => (
-                            <Space direction='vertical' style={{ padding: 12 }}>
-                                {col.customFilterDropdown({ dataIndex: col.dataIndex, selectedKeys, setSelectedKeys })}
-                                <div style={{ display: 'flex' }}>
-                                    <a style={{ marginLeft: 'auto', marginRight: 8 }} onClick={() => {
-                                        if (col.remote) {
-                                            setSearch(prev => ({ ...prev, pageNo: 1, [col.dataIndex]: col.formatFilter?.(selectedKeys) ?? selectedKeys?.toString() }))
-                                        }
-                                        confirm()
-                                    }}>确定</a>
-                                    <a onClick={() => {
-                                        if (col.remote) {
-                                            setSearch(prev => ({ ...prev, pageNo: 1, [col.dataIndex]: undefined }))
-                                        }
-                                        clearFilters()
-                                    }}>重置</a>
-                                </div>
-                            </Space>
-                        ),
-                    }
+                    return { ...col, render: renderAction[col.dataIndex] }
                 }
-                return currentCol
+                return col
             }
             return {
                 ...col,
@@ -141,7 +115,6 @@ export const MyTable = ({ size, query, total, search, autoScroll, onChange, setS
                     handleSave,
                     title: col.title,
                     rules: col.rules,
-                    extra: col.extra,
                     options: col.options,
                     editType: col.editType,
                     dataIndex: col.dataIndex,
@@ -174,7 +147,7 @@ export const MyTable = ({ size, query, total, search, autoScroll, onChange, setS
             }),
             ...(typeof pagination === 'object' ? pagination : {})
         }
-    }, [total, search, pagination])
+    }, [total, search, pagination, isLocalPaging])
 
     /**
      * @description [视觉追踪协议] 当检测到 query.rowIndex 信号时，执行“物理重定向”。