/** * Plaza page HTML — matches john 公开区 style (探索世界 / TKMind 发布页). * Dark immersive hero + glass cards + gradient accent text. CSP-safe, no JS. */ const CSP = "default-src 'none'; style-src 'unsafe-inline' https:; img-src data: https:; font-src https: data:; base-uri 'none'; form-action 'none'; script-src 'none'"; function esc(s) { return String(s ?? '') .replace(/&/g, '&') .replace(//g, '>') .replace(/"/g, '"'); } /** @param {object} opts */ export function buildJohnPage(opts) { const { title, description, tag, tagEmoji = '✦', accent = '#2d7d6a', accent2 = '#4ecdc4', bgDark = '#0a1628', heroImage, heroTitleHtml, heroSubtitle, heroBtn = '了解更多', sections = [], footer = 'Powered by TKMind', } = opts; const coverMeta = JSON.stringify({ tag: tag ?? title, emoji: tagEmoji, accent, accent2: bgDark, subtitle: heroSubtitle?.slice(0, 80) ?? title, cover: heroImage?.includes('unsplash') ? heroImage.replace('w=1600', 'w=800') : '', }).replace(/'/g, '''); const sectionHtml = sections .map((sec) => { if (sec.type === 'cards') { return `

${esc(sec.title)}

${sec.hint ? `

${esc(sec.hint)}

` : ''}
${sec.items .map( (c) => `
${c.img ? `
` : ''}

${esc(c.title)}

${c.location ? `
${esc(c.location)}
` : ''}

${esc(c.desc)}

${c.tag ? `${esc(c.tag)}` : ''}
`, ) .join('')}
`; } if (sec.type === 'metrics') { return `

${esc(sec.title)}

${sec.hint ? `

${sec.hint}

` : ''}
${sec.items .map( (m) => `
${esc(m.value)}
${esc(m.label)}
${m.note ? `

${esc(m.note)}

` : ''}
`, ) .join('')}
`; } if (sec.type === 'quote') { return `
${sec.html}
`; } return `

${esc(sec.title)}

${sec.hint ? `

${esc(sec.hint)}

` : ''}
${sec.html ?? ''}
`; }) .join('\n'); return ` ${esc(title)}
${tagEmoji} ${esc(tag)}

${heroTitleHtml}

${esc(heroSubtitle)}

${esc(heroBtn)}
${sectionHtml} `; } const IMG = { travel: 'https://images.unsplash.com/photo-1480796925566-7970b0633882?w=1600&q=80', malaysia: 'https://images.unsplash.com/photo-1596422846544-75c675fcd5d0?w=1600&q=80', kyoto: 'https://images.unsplash.com/photo-1493976040374-85c8e577f47e?w=1600&q=80', growth: 'https://images.unsplash.com/photo-1460925895917-afdab827c52f?w=1600&q=80', ai: 'https://images.unsplash.com/photo-1677440866019-21780ecad995?w=1600&q=80', supply: 'https://images.unsplash.com/photo-1586528116311-ad8dd3c8310d?w=1600&q=80', llm: 'https://images.unsplash.com/photo-1676299085922-0a9a504459f8?w=1600&q=80', rust: 'https://images.unsplash.com/photo-1515879214367-846362d3526?w=1600&q=80', cyber: 'https://images.unsplash.com/photo-1514565131-fce0801e5785?w=1600&q=80', music: 'https://images.unsplash.com/photo-1511379938544-be09687a4d4b?w=1600&q=80', desk: 'https://images.unsplash.com/photo-1497215842964-222b430dc094?w=1600&q=80', write: 'https://images.unsplash.com/photo-1455390582260-0446deae2f3f?w=1600&q=80', data: 'https://images.unsplash.com/photo-1551288049-bebda4e38f71?w=1600&q=80', coffee: 'https://images.unsplash.com/photo-1495474472287-4d71bcdd2085?w=1600&q=80', pilates: 'https://images.unsplash.com/photo-1518611012118-696072aa579a?w=1600&q=80', opensource: 'https://images.unsplash.com/photo-1555066931-4365d14bab8c?w=1600&q=80', wish: 'https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=1600&q=80', guide: 'https://images.unsplash.com/photo-1516321318423-f06f85e504b3?w=1600&q=80', }; /** post_id -> { summary, html, skipHtml? } */ export const ENRICHMENTS = { 'ea817fe6-fc46-491a-9f9a-f5638ff2299e': { summary: '12 类 Prompt 场景模板,参照 TKMind 公开页深色风格,附 CoT / JSON 输出范例。', html: buildJohnPage({ title: 'LLM Prompt 工程速查表', description: 'LLM Prompt 工程速查表', tag: '学习笔记', tagEmoji: '📚', accent: '#4ecdc4', accent2: '#2d7d6a', heroImage: IMG.llm, heroTitleHtml: 'Prompt 工程
速查表', heroSubtitle: '角色设定、Few-shot、CoT、结构化输出——一张表搞定常见场景。', heroBtn: '查看模板', sections: [ { type: 'metrics', title: '核心数据', hint: '团队内部 4 周样本', items: [ { value: '12', label: '场景模板', note: '写作 / 分析 / 代码 / 客服' }, { value: '68%', label: '迭代减少', note: '对比无框架 Prompt' }, { value: '3', label: '原则', note: '具体 · 约束 · 示例' }, ], }, { type: 'text', title: '框架对照', hint: '按场景选结构', html: `
场景结构关键句
复杂推理CoT + 分步请先列出假设,再逐步推导
稳定 JSONSchema + 示例仅输出 JSON,不要 markdown
风格迁移角色 + 反例不要像官方通稿,要像同事微信
你是一位资深产品分析师。基于下方数据输出 JSON: {"insights":[],"risk":"","next_step":""} 约束:不要编造未提供的数据。
`, }, { type: 'quote', html: '好 Prompt 不是更长,而是边界更清晰——输入是什么、输出长什么样、什么不能做。', }, ], }), }, '65aaa356-5197-4bf3-9491-da03c0d7313a': { summary: '用图书馆借书类比讲清 Rust ownership / borrow / lifetime,附自测题。', html: buildJohnPage({ title: 'Rust 所有权模型 15 分钟图解', description: 'Rust 所有权模型图解', tag: '学习笔记', tagEmoji: '🦀', accent: '#f97316', accent2: '#fb923c', heroImage: IMG.rust, heroTitleHtml: 'Rust 所有权
15 分钟图解', heroSubtitle: '不用背规则表——用生活类比一次搞懂 move、borrow 和 lifetime。', sections: [ { type: 'cards', title: '三个核心概念', hint: '图书馆借书类比', items: [ { title: 'Ownership', location: '📖 书籍归属', desc: '每本书同一时刻只有一个主人;赋值即转交。', tag: 'move' }, { title: 'Borrow', location: '🔖 临时借阅', desc: '&T 只读借阅;&mut T 独占写借阅。', tag: 'borrow' }, { title: 'Lifetime', location: '⏳ 借书条', desc: '编译器保证引用不会比数据活得更久。', tag: 'lifetime' }, ], }, { type: 'quote', html: 'Q: let s2 = s1; println!("{s1}"); 会怎样?
A: 编译错误——s1 已被 move 到 s2。', }, ], }), }, 'a02d114f-d565-4941-bf22-9534d71b7398': { summary: 'Q2 从 2.1 万 DAU 到 10.3 万:漏斗、渠道 ROI 与 3 个关键增长实验。', html: buildJohnPage({ title: 'Q2 产品增长复盘', description: 'Q2 产品增长复盘', tag: '职场报告', tagEmoji: '📊', accent: '#2d7d6a', accent2: '#4ecdc4', heroImage: IMG.growth, heroTitleHtml: 'Q2 增长 复盘', heroSubtitle: '从 2.1 万 DAU 到 10.3 万,拆解漏斗、渠道与关键实验。', sections: [ { type: 'metrics', title: '关键指标', items: [ { value: '10.3万', label: 'DAU', note: '+390% vs Q1' }, { value: '34%', label: 'D7 留存', note: '+6pp' }, { value: '1:3.2', label: 'LTV/CAC', note: '信息流获客' }, ], }, { type: 'quote', html: '最大杠杆:首次 24 小时内的模板引导——「一键生成周报」上线后激活率 +9pp。', }, ], }), }, 'eaf1b80b-667f-401b-ae90-6b740a878c21': { summary: 'AI 客服 30 天落地:自动解决率 61%,含周计划与踩坑记录。', html: buildJohnPage({ title: 'AI 客服落地 30 天执行报告', description: 'AI 客服 30 天执行报告', tag: '职场报告', tagEmoji: '🤖', accent: '#60a5fa', accent2: '#3b82f6', heroImage: IMG.ai, heroTitleHtml: 'AI 客服 30 天
落地报告', heroSubtitle: '从需求澄清、知识库搭建到全量上线,记录真实指标与踩坑。', sections: [ { type: 'metrics', title: '上线成果', items: [ { value: '61%', label: '自动解决率', note: 'W4 达成' }, { value: '6.2s', label: '平均首响', note: '较人工快 47 倍' }, { value: '4.6', label: 'CSAT', note: '5 分制' }, ], }, { type: 'cards', title: '执行里程碑', hint: '每周交付物', items: [ { title: 'W1 语料', desc: '清洗 1.2 万条工单,标注 8 大意图。', tag: '完成' }, { title: 'W2 知识库', desc: '政策/物流/售后三层结构上线。', tag: '完成' }, { title: 'W3 灰度', desc: '5% 流量,低置信度转人工。', tag: '完成' }, { title: 'W4 全量', desc: '峰值 QPS 120,排队时长 -38%。', tag: '完成' }, ], }, ], }), }, 'c6609c83-0557-481f-ad8b-9cbed2fd3b49': { summary: '供应链数字化周报第 18 期:周转 36 天、缺货率 1.8%。', html: buildJohnPage({ title: '供应链数字化周报 · 第 18 期', description: '供应链数字化周报', tag: '职场报告', tagEmoji: '🏭', accent: '#94a3b8', accent2: '#64748b', heroImage: IMG.supply, heroTitleHtml: '供应链 周报
第 18 期', heroSubtitle: '库存周转、缺货预警与供应商协同进展一览。', sections: [ { type: 'metrics', title: '本周指标', items: [ { value: '36天', label: '库存周转', note: '目标 ≤38天 ✓' }, { value: '1.8%', label: '缺货率', note: '-0.4pp' }, { value: '92%', label: '准时交货', note: 'TOP20 供应商' }, ], }, ], }), }, 'b883bd9e-f348-491b-aae3-e1085f48d878': { summary: '吉隆坡 + 槟城 5 日轻量路线,人均 ¥680/天,含美食与交通贴士。', html: buildJohnPage({ title: '马来西亚 5 日轻量旅行攻略', description: '马来西亚旅行攻略', tag: '旅行攻略', tagEmoji: '✈️', accent: '#2d7d6a', accent2: '#4ecdc4', heroImage: IMG.malaysia, heroTitleHtml: '马来西亚 5 日
轻量攻略', heroSubtitle: '吉隆坡都市感 + 槟城慢生活,适合第一次入境东南亚。', sections: [ { type: 'metrics', title: '行程概览', items: [ { value: '¥3,400', label: '人均预算', note: '舒适型' }, { value: '5天', label: '行程', note: 'KL 2 + 槟城 3' }, { value: '11km', label: '日步行', note: '轻松不赶路' }, ], }, { type: 'cards', title: '每日亮点', hint: '精选推荐', items: [ { img: 'https://images.unsplash.com/photo-1596422846544-75c675fcd5d0?w=600&q=60', title: '吉隆坡', location: '📍 双子塔 · 茨厂街', desc: '夜景 + 黑风洞半日。', tag: 'Day 1-2' }, { img: 'https://images.unsplash.com/photo-1585409670713-2f7eeeca9e84?w=600&q=60', title: '槟城', location: '📍 乔治市 · 升旗山', desc: '壁画街 + 榴莲宵夜。', tag: 'Day 3-5' }, ], }, ], }), }, 'e468a32f-8bb7-4663-b065-07042b5d1222': { summary: '京都红叶季 8 条小众散步路线 + 3 家深夜食堂。', html: buildJohnPage({ title: '京都红叶季小众散步地图', description: '京都红叶季散步地图', tag: '旅行攻略', tagEmoji: '🍁', accent: '#dc2626', accent2: '#f87171', heroImage: IMG.kyoto, heroTitleHtml: '京都 红叶季
散步地图', heroSubtitle: '避开人潮,专注可步行、可吃饭、可拍照的小众动线。', sections: [ { type: 'cards', title: '推荐路线', hint: '早出发避人流', items: [ { img: 'https://images.unsplash.com/photo-1493976040374-85c8e577f47e?w=600&q=60', title: '东山东坊 → 真如堂', location: '📍 07:30 出发', desc: '光线柔和,约 2.5 小时。', tag: '徒步' }, { img: 'https://images.unsplash.com/photo-1545569341-9f1cfc6129a1?w=600&q=60', title: '哲学之道北段', location: '📍 逆向步行', desc: '从银阁寺方向避开旅行团。', tag: '人文' }, { title: '先斗町深夜食堂', location: '📍 21:00 后', desc: '居酒屋不排队,推荐「一」。', tag: '美食' }, ], }, ], }), }, '964edee4-f1f8-4e86-92c1-e96d83955eb2': { summary: '赛博水墨城市主视觉:霓虹层 + 字体系统 + 社媒延展规格。', html: buildJohnPage({ title: '赛博水墨城市概念海报', description: '赛博水墨城市概念海报', tag: '创意作品', tagEmoji: '🎨', accent: '#c084fc', accent2: '#a855f7', bgDark: '#0f0a1a', heroImage: IMG.cyber, heroTitleHtml: '赛博 水墨
城市海报', heroSubtitle: '东方未来主义主 KV,适用于科技展与 AI 主题活动。', sections: [ { type: 'cards', title: '视觉规范', items: [ { title: '主色', desc: '#A855F7 · #6366F1 · 墨黑 #0A0A12', tag: '配色' }, { title: '字体', desc: '思源宋体 Heavy + Inter 正文', tag: '字体' }, { title: '输出', desc: '4:5 主海报 · 16:9 Banner · 1080 方图', tag: '规格' }, ], }, ], }), }, '463b66e2-0aa7-4f7f-96d9-bbd56a93bb00': { summary: 'EP《夜航船》封面摄影方向、霓虹蓝配色与巡演海报版式。', html: buildJohnPage({ title: '独立音乐人首张 EP 视觉方案', description: 'EP 视觉方案', tag: '创意作品', tagEmoji: '🎵', accent: '#818cf8', accent2: '#6366f1', bgDark: '#0a0a1a', heroImage: IMG.music, heroTitleHtml: 'EP 夜航船
视觉方案', heroSubtitle: '封面、流媒体横幅与巡演海报的统一视觉语言。', sections: [ { type: 'cards', title: '设计要素', items: [ { title: '摄影', desc: '长曝光车轨 + 单人侧影,主光 5600K。', tag: '封面' }, { title: '字体', desc: '造字工房力黑 + Bebas Neue。', tag: '排版' }, { title: '测试', desc: '55×55 缩略图仍可识别船形剪影。', tag: '可用性' }, ], }, ], }), }, '3497b24c-f8d2-4577-9a59-8a0751eb020a': { summary: '12 个桌面改造细节:光照、线缆、显示器高度与数字 Minimal。', html: buildJohnPage({ title: '极简桌面改造', description: '极简桌面改造', tag: '生活记录', tagEmoji: '🌿', accent: '#2d7d6a', accent2: '#4ecdc4', heroImage: IMG.desk, heroTitleHtml: '极简 桌面
改造指南', heroSubtitle: '12 个提升专注的细节,周末即可完成。', sections: [ { type: 'cards', title: '改造清单', hint: '按优先级排序', items: [ { title: '显示器高度', desc: '屏幕中心距桌面 15–20cm 下方,对齐视线。', tag: '人体工学' }, { title: '单线收纳', desc: '电源 + 显示 + Hub 一次走线。', tag: '整洁' }, { title: '4000K 主光', desc: '台灯从非惯用手侧 45° 打光。', tag: '光照' }, { title: '数字 Minimal', desc: 'Dock 仅留 5 个常用图标。', tag: '专注' }, ], }, ], }), }, 'dfa76402-2b56-4816-babb-ec2b8e6d97e6': { summary: '21 天晨间自由书写挑战:情绪曲线与 3 个固化习惯。', html: buildJohnPage({ title: '晨间写作 21 天挑战', description: '晨间写作挑战', tag: '生活记录', tagEmoji: '✍️', accent: '#fbbf24', accent2: '#f59e0b', heroImage: IMG.write, heroTitleHtml: '晨间 写作
21 天挑战', heroSubtitle: '每天 06:30–06:50,不修改、不评判,只把脑子里的声音写到纸上。', sections: [ { type: 'metrics', title: '挑战成果', items: [ { value: '21/21', label: '完成天数', note: '零中断' }, { value: '18min', label: '平均时长', note: '目标 20min' }, { value: '↓32%', label: '焦虑自评', note: 'W1 vs W3' }, ], }, { type: 'quote', html: '第 14 天:「原来焦虑不是敌人,是未命名的期待。」', }, ], }), }, '50434e70-97f3-4c7f-beb5-2c36b2c30885': { summary: '618 GMV ¥2840 万归因:渠道 × 品类 × 客单三层下钻。', html: buildJohnPage({ title: '电商大促 GMV 归因看板', description: 'GMV 归因看板', tag: '数据分析', tagEmoji: '📈', accent: '#38bdf8', accent2: '#0ea5e9', heroImage: IMG.data, heroTitleHtml: 'GMV 归因
看板', heroSubtitle: '618 全周期 GMV ¥2840 万,渠道、品类、客单三层下钻。', sections: [ { type: 'metrics', title: '总览', items: [ { value: '¥2840万', label: '总 GMV', note: 'YoY +41%' }, { value: '¥268', label: '客单价', note: '+12%' }, { value: '38%', label: '直播占比', note: '+9pp' }, ], }, { type: 'text', title: '渠道拆解', html: `
渠道GMVROI
信息流¥920万1:2.8
直播¥1080万1:4.1
自然搜索¥640万
`, }, ], }), }, '15ddb795-972e-4aa4-8a33-409b01645de9': { summary: 'Cohort 留存模板:D1/D7/D30 + 异常排查 checklist。', html: buildJohnPage({ title: '用户留存 Cohort 分析模板', description: 'Cohort 留存分析', tag: '数据分析', tagEmoji: '📈', accent: '#a78bfa', accent2: '#8b5cf6', heroImage: IMG.data, heroTitleHtml: 'Cohort 留存
分析模板', heroSubtitle: '按注册周看 D1/D7/D30,附异常波动排查清单。', sections: [ { type: 'text', title: '留存矩阵', html: `
注册周用户量D1D7D30
W2212,40048%31%18%
W2315,10052%34%
`, }, ], }), }, 'd601b63c-e986-4a49-8267-f3bcb8de20f5': { summary: '社区咖啡店开业 7 天:首日 186 杯、会员转化 23%。', html: buildJohnPage({ title: '社区咖啡店开业 7 天运营手记', description: '咖啡店开业手记', tag: '门店展示', tagEmoji: '☕', accent: '#d97706', accent2: '#fbbf24', heroImage: IMG.coffee, heroTitleHtml: '咖啡店 7 天
运营手记', heroSubtitle: '45㎡ 社区底商,第 7 天单日杯量破 200。', sections: [ { type: 'metrics', title: '开业数据', items: [ { value: '186杯', label: '首日销量', note: '超预期 24%' }, { value: '23%', label: '会员转化', note: '扫码领券' }, { value: '¥86', label: '坪效/日', note: '第 7 天峰值' }, ], }, { type: 'quote', html: '选址关键:500m 内 3 个办公出口 + 1 个地铁口。', }, ], }), }, 'ad198274-1457-4ded-ba85-000ef9534fd4': { summary: '618 普拉提限定套餐:早鸟 ¥599,附预约转化话术。', html: buildJohnPage({ title: '普拉提工作室 618 活动页', description: '普拉提 618 活动', tag: '门店展示', tagEmoji: '🧘', accent: '#f472b6', accent2: '#ec4899', bgDark: '#1a0a14', heroImage: IMG.pilates, heroTitleHtml: 'Flow Pilates
618 限定', heroSubtitle: '小团课体验 + 体态评估,仅 618 期间。', sections: [ { type: 'cards', title: '活动套餐', items: [ { title: '早鸟套餐 A · ¥599', desc: '3 次小团课 + 1 次私教评估(原价 ¥980)', tag: '早鸟' }, { title: '续课套餐 B · ¥1,299', desc: '10 次小团课 + 赠 2 次,60 天有效', tag: '续课' }, ], }, ], }), }, 'c0da7a1b-ffb1-4f51-a664-ec45381f694d': { summary: '开源项目 0→200 Star / 17 付费用户的冷启动复盘。', html: buildJohnPage({ title: '开源副业项目冷启动笔记', description: '开源冷启动笔记', tag: '其他', tagEmoji: '💡', accent: '#34d399', accent2: '#10b981', heroImage: IMG.opensource, heroTitleHtml: '开源 冷启动
笔记', heroSubtitle: '从 0 Star 到首批付费用户的 6 个关键动作。', sections: [ { type: 'cards', title: '里程碑', items: [ { title: 'Day 1–7', desc: 'README 即落地页:30 秒 GIF + Quick Start。', tag: '文档' }, { title: 'Day 8–14', desc: 'Show HN + 中文社区,Star 0→120。', tag: '推广' }, { title: 'Day 15–30', desc: 'Pro ¥29/月,17 个付费用户。', tag: '变现' }, ], }, ], }), }, 'c62fbf64-2611-46a5-9a25-38b3432f9669': { summary: '2026 四维度愿望清单:学习、健康、关系、创作。', html: buildJohnPage({ title: '给未来的自己:2026 愿望清单', description: '2026 愿望清单', tag: '其他', tagEmoji: '🎯', accent: '#f093fb', accent2: '#f5576c', bgDark: '#0a0a0a', heroImage: IMG.wish, heroTitleHtml: '给未来的 自己', heroSubtitle: '学习、健康、关系、创作——每个维度 3 个可验证里程碑。', sections: [ { type: 'cards', title: '2026 目标墙', items: [ { title: '📚 学习', desc: '24 本书 · 1 门系统课 · 12 篇公开笔记', tag: '成长' }, { title: '🌿 健康', desc: '每周运动 ≥3 · 23:30 前入睡 · 体检全绿', tag: '身体' }, { title: '✨ 创作', desc: 'MindSpace 发布 20 页 · 广场 100 收藏', tag: '输出' }, ], }, ], }), }, '4c1bf255-d7fd-4065-9044-d347579f85e4': { summary: 'MindSpace 公开发布四步指南,参照 john 公开区页面风格。', html: buildJohnPage({ title: 'MindSpace 公开发布指南', description: 'MindSpace 公开发布指南', tag: '指南', tagEmoji: '✦', accent: '#f093fb', accent2: '#f5576c', bgDark: '#0a0a0a', heroImage: IMG.guide, heroTitleHtml: 'MindSpace
发布指南', heroSubtitle: '4 步将 AI 创作变为可分享、可被发现的真实作品。', sections: [ { type: 'cards', title: '发布流程', items: [ { title: '1. 完成页面', desc: 'Agent 生成或手动编辑,标题与摘要清晰。', tag: '创作' }, { title: '2. 发布公开', desc: '通过安全扫描,获得 /u/用户名/pages/ 链接。', tag: '发布' }, { title: '3. 推送广场', desc: '选择分类与封面,审核后展示。', tag: '广场' }, { title: '4. 分享迭代', desc: '根据阅读数据优化首屏内容。', tag: '增长' }, ], }, ], }), }, '00918152-b21a-4011-8139-b4b27dc9a111': { summary: '精选瑞士、马尔代夫与京都目的地灵感,含行程亮点与出发指南。', skipHtml: true, html: '', }, '90632cb4-c64d-45d0-8934-c9c53c43c1f9': { summary: '618 限定迪士尼主题盛典:城堡光影秀、亲子工作坊与早鸟礼遇。', skipHtml: true, html: '', }, }; export function getEnrichment(postId, fallbackTitle) { const item = ENRICHMENTS[postId]; if (item) return item; return { summary: `${fallbackTitle} — MindSpace 精选`, html: buildJohnPage({ title: fallbackTitle, description: fallbackTitle, tag: '精选', heroImage: IMG.guide, heroTitleHtml: esc(fallbackTitle), heroSubtitle: 'MindSpace 公开发布内容', }), }; }