更新产品配置和技能定义

2026-04-05 02:34:24 +08:00
parent 40d9daf42a
commit 2d6afa0a01
64 changed files with 3299 additions and 1228 deletions
--- a/.trae/skills/html2image/SKILL.md
+++ b/.trae/skills/html2image/SKILL.md
@@ -1,15 +0,0 @@
---
-name: 商品详情设计
-description: "你是一个电商平台的商品详情设计师，负责设计商品的详情页，包括配置清单、商品实拍图、商品卖点、功能描述等。
---
-### 工作职责：
- 1. 生成对应商品的html详情页，每一项内容，独立的成1000*1000的页面
- 2. 使用 npx playwright screenshot，完成html转图片
- 3.  内容不要包含价格
-4.   一个商品一个详情页 
-5. 配置清单部分，超出一个张图片，可以用多张 ，然后用-1 -2 这样的后缀标识
-### 详情页包含内容：
- 1.  配置清单
- 3.  商品实拍图
- 4.  商品卖点
- 5.  功能描述
--- a/.trae/skills/image-tools/SKILL.md
+++ b/.trae/skills/image-tools/SKILL.md
@@ -0,0 +1,71 @@
+---
+name: image-tools
+description: 图片处理工具集，用于检查图片信息、HTML转PNG、裁剪水印等操作。当用户需要处理产品图片、转换HTML为图片、或去除图片水印时使用此技能。
+---
+
+# Image Tools
+
+## Overview
+
+提供产品图片处理相关功能，包括检查图片元信息、HTML页面截图、裁剪水印等操作。适用于产品文档和图片批量处理场景。
+
+## Quick Start
+
+使用前需安装依赖：
+
+```bash
+cd tools/image-tools/scripts
+npm install
+```
+
+## Tasks
+
+### 检查图片信息
+
+查看图片的宽度、高度、格式等元信息：
+
+```bash
+cd tools/image-tools/scripts
+node check-image-info.js
+```
+
+**用途**：批量检查产品图片尺寸，确保符合规格要求。
+
+### HTML 转 PNG
+
+将HTML文件转换为PNG图片截图：
+
+```bash
+cd tools/image-tools/scripts
+node convert-html-to-png.js
+```
+
+**用途**：将产品配置清单HTML转换为PNG图片，用于产品展示。
+
+### 裁剪水印
+
+裁剪图片底部水印区域（默认裁剪底部300px）：
+
+```bash
+cd tools/image-tools/scripts
+node remove-watermark.js
+```
+
+**用途**：批量处理产品图片，去除底部水印。
+
+## Configuration
+
+脚本默认处理路径为 `产品/飞牛 NAS/fyd-亚克力机箱 - 单/详情` 目录。如需修改：
+
+- **check-image-info.js**: 修改 `imageDir` 变量
+- **convert-html-to-png.js**: 修改 `detailDir` 变量及文件过滤条件
+- **remove-watermark.js**: 修改 `imageDir` 和 `CROP_BOTTOM_HEIGHT` 常量
+
+## Resources
+
+### scripts/
+
+- `check-image-info.js` - 图片信息检查脚本
+- `convert-html-to-png.js` - HTML转PNG截图脚本
+- `remove-watermark.js` - 水印裁剪脚本
+- `package.json` - Node.js 依赖配置
--- a/.trae/skills/image-tools/scripts/check-image-info.js
+++ b/.trae/skills/image-tools/scripts/check-image-info.js
@@ -0,0 +1,27 @@
+const sharp = require('sharp');
+const path = require('path');
+const fs = require('fs');
+
+async function checkImageInfo() {
+    const imageDir = path.join(__dirname, '产品', '飞牛 NAS', 'fyd-亚克力机箱 - 单', '详情', 'image');
+    
+    const imageFiles = fs.readdirSync(imageDir).filter(file => file.endsWith('.jpg'));
+    
+    console.log('📸 图片信息检查\n');
+    
+    for (const imageFile of imageFiles) {
+        const imagePath = path.join(imageDir, imageFile);
+        const metadata = await sharp(imagePath).metadata();
+        
+        console.log(`${imageFile}:`);
+        console.log(`  宽度: ${metadata.width}px`);
+        console.log(`  高度: ${metadata.height}px`);
+        console.log(`  格式: ${metadata.format}`);
+        console.log('');
+    }
+}
+
+checkImageInfo().catch(error => {
+    console.error('💥 检查过程出错:', error);
+    process.exit(1);
+});
--- a/.trae/skills/image-tools/scripts/convert-html-to-png.js
+++ b/.trae/skills/image-tools/scripts/convert-html-to-png.js
@@ -0,0 +1,58 @@
+const puppeteer = require('puppeteer');
+const path = require('path');
+const fs = require('fs');
+
+async function convertHtmlToPng() {
+    console.log('🚀 启动 HTML 转 PNG 转换工具...\n');
+    
+    const browser = await puppeteer.launch({
+        headless: 'new',
+        args: ['--no-sandbox', '--disable-setuid-sandbox']
+    });
+    
+    const page = await browser.newPage();
+    
+    await page.setViewport({ width: 1000, height: 1000 });
+    
+    const detailDir = 'G:\\stonelan-workspace\\membank\\产品\\飞牛 NAS\\fyd-亚克力机箱 - 单\\主图';
+    
+    const htmlFiles = fs.readdirSync(detailDir)
+        .filter(file => file.endsWith('.html'));
+    
+    console.log(`📁 找到 ${htmlFiles.length} 个 HTML 文件需要转换\n`);
+    
+    for (const htmlFile of htmlFiles) {
+        try {
+            const htmlPath = path.join(detailDir, htmlFile);
+            const pngFile = htmlFile.replace('.html', '.png');
+            const pngPath = path.join(detailDir, pngFile);
+            
+            console.log(`📄 正在转换: ${htmlFile}`);
+            
+            const fileUrl = `file:///${htmlPath.replace(/\\/g, '/')}`;
+            await page.goto(fileUrl, {
+                waitUntil: 'networkidle0',
+                timeout: 10000
+            });
+            
+            await page.screenshot({
+                path: pngPath,
+                fullPage: true,
+                type: 'png'
+            });
+            
+            console.log(`✅ 已生成: ${pngFile}\n`);
+        } catch (error) {
+            console.error(`❌ 转换失败 ${htmlFile}: ${error.message}\n`);
+        }
+    }
+    
+    await browser.close();
+    
+    console.log('✨ 所有转换任务已完成！');
+}
+
+convertHtmlToPng().catch(error => {
+    console.error('💥 转换过程出错:', error);
+    process.exit(1);
+});
--- a/.trae/skills/image-tools/scripts/convert-main-image-to-png.js
+++ b/.trae/skills/image-tools/scripts/convert-main-image-to-png.js
@@ -0,0 +1,60 @@
+const puppeteer = require('puppeteer');
+const path = require('path');
+const fs = require('fs');
+
+async function convertHtmlToPng() {
+    console.log('🚀 启动主图 HTML 转 PNG 转换工具...\n');
+    
+    const browser = await puppeteer.launch({
+        headless: 'new',
+        args: ['--no-sandbox', '--disable-setuid-sandbox']
+    });
+    
+    const page = await browser.newPage();
+    
+    // 主图尺寸 800x800
+    await page.setViewport({ width: 1000, height: 1000 });
+    
+    const mainImageDir = 'G:\\stonelan-workspace\\membank\\产品\\飞牛 NAS\\fyd-亚克力机箱 - 单\\主图';
+    
+    const htmlFiles = fs.readdirSync(mainImageDir)
+        .filter(file => file.endsWith('.html') && file.includes('主图'));
+    
+    console.log(`📁 找到 ${htmlFiles.length} 个主图 HTML 文件需要转换\n`);
+    
+    for (const htmlFile of htmlFiles) {
+        try {
+            const htmlPath = path.join(mainImageDir, htmlFile);
+            const pngFile = htmlFile.replace('.html', '.png');
+            const pngPath = path.join(mainImageDir, pngFile);
+            
+            console.log(`📄 正在转换: ${htmlFile}`);
+            
+            const fileUrl = `file:///${htmlPath.replace(/\\/g, '/')}`;
+            await page.goto(fileUrl, {
+                waitUntil: 'networkidle0',
+                timeout: 10000
+            });
+            
+            await page.screenshot({
+                path: pngPath,
+                fullPage: false,
+                type: 'png',
+                clip: { x: 0, y: 0, width: 1000, height: 1000 }
+            });
+            
+            console.log(`✅ 已生成: ${pngFile}\n`);
+        } catch (error) {
+            console.error(`❌ 转换失败 ${htmlFile}: ${error.message}\n`);
+        }
+    }
+    
+    await browser.close();
+    
+    console.log('✨ 所有主图转换任务已完成！');
+}
+
+convertHtmlToPng().catch(error => {
+    console.error('💥 转换过程出错:', error);
+    process.exit(1);
+});
--- a/.trae/skills/image-tools/scripts/package-lock.json
+++ b/.trae/skills/image-tools/scripts/package-lock.json
--- a/.trae/skills/image-tools/scripts/package.json
+++ b/.trae/skills/image-tools/scripts/package.json
@@ -0,0 +1,20 @@
+{
+  "name": "membank",
+  "version": "1.0.0",
+  "main": "index.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git@gitee.com:xiongmaojames/membank.git"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "description": "",
+  "dependencies": {
+    "puppeteer": "^24.40.0",
+    "sharp": "^0.34.5"
+  }
+}
--- a/.trae/skills/image-tools/scripts/remove-background.py
+++ b/.trae/skills/image-tools/scripts/remove-background.py
@@ -0,0 +1,64 @@
+# -*- coding: utf-8 -*-
+"""
+产品图片抠图工具
+使用rembg库自动去除图片背景
+"""
+import os
+import sys
+
+try:
+    from rembg import remove
+    from PIL import Image
+except ImportError:
+    print("Missing dependencies, installing...")
+    os.system("pip install rembg pillow")
+    from rembg import remove
+    from PIL import Image
+
+def remove_background(input_path, output_path):
+    """
+    去除图片背景
+    """
+    try:
+        print(f"Processing: {input_path}")
+        
+        # 打开原始图片
+        with open(input_path, 'rb') as input_file:
+            input_data = input_file.read()
+        
+        # 去除背景
+        output_data = remove(input_data)
+        
+        # 保存结果
+        with open(output_path, 'wb') as output_file:
+            output_file.write(output_data)
+        
+        print(f"Saved: {output_path}")
+        return True
+    except Exception as e:
+        print(f"Error: {e}")
+        return False
+
+if __name__ == "__main__":
+    # 产品图片路径
+    image_dir = r"g:\stonelan-workspace\membank\产品\飞牛 NAS\fyd-亚克力机箱 - 单\image"
+    
+    # 要处理的图片
+    input_image = os.path.join(image_dir, "正面.jpg")
+    output_image = os.path.join(image_dir, "正面_抠图.png")
+    
+    # 检查文件是否存在
+    if not os.path.exists(input_image):
+        print(f"File not found: {input_image}")
+        sys.exit(1)
+    
+    # 执行抠图
+    success = remove_background(input_image, output_image)
+    
+    if success:
+        print(f"\nBackground removal completed!")
+        print(f"Original: {input_image}")
+        print(f"Result: {output_image}")
+    else:
+        print("\nBackground removal failed!")
+        sys.exit(1)
--- a/.trae/skills/image-tools/scripts/remove-watermark.js
+++ b/.trae/skills/image-tools/scripts/remove-watermark.js
@@ -0,0 +1,51 @@
+const sharp = require('sharp');
+const path = require('path');
+const fs = require('fs');
+
+const CROP_BOTTOM_HEIGHT = 300;
+
+async function removeWatermark() {
+    console.log('🖼️  开始裁剪图片水印...\n');
+    
+    const imageDir = path.join(__dirname, '产品', '飞牛 NAS', 'fyd-亚克力机箱 - 单', '详情', 'image');
+    
+    const backupDir = path.join(imageDir, 'backup');
+    
+    const imageFiles = fs.readdirSync(backupDir).filter(file => file.endsWith('.jpg'));
+    
+    console.log(`📸 找到 ${imageFiles.length} 张图片需要处理\n`);
+    console.log(`✂️  裁剪设置: 从底部裁剪 ${CROP_BOTTOM_HEIGHT}px\n`);
+    
+    for (const imageFile of imageFiles) {
+        try {
+            const backupPath = path.join(backupDir, imageFile);
+            const imagePath = path.join(imageDir, imageFile);
+            
+            console.log(`📄 正在处理: ${imageFile}`);
+            
+            const metadata = await sharp(backupPath).metadata();
+            
+            const newHeight = metadata.height - CROP_BOTTOM_HEIGHT;
+            
+            await sharp(backupPath)
+                .extract({
+                    left: 0,
+                    top: 0,
+                    width: metadata.width,
+                    height: newHeight
+                })
+                .toFile(imagePath);
+            
+            console.log(`  ✅ 已裁剪: ${metadata.width}x${metadata.height} -> ${metadata.width}x${newHeight}\n`);
+        } catch (error) {
+            console.error(`  ❌ 处理失败 ${imageFile}: ${error.message}\n`);
+        }
+    }
+    
+    console.log('✨ 所有图片处理完成！');
+}
+
+removeWatermark().catch(error => {
+    console.error('💥 处理过程出错:', error);
+    process.exit(1);
+});
--- a/.trae/skills/image-tools/scripts/render-main-image.js
+++ b/.trae/skills/image-tools/scripts/render-main-image.js
@@ -0,0 +1,58 @@
+const puppeteer = require('puppeteer');
+const path = require('path');
+const fs = require('fs');
+
+async function convertMainImageToPng() {
+    console.log('🎨 启动主图渲染工具...\n');
+    
+    const browser = await puppeteer.launch({
+        headless: 'new',
+        args: ['--no-sandbox', '--disable-setuid-sandbox']
+    });
+    
+    const page = await browser.newPage();
+    
+    await page.setViewport({ width: 800, height: 800 });
+    
+    const mainImageDir = 'G:\\stonelan-workspace\\membank\\产品\\飞牛 NAS\\fyd-亚克力机箱 - 单\\主图';
+    
+    const htmlFiles = fs.readdirSync(mainImageDir)
+        .filter(file => file.endsWith('.html'));
+    
+    console.log(`📁 找到 ${htmlFiles.length} 个主图HTML文件需要渲染\n`);
+    
+    for (const htmlFile of htmlFiles) {
+        try {
+            const htmlPath = path.join(mainImageDir, htmlFile);
+            const pngFile = htmlFile.replace('.html', '.png');
+            const pngPath = path.join(mainImageDir, pngFile);
+            
+            console.log(`📄 正在渲染: ${htmlFile}`);
+            
+            const fileUrl = `file:///${htmlPath.replace(/\\/g, '/')}`;
+            await page.goto(fileUrl, {
+                waitUntil: 'networkidle0',
+                timeout: 10000
+            });
+            
+            await page.screenshot({
+                path: pngPath,
+                fullPage: true,
+                type: 'png'
+            });
+            
+            console.log(`✅ 已生成: ${pngFile}\n`);
+        } catch (error) {
+            console.error(`❌ 渲染失败 ${htmlFile}: ${error.message}\n`);
+        }
+    }
+    
+    await browser.close();
+    
+    console.log('✨ 所有主图渲染完成！');
+}
+
+convertMainImageToPng().catch(error => {
+    console.error('💥 渲染过程出错:', error);
+    process.exit(1);
+});
--- a/.trae/skills/product-detail-designer/SKILL.md
+++ b/.trae/skills/product-detail-designer/SKILL.md
@@ -0,0 +1,88 @@
+---
+name: product-detail-designer
+description: 设计电商产品的详情页。当用户需要为产品生成详情页HTML、批量渲染SKU页面、或处理产品图片时使用此技能。
+---
+
+# Product Detail Designer
+
+## 概述
+
+根据产品的 SKU 和配置规范，生成对应的产品详情页 HTML，并转换为 PNG 图片。自动化处理从配置数据到最终展示页面的完整流程。
+
+## 使用场景
+
+- 有产品种类或 SKU 变化，需要重新生成详情页
+- 有产品图片变化，需要更新详情页
+- 需要批量为多个 SKU 生成对应的详情页
+
+## 工作流程
+
+### 步骤 1: 读取 SKU 配置
+
+从 `产品` 目录下找到对应的产品目录
+
+
+### 步骤 2: 生成 HTML 文件   
+
+#### 详情页组成部分
+- 购买须知 （不需要二级标题）
+    - 亚克力机箱需要自己组装，店铺会提供安装视频
+    - 受成本限制，产品无法做到十全十美，完美主义者慎拍
+- 配置清单
+    1. 以表格的形式展示
+    2. cpu 内存 系统盘，网口，
+    3. 内存体现容量和ddr3，内存插槽数量
+    4. 支持硬盘数量，尺寸， 容量
+- 使用场景
+   1. 手机扩容
+      照片视频备份，自动同步，远程同步
+   2. 小型办公/团队协作
+      远程文件访问，多人协作，权限分级，文件共享，文件归档，在线编辑
+   3. 监控视频存储
+      小米摄像头存储，onvif协议支持
+   4. 家庭影院打造
+      流畅播放4k视频，硬解4k
+   5. 微信聊天记录备份
+      支持微信聊天记录备份
+   6. 远程访问
+      远程访问照片，视频，文件等内容
+- 产品特点
+    1. 体积小，容量大，功能强
+    2. 低耗静音
+    3. 支持远程访问
+    4. 支持wifi联网
+    5. 来电自启
+    6. 远程开关机
+- 产品实拍图
+- 飞牛系统截图
+- 配件清单
+- 包装展示
+- 常见问题
+  
+
+- 严格按照详情页组成生成详情页，多余的删除掉
+- 需要用的产品图片，都放在对应产品目录的image目录下
+- html 按照宽1500的分辨率生成
+- 一个产品有多个sku,但一个产品只需要一个详情页，不需要为每个sku生成详情页
+- 详情页放到每个产品对应的`详情`目录下
+- 配色采用绿色清晰的风格
+
+
+
+
+### 步骤 3: HTML 转 PNG 图片
+
+使用 `image-tools` 技能的 `convert-html-to-png.js` 脚本：
+
+```bash
+cd ../image-tools/scripts
+node convert-html-to-png.js
+```
+
+### 步骤 4: 裁剪图片水印
+
+使用 `image-tools` 技能的 `remove-watermark.js` 脚本：
+
+```bash
+node remove-watermark.js
+```
--- a/.trae/skills/product-detail-designer/scripts/render.js
+++ b/.trae/skills/product-detail-designer/scripts/render.js
@@ -0,0 +1,133 @@
+const fs = require('fs');
+const path = require('path');
+
+// SKU 字段映射表
+const FIELD_MAP = {
+    '{{PRODUCT_NAME}}': 'productName',
+    '{{PRODUCT_SUBTITLE}}': 'productSubtitle',
+    '{{SKU_CODE}}': 'skuCode',
+    '{{CPU}}': 'cpu',
+    '{{MEMORY}}': 'memory',
+    '{{STORAGE}}': 'storage',
+    '{{CASE}}': 'case',
+    '{{POWER}}': 'power',
+    '{{CABLE}}': 'cable',
+    '{{BATTERY}}': 'battery',
+    '{{ETHERNET_CABLE}}': 'ethernetCable',
+    '{{SHIPPING_FEE}}': 'shippingFee',
+    '{{PACKAGING_FEE}}': 'packagingFee',
+    '{{ASSEMBLY_FEE}}': 'assemblyFee',
+    '{{TOTAL_COST}}': 'totalCost',
+    '{{RETAIL_PRICE}}': 'retailPrice',
+    '{{NOTE}}': 'note'
+};
+
+// 从 SKU markdown 文件解析字段
+function parseSkuFile(skuPath) {
+    const content = fs.readFileSync(skuPath, 'utf-8');
+    const data = {};
+
+    content.split('\n').forEach(line => {
+        // 匹配格式: | **字段名** | 值 | 价格 |
+        const match = line.match(/\|\s*\*\*(.+?)\*\*\s*\|\s*(.+?)\s*\|/);
+        if (match) {
+            const [, fieldName, value] = match;
+            data[fieldName.trim()] = value.trim();
+        }
+    });
+
+    return data;
+}
+
+// 将 SKU 数据映射为模板变量
+function mapSkuToVariables(skuData) {
+    const cpu = skuData['CPU'] || '';
+    const memory = skuData['内存'] || '';
+    const storage = skuData['系统盘'] || '';
+    const caseType = skuData['机箱'] || '';
+
+    return {
+        '{{PRODUCT_NAME}}': `飞牛NAS ${caseType}`,
+        '{{PRODUCT_SUBTITLE}}': '亚克力机箱 透明系列',
+        '{{SKU_CODE}}': skuData['产品型号'] || '',
+        '{{CPU}}': cpu,
+        '{{MEMORY}}': memory,
+        '{{STORAGE}}': storage,
+        '{{CASE}}': caseType,
+        '{{POWER}}': skuData['电源'] || '电源-60W',
+        '{{CABLE}}': skuData['硬盘线'] || '硬盘线-单',
+        '{{BATTERY}}': skuData['电池'] || '电池',
+        '{{ETHERNET_CABLE}}': skuData['网线'] || '网线',
+        '{{SHIPPING_FEE}}': skuData['运费']?.replace('¥', '') || '10',
+        '{{PACKAGING_FEE}}': skuData['包装费']?.replace('¥', '') || '5',
+        '{{ASSEMBLY_FEE}}': skuData['装机费']?.replace('¥', '') || '10',
+        '{{TOTAL_COST}}': skuData['总成本']?.replace('¥', '') || '0',
+        '{{RETAIL_PRICE}}': skuData['建议零售价']?.replace('¥', '') || '0',
+        '{{NOTE}}': skuData['备注'] || ''
+    };
+}
+
+// 渲染 HTML 模板
+function renderTemplate(templatePath, variables) {
+    let html = fs.readFileSync(templatePath, 'utf-8');
+
+    Object.entries(variables).forEach(([placeholder, value]) => {
+        html = html.split(placeholder).join(value);
+    });
+
+    return html;
+}
+
+// 主函数：生成亚克力单详情页
+function generateDetailPages(skuFilePath, outputDir) {
+    const skuData = parseSkuFile(skuFilePath);
+    const variables = mapSkuToVariables(skuData);
+
+    const skuCode = variables['{{SKU_CODE}}'];
+    const productType = '亚克力单';
+    const templateDir = path.join(__dirname, '..', 'assets', 'templates', productType);
+
+    // 创建输出目录
+    const productOutputDir = path.join(outputDir, skuCode);
+    if (!fs.existsSync(productOutputDir)) {
+        fs.mkdirSync(productOutputDir, { recursive: true });
+    }
+
+    // 模板列表
+    const templates = [
+        '配置清单-1.html',
+        '配置清单-2.html',
+        '商品卖点.html',
+        '功能描述.html',
+        '使用场景.html',
+        '配件清单.html',
+        '包装展示.html'
+    ];
+
+    templates.forEach(template => {
+        const templatePath = path.join(templateDir, template);
+        if (!fs.existsSync(templatePath)) {
+            console.log(`跳过（模板不存在）: ${template}`);
+            return;
+        }
+
+        const html = renderTemplate(templatePath, variables);
+        const outputPath = path.join(productOutputDir, template);
+        fs.writeFileSync(outputPath, html, 'utf-8');
+        console.log(`已生成: ${outputPath}`);
+    });
+
+    console.log(`\n完成！共生成 ${templates.length} 个 HTML 文件到: ${productOutputDir}`);
+}
+
+// 使用示例
+const skuFile = process.argv[2];
+const outputDir = process.argv[3] || path.join(__dirname, '..', '..', '..', '产品', '飞牛 NAS', 'fyd-亚克力机箱 - 单', '详情');
+
+if (!skuFile) {
+    console.log('用法: node render.js <sku文件路径> [输出目录]');
+    console.log('示例: node render.js ../产品/飞牛NAS/fyd-亚克力机箱 - 单/sku/亚克力-单-AMD-A4-2G-16G.md');
+    process.exit(1);
+}
+
+generateDetailPages(skuFile, outputDir);
--- a/.trae/skills/product-main-image/SKILL.md
+++ b/.trae/skills/product-main-image/SKILL.md
@@ -0,0 +1,49 @@
+---
+name: product-main-image
+description: 设计电商产品的主图。当用户需要为产品生成主图图片或海报时使用此技能。
+---
+
+# 商品主图设计
+
+## 概述
+
+-为每个产品生成主图图片
+-主图图片放到每个产品对应的`主图`目录下
+## 使用场景
+
+- 有产品主图需要更新
+
+## 工作流程
+
+### 步骤 1: 准备素材
+- 根据产品详情页，归纳出主图要展示的信息
+
+- 可以使用产品目录下`image`目录中的图片作为素材
+
+
+
+### 步骤 2: 设计主图html
+- 主图尺寸：1000*1000
+- 一个主图一个html
+
+
+### 步骤 3: 导出图片
+
+使用 `image-tools` 技能的 `convert-html-to-png.js` 脚本：
+
+## 主图规范
+
+
+
+## 配色参考
+
+
+
+## 字体规范
+
+
+
+## 示例模板
+
+
+
--- a/.trae/skills/sku-designer/SKILL.md
+++ b/.trae/skills/sku-designer/SKILL.md
@@ -0,0 +1,81 @@
+---
+name: sku-designer
+description: 设计电商产品的 SKU 配置。当用户需要为产品生成 SKU 配置时使用此技能。
+---
+
+# SKU 设计
+
+## Overview
+
+- 为每个产品生成 SKU 配置
+- 将 SKU 配置放到每个产品对应的 `SKU` 目录下
+
+## SKU 编码规则
+
+- 按照 [系统]-[机箱]-[盘位]-[wifi/有]-[cpu]-[内存]-[硬盘] 规则生成sku名称
+- 每个字段之间用短横线连接，字段用简称，如：win-3.5-4-w-i3-8g-128g
+
+
+## 设计流程
+
+### 步骤1. 更新对应产品的sku，根据设计原则添加或者删除sku
+- 根据对应机箱设计原则，选择cpu，内存，硬盘
+- 按照SKU编码规则生成SKU名称
+- 将SKU配置保存到对应产品目录下的`SKU`文件夹    
+
+### 步骤2 计算与核对产品价格
+- 根据配件清单，计算产品价格
+- 计算价格必须使用计算工具计算
+
+### 步骤3 更新产品信息
+
+- 更新产品信息到产品信息汇总表
+
+
+##  飞牛 NAS产设计原则
+### 3.5金属大配置原则
+-   3.5金属大，用于3盘位和4盘位，通过双sata转化器，主板单sata口就是3盘位，主板双sata口就是4盘位
+-   3.5金属大可安装cpu:j1900,j3160，i3-3217u,i3-5005u,3855u,1037u
+-   3.5金属大可安装内存和系统盘：  4G-32G，4G-64G，8G-64G，8G-128G
+### 3.5金属小配置原则
+-   3.5金属小可安装cpu:j1900,j3160，i3-3217u,i3-5005u,3855u,1037u
+-   3.5金属小，可安装一个2.5和一个3.5，配单sata口主板就是单3.5 ，双sata口主板就是 3.5+2.5
+-   3.5金属小可安装内存和系统盘：  4G-32G，4G-64G，8G-64G，8G-128G
+### 亚克力机箱-单 配置原则
+- 可安装单SATA口主板
+- 可用CPU：N2840，N2930，AMD-A4，J1900，J3160
+- 可用内存：2G-16G，2G-32G，4G-64G，4G-128G
+#### 
+推荐价格：
+- 配2G内存的成本加20作为推荐售价
+- 配4G内存的成本加30作为推荐售价
+
+### 亚克力机箱-双 配置原则
+- 可安装双SATA口主板
+- 可用CPU：1037U，i3-3217U，i3-5005U
+- 可用内存：2G-16G，2G-32G，4G-64G，4G-128G,8G-128G
+## win 小主机产设计原则
+-  win小主机全部使用2.5存机箱
+### 龙虾盒子 
+- cpu 可使用：i3-5005u,3855u
+- 内存硬盘可使用：4G-64G,4G-128G,8G-128G
+- 标配无线网卡
+- 可以选装hd500G硬盘
+### win10 小主机
+- cpu 可使用：1037u,i3-3217u,i3-5005u,3855u
+- 内存硬盘可使用：4G-64G,4G-128G,8G-128G
+- 可选无线网卡
+- 可以选装hd500G硬盘
+### 挂机宝
+- 分为一拖一，和一拖三两种
+#### 一拖一
+- 可选cpu：1037u,i3-3217u,i3-5005u,3855u
+- 可选内存-系统盘：4G-64G,4G-128G,8G-128G
+- 可选硬盘：hd500G
+- 使用2.5 金属机箱
+- 可选无线网卡
+#### 一拖三
+- 可选cpu：1037u,i3-3217u,i3-5005u,3855u
+- 可选内存-系统盘：4G-64G,4G-128G,8G-128G
+- 使用一拖三亚克力机箱
+- 可选无线网卡
--- a/.trae/skills/sku-designer/scripts/batch-update-sku.js
+++ b/.trae/skills/sku-designer/scripts/batch-update-sku.js
@@ -0,0 +1,56 @@
+const fs = require('fs');
+const path = require('path');
+
+const skuDir = path.join(__dirname, '../../产品/飞牛 NAS/fyd-亚克力机箱 - 单/sku');
+
+const FIXED_COST = 42 + 12 + 4 + 1 + 1 + 10 + 5 + 10;
+
+const CPU_PRICES = { 'N2840': 45, 'N2930': 50, 'AMD-A4': 45, 'J1900': 80, 'J3160': 90 };
+const MEMORY_COST = {
+  '2G-16G': { ram: 13, disk: 15 },
+  '2G-32G': { ram: 13, disk: 20 },
+  '4G-64G': { ram: 25, disk: 40 },
+  '4G-128G': { ram: 25, disk: 68 }
+};
+
+const files = fs.readdirSync(skuDir).filter(f => f.endsWith('.md'));
+
+files.forEach(file => {
+  const filePath = path.join(skuDir, file);
+  let content = fs.readFileSync(filePath, 'utf-8');
+  
+  // 解析: 亚克力-单-{CPU}-{MEM}.md
+  // CPU可能是AMD-A4这样的组合
+  const match = file.match(/亚克力-单-([A-Z0-9-]+)-(\d+G)-(\d+G)\.md/);
+  if (!match) {
+    console.log(`Skipped: ${file} (no match)`);
+    return;
+  }
+  
+  const cpu = match[1];
+  const mem = match[2] + '-' + match[3];
+  
+  console.log(`Processing: ${file} - CPU: ${cpu}, Mem: ${mem}`);
+  
+  const cpuCost = CPU_PRICES[cpu];
+  const ramCost = MEMORY_COST[mem].ram;
+  const diskCost = MEMORY_COST[mem].disk;
+  const totalCost = FIXED_COST + cpuCost + ramCost + diskCost;
+  const price = Math.round(totalCost * 1.3);
+  
+  const skuName = `亚克力-单-${cpu}-${mem}`;
+  content = content.replace(/\| \*\*产品型号\*\* \| [^|]+ \|/, `| **产品型号** | ${skuName} |`);
+  content = content.replace(/\| \*\*CPU\*\* \| [^|]+ \| ¥\d+ \|/, `| **CPU** | ${cpu} | ¥${cpuCost} |`);
+  
+  const ramName = mem.includes('4G') ? 'D3-4G' : 'D3-2G';
+  const diskName = mem.includes('128G') ? 'mSATA-128G' : (mem.includes('32G') ? 'mSATA-32G' : 'mSATA-16G');
+  content = content.replace(/\| \*\*内存\*\* \| D3-\dG \| ¥\d+ \|/, `| **内存** | ${ramName} | ¥${ramCost} |`);
+  content = content.replace(/\| \*\*系统盘\*\* \| mSATA-\d+G \| ¥\d+ \|/, `| **系统盘** | ${diskName} | ¥${diskCost} |`);
+  content = content.replace(/\| \*\*总成本\*\* \| - \| ¥\d+ \|/, `| **总成本** | - | ¥${totalCost} |`);
+  content = content.replace(/\| \*\*建议零售价\*\* \| - \| ¥\d+ \|/, `| **建议零售价** | - | ¥${price} |`);
+  
+  fs.writeFileSync(filePath, content, 'utf-8');
+  console.log(`  -> 成本: ¥${totalCost}, 售价: ¥${price}`);
+});
+
+console.log(`\n完成! 共处理 ${files.length} 个文件`);
--- a/.trae/skills/sku-designer/scripts/sku-results.json
+++ b/.trae/skills/sku-designer/scripts/sku-results.json
@@ -0,0 +1,142 @@
+[
+  {
+    "index": 1,
+    "sku": "亚克力 - 单-N2840-2G-16G",
+    "cost": 158,
+    "price": 205,
+    "profit": 47
+  },
+  {
+    "index": 2,
+    "sku": "亚克力 - 单-N2840-2G-32G",
+    "cost": 163,
+    "price": 212,
+    "profit": 49
+  },
+  {
+    "index": 3,
+    "sku": "亚克力 - 单-N2840-4G-64G",
+    "cost": 195,
+    "price": 254,
+    "profit": 59
+  },
+  {
+    "index": 4,
+    "sku": "亚克力 - 单-N2840-4G-128G",
+    "cost": 223,
+    "price": 290,
+    "profit": 67
+  },
+  {
+    "index": 5,
+    "sku": "亚克力 - 单-N2930-2G-16G",
+    "cost": 163,
+    "price": 212,
+    "profit": 49
+  },
+  {
+    "index": 6,
+    "sku": "亚克力 - 单-N2930-2G-32G",
+    "cost": 168,
+    "price": 218,
+    "profit": 50
+  },
+  {
+    "index": 7,
+    "sku": "亚克力 - 单-N2930-4G-64G",
+    "cost": 200,
+    "price": 260,
+    "profit": 60
+  },
+  {
+    "index": 8,
+    "sku": "亚克力 - 单-N2930-4G-128G",
+    "cost": 228,
+    "price": 296,
+    "profit": 68
+  },
+  {
+    "index": 9,
+    "sku": "亚克力 - 单-AMD-A4-2G-16G",
+    "cost": 158,
+    "price": 205,
+    "profit": 47
+  },
+  {
+    "index": 10,
+    "sku": "亚克力 - 单-AMD-A4-2G-32G",
+    "cost": 163,
+    "price": 212,
+    "profit": 49
+  },
+  {
+    "index": 11,
+    "sku": "亚克力 - 单-AMD-A4-4G-64G",
+    "cost": 195,
+    "price": 254,
+    "profit": 59
+  },
+  {
+    "index": 12,
+    "sku": "亚克力 - 单-AMD-A4-4G-128G",
+    "cost": 223,
+    "price": 290,
+    "profit": 67
+  },
+  {
+    "index": 13,
+    "sku": "亚克力 - 单-J1900-2G-16G",
+    "cost": 193,
+    "price": 251,
+    "profit": 58
+  },
+  {
+    "index": 14,
+    "sku": "亚克力 - 单-J1900-2G-32G",
+    "cost": 198,
+    "price": 257,
+    "profit": 59
+  },
+  {
+    "index": 15,
+    "sku": "亚克力 - 单-J1900-4G-64G",
+    "cost": 230,
+    "price": 299,
+    "profit": 69
+  },
+  {
+    "index": 16,
+    "sku": "亚克力 - 单-J1900-4G-128G",
+    "cost": 258,
+    "price": 335,
+    "profit": 77
+  },
+  {
+    "index": 17,
+    "sku": "亚克力 - 单-J3160-2G-16G",
+    "cost": 203,
+    "price": 264,
+    "profit": 61
+  },
+  {
+    "index": 18,
+    "sku": "亚克力 - 单-J3160-2G-32G",
+    "cost": 208,
+    "price": 270,
+    "profit": 62
+  },
+  {
+    "index": 19,
+    "sku": "亚克力 - 单-J3160-4G-64G",
+    "cost": 240,
+    "price": 312,
+    "profit": 72
+  },
+  {
+    "index": 20,
+    "sku": "亚克力 - 单-J3160-4G-128G",
+    "cost": 268,
+    "price": 348,
+    "profit": 80
+  }
+]
--- a/.trae/skills/sku-designer/scripts/update-sku-prices.js
+++ b/.trae/skills/sku-designer/scripts/update-sku-prices.js
@@ -0,0 +1,58 @@
+// SKU价格计算工具
+// 亚克力-单 固定配件成本
+const FIXED_COST = 42 + 12 + 4 + 1 + 1 + 10 + 5 + 10; // 机箱+电源+硬盘线+电池+网线+运费+包装+装机 = 85
+
+// 配件价格（来自配件清单）
+const CPU_PRICES = {
+  'N2840': 45,
+  'N2930': 50,
+  'AMD-A4': 45,
+  'J1900': 80,
+  'J3160': 90
+};
+
+const MEMORY_PRICES = {
+  '2G-16G': { ram: 13, disk: 15 },   // D3-2G + mSATA-16G
+  '2G-32G': { ram: 13, disk: 20 },   // D3-2G + mSATA-32G
+  '4G-64G': { ram: 25, disk: 40 },   // D3-4G + mSATA-64G
+  '4G-128G': { ram: 25, disk: 68 }    // D3-4G + mSATA-128G
+};
+
+const CPUS = ['N2840', 'N2930', 'AMD-A4', 'J1900', 'J3160'];
+const MEMORIES = ['2G-16G', '2G-32G', '4G-64G', '4G-128G'];
+
+console.log('=== 亚克力-单 SKU 价格计算 ===\n');
+
+let results = [];
+let index = 1;
+
+CPUS.forEach(cpu => {
+  MEMORIES.forEach(mem => {
+    const cpuCost = CPU_PRICES[cpu];
+    const ramCost = MEMORY_PRICES[mem].ram;
+    const diskCost = MEMORY_PRICES[mem].disk;
+    const totalCost = FIXED_COST + cpuCost + ramCost + diskCost;
+    const price = Math.round(totalCost * 1.3);
+    const profit = price - totalCost;
+    
+    const sku = `亚克力 - 单-${cpu}-${mem}`;
+    results.push({ index, sku, cost: totalCost, price, profit });
+    
+    console.log(`${index}. ${sku}`);
+    console.log(`   CPU(${cpu}): ¥${cpuCost} + 内存: ¥${ramCost} + 系统盘: ¥${diskCost} + 固定: ¥${FIXED_COST}`);
+    console.log(`   成本: ¥${totalCost} | 售价: ¥${price} | 利润: ¥${profit}\n`);
+    
+    index++;
+  });
+});
+
+// 输出汇总表格式的数据
+console.log('\n=== 汇总表更新数据 ===');
+results.forEach(r => {
+  console.log(`| ${r.index} | ${r.sku} | ¥${r.cost} | ¥${r.price} | ¥${r.profit} | 30% |`);
+});
+
+// 导出JSON供后续使用
+const fs = require('fs');
+fs.writeFileSync('./sku-results.json', JSON.stringify(results, null, 2));
+console.log('\n已导出计算结果到 sku-results.json');