P4b Task 5:/system/embed-slots 管理页(Task 8/9 页面模式:useCursorList
游标累积 + 对话框治理)。列表(名称/绑定相册/启停/configVersion/更新时间,
启停开关行内 PATCH → configVersion+1 toast 提示)+ 新建/编辑对话框
(设置表单位置/尺寸/间隔/语言/默认收起,intervalMs 契约区间夹取;编辑按
整体替换语义提交完整 settings)+ 绑定相册对话框(相册标题/ID 搜索选中 →
确认框携带 A22 文案「configVersion 将递增,官网无需改动」;清空即解绑)+
嵌入代码卡({EMBED_ORIGIN}/embed/v1/loader.js + data-slot 令牌,一键复制;
EMBED_ORIGIN=VITE_EMBED_ORIGIN 缺省本机 viewer dev,.env.example 登记)。
- API 层 src/api/embedSlots.ts + types/api/embedSlot.d.ts(契约镜像)
- vitest 9 例:表单→载荷(缺省+夹取)、编辑载荷收敛、snippet 拼接、
环境基址兜底、绑定变更分类、zh/en 键一致 + A22 短语断言
- Playwright e2e(真实 cn+ov 后端):新建→绑定(gov-photos 直种 +
seed-fixture 新增 sync-flush 模式经 bootstrap/真实发送管线投影 photos_ov)
→嵌入代码卡含 token→ov 公开 feed 返回相册照片→换绑 configVersion+1 +
feed 切换(A22)→停用 feed 404;admin playwright 配置补 ov webServer
- i18n zh/en(embedSlotsManage.* + menus.system.embedSlots)
Co-Authored-By: Claude Code <noreply@anthropic.com>
Art Design Pro
A backend system template that combines design aesthetics with efficient development, helping you quickly build professional-grade applications
What makes this project special?
Interface Design: Modern UI design with smooth interactions, focusing on user experience and visual design
Quick Start: Clean architecture + comprehensive documentation, easy for backend developers to use
Rich Components: Built-in high-quality components for data display, forms, and more to meet different business scenarios
Smooth Interactions: Button clicks, theme switching, page transitions, chart animations - experience comparable to commercial products
Efficient Development: Built-in practical APIs like useTable and ArtForm to significantly improve development efficiency
Clean Scripts: Built-in one-click cleanup script to quickly remove demo data and get a ready-to-develop base project
Tech Stack
Development Framework: Vue3, TypeScript, Vite, Element-Plus, Tailwind CSS
Code Standards: Eslint, Prettier, Stylelint, Husky, Lint-staged, cz-git
Preview
Quick Access
Live Demo | Official Documentation | Changelog
Installation & Setup
# Install dependencies
pnpm install
# If pnpm install fails, try using the command below
pnpm install --ignore-scripts
# Start local development environment
pnpm dev
# Build for production
pnpm build
Clean Version
The project includes a cleanup script to quickly remove demo data and provide developers with a ready-to-develop base project
pnpm clean:dev
Technical Support
QQ Group: 1038930070 (Click the link to join the group chat)
Browser Compatibility
Supports modern mainstream browsers including Chrome, Safari, Firefox, and more.
Contributing
We sincerely welcome and appreciate the support of every contributor! Whether you have new ideas, feature suggestions, or code optimizations, you can participate in the following ways:
Submit Pull Requests: Share your code and help the project grow.
Create GitHub Issues: Provide bug feedback or new feature suggestions to help us improve together.
Every contribution you make takes this project one step further! Come join our open source community!
Continuous Optimization & Extension
The project maintains active updates, supports the latest frontend tech stack, is compatible with mainstream frameworks, and ensures long-term stability and extensibility. Community-driven feedback mechanisms allow your needs to be quickly integrated into project iterations.
Donation
If you feel this project has reduced your development costs and solved problems in your work/life, you can support us through the following ways:



