使用 minimax agent 可快速生成带搜索、排序、分页和响应式布局的员工信息管理列表页，支持导出、编辑与状态变更等 crud 功能，无需手写代码。
☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 多模态理解力帮你轻松跨越从0到1的创作门槛☜☜☜
你需要快速生成一个带搜索、排序、分页和响应式布局的数据列表页面，但不想写一行HTML/CSS/JS代码，也不愿反复调试样式和交互逻辑。
创建基础数据列表页面
打开 MiniMax Agent 官网，确保已登录并完成实名认证。未认证账户无法调用完整前端渲染能力，页面可能缺失表格交互或导出功能。
在对话框中直接输入提示词：“生成一个员工信息管理列表页，字段包括姓名、部门、入职日期、职级、状态（在职/离职），要求支持按姓名搜索、按入职日期排序、每页显示10条、响应式适配手机。”
按下回车后，Agent 会自动进入 high-level 规划阶段，展示技术选型（React + TypeScript + TanStack Table）、数据模拟策略（JSON mock）及页面结构草图。这一步不能跳过，【跳过确认将导致生成页面缺少分页控件或搜索框】。
看到“是否继续执行？”提示时，点击「确认」。页面将在90秒内生成并自动预览。
注入真实数据源
方法一：拖入 Excel 文件
把包含员工数据的 .xlsx 或 .csv 文件直接拖进 Agent 对话窗口。它会自动识别表头，匹配字段名（如“姓名”“入职日期”），并替换默认 mock 数据。注意：文件首行必须为中文列名，且不能含合并单元格，否则解析失败。
方法二：粘贴 JSON 数据
复制形如 [{"name":"张三","dept":"技术部","join_date":"2023-05-12","level":"P6","status":"在职"}] 的数组，在对话框中发送：“用以下数据替换当前列表数据：[粘贴内容]”。Agent 会校验字段类型，自动转换日期格式并映射到对应列。
方法三：连接 Supabase 表（需提前配置）
若已有 Supabase 项目，在「凭证与基础信息」页获取 Project URL 和 Anon Key，发给 Agent：“接入 Supabase 表 employees，字段映射同上”。它会自动生成带实时查询、增量加载的生产级列表页。
添加导出与操作按钮
第一步：告诉 Agent 当前页面需要导出功能
在已生成的页面预览状态下，输入：“在表格顶部加一个‘导出 Excel’按钮，点击后下载当前筛选结果。”
第二步：追加行操作
接着说：“每行末尾加‘编辑’和‘停用’按钮，编辑弹窗需保留原字段值，停用按钮点击后将状态改为‘离职’并刷新列表。”
第三步：触发重生成
Agent 会自动复用原有布局结构，仅增量更新交互逻辑。整个过程无需重新构建页面，耗时约25秒。导出功能默认使用 SheetJS，不依赖后端接口；停用操作走本地状态更新，如需同步到数据库，需额外提供 API Endpoint。
这一步做完，页面就具备了真实业务系统所需的核心 CRUD 能力，可直接部署到 Vercel 或 Netlify。
