更新产品配置和技能定义

.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 依赖配置

.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);
+});

.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);
+});

.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);
+});

.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"
+  }
+}

.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)

.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);
+});

.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);
+});