170 lines
15 KiB
JavaScript
170 lines
15 KiB
JavaScript
/**
|
|
* 画个标 · 垂直行业模块库
|
|
* 每个行业包含:专属元素库、推荐配色方案、推荐风格与字体
|
|
* 行业元素统一 24x24 viewBox 线性风格
|
|
*/
|
|
const HGB_Industries = [
|
|
/* ================= 留学教育 ================= */
|
|
{
|
|
id: 'edu',
|
|
name: '留学教育',
|
|
emoji: '🎓',
|
|
desc: '学士帽、书籍、地球仪等教育视觉元素',
|
|
icons: HGB_Icons.edu,
|
|
palettes: [
|
|
{ name: '学术蓝', desc: '沉稳专业,国际教育主流', colors: ['#1B4F72', '#2980B9', '#AED6F1', '#F4F6F7'], scene: '留学中介' },
|
|
{ name: '常春藤绿', desc: '常春藤盟校气质', colors: ['#1E8449', '#27AE60', '#D5F5E3', '#FFFFFF'], scene: '本科留学' },
|
|
{ name: '皇家金', desc: '学历含金量与荣耀', colors: ['#7D6608', '#D4AC0D', '#F9E79F', '#FEF9E7'], scene: '商学院' },
|
|
{ name: '梦想天蓝', desc: '清新明亮,追梦活力', colors: ['#2471A3', '#5DADE2', '#EBF5FB', '#FFFFFF'], scene: '语言培训' }
|
|
],
|
|
styleIds: ['minimal', 'badge', 'vintage'],
|
|
fontFamilies: ['SimSun', 'Georgia', 'Playfair Display', 'SimHei']
|
|
},
|
|
|
|
/* ================= 餐饮美食 ================= */
|
|
{
|
|
id: 'food',
|
|
name: '餐饮美食',
|
|
emoji: '🍽️',
|
|
desc: '厨师帽、咖啡、汉堡等餐饮元素',
|
|
icons: [
|
|
{ id: 'chef-hat', name: '厨师帽', svg: '<path d="M17 21a1 1 0 0 0 1-1v-5.35c0-.457.316-.844.727-1.041a4 4 0 0 0-2.134-7.589 5 5 0 0 0-9.186 0 4 4 0 0 0-2.134 7.588c.411.198.727.585.727 1.041V20a1 1 0 0 0 1 1Z"/><path d="M6 17h12"/>', desc: '主厨与专业烹饪' },
|
|
{ id: 'coffee', name: '咖啡杯', svg: '<path d="M17 8h1a4 4 0 1 1 0 8h-1"/><path d="M3 8h14v9a4 4 0 0 1-4 4H7a4 4 0 0 1-4-4Z"/><line x1="6" y1="2" x2="6" y2="4"/><line x1="10" y1="2" x2="10" y2="4"/><line x1="14" y1="2" x2="14" y2="4"/>', desc: '咖啡厅与休闲时光' },
|
|
{ id: 'utensils', name: '刀叉餐具', svg: '<path d="M3 2v7c0 1.1.9 2 2 2h4a2 2 0 0 0 2-2V2"/><path d="M7 2v20"/><path d="M21 15V2a5 5 0 0 0-5 5v6c0 1.1.9 2 2 2h3Zm0 0v7"/>', desc: '用餐与精致餐饮' },
|
|
{ id: 'burger', name: '汉堡', svg: '<path d="M3 11a9 9 0 0 1 18 0z"/><path d="M4 13.5h16"/><path d="M4.5 15.5h15"/><path d="M5 16a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2z"/>', desc: '快餐与欢乐' },
|
|
{ id: 'wine', name: '高脚杯', svg: '<path d="M8 22h8"/><path d="M7 10h10"/><path d="M12 15v7"/><path d="M12 15a5 5 0 0 0 5-5c0-2-.8-4-2-6H9c-1.2 2-2 4-2 6a5 5 0 0 0 5 5z"/>', desc: '品酒与格调' },
|
|
{ id: 'cake', name: '蛋糕', svg: '<circle cx="12" cy="18" r="4"/><path d="M12 14c3.3 0 6-2.2 6-5 0 0-2.5 1-3.5-1.5C13.5 5 14 3 12 3s-1.5 2-2.5 4.5C8.5 10 6 9 6 9c0 2.8 2.7 5 6 5z"/>', desc: '甜品与庆典' },
|
|
{ id: 'soup', name: '热汤碗', svg: '<path d="M4 11h16a1 1 0 0 1 .5 1.87c-.8.4-1.3 1.3-1.3 2.13V17a3 3 0 0 1-3 3h-8a3 3 0 0 1-3-3v-2c0-.83-.5-1.73-1.3-2.13A1 1 0 0 1 4 11Z"/><path d="M8 10V9"/><path d="M16 10V9"/><path d="M12 10V9"/>', desc: '暖汤与养生' },
|
|
{ id: 'icecream', name: '冰淇淋', svg: '<path d="M12 2a5 5 0 0 1 5 5c0 3-1 5-2 8H9c-1-3-2-5-2-8a5 5 0 0 1 5-5z"/><path d="M9.5 17h5"/>', desc: '清凉与甜蜜' }
|
|
],
|
|
palettes: [
|
|
{ name: '香橙暖阳', desc: '热情食欲,餐饮首选', colors: ['#E67E22', '#F39C12', '#FDEBD0', '#FFF9F0'], scene: '中西餐厅' },
|
|
{ name: '红酒典雅', desc: '高格调,成熟稳重', colors: ['#7B241C', '#C0392B', '#F5B7B1', '#FDF2F2'], scene: '西餐酒吧' },
|
|
{ name: '抹茶清新', desc: '自然清新,健康轻食', colors: ['#1E8449', '#7DCEA0', '#E9F7EF', '#FFFFFF'], scene: '轻食甜品' },
|
|
{ name: '咖啡醇香', desc: '温暖醇厚,休闲空间', colors: ['#6F4E37', '#A67B5B', '#DCC7AA', '#F7F1E5'], scene: '咖啡烘焙' }
|
|
],
|
|
styleIds: ['cartoon', 'hand', 'badge'],
|
|
fontFamilies: ['Microsoft YaHei', 'Poppins', 'KaiTi', 'Verdana']
|
|
},
|
|
|
|
/* ================= 医疗健康 ================= */
|
|
{
|
|
id: 'health',
|
|
name: '医疗健康',
|
|
emoji: '⚕️',
|
|
desc: '十字、心跳、药丸等健康元素',
|
|
icons: [
|
|
{ id: 'medical-cross', name: '医疗十字', svg: '<circle cx="12" cy="12" r="10"/><path d="M12 8v8"/><path d="M8 12h8"/>', desc: '医疗与急救' },
|
|
{ id: 'heart-pulse', name: '心跳', svg: '<path d="M20.8 4.6a5.5 5.5 0 0 0-7.8 0L12 5.6l-1-1a5.5 5.5 0 0 0-7.8 7.8l1 1L12 21l7.8-7.6 1-1a5.5 5.5 0 0 0 0-7.8z"/><path d="M7 12h3l1.5-3 2 6 1.5-3h2"/>', desc: '健康与生命活力' },
|
|
{ id: 'pill', name: '药丸', svg: '<path d="M10.5 20.5a5 5 0 0 1-7-7l8-8a5 5 0 0 1 7 7z"/><path d="M3.5 13.5l7-7"/>', desc: '医药与护理' },
|
|
{ id: 'stethoscope', name: '听诊器', svg: '<path d="M4.8 2.3A.3.3 0 1 0 5 2H4a2 2 0 0 0-2 2v5a6 6 0 0 0 6 6 6 6 0 0 0 6-6V4a2 2 0 0 0-2-2h-1a.2.2 0 1 0 .3.3"/><path d="M8 15v1a6 6 0 0 0 6 6 6 6 0 0 0 6-6v-4"/><circle cx="20" cy="10" r="2"/>', desc: '诊疗与关怀' },
|
|
{ id: 'first-aid', name: '急救箱', svg: '<rect x="2" y="6" width="20" height="12" rx="2"/><path d="M12 9v6"/><path d="M9 12h6"/><path d="M8 6V5a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v1"/>', desc: '急救与保障' },
|
|
{ id: 'syringe', name: '注射器', svg: '<path d="m18 2 4 4"/><path d="m17 7 3-3"/><path d="M19 9 8.7 19.3c-1 1-2.5 1-3.4 0l-.6-.6c-1-1-1-2.5 0-3.4L15 5"/><path d="m9 11 4 4"/><path d="m5 19-3 3"/><path d="m14 4 6 6"/>', desc: '接种与医学' },
|
|
{ id: 'ambulance', name: '救护车', svg: '<rect x="2" y="5" width="16" height="12" rx="2"/><path d="M18 9h3l2 3v5h-2"/><path d="M7 8v6"/><path d="M4 11h6"/><circle cx="6.5" cy="19" r="1.8"/><circle cx="18" cy="19" r="1.8"/>', desc: '应急与救援' },
|
|
{ id: 'microscope', name: '显微镜', svg: '<path d="M6 18h8"/><path d="M3 22h18"/><path d="M14 22a7 7 0 1 0 0-14h-1"/><path d="M9 14h2"/><path d="M9 12a2 2 0 0 1-2-2V6h6v4a2 2 0 0 1-2 2Z"/><path d="M12 6V3a1 1 0 0 0-1-1H9a1 1 0 0 0-1 1v3"/>', desc: '研究与实验室' }
|
|
],
|
|
palettes: [
|
|
{ name: '医疗蓝', desc: '专业信赖,医疗主流', colors: ['#1A5276', '#5DADE2', '#D6EAF8', '#FFFFFF'], scene: '综合医院' },
|
|
{ name: '健康绿', desc: '生机健康,自然疗愈', colors: ['#1E8449', '#58D68D', '#D5F5E3', '#FFFFFF'], scene: '养生保健' },
|
|
{ name: '纯净白蓝', desc: '洁净清爽,现代诊所', colors: ['#2E86C1', '#85C1E9', '#F0F8FF', '#FFFFFF'], scene: '口腔诊所' },
|
|
{ name: '安心浅蓝', desc: '温和安心,母婴护理', colors: ['#2874A6', '#5DADE2', '#EBF5FB', '#F4F6F6'], scene: '母婴护理' }
|
|
],
|
|
styleIds: ['minimal', 'business', 'tech'],
|
|
fontFamilies: ['Microsoft YaHei', 'Arial', 'SimHei', 'Montserrat']
|
|
},
|
|
|
|
/* ================= 科技互联网 ================= */
|
|
{
|
|
id: 'tech',
|
|
name: '科技互联网',
|
|
emoji: '💻',
|
|
desc: '芯片、火箭、代码等科技元素',
|
|
icons: [
|
|
{ id: 'chip', name: '芯片', svg: '<rect x="7" y="7" width="10" height="10" rx="1"/><path d="M9 3v4"/><path d="M15 3v4"/><path d="M9 17v4"/><path d="M15 17v4"/><path d="M3 9h4"/><path d="M3 15h4"/><path d="M17 9h4"/><path d="M17 15h4"/><rect x="10" y="10" width="4" height="4"/>', desc: '半导体与算力' },
|
|
{ id: 'rocket', name: '火箭', svg: '<path d="M12 2c2.5 3 4 6 4 9l3 3v5h-4l-1.5 2.5L12 22l-1.5-1.5L9 19H5v-5l3-3c0-3 1.5-6 4-9z"/><circle cx="12" cy="11" r="2"/>', desc: '创新与速度' },
|
|
{ id: 'code', name: '代码', svg: '<path d="M8 6l-6 6 6 6"/><path d="M16 6l6 6-6 6"/>', desc: '开发与编程' },
|
|
{ id: 'cloud', name: '云服务', svg: '<path d="M18 10h-1.26A8 8 0 1 0 9 20h9a5 5 0 0 0 0-10z"/>', desc: '云计算与存储' },
|
|
{ id: 'robot', name: '机器人', svg: '<rect x="4" y="8" width="16" height="12" rx="2"/><path d="M12 8V4"/><circle cx="12" cy="3" r="1"/><circle cx="9" cy="13" r="1"/><circle cx="15" cy="13" r="1"/><path d="M9 17h6"/>', desc: 'AI 与自动化' },
|
|
{ id: 'gear', name: '齿轮', svg: '<circle cx="12" cy="12" r="3"/><path d="M12 2v3"/><path d="M12 19v3"/><path d="M2 12h3"/><path d="M19 12h3"/><path d="M4.9 4.9l2.1 2.1"/><path d="M17 17l2.1 2.1"/><path d="M19.1 4.9L17 7"/><path d="M7 17l-2.1 2.1"/>', desc: '系统与运转' },
|
|
{ id: 'monitor', name: '显示器', svg: '<rect x="2" y="3" width="20" height="14" rx="2"/><path d="M8 21h8"/><path d="M12 17v4"/>', desc: '软件与界面' },
|
|
{ id: 'wifi', name: '无线网络', svg: '<path d="M5 12.55a11 11 0 0 1 14.08 0"/><path d="M8.53 16.11a7 7 0 0 1 6.95 0"/><line x1="12" y1="20" x2="12.01" y2="20"/>', desc: '连接与在线' }
|
|
],
|
|
palettes: [
|
|
{ name: '科技蓝紫', desc: '智慧深邃,数字感', colors: ['#4A235A', '#8E44AD', '#BB8FCE', '#F5EEF8'], scene: '互联网公司' },
|
|
{ name: '电路蓝', desc: '冷静专业,工业科技', colors: ['#1B2631', '#2980B9', '#85C1E9', '#F4F6F7'], scene: '智能硬件' },
|
|
{ name: '极客霓虹', desc: '活力张扬,年轻潮流', colors: ['#0B132B', '#3A86FF', '#FF006E', '#FB5607'], scene: '游戏娱乐' },
|
|
{ name: '未来银灰', desc: '极简高级,未来感', colors: ['#2C3E50', '#7F8C8D', '#BDC3C7', '#ECF0F1'], scene: '人工智能' }
|
|
],
|
|
styleIds: ['tech', 'gradient', 'minimal'],
|
|
fontFamilies: ['SimHei', 'Montserrat', 'Verdana', 'Microsoft YaHei']
|
|
},
|
|
|
|
/* ================= 体育竞技 ================= */
|
|
{
|
|
id: 'sport',
|
|
name: '体育竞技',
|
|
emoji: '🏆',
|
|
desc: '奖杯、足球、奖牌等运动元素',
|
|
icons: [
|
|
{ id: 'trophy', name: '奖杯', svg: '<path d="M8 21h8"/><path d="M12 17v4"/><path d="M7 4h10v6a5 5 0 0 1-10 0z"/><path d="M7 6H4a2.5 2.5 0 0 0 0 5h3"/><path d="M17 6h3a2.5 2.5 0 0 1 0 5h-3"/>', desc: '冠军与荣耀' },
|
|
{ id: 'soccer', name: '足球', svg: '<circle cx="12" cy="12" r="9"/><path d="M12 7l2.5 1.5L13.5 11h-3l-1-2.5z"/><path d="M12 3v4"/><path d="M5 8.5l3 1"/><path d="M16 20l-1.5-2.5"/><path d="M8 20l1.5-2.5"/>', desc: '绿茵与团队' },
|
|
{ id: 'basketball', name: '篮球', svg: '<circle cx="12" cy="12" r="9"/><path d="M3 12h18"/><path d="M12 3a9 9 0 0 0 0 18"/>', desc: '活力与对抗' },
|
|
{ id: 'medal', name: '奖牌', svg: '<circle cx="12" cy="14" r="5"/><path d="M9 3l-1 3"/><path d="M15 3l1 3"/><path d="M9.5 6h5"/><path d="M12 12l.9 1.7 1.9.3-1.4 1.3.3 1.9-1.7-.9-1.7.9.3-1.9L9.2 14l1.9-.3z"/>', desc: '成就与荣誉' },
|
|
{ id: 'runner', name: '奔跑', svg: '<circle cx="13" cy="4" r="2"/><path d="M5 21l3-6 2 1 1 5"/><path d="M8 15l2-4 3-1 3 3 2 1"/>', desc: '运动与坚持' },
|
|
{ id: 'dumbbell', name: '哑铃', svg: '<path d="M6.5 6.5v11"/><path d="M17.5 6.5v11"/><path d="M2 9v6"/><path d="M22 9v6"/><rect x="6.5" y="9" width="11" height="6" rx="1"/>', desc: '力量与健身' },
|
|
{ id: 'bike', name: '骑行', svg: '<circle cx="6" cy="17" r="3.5"/><circle cx="18" cy="17" r="3.5"/><path d="M6 17L10 8h4l4 9"/><path d="M14 8h2"/>', desc: '健康与户外' },
|
|
{ id: 'stopwatch', name: '秒表', svg: '<circle cx="12" cy="13" r="8"/><path d="M12 9v4l2.5 2.5"/><path d="M9 2h6"/><path d="M12 2v3"/>', desc: '竞速与计时' }
|
|
],
|
|
palettes: [
|
|
{ name: '活力橙', desc: '阳光热情,运动活力', colors: ['#E67E22', '#F39C12', '#FDEBD0', '#FFF9F0'], scene: '综合健身' },
|
|
{ name: '赛场绿', desc: '清新自然,健康向上', colors: ['#1E8449', '#52BE80', '#D5F5E3', '#FFFFFF'], scene: '户外运动' },
|
|
{ name: '冠军金', desc: '尊贵闪耀,胜利荣光', colors: ['#7D6608', '#D4AC0D', '#F9E79F', '#FEF9E7'], scene: '竞技赛事' },
|
|
{ name: '热血红', desc: '激情澎湃,力量对决', colors: ['#922B21', '#E74C3C', '#F5B7B1', '#FDEDEC'], scene: '搏击格斗' }
|
|
],
|
|
styleIds: ['cartoon', 'hand', 'badge'],
|
|
fontFamilies: ['Impact', 'Microsoft YaHei', 'KaiTi', 'Arial']
|
|
},
|
|
|
|
/* ================= 金融商务 ================= */
|
|
{
|
|
id: 'finance',
|
|
name: '金融商务',
|
|
emoji: '💼',
|
|
desc: '钱币、银行、图表等商务元素',
|
|
icons: [
|
|
{ id: 'coin', name: '钱币', svg: '<circle cx="12" cy="12" r="9"/><path d="M12 6v12"/><path d="M8.5 9.5h7"/><path d="M8.5 14.5h7"/>', desc: '财富与价值' },
|
|
{ id: 'bank', name: '银行', svg: '<polygon points="3 9 12 3 21 9"/><rect x="3" y="10" width="18" height="4"/><path d="M5 14v5"/><path d="M9.5 14v5"/><path d="M14.5 14v5"/><path d="M19 14v5"/><path d="M3 19h18"/>', desc: '金融与信用' },
|
|
{ id: 'trending-up', name: '增长图表', svg: '<path d="M23 6l-9.5 9.5-5-5L1 18"/><path d="M17 6h6v6"/>', desc: '增长与上升' },
|
|
{ id: 'handshake', name: '握手', svg: '<path d="m11 17 2 2a1 1 0 1 0 3-3"/><path d="m14 14 2.5 2.5a1 1 0 1 0 3-3l-3.88-3.88a3 3 0 0 0-4.24 0l-.88.88a1 1 0 1 1-3-3l2.81-2.81a5.79 5.79 0 0 1 7.06-.87l.47.28a2 2 0 0 0 1.42.25L21 4"/><path d="m21 3 1 11h-2"/><path d="M3 3 2 14l6.5 6.5a1 1 0 1 0 3-3"/><path d="M3 4h8"/>', desc: '合作与共赢' },
|
|
{ id: 'briefcase', name: '公文包', svg: '<rect x="2" y="7" width="20" height="14" rx="2"/><path d="M8 7V5a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/><path d="M2 13h20"/>', desc: '商务与职场' },
|
|
{ id: 'calculator', name: '计算器', svg: '<rect x="4" y="2" width="16" height="20" rx="2"/><line x1="8" y1="6" x2="16" y2="6"/><line x1="16" y1="14" x2="16" y2="18"/><path d="M8 14h.01"/><path d="M12 14h.01"/><path d="M8 18h.01"/><path d="M12 18h.01"/>', desc: '财务与计算' },
|
|
{ id: 'gem', name: '钻石', svg: '<path d="M6 3h12l4 6-10 13L2 9z"/><path d="M2 9h20"/><path d="M12 22L8 9l4-6 4 6z"/>', desc: '珍贵与高端' },
|
|
{ id: 'money-bag', name: '钱袋', svg: '<path d="M8 7L5 3h14l-3 4"/><path d="M8 7h8v3a4 4 0 0 1-8 0z"/><path d="M6 17a4 4 0 0 0 4 4h4a4 4 0 0 0 4-4v-4H6z"/>', desc: '投资与储蓄' }
|
|
],
|
|
palettes: [
|
|
{ name: '商务深蓝', desc: '专业稳重,金融权威', colors: ['#1B2631', '#2E86C1', '#F1C40F', '#F4F6F7'], scene: '银行保险' },
|
|
{ name: '金砖', desc: '奢华尊贵,财富象征', colors: ['#7D6608', '#D4AC0D', '#F9E79F', '#FEF9E7'], scene: '投资理财' },
|
|
{ name: '稳重灰蓝', desc: '严谨理性,商务咨询', colors: ['#34495E', '#5D6D7E', '#AEB6BF', '#FFFFFF'], scene: '企业咨询' },
|
|
{ name: '翡翠绿', desc: '稳健增长,安心可靠', colors: ['#145A32', '#1E8449', '#ABEBC6', '#F0FDF4'], scene: '证券基金' }
|
|
],
|
|
styleIds: ['business', 'minimal', 'vintage'],
|
|
fontFamilies: ['Arial', 'SimHei', 'Georgia', 'Montserrat']
|
|
}
|
|
];
|
|
|
|
/** 按 id 查找行业(使用原生 find,避免覆盖数组方法) */
|
|
HGB_Industries.find = function (id) {
|
|
return Array.prototype.find.call(this, x => x.id === id) || this[0];
|
|
};
|
|
|
|
/** 当前行业(默认留学教育) */
|
|
HGB_Industries.current = function () {
|
|
const id = localStorage.getItem('hgb_industry') || 'edu';
|
|
return HGB_Industries.find(id);
|
|
};
|
|
|
|
/** 设置当前行业 */
|
|
HGB_Industries.setCurrent = function (id) {
|
|
localStorage.setItem('hgb_industry', id);
|
|
};
|