// 江中猴菇饮 v2 · Ch6 行动蓝图（3 子章）
//   6.1 P0 行动 · 产品/渠道/话术立即落地
//   6.2 P1 验证 · 3个月内数据闭环
//   6.3 数据缺口 × 下一轮采集计划

const HGY = require('./houguyin-analyze.js');
const C = require('./houguyin-components.js');
const { BRAND, esc, renderSectionHead } = C;

// ================================================================
// 6.1 · P0 行动 · 产品/渠道/话术立即落地
// ================================================================
function renderSub1(ctx) {
    const { chapter: c, subIdx, slideNum, slideTotal } = ctx;

    const actions = [
        { id: 'P0-1', action: '定位话术定稿', owner: '品牌部', deadline: '1 周',
          detail: '"中国第一款 OTC 养胃饮" → 包装/物料/店员话术统一', priority: 'P0', color: BRAND.CORAL },
        { id: 'P0-2', action: '药店渠道首批铺货', owner: '渠道部', deadline: '2 周',
          detail: '选 100 家药店试点，搭配"买胃药送猴菇饮体验装"', priority: 'P0', color: BRAND.CORAL },
        { id: 'P0-3', action: '店员推荐话术培训', owner: '销售部', deadline: '2 周',
          detail: '"顾客买奥美拉唑时，推荐搭配猴菇饮做减量伴侣"', priority: 'P0', color: BRAND.CORAL },
        { id: 'P0-4', action: 'SKU 规格确认', owner: '产品部', deadline: '1 周',
          detail: '单支装（药店试饮）+ 6 支装（日常）+ 12 支礼盒装', priority: 'P0', color: BRAND.CORAL },
        { id: 'P1-1', action: '电商详情页改版', owner: '电商部', deadline: '1 月',
          detail: '突出 OTC 身份 + 场景化卖点（办公室/差旅/减药期）', priority: 'P1', color: BRAND.WARM_ORANGE },
        { id: 'P1-2', action: '小红书种草测试', owner: '新媒体', deadline: '1 月',
          detail: '20 篇 KOC 笔记测试"OTC 养胃饮"认知接受度', priority: 'P1', color: BRAND.WARM_ORANGE },
        { id: 'P1-3', action: '"送胃"礼盒设计', owner: '设计部', deadline: '2 月',
          detail: '对标东阿阿胶礼品装，¥198-398 双规格', priority: 'P1', color: BRAND.WARM_ORANGE },
        { id: 'P1-4', action: '糖友无糖版可行性', owner: '研发部', deadline: '3 月',
          detail: '蔗糖替代方案 + 口感测试 + 成本评估', priority: 'P1', color: BRAND.WARM_ORANGE },
    ];

    return `<section class="report-section" id="${c.key}-${subIdx}" data-tone="${c.tone}" data-slide-num="${slideNum}/${slideTotal}">
  <div class="section-inner">
    ${renderSectionHead({
        eyebrow: `${c.num}.${subIdx} · 行动蓝图`,
        title: 'P0 + P1 · <span style="color:' + BRAND.SAGE + ';">8 项行动</span>清单',
        subtitle: '从洞察到落地的最短路径。P0 = 2 周内必须启动，P1 = 3 个月内完成。',
        color: BRAND.SAGE,
    })}

    <div style="margin-top:24px;">
      <table style="width:100%; border-collapse:collapse; font-size:0.82rem;">
        <thead>
          <tr style="background:var(--bg-2);">
            <th style="padding:8px 10px; text-align:left; width:50px;">编号</th>
            <th style="padding:8px 10px; text-align:left;">行动项</th>
            <th style="padding:8px 10px; text-align:left; width:80px;">负责人</th>
            <th style="padding:8px 10px; text-align:left; width:60px;">期限</th>
            <th style="padding:8px 10px; text-align:left;">具体内容</th>
            <th style="padding:8px 10px; text-align:center; width:50px;">优先级</th>
          </tr>
        </thead>
        <tbody>
          ${actions.map(a => `
          <tr style="border-bottom:1px solid var(--border);">
            <td style="padding:8px 10px; font-weight:700; color:${a.color};">${a.id}</td>
            <td style="padding:8px 10px; font-weight:600; color:var(--text-1);">${esc(a.action)}</td>
            <td style="padding:8px 10px; color:var(--text-2);">${esc(a.owner)}</td>
            <td style="padding:8px 10px; color:var(--text-2);">${esc(a.deadline)}</td>
            <td style="padding:8px 10px; color:var(--text-2); font-size:0.78rem;">${esc(a.detail)}</td>
            <td style="padding:8px 10px; text-align:center;">
              <span style="padding:2px 8px; border-radius:10px; font-weight:700; font-size:0.72rem;
                background:${a.priority === 'P0' ? BRAND.CORAL + '15' : BRAND.WARM_ORANGE + '15'};
                color:${a.priority === 'P0' ? BRAND.CORAL : BRAND.WARM_ORANGE};">${a.priority}</span>
            </td>
          </tr>`).join('')}
        </tbody>
      </table>
    </div>
  </div>
</section>`;
}

// ================================================================
// 6.2 · P1 验证 · 3个月内数据闭环
// ================================================================
function renderSub2(ctx) {
    const { chapter: c, subIdx, slideNum, slideTotal } = ctx;

    const milestones = [
        { month: 'M1', title: '渠道验证', metrics: ['100 家药店动销率 > 15%', '店员推荐转化率 > 8%', '试饮→购买转化 > 20%'],
          decision: '动销率 <10% → 调整话术/陈列；<5% → 重新评估渠道', color: BRAND.SAGE },
        { month: 'M2', title: '认知验证', metrics: ['小红书 20 篇 KOC 笔记互动率', '"OTC 养胃饮"搜索量变化', '电商详情页转化率 vs 旧版'],
          decision: '互动率 <2% → 调整内容角度；搜索量无变化 → 品类教育不够', color: BRAND.JIANG_GREEN },
        { month: 'M3', title: '数据复盘', metrics: ['累计 GMV vs 5000万/12 月度目标', '复购率（关键指标）', 'NPS 净推荐值'],
          decision: '复购率 <15% → 产品体验有问题；NPS <30 → 定位偏差', color: BRAND.TECH_BLUE },
    ];

    return `<section class="report-section" id="${c.key}-${subIdx}" data-tone="${c.tone}" data-slide-num="${slideNum}/${slideTotal}">
  <div class="section-inner">
    ${renderSectionHead({
        eyebrow: `${c.num}.${subIdx} · 行动蓝图`,
        title: '3 个月验证 · <span style="color:' + BRAND.JIANG_GREEN + ';">数据闭环</span>',
        subtitle: '每个月有明确的验证指标和决策节点。不盲目扩张，用数据说话。',
        color: BRAND.JIANG_GREEN,
    })}

    <div style="margin-top:24px; display:flex; flex-direction:column; gap:16px;">
      ${milestones.map(m => `
      <div style="padding:20px; background:var(--bg-1); border:1px solid var(--border); border-radius:var(--radius-md); border-left:5px solid ${m.color};">
        <div style="display:flex; justify-content:space-between; align-items:center; margin-bottom:12px;">
          <div>
            <span style="font-family:var(--font-head); font-size:1.3rem; font-weight:900; color:${m.color};">${m.month}</span>
            <span style="font-weight:700; font-size:0.95rem; color:var(--text-1); margin-left:10px;">${esc(m.title)}</span>
          </div>
        </div>
        <div style="display:grid; grid-template-columns:1fr 1fr; gap:12px;">
          <div>
            <div style="font-size:0.72rem; color:${m.color}; font-weight:700; margin-bottom:6px;">验证指标</div>
            <ul style="margin:0; padding-left:16px; font-size:0.82rem; color:var(--text-1); line-height:1.7;">
              ${m.metrics.map(metric => `<li>${esc(metric)}</li>`).join('')}
            </ul>
          </div>
          <div>
            <div style="font-size:0.72rem; color:${BRAND.WARM_ORANGE}; font-weight:700; margin-bottom:6px;">决策规则</div>
            <div style="font-size:0.8rem; color:var(--text-2); line-height:1.6;">${esc(m.decision)}</div>
          </div>
        </div>
      </div>`).join('')}
    </div>
  </div>
</section>`;
}

// ================================================================
// 6.3 · 数据缺口 × 下一轮采集计划
// ================================================================
function renderSub3(ctx) {
    const { chapter: c, subIdx, slideNum, slideTotal, meta } = ctx;

    const gaps = [
        { gap: '药店店员真实推荐行为', current: '无直接数据', needed: '20 家药店店员深访',
          impact: '决定店员话术培训方案', priority: '高', color: BRAND.CORAL },
        { gap: 'PPI 减量期用户真实体验', current: 'VOC 中间接提及', needed: '30 人深度访谈',
          impact: '验证"减量伴侣"场景是否成立', priority: '高', color: BRAND.CORAL },
        { gap: '猴菇饮口感/体验反馈', current: '产品未上市', needed: '100 人盲测',
          impact: '确认"好喝"是否成立', priority: '高', color: BRAND.CORAL },
        { gap: '糖友胃病人群规模', current: 'H7 假设未验证', needed: '医疗数据交叉分析',
          impact: '无糖版是否值得开发', priority: '中', color: BRAND.WARM_ORANGE },
        { gap: '礼品场景购买意愿', current: 'H8 假设/少量 VOC', needed: '礼品消费者调研',
          impact: '礼盒装定价/设计方向', priority: '中', color: BRAND.WARM_ORANGE },
    ];

    return `<section class="report-section" id="${c.key}-${subIdx}" data-tone="${c.tone}" data-slide-num="${slideNum}/${slideTotal}">
  <div class="section-inner">
    ${renderSectionHead({
        eyebrow: `${c.num}.${subIdx} · 行动蓝图`,
        title: '数据缺口 × <span style="color:' + BRAND.WARM_ORANGE + ';">下一轮采集</span>计划',
        subtitle: '本报告基于 ${meta?.comments || "—"} 条 VOC。以下结论还需要补充数据来夯实。',
        color: BRAND.WARM_ORANGE,
    })}

    <div style="margin-top:24px;">
      <table style="width:100%; border-collapse:collapse; font-size:0.82rem;">
        <thead>
          <tr style="background:var(--bg-2);">
            <th style="padding:8px 10px; text-align:left;">数据缺口</th>
            <th style="padding:8px 10px; text-align:left;">当前状态</th>
            <th style="padding:8px 10px; text-align:left;">需要什么</th>
            <th style="padding:8px 10px; text-align:left;">影响决策</th>
            <th style="padding:8px 10px; text-align:center; width:60px;">优先级</th>
          </tr>
        </thead>
        <tbody>
          ${gaps.map(g => `
          <tr style="border-bottom:1px solid var(--border);">
            <td style="padding:8px 10px; font-weight:600; color:${g.color};">${esc(g.gap)}</td>
            <td style="padding:8px 10px; color:var(--text-3);">${esc(g.current)}</td>
            <td style="padding:8px 10px; color:var(--text-1);">${esc(g.needed)}</td>
            <td style="padding:8px 10px; color:var(--text-2);">${esc(g.impact)}</td>
            <td style="padding:8px 10px; text-align:center;">
              <span style="padding:2px 8px; border-radius:10px; font-weight:700; font-size:0.72rem;
                background:${g.priority === '高' ? BRAND.CORAL + '15' : BRAND.WARM_ORANGE + '15'};
                color:${g.priority === '高' ? BRAND.CORAL : BRAND.WARM_ORANGE};">${g.priority}</span>
            </td>
          </tr>`).join('')}
        </tbody>
      </table>
    </div>

    <!-- 总结 -->
    <div style="margin-top:20px; padding:16px 20px; background:${BRAND.JIANG_GREEN}08; border:2px solid ${BRAND.JIANG_GREEN}40; border-radius:var(--radius-md);">
      <div style="font-size:0.88rem; color:var(--text-1); line-height:1.7;">
        <strong style="color:${BRAND.JIANG_GREEN};">本报告的价值边界</strong>：基于 VOC 数据的洞察已经完成了<strong>"方向判断"</strong>——猴菇饮应该定位为"OTC 养胃饮"，聚焦轻度胃不适+日常养护人群，通过药店渠道切入。但<strong>"定量验证"</strong>（口感盲测/店员行为/减量场景）需要下一阶段的实地调研来完成。
      </div>
    </div>
  </div>
</section>`;
}

module.exports = { renderSub1, renderSub2, renderSub3 };