@yorha2b-lab/autodev 7.7.1 → 7.7.2

package/package.json

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

package/src/workshop/react/briefings/raider.js

@@ -48,6 +48,7 @@ module.exports = `
     - daterange: name 必须设为 '字段英文名start,字段英文名end'。
 - 增强属性:
     - 文字单位: 若项末尾有单位（如 元/kg），必须存入 unit 属性。
+    - 说明文字: 若表单项下方有灰色说明文字如(必填，不能超过多少字)，必须存入help属性。
     - 尾操作: 若项末尾有操作按钮（如 选择、编辑 等操作），必须存入 {renderAction:true,addonAfter:'尾操作名'} 属性。
     - 必填校验: 若图片中 label 前有红色星号，必须加入 rules:[{required:true,message:'xxx不能为空'}]。
 

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

@@ -95,10 +95,10 @@ export const MyBaseForm = ({ item, form }) => {
             // 💡 单兵模式：标准 Form.Item 构筑
             <Form.Item
                 label={item.label}
-                extra={item.extra}
                 tooltip={item.tooltip}
                 labelCol={item.labelCol}
                 wrapperCol={item.wrapperCol}
+                extra={item.extra || item.help}
                 required={item.required ?? item.rules?.some(v => v.required)}
                 style={{ marginBottom: !item.name ? 0 : undefined, ...item.style }}
             >

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

@@ -0,0 +1,97 @@
+import { MyBaseForm } from './MyBaseForm'
+import { Row, Col, Form, Button, Collapse } from 'antd'
+
+const LAYOUT_PROCESSORS = {
+    section: ({ item, renderCore }) => (
+        <Col span={item.span ?? 24} style={{ marginBottom: 16 }}>
+            <div style={{ fontWeight: 'bold', marginBottom: 12, borderLeft: '4px solid #1890ff', paddingLeft: 8 }}>{item.title}</div>
+            <Row gutter={[24, 0]}>
+                {renderCore(item.childItems || [])}
+            </Row>
+        </Col>
+    ),
+    collapse: ({ item, renderCore }) => (
+        <Col span={item.span ?? 24} style={{ marginBottom: 16 }}>
+            <Collapse defaultActiveKey={['1']}>
+                <Collapse.Panel key='1' header={<span style={{ fontWeight: 'bold' }}>{item.title}</span>}>
+                    <Row gutter={[24, 0]}>
+                        {renderCore(item.childItems || [])}
+                    </Row>
+                </Collapse.Panel>
+            </Collapse>
+        </Col>
+    ),
+    default: ({ item, renderCore }) => <Row gutter={[24, 0]}>{renderCore(item.childItems || [])}</Row>
+}
+
+// 定义“零部件增强协议”处理器,以后加任何新功能，只需要在这个对象里加一个 Key，不需要动主逻辑！
+const ACTION_PROCESSORS = {
+    // 处理尾操作按钮
+    addonAfter: (item, { tableConfig, setModalTable, setSelectedTableRows }) => ({
+        props: {
+            addonAfter: (
+                <Button onClick={() => {
+                    setSelectedTableRows([])
+                    setModalTable({ visible: true, title: `选择${item.label}`, ...tableConfig[item.name] })
+                }}>
+                    {item.addonAfter}
+                </Button>
+            )
+        }
+    }),
+    // 以后想加个“前缀图标”？直接加在这里：
+    // prefix: (item) => ({ props: { prefix: <Icon type={item.prefix} /> } }),
+}
+
+const FormRenderer = ({ form, formItems, tableProps = {} }) => {
+
+    // 定义核心渲染逻辑，供递归使用
+    const renderCore = items => <FormRenderer form={form} formItems={items} tableProps={tableProps} />
+
+    // 定义单项动作注入逻辑
+    const getRenderItemProps = item => {
+        if (!item.renderAction) return {}
+        const props = {}
+        Object.keys(ACTION_PROCESSORS).forEach(key => {
+            if (item[key]) {
+                Object.assign(props, ACTION_PROCESSORS[key](item, tableProps))
+            }
+        })
+        return props
+    }
+
+    return formItems.map((item, index) => {
+        // 情况 A：发现容器型零件 (含有 layoutType)
+        if (item.layoutType && LAYOUT_PROCESSORS[item.layoutType]) {
+            const Layout = LAYOUT_PROCESSORS[item.layoutType] ?? LAYOUT_PROCESSORS.default
+            return (
+                <Layout
+                    item={item}
+                    key={item.name || index}
+                    renderCore={renderCore} // 注入渲染能力，让 Layout 自己去 Map
+                />
+            )
+        }
+
+        // 情况 B：标准作战零件
+        return (
+            <Col span={item.span ?? 6} key={item.name || index}>
+                <MyBaseForm item={{ ...item, ...getRenderItemProps(item) }} form={form} />
+            </Col>
+        )
+    })
+}
+
+export const MyForm = ({ formItems, externalForm, labelCol, wrapperCol, tableProps, layout = 'horizontal', onValuesChange }) => {
+
+    const [internalForm] = Form.useForm()
+    const form = externalForm || internalForm
+
+    return (
+        <Form form={form} layout={layout} preserve={false} labelCol={labelCol} wrapperCol={wrapperCol} onValuesChange={onValuesChange}>
+            <Row gutter={[24, 0]}>
+                <FormRenderer form={form} formItems={formItems} tableProps={tableProps} />
+            </Row>
+        </Form>
+    )
+}

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

@@ -0,0 +1,31 @@
+import { Modal } from 'antd'
+import { useState } from 'react'
+
+export const MyModal = ({ width, title, okText, footer, record, visible, children, handleOk, setModal, cancelText, okButtonProps }) => {
+
+    const [pending, setPending] = useState(false)
+
+    const handleCancel = () => setModal({ visible: false })
+
+    const ctx = { record, pending, handleOk, handleCancel, setModal, setPending }
+
+    return (
+        <Modal
+            centered
+            title={title}
+            width={width}
+            open={visible}
+            destroyOnClose
+            okText={okText}
+            onOk={handleOk}
+            cancelText={cancelText}
+            onCancel={handleCancel}
+            confirmLoading={pending}
+            okButtonProps={okButtonProps}
+            footer={typeof footer === 'function' ? footer(ctx) : footer}
+            bodyStyle={{ paddingBottom: 0, maxHeight: '80vh', overflowY: 'auto' }}
+        >
+            {children}
+        </Modal>
+    )
+}

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

@@ -1,97 +1,8 @@
 import dayjs from 'dayjs'
-import { MyBaseForm } from './MyBaseForm'
+import { MyForm } from './MyForm'
+import { Form, Modal } from 'antd'
 import { MyModalTable } from './MyModalTable'
 import { useRef, useMemo, useState, useEffect } from 'react'
-import { Row, Col, Form, Modal, Button, Collapse } from 'antd'
-
-const LAYOUT_PROCESSORS = {
-    section: ({ item, renderCore }) => (
-        <Col span={item.span ?? 24} style={{ marginBottom: 16 }}>
-            <div style={{ fontWeight: 'bold', marginBottom: 12, borderLeft: '4px solid #1890ff', paddingLeft: 8 }}>{item.title}</div>
-            <Row gutter={[24, 0]}>
-                {renderCore(item.childItems || [])}
-            </Row>
-        </Col>
-    ),
-    collapse: ({ item, renderCore }) => (
-        <Col span={item.span ?? 24} style={{ marginBottom: 16 }}>
-            <Collapse defaultActiveKey={['1']}>
-                <Collapse.Panel key='1' header={<span style={{ fontWeight: 'bold' }}>{item.title}</span>}>
-                    <Row gutter={[24, 0]}>
-                        {renderCore(item.childItems || [])}
-                    </Row>
-                </Collapse.Panel>
-            </Collapse>
-        </Col>
-    ),
-    default: ({ item, renderCore }) => <Row gutter={[24, 0]}>{renderCore(item.childItems || [])}</Row>
-}
-
-// 定义“零部件增强协议”处理器,以后加任何新功能，只需要在这个对象里加一个 Key，不需要动主逻辑！
-const ACTION_PROCESSORS = {
-    // 处理尾操作按钮
-    addonAfter: (item, { tableConfig, setModalTable, setSelectedTableRows }) => ({
-        props: {
-            addonAfter: (
-                <Button onClick={() => {
-                    setSelectedTableRows([])
-                    setModalTable({ visible: true, title: `选择${item.label}`, ...tableConfig[item.name] })
-                }}>
-                    {item.addonAfter}
-                </Button>
-            )
-        }
-    }),
-    // 以后想加个“前缀图标”？直接加在这里：
-    // prefix: (item) => ({ props: { prefix: <Icon type={item.prefix} /> } }),
-}
-
-const FormRenderer = ({ form, formItems, tableConfig, setModalTable, setSelectedTableRows }) => {
-
-    // 定义核心渲染逻辑，供递归使用
-    const renderCore = items => (
-        <FormRenderer
-            form={form}
-            formItems={items}
-            tableConfig={tableConfig}
-            setModalTable={setModalTable}
-            setSelectedTableRows={setSelectedTableRows}
-        />
-    )
-
-    // 定义单项动作注入逻辑
-    const getRenderItemProps = item => {
-        if (!item.renderAction) return {}
-        const props = {}
-        Object.keys(ACTION_PROCESSORS).forEach(key => {
-            if (item[key]) {
-                Object.assign(props, ACTION_PROCESSORS[key](item, { tableConfig, setModalTable, setSelectedTableRows }))
-            }
-        })
-        return props
-    }
-
-    return formItems.map((item, index) => {
-        // 情况 A：发现容器型零件 (含有 layoutType)
-        if (item.layoutType && LAYOUT_PROCESSORS[item.layoutType]) {
-            const Layout = LAYOUT_PROCESSORS[item.layoutType] ?? LAYOUT_PROCESSORS.default
-            return (
-                <Layout
-                    item={item}
-                    key={item.name || index}
-                    renderCore={renderCore} // 注入渲染能力，让 Layout 自己去 Map
-                />
-            )
-        }
-
-        // 情况 B：标准作战零件
-        return (
-            <Col span={item.span ?? 6} key={item.name || index}>
-                <MyBaseForm item={{ ...item, ...getRenderItemProps(item) }} form={form} />
-            </Col>
-        )
-    })
-}
 
 const flattenFormItems = items => {
     if (!Array.isArray(items)) return []
@@ -242,11 +153,15 @@ export const MyModalForm = ({ extra, width, title, layout, okText, options, foot
         >
             {modalTable.visible && <MyModalTable rowKey={rowKey} {...modalTable} rowSelection={tableRowSelection} onOk={modalTableOk} setModal={setModalTable} />}
             {extra?.header?.(ctx)}
-            <Form form={form} layout={layout} preserve={false} labelCol={labelCol} wrapperCol={wrapperCol} onValuesChange={(changed, all) => onValuesChange?.({ changed, all, form, record })}>
-                <Row gutter={[24, 0]}>
-                    <FormRenderer form={form} formItems={formItems} tableConfig={tableConfig} setModalTable={setModalTable} setSelectedTableRows={setSelectedTableRows} />
-                </Row>
-            </Form>
+            <MyForm
+                layout={layout}
+                externalForm={form}
+                labelCol={labelCol}
+                formItems={formItems}
+                wrapperCol={wrapperCol}
+                tableProps={{ tableConfig, setModalTable, setSelectedTableRows }}
+                onValuesChange={(changed, all) => onValuesChange?.({ changed, all, form, record })}
+            />
             {extra?.footer?.(ctx)}
         </Modal>
     )