72 lines
2.1 KiB
Markdown
72 lines
2.1 KiB
Markdown
# 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`: 商品链接（可选）
|