@yorha2b-lab/autodev 1.0.45 → 1.1.0

package/example/example.json

@@ -2,7 +2,7 @@
     "tabs": [
         {
             "tab": "鬼剑士",
-            "key": "ghostKnight"
+            "key": "ghostSwordsman"
         },
         {
             "tab": "格斗家",
@@ -17,35 +17,6 @@
             "key": "mage"
         }
     ],
-    "formItems": [
-        {
-            "label": "转职职业",
-            "name": "transferJob",
-            "type": "select",
-            "options": "_CODE_transferJobOptions_CODE_"
-        },
-        {
-            "label": "武器类型",
-            "name": "weaponType",
-            "type": "select",
-            "options": "_CODE_weaponTypeOptions_CODE_"
-        },
-        {
-            "label": "职业类型",
-            "name": "jobType",
-            "type": "select",
-            "options": "_CODE_jobTypeOptions_CODE_"
-        },
-        {
-            "label": "觉醒名称关键词",
-            "name": "awakeningNameKeyword"
-        },
-        {
-            "label": "登场时间",
-            "name": "releaseDateStart,releaseDateEnd",
-            "type": "daterange"
-        }
-    ],
     "table": {
         "pagination": true,
         "expandable": true,
@@ -71,7 +42,7 @@
         "columns": [
             {
                 "title": "职业",
-                "dataIndex": "jobName"
+                "dataIndex": "job"
             },
             {
                 "title": "一觉",
@@ -102,17 +73,37 @@
             }
         ]
     },
+    "formItems": [
+        {
+            "label": "转职职业",
+            "name": "transferJob",
+            "type": "select",
+            "options": "_CODE_transferJobOptions_CODE_"
+        },
+        {
+            "label": "武器类型",
+            "name": "weaponType",
+            "type": "select",
+            "options": "_CODE_weaponTypeOptions_CODE_"
+        },
+        {
+            "label": "职业类型",
+            "name": "jobType",
+            "type": "select",
+            "options": "_CODE_jobTypeOptions_CODE_"
+        },
+        {
+            "label": "觉醒名称关键词",
+            "name": "awakeningKeyword"
+        },
+        {
+            "label": "登场时间",
+            "name": "releaseDateStart,releaseDateEnd",
+            "type": "daterange"
+        }
+    ],
     "optionDict": {
-        "_CODE_transferJobOptions_CODE_": [
-            {
-                "label": "剑魂",
-                "value": "swordSoul"
-            },
-            {
-                "label": "狂战士",
-                "value": "berserker"
-            }
-        ],
+        "_CODE_transferJobOptions_CODE_": [],
         "_CODE_weaponTypeOptions_CODE_": [
             {
                 "label": "光剑",
@@ -134,26 +125,31 @@
             },
             {
                 "label": "魔法",
-                "value": "magic"
+                "value": "magical"
             }
         ]
     },
     "functionButton": [
         {
-            "btn": "查询",
-            "action": "queryJobList"
+            "btn": "批量删除",
+            "action": "batchDeleteBySelected"
         },
         {
-            "btn": "重置",
-            "action": "resetJobList"
+            "btn": "批量导出",
+            "action": "exportData"
         },
         {
-            "btn": "批量删除",
-            "action": "deleteBySelectedJobList"
+            "btn": "查询",
+            "action": "search"
         },
         {
-            "btn": "批量导出",
-            "action": "exportJobList"
+            "btn": "重置",
+            "action": "reset"
         }
+    ],
+    "pageStruct": [
+        "MySearchForm",
+        "FunctionButtonsBlock",
+        "MyTable"
     ]
 }

package/package.json

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

package/src/commands/watch-page.js

@@ -140,7 +140,7 @@ const watchPage = options => {
                     `🤖 Pod 042: [Report] Module [${fileName}] assembly complete! Elapsed time: ${(endTime - startTime) / 1000}s`
                 )))
                 if (fs.existsSync(filePath)) {
-                    fs.unlinkSync(filePath)
+                    //fs.unlinkSync(filePath)
                 }
             } catch (error) {
                 spinner.fail(chalk.red(language(

package/src/core/react-compiler.js

@@ -1,7 +1,11 @@
+const fs = require('fs')
+const path = require('path')
 const Handlebars = require('handlebars')
 const stringify = require('json-stringify-pretty-compact')
 const { cleanCode, generateSmartImports } = require('../utils/utils.js')
 
+// 注册 Handlebars 辅助函数，用于将原始内容渲染到模板中，不进行任何处理
+Handlebars.registerHelper('raw', options => options.fn())
 // 注册 Handlebars 辅助函数，用于将对象格式化为 JSON 字符串
 Handlebars.registerHelper('stringify', (context, maxLength = 200) => context ? new Handlebars.SafeString(stringify.default(context, { indent: 4, maxLength })) : '[]')
 
@@ -45,7 +49,9 @@ const resource = ({ pageConfig, resourceTpl }) => {
  * @returns {string} 生成的 index.js 代码
  */
 const index = ({ config, fileName, indexTpl, pageConfig }) => {
+
     const hasTabs = pageConfig.tabs?.length > 0
+    const hasFormItems = pageConfig.formItems?.length > 0
     const hasOperate = pageConfig.table.operation?.length > 0
 
     // 动态确定 columns 引用方式：有标签页时使用 activeKey 索引，否则直接使用 columns
@@ -57,21 +63,42 @@ const index = ({ config, fileName, indexTpl, pageConfig }) => {
 
     // 构建模板数据
     const viewData = {
-        hasTabs, // 是否有标签页
-        fileName, // 页面文件名
-        hasOperate, // 是否有操作列
-        columnsValue, // columns 引用表达式
-        tabs: pageConfig.tabs, // 标签页配置
-        responseSuccess: config.responseSuccess, // 成功回调函数
-        hasExpandable: pageConfig.table.expandable, // 是否有展开行
-        hasPagination: pageConfig.table.pagination, // 是否有分页
-        operations: pageConfig.table.operation || [], // 操作列配置
-        hasRowSelection: pageConfig.table.rowSelection, // 是否有行选择
-        hasStaticInfo: pageConfig.table.staticInfo?.has, // 是否有静态信息
-        staticInfoText: pageConfig.table.staticInfo?.text, // 静态信息文本
-        functionButtons: pageConfig.functionButton?.filter(item => !['查询', '重置'].includes(item.btn)) || [] // 功能按钮（排除查询和重置）
+        hasTabs,
+        fileName,
+        hasOperate,
+        columnsValue,
+        hasFormItems,
+        tabs: pageConfig.tabs,
+        pageStruct: pageConfig.pageStruct,
+        responseSuccess: config.responseSuccess,
+        hasExpandable: pageConfig.table.expandable,
+        hasPagination: pageConfig.table.pagination,
+        operations: pageConfig.table.operation || [],
+        hasRowSelection: pageConfig.table.rowSelection,
+        hasStaticInfo: pageConfig.table.staticInfo?.has,
+        staticInfoText: pageConfig.table.staticInfo?.text,
+        formItems: hasTabs ? 'formItems[activeKey]' : 'formItems',
+        functionButtons: pageConfig.functionButton?.filter(item => !['查询', '重置'].includes(item.btn)) || []
+    }
+
+    if (viewData.hasOperate) {
+        Handlebars.registerPartial('tableOperate', `${fs.readFileSync(path.join(__dirname, '../../templates/react/handlebars/tableOperate.hbs'), 'utf-8')}\n`)
     }
 
+    if (viewData.hasFormItems) {
+        Handlebars.registerPartial('MySearchForm', `${fs.readFileSync(path.join(__dirname, '../../templates/react/handlebars/MySearchForm.hbs'), 'utf-8')}\n`)
+    }
+
+    if (viewData.hasStaticInfo) {
+        Handlebars.registerPartial('AlertInfo', `{{{{raw}}}}<Alert showIcon title='${pageConfig.table.staticInfo?.text}' type='info' style={{ marginBottom: 16 }} />\n{{{{/raw}}}}`)
+    }
+
+    Handlebars.registerPartial('MyTable', `${fs.readFileSync(path.join(__dirname, '../../templates/react/handlebars/MyTable.hbs'), 'utf-8')}\n`)
+    Handlebars.registerPartial('hookBlock', `${fs.readFileSync(path.join(__dirname, '../../templates/react/handlebars/hookBlock.hbs'), 'utf-8')}\n`)
+    Handlebars.registerPartial('stateBlock', `${fs.readFileSync(path.join(__dirname, '../../templates/react/handlebars/stateBlock.hbs'), 'utf-8')}\n`)
+    Handlebars.registerPartial('handleBlock', `${fs.readFileSync(path.join(__dirname, '../../templates/react/handlebars/handleBlock.hbs'), 'utf-8')}\n`)
+    Handlebars.registerPartial('FunctionButtonsBlock', `${fs.readFileSync(path.join(__dirname, '../../templates/react/handlebars/functionButtonsBlock.hbs'), 'utf-8')}\n`)
+
     // 渲染模板
     const bodyCode = indexTpl(viewData)
     // 生成智能导入语句

package/src/prompts/react/watch-page.js

@@ -1,5 +1,5 @@
 module.exports = `
-识别图片内容（搜索项，表格列，是否有勾选框，查询下拉选项，统计条等页面结构）
+识别图片内容（搜索项，表格列，是否有勾选框，查询下拉选项，统计条等页面组件，并按照从上到下的结构把识别出来的组件按顺序组织成型）
 ⚠️⚠️⚠️注意:
 1.变量使用驼峰命名法
     【严禁中文】绝对不允许使用中文作为变量名或函数名
@@ -35,6 +35,10 @@ module.exports = `
 6.下拉选项字典
     optionDict:{_CODE_对应的英文名词Options_CODE_:[]]}
     ⚠️⚠️⚠️注意：数组值为对应列展示的内容组成的类似{label:'',value:''}的数组
+7.pageStruct
+    从上至下的页面结构组成
+    ⚠️⚠️⚠️注意:这里只能从AlertInfo,MySearchForm,FunctionButtonsBlock,MyTable中选择,并且只有真的存在才加入，绝对禁止加入其他组件
+    ⚠️⚠️⚠️另外这里不要加入tabs组件
 最后输出一个JSON对象,不要包含任何Markdown标签,格式如下
-    { tabs: [], table: {}, formItems: [], optionDict: {}, functionButton: []}
+    { tabs: [], table: {}, formItems: [], optionDict: {}, functionButton: [],pageStruct:[]}
 `

package/src/prompts/react/watch-part.js

@@ -22,5 +22,6 @@ module.exports = `
     ⚠️⚠️⚠️注意:
     type:text/date/daterange/radio/checkbox/select/auto/textarea,如果是text可以省略
     如果type是auto/radio/select/checkbox,请加入options:_CODE_对应的英文名词Options_CODE_
+    如果表单项末尾有文字描述，请将文字描述放在unit属性中
     ** 只输出modalItems就可以，不需要对应的formItems和columns **
 `

package/templates/react/components/MyModalTable.js

@@ -1,10 +1,10 @@
-import { Modal } from 'antd'
 import { MyTable } from './MyTable'
+import { Modal, Button } from 'antd'
 import { MySearchForm } from './MySearchForm'
 import { useTableQuery } from '../hooks/useTableQuery'
 
 
-export const MyModalTable = ({ api, onOk, title, width, footer, visible, columns, setModal, formItems, rowSelection, formatResponse, extraParams = {} }) => {
+export const MyModalTable = ({ api, onOk, title, width, footer, visible, columns, setModal, formItems, rowSelection, formatResponse, functionButtons, extraParams = {} }) => {
 
     const { total, loading, dataSource, search, setSearch } = useTableQuery(api, formatResponse, extraParams)
 
@@ -22,6 +22,7 @@ export const MyModalTable = ({ api, onOk, title, width, footer, visible, columns
     return (
         <Modal centered destroyOnClose title={title} width={width} open={visible} onOk={handleOk} footer={footer} onCancel={() => setModal({ visible: false })}>
             {formItems?.length > 0 && <MySearchForm search={search} formItems={formItems} setSearch={handleSearch} syncUrlParams={false} />}
+            {functionButtons?.length > 0 && functionButtons.map(item => <Button key={item.name} type={item.type} onClick={item.onClick}>{item.name}</Button>)}
             <MyTable
                 loading={loading}
                 columns={columns}

package/templates/react/handlebars/MySearchForm.hbs

@@ -0,0 +1 @@
+<MySearchForm form={form} search={search} initialValues={query} loading={loading} setSearch={setSearch} formItems={ {{formItems}} } />

package/templates/react/handlebars/MyTable.hbs

@@ -0,0 +1,26 @@
+<MyTable
+    rowKey='id'
+    query={query}
+    loading={loading}
+    dataSource={dataSource}
+    columns={ {{columnsValue}} }
+    {{#if hasExpandable}}
+    {{{{raw}}}}
+    expandable={{ onExpand, expandedRowKeys, expandedRowRender, columnWidth: 24 }}
+    {{{{/raw}}}}
+    {{/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}}
+    {{#if hasRowSelection}}
+    {{{{raw}}}}
+    rowSelection={{
+        selectedRowKeys: selectedRows.map(item => item.id),
+        onChange: (keys, rows) => setSelectedRows(rows)
+    }}
+    {{{{/raw}}}}
+    {{/if}}
+/>

package/templates/react/handlebars/functionButtonsBlock.hbs

@@ -0,0 +1,16 @@
+{{#if hasTabs}}
+{{#each tabs}}
+{activeKey === '{{this.key}}' &&
+    <Space style=\{{ marginBottom: 16 }}>
+        {{#each ../functionButtons}}
+        <Button type='primary' onClick={ {{this.action}} }>{{this.btn}}</Button>
+        {{/each}}
+    </Space>}
+{{/each}}
+{{else}}
+<Space style=\{{ marginBottom: 16 }}>
+    {{#each functionButtons}}
+    <Button type='primary' onClick={ {{this.action}} }>{{this.btn}}</Button>
+    {{/each}}
+</Space>
+{{/if}}

package/templates/react/handlebars/handleBlock.hbs

@@ -0,0 +1,52 @@
+{{#each operations}}
+const {{this.action}} = async record => {
+    const response = await request('/api')
+    if({{{../responseSuccess}}}){
+        refresh()
+    }
+}
+
+{{/each}}
+
+{{#each functionButtons}}
+const {{this.action}} = () => {
+    Modal.confirm({
+        title: '确认',
+        centered: true,
+        content: '确认{{this.btn}}吗？',
+        onOk: async () => {
+            const response = await request('/api')
+            if({{{../responseSuccess}}}){
+                refresh()
+            }
+        }
+    })
+}
+
+{{/each}}
+
+{{#if hasTabs}}
+const onTabChange = key => {
+    setActiveKey(key)
+    {{#if hasRowSelection}}setSelectedRows([]){{/if}}
+    setSearch({ pageNo: 1, pageSize: 10, type: key })
+}
+{{/if}}
+
+{{#if hasExpandable}}
+const onExpand = async (expanded, record) => {
+    if (expanded) {
+        setExpandedRowKeys([...expandedRowKeys, record.key])
+    } else {
+        setExpandedRowKeys(expandedRowKeys.filter(item => item !== record.key))
+    }
+}
+
+const expandedRowRender = record => (<div>自定义渲染</div>)
+
+{{/if}}
+
+const modalSubmit = async values => {
+    const response = await request('/api')
+    refresh()
+}

package/templates/react/handlebars/hookBlock.hbs

@@ -0,0 +1,9 @@
+const initParams = {{#if hasTabs}}{ type: tabs[0].key }{{else}}{}{{/if}}
+
+const query = formatQuery(Object.fromEntries(new URLSearchParams(location.search).entries()),  {{formItems}})
+
+const { total, loading, dataSource, search, setSearch, refresh } = useTableQuery(
+    async params => await request('/api/{{fileName}}', { method: 'POST', body: params }),
+    response => ({ data: response?.data ?? [], total: response?.total ?? 0 }),
+    {...initParams, ...query},
+)

package/templates/react/handlebars/stateBlock.hbs

@@ -0,0 +1,11 @@
+const [form] = Form.useForm()
+const [modal, setModal] = useState({})
+{{#if hasRowSelection}}
+const [selectedRows, setSelectedRows] = useState([])
+{{/if}}
+{{#if hasTabs}}
+const [activeKey, setActiveKey] = useState(tabs[0].key)
+{{/if}}
+{{#if hasExpandable}}
+const [expandedRowKeys, setExpandedRowKeys] = useState([])
+{{/if}}

package/templates/react/handlebars/tableOperate.hbs

@@ -0,0 +1,10 @@
+const operate = {
+    title: '操作',
+    render: (_, record) => (
+        <Space>
+            {{#each operations}}
+            <a onClick={()=> {{this.action}}(record)}>{{this.label}}</a>
+            {{/each}}
+        </Space>
+    )
+}

package/templates/react/index.hbs

@@ -1,91 +1,13 @@
 export default props => {
 
-    const [form] = Form.useForm()
-    const [modal, setModal] = useState({})
-    {{#if hasTabs}}
-    const [activeKey, setActiveKey] = useState(tabs[0].key)
-    {{/if}}
-    {{#if hasExpandable}}
-    const [expandedRowKeys, setExpandedRowKeys] = useState([])
-    {{/if}}
-    {{#if hasRowSelection}}
-    const [selectedRows, setSelectedRows] = useState([])
-    {{/if}}
-
-    const initParams = {{#if hasTabs}}{ type: tabs[0].key }{{else}}{}{{/if}}
-
-    const query = formatQuery(Object.fromEntries(new URLSearchParams(location.search).entries()), {{#if hasTabs}}formItems[activeKey]{{else}}formItems{{/if}})
-
-    const { total, loading, dataSource, search, setSearch, refresh } = useTableQuery(
-         async params => await request('/api/{{fileName}}', { method: 'POST', body: params }),
-         response => ({ data: response?.data ?? [], total: response?.total ?? 0 }),
-         {...initParams, ...query},
-    )
-
-    {{#each operations}}
-    const {{this.action}} = async record => {
-        const response = await request('/api')
-        if({{{../responseSuccess}}}){
-            refresh()
-        }
-    }
+    {{> stateBlock }}
 
-    {{/each}}
-
-    {{#each functionButtons}}
-    const {{this.action}} = () => {
-        Modal.confirm({
-            title: '确认',
-            centered: true,
-            content: '确认{{this.btn}}吗？',
-            onOk: async () => {
-                const response = await request('/api')
-                if({{{../responseSuccess}}}){
-                    refresh()
-                }
-            }
-        })
-    }
-
-    {{/each}}
-
-    {{#if hasTabs}}
-    const onTabChange = key => {
-        setActiveKey(key)
-        {{#if hasRowSelection}}setSelectedRows([]){{/if}}
-        setSearch({ pageNo: 1, pageSize: 10, type: key })
-    }
-    {{/if}}
-
-    {{#if hasExpandable}}
-    const onExpand = async (expanded, record) => {
-        if (expanded) {
-            setExpandedRowKeys([...expandedRowKeys, record.key])
-        } else {
-            setExpandedRowKeys(expandedRowKeys.filter(item => item !== record.key))
-        }
-    }
-
-    const expandedRowRender = record => (<div>自定义渲染</div>)
-
-    {{/if}}
+    {{> hookBlock }}
 
-    const modalSubmit = async values => {
-        const response = await request('/api')
-        refresh()
-    }
+    {{> handleBlock }}
 
     {{#if hasOperate}}
-    const operate = {
-        title: '操作',
-        render: (_, record) => (
-            <Space>
-                {{#each operations}}
-                <a onClick={()=> {{this.action}}(record)}>{{this.label}}</a>
-                {{/each}}
-            </Space>
-        )
-    }
+    {{> tableOperate }}
     {{/if}}
 
     {{#if hasTabs}}
@@ -100,46 +22,9 @@ export default props => {
     return (
         <Card {{#if hasTabs}}tabList={tabs} activeTabKey={activeKey} onTabChange={onTabChange}{{/if}}>
             {modal.visible && <MyModalForm {...modal} formItems={modalItems} submit={modalSubmit} setModal={setModal} />}
-            <MySearchForm form={form} search={search} initialValues={query} loading={loading} setSearch={setSearch} formItems={ {{#if hasTabs}}formItems[activeKey]{{else}}formItems{{/if}} } />
-            {{#if hasTabs}}
-            {{#each tabs}}
-            {activeKey === '{{this.key}}' &&
-                <Space style=\{{ marginBottom: 16 }}>
-                    {{#each ../functionButtons}}
-                    <Button type='primary' onClick={ {{this.action}} }>{{this.btn}}</Button>
-                    {{/each}}
-                </Space>}
+            {{#each pageStruct as |partialName|}}
+            {{> (partialName) @root }}
             {{/each}}
-            {{else}}
-            <Space style=\{{ marginBottom: 16 }}>
-                {{#each functionButtons}}
-                <Button type='primary' onClick={ {{this.action}} }>{{this.btn}}</Button>
-                {{/each}}
-            </Space>
-            {{/if}}
-            {{#if hasStaticInfo}}
-            <Alert showIcon title='{{staticInfoText}}' type='info' style=\{{ marginBottom: 16 }} />
-            {{/if}}
-            <MyTable
-                rowKey='id'
-                query={query}
-                loading={loading}
-                dataSource={dataSource}
-                columns={ {{columnsValue}} }
-                {{#if hasExpandable}}
-                expandable=\{{ onExpand, expandedRowKeys, expandedRowRender, columnWidth: 24 }}
-                {{/if}}
-                {{#if hasPagination}}
-                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 })}
-                {{/if}}
-                {{#if hasRowSelection}}
-                rowSelection=\{{
-                    selectedRowKeys: selectedRows.map(item => item.id),
-                    onChange: (keys, rows) => setSelectedRows(rows)
-                }}
-                {{/if}}
-            />
         </Card>
     )
 }