marketing_mini_app/scripts/gen-tabbar-icons.mjs

/**
 * 生成 81×81 TabBar PNG 图标（透明底，适合微信小程序）
 * 用法：node scripts/gen-tabbar-icons.mjs
 */
import fs from 'node:fs'
import path from 'node:path'
import { fileURLToPath } from 'node:url'
import sharp from 'sharp'

const __dirname = path.dirname(fileURLToPath(import.meta.url))
const outDir = path.resolve(__dirname, '../src/static/tabbar')

const GRAY = '#8C7B6A'
const ORANGE = '#FF6B35'

function svgIcon(type, color) {
  if (type === 'home') {
    return `<svg width="81" height="81" xmlns="http://www.w3.org/2000/svg">
      <path d="M40.5 18 L62 34 V62 H52 V44 H29 V62 H19 V34 Z" fill="none" stroke="${color}" stroke-width="4" stroke-linejoin="round"/>
    </svg>`
  }
  if (type === 'scan') {
    return `<svg width="81" height="81" xmlns="http://www.w3.org/2000/svg">
      <rect x="18" y="18" width="45" height="45" rx="6" fill="none" stroke="${color}" stroke-width="4"/>
      <rect x="24" y="24" width="10" height="10" fill="${color}"/>
      <rect x="47" y="24" width="10" height="10" fill="${color}"/>
      <rect x="24" y="47" width="10" height="10" fill="${color}"/>
      <rect x="41" y="41" width="8" height="8" fill="${color}"/>
      <rect x="47" y="47" width="10" height="10" fill="${color}"/>
    </svg>`
  }
  if (type === 'coupon') {
    return `<svg width="81" height="81" xmlns="http://www.w3.org/2000/svg">
      <rect x="16" y="24" width="49" height="33" rx="6" fill="none" stroke="${color}" stroke-width="4"/>
      <circle cx="16" cy="40.5" r="5" fill="#FFF9F3" stroke="${color}" stroke-width="3"/>
      <circle cx="65" cy="40.5" r="5" fill="#FFF9F3" stroke="${color}" stroke-width="3"/>
      <line x1="28" y1="40" x2="53" y2="40" stroke="${color}" stroke-width="3" stroke-linecap="round"/>
    </svg>`
  }
  return `<svg width="81" height="81" xmlns="http://www.w3.org/2000/svg">
    <circle cx="40.5" cy="32" r="12" fill="none" stroke="${color}" stroke-width="4"/>
    <path d="M20 62 C20 50 58 50 61 62" fill="none" stroke="${color}" stroke-width="4" stroke-linecap="round"/>
  </svg>`
}

async function writeIcon(name, type, color) {
  const svg = svgIcon(type, color)
  const buf = await sharp(Buffer.from(svg)).png().toBuffer()
  fs.writeFileSync(path.join(outDir, name), buf)
}

async function main() {
  fs.mkdirSync(outDir, { recursive: true })
  const items = [
    ['home.png', 'home', GRAY],
    ['home-active.png', 'home', ORANGE],
    ['scan.png', 'scan', GRAY],
    ['scan-active.png', 'scan', ORANGE],
    ['coupon.png', 'coupon', GRAY],
    ['coupon-active.png', 'coupon', ORANGE],
    ['profile.png', 'profile', GRAY],
    ['profile-active.png', 'profile', ORANGE]
  ]
  for (const [file, type, color] of items) {
    await writeIcon(file, type, color)
    console.log('wrote', file)
  }
}

main().catch(err => {
  console.error(err)
  process.exit(1)
})