docs: add README with features and usage instructions

2026-07-18 22:30:52 +08:00
parent 4ee8d68c93
commit 63f5b1d10b
1 changed files with 71 additions and 0 deletions
@@ -0,0 +1,71 @@
+# PC装机配置表
+
+基于HTML的网页版PC装机配置管理工具，支持编辑和查看两种模式。
+
+## 功能
+
+- **表格展示**：以表格形式展示所有部件配置，包含图片、类型、品牌、型号、参数、价格、链接
+- **备选方案**：每个部件支持主配置+多个备选方案，点击即可切换，底部总价同步更新
+- **图片预览**：支持图片URL，点击可放大查看
+- **部件类型**：预设CPU、主板、显卡等常用类型，同时支持自定义输入
+- **JSON存储**：配置以JSON格式存储，支持导入导出
+
+## 文件说明
+
+| 文件 | 用途 | 部署方式 |
+|------|------|----------|
+| `index.html` | 查看页面 | 服务器部署，只读 |
+| `editor.html` | 编辑页面 | 本地双击打开，支持编辑 |
+| `sample_config.json` | 示例配置 | - |
+| `start_server.py` | 本地开发服务器 | `python start_server.py` |
+
+## 使用方法
+
+### 查看配置（服务器部署）
+
+1. 将 `index.html` 和JSON配置文件部署到Web服务器
+2. 浏览器打开：`http://你的域名/index.html?config=配置文件地址.json`
+3. 示例：`http://localhost:8080/?config=sample_config.json`
+
+### 编辑配置（本地使用）
+
+1. 双击 `editor.html` 在浏览器中打开
+2. 点击「打开文件」按钮，选择JSON配置文件
+3. 进行编辑操作：添加部件、编辑部件、删除部件、切换备选方案
+4. 点击「导出JSON」保存修改后的配置
+
+### 本地开发
+
+```bash
+python start_server.py
+# 打开 http://localhost:8080/editor.html
+```
+
+## JSON配置格式
+
+```json
+{
+  "configName": "我的装机方案",
+  "components": [
+    {
+      "type": "CPU",
+      "selected": 0,
+      "options": [
+        {
+          "image": "https://example.com/image.jpg",
+          "brand": "Intel",
+          "model": "i7-14700K",
+          "specs": "20核28线程 / 3.4GHz",
+          "price": 2499,
+          "link": "https://item.jd.com/xxx.html"
+        }
+      ]
+    }
+  ]
+}
+```
+
+- `selected`: 当前选中的配置索引（0为主配置）
+- `options`: 该部件的所有配置选项
+- `image`: 图片URL（可选）
+- `link`: 商品链接（可选）