| <!doctype html> |
| <html lang="zh-CN"> |
| <head> |
| <meta charset="utf-8"> |
| <meta name="viewport" content="width=device-width,initial-scale=1"> |
| <title>Ocean Data Assistant</title> |
|
|
|
|
|
|
|
|
|
|
|
|
| <link rel="stylesheet" href="/static/css/app.css?v=__APP_VERSION__"> |
| </head> |
| <body class="auth-pending"> |
| <div class="app"> |
| <aside class="side"> |
| <div class="brand"> |
| <div class="brand-mark">🪼</div> |
| <div class="brand-text"><strong>Ocean Data Assistant</strong><small>Marine Foundation Platform</small></div> |
| </div> |
|
|
| <nav class="nav primary-tools"> |
| <button class="nav-btn active" data-view="chat"><span class="nav-ico">💬</span><span class="nav-label">对话助手</span></button> |
| <button id="navProjectPackage" class="nav-btn" data-view="projectPackage"><span class="nav-ico">📦</span><span class="nav-label">项目数据包</span><span class="nav-badge">新</span></button> |
| <button class="nav-btn" data-view="datasets"><span class="nav-ico">🗄️</span><span class="nav-label">数据集</span><span id="navDatasetsBadge" class="nav-badge">…</span></button> |
| <button class="nav-btn" data-view="tasks"><span class="nav-ico">📋</span><span class="nav-label">我的任务</span><span id="navTasksBadge" class="nav-badge">0</span></button> |
| </nav> |
|
|
| <div class="side-tools-head"> |
| <span>更多功能</span> |
| <button id="sidebarToolsToggle" class="side-tools-toggle" type="button" aria-expanded="true" title="折叠更多功能"> |
| <span id="sidebarToolsToggleText">收起</span><span class="side-tools-chevron">⌃</span> |
| </button> |
| </div> |
| <nav id="sidebarTools" class="nav sidebar-tools secondary-tools"> |
| <button class="nav-btn" data-view="favorites"><span class="nav-ico">☆</span><span class="nav-label">收藏</span><span id="navFavoritesBadge" class="nav-badge">0</span></button> |
| <button class="nav-btn" data-view="services"><span class="nav-ico">🌐</span><span class="nav-label">数据服务</span><span id="navServicesBadge" class="nav-badge">…</span></button> |
| <button class="nav-btn" data-view="dataHealth"><span class="nav-ico">🩺</span><span class="nav-label">数据质量</span><span id="navHealthBadge" class="nav-badge">新</span></button> |
| <button class="nav-btn" data-view="settings"><span class="nav-ico">⚙</span><span class="nav-label">设置</span></button> |
| </nav> |
|
|
| <button id="new" class="new">＋ 新建对话</button> |
| <div class="side-quick" aria-label="数据快捷入口"><button class="side-domain" data-domain="ocean">🌊 Ocean</button><button class="side-domain" data-domain="tuna">🐟 Tuna</button><button class="side-domain" data-domain="squid">🦑 Squid</button></div> |
|
|
| <div class="history-head"> |
| <span>近期对话</span> |
| <div class="history-head-actions"> |
| <button id="historyManage" class="clear-btn" title="批量管理最近对话">管理</button> |
| <button id="clear" class="clear-btn" title="清空最近对话">清空</button> |
| </div> |
| </div> |
| <div class="history-tools"> |
| <input id="historySearch" class="history-search" type="search" placeholder="搜索对话概括或内容"> |
| <select id="historySort" class="history-sort" title="近期对话排序"> |
| <option value="updated">最近更新</option> |
| <option value="title">概括名称</option> |
| </select> |
| </div> |
| <div id="historyBatchBar" class="history-batch hidden"> |
| <span id="historyBatchCount">已选 0 项</span> |
| <button id="historySelectAll" class="clear-btn">全选</button> |
| <button id="historyDeleteSelected" class="clear-btn danger">删除所选</button> |
| <button id="historyManageDone" class="clear-btn">完成</button> |
| </div> |
| <div id="history"></div> |
|
|
| <div class="side-foot"> |
| <div id="profileAvatar" class="profile-av">🌊</div> |
| <div class="profile-txt"><b id="profileName">Marine Explorer</b><small id="profileRuntime">Codex Harness · ZAI GLM-5.3 · Marine MCP</small></div> |
| </div> |
| </aside> |
|
|
| <main class="main"> |
| <header class="top"> |
| <div style="display:flex;align-items:center;gap:9px"> |
| <button id="mobileNav" class="icon-btn mobile-nav" title="菜单">☰</button> |
| <div id="pageTitle" class="title">Global Marine Foundation Data Agent <span style="font-size:11px;opacity:.58;font-weight:600;margin-left:8px">v__APP_VERSION__</span></div> |
| </div> |
| <div class="top-right"> |
| <div class="stat"><span id="dot" class="dot"></span><span id="st">正在连接…</span></div> |
| <button id="accountBtn" class="account-btn" title="账户"><span id="accountAvatar">U</span><span id="accountName">账户</span></button> |
| <button id="serviceDiagGlobal" class="view-btn primary service-diag-global" type="button" title="打开服务诊断详情">诊断详情</button> |
| <button id="refresh" class="icon-btn" title="刷新状态">↻</button> |
| </div> |
| </header> |
|
|
| <section id="chat" class="chat"> |
| <div class="inner"> |
| <div id="welcome" class="welcome"> |
| <div class="hero"> |
| <h1>欢迎使用海洋数据助手 🌊</h1> |
| <p>查询、裁剪与导出 Ocean、Tuna 和 Squid 数据。Codex Harness 使用智谱 ZAI 的 GLM-5.3，学校服务器真实数据通过 Marine MCP 安全访问。</p> |
| </div> |
| <div class="cards"> |
| <div class="data-card domain-card" data-domain="ocean" role="button" tabindex="0" aria-label="打开 Ocean 数据中心" onclick="openDomainPanel('ocean')" onkeydown="if(event.key==='Enter'||event.key===' '){event.preventDefault();openDomainPanel('ocean')}"> |
| <div class="card-top"><div class="card-ico">🌊</div><div><span class="card-name">Ocean</span><span class="card-tag">海洋</span></div></div> |
| <div class="card-desc">海洋物理、生化、海气与遥感数据；直接查看实时目录、变量和服务状态。</div> |
| <div class="card-foot"><span id="oceanCardCount">实时读取中…</span><span id="oceanCardStatus">检测中</span></div> |
| <div id="oceanCardLive" class="card-live">正在连接学校 Marine API</div> |
| <div class="card-actions-home"><button type="button" class="card-mini-btn" data-action="browse" data-domain="ocean" onclick="event.stopPropagation();openDomainPanel('ocean')">打开数据中心</button><button type="button" class="card-mini-btn" data-action="query" data-domain="ocean" onclick="event.stopPropagation();goChat(DOMAIN_PROMPTS['ocean'])">快速查询</button></div> |
| </div> |
| <div class="data-card domain-card" data-domain="tuna" role="button" tabindex="0" aria-label="打开 Tuna 数据中心" onclick="openDomainPanel('tuna')" onkeydown="if(event.key==='Enter'||event.key===' '){event.preventDefault();openDomainPanel('tuna')}"> |
| <div class="card-top"><div class="card-ico">🐟</div><div><span class="card-name">Tuna</span><span class="card-tag">金枪鱼</span></div></div> |
| <div class="card-desc">金枪鱼捕捞、努力量、CPUE 与区域渔业组织数据；实时读取 Tuna 仓库。</div> |
| <div class="card-foot"><span id="tunaCardCount">实时读取中…</span><span id="tunaCardStatus">检测中</span></div> |
| <div id="tunaCardLive" class="card-live">正在读取 Hugging Face main 分支</div> |
| <div class="card-actions-home"><button type="button" class="card-mini-btn" data-action="browse" data-domain="tuna" onclick="event.stopPropagation();openDomainPanel('tuna')">打开数据中心</button><button type="button" class="card-mini-btn" data-action="query" data-domain="tuna" onclick="event.stopPropagation();goChat(DOMAIN_PROMPTS['tuna'])">快速查询</button></div> |
| </div> |
| <div class="data-card domain-card" data-domain="squid" role="button" tabindex="0" aria-label="打开 Squid 数据中心" onclick="openDomainPanel('squid')" onkeydown="if(event.key==='Enter'||event.key===' '){event.preventDefault();openDomainPanel('squid')}"> |
| <div class="card-top"><div class="card-ico">🦑</div><div><span class="card-name">Squid</span><span class="card-tag">柔鱼</span></div></div> |
| <div class="card-desc">柔鱼/鱿鱼捕捞、努力量、CPUE、渔船活动与资源评估数据；实时读取 Squid 仓库。</div> |
| <div class="card-foot"><span id="squidCardCount">实时读取中…</span><span id="squidCardStatus">检测中</span></div> |
| <div id="squidCardLive" class="card-live">正在读取 Hugging Face main 分支</div> |
| <div class="card-actions-home"><button type="button" class="card-mini-btn" data-action="browse" data-domain="squid" onclick="event.stopPropagation();openDomainPanel('squid')">打开数据中心</button><button type="button" class="card-mini-btn" data-action="query" data-domain="squid" onclick="event.stopPropagation();goChat(DOMAIN_PROMPTS['squid'])">快速查询</button></div> |
| </div> |
| </div> |
| </div> |
| <div id="msgs" class="msgs"></div> |
| </div> |
| </section> |
|
|
| <section id="workspace" class="workspace hidden"> |
| <div id="workspaceInner" class="workspace-inner"></div> |
| </section> |
|
|
| <div id="composerWrap" class="composer-wrap"> |
| <div class="composer"> |
| <div class="composer-row"> |
| <button class="tool-ico" title="附件入口预留">⌕</button> |
| <button id="uploadBtn" type="button" |
| title="上传文件" |
| style="width:42px;height:42px;border:0;border-radius:11px;background:rgba(20,70,105,.55);color:#bfe7ff;cursor:pointer;flex:0 0 auto;font-size:18px">📎</button> |
| <input id="uploadInput" type="file" multiple style="display:none"> |
| <textarea id="p" rows="1" placeholder="输入你的问题，例如：给我 2026年7月15日 120–121°E、20–21°N 的 ERA5 v10，导出 Excel"></textarea> |
| <button id="send" class="send" title="发送">➤</button> |
| </div> |
| <div class="composer-foot"> |
| <span id="hint" class="hint"><span class="mini-dot"></span>Ocean + Fisheries 数据路由</span> |
| <span>Enter 发送 · Shift+Enter 换行</span> |
| </div> |
| </div> |
| </div> |
| </main> |
| </div> |
| <div id="domainOverlay" class="domain-overlay hidden"><div id="domainPanel" class="domain-panel"></div></div> |
| <div id="toast" class="toast"></div> |
|
|
| <script src="https://cdn.jsdelivr.net/npm/@supabase/supabase-js@2/dist/umd/supabase.min.js"></script> |
| <script> |
| window.__SQUID_CONFIG__ = { |
| authEnabled: __AUTH_ENABLED_JSON__, |
| supabaseUrl: __SUPABASE_URL_JSON__, |
| supabaseKey: __SUPABASE_KEY_JSON__, |
| appVersion: "__APP_VERSION__" |
| }; |
| </script> |
| <script src="/static/js/app.js?v=__APP_VERSION__"></script> |
| <script src="/static/js/system-health.js?v=__APP_VERSION__"></script> |
| <script src="/static/js/data-health.js?v=__APP_VERSION__"></script> |
| <script src="/static/js/project-package.js?v=__APP_VERSION__"></script> |
|
|
|
|
| </body> |
| </html> |
|
|
