104 lines
4.6 KiB
JavaScript
104 lines
4.6 KiB
JavaScript
/* 提取「员工内部移动办公 APP」候选图标 → 透明底预览页 */
|
|
const fs = require('fs');
|
|
const SRC = 'd:/SGP_KF/DrawLogo/js/data/sources/';
|
|
const OUT = 'd:/SGP_KF/DrawLogo/_app-icon-pick.html';
|
|
|
|
const STROKE = new Set(['feather', 'lucide', 'tabler']);
|
|
const NEG_RE = /(^|[-_])?(off|alert|error|forbidden|ban|slash|remove|disabled|cross|minus)([-_]|$)/i;
|
|
const COLOR = '#FF6900'; // 小米橙
|
|
|
|
function loadSource(id) {
|
|
const code = fs.readFileSync(SRC + id + '.js', 'utf8');
|
|
const win = {};
|
|
new Function('window', code)(win);
|
|
return win['HGB_Source_' + id].icons;
|
|
}
|
|
|
|
// 候选：意象 → (源, 备选名[]) ，按序取第一个存在且无负面命名的图标
|
|
const CANDS = [
|
|
{ label: '纯手机（实心）', src: 'mdi', names: ['cellphone'] },
|
|
{ label: '纯手机（线条）', src: 'lucide', names: ['smartphone'] },
|
|
{ label: '手机+对勾（办结）', src: 'mdi', names: ['cellphone-check'] },
|
|
{ label: '手机+齿轮（设置）', src: 'mdi', names: ['cellphone-cog'] },
|
|
{ label: '手机+聊天（沟通）', src: 'mdi', names: ['cellphone-message'] },
|
|
{ label: '手机+声波（通知）', src: 'mdi', names: ['cellphone-sound'] },
|
|
{ label: '手机+消息（线条）', src: 'tabler', names: ['device-mobile-message'] },
|
|
{ label: '手机+搜索', src: 'tabler', names: ['device-mobile-search'] },
|
|
{ label: '手机+星标', src: 'tabler', names: ['device-mobile-star'] },
|
|
{ label: '手机+闪电', src: 'lucide', names: ['smartphone-charging'] },
|
|
];
|
|
|
|
const cache = {};
|
|
function find(src, names) {
|
|
if (!cache[src]) cache[src] = loadSource(src);
|
|
for (const n of names) {
|
|
const hit = cache[src].find(ic => ic.name === n && !NEG_RE.test(ic.name) && /^\s*<svg/.test(ic.svg) === false && ic.svg.trim());
|
|
if (hit) return hit;
|
|
// 名称可能带数字后缀等，放宽为前缀匹配
|
|
const hit2 = cache[src].find(ic => ic.name.startsWith(n) && (ic.name.length === n.length || /[-_0-9]/.test(ic.name[n.length] || '')) && !NEG_RE.test(ic.name));
|
|
if (hit2) return hit2;
|
|
}
|
|
return null;
|
|
}
|
|
|
|
function wrap(ic, src) {
|
|
const stroke = STROKE.has(src);
|
|
const attrs = stroke
|
|
? 'fill="none" stroke="' + COLOR + '" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"'
|
|
: 'fill="' + COLOR + '"';
|
|
return '<svg viewBox="0 0 24 24" ' + attrs + '>' + ic.svg + '</svg>';
|
|
}
|
|
|
|
const hits = [];
|
|
for (const c of CANDS) {
|
|
const ic = find(c.src, c.names);
|
|
if (!ic) { console.log('未命中:', c.label, c.src, c.names.join('/')); continue; }
|
|
hits.push({ label: c.label, src: c.src, name: ic.name, svg: wrap(ic, c.src) });
|
|
console.log('命中:', c.label, '→', c.src + ':' + ic.name);
|
|
}
|
|
console.log('命中总数:', hits.length, '/', CANDS.length);
|
|
|
|
if (hits.length < 10) { console.error('候选不足 10，中止生成'); process.exit(1); }
|
|
hits.length = 10;
|
|
|
|
const cards = hits.map((h, i) => `
|
|
<div class="card">
|
|
<div class="stage">${h.svg}</div>
|
|
<div class="cap"><b>${i + 1}</b> ${h.label}</div>
|
|
<div class="meta">${h.src}:${h.name}</div>
|
|
</div>`).join('\n');
|
|
|
|
const html = `<!DOCTYPE html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>手机样式图标候选 · 小米橙 · 透明底</title>
|
|
<style>
|
|
* { margin: 0; padding: 0; box-sizing: border-box; }
|
|
body { font-family: "PingFang SC", "Microsoft YaHei", sans-serif; background: #fff; color: #111; padding: 28px; }
|
|
h1 { font-size: 18px; margin-bottom: 4px; }
|
|
p.tip { font-size: 13px; color: #6b7280; margin-bottom: 20px; }
|
|
.grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 14px; }
|
|
.card { border: 1px solid #e5e7eb; border-radius: 10px; overflow: hidden; background: #fff; }
|
|
.stage {
|
|
height: 120px; display: flex; align-items: center; justify-content: center;
|
|
background-image:
|
|
linear-gradient(45deg, #f1f5f9 25%, transparent 25%, transparent 75%, #f1f5f9 75%),
|
|
linear-gradient(45deg, #f1f5f9 25%, #fff 25%, #fff 75%, #f1f5f9 75%);
|
|
background-size: 16px 16px; background-position: 0 0, 8px 8px; /* 棋盘格 = 透明区域示意，非底色 */
|
|
}
|
|
.stage svg { width: 72px; height: 72px; display: block; }
|
|
.cap { font-size: 13px; padding: 8px 10px 2px; }
|
|
.meta { font-size: 11px; color: #9ca3af; padding: 0 10px 8px; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<h1>手机样式 App 图标候选 · 小米橙 #FF6900（透明底，棋盘区域 = 透明）</h1>
|
|
<p class="tip">10 个候选，挑好后把编号发我。小米橙渲染，可再微调。</p>
|
|
<div class="grid">${cards}</div>
|
|
</body>
|
|
</html>`;
|
|
|
|
fs.writeFileSync(OUT, html, 'utf8');
|
|
console.log('已生成:', OUT, '(' + (fs.statSync(OUT).size / 1024).toFixed(1) + ' KB)');
|