You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.
# 子项目：
## 📝 项目概述
- **核心功能**：在固定的 1920x1080 画布上，通过拖拽组件自由组合生成模板布局。
- **应用场景**：大屏可视化布局设计、自定义面板生成。
## 🛠 技术栈
- **核心**: HTML5, CSS3, JavaScript (ES5/ES6+)
- **库/框架**: jQuery, Layui (UI组件库)
- **数据存储**: localStorage (本地持久化)
## 📂 项目结构
```text
├── css/ # 样式文件
├── js/ # 逻辑脚本
├── layui/ # Layui 框架资源
├── data.json # localStorage 数据结构示例（核心参考）
├── config.json # 配置文件
├── index.html # 主编辑器页面
└── list.html # 列表/预览页面
```
## 📐 核心架构
### DOM 结构
```html
< div id = "app" >
<!-- 左侧：组件列表 -->
< div id = "components-panel" ></ div >
<!-- 中间：画布容器 (1920*1080) -->
< div id = "canvas-panel" ></ div >
<!-- 右侧：属性配置 -->
< div id = "props-panel" ></ div >
</ div >
```
### 数据规范
- **数据源**: 项目依赖 `localStorage` 进行状态保存。
- **结构定义**: 详细的数据结构定义 ** 必须** 参考 `data.json` 文件。在操作数据前，请务必读取该文件理解字段含义。
## 🤖 开发与交互规范 (继承全局规范)
### 核心指令
1. ** 中文优先**：沟通、注释、日志均使用中文。
2. ** 执行流程**： `分析 (Understand) -> 计划 (Plan) -> 用户确认 (Approve) -> 执行 (Execute)` 的流程。
3. ** 代码修改**：
- **严禁破坏性修改**：
- **增量开发**：优先通过新增函数/逻辑来满足新需求。
- **jQuery/Layui 规范**：遵循 jQuery 的 DOM 操作模式和 Layui 的组件使用规范。
### 任务列表
- [ ] (在此处添加新任务)