Files
Agent-n8n/web_frontend/web_result/order-classes/food/index.html
Yep_Q 6c172673e7 feat: 为12个订单班添加专属SVG图标
详细说明:
- 为每个订单班创建专属的SVG favicon图标
- 每个图标使用渐变色和专属图形设计
- 在所有订单班的index.html中添加favicon引用
- 图标设计:
  * wenlu(文旅): 紫蓝渐变 + 地图标记
  * food(食品): 橙红渐变 + 厨师帽
  * visual-design(视觉设计): 粉紫渐变 + 画笔
  * civil(土木): 灰蓝渐变 + 建筑
  * health(大健康): 绿青渐变 + 医疗十字
  * energy(能源): 黄橙渐变 + 闪电
  * transportation(交通物流): 蓝色渐变 + 卡车
  * manufacturing(智能制造): 深蓝银色渐变 + 齿轮
  * developer(智能开发): 青绿渐变 + 代码符号
  * finance(财经商贸): 金蓝渐变 + 上升图表
  * environmental(环保): 绿蓝渐变 + 叶子
  * chemical(化工): 蓝紫渐变 + 烧杯
- 修改文件: 12个favicon.svg文件 + 12个index.html文件
- 影响模块: 所有订单班网页的视觉标识系统

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
2025-10-10 17:12:22 +08:00

1084 lines
65 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=5.0, user-scalable=yes">
<title>青莳轻食 - AI多智能体协同创业方案</title>
<link rel="icon" type="image/svg+xml" href="favicon.svg">
<!-- 外部样式 -->
<link rel="stylesheet" href="css/styles.css">
<!-- 字体 -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=Noto+Sans+SC:wght@300;400;500;600;700;900&display=swap" rel="stylesheet">
<!-- Lucide Icons -->
<script src="https://unpkg.com/lucide@latest"></script>
</head>
<body>
<!-- 主题切换按钮 -->
<div class="theme-toggle">
<button id="themeToggleBtn" class="theme-toggle-btn" aria-label="切换主题">
<i data-lucide="sun" class="theme-icon theme-icon-light"></i>
<i data-lucide="moon" class="theme-icon theme-icon-dark"></i>
</button>
</div>
<!-- Hero 区域 -->
<section class="hero">
<div class="hero-content">
<div class="hero-badge">AI 多智能体协同</div>
<h1 class="hero-title">青莳轻食</h1>
<p class="hero-subtitle">中高端个性化轻食店铺经营方案</p>
<p class="hero-description">
<i data-lucide="bot"></i>
由 8 位 AI 专家联合打造
</p>
</div>
</section>
<!-- 导航 -->
<nav class="nav">
<div class="nav-container">
<div class="nav-item active" data-section="market">
<i data-lucide="bar-chart-3"></i>
<span>市场</span>
</div>
<div class="nav-item" data-section="brand">
<i data-lucide="palette"></i>
<span>品牌</span>
</div>
<div class="nav-item" data-section="location">
<i data-lucide="map-pin"></i>
<span>选址</span>
</div>
<div class="nav-item" data-section="menu">
<i data-lucide="utensils"></i>
<span>菜单</span>
</div>
<div class="nav-item" data-section="operation">
<i data-lucide="settings"></i>
<span>运营</span>
</div>
<div class="nav-item" data-section="team">
<i data-lucide="users"></i>
<span>团队</span>
</div>
<div class="nav-item" data-section="finance">
<i data-lucide="dollar-sign"></i>
<span>财务</span>
</div>
<div class="nav-item" data-section="risk">
<i data-lucide="shield-alert"></i>
<span>风险</span>
</div>
</div>
</nav>
<!-- Section 1: 市场分析 -->
<section class="section" id="market">
<div class="container">
<div class="section-header">
<img class="agent-avatar" src="agent-avatars/餐饮市场调研专家.jpeg" alt="Agent"
onerror="this.src='data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2280%22 height=%2280%22 viewBox=%220 0 80 80%22%3E%3Crect width=%2280%22 height=%2280%22 fill=%22%23f0f0e8%22/%3E%3Ctext x=%2250%25%22 y=%2250%25%22 dominant-baseline=%22middle%22 text-anchor=%22middle%22 font-size=%2232%22%3E🤖%3C/text%3E%3C/svg%3E'">
<div class="agent-info">
<div class="agent-name">
<i data-lucide="bot"></i>
Agent 01 · 餐饮市场调研专家
</div>
<h2 class="section-title">市场分析与定位</h2>
</div>
</div>
<div class="section-content">
<div class="expert-intro">
<h3>
<i data-lucide="bar-chart-3"></i>
专家分析报告
</h3>
<p>基于2025年餐饮市场数据,轻食赛道呈现持续增长态势。健康意识觉醒、中产阶级崛起、快节奏生活方式共同驱动市场需求。本方案针对25-40岁中高收入人群,主攻商务办公区与高端社区,提供高品质、个性化的轻食解决方案。</p>
</div>
<!-- 图文交错布局 -->
<div class="alternating-layout">
<div class="alternating-image">
<img data-src="images/健身宣传代言.jpg" alt="目标客群">
</div>
<div class="alternating-content">
<h3>
<i data-lucide="target"></i>
目标客群
</h3>
<ul class="feature-list">
<li><i data-lucide="check"></i>年龄段: 25-40 岁</li>
<li><i data-lucide="check"></i>收入: 月收入 8000-30000 元</li>
<li><i data-lucide="check"></i>职业: 白领、健身爱好者、孕产群体</li>
<li><i data-lucide="check"></i>特征: 健康意识强、追求品质生活</li>
</ul>
</div>
</div>
<div class="alternating-layout reverse">
<div class="alternating-image">
<img data-src="images/市场宣传营销.jpg" alt="市场趋势">
</div>
<div class="alternating-content">
<h3>
<i data-lucide="trending-up"></i>
市场趋势
</h3>
<div class="stats-chart">
<div class="stat-item-chart">
<div class="stat-header">
<div class="stat-label">市场规模增长</div>
<div class="stat-value">15%</div>
</div>
<div class="stat-bar">
<div class="stat-bar-fill" style="width: 15%"></div>
</div>
</div>
<div class="stat-item-chart">
<div class="stat-header">
<div class="stat-label">健康意识提升</div>
<div class="stat-value">20%</div>
</div>
<div class="stat-bar">
<div class="stat-bar-fill" style="width: 20%"></div>
</div>
</div>
<div class="stat-item-chart">
<div class="stat-header">
<div class="stat-label">外卖渗透率</div>
<div class="stat-value">65%</div>
</div>
<div class="stat-bar">
<div class="stat-bar-fill" style="width: 65%"></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Section 2: 品牌设计 -->
<section class="section" id="brand">
<div class="container">
<div class="section-header">
<img class="agent-avatar" src="agent-avatars/餐饮品牌设计专家.jpeg" alt="Agent"
onerror="this.src='data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2280%22 height=%2280%22 viewBox=%220 0 80 80%22%3E%3Crect width=%2280%22 height=%2280%22 fill=%22%23f0f0e8%22/%3E%3Ctext x=%2250%25%22 y=%2250%25%22 dominant-baseline=%22middle%22 text-anchor=%22middle%22 font-size=%2232%22%3E🤖%3C/text%3E%3C/svg%3E'">
<div class="agent-info">
<div class="agent-name">
<i data-lucide="bot"></i>
Agent 02 · 品牌设计专家
</div>
<h2 class="section-title">品牌定位与形象设计</h2>
</div>
</div>
<div class="section-content">
<div class="expert-intro">
<h3>
<i data-lucide="palette"></i>
专家设计理念
</h3>
<p>"青莳"取"青春"与"莳种"之意,象征新鲜、健康与生命力。品牌视觉采用清新绿色系,传递自然、健康、活力的品牌形象。Logo以简洁的叶片元素为核心,搭配现代字体,体现专业与品质。整体设计语言贯穿门店、包装、线上平台,形成统一的品牌识别系统。</p>
</div>
<!-- 大图小卡片组合布局 -->
<div class="hero-cards-layout">
<div class="hero-image-container">
<img data-src="images/店面图片_正门.jpg" alt="店面外观">
<div class="hero-image-overlay">
<h3>
<i data-lucide="store"></i>
青莳轻食旗舰店
</h3>
<p>现代简约风格 · 清新自然氛围</p>
</div>
</div>
<div class="mini-cards-grid">
<div class="mini-card">
<div class="mini-card-icon">
<i data-lucide="tag" style="display: inline-block; width: 32px; height: 32px;"></i>
</div>
<div class="mini-card-title">品牌标识</div>
<div class="mini-card-desc">简洁现代的视觉系统</div>
</div>
<div class="mini-card">
<div class="mini-card-icon">
<i data-lucide="palette" style="display: inline-block; width: 32px; height: 32px;"></i>
</div>
<div class="mini-card-title">色彩系统</div>
<div class="mini-card-desc">清新绿色为主色调</div>
</div>
<div class="mini-card">
<div class="mini-card-icon">
<i data-lucide="sparkles" style="display: inline-block; width: 32px; height: 32px;"></i>
</div>
<div class="mini-card-title">设计理念</div>
<div class="mini-card-desc">健康·自然·活力</div>
</div>
<div class="mini-card">
<div class="mini-card-icon">
<i data-lucide="package" style="display: inline-block; width: 32px; height: 32px;"></i>
</div>
<div class="mini-card-title">包装设计</div>
<div class="mini-card-desc">环保材质统一风格</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Section 3: 选址装修 -->
<section class="section" id="location">
<div class="container">
<div class="section-header">
<img class="agent-avatar" src="agent-avatars/餐厅选址装修专家.jpeg" alt="Agent"
onerror="this.src='data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2280%22 height=%2280%22 viewBox=%220 0 80 80%22%3E%3Crect width=%2280%22 height=%2280%22 fill=%22%23f0f0e8%22/%3E%3Ctext x=%2250%25%22 y=%2250%25%22 dominant-baseline=%22middle%22 text-anchor=%22middle%22 font-size=%2232%22%3E🤖%3C/text%3E%3C/svg%3E'">
<div class="agent-info">
<div class="agent-name">
<i data-lucide="bot"></i>
Agent 03 · 商业选址专家
</div>
<h2 class="section-title">店铺选址与布局规划</h2>
</div>
</div>
<div class="section-content">
<div class="expert-intro">
<h3>
<i data-lucide="map-pin"></i>
专家选址建议
</h3>
<p>基于目标客群画像与消费行为分析,推荐选址于甲级写字楼、高端商圈、品质社区三大核心场景。面积控制在80-150㎡,既能保证堂食体验,又能高效运营外卖业务。店内采用开放式厨房设计,透明化操作流程,增强顾客信任感。动线设计遵循"点餐-制作-取餐"流程,提升运营效率。</p>
</div>
<div class="step-cards-layout">
<div class="step-card">
<div class="step-number">1</div>
<div class="step-card-image">
<img data-src="images/健康食材扫码溯源.jpg" alt="商圈选址">
</div>
<div class="step-card-content">
<h3 class="step-card-title">
<i data-lucide="target"></i>
选址标准
</h3>
<p class="step-card-desc">优选甲级写字楼、高端商圈、品质社区三大核心场景,确保目标客群高度匹配。重点关注人流量、竞争环境、租金成本等关键指标,选择最具发展潜力的优质点位。</p>
</div>
</div>
<div class="step-card">
<div class="step-number">2</div>
<div class="step-card-image">
<img data-src="images/厨房加工场景.jpg" alt="厨房布局">
</div>
<div class="step-card-content">
<h3 class="step-card-title">
<i data-lucide="layout"></i>
空间布局
</h3>
<p class="step-card-desc">采用开放式厨房设计,透明化操作流程增强顾客信任感。科学规划动线设计,遵循"点餐-制作-取餐"高效流程,提升整体运营效率和顾客体验。</p>
</div>
</div>
<div class="step-card">
<div class="step-number">3</div>
<div class="step-card-image">
<img data-src="images/店内场景_用餐区.jpg" alt="用餐环境">
</div>
<div class="step-card-content">
<h3 class="step-card-title">
<i data-lucide="home"></i>
店内环境
</h3>
<p class="step-card-desc">打造清新舒适的用餐环境,融合现代简约设计风格与自然元素。精心布置每个细节,营造健康轻松的就餐氛围,让顾客享受愉悦的用餐体验。</p>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Section 4: 菜单设计 -->
<section class="section" id="menu">
<div class="container">
<div class="section-header">
<img class="agent-avatar" src="agent-avatars/菜品研发专家.jpeg" alt="Agent"
onerror="this.src='data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2280%22 height=%2280%22 viewBox=%220 0 80 80%22%3E%3Crect width=%2280%22 height=%2280%22 fill=%22%23f0f0e8%22/%3E%3Ctext x=%2250%25%22 y=%2250%25%22 dominant-baseline=%22middle%22 text-anchor=%22middle%22 font-size=%2232%22%3E🤖%3C/text%3E%3C/svg%3E'">
<div class="agent-info">
<div class="agent-name">
<i data-lucide="bot"></i>
Agent 04 · 营养菜单设计师
</div>
<h2 class="section-title">产品菜单与营养设计</h2>
</div>
</div>
<div class="section-content">
<div class="expert-intro">
<h3>
<i data-lucide="utensils"></i>
专家设计方案
</h3>
<p>菜单设计遵循"营养均衡、健康低卡、口味丰富"三大原则。产品线涵盖能量碗、沙拉、冷意面、健康饮品四大品类,满足不同场景与需求。每款产品均配有详细营养标签,标注卡路里、蛋白质、碳水、脂肪含量,并提供"减脂""增肌""均衡"等标签,便于顾客快速选择。同时提供DIY定制服务,满足个性化需求。</p>
</div>
<div class="product-grid">
<div class="product-card">
<img data-src="images/青莳减脂专属套餐(可换酱汁).jpg" alt="减脂套餐" class="product-image">
<div class="product-info">
<div class="product-name">青莳减脂专属套餐</div>
<div class="product-desc">450 kcal | 蛋白质 35g</div>
</div>
</div>
<div class="product-card">
<img data-src="images/青莳虾仁牛油果沙拉.jpg" alt="虾仁牛油果沙拉" class="product-image">
<div class="product-info">
<div class="product-name">青莳虾仁牛油果沙拉</div>
<div class="product-desc">380 kcal | 蛋白质 28g</div>
</div>
</div>
<div class="product-card">
<img data-src="images/青莳夏季芒果鸡胸冷意面.jpg" alt="芒果鸡胸冷意面" class="product-image">
<div class="product-info">
<div class="product-name">青莳夏季芒果鸡胸冷意面</div>
<div class="product-desc">520 kcal | 蛋白质 32g</div>
</div>
</div>
<div class="product-card">
<img data-src="images/青莳香煎牛肉能量碗.jpg" alt="香煎牛肉能量碗" class="product-image">
<div class="product-info">
<div class="product-name">青莳香煎牛肉能量碗</div>
<div class="product-desc">580 kcal | 蛋白质 38g</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Section 5: 运营管理 -->
<section class="section" id="operation">
<div class="container">
<div class="section-header">
<img class="agent-avatar" src="agent-avatars/轻食店经营管理专家.jpeg" alt="Agent"
onerror="this.src='data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2280%22 height=%2280%22 viewBox=%220 0 80 80%22%3E%3Crect width=%2280%22 height=%2280%22 fill=%22%23f0f0e8%22/%3E%3Ctext x=%2250%25%22 y=%2250%25%22 dominant-baseline=%22middle%22 text-anchor=%22middle%22 font-size=%2232%22%3E🤖%3C/text%3E%3C/svg%3E'">
<div class="agent-info">
<div class="agent-name">
<i data-lucide="bot"></i>
Agent 05 · 运营管理专家
</div>
<h2 class="section-title">运营管理与流程设计</h2>
</div>
</div>
<div class="section-content">
<div class="expert-intro">
<h3>
<i data-lucide="settings"></i>
专家运营方案
</h3>
<p>建立"标准化+数字化"双轮驱动的运营体系。标准化涵盖食材采购、储存、制作、出餐全流程,通过SOP确保品质稳定。数字化系统包括智能点餐、库存管理、会员系统、数据分析四大模块,实现精细化运营。同时建立7×24小时冷链物流体系,保证食材新鲜度。</p>
</div>
<!-- 时间线布局 -->
<div class="timeline-layout">
<div class="timeline-item">
<div class="timeline-dot"></div>
<div class="timeline-content">
<h3>
<i data-lucide="clipboard-list"></i>
标准化流程体系
</h3>
<p>建立食材采购、储存、制作、出餐全流程SOP标准操作手册确保每个环节都有明确的质量标准和操作规范。通过标准化管理保证产品品质的一致性和稳定性。</p>
</div>
<div class="timeline-image">
<img data-src="images/厨房冷柜管理.jpg" alt="标准化管理">
</div>
</div>
<div class="timeline-item">
<div class="timeline-dot"></div>
<div class="timeline-content">
<h3>
<i data-lucide="smartphone"></i>
数字化运营系统
</h3>
<p>部署智能点餐系统、库存管理系统、会员管理系统和数据分析平台。实时监控经营数据,优化库存周转,提升运营效率。通过数据驱动决策,实现精细化管理。</p>
</div>
<div class="timeline-image">
<img data-src="images/菜品备制.jpg" alt="数字化管理">
</div>
</div>
<div class="timeline-item">
<div class="timeline-dot"></div>
<div class="timeline-content">
<h3>
<i data-lucide="flame"></i>
全程品质管控
</h3>
<p>从食材溯源到成品出餐建立7×24小时冷链物流体系和三级品控检验机制。定期进行食品安全培训和检查确保食品安全零事故为顾客提供放心的健康轻食。</p>
</div>
<div class="timeline-image">
<img data-src="images/餐盒包装.jpg" alt="品质管控">
</div>
</div>
</div>
<!-- 营销与推广 -->
<div class="subsection-divider" style="margin: 60px 0 40px 0; height: 1px; background: linear-gradient(90deg, transparent, var(--border-color), transparent);"></div>
<div class="subsection-header" style="text-align: center; margin-bottom: 40px;">
<h3 style="font-size: 28px; font-weight: 700; color: var(--text-primary); display: flex; align-items: center; justify-content: center; gap: 12px;">
<i data-lucide="megaphone" style="width: 32px; height: 32px;"></i>
营销与推广
</h3>
<p style="margin-top: 12px; color: var(--text-secondary); font-size: 16px;">全方位营销策略,打造品牌影响力</p>
</div>
<div class="vertical-stack">
<!-- 品牌建设 -->
<div class="stack-card">
<div class="stack-card-header">
<div class="stack-card-icon">
<i data-lucide="award" style="display: inline-block; width: 32px; height: 32px;"></i>
</div>
<h3 class="stack-card-title">品牌建设</h3>
</div>
<div class="stack-card-content">
<div class="stack-card-body">
<div style="display: grid; gap: 24px;">
<div>
<h4 style="font-size: 18px; font-weight: 600; color: var(--text-primary); margin-bottom: 12px; display: flex; align-items: center; gap: 8px;">
<i data-lucide="palette" style="width: 20px; height: 20px;"></i>
品牌视觉
</h4>
<ul class="feature-list">
<li><i data-lucide="check"></i>设计简洁LOGO以"绿叶+叉子"为核心元素)</li>
<li><i data-lucide="check"></i>统一门店装修、外卖包装、宣传物料的视觉风格</li>
<li><i data-lucide="check"></i>外卖盒采用可降解材质,印上"每日营养小贴士"</li>
</ul>
</div>
<div>
<h4 style="font-size: 18px; font-weight: 600; color: var(--text-primary); margin-bottom: 12px; display: flex; align-items: center; gap: 8px;">
<i data-lucide="star" style="width: 20px; height: 20px;"></i>
口碑打造
</h4>
<ul class="feature-list">
<li><i data-lucide="check"></i>建立"差评24小时响应机制"</li>
<li><i data-lucide="check"></i>对投诉客户实行"退款+赠送双人餐"补偿</li>
<li><i data-lucide="check"></i>鼓励客户在小红书/抖音分享用餐体验凭截图兑换10元优惠券</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<!-- 线上营销 -->
<div class="stack-card">
<div class="stack-card-header">
<div class="stack-card-icon">
<i data-lucide="smartphone" style="display: inline-block; width: 32px; height: 32px;"></i>
</div>
<h3 class="stack-card-title">线上营销</h3>
</div>
<div class="stack-card-content">
<div class="stack-card-body">
<div style="display: grid; gap: 24px;">
<div>
<h4 style="font-size: 18px; font-weight: 600; color: var(--text-primary); margin-bottom: 12px; display: flex; align-items: center; gap: 8px;">
<i data-lucide="share-2" style="width: 20px; height: 20px;"></i>
社交媒体运营
</h4>
<div style="display: grid; gap: 16px;">
<div>
<p style="font-weight: 600; margin-bottom: 8px;">📱 微信公众号</p>
<ul class="feature-list">
<li><i data-lucide="check"></i>每周更新3篇内容2篇营养知识 + 1篇产品推荐</li>
<li><i data-lucide="check"></i>粉丝增长目标开业3个月达5000人</li>
</ul>
</div>
<div>
<p style="font-weight: 600; margin-bottom: 8px;">📹 抖音/小红书</p>
<ul class="feature-list">
<li><i data-lucide="check"></i>每周发布2条短视频制作过程 + 客户反馈)</li>
<li><i data-lucide="check"></i>合作10万粉丝以上美食/健身博主每月2-3位</li>
<li><i data-lucide="check"></i>单次推广目标带来订单增长20%</li>
</ul>
</div>
</div>
</div>
<div>
<h4 style="font-size: 18px; font-weight: 600; color: var(--text-primary); margin-bottom: 12px; display: flex; align-items: center; gap: 8px;">
<i data-lucide="shopping-bag" style="width: 20px; height: 20px;"></i>
外卖平台运营
</h4>
<ul class="feature-list">
<li><i data-lucide="check"></i>入驻美团、饿了么,设置"新客立减15元""满60减20元"活动</li>
<li><i data-lucide="check"></i>配送时效承诺30分钟内超时免单</li>
<li><i data-lucide="check"></i>外卖包装标注"食材新鲜度追溯码"</li>
<li><i data-lucide="check"></i>目标上线1个月内平台评分达4.8分以上月外卖订单量达2000单</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<!-- 线下推广 -->
<div class="stack-card">
<div class="stack-card-header">
<div class="stack-card-icon">
<i data-lucide="map-pin" style="display: inline-block; width: 32px; height: 32px;"></i>
</div>
<h3 class="stack-card-title">线下推广</h3>
</div>
<div class="stack-card-content">
<div class="stack-card-body">
<div style="display: grid; gap: 24px;">
<div>
<h4 style="font-size: 18px; font-weight: 600; color: var(--text-primary); margin-bottom: 12px; display: flex; align-items: center; gap: 8px;">
<i data-lucide="target" style="width: 20px; height: 20px;"></i>
精准触达
</h4>
<div style="display: grid; gap: 16px;">
<div>
<p style="font-weight: 600; margin-bottom: 8px;">🏢 写字楼推广</p>
<ul class="feature-list">
<li><i data-lucide="check"></i>每周一、三在目标写字楼发放传单500份/天</li>
<li><i data-lucide="check"></i>传单附"满50减10元"优惠券有效期7天</li>
</ul>
</div>
<div>
<p style="font-weight: 600; margin-bottom: 8px;">💪 健身房合作</p>
<ul class="feature-list">
<li><i data-lucide="check"></i>与周边3-5家健身房达成合作</li>
<li><i data-lucide="check"></i>健身卡办卡用户可获"轻食体验券价值45元"</li>
<li><i data-lucide="check"></i>健身房会员凭卡到店消费享9折优惠</li>
</ul>
</div>
</div>
</div>
<div>
<h4 style="font-size: 18px; font-weight: 600; color: var(--text-primary); margin-bottom: 12px; display: flex; align-items: center; gap: 8px;">
<i data-lucide="calendar" style="width: 20px; height: 20px;"></i>
体验活动
</h4>
<ul class="feature-list">
<li><i data-lucide="check"></i>每月举办1次"轻食体验日"邀请20-30位潜在客户</li>
<li><i data-lucide="check"></i>现场安排营养师讲解"轻食搭配技巧"</li>
<li><i data-lucide="check"></i>收集反馈率需达80%以上</li>
<li><i data-lucide="check"></i>转化试吃客户为会员的比例目标30%</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<!-- 会员制度 -->
<div class="stack-card">
<div class="stack-card-header">
<div class="stack-card-icon">
<i data-lucide="users" style="display: inline-block; width: 32px; height: 32px;"></i>
</div>
<h3 class="stack-card-title">会员制度</h3>
</div>
<div class="stack-card-content">
<div class="stack-card-body">
<div style="display: grid; gap: 24px;">
<div>
<h4 style="font-size: 18px; font-weight: 600; color: var(--text-primary); margin-bottom: 12px; display: flex; align-items: center; gap: 8px;">
<i data-lucide="gift" style="width: 20px; height: 20px;"></i>
会员权益
</h4>
<div style="display: grid; gap: 16px;">
<div>
<p style="font-weight: 600; margin-bottom: 8px;">💰 充值优惠</p>
<ul class="feature-list">
<li><i data-lucide="check"></i>充值200元送30元</li>
<li><i data-lucide="check"></i>充值500元送100元</li>
<li><i data-lucide="check"></i>充值1000元送250元</li>
</ul>
</div>
<div>
<p style="font-weight: 600; margin-bottom: 8px;">🎁 消费福利</p>
<ul class="feature-list">
<li><i data-lucide="check"></i>会员消费享9折</li>
<li><i data-lucide="check"></i>生日当天送"免费定制餐+小蛋糕"</li>
<li><i data-lucide="check"></i>积分1元=1分100分可兑换价值25元的经典沙拉</li>
</ul>
</div>
<div>
<p style="font-weight: 600; margin-bottom: 8px;">⭐ 专属服务</p>
<ul class="feature-list">
<li><i data-lucide="check"></i>优先体验新品</li>
<li><i data-lucide="check"></i>免费获取"个性化营养食谱"(营养师根据会员体重/目标定制)</li>
</ul>
</div>
</div>
</div>
<div>
<h4 style="font-size: 18px; font-weight: 600; color: var(--text-primary); margin-bottom: 12px; display: flex; align-items: center; gap: 8px;">
<i data-lucide="trending-up" style="width: 20px; height: 20px;"></i>
会员增长目标
</h4>
<div class="stats">
<div class="stat-item">
<div class="stat-label">开业1个月</div>
<div class="stat-value">300人</div>
</div>
<div class="stat-item">
<div class="stat-label">开业3个月</div>
<div class="stat-value">800人</div>
</div>
<div class="stat-item">
<div class="stat-label">开业1年</div>
<div class="stat-value">2000人</div>
</div>
<div class="stat-item">
<div class="stat-label">会员复购率</div>
<div class="stat-value">60%+</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Section 6: 团队建设 -->
<section class="section" id="team">
<div class="container">
<div class="section-header">
<img class="agent-avatar" src="agent-avatars/餐饮团队人员管理专家.jpeg" alt="Agent"
onerror="this.src='data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2280%22 height=%2280%22 viewBox=%220 0 80 80%22%3E%3Crect width=%2280%22 height=%2280%22 fill=%22%23f0f0e8%22/%3E%3Ctext x=%2250%25%22 y=%2250%25%22 dominant-baseline=%22middle%22 text-anchor=%22middle%22 font-size=%2232%22%3E🤖%3C/text%3E%3C/svg%3E'">
<div class="agent-info">
<div class="agent-name">
<i data-lucide="bot"></i>
Agent 06 · 团队建设专家
</div>
<h2 class="section-title">团队架构与人才培养</h2>
</div>
</div>
<div class="section-content">
<div class="expert-intro">
<h3>
<i data-lucide="users"></i>
专家团队方案
</h3>
<p>建立"精简高效"的团队架构,单店配置8-12人。核心岗位包括店长、营养师、主厨、备餐师、收银员、配送员。店长负责整体运营,营养师提供专业咨询,主厨保证出品品质。建立完善的培训体系,新员工经过7天岗前培训+14天实操带教方能上岗。</p>
</div>
<!-- 网格+高亮布局 -->
<div class="featured-grid">
<!-- 店长 - 高亮显示 -->
<div class="featured-item">
<div class="featured-image">
<img data-src="images/店长.jpg" alt="店长">
<div class="featured-badge">核心岗位</div>
</div>
<div class="featured-info">
<div class="featured-title">店长</div>
<div class="featured-desc">负责店铺整体运营管理包括人员调度、库存管理、销售目标制定与执行。需具备3年以上餐饮管理经验熟悉轻食业态。</div>
</div>
</div>
<!-- 主厨 -->
<div class="featured-item">
<div class="featured-image">
<img data-src="images/厨师.jpg" alt="主厨">
</div>
<div class="featured-info">
<div class="featured-title">主厨</div>
<div class="featured-desc">菜品制作与品控</div>
</div>
</div>
<!-- 服务员 -->
<div class="featured-item">
<div class="featured-image">
<img data-src="images/服务员.jpg" alt="服务员">
</div>
<div class="featured-info">
<div class="featured-title">服务员</div>
<div class="featured-desc">前台接待与服务</div>
</div>
</div>
<!-- 收银员 -->
<div class="featured-item">
<div class="featured-image">
<img data-src="images/收银员.jpg" alt="收银员">
</div>
<div class="featured-info">
<div class="featured-title">收银员</div>
<div class="featured-desc">前台收银与管理</div>
</div>
</div>
<!-- 备餐师 -->
<div class="featured-item">
<div class="featured-image">
<img data-src="images/员工着装以及切配规范.jpg" alt="备餐师">
</div>
<div class="featured-info">
<div class="featured-title">备餐师</div>
<div class="featured-desc">食材准备与辅助</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Section 7: 财务规划 -->
<section class="section" id="finance">
<div class="container">
<div class="section-header">
<img class="agent-avatar" src="agent-avatars/财务预算专家.jpeg" alt="Agent"
onerror="this.src='data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2280%22 height=%2280%22 viewBox=%220 0 80 80%22%3E%3Crect width=%2280%22 height=%2280%22 fill=%22%23f0f0e8%22/%3E%3Ctext x=%2250%25%22 y=%2250%25%22 dominant-baseline=%22middle%22 text-anchor=%22middle%22 font-size=%2232%22%3E🤖%3C/text%3E%3C/svg%3E'">
<div class="agent-info">
<div class="agent-name">
<i data-lucide="bot"></i>
Agent 07 · 财务分析专家
</div>
<h2 class="section-title">财务规划与投资回报</h2>
</div>
</div>
<div class="section-content">
<div class="expert-intro">
<h3>
<i data-lucide="dollar-sign"></i>
专家财务分析
</h3>
<p>基于保守预估模型,单店初期投资约50万元,包括装修、设备、首批物料、营运资金。月度运营成本约15万元,涵盖租金、人力、食材、水电等。预计开业3个月后实现盈亏平衡,月营业额达20万元,月净利润4-6万元,ROI约12-15个月。</p>
</div>
<!-- 垂直分栏布局 -->
<div class="vertical-stack">
<!-- 初期投资预算 -->
<div class="stack-card" data-bg-image style="--bg-image: url('images/菜品备制.jpg')">
<div class="stack-card-header">
<div class="stack-card-icon">
<i data-lucide="banknote" style="display: inline-block; width: 32px; height: 32px;"></i>
</div>
<h3 class="stack-card-title">初期投资预算总投资50万元</h3>
</div>
<div class="stack-card-content">
<div class="stack-card-body">
<div class="table-container">
<table>
<thead>
<tr>
<th>项目</th>
<th style="text-align: right;">金额(万元)</th>
<th>明细说明</th>
</tr>
</thead>
<tbody>
<tr>
<td>店铺租赁</td>
<td style="text-align: right;">15</td>
<td>押三付一月租5万元一线城市核心区100㎡</td>
</tr>
<tr>
<td>装修费用</td>
<td style="text-align: right;">15</td>
<td>1500元/㎡×100㎡含设计费、材料与施工</td>
</tr>
<tr>
<td>设备采购</td>
<td style="text-align: right;">10</td>
<td>冷藏柜2台3万、烤箱1台1.5万、操作台2套1万、收银系统1套1.5万、其他设备3万</td>
</tr>
<tr>
<td>食材采购</td>
<td style="text-align: right;">3</td>
<td>开业前首批食材,含有机蔬菜、肉类、酱料等</td>
</tr>
<tr>
<td>人员招聘与培训</td>
<td style="text-align: right;">2</td>
<td>招聘渠道费、入职培训物料、营养师兼职费</td>
</tr>
<tr>
<td>市场推广</td>
<td style="text-align: right;">3</td>
<td>开业活动、线上推广、传单制作等</td>
</tr>
<tr>
<td>其他费用</td>
<td style="text-align: right;">2</td>
<td>营业执照办理0.5万、备用金1.5万)</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
<!-- 收入预测 -->
<div class="stack-card" data-bg-image style="--bg-image: url('images/牛排烹饪.jpg')">
<div class="stack-card-header">
<div class="stack-card-icon">
<i data-lucide="trending-up" style="display: inline-block; width: 32px; height: 32px;"></i>
</div>
<h3 class="stack-card-title">收入预测(第一年)</h3>
</div>
<div class="stack-card-content">
<div class="stack-card-body">
<div class="table-container">
<table>
<thead>
<tr>
<th>周期</th>
<th style="text-align: right;">日均订单量</th>
<th style="text-align: right;">客单价(元)</th>
<th style="text-align: right;">月收入(万元)</th>
<th style="text-align: right;">季度收入(万元)</th>
<th style="text-align: right;">年度收入(万元)</th>
</tr>
</thead>
<tbody>
<tr>
<td>1-3月初期</td>
<td style="text-align: right;">90</td>
<td style="text-align: right;">50</td>
<td style="text-align: right;">13.5</td>
<td style="text-align: right;">40.5</td>
<td style="text-align: right;">-</td>
</tr>
<tr>
<td>4-6月增长期</td>
<td style="text-align: right;">135</td>
<td style="text-align: right;">52</td>
<td style="text-align: right;">20.52</td>
<td style="text-align: right;">61.56</td>
<td style="text-align: right;">-</td>
</tr>
<tr>
<td>7-12月稳定期</td>
<td style="text-align: right;">190</td>
<td style="text-align: right;">55</td>
<td style="text-align: right;">31.35</td>
<td style="text-align: right;">188.1</td>
<td style="text-align: right;">-</td>
</tr>
<tr>
<td><strong>合计</strong></td>
<td style="text-align: right;">-</td>
<td style="text-align: right;">-</td>
<td style="text-align: right;">-</td>
<td style="text-align: right;">-</td>
<td style="text-align: right;"><strong>290.16</strong></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
<!-- 成本分析 -->
<div class="stack-card" data-bg-image style="--bg-image: url('images/餐盒包装.jpg')">
<div class="stack-card-header">
<div class="stack-card-icon">
<i data-lucide="bar-chart-3" style="display: inline-block; width: 32px; height: 32px;"></i>
</div>
<h3 class="stack-card-title">成本分析(第一年)</h3>
</div>
<div class="stack-card-content">
<div class="stack-card-body">
<div class="table-container">
<table>
<thead>
<tr>
<th>成本类型</th>
<th style="text-align: right;">占收入比例</th>
<th style="text-align: right;">金额(万元)</th>
<th>明细说明</th>
</tr>
</thead>
<tbody>
<tr>
<td>食材成本</td>
<td style="text-align: right;">35%</td>
<td style="text-align: right;">101.56</td>
<td>按收入35%计算含食材损耗控制在5%以内)</td>
</tr>
<tr>
<td>租金成本</td>
<td style="text-align: right;">12%</td>
<td style="text-align: right;">34.82</td>
<td>月租5万元×12个月</td>
</tr>
<tr>
<td>人工成本</td>
<td style="text-align: right;">20%</td>
<td style="text-align: right;">58.03</td>
<td>月均人工成本5.3万元×11个月首月培训期按80%计算)</td>
</tr>
<tr>
<td>水电费</td>
<td style="text-align: right;">3%</td>
<td style="text-align: right;">8.70</td>
<td>月均0.725万元(厨房设备+空调用电)</td>
</tr>
<tr>
<td>设备折旧费</td>
<td style="text-align: right;">5%</td>
<td style="text-align: right;">14.51</td>
<td>设备总投资10万元按5年折旧残值率5%</td>
</tr>
<tr>
<td>其他费用</td>
<td style="text-align: right;">5%</td>
<td style="text-align: right;">14.51</td>
<td>含平台佣金3%、耗材1%、维修1%</td>
</tr>
<tr>
<td><strong>总成本</strong></td>
<td style="text-align: right;">-</td>
<td style="text-align: right;"><strong>232.13</strong></td>
<td>-</td>
</tr>
</tbody>
</table>
</div>
<div class="stats mt-lg">
<div class="stat-item">
<div class="stat-label">第一年营业额</div>
<div class="stat-value">290.16万</div>
</div>
<div class="stat-item">
<div class="stat-label">第一年净利润</div>
<div class="stat-value">58.03万</div>
</div>
<div class="stat-item">
<div class="stat-label">投资回收期</div>
<div class="stat-value">10-11个月</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Section 8: 风险管理 -->
<section class="section" id="risk">
<div class="container">
<div class="section-header">
<img class="agent-avatar" src="agent-avatars/风险管理专家.jpeg" alt="Agent"
onerror="this.src='data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2280%22 height=%2280%22 viewBox=%220 0 80 80%22%3E%3Crect width=%2280%22 height=%2280%22 fill=%22%23f0f0e8%22/%3E%3Ctext x=%2250%25%22 y=%2250%25%22 dominant-baseline=%22middle%22 text-anchor=%22middle%22 font-size=%2232%22%3E🤖%3C/text%3E%3C/svg%3E'">
<div class="agent-info">
<div class="agent-name">
<i data-lucide="bot"></i>
Agent 08 · 风险管理专家
</div>
<h2 class="section-title">风险管理与应对</h2>
</div>
</div>
<div class="section-content">
<div class="expert-intro">
<h3>
<i data-lucide="shield-alert"></i>
专家风险评估
</h3>
<p>在轻食行业经营过程中,需要重点关注市场风险、竞争风险和食品安全风险三大类风险。通过建立完善的风险预警机制、制定应急预案、购买保险等方式,可以有效降低风险发生概率,最小化损失影响。以下针对三大核心风险提供系统化的应对方案。</p>
</div>
<!-- 市场风险 -->
<div class="alternating-layout">
<div class="alternating-image">
<img data-src="images/菜品备制.jpg" alt="市场风险应对">
</div>
<div class="alternating-content">
<h3>
<i data-lucide="bar-chart-3"></i>
市场风险
</h3>
<p><strong>风险表现:</strong> 季节变化(冬季轻食需求下降15-20%)、消费者偏好转移(如"生酮饮食"等新趋势冲击)</p>
<p><strong>应对措施:</strong></p>
<ul class="feature-list">
<li><i data-lucide="check"></i>季节调整: 冬季推出"热能量碗""轻食汤品"(占菜单40%),搭配"暖饮套餐"</li>
<li><i data-lucide="check"></i>趋势跟进: 每季度联合营养师调研新饮食趋势</li>
<li><i data-lucide="check"></i>菜品更新: 每年更新20%菜品(如"生酮友好轻食""高蛋白植物基轻食")</li>
</ul>
</div>
</div>
<!-- 竞争风险 -->
<div class="alternating-layout reverse">
<div class="alternating-image">
<img data-src="images/市场宣传营销.jpg" alt="竞争风险应对">
</div>
<div class="alternating-content">
<h3>
<i data-lucide="swords"></i>
竞争风险
</h3>
<p><strong>风险表现:</strong> 周边新增连锁轻食品牌(如Wagas分店)、本地店铺打"低价战"(客单价30元以下)</p>
<p><strong>应对措施:</strong></p>
<ul class="feature-list">
<li><i data-lucide="check"></i>差异化竞争: 每月推出1款"限定新品",比同类竞品价格低5%</li>
<li><i data-lucide="check"></i>品质标注: 标注"有机食材占比"突出品质优势</li>
<li><i data-lucide="check"></i>会员锁定: 针对竞品客户推出"转会员福利"(20元优惠券+免费营养咨询)</li>
</ul>
</div>
</div>
<!-- 食品安全风险 -->
<div class="alternating-layout">
<div class="alternating-image">
<img data-src="images/食材变质-1.jpg" alt="食品安全风险管理">
</div>
<div class="alternating-content">
<h3>
<i data-lucide="lock"></i>
食品安全风险
</h3>
<p><strong>风险表现:</strong> 食材变质(如夏季蔬菜腐烂)、加工污染(如操作人员未按规范洗手)、配送过程温控失效</p>
<p><strong>应对措施:</strong></p>
<ul class="feature-list">
<li><i data-lucide="check"></i>事前防控: 购买食品安全责任险(年保费2000元),每月第三方食材检测</li>
<li><i data-lucide="check"></i>事中管控: 厨房监控实时监督,配送箱每单消毒+温控报警器</li>
<li><i data-lucide="check"></i>事后处理: 立即召回同批次产品,赔偿"订单金额3倍+免费餐券"</li>
<li><i data-lucide="check"></i>透明整改: 公开整改报告,重建客户信任</li>
</ul>
</div>
</div>
</div>
</div>
</section>
<!-- 外部脚本 -->
<script src="js/main.js"></script>
</body>
</html>