/* pages-v3.jsx — 首页视频与创始人 / 相册滚动 / 活动 / 三级课程 / 学员证言墙 / 预约表单本轮改造：以课程为主轴；活动与课程分开；预约收敛为一张表单。 */ function V3Styles() { return ( ); } /* ================= 视频播放器 ================= */ function VPlayer({ v, dark }) { return (

); } /* 创始人区块（首页） */ function Founder() { const go = window.__go; const mine = QD.videos.filter((v) => v.kind === '朵洛莉丝'); const [cur, setCur] = React.useState(mine[0]); return ( <>

创始人 · 原声访谈

与其听我们转述，不如听她自己讲。

这些片段来自朵奶奶生前的公开访谈，中文与英文双语字幕。她把量子催眠讲得很朴素：不是神秘，是把人带到能听见自己的地方。

{mine.map((v) => ( ))}

go('library')}>全部影像与著作 →

); } /* ================= 相册滚动 ================= */ function AlbumStrip({ limit }) { const go = window.__go; const ref = React.useRef(null); const [pos, setPos] = React.useState({ i: 0, n: 1, p: 0 }); const items = React.useMemo(() => { const out = []; QD.events.forEach((ev) => { const k = ev.photos >= 6 ? 4 : ev.photos >= 3 ? 3 : 2; for (let i = 1; i <= Math.min(k, ev.photos); i++) { out.push({ src: `assets/gallery/${ev.id}/${String(i).padStart(2, '0')}.jpg`, ev }); } }); return limit ? out.slice(0, limit) : out; }, [limit]); const onScroll = React.useCallback(() => { const el = ref.current; if (!el) return; const kids = Array.from(el.children); const mid = el.scrollLeft + el.clientWidth / 2; let best = 0, bd = 1e9; kids.forEach((k, i) => { const c = k.offsetLeft + k.offsetWidth / 2; const d = Math.abs(c - mid); if (d < bd) { bd = d; best = i; } }); setPos({ i: best, n: kids.length, p: el.scrollLeft / Math.max(1, el.scrollWidth - el.clientWidth) }); }, []); React.useEffect(() => { onScroll(); }, [onScroll]); /* 首次挂载：把第 1 张居中，否则计数会从 2 开始 */ React.useEffect(() => { const el = ref.current; if (!el) return; const k = el.children[0]; if (k) el.scrollLeft = Math.max(0, k.offsetLeft - (el.clientWidth - k.offsetWidth) / 2); requestAnimationFrame(() => onScroll()); }, [onScroll]); const step = (d) => { const el = ref.current; if (!el) return; const kids = Array.from(el.children); const target = Math.max(0, Math.min(kids.length - 1, pos.i + d)); const k = kids[target]; if (k) el.scrollTo({ left: k.offsetLeft - (el.clientWidth - k.offsetWidth) / 2, behavior: 'smooth' }); }; const onKey = (e) => { if (e.key === 'ArrowRight') { e.preventDefault(); step(1); } if (e.key === 'ArrowLeft') { e.preventDefault(); step(-1); } }; return (

往期活动 · 2012—2019

翻相册，比看介绍可信。

{items.map((it, i) => (

{`${it.ev.title} — {it.ev.date} · {it.ev.city} {it.ev.people} 人

))}

{items[pos.i]?.ev.title || ''} {pos.i + 1} / {items.length} · 拖动或 ← → 浏览

); } /* ================= 活动页 ================= */ function EventsPage() { const go = window.__go; const [tab, setTab] = React.useState('upcoming'); const [detail, setDetail] = React.useState(null); const upcoming = QD.upcoming; const past = QD.events; return ( <>

课程与活动 · 活动

下一场，什么时候。

{[['upcoming', '即将到来', upcoming.length], ['past', '往期活动', past.length]].map(([k, t, n]) => ( ))}

{tab === 'upcoming' && (

最近一场 · {upcoming[0].dateText}

{upcoming[0].title}

{[['时间', upcoming[0].dateText], ['地点', upcoming[0].city], ['形式', upcoming[0].form], ['余位', `${upcoming[0].left} / ${upcoming[0].seats}`]].map(([a, b]) => (

{a}

{b}

))}

go('book')}>预约这一场读原文 →

{upcoming.slice(1).map((a) => )}

之后的排期

新活动在公众号发布后会自动出现在这里。关注公众号，推文发出即收到。

关注公众号

)}

{tab === 'past' && ( <>

{QD.events.length} 场已经结束的课程与活动。点开任一场，可以按相册的方式一张张看当时的照片。

全部往期

{QD.events.map((ev) => (
setDetail(ev)} role="button" tabIndex={0} onKeyDown={(e) => { if (e.key === 'Enter') setDetail(ev); }}>
{ev.year}

{ev.title}

{ev.date} · {ev.people} 人 · {ev.place || ev.city} · 原站 {ev.total} 张

{[1, 2, 3].map((i) => i <= ev.photos ? : null)}
看相册 →
))}

)} {detail && setDetail(null)} />} ); } function ActCard({ a }) { const go = window.__go; const pct = Math.round(((a.seats - a.left) / a.seats) * 100); return (

{a.dateText}

{a.form} · {a.level}
{a.title}

地点{a.city} 主讲{a.teacher}

{a.points.map((p) =>
{p}
)}

余 {a.left} / {a.seats}

go('book')}>预约

{Ico.wechat()} {a.source.name} · {a.source.at} 抓取

); } /* 往期活动详情：相册翻页 */ function PastDetail({ ev, onClose }) { const [i, setI] = React.useState(0); const ref = React.useRef(null); const list = Array.from({ length: ev.photos }, (_, k) => `assets/gallery/${ev.id}/${String(k + 1).padStart(2, '0')}.jpg`); const step = (d) => { const n = list.length; const t = (i + d + n) % n; setI(t); const el = ref.current; if (el) { const kid = el.children[t]; if (kid) el.scrollTo({ left: kid.offsetLeft - 8, behavior: 'smooth' }); } }; React.useEffect(() => { const h = (e) => { if (e.key === 'Escape') onClose(); if (e.key === 'ArrowRight') step(1); if (e.key === 'ArrowLeft') step(-1); }; window.addEventListener('keydown', h); document.body.style.overflow = 'hidden'; return () => { window.removeEventListener('keydown', h); document.body.style.overflow = ''; }; }, [i, onClose]); return (

{ev.date} · {ev.people} 人 · {ev.place || ev.city}

{ev.title}

{i + 1} / {list.length}

{list.map((s, k) => ( ))}

); } /* ================= 学员证言墙 ================= */ function VoicesWall() { const go = window.__go; const [open, setOpen] = React.useState(null); return ( <>

学员证言 · {QD.voices.length} 位
很多人说过话。

点击任意一张看完整留言。全部为原站原文，未做删改。

{QD.voices.map((v, i) => ( ))}

go('book')} arw>预约一次个案证言来自学员课后留言，署名使用其微信昵称。

{open && ( setOpen(null)} max={620}>

{open.n}

{open.short ? '学员短评' : '学员长文'}

{open.q}
)} ); } /* ================= 课程（三级） ================= */ function CoursesV3() { const go = window.__go; return ( <>

课程 · 三个阶段

成为操作者，是一段长路。

一阶段打底，二阶段深入，三阶段仍在整理。每一阶段都有明确的前置条件。

{QD.courses3.map((c) => (

{c.lvl} · {c.en}

{c.t}

{c.n}

{c.lead}

{c.points.map((p) =>
{p}
)}

{c.statusText}

{c.meta.map(([a, b]) => (

{a}

{b}

))}
c.status === 'open' && go('book')}> {c.status === 'open' ? '报名一阶段' : c.status === 'locked' ? '需先完成一阶段' : '尚未开放'}

))}

价格与具体排期由运营在后台配置；三阶段的课程结构定稿后会在此页与公众号同时公布。

课程之后
去上课，
还是去参加一场活动。

活动不属于课程体系：开放日、公开课、学员聚会、案例督导。它们更短，也更容易来。

go('events')} arw>看即将到来的活动

{[ ['六日线下工作坊', '一阶段的实地部分，含现场个案示范与逐组点评。'], ['公开课与开放日', '免费或低门槛，先来听一次再决定要不要学。'], ['学员聚会与督导', '已结业的学员带真实个案来讨论，讲师现场回应。'], ].map(([a, b], i) => (
0{i + 1}
{a}
{b}
))}

{[['提交预约表', '填一次信息，我们按城市与档期回你。'], ['确认条件', '十八岁以上，具备稳定自我状态，无需心理学基础。'], ['缴费与材料', '发票、学习手册与观看权限同步到公众号。'], ['测验与证书', '结课测验通过后获得一阶段证书。']].map(([a, b], i) => (

0{i + 1}

{a}

{b}

))}

); } /* ================= 预约表 ================= */ function BookForm() { const { requireAuth } = useAuth(); const [sent, setSent] = React.useState(false); const [kind, setKind] = React.useState('课程报名'); const [city, setCity] = React.useState(''); const [topics, setTopics] = React.useState([]); const kinds = ['课程报名', '预约个案', '活动报名', '只想咨询']; const topicList = ['焦虑与情绪', '反复的关系模式', '身体找不到原因的不适', '人生方向', '哀伤与失去', '与父母 / 孩子', '只是想了解']; const toggle = (t) => setTopics((s) => s.includes(t) ? s.filter((x) => x !== t) : [...s, t]); const submit = (e) => { e.preventDefault(); requireAuth('book', () => setSent(true)); }; return ( <>

预约 · 唯一的入口
先说清楚你现在的处境。

我们还没有整理出一份「可以服务的人」的名单，所以先用这张表代替。填完之后会有人工回复，告诉你下一步合不合适。

几条边界

{[ '量子催眠禁止任何形式的远程操作，必须面对面。', '不做医疗诊断，不替代任何治疗。', '癫痫、重度精神类疾病急性期、正在服用影响意识状态的药物，请提前说明。', '十八岁以下不接收。', ].map((t) => (
—{t}
))}

{sent ? (

{Ico.check()}

表格已提交

我们会在两个工作日内通过公众号回复你。如果三天没有收到消息，请在公众号里再问一句。

) : (

我想……

{kinds.map((k) => ( ))}

称呼 *

微信号 *

手机（选填）

所在城市 * setCity(e.target.value)} />

希望处理的议题（可多选）
{topicList.map((t) => ( ))}

是否做过量子催眠

方便的时间

想说的话 </div> <div className="form-note"> 提交后会先走一次关注确认（用于接收回复）。表单内容只用于这一次沟通，不会公开。 </div> <button className="btn btn-primary btn-lg btn-block" type="submit">提交预约</button> </form> )} </div> </div> </div> </section> </> ); } /* ================= 首页课程主推 + 活动条 ================= */ function CoursePromo() { const go = window.__go; return ( <section className="sec"> <div className="wrap promo"> <div> <Eyebrow>主要方向 · 课程</Eyebrow> <h2 className="d2" style={{ marginTop: 16 }}>三级台阶，<br />每一级都有它的边界。</h2> <p className="lede" style={{ marginTop: 18, maxWidth: '46ch' }}> 一阶段让人学会陪伴；二阶段学会在深水里不慌；三阶段的课程结构还在整理。 </p> <div style={{ marginTop: 26 }} className="promo-lv"> {QD.courses3.map((c) => ( <a key={c.id} href="#c" onClick={(e) => { e.preventDefault(); go('courses'); }}> <span className="n">{c.lvl.replace('LEVEL ', 'L')}</span> <span className="t">{c.t}</span> <span className="s">{c.statusText}</span> </a> ))} </div> </div> <div> <div style={{ border: '1px solid var(--line)', background: 'var(--paper)' }}> <img src={QD.upcoming[0].cover} alt="" style={{ width: '100%', aspectRatio: '16/9', objectFit: 'cover', display: 'block' }} /> <div style={{ padding: '20px 22px 24px' }}> <div className="tag gold">即将到来 · {QD.upcoming[0].dateText}</div> <h3 style={{ marginTop: 12, fontSize: 19, lineHeight: 1.4 }}>{QD.upcoming[0].title}</h3> <p style={{ marginTop: 8, fontSize: 13, color: 'var(--txt-2)', fontWeight: 300 }}> {QD.upcoming[0].city} · {QD.upcoming[0].form} · 余 {QD.upcoming[0].left} / {QD.upcoming[0].seats} </p> <div style={{ marginTop: 16, display: 'flex', gap: 10 }}> <Btn kind="primary" size="sm" onClick={() => go('events')}>活动详情</Btn> <Btn kind="ghost" size="sm" onClick={() => go('book')}>预约</Btn> </div> </div> </div> </div> </div> </section> ); } /* 首页证言墙预览 */ function VoicesTeaser() { const go = window.__go; return ( <section className="sec" style={{ background: 'var(--cloud-2)' }}> <div className="wrap"> <div style={{ display: 'flex', alignItems: 'flex-end', justifyContent: 'space-between', gap: 24, flexWrap: 'wrap', marginBottom: 26 }}> <div> <Eyebrow>学员证言 · {QD.voices.length} 位</Eyebrow> <h2 className="d2" style={{ marginTop: 16 }}>他们说过话。</h2> </div> <Btn kind="ghost" onClick={() => go('voices')} arw>全部留言</Btn> </div> <div className="vwall"> {QD.voices.slice(0, 8).map((v, i) => ( <Reveal key={v.n + i} delay={(i % 4) * 40}> <button className="vcell" onClick={() => go('voices')}> <img src={v.img} alt={v.n} loading="lazy" /> <div className="nm">{v.n}</div> <div className="q">{v.q.replace(/\n+/g, ' ')}</div> </button> </Reveal> ))} </div> </div> </section> ); } Object.assign(window, { V3Styles, VPlayer, Founder, AlbumStrip, EventsPage, ActCard, PastDetail, VoicesWall, CoursesV3, BookForm, CoursePromo, VoicesTeaser, });

与其听我们转述，不如听她自己讲。

翻相册，比看介绍可信。

下一场，什么时候。

{upcoming[0].title}

{a.title}

很多人说过话。

成为操作者，是一段长路。

{c.t}

去上课，还是去参加一场活动。

{a}

{a}

先说清楚你现在的处境。

表格已提交

去上课，
还是去参加一场活动。