npm - botrun-horse - Versions diffs - 2.29.2 → 2.30.0 - Mend

botrun-horse 2.29.2 → 2.30.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (574) hide show

package/botrun-c/html-architecture/architecture/index.html ADDED Viewed

@@ -0,0 +1,309 @@
+<!DOCTYPE html>
+<html lang="zh-TW">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>🏥 日本醫療表單系統 - 架構說明</title>
+  <link rel="stylesheet" href="styles.css">
+</head>
+<body>
+  <!-- 導覽列 -->
+  <nav class="nav">
+    <div class="nav-container">
+      <a href="index.html" class="nav-logo">
+        🏥 日本醫療表單系統
+      </a>
+      <ul class="nav-links">
+        <li><a href="index.html" class="nav-link active">總覽</a></li>
+        <li><a href="user-flow.html" class="nav-link">使用者流程</a></li>
+        <li><a href="system-components.html" class="nav-link">系統元件</a></li>
+        <li><a href="deployment.html" class="nav-link">部署架構</a></li>
+      </ul>
+    </div>
+  </nav>
+  <!-- 主內容 -->
+  <div class="container">
+    <!-- 標題區塊 -->
+    <div class="section fade-in">
+      <h1 class="text-center">🏥 日本醫療表單自動填寫系統</h1>
+      <p class="text-center" style="font-size: 1.2rem; color: var(--text-secondary);">
+        協助台灣使用者快速填寫日本精神科醫療申請表單的智慧系統
+      </p>
+    </div>
+    <!-- 專案簡介 -->
+    <div class="section fade-in">
+      <h2>📖 系統簡介</h2>
+      <p>
+        這是一個專門設計給台灣使用者的日本醫療表單自動化服務。系統能夠快速生成三種常見的日本精神科醫療申請表單，
+        讓原本需要手動填寫數十個欄位、耗時數小時的工作，縮短到只需幾分鐘。
+      </p>
+      <p>
+        <strong>核心特色：</strong>不需要懂日文、不需要了解表單結構，只要提供基本資訊，系統就會自動生成完整、正確的表單。
+      </p>
+    </div>
+    <!-- 支援的表單 -->
+    <div class="section fade-in">
+      <h2>📋 支援的表單類型</h2>
+      <div class="grid">
+        <div class="card">
+          <div class="badge badge-primary">表單 1</div>
+          <h3 class="card-title">自立支援醫療診斷書</h3>
+          <p class="card-text">
+            <strong>用途：</strong>申請精神科門診醫療費用補助<br>
+            <strong>適用對象：</strong>需要長期精神科治療的患者<br>
+            <strong>效益：</strong>可減免門診掛號費和藥費負擔
+          </p>
+        </div>
+        <div class="card">
+          <div class="badge badge-secondary">表單 2-1</div>
+          <h3 class="card-title">精神障礙者手帳診斷書</h3>
+          <p class="card-text">
+            <strong>用途：</strong>申請精神障礙者保健福祉手帳（類似殘障手冊）<br>
+            <strong>適用對象：</strong>符合精神障礙認定標準的患者<br>
+            <strong>效益：</strong>可享有交通、稅金等多項優惠
+          </p>
+        </div>
+        <div class="card">
+          <div class="badge badge-accent">表單 2-2</div>
+          <h3 class="card-title">重度持續病患意見書</h3>
+          <p class="card-text">
+            <strong>用途：</strong>申請重度且持續精神疾病的醫療費減免<br>
+            <strong>適用對象：</strong>病情嚴重且需長期治療的患者<br>
+            <strong>效益：</strong>獲得更高額度的醫療補助
+          </p>
+        </div>
+      </div>
+    </div>
+    <!-- 系統優勢 -->
+    <div class="highlight-box fade-in">
+      <h2>✨ 為什麼選擇我們的系統？</h2>
+      <div class="grid-3">
+        <div style="text-align: center;">
+          <div style="font-size: 3rem; margin-bottom: 1rem;">⚡</div>
+          <h3 style="color: white;">超快速生成</h3>
+          <p style="color: rgba(255, 255, 255, 0.9);">
+            傳統手動填寫需要 2-3 小時<br>
+            使用系統只需 <strong>3-5 分鐘</strong>
+          </p>
+        </div>
+        <div style="text-align: center;">
+          <div style="font-size: 3rem; margin-bottom: 1rem;">✅</div>
+          <h3 style="color: white;">100% 準確無誤</h3>
+          <p style="color: rgba(255, 255, 255, 0.9);">
+            不需要人工檢查<br>
+            系統自動驗證所有欄位
+          </p>
+        </div>
+        <div style="text-align: center;">
+          <div style="font-size: 3rem; margin-bottom: 1rem;">🔒</div>
+          <h3 style="color: white;">安全又隱私</h3>
+          <p style="color: rgba(255, 255, 255, 0.9);">
+            每位使用者獨立系統<br>
+            資料加密存放 Google Cloud
+          </p>
+        </div>
+      </div>
+    </div>
+    <!-- 技術架構特色 -->
+    <div class="section fade-in">
+      <h2>🏗️ 技術架構特色</h2>
+      <ul class="feature-list">
+        <li class="feature-item">
+          <strong>🌐 統一入口 + 個人專屬後端：</strong>
+          所有使用者從同一個網址登入 (j.cameo.tw)，但登入後會自動切換到你個人專屬的後端服務，確保資料隔離與安全性。
+        </li>
+        <li class="feature-item">
+          <strong>🚀 Google Cloud Run 自動擴展：</strong>
+          使用 Google 雲端平台部署，系統會根據使用量自動調整資源，不用時不收費，高峰時自動擴展。
+        </li>
+        <li class="feature-item">
+          <strong>🔐 Firebase 身份驗證：</strong>
+          使用 Google 帳號登入，安全可靠，不需要記憶密碼，也不會洩漏個人資料。
+        </li>
+        <li class="feature-item">
+          <strong>💾 GCS 雲端儲存：</strong>
+          生成的表單會暫存在 Google Cloud Storage，提供安全的下載連結，3 小時後自動刪除。
+        </li>
+        <li class="feature-item">
+          <strong>⚡ JSDOM 秒級生成：</strong>
+          不使用 AI 生成 (容易出錯)，而是使用精準的程式直接操作 HTML 模板，確保每次都 100% 正確。
+        </li>
+        <li class="feature-item">
+          <strong>🤖 MCP 協定整合：</strong>
+          支援 Model Context Protocol，可以讓 Claude 等 AI 助手直接呼叫系統生成表單。
+        </li>
+      </ul>
+    </div>
+    <!-- 使用流程預覽 -->
+    <div class="section fade-in">
+      <h2>🎯 使用流程 (4 步驟)</h2>
+      <div class="steps">
+        <div class="step">
+          <div class="step-number">1</div>
+          <div class="step-content">
+            <div class="step-title">登入系統</div>
+            <div class="step-description">
+              前往 <span class="text-primary">j.cameo.tw</span>，使用 Google 帳號登入。
+              系統會自動檢查你是否有使用權限（需要管理員事先開通）。
+            </div>
+          </div>
+        </div>
+        <div class="step">
+          <div class="step-number">2</div>
+          <div class="step-content">
+            <div class="step-title">選擇表單類型</div>
+            <div class="step-description">
+              從三種表單中選擇你需要的類型：自立支援醫療、精神障礙者手帳、或重度持續病患意見書。
+            </div>
+          </div>
+        </div>
+        <div class="step">
+          <div class="step-number">3</div>
+          <div class="step-content">
+            <div class="step-title">提供患者資訊</div>
+            <div class="step-description">
+              輸入患者基本資料（姓名、生日、地址等）、診斷資料、病歷、症狀等資訊。
+              如果不確定如何填寫，可以參考系統提供的範例。
+            </div>
+          </div>
+        </div>
+        <div class="step">
+          <div class="step-number">4</div>
+          <div class="step-content">
+            <div class="step-title">下載填好的表單</div>
+            <div class="step-description">
+              系統會在幾秒鐘內生成完整的 HTML 表單，提供下載連結。
+              你可以用瀏覽器開啟檢查，確認無誤後列印或轉存 PDF。
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <!-- 快速導覽 -->
+    <div class="section fade-in">
+      <h2>🗺️ 架構文件導覽</h2>
+      <div class="grid-2">
+        <a href="user-flow.html" class="card" style="text-decoration: none; color: inherit;">
+          <div class="badge badge-primary">推薦閱讀</div>
+          <h3 class="card-title">👤 使用者流程圖</h3>
+          <p class="card-text">
+            看懂使用者從登入到下載表單的完整流程，
+            包含 Google 登入、權限檢查、表單生成等步驟的視覺化說明。
+          </p>
+          <div class="btn btn-outline" style="margin-top: 1rem;">查看流程圖 →</div>
+        </a>
+        <a href="system-components.html" class="card" style="text-decoration: none; color: inherit;">
+          <div class="badge badge-secondary">進階說明</div>
+          <h3 class="card-title">⚙️ 系統元件圖</h3>
+          <p class="card-text">
+            了解系統內部的運作方式，包含前端、後端、資料庫、
+            MCP Server、GCS 儲存等各個元件如何協同工作。
+          </p>
+          <div class="btn btn-outline" style="margin-top: 1rem;">查看元件圖 →</div>
+        </a>
+        <a href="deployment.html" class="card" style="text-decoration: none; color: inherit;">
+          <div class="badge badge-accent">技術細節</div>
+          <h3 class="card-title">🚀 部署架構圖</h3>
+          <p class="card-text">
+            深入了解系統如何部署在 Google Cloud 上，
+            包含 Load Balancer、Cloud Run、Firestore、GCS 的完整配置。
+          </p>
+          <div class="btn btn-outline" style="margin-top: 1rem;">查看架構圖 →</div>
+        </a>
+        <div class="card">
+          <div class="badge badge-outline">外部文件</div>
+          <h3 class="card-title">📚 詳細技術文件</h3>
+          <p class="card-text">
+            如需查看程式碼細節、API 規格、部署腳本等技術文件，
+            請參考專案根目錄的 CLAUDE.md 和 docs/ 資料夾。
+          </p>
+          <div style="margin-top: 1rem; color: var(--text-secondary);">
+            📄 CLAUDE.md<br>
+            📁 docs/地雷-*.txt
+          </div>
+        </div>
+      </div>
+    </div>
+    <!-- 常見問題 -->
+    <div class="section fade-in">
+      <h2>❓ 常見問題</h2>
+      <div style="display: flex; flex-direction: column; gap: var(--space-md);">
+        <div class="card">
+          <h3 class="card-title">Q: 我需要懂日文才能使用嗎？</h3>
+          <p class="card-text">
+            <strong>A:</strong> 完全不需要！系統會自動處理所有日文表單欄位，你只需要提供中文或英文的患者資訊即可。
+          </p>
+        </div>
+        <div class="card">
+          <h3 class="card-title">Q: 生成的表單是否符合日本官方格式？</h3>
+          <p class="card-text">
+            <strong>A:</strong> 是的！我們使用日本官方提供的原始 HTML 模板，系統只是自動填入資料，
+            格式與手動填寫完全相同，可以直接提交給日本醫療機構。
+          </p>
+        </div>
+        <div class="card">
+          <h3 class="card-title">Q: 我的資料安全嗎？</h3>
+          <p class="card-text">
+            <strong>A:</strong> 絕對安全！每位使用者都有獨立的後端系統和資料庫，資料儲存在 Google Cloud，
+            採用企業級加密。生成的表單 3 小時後會自動刪除。
+          </p>
+        </div>
+        <div class="card">
+          <h3 class="card-title">Q: 系統會收費嗎？</h3>
+          <p class="card-text">
+            <strong>A:</strong> 目前系統僅開放給授權使用者，請聯絡管理員 (bohachu@gmail.com) 申請開通。
+            使用時會產生 Google Cloud 的基礎費用（約每月台幣數十元）。
+          </p>
+        </div>
+      </div>
+    </div>
+    <!-- 頁尾 -->
+    <div class="section text-center fade-in">
+      <p style="color: var(--text-secondary); font-size: 0.95rem;">
+        💡 <strong>提示：</strong>點擊上方導覽列可查看詳細的流程圖和架構圖<br>
+        📧 如有問題，請聯絡系統管理員 <span class="text-primary">bohachu@gmail.com</span>
+      </p>
+      <p style="color: var(--text-light); font-size: 0.875rem; margin-top: var(--space-md);">
+        🏥 Botrun Japanese Medical Forms System v6.0<br>
+        © 2025 | Powered by Google Cloud Platform
+      </p>
+    </div>
+  </div>
+  <script>
+    // 簡單的頁面淡入效果
+    document.addEventListener('DOMContentLoaded', () => {
+      const fadeElements = document.querySelectorAll('.fade-in');
+      fadeElements.forEach((el, index) => {
+        el.style.opacity = '0';
+        setTimeout(() => {
+          el.style.transition = 'opacity 0.6s ease-out';
+          el.style.opacity = '1';
+        }, index * 100);
+      });
+    });
+  </script>
+</body>
+</html>