feat: expand EasyCode software factory workflows
This commit is contained in:
王鹏
@@ -0,0 +1,74 @@
|
||||
<h2>后端一键生成编排器：复用现有能力，统一成一个任务</h2>
|
||||
<p class="subtitle">推荐新增 one_click_project 任务类型。前端提交项目名称后，后端负责完整串联生成、预览和运行状态。</p>
|
||||
|
||||
<div class="mockup">
|
||||
<div class="mockup-header">编排链路</div>
|
||||
<div class="mockup-body">
|
||||
<div style="display:grid;grid-template-columns:repeat(7,1fr);gap:10px;padding:14px;align-items:stretch;">
|
||||
<div class="placeholder">创建/更新项目</div>
|
||||
<div class="placeholder">生成系统蓝图</div>
|
||||
<div class="placeholder">生成数据库</div>
|
||||
<div class="placeholder">生成业务动作</div>
|
||||
<div class="placeholder">初始化页面</div>
|
||||
<div class="placeholder">生成源码结构</div>
|
||||
<div class="placeholder">启动运行预览</div>
|
||||
</div>
|
||||
<div class="placeholder" style="margin:14px;">
|
||||
任务成功条件：运行预览状态达到 RUNNING，并返回 backendUrl、frontendUrl、adminFrontendUrl、downloadReady
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="split">
|
||||
<div class="mockup">
|
||||
<div class="mockup-header">任务状态</div>
|
||||
<div class="mockup-body">
|
||||
<div style="display:grid;gap:10px;padding:14px;">
|
||||
<div class="placeholder">generateType: one_click_project</div>
|
||||
<div class="placeholder">progress: 0-100</div>
|
||||
<div class="placeholder">currentStep: 当前阶段中文说明</div>
|
||||
<div class="placeholder">stage: APP_BLUEPRINT / DATABASE / BUSINESS / PAGE / PREVIEW / RUN</div>
|
||||
<div class="placeholder">resultPayload: 运行地址、下载状态、生成报告</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mockup">
|
||||
<div class="mockup-header">失败恢复</div>
|
||||
<div class="mockup-body">
|
||||
<div style="display:grid;gap:10px;padding:14px;">
|
||||
<div class="placeholder">AI 调用失败：沿用任务重试策略</div>
|
||||
<div class="placeholder">数据库/业务校验失败：给出字段级原因</div>
|
||||
<div class="placeholder">页面初始化失败：允许进入专家模式修正蓝图</div>
|
||||
<div class="placeholder">运行预览失败：保留源码下载和日志</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="section">
|
||||
<h3>设计重点</h3>
|
||||
<div class="options" data-multiselect>
|
||||
<div class="option" data-choice="reuse-ai-task" onclick="toggleSelect(this)">
|
||||
<div class="letter">A</div>
|
||||
<div class="content">
|
||||
<h3>复用现有 AI 任务表</h3>
|
||||
<p>新增 generateType，不新增一套完全独立的任务中心。</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="option" data-choice="stage-aware" onclick="toggleSelect(this)">
|
||||
<div class="letter">B</div>
|
||||
<div class="content">
|
||||
<h3>任务内部按阶段更新</h3>
|
||||
<p>每个阶段开始和结束都更新 progress/currentStep，失败时记录阶段。</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="option" data-choice="run-is-success" onclick="toggleSelect(this)">
|
||||
<div class="letter">C</div>
|
||||
<div class="content">
|
||||
<h3>以 RUNNING 作为成功标准</h3>
|
||||
<p>不是“源码生成完”就成功，而是在线预览可打开才算一键生成成功。</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,69 @@
|
||||
<h2>失败报告与阶段验收：让一键生成可恢复</h2>
|
||||
<p class="subtitle">一键生成不是隐藏复杂度，而是把复杂度整理成用户能理解、系统能重试的阶段报告。</p>
|
||||
|
||||
<div class="mockup">
|
||||
<div class="mockup-header">阶段验收规则</div>
|
||||
<div class="mockup-body">
|
||||
<div style="display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:14px;">
|
||||
<div class="placeholder">系统蓝图：角色、前台菜单、后台菜单、页面清单非空</div>
|
||||
<div class="placeholder">数据库：表结构已保存，字段合法，SQL 可生成</div>
|
||||
<div class="placeholder">业务动作：通过安全 DSL 校验，绑定到已有表字段</div>
|
||||
<div class="placeholder">页面设计：前台和后台至少初始化出主页和业务页</div>
|
||||
<div class="placeholder">源码预览：backend / frontend / admin / sql 都能渲染结构</div>
|
||||
<div class="placeholder">运行预览：前台和后台 URL 达到可访问状态</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="split">
|
||||
<div class="mockup">
|
||||
<div class="mockup-header">失败报告</div>
|
||||
<div class="mockup-body">
|
||||
<div style="display:grid;gap:10px;padding:14px;">
|
||||
<div class="placeholder">失败阶段：运行预览</div>
|
||||
<div class="placeholder">失败原因：后台前端进程退出</div>
|
||||
<div class="placeholder">已完成成果：源码已生成，可下载</div>
|
||||
<div class="placeholder">建议动作：查看日志 / 重试运行预览 / 进入专家模式</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mockup">
|
||||
<div class="mockup-header">恢复动作</div>
|
||||
<div class="mockup-body">
|
||||
<div style="display:grid;gap:10px;padding:14px;">
|
||||
<button class="mock-button">重试失败阶段</button>
|
||||
<button class="mock-button">从上一阶段继续生成</button>
|
||||
<button class="mock-button">进入专家模式修正</button>
|
||||
<button class="mock-button">下载已生成源码</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="section">
|
||||
<h3>错误处理原则</h3>
|
||||
<div class="options" data-multiselect>
|
||||
<div class="option" data-choice="stage-validation" onclick="toggleSelect(this)">
|
||||
<div class="letter">A</div>
|
||||
<div class="content">
|
||||
<h3>每阶段都有验收</h3>
|
||||
<p>不是只看最终异常，而是每个阶段明确自己的完成标准。</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="option" data-choice="partial-artifact" onclick="toggleSelect(this)">
|
||||
<div class="letter">B</div>
|
||||
<div class="content">
|
||||
<h3>保留阶段成果</h3>
|
||||
<p>运行预览失败时，源码下载、结构预览、日志仍然可用。</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="option" data-choice="focused-retry" onclick="toggleSelect(this)">
|
||||
<div class="letter">C</div>
|
||||
<div class="content">
|
||||
<h3>重试失败阶段</h3>
|
||||
<p>优先重试失败阶段，必要时才从头重新生成。</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,80 @@
|
||||
<h2>前端页面改造：默认一键生成，专家模式收纳现有设计器</h2>
|
||||
<p class="subtitle">目标不是删除现有能力，而是改变默认信息架构：普通用户先看到成果，高级用户再进入细节编辑。</p>
|
||||
|
||||
<div class="split">
|
||||
<div class="mockup">
|
||||
<div class="mockup-header">普通模式：生成入口</div>
|
||||
<div class="mockup-body">
|
||||
<div class="mock-nav">EasyCode</div>
|
||||
<div style="display:grid;gap:12px;padding:14px;">
|
||||
<input class="mock-input" value="图书借阅系统" />
|
||||
<input class="mock-input" value="可选：包含借书、还书、逾期提醒" />
|
||||
<button class="mock-button">生成完整项目</button>
|
||||
</div>
|
||||
<div style="display:grid;gap:10px;padding:14px;">
|
||||
<div class="placeholder">默认生成：后端、用户前台、后台管理端、SQL</div>
|
||||
<div class="placeholder">高级设置：是否生成用户前台、行业模板、后台模块</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mockup">
|
||||
<div class="mockup-header">普通模式：生成结果</div>
|
||||
<div class="mockup-body">
|
||||
<div style="display:grid;gap:12px;padding:14px;">
|
||||
<div class="placeholder">生成成功：运行预览已就绪</div>
|
||||
<button class="mock-button">打开用户前台</button>
|
||||
<button class="mock-button">打开后台管理端</button>
|
||||
<button class="mock-button">下载完整源码</button>
|
||||
<button class="mock-button">查看生成报告</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mockup">
|
||||
<div class="mockup-header">专家模式：生成后调整</div>
|
||||
<div class="mockup-body">
|
||||
<div style="display:grid;grid-template-columns:220px 1fr;gap:14px;padding:14px;">
|
||||
<div style="display:grid;gap:10px;">
|
||||
<div class="placeholder">系统蓝图</div>
|
||||
<div class="placeholder">数据库结构</div>
|
||||
<div class="placeholder">业务流程</div>
|
||||
<div class="placeholder">页面设计</div>
|
||||
<div class="placeholder">运行预览</div>
|
||||
</div>
|
||||
<div style="display:grid;gap:10px;">
|
||||
<div class="placeholder">复用现有 AppBlueprintPanel / DatabaseDesigner / BusinessBlueprintPanel</div>
|
||||
<div class="placeholder">页面设计器继续跳转到独立全屏页面</div>
|
||||
<div class="placeholder">修改后可重新运行“生成完整项目”或只重建预览</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="section">
|
||||
<h3>前端落地原则</h3>
|
||||
<div class="options" data-multiselect>
|
||||
<div class="option" data-choice="generate-simplified" onclick="toggleSelect(this)">
|
||||
<div class="letter">A</div>
|
||||
<div class="content">
|
||||
<h3>GenerateView 简化成主入口</h3>
|
||||
<p>默认只展示项目名、可选需求、生成按钮、任务进度和结果卡片。</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="option" data-choice="existing-panels-expert" onclick="toggleSelect(this)">
|
||||
<div class="letter">B</div>
|
||||
<div class="content">
|
||||
<h3>现有面板放进专家模式</h3>
|
||||
<p>系统蓝图、数据库、业务流程、页面设计入口保留，但从默认流程中收起。</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="option" data-choice="preview-stays-delivery" onclick="toggleSelect(this)">
|
||||
<div class="letter">C</div>
|
||||
<div class="content">
|
||||
<h3>PreviewView 继续负责交付</h3>
|
||||
<p>运行 iframe、日志、源码树、下载能力继续放在预览页，生成结果页提供快捷入口。</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,76 @@
|
||||
<h2>一键生成主流程：普通用户一键到底，专家模式旁路编辑</h2>
|
||||
<p class="subtitle">第一版目标：输入项目名称，自动生成后端、用户前台、后台管理端，并启动在线运行预览。</p>
|
||||
|
||||
<div class="mockup">
|
||||
<div class="mockup-header">默认用户路径</div>
|
||||
<div class="mockup-body">
|
||||
<div class="mock-nav">EasyCode 项目生成</div>
|
||||
<div style="display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;padding:14px;">
|
||||
<input class="mock-input" value="图书借阅系统" />
|
||||
<button class="mock-button">生成完整项目</button>
|
||||
</div>
|
||||
<div style="display:grid;grid-template-columns:repeat(5,1fr);gap:10px;padding:14px;">
|
||||
<div class="placeholder">1. 规划项目</div>
|
||||
<div class="placeholder">2. 生成数据</div>
|
||||
<div class="placeholder">3. 生成业务</div>
|
||||
<div class="placeholder">4. 生成页面</div>
|
||||
<div class="placeholder">5. 运行预览</div>
|
||||
</div>
|
||||
<div class="placeholder" style="margin:14px;">
|
||||
生成完成后优先展示：用户前台地址、后台管理端地址、源码下载、生成报告
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="split">
|
||||
<div class="mockup">
|
||||
<div class="mockup-header">生成中页面</div>
|
||||
<div class="mockup-body">
|
||||
<div style="display:grid;gap:12px;padding:14px;">
|
||||
<div class="placeholder">当前阶段：生成业务流程</div>
|
||||
<div class="placeholder">已完成：系统蓝图、数据库结构</div>
|
||||
<div class="placeholder">预计下一步：初始化页面设计</div>
|
||||
<div class="placeholder">可选操作：查看生成日志 / 取消任务</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mockup">
|
||||
<div class="mockup-header">生成完成页面</div>
|
||||
<div class="mockup-body">
|
||||
<div style="display:grid;gap:12px;padding:14px;">
|
||||
<button class="mock-button">打开用户前台</button>
|
||||
<button class="mock-button">打开后台管理端</button>
|
||||
<button class="mock-button">下载完整源码</button>
|
||||
<div class="placeholder">需要调整？进入专家模式：数据库 / 业务流程 / 页面设计</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="section">
|
||||
<h3>体验原则</h3>
|
||||
<div class="options" data-multiselect>
|
||||
<div class="option" data-choice="default-one-click" onclick="toggleSelect(this)">
|
||||
<div class="letter">A</div>
|
||||
<div class="content">
|
||||
<h3>默认一键到底</h3>
|
||||
<p>用户只填项目名称，需求描述可选；中间不强制确认。</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="option" data-choice="progress-transparent" onclick="toggleSelect(this)">
|
||||
<div class="letter">B</div>
|
||||
<div class="content">
|
||||
<h3>进度透明</h3>
|
||||
<p>展示当前阶段、已完成阶段、失败原因和重试入口，避免黑盒等待。</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="option" data-choice="expert-after-result" onclick="toggleSelect(this)">
|
||||
<div class="letter">C</div>
|
||||
<div class="content">
|
||||
<h3>先看成果，再进专家模式</h3>
|
||||
<p>生成结果优先展示在线预览和源码下载；设计器入口放在“调整项目”里。</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,99 @@
|
||||
<h2>把项目拉回初心：从“设计器集合”回到“一键生成完整项目”</h2>
|
||||
<p class="subtitle">这张图先不决定细节，只帮我们确认产品主线：用户输入项目名称后，系统应该自动完成前后端生成；设计器变成可选的校准工具。</p>
|
||||
|
||||
<div class="split">
|
||||
<div class="mockup">
|
||||
<div class="mockup-header">现在更像：多步骤低代码工作台</div>
|
||||
<div class="mockup-body">
|
||||
<div class="mock-nav">项目生成工作台</div>
|
||||
<div style="display:grid;gap:12px;padding:14px;">
|
||||
<div class="placeholder">1. 生成系统模块设计</div>
|
||||
<div class="placeholder">2. 生成数据库结构</div>
|
||||
<div class="placeholder">3. 保存表结构</div>
|
||||
<div class="placeholder">4. 生成业务流程设计</div>
|
||||
<div class="placeholder">5. 初始化页面设计</div>
|
||||
<div class="placeholder">6. 进入页面设计器调整</div>
|
||||
<div class="placeholder">7. 预览 / 运行 / 下载</div>
|
||||
</div>
|
||||
<div class="pros-cons">
|
||||
<div class="pros">
|
||||
<h4>优点</h4>
|
||||
<ul>
|
||||
<li>可控、可编辑</li>
|
||||
<li>适合高级用户调细节</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="cons">
|
||||
<h4>问题</h4>
|
||||
<ul>
|
||||
<li>用户要理解太多阶段</li>
|
||||
<li>不像输入名称后自动生成</li>
|
||||
<li>设计器开始抢主线</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mockup">
|
||||
<div class="mockup-header">目标应该是：自动生成流水线</div>
|
||||
<div class="mockup-body">
|
||||
<div class="mock-nav">EasyCode 一键生成</div>
|
||||
<div style="display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;padding:14px;">
|
||||
<input class="mock-input" value="图书借阅系统" />
|
||||
<button class="mock-button">生成完整项目</button>
|
||||
</div>
|
||||
<div style="display:grid;gap:12px;padding:14px;">
|
||||
<div class="placeholder">自动规划：角色、菜单、页面、表结构</div>
|
||||
<div class="placeholder">自动生成：后端 API、管理端、用户前台、SQL</div>
|
||||
<div class="placeholder">自动校验：结构完整性、模板渲染、缺口报告</div>
|
||||
<div class="placeholder">交付结果：在线运行、源码预览、下载完整工程</div>
|
||||
</div>
|
||||
<div class="pros-cons">
|
||||
<div class="pros">
|
||||
<h4>主线</h4>
|
||||
<ul>
|
||||
<li>先完整生成，再允许编辑</li>
|
||||
<li>设计器作为修正入口</li>
|
||||
<li>用户看到的是项目成果</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="cons">
|
||||
<h4>约束</h4>
|
||||
<ul>
|
||||
<li>必须有生成编排器</li>
|
||||
<li>失败要能定位到阶段</li>
|
||||
<li>默认质量要足够稳</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="section">
|
||||
<h3>我建议的新产品原则</h3>
|
||||
<div class="options" data-multiselect>
|
||||
<div class="option" data-choice="autopilot-first" onclick="toggleSelect(this)">
|
||||
<div class="letter">A</div>
|
||||
<div class="content">
|
||||
<h3>自动生成优先</h3>
|
||||
<p>默认按钮只叫“生成完整项目”，内部串起蓝图、数据库、业务动作、页面、预览和下载。</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="option" data-choice="designer-secondary" onclick="toggleSelect(this)">
|
||||
<div class="letter">B</div>
|
||||
<div class="content">
|
||||
<h3>设计器降级为校准工具</h3>
|
||||
<p>页面设计器、数据库设计器、业务块不再是必经步骤，而是生成后发现不满意时再进入。</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="option" data-choice="artifact-first" onclick="toggleSelect(this)">
|
||||
<div class="letter">C</div>
|
||||
<div class="content">
|
||||
<h3>成果先于配置</h3>
|
||||
<p>页面主视觉展示运行地址、源码包、生成文件和缺口报告，而不是先展示 JSON 和大量配置面板。</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,3 @@
|
||||
<div style="display:flex;align-items:center;justify-content:center;min-height:60vh">
|
||||
<p class="subtitle">继续在对话里确认“一键生成”的边界...</p>
|
||||
</div>
|
||||
Reference in New Issue
Block a user