263 lines
19 KiB
HTML
263 lines
19 KiB
HTML
<section id="heavenView" class="workspace-view member-feature-view heaven-shell wt">
|
|
<div class="member-gate" hidden><div class="member-gate-icon"><i data-lucide="lock-keyhole"></i></div><div><strong>问天仅对会员开放</strong><span>开通会员后可使用观势、观气、观心及平台解读。会员状态可从顶部账号标识进入。</span></div></div>
|
|
<header class="wt-head">
|
|
<div class="wt-title-line">
|
|
<h1 class="wt-serif">问 天</h1>
|
|
<span id="heavenDataDate">--</span>
|
|
</div>
|
|
<div class="verse wt-serif">观天之道 · 执天之行</div>
|
|
<nav class="wt-tabs" aria-label="问天模块">
|
|
<button class="wt-tab wt-serif on" type="button" data-heaven-panel="trend" aria-current="page">观势<small>三才六爻 · 量化成卦</small></button>
|
|
<button class="wt-tab wt-serif" type="button" data-heaven-panel="fortune">观气<small>五运六气 · 日辰生克</small></button>
|
|
<button class="wt-tab wt-serif" type="button" data-heaven-panel="heart">观心<small>静心占卜 · 第一念</small></button>
|
|
</nav>
|
|
</header>
|
|
<p class="heaven-proverb wt-serif">遇事不决可问春风，春风不语即随本心</p>
|
|
<div id="heavenNotice" class="inline-notice" role="status" hidden></div>
|
|
|
|
<section id="heavenTrendPanel" class="heaven-panel active-heaven-panel">
|
|
<div class="heaven-controls">
|
|
<div class="heaven-stock-query">
|
|
<label class="form-field" for="heavenStockInput"><span>股票代码或名称</span><input id="heavenStockInput" type="text" inputmode="text" maxlength="30" autocomplete="off" placeholder="例如 600000 或 浦发银行"></label>
|
|
<div id="heavenStockIdentity" class="heaven-stock-identity" aria-live="polite" hidden>
|
|
<span>当前标的：</span>
|
|
<strong id="heavenStockName">--</strong>
|
|
<span id="heavenStockTaxonomy">申万二级 ·</span>
|
|
<strong id="heavenStockSector">--</strong>
|
|
</div>
|
|
</div>
|
|
<div class="heaven-trend-actions">
|
|
<button id="loadHeavenSelectionButton" class="button" type="button">载入</button>
|
|
<button id="historyTrendButton" class="button" type="button">历史记录</button>
|
|
<button id="interpretTrendButton" class="button primary" type="button" disabled>解势</button>
|
|
</div>
|
|
</div>
|
|
<div class="cast-hint wt-serif">载入，以指数为天、行业为人、个股为地，六爻皆由行情量化而成</div>
|
|
<div class="wt-stage">
|
|
<div class="stars" id="stars" aria-hidden="true"></div>
|
|
<svg class="bagua" id="baguaSvg" width="560" height="560" viewBox="0 0 300 300" aria-hidden="true"></svg>
|
|
<div id="heavenTrendEmpty" class="wt-empty" role="status">
|
|
<div class="big wt-serif">三才六爻</div>
|
|
<p class="wt-serif">指数外显为上爻 · 内核为五爻 · 行业外显为四爻 · 内核为三爻 · 个股外显为二爻 · 内核为初爻<br>六爻皆由行情量化而成 —— 输入标的，点「载入」成卦</p>
|
|
</div>
|
|
<div class="heaven-trend-layout stage-in" hidden>
|
|
<section class="hexagram-board">
|
|
<div class="hexagram-heading">
|
|
<div><span class="metric-label">三才六爻</span><h3 id="marketHexagramName">--</h3></div>
|
|
<div class="hexagram-change"><span>动而之卦</span><strong id="marketTransformedName">--</strong></div>
|
|
</div>
|
|
<div id="marketHexagramLines" class="hexagram-lines"></div>
|
|
<p id="marketHexagramText" class="hexagram-text">--</p>
|
|
<p id="marketMovementSummary" class="market-movement-summary">--</p>
|
|
</section>
|
|
<section class="trend-reading-panel">
|
|
<div class="trend-score-line">
|
|
<div><span class="metric-label">势值</span><strong id="heavenMomentumScore">--</strong></div>
|
|
<span id="heavenMomentumLabel">--</span>
|
|
</div>
|
|
<div class="trend-score-meter" role="meter" aria-label="势值" aria-valuemin="-100" aria-valuemax="100">
|
|
<div class="trend-score-track"><i id="heavenMomentumNeedle"></i></div>
|
|
<div class="trend-score-marks"><span>-100 · 势衰</span><span>0</span><span>+100 · 势盛</span></div>
|
|
</div>
|
|
<div id="threeTalentReadings" class="three-talent-readings"></div>
|
|
<div class="heaven-hex-transition" aria-label="本卦与之卦">
|
|
<figure class="compact-hex-figure">
|
|
<div id="heavenOriginalHexLines" class="compact-hex-lines" aria-hidden="true"></div>
|
|
<figcaption><strong>本卦 · <b id="heavenOriginalHexName">--</b></strong><small id="heavenOriginalHexDetail">--</small></figcaption>
|
|
</figure>
|
|
<div class="compact-hex-change"><i aria-hidden="true">→</i><span>动而之卦</span></div>
|
|
<figure class="compact-hex-figure">
|
|
<div id="heavenChangedHexLines" class="compact-hex-lines" aria-hidden="true"></div>
|
|
<figcaption><strong>之卦 · <b id="heavenChangedHexName">--</b></strong><small id="heavenChangedHexDetail">--</small></figcaption>
|
|
</figure>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
</div>
|
|
<details id="heavenCalibrationPanel" class="heaven-calibration-panel" hidden>
|
|
<summary class="heaven-calibration-heading">
|
|
<div><span class="metric-label">量化数据安全门</span><h3 id="heavenCalibrationTitle">六爻数据校验</h3></div>
|
|
<div class="heaven-calibration-summary">
|
|
<span><i class="status-dot passed"></i>通过</span>
|
|
<span><i class="status-dot failed"></i>未通过</span>
|
|
<span><i class="status-dot manual"></i>用户补录</span>
|
|
<strong id="heavenCalibrationStatus">等待载入</strong>
|
|
<b class="fold-label">展开</b>
|
|
</div>
|
|
</summary>
|
|
<div class="calibration-body">
|
|
<p>系统只接收客观行情数据，所有补录仍按原量化公式计算阴阳与动爻。</p>
|
|
<form id="heavenCalibrationForm">
|
|
<div id="heavenLineChecks" class="heaven-line-checks" aria-live="polite"></div>
|
|
<label class="form-field calibration-note-field"><span>补录说明</span><input id="heavenCalibrationNote" type="text" maxlength="200" placeholder="可选：记录数据来源或补录原因"></label>
|
|
<div class="dialog-actions heaven-calibration-actions">
|
|
<button id="resetHeavenCalibrationButton" class="button" type="button">恢复自动数据</button>
|
|
<button id="applyHeavenCalibrationButton" class="button primary" type="submit">重新校验并成卦</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</details>
|
|
</section>
|
|
|
|
<section id="heavenFortunePanel" class="heaven-panel">
|
|
<div class="fortune-heading">
|
|
<div class="fortune-calendar-heading"><span id="fortuneLunarDate" class="metric-label">--</span><h3 id="fortunePillars" class="wt-serif">--</h3></div>
|
|
<div class="fortune-heading-actions">
|
|
<label class="qi-time-field"><span>观测日期</span><input id="qiObservationDate" type="date"></label>
|
|
<button id="historyFortuneButton" class="button" type="button">历史记录</button>
|
|
<button id="interpretFortuneButton" class="button primary" type="button" disabled>解运</button>
|
|
</div>
|
|
</div>
|
|
<div class="fortune-stage">
|
|
<div class="stars" id="fortuneStars" aria-hidden="true"></div>
|
|
<svg class="bagua fortune-bagua" id="fortuneBagua" width="560" height="560" viewBox="0 0 300 300" aria-hidden="true"></svg>
|
|
<section class="qi-climate-panel">
|
|
<span class="qi-section-mark">壹 · 天</span>
|
|
<p class="qi-climate-caption wt-serif">今日气候</p>
|
|
<h3 id="qiClimateKeyword" class="wt-serif">气机待察</h3>
|
|
<strong id="qiClimateTone" class="wt-serif">--</strong>
|
|
<p id="humanFieldSummary" class="human-field-summary">--</p>
|
|
</section>
|
|
<aside class="fortune-basics">
|
|
<section class="qi-framework-panel">
|
|
<div class="workspace-heading"><div><span>贰 · 气</span><h3 class="wt-serif">三层气机</h3></div><button class="text-fold-button" type="button" data-fold-target="qiFrameworkLayers">收起</button></div>
|
|
<p id="qiFrameworkPrinciple" class="qi-framework-principle">--</p>
|
|
<div id="qiFrameworkLayers" class="qi-framework-layers"></div>
|
|
</section>
|
|
<section class="personal-fortune-panel">
|
|
<div class="workspace-heading"><div><span>叁 · 人</span><h3 class="wt-serif">个人合参</h3></div></div>
|
|
<div id="personalProfileEmpty" class="personal-profile-empty"><span>当前账号尚未设置个人命理资料</span></div>
|
|
<div id="personalFortuneResult" class="personal-fortune-result" hidden></div>
|
|
</section>
|
|
</aside>
|
|
</div>
|
|
<details id="fortuneSectorCatalog" class="fortune-sector-catalog">
|
|
<summary>
|
|
<span><small>五行取象</small><strong class="wt-serif">五行对应行业</strong></span>
|
|
<span class="fortune-sector-summary-hint">展开查看全部行业 <i aria-hidden="true">⌄</i></span>
|
|
</summary>
|
|
<div id="fortuneSectorGroups" class="fortune-sector-groups"></div>
|
|
</details>
|
|
<p id="fortuneNotice" class="heaven-footnote"></p>
|
|
<div class="wentian-legacy-hooks" hidden aria-hidden="true">
|
|
<canvas id="qiFieldCanvas"></canvas>
|
|
<div id="heavenIndexStrip"></div><div id="heavenTrendEvidence"></div>
|
|
<div id="fortuneMetrics"></div><div id="fivePhaseBalance"></div>
|
|
<div id="humanEmotionList"></div><div id="humanBiasList"></div><div id="humanOperation"></div><div id="humanBalanceActions"></div>
|
|
<div id="phaseSectorTitle"></div><div id="phaseSectorContext"></div>
|
|
<div id="qiUseMap"><div id="qiUseSources"></div><svg id="qiUseConnections"></svg><div id="phaseSectorList"></div></div>
|
|
<button id="openPersonalSettingsButton" type="button"></button>
|
|
<details id="sectorPhaseManager"><summary>归类管理</summary><form id="sectorPhaseForm"><input id="sectorPhaseName"><select id="sectorPhaseElement"><option value="木">木</option></select><button type="submit">保存</button></form><div id="sectorPhaseOverrides"></div></details>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="heavenHeartPanel" class="heaven-panel">
|
|
<div class="heart-journey" aria-label="观心进程">
|
|
<span class="active" data-heart-step="intro"><i>一</i>静心</span><b></b>
|
|
<span data-heart-step="breathing"><i>二</i>呼吸</span><b></b>
|
|
<span data-heart-step="casting"><i>三</i>起卦</span><b></b>
|
|
<span data-heart-step="reveal"><i>四</i>察念</span><b></b>
|
|
<span data-heart-step="interpretation"><i>五</i>解卦</span>
|
|
</div>
|
|
<div class="heart-stage-shell">
|
|
<canvas id="heartDustCanvas" hidden></canvas><div id="heartLamp" hidden></div><div id="heartRitualCurtain" hidden></div><div id="heartLineTexts" hidden></div>
|
|
<div class="stars" id="heartStars" aria-hidden="true"></div>
|
|
<svg class="bagua heart-bagua" id="heartBagua" width="560" height="560" viewBox="0 0 300 300" aria-hidden="true"></svg>
|
|
<div id="heartWhispers" class="heart-whispers" aria-hidden="true"></div>
|
|
<div class="heart-toolbar-controls">
|
|
<button id="historyHeartButton" class="button" type="button">历史记录</button>
|
|
<button id="heartSoundToggle" class="button" type="button" aria-pressed="false">静音</button>
|
|
</div>
|
|
<div id="heartIntro" class="heart-stage active-heart-stage">
|
|
<div class="heart-stage-inner">
|
|
<span class="heart-stage-index heart-rise" data-heart-delay="0">观心 · 一</span>
|
|
<h3 class="heart-rise wt-serif" data-heart-delay="420">把所问之事安放于心</h3>
|
|
<div class="heart-guidance heart-rise" data-heart-delay="900">
|
|
<p>只问一事，在起卦前定下所问。</p>
|
|
<p>不求一个喜欢的答案，只看自己真正担心什么。</p>
|
|
</div>
|
|
<div class="heart-question-composer heart-rise" data-heart-delay="1250">
|
|
<div class="heart-question-presets" aria-label="快捷问题">
|
|
<button type="button" data-heart-question-preset="trade" aria-pressed="false">交易</button>
|
|
<button type="button" data-heart-question-preset="mind" aria-pressed="false">心境</button>
|
|
<button type="button" data-heart-question-preset="unthemed" aria-pressed="false">无题</button>
|
|
</div>
|
|
<textarea id="heartQuestionInput" rows="2" maxlength="300" placeholder="写下这次想问的一件事" aria-label="观心问题"></textarea>
|
|
</div>
|
|
<blockquote class="heart-motto heart-rise wt-serif" data-heart-delay="1500">遇事不决可问春风，春风不语即随本心</blockquote>
|
|
<button id="startBreathingButton" class="button primary heart-rise" data-heart-delay="2200" type="button" disabled>开始静心</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="heartBreathing" class="heart-stage">
|
|
<button class="button heart-return-button" type="button" data-heart-return>← 返回</button>
|
|
<div class="heart-stage-inner breathing-stage">
|
|
<span class="heart-stage-index">观心 · 二</span>
|
|
<div id="breathingScene" class="breathing-scene" data-phase="prepare">
|
|
<div class="heart-breath-ripple" aria-hidden="true"><span></span><span></span><span></span><i></i></div>
|
|
<b id="breathingPhase" class="breathing-phase" role="status" aria-live="polite">静</b>
|
|
</div>
|
|
<h3 id="breathingPrompt" class="wt-serif">放松片刻，准备呼吸</h3>
|
|
<div class="heart-incense" aria-hidden="true"><i id="heartIncenseEmber"></i></div>
|
|
<button id="beginCastingButton" class="button primary" type="button" disabled>静心完成，开始起卦</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="heartCasting" class="heart-stage">
|
|
<button class="button heart-return-button" type="button" data-heart-return>← 返回</button>
|
|
<div class="heart-casting-layout">
|
|
<section class="heart-hexagram-shell">
|
|
<div class="workspace-heading"><h3 class="wt-serif">从初爻起</h3><span id="castingProgress">0 / 6</span></div>
|
|
<div id="heartCastingLines" class="hexagram-lines ritual-lines"></div>
|
|
</section>
|
|
<section class="casting-action-panel">
|
|
<span class="heart-stage-index">观心 · 三</span>
|
|
<div id="coinResult" class="heart-coins" aria-label="三枚铜钱">
|
|
<div class="heart-coin" data-coin-index="0"><div class="heart-coin-inner"><span class="heart-coin-face front" aria-label="字面"><b class="coin-glyph coin-glyph-top">乾</b><b class="coin-glyph coin-glyph-right">隆</b><b class="coin-glyph coin-glyph-bottom">通</b><b class="coin-glyph coin-glyph-left">宝</b><i class="coin-hole"></i></span><span class="heart-coin-face back" aria-label="背面"><b class="coin-glyph coin-glyph-top">宝</b><b class="coin-glyph coin-glyph-bottom">泉</b><i class="coin-hole"></i></span></div><i class="heart-coin-ring"></i></div>
|
|
<div class="heart-coin" data-coin-index="1"><div class="heart-coin-inner"><span class="heart-coin-face front" aria-label="字面"><b class="coin-glyph coin-glyph-top">乾</b><b class="coin-glyph coin-glyph-right">隆</b><b class="coin-glyph coin-glyph-bottom">通</b><b class="coin-glyph coin-glyph-left">宝</b><i class="coin-hole"></i></span><span class="heart-coin-face back" aria-label="背面"><b class="coin-glyph coin-glyph-top">宝</b><b class="coin-glyph coin-glyph-bottom">泉</b><i class="coin-hole"></i></span></div><i class="heart-coin-ring"></i></div>
|
|
<div class="heart-coin" data-coin-index="2"><div class="heart-coin-inner"><span class="heart-coin-face front" aria-label="字面"><b class="coin-glyph coin-glyph-top">乾</b><b class="coin-glyph coin-glyph-right">隆</b><b class="coin-glyph coin-glyph-bottom">通</b><b class="coin-glyph coin-glyph-left">宝</b><i class="coin-hole"></i></span><span class="heart-coin-face back" aria-label="背面"><b class="coin-glyph coin-glyph-top">宝</b><b class="coin-glyph coin-glyph-bottom">泉</b><i class="coin-hole"></i></span></div><i class="heart-coin-ring"></i></div>
|
|
</div>
|
|
<h3 id="castingPrompt" class="wt-serif">心中默念所问之事，然后掷出初爻</h3>
|
|
<button id="tossCoinsButton" class="heart-cast-button" type="button"><i class="heart-hold-charge" aria-hidden="true"></i><span>按住<br>摇初爻</span></button>
|
|
</section>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="heartReveal" class="heart-stage">
|
|
<button class="button heart-return-button" type="button" data-heart-return>← 返回</button>
|
|
<div class="heart-reveal-layout">
|
|
<section class="hexagram-board heart-reveal-board">
|
|
<div class="hexagram-heading">
|
|
<div><span class="metric-label">本卦</span><h3 id="heartHexagramName">--</h3></div>
|
|
<div class="hexagram-change"><span>之卦</span><strong id="heartTransformedName">--</strong></div>
|
|
</div>
|
|
<div id="heartHexagramLines" class="hexagram-lines"></div>
|
|
<p id="heartHexagramText" class="hexagram-text">--</p>
|
|
</section>
|
|
<section class="heart-first-thought">
|
|
<span class="heart-stage-index">观心 · 四</span>
|
|
<h3 class="wt-serif">先不解卦</h3>
|
|
<p id="heartFirstThoughtPrompt">看见卦象与爻辞后，心里升起的第一念是什么？</p>
|
|
<p>不要修饰，也不必记录。只需看见它。</p>
|
|
<button id="interpretHeartButton" class="button primary" type="button">我已察念，开始解卦</button>
|
|
</section>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="heartInterpretationStage" class="heart-stage">
|
|
<div class="heart-interpretation-heading">
|
|
<div><span class="heart-stage-index">观心 · 五</span><h3 id="heartReadTitle" class="wt-serif">解卦</h3><small id="heartReadChange">--</small></div>
|
|
<div class="heart-read-actions"><button id="viewHeartReadingButton" class="button primary" type="button">查看解卦</button><button id="restartHeartButton" class="button" type="button">重新观心</button></div>
|
|
</div>
|
|
<p id="heartReadGuaci" class="heart-read-guaci">--</p>
|
|
<div class="heart-read-layout">
|
|
<div id="heartReadLines" class="heart-read-lines"></div>
|
|
<div id="heartReadTexts" class="heart-read-texts"></div>
|
|
</div>
|
|
<p class="heart-read-motto wt-serif">一念既察，卦只是镜。</p>
|
|
</div>
|
|
</div>
|
|
<p class="heaven-footnote heart-footnote">观心用于观察念头与执着，不用于替代交易计划或预测涨跌。</p>
|
|
</section>
|
|
</section>
|