소스 검색

Update project configuration and assets

- Added new icon paths for the Electron application to support custom icons.
- Updated package.json to include a script for generating icons.
- Enhanced .gitignore to exclude the new 'matrix' directory.
- Improved README.md with a logo for better branding.
Ethanfly 18 시간 전
부모
커밋
495fc64667

+ 3 - 0
.gitignore

@@ -45,3 +45,6 @@ coverage/
 # Playwright
 playwright-report/
 test-results/
+
+# Matrix
+matrix/

+ 5 - 1
README.md

@@ -1,4 +1,8 @@
-# 🎬 多平台媒体管理系统
+# 多平台媒体管理系统
+
+<p align="center">
+  <img src="./docs/logo.png" width="128" height="128" alt="Logo">
+</p>
 
 <p align="center">
   <b>一个功能强大的多自媒体平台账号管理系统</b><br>

+ 8 - 2
client/electron-builder.json

@@ -9,6 +9,12 @@
     "dist/**/*",
     "dist-electron/**/*"
   ],
+  "extraResources": [
+    {
+      "from": "public/icons",
+      "to": "icons"
+    }
+  ],
   "win": {
     "target": [
       {
@@ -16,7 +22,7 @@
         "arch": ["x64"]
       }
     ],
-    "icon": "build/icon.ico",
+    "icon": "build/icon.png",
     "artifactName": "${productName}-${version}-${arch}.${ext}"
   },
   "nsis": {
@@ -28,7 +34,7 @@
   },
   "mac": {
     "target": ["dmg"],
-    "icon": "build/icon.icns",
+    "icon": "build/icon.png",
     "artifactName": "${productName}-${version}.${ext}"
   },
   "linux": {

+ 11 - 15
client/electron/main.ts

@@ -12,25 +12,21 @@ const VITE_DEV_SERVER_URL = process.env.VITE_DEV_SERVER_URL;
 // 获取图标路径
 function getIconPath() {
   return VITE_DEV_SERVER_URL 
-    ? join(__dirname, '../public/favicon.svg')
-    : join(__dirname, '../dist/favicon.svg');
+    ? join(__dirname, '../public/icons/icon-256.png')
+    : join(__dirname, '../dist/icons/icon-256.png');
+}
+
+// 获取托盘图标路径
+function getTrayIconPath() {
+  return VITE_DEV_SERVER_URL 
+    ? join(__dirname, '../public/icons/tray-icon.png')
+    : join(__dirname, '../dist/icons/tray-icon.png');
 }
 
 // 创建托盘图标
 function createTrayIcon(): typeof nativeImage.prototype {
-  // 创建一个简单的蓝色图标作为托盘图标
-  // 由于 SVG 在某些系统上可能不支持,这里使用 data URL 创建图标
-  const iconSize = 16;
-  const canvas = `
-    <svg xmlns="http://www.w3.org/2000/svg" width="${iconSize}" height="${iconSize}" viewBox="0 0 512 512">
-      <rect x="32" y="32" width="448" height="448" rx="96" fill="#4f8cff"/>
-      <circle cx="256" cy="256" r="100" fill="#fff"/>
-      <path d="M 228 190 L 228 322 L 330 256 Z" fill="#4f8cff"/>
-    </svg>
-  `;
-  
-  const dataUrl = `data:image/svg+xml;base64,${Buffer.from(canvas).toString('base64')}`;
-  return nativeImage.createFromDataURL(dataUrl);
+  const trayIconPath = getTrayIconPath();
+  return nativeImage.createFromPath(trayIconPath);
 }
 
 // 创建系统托盘

+ 13 - 5
client/package.json

@@ -10,7 +10,8 @@
     "preview": "vite preview",
     "electron:dev": "vite --mode electron",
     "electron:build": "vite build && electron-builder",
-    "lint": "eslint src --ext .ts,.vue"
+    "lint": "eslint src --ext .ts,.vue",
+    "generate-icons": "node scripts/generate-icons.js"
   },
   "dependencies": {
     "@media-manager/shared": "workspace:*",
@@ -42,7 +43,8 @@
     "eslint": "^8.56.0",
     "@typescript-eslint/eslint-plugin": "^6.18.0",
     "@typescript-eslint/parser": "^6.18.0",
-    "eslint-plugin-vue": "^9.20.0"
+    "eslint-plugin-vue": "^9.20.0",
+    "sharp": "^0.34.5"
   },
   "build": {
     "appId": "com.media-manager.app",
@@ -54,17 +56,23 @@
       "dist/**/*",
       "dist-electron/**/*"
     ],
+    "extraResources": [
+      {
+        "from": "public/icons",
+        "to": "icons"
+      }
+    ],
     "win": {
       "target": ["nsis", "portable"],
-      "icon": "public/icon.ico"
+      "icon": "build/icon.png"
     },
     "mac": {
       "target": ["dmg", "zip"],
-      "icon": "public/icon.icns"
+      "icon": "build/icon.png"
     },
     "linux": {
       "target": ["AppImage", "deb"],
-      "icon": "public/icon.png"
+      "icon": "build/icon.png"
     },
     "nsis": {
       "oneClick": false,

BIN
client/public/icons/icon-128.png


BIN
client/public/icons/icon-16.png


BIN
client/public/icons/icon-24.png


BIN
client/public/icons/icon-256.png


BIN
client/public/icons/icon-32.png


BIN
client/public/icons/icon-48.png


BIN
client/public/icons/icon-512.png


BIN
client/public/icons/icon-64.png


BIN
client/public/icons/logo.png


BIN
client/public/icons/tray-icon.png


BIN
client/public/icons/tray-icon@2x.png


+ 101 - 0
client/scripts/generate-icons.js

@@ -0,0 +1,101 @@
+/**
+ * 图标生成脚本
+ * 从 SVG 生成各种尺寸的 PNG 图标
+ * 
+ * 使用方法:
+ *   cd client
+ *   npm install sharp --save-dev
+ *   node scripts/generate-icons.js
+ */
+
+const fs = require('fs');
+const path = require('path');
+
+// 检查是否安装了 sharp
+let sharp;
+try {
+  sharp = require('sharp');
+} catch (e) {
+  console.error('请先安装 sharp: npm install sharp --save-dev');
+  process.exit(1);
+}
+
+const SVG_PATH = path.join(__dirname, '../public/favicon.svg');
+const OUTPUT_DIR = path.join(__dirname, '../public/icons');
+const BUILD_DIR = path.join(__dirname, '../build');
+
+// 需要生成的图标尺寸
+const ICON_SIZES = {
+  // 应用图标
+  'icon-16.png': 16,
+  'icon-24.png': 24,
+  'icon-32.png': 32,
+  'icon-48.png': 48,
+  'icon-64.png': 64,
+  'icon-128.png': 128,
+  'icon-256.png': 256,
+  'icon-512.png': 512,
+  
+  // 托盘图标 (Windows 需要 16x16 或 32x32)
+  'tray-icon.png': 32,
+  'tray-icon@2x.png': 64,
+  
+  // README logo
+  'logo.png': 128,
+};
+
+async function generateIcons() {
+  // 确保输出目录存在
+  if (!fs.existsSync(OUTPUT_DIR)) {
+    fs.mkdirSync(OUTPUT_DIR, { recursive: true });
+  }
+  if (!fs.existsSync(BUILD_DIR)) {
+    fs.mkdirSync(BUILD_DIR, { recursive: true });
+  }
+
+  // 读取 SVG 文件
+  const svgBuffer = fs.readFileSync(SVG_PATH);
+
+  console.log('开始生成图标...\n');
+
+  // 生成各尺寸 PNG
+  for (const [filename, size] of Object.entries(ICON_SIZES)) {
+    const outputPath = path.join(OUTPUT_DIR, filename);
+    
+    await sharp(svgBuffer)
+      .resize(size, size)
+      .png()
+      .toFile(outputPath);
+    
+    console.log(`✓ ${filename} (${size}x${size})`);
+  }
+
+  // 复制主图标到 build 目录
+  const icon256Path = path.join(OUTPUT_DIR, 'icon-256.png');
+  const buildIconPath = path.join(BUILD_DIR, 'icon.png');
+  fs.copyFileSync(icon256Path, buildIconPath);
+  console.log(`\n✓ 复制 icon.png 到 build 目录`);
+
+  // 复制 logo 到根目录用于 README
+  const logoPath = path.join(OUTPUT_DIR, 'logo.png');
+  const readmeLogoPath = path.join(__dirname, '../../docs/logo.png');
+  const docsDir = path.join(__dirname, '../../docs');
+  if (!fs.existsSync(docsDir)) {
+    fs.mkdirSync(docsDir, { recursive: true });
+  }
+  fs.copyFileSync(logoPath, readmeLogoPath);
+  console.log(`✓ 复制 logo.png 到 docs 目录`);
+
+  console.log('\n图标生成完成!');
+  console.log('\n生成的文件:');
+  console.log(`  - client/public/icons/ (应用图标)`);
+  console.log(`  - client/build/icon.png (打包用图标)`);
+  console.log(`  - docs/logo.png (README logo)`);
+  
+  console.log('\n下一步:');
+  console.log('  1. 使用在线工具将 icon-256.png 转换为 icon.ico (Windows)');
+  console.log('     推荐: https://convertio.co/png-ico/');
+  console.log('  2. 将生成的 icon.ico 放到 client/build/ 目录');
+}
+
+generateIcons().catch(console.error);

BIN
docs/logo.png