@yorha2b-lab/autodev 2.1.11 → 2.1.13

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yorha2b-lab/autodev",
-  "version": "2.1.11",
+  "version": "2.1.13",
   "description": "基于视觉大模型的前端(react+Antd)全自动 CRUD 代码生成器",
   "bin": {
     "autodev": "bin/autodev.js"

package/templates/react/components/EditableCell.js

@@ -14,7 +14,7 @@ export const EditableRow = ({ index, ...props }) => {
     )
 }
 
-export const EditableCell = ({ title, record, editable, children, dataIndex, handleSave, rules = [], options = [], editType = 'text', ...restProps }) => {
+export const EditableCell = ({ title, record, editable, children, dataIndex, placeholder, handleSave, rules = [], options = [], editType = 'text', ...restProps }) => {
 
     const inputRef = useRef(null)
     const form = useContext(EditableContext)
@@ -48,10 +48,10 @@ export const EditableCell = ({ title, record, editable, children, dataIndex, han
 
     switch (editType) {
         case 'number':
-            inputNode = <InputNumber ref={inputRef} onPressEnter={save} onBlur={save} />
+            inputNode = <InputNumber ref={inputRef} onPressEnter={save} onBlur={save} placeholder={placeholder ?? title} />
             break
         case 'select':
-            inputNode = <Select ref={inputRef} options={options} onBlur={save} />
+            inputNode = <Select ref={inputRef} options={options} onBlur={save} placeholder={placeholder ?? title} />
             break;
         case 'checkbox':
             inputNode = (
@@ -66,7 +66,7 @@ export const EditableCell = ({ title, record, editable, children, dataIndex, han
             )
             break;
         default:
-            inputNode = <Input ref={inputRef} onPressEnter={save} onBlur={save} />
+            inputNode = <Input ref={inputRef} onPressEnter={save} onBlur={save} placeholder={placeholder ?? title} />
     }
 
     return (

package/templates/react/components/MyTable.js

@@ -9,14 +9,36 @@ const components = {
     }
 }
 
-export const MyTable = ({ size, query, onSave, autoScroll, onChange, pagination, rowClassName, columns = [], rowSelection, rowKey = 'id', loading = false, dataSource = [], scroll = { x: 'max-content' }, ...restProps }) => {
-
+export const MyTable = ({ size, query, total, search, autoScroll, onChange, pagination, rowClassName, customSave, setDataSource, columns = [], rowSelection, rowKey = 'id', loading = false, dataSource = [], scroll = { x: 'max-content' }, ...restProps }) => {
 
     const tableRef = useRef(null)
     const hasScrolledRef = useRef(false)
 
     const isEditable = useMemo(() => columns.some(col => col.editType), [columns])
 
+    const handleSave = row => {
+        const newData = [...dataSource]
+        const index = newData.findIndex(item => row[rowKey] === item[rowKey])
+        const item = newData[index]
+        newData.splice(index, 1, { ...item, ...row })
+        setDataSource(newData)
+        customSave?.({ ...item, ...row })
+    }
+
+    const paginationConfig = useMemo(() => {
+
+        if (!pagination) return false
+
+        return {
+            total,
+            showSizeChanger: true,
+            current: search?.pageNo,
+            pageSize: search?.pageSize,
+            showTotal: (total) => `共 ${total} 条`,
+            ...pagination
+        }
+    }, [total, search, pagination])
+
     const mergedColumns = useMemo(() => {
         return columns.map(col => {
             if (!col.editType) {
@@ -26,17 +48,18 @@ export const MyTable = ({ size, query, onSave, autoScroll, onChange, pagination,
                 ...col,
                 onCell: (record) => ({
                     record,
+                    handleSave,
                     title: col.title,
                     rules: col.rules,
-                    handleSave: onSave,
                     options: col.options,
                     editType: col.editType,
                     editable: !!col.editType,
                     dataIndex: col.dataIndex,
+                    placeholder: col.placeholder
                 }),
             }
         })
-    }, [columns, onSave])
+    }, [columns])
 
     useEffect(() => {
         if (!autoScroll || !dataSource?.length || query?.rowIndex === undefined) return
@@ -65,9 +88,9 @@ export const MyTable = ({ size, query, onSave, autoScroll, onChange, pagination,
                 onChange={onChange}
                 columns={mergedColumns}
                 dataSource={dataSource}
-                pagination={pagination}
                 size={size ?? 'middle'}
                 rowSelection={rowSelection}
+                pagination={paginationConfig}
                 components={isEditable ? components : undefined}
                 rowClassName={(record, index) => {
                     const externalClass = typeof rowClassName === 'function' ? rowClassName(record, index) : rowClassName

package/templates/react/handlebars/MyTable.hbs

@@ -11,7 +11,6 @@
     {{/if}}
     {{#if hasPagination}}
     {{{{raw}}}}
-    pagination={{ total, showSizeChanger: true, current: search.pageNo, pageSize: search.pageSize }}
     onChange={(pagination, filters, sorter) => setSearch({ ...search , pageNo: pagination.current, pageSize: pagination.pageSize, orderBy: sorter.column ? sorter.field : undefined })}
     {{{{/raw}}}}
     {{/if}}