732642856
d807abc0fe
- SKILL.md: 子命令表 22→27, 新增 §23-§27 覆盖 Double Transit PAC+D9, Transit LL/7L, 行星聚集, Vivah Saham, Chara Dasha Antardasha - main.js: 导入4个新函数, renderTransit 新增4个渲染段落 (Double Transit PAC+D9, LL/7L, 行星聚集, Vivah Saham) - index.html: Transit tab 新增4个容器 div - Skill和App现在具备同等的印度占星解盘能力和推运应期能力
414 lines
21 KiB
HTML
414 lines
21 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="zh-CN">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
|
||
<title>Jyotish · 印度占星</title>
|
||
<link rel="stylesheet" href="/style.css">
|
||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||
<link href="https://fonts.googleapis.com/css2?family=Cinzel:wght@400;600;700&family=Noto+Sans+SC:wght@300;400;500;700&display=swap" rel="stylesheet">
|
||
</head>
|
||
<body>
|
||
<!-- 海浪背景视频 -->
|
||
<video class="ocean-bg" autoplay muted loop playsinline>
|
||
<source src="/ocean-bg.mp4" type="video/mp4">
|
||
</video>
|
||
|
||
<div id="app">
|
||
<!-- ============ 输入页 ============ -->
|
||
<section id="page-input" class="page active">
|
||
<div class="container">
|
||
<header class="header">
|
||
<div class="logo">
|
||
<span class="logo-icon">☉</span>
|
||
<span class="logo-text">Jyotish</span>
|
||
</div>
|
||
<div class="header-right">
|
||
<p class="tagline" data-i18n="tagline">探索你的吠陀星盘 · 排盘 · 解盘 · 推运</p>
|
||
<div data-auth-header></div>
|
||
</div>
|
||
</header>
|
||
|
||
<div class="card input-card reveal">
|
||
<h2 class="card-title" data-i18n="input.title">输入出生信息</h2>
|
||
<form id="birth-form">
|
||
<div class="form-row">
|
||
<div class="form-group">
|
||
<label data-i18n="label.date">出生日期</label>
|
||
<div class="date-selects" id="birth-date-selects">
|
||
<select id="birth-year" required><option value="" disabled selected data-i18n="date.year">年</option></select>
|
||
<select id="birth-month" required><option value="" disabled selected data-i18n="date.month">月</option></select>
|
||
<select id="birth-day" required><option value="" disabled selected data-i18n="date.day">日</option></select>
|
||
</div>
|
||
</div>
|
||
<div class="form-group">
|
||
<label data-i18n="label.time">出生时间</label>
|
||
<input type="time" id="birth-time" required>
|
||
</div>
|
||
</div>
|
||
<div class="form-row">
|
||
<div class="form-group">
|
||
<label data-i18n="label.city">出生城市</label>
|
||
<div class="city-input-wrap">
|
||
<input type="text" id="birth-city" data-i18n-ph="city.placeholder" placeholder="搜索城市..." autocomplete="off">
|
||
<div id="city-suggestions" class="suggestions hidden"></div>
|
||
</div>
|
||
</div>
|
||
<div class="form-group">
|
||
<label data-i18n="label.tz">时区</label>
|
||
<select id="birth-tz">
|
||
<option value="auto" data-i18n="tz.auto">自动检测</option>
|
||
<option value="-12">UTC-12</option><option value="-11">UTC-11</option>
|
||
<option value="-10">UTC-10</option><option value="-9">UTC-9</option>
|
||
<option value="-8">UTC-8 (PST)</option><option value="-7">UTC-7</option>
|
||
<option value="-6">UTC-6</option><option value="-5">UTC-5 (EST)</option>
|
||
<option value="-4">UTC-4</option><option value="-3">UTC-3</option>
|
||
<option value="-2">UTC-2</option><option value="-1">UTC-1</option>
|
||
<option value="0">UTC+0 (GMT)</option><option value="1">UTC+1</option>
|
||
<option value="2">UTC+2</option><option value="3">UTC+3</option>
|
||
<option value="3.5">UTC+3:30</option><option value="4">UTC+4</option>
|
||
<option value="5">UTC+5</option><option value="5.5">UTC+5:30</option>
|
||
<option value="5.75">UTC+5:45</option><option value="6">UTC+6</option>
|
||
<option value="7">UTC+7</option><option value="8" selected>UTC+8 (中国)</option>
|
||
<option value="9">UTC+9</option><option value="9.5">UTC+9:30</option>
|
||
<option value="10">UTC+10</option><option value="11">UTC+11</option>
|
||
<option value="12">UTC+12</option>
|
||
</select>
|
||
</div>
|
||
</div>
|
||
<input type="hidden" id="birth-lat">
|
||
<input type="hidden" id="birth-lon">
|
||
<button type="submit" class="btn-primary" id="btn-calculate">
|
||
<span class="btn-text" data-i18n="btn.calculate">生 成 星 盘</span>
|
||
<span class="btn-loading hidden"><span class="spinner"></span> <span data-i18n="btn.calculating">计算中...</span></span>
|
||
</button>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ============ 星盘结果页 ============ -->
|
||
<section id="page-chart" class="page">
|
||
<div class="container">
|
||
|
||
<!-- 顶部导航 -->
|
||
<header class="header">
|
||
<div class="logo">
|
||
<span class="logo-icon">☉</span>
|
||
<span class="logo-text">Jyotish</span>
|
||
</div>
|
||
<div class="header-actions">
|
||
<div data-auth-header></div>
|
||
<div class="export-dropdown">
|
||
<button class="btn-export" id="btn-export" data-i18n="btn.export">⬇ 导出</button>
|
||
<div class="export-menu hidden" id="export-menu">
|
||
<button class="export-item" data-format="json" data-i18n="export.json">导出 JSON 数据</button>
|
||
<button class="export-item" data-format="svg" data-i18n="export.svg">导出星盘 SVG</button>
|
||
<button class="export-item" data-format="png" data-i18n="export.png">导出星盘 PNG</button>
|
||
</div>
|
||
</div>
|
||
<button class="btn-back" id="btn-back" data-i18n="btn.back">← 重新输入</button>
|
||
</div>
|
||
</header>
|
||
|
||
<!-- 上升信息 Banner -->
|
||
<div class="ascendant-banner reveal" id="ascendant-banner">
|
||
<div class="asc-main">
|
||
<div class="asc-sign" id="asc-sign"></div>
|
||
<div class="asc-details">
|
||
<span class="asc-degree" id="asc-degree"></span>
|
||
<span class="asc-nakshatra" id="asc-nakshatra"></span>
|
||
</div>
|
||
</div>
|
||
<div class="asc-lord-badge" id="asc-lord-badge"></div>
|
||
</div>
|
||
|
||
<!-- Tab 导航 -->
|
||
<nav class="section-tabs" id="section-tabs">
|
||
<button class="tab-btn active" data-tab="chart" data-i18n="tab.chart">本命盘</button>
|
||
<button class="tab-btn" data-tab="karaka">Karaka</button>
|
||
<button class="tab-btn" data-tab="houses" data-i18n="tab.houses">宫位分析</button>
|
||
<button class="tab-btn" data-tab="aspects" data-i18n="tab.aspects">相位</button>
|
||
<button class="tab-btn" data-tab="yogas">Yoga</button>
|
||
<button class="tab-btn" data-tab="vargas" data-i18n="tab.vargas">分盘</button>
|
||
<button class="tab-btn" data-tab="ashtakavarga">Ashtakavarga</button>
|
||
<button class="tab-btn" data-tab="shadbala">Shadbala</button>
|
||
<button class="tab-btn" data-tab="dasha">Dasha</button>
|
||
<button class="tab-btn" data-tab="transit">Transit</button>
|
||
<button class="tab-btn" data-tab="deep"><span class="tab-full" data-i18n="tab.deep.full">Samagra Viveka 综合深度</span><span class="tab-short" data-i18n="tab.deep.short">综合深度</span></button>
|
||
<button class="tab-btn" data-tab="extended"><span class="tab-full" data-i18n="tab.extended.full">Vishesh Pariksha 扩展分析</span><span class="tab-short" data-i18n="tab.extended.short">扩展分析</span></button>
|
||
</nav>
|
||
|
||
<!-- === Tab: 本命盘 === -->
|
||
<div class="tab-panel active" id="tab-chart">
|
||
<div class="chart-layout">
|
||
<div class="chart-container reveal" style="position:relative;">
|
||
<div class="chart-header">
|
||
<h3 class="section-title" style="margin-bottom:0" data-i18n="chart.rasi">Rasi Chart 本命盘</h3>
|
||
<div class="chart-style-toggle">
|
||
<button class="style-btn active" data-style="south" data-i18n="chart.south">南印</button>
|
||
<button class="style-btn" data-style="north" data-i18n="chart.north">北印</button>
|
||
</div>
|
||
</div>
|
||
<div class="south-indian-chart" id="rasi-chart"></div>
|
||
</div>
|
||
<!-- 生时校正引导卡片（星盘下方） -->
|
||
<div class="rect-prompt hidden" id="rect-prompt">
|
||
<div class="rect-prompt-icon">⏱</div>
|
||
<div class="rect-prompt-body">
|
||
<strong class="rect-prompt-title" data-i18n="rect.prompt.title">出生时间不确定？</strong>
|
||
<span class="rect-prompt-desc" data-i18n="rect.prompt.desc">通过生命事件反推精确出生时间，校正到分钟级</span>
|
||
</div>
|
||
<button class="rect-prompt-btn" id="rect-prompt-btn" data-i18n="rect.prompt.btn">开始校正 →</button>
|
||
</div>
|
||
<div class="planets-container reveal reveal-delay-1">
|
||
<h3 class="section-title" data-i18n="planets.title">行星位置</h3>
|
||
<div class="planets-table-wrap">
|
||
<table class="planets-table" id="planets-table">
|
||
<thead><tr><th data-i18n="col.planet">行星</th><th data-i18n="col.sign">星座</th><th data-i18n="col.degree">度数</th><th data-i18n="col.house">宫位</th><th data-i18n="col.status">状态</th><th data-i18n="col.nakshatra">星宿</th><th data-i18n="col.d9">D9</th></tr></thead>
|
||
<tbody></tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- Tithi / Yoga 信息 -->
|
||
<div class="tithi-info-section" id="tithi-info-section"></div>
|
||
<!-- Arudha 概览 -->
|
||
<div class="arudha-quick-section" id="arudha-quick-section"></div>
|
||
</div>
|
||
|
||
<!-- === Tab: Karaka === -->
|
||
<div class="tab-panel" id="tab-karaka">
|
||
<h3 class="section-title" data-i18n="karaka.title">Jaimini Karaka 灵魂指针</h3>
|
||
<div class="karaka-layout">
|
||
<div class="karaka-panel">
|
||
<h4 class="sub-title" data-i18n="karaka.7k">7-Karaka（古典系统）</h4>
|
||
<div class="karaka-grid" id="karaka7-grid"></div>
|
||
</div>
|
||
<div class="karaka-panel">
|
||
<h4 class="sub-title" data-i18n="karaka.8k">8-Karaka（含 Rahu）</h4>
|
||
<div class="karaka-grid" id="karaka8-grid"></div>
|
||
</div>
|
||
</div>
|
||
<div class="karaka-note">
|
||
<p data-i18n="karaka.note">Karaka 是 Jaimini 系统的核心概念。AK（Atmakaraka）代表灵魂目标，DK（Darakaraka）代表配偶征象星。度数越高，Karaka 力量越强。</p>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- === Tab: 宫位分析 === -->
|
||
<div class="tab-panel" id="tab-houses">
|
||
<h3 class="section-title" data-i18n="houses.title">十二宫位综合解读</h3>
|
||
<div class="house-grid" id="house-grid"></div>
|
||
</div>
|
||
|
||
<!-- === Tab: 相位 === -->
|
||
<div class="tab-panel" id="tab-aspects">
|
||
<h3 class="section-title" data-i18n="aspects.title">Graha Drishti 行星相位</h3>
|
||
<div class="aspects-legend">
|
||
<span class="legend-item"><span class="legend-dot friendly"></span><span data-i18n="aspect.friendly">友方</span></span>
|
||
<span class="legend-item"><span class="legend-dot neutral"></span><span data-i18n="aspect.neutral">中性</span></span>
|
||
<span class="legend-item"><span class="legend-dot hostile"></span><span data-i18n="aspect.hostile">敌对</span></span>
|
||
</div>
|
||
<div class="aspects-grid" id="aspects-grid"></div>
|
||
</div>
|
||
|
||
<!-- === Tab: Yoga === -->
|
||
<div class="tab-panel" id="tab-yogas">
|
||
<h3 class="section-title" data-i18n="yoga.title">Yoga 格局识别</h3>
|
||
<div class="yoga-summary" id="yoga-summary"></div>
|
||
<div class="yoga-cards" id="yoga-cards"></div>
|
||
</div>
|
||
|
||
<!-- === Tab: 分盘 === -->
|
||
<div class="tab-panel" id="tab-vargas">
|
||
<h3 class="section-title" data-i18n="varga.title">Varga 分盘系统</h3>
|
||
<div class="varga-selector" id="varga-selector"></div>
|
||
<div class="varga-display" id="varga-display">
|
||
<div class="chart-layout">
|
||
<div class="chart-container">
|
||
<div class="south-indian-chart" id="varga-chart"></div>
|
||
</div>
|
||
<div class="planets-container">
|
||
<h4 class="sub-title" id="varga-table-title" data-i18n="varga.positions">行星位置</h4>
|
||
<div class="planets-table-wrap">
|
||
<table class="planets-table" id="varga-table">
|
||
<thead><tr><th data-i18n="col.planet">行星</th><th data-i18n="col.vsign">分盘星座</th><th data-i18n="col.nhouse">本命宫位</th></tr></thead>
|
||
<tbody></tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="arudha-section" id="arudha-section"></div>
|
||
</div>
|
||
|
||
<!-- === Tab: Ashtakavarga === -->
|
||
<div class="tab-panel" id="tab-ashtakavarga">
|
||
<h3 class="section-title" data-i18n="av.title">Ashtakavarga 八分法</h3>
|
||
<div class="av-summary" id="av-summary"></div>
|
||
<div class="av-chart-container">
|
||
<div class="south-indian-chart" id="av-chart"></div>
|
||
</div>
|
||
<div class="av-details" id="av-details"></div>
|
||
</div>
|
||
|
||
<!-- === Tab: Shadbala === -->
|
||
<div class="tab-panel" id="tab-shadbala">
|
||
<h3 class="section-title" data-i18n="sb.title">Shadbala 六维力量</h3>
|
||
<div class="shadbala-table-wrap">
|
||
<table class="planets-table" id="shadbala-table">
|
||
<thead><tr><th data-i18n="col.planet">行星</th><th data-i18n="col.total">总力量</th><th data-i18n="col.required">要求</th><th data-i18n="col.pct">达标率</th><th data-i18n="col.status">状态</th></tr></thead>
|
||
<tbody></tbody>
|
||
</table>
|
||
</div>
|
||
<div class="shadbala-note">
|
||
<p data-i18n="sb.note">Shadbala 是衡量行星综合力量的系统，包含6个维度：位置力量(Sthana)、方向力量(Dig)、时间力量(Kala)、运动力量(Chesta)、自然力量(Naisargika)、相位力量(Drik)。达标率≥100%为强，75-99%为中，<75%为弱。</p>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- === Tab: Dasha === -->
|
||
<div class="tab-panel" id="tab-dasha">
|
||
<h3 class="section-title" data-i18n="dasha.title">Vimshottari Dasha 大运</h3>
|
||
<div class="dasha-current" id="dasha-current"></div>
|
||
<div class="dasha-timeline" id="dasha-timeline"></div>
|
||
<div class="dasha-detail-layout">
|
||
<div class="antardasha-panel" id="antardasha-panel"></div>
|
||
<div class="pratyantardasha-panel" id="pratyantardasha-panel"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- === Tab: Transit === -->
|
||
<div class="tab-panel" id="tab-transit">
|
||
<h3 class="section-title" data-i18n="transit.title">Transit 行星过境分析</h3>
|
||
<!-- Transit 日期控制 -->
|
||
<div class="transit-controls">
|
||
<div class="transit-controls-row">
|
||
<div class="form-group" style="flex:1">
|
||
<label style="font-size:12px" data-i18n="transit.date.label">日期（可选，默认当前）</label>
|
||
<input type="date" id="transit-date-input" style="font-size:13px;padding:6px 10px;border:1px solid var(--border-input);border-radius:6px;width:100%">
|
||
</div>
|
||
<div class="form-group" style="flex:1">
|
||
<label style="font-size:12px" data-i18n="transit.time.label">时间</label>
|
||
<input type="time" id="transit-time-input" style="font-size:13px;padding:6px 10px;border:1px solid var(--border-input);border-radius:6px;width:100%">
|
||
</div>
|
||
<div class="form-group" style="display:flex;align-items:flex-end">
|
||
<button class="btn-primary" id="btn-transit-update" style="padding:8px 18px;font-size:13px;white-space:nowrap" data-i18n="btn.transit.update">更新 Transit</button>
|
||
</div>
|
||
</div>
|
||
<div class="transit-date" id="transit-date"></div>
|
||
</div>
|
||
<div class="transit-layout">
|
||
<div class="transit-chart-wrap reveal">
|
||
<h4 class="sub-title" data-i18n="transit.chart">Transit 星盘</h4>
|
||
<div class="south-indian-chart" id="transit-chart"></div>
|
||
</div>
|
||
<div class="transit-overlay-wrap reveal reveal-delay-1">
|
||
<h4 class="sub-title" data-i18n="transit.slow">慢星过境详细分析</h4>
|
||
<div class="transit-overlay-grid" id="transit-overlay"></div>
|
||
</div>
|
||
</div>
|
||
<!-- 全行星 Transit 表格 -->
|
||
<div class="deep-section">
|
||
<h4 class="sub-title" data-i18n="transit.alltable">全行星 Transit 对照表</h4>
|
||
<div class="planets-table-wrap" id="transit-all-table"></div>
|
||
</div>
|
||
<!-- Double Transit -->
|
||
<div class="double-transit-section" id="double-transit-section"></div>
|
||
<!-- Sade Sati -->
|
||
<div class="sade-sati-section" id="sade-sati-section"></div>
|
||
<!-- Double Transit PAC + D9 (KN Rao) -->
|
||
<div class="deep-section" id="double-transit-pac-section"></div>
|
||
<!-- Transit LL/7L 连接 -->
|
||
<div class="deep-section" id="transit-ll7l-section"></div>
|
||
<!-- 行星聚集 -->
|
||
<div class="deep-section" id="planetary-congregation-section"></div>
|
||
<!-- Vivah Saham -->
|
||
<div class="deep-section" id="vivah-saham-section"></div>
|
||
<!-- Transit AV 评分 -->
|
||
<div class="deep-section" id="transit-av-section"></div>
|
||
<!-- 宫位影响 -->
|
||
<div class="deep-section" id="transit-house-impact"></div>
|
||
</div>
|
||
|
||
<!-- === Tab: Samagra Viveka 综合深度分析 === -->
|
||
<div class="tab-panel" id="tab-deep">
|
||
<h3 class="section-title" data-i18n="deep.title">Samagra Viveka 综合深度分析</h3>
|
||
|
||
<!-- Raman 功能吉凶表 -->
|
||
<div class="deep-section">
|
||
<h4 class="sub-title" data-i18n="deep.fn">Shubha Papa Lagna 功能吉凶星表 (B.V. Raman)</h4>
|
||
<div id="raman-fn-table" class="fn-table"></div>
|
||
</div>
|
||
|
||
<!-- PACDARES 八维 -->
|
||
<div class="deep-section">
|
||
<h4 class="sub-title" data-i18n="deep.pacdares">PACDARES Ashtadasha 八维分析 (K.N. Rao)</h4>
|
||
<div id="pacdares-grid" class="pacdares-grid"></div>
|
||
</div>
|
||
|
||
<!-- Raman 宫位评级 -->
|
||
<div class="deep-section">
|
||
<h4 class="sub-title" data-i18n="deep.grades">Bhava Sadhana 宫位六步评级 (A-F)</h4>
|
||
<div id="raman-grades-grid" class="rg-grid"></div>
|
||
</div>
|
||
|
||
<!-- 宫位互影响矩阵 -->
|
||
<div class="deep-section">
|
||
<h4 class="sub-title" data-i18n="deep.influence">Bhava Sambandha 宫位互影响矩阵</h4>
|
||
<div id="house-influence-grid" class="hi-grid"></div>
|
||
</div>
|
||
|
||
<!-- Vargottama -->
|
||
<div class="deep-section">
|
||
<h4 class="sub-title" data-i18n="deep.vargottama">Vargottama 同座检测 (D1=D9)</h4>
|
||
<div id="vargottama-section"></div>
|
||
</div>
|
||
|
||
<!-- 三角验证 -->
|
||
<div class="deep-section">
|
||
<h4 class="sub-title" data-i18n="deep.triangle">Trikasiddhi D1 × D9 × D10 三角验证</h4>
|
||
<div id="triangle-table"></div>
|
||
</div>
|
||
|
||
<!-- 频率分析 -->
|
||
<div class="deep-section">
|
||
<h4 class="sub-title" data-i18n="deep.freq">Graha Varga Sphuta 行星频率分析 (Shodashavarga 16分盘)</h4>
|
||
<div id="frequency-grid" class="freq-grid"></div>
|
||
</div>
|
||
|
||
<!-- 三方四正映射分析 -->
|
||
<div class="deep-section">
|
||
<h4 class="sub-title" data-i18n="deep.tk">Trikona-Kendra Sambandha 三方四正宫位映射</h4>
|
||
<div id="trikona-kendra-grid"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- === Tab: Vishesh Pariksha 扩展分析 === -->
|
||
<div class="tab-panel" id="tab-extended">
|
||
<h3 class="section-title" data-i18n="ext.title">Vishesh Pariksha 扩展分析</h3>
|
||
<div id="bhava-bala-section" class="deep-section"></div>
|
||
<div id="vimsopaka-section" class="deep-section"></div>
|
||
<div id="planet-states-section" class="deep-section"></div>
|
||
<div id="av-pinda-section" class="deep-section"></div>
|
||
<div id="extra-dasa-section" class="deep-section"></div>
|
||
</div>
|
||
|
||
<!-- 生时校正全屏模态面板 -->
|
||
<div class="rect-overlay hidden" id="rect-overlay"></div>
|
||
<div class="rect-modal hidden" id="rect-panel">
|
||
<div class="rect-modal-header">
|
||
<h3 data-i18n="rect.title">Janma Samaya Shuddhi 生时校正</h3>
|
||
<button class="rect-modal-close" id="rect-panel-close">✕</button>
|
||
</div>
|
||
<div class="rect-modal-body" id="rect-content"></div>
|
||
</div>
|
||
|
||
</div>
|
||
</section>
|
||
</div>
|
||
|
||
<script type="module" src="/swisseph-wasm/src/swisseph.js"></script>
|
||
<script type="module" src="/main.js"></script>
|
||
</body>
|
||
</html>
|