统一 Airshelf 界面组件与图标

This commit is contained in:
iye
2026-05-27 12:29:41 +08:00
parent ea335587d2
commit 086d92991e
47 changed files with 750 additions and 450 deletions
+23 -20
View File
@@ -2,9 +2,9 @@
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<title>商品工作台 · 流·Studio</title>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet">
<link rel="stylesheet" href="assets/restraint.css?v=202605211643">
<title>商品工作台 · Airshelf</title>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="assets/restraint.css?v=2026052607">
<style>
/* ─── Onboarding tip(首次进入) ─── */
.onboard-tip {
@@ -771,7 +771,8 @@
</div>
</div>
<script src="assets/shell.js?v=202605211643"></script>
<script src="assets/icons.js?v=2026052608"></script>
<script src="assets/shell.js?v=2026052607"></script>
<script>
Shell.render({
active: 'products',
@@ -800,24 +801,26 @@ function dismissOnboard() {
}
// ============= 假数据 =============
const icon = (name, opts) => window.IconKit ? window.IconKit.svg(name, opts) : '';
const MODELS = [
{ id: 'm1', name: '林夕', meta: '女 · 25 · 都市白领', emoji: '◐' },
{ id: 'm2', name: '小苏', meta: '女 · 23 · 文艺学生', emoji: '◑' },
{ id: 'm3', name: '阿楠', meta: '女 · 28 · 同事型', emoji: '◓' },
{ id: 'm4', name: '小七', meta: '女 · 20 · 学生', emoji: '◒' },
{ id: 'm5', name: '王姐', meta: '女 · 38 · 居家', emoji: '◍' },
{ id: 'm6', name: '阿杰', meta: '男 · 30 · 都市', emoji: '◐' },
{ id: 'm7', name: '阿强', meta: '男 · 26 · 健身', emoji: '◑' },
{ id: 'm8', name: '+ 自定义', meta: '上传自有模特照', emoji: '+', custom: true },
{ id: 'm1', name: '林夕', meta: '女 · 25 · 都市白领', icon: 'users' },
{ id: 'm2', name: '小苏', meta: '女 · 23 · 文艺学生', icon: 'users' },
{ id: 'm3', name: '阿楠', meta: '女 · 28 · 同事型', icon: 'users' },
{ id: 'm4', name: '小七', meta: '女 · 20 · 学生', icon: 'users' },
{ id: 'm5', name: '王姐', meta: '女 · 38 · 居家', icon: 'users' },
{ id: 'm6', name: '阿杰', meta: '男 · 30 · 都市', icon: 'users' },
{ id: 'm7', name: '阿强', meta: '男 · 26 · 健身', icon: 'users' },
{ id: 'm8', name: '+ 自定义', meta: '上传自有模特照', icon: 'userPlus', custom: true },
];
const PLATFORMS = [
{ id: 'p1', name: '淘宝 / 天猫', meta: '1:1 · 800×800', emoji: '🅣' },
{ id: 'p2', name: '抖店', meta: '3:4 · 750×1000', emoji: '🅓' },
{ id: 'p3', name: '拼多多', meta: '1:1 · 800×800', emoji: '🅟' },
{ id: 'p4', name: '京东', meta: '1:1 · 800×800', emoji: '🅙' },
{ id: 'p5', name: '小红书', meta: '3:4 · 600×800', emoji: '🅡' },
{ id: 'p6', name: '1688', meta: '1:1 · 750×750', emoji: '🅑' },
{ id: 'p1', name: '淘宝 / 天猫', meta: '1:1 · 800×800', icon: 'image' },
{ id: 'p2', name: '抖店', meta: '3:4 · 750×1000', icon: 'image' },
{ id: 'p3', name: '拼多多', meta: '1:1 · 800×800', icon: 'image' },
{ id: 'p4', name: '京东', meta: '1:1 · 800×800', icon: 'image' },
{ id: 'p5', name: '小红书', meta: '3:4 · 600×800', icon: 'image' },
{ id: 'p6', name: '1688', meta: '1:1 · 750×750', icon: 'image' },
];
// 已生成资产 (mock)
@@ -914,7 +917,7 @@ function openModelPicker() {
// 填充模特库
$('model-grid').innerHTML = MODELS.map(m => `
<div class="opt-card${m.custom ? ' add' : ''}" data-id="${m.id}" onclick="selectOption('model', '${m.id}', this)">
<div class="opt-thumb">${m.emoji}</div>
<div class="opt-thumb">${icon(m.icon, { size: 18 })}</div>
<div class="opt-name">${m.name}</div>
<div class="opt-meta">${m.meta}</div>
</div>
@@ -926,7 +929,7 @@ function openModelPicker() {
function openPlatformPicker() {
$('platform-grid').innerHTML = PLATFORMS.map(p => `
<div class="opt-card" data-id="${p.id}" onclick="selectOption('platform', '${p.id}', this)">
<div class="opt-thumb">${p.emoji}</div>
<div class="opt-thumb">${icon(p.icon, { size: 18 })}</div>
<div class="opt-name">${p.name}</div>
<div class="opt-meta">${p.meta}</div>
</div>