| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740 |
- <!DOCTYPE html>
- <html lang="zh-CN">
- <head>
- <meta charset="UTF-8"/>
- <link rel="icon" type="image/svg+xml" href="/wails.png"/>
- <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover"/>
- <link rel="stylesheet" href="/style.css"/>
- <title>腾图工具箱</title>
- <!-- 首屏前置应用主题,避免暗色/亮色切换时闪烁 -->
- <script>document.documentElement.dataset.theme = localStorage.getItem('tengtu-theme') || 'dark';</script>
- </head>
- <body data-file-drop-target>
- <div class="tab-container">
- <!-- 标签栏(兼作标题栏):左侧 tab,右侧窗口关闭按钮 -->
- <div class="tab-buttons">
- <button class="tab-btn active" data-tab="notes">笔记</button>
- <button class="tab-btn" data-tab="control">控制</button>
- <button class="tab-btn" data-tab="blog">博客</button>
- <button class="tab-btn" data-tab="links">网址</button>
- <button class="tab-btn" data-tab="news">新闻</button>
- <button class="tab-btn" data-tab="github">Github</button>
- <button class="tab-btn" data-tab="stock">股市</button>
- <button class="tab-btn" data-tab="record">记录</button>
- <button class="tab-btn" data-tab="todo">待办</button>
- <button class="tab-btn" data-tab="hardware">硬件</button>
- <button class="tab-btn" data-tab="tools">工具</button>
- <button class="tab-btn" data-tab="host">服务</button>
- <button class="tab-btn" data-tab="chat">聊天</button>
- <button class="tab-btn" data-tab="settings">设置</button>
- <div class="win-spacer"></div>
- <button class="win-close" id="win-close" title="关闭到托盘">×</button>
- </div>
- <!-- 内容面板 -->
- <div class="tab-content">
- <!-- 笔记:内嵌网页,地址可在设置中修改 -->
- <div class="tab-panel panel-embed active" id="tab-notes">
- <iframe id="frame-notes" src="https://m.scwy.net" title="笔记" loading="lazy"></iframe>
- </div>
- <!-- 控制:内嵌网页,地址可在设置中修改 -->
- <div class="tab-panel panel-embed" id="tab-control">
- <iframe id="frame-control" src="https://a7.scwy.net/4191" title="控制" loading="lazy"></iframe>
- </div>
- <!-- 博客:内嵌网页,地址可在设置中修改 -->
- <div class="tab-panel panel-embed" id="tab-blog">
- <iframe id="frame-blog" src="https://i.scwy.net" title="博客" loading="lazy"></iframe>
- </div>
- <!-- 常用网址:设置中配置,点击卡片在浏览器打开 -->
- <div class="tab-panel" id="tab-links">
- <div class="card-grid" id="links-grid"></div>
- </div>
- <!-- 新闻:煎蛋 + 头条热榜,命中关键词的排在前面并高亮 -->
- <div class="tab-panel" id="tab-news">
- <div class="panel-head">
- <div>
- <h2>新闻</h2>
- </div>
- <div class="panel-head-actions">
- <span class="github-refresh-time" id="news-refresh-time" title="最后一次成功刷新的时间"></span>
- <button class="btn-ghost" id="news-read" title="朗读未点击过的新闻标题">阅读</button>
- <button class="btn-ghost" id="news-refresh">刷新</button>
- </div>
- </div>
- <div class="news-list" id="news-list">
- <div class="empty-state">
- <div class="empty-mark">◈</div>
- <div class="empty-title">正在获取新闻…</div>
- <div class="empty-text">首次加载需要几秒</div>
- </div>
- </div>
- </div>
- <!-- Github:监听设置中仓库的最新提交 -->
- <div class="tab-panel" id="tab-github">
- <div class="panel-head">
- <div class="panel-head-actions">
- <span class="github-refresh-time" id="github-refresh-time" title="最后一次成功刷新的时间"></span>
- <button class="btn-ghost" id="github-refresh">刷新</button>
- </div>
- </div>
- <div class="repo-list" id="repo-list">
- <div class="empty-state">
- <div class="empty-mark">◈</div>
- <div class="empty-title">正在获取仓库动态…</div>
- <div class="empty-text">通过 GitHub API 拉取提交与最新版本</div>
- </div>
- </div>
- <div class="trending-block">
- <div class="trending-head">
- <h3 class="trending-title">热门仓库 <span class="trending-sub">GitHub Trending</span></h3>
- <span class="github-refresh-time" id="trending-refresh-time" title="最后一次成功刷新的时间"></span>
- <button class="btn-ghost" id="trending-refresh">刷新</button>
- </div>
- <div class="trending-list" id="trending-list">
- <div class="empty-state">
- <div class="empty-mark">◈</div>
- <div class="empty-title">正在获取热门仓库…</div>
- <div class="empty-text">抓取 github.com/trending,英文简介自动翻译为中文</div>
- </div>
- </div>
- </div>
- </div>
- <!-- 股市:按设置的代码展示行情 -->
- <div class="tab-panel" id="tab-stock">
- <div class="panel-head">
- <div class="panel-head-actions">
- <span class="market-status" id="market-status"><span class="dot"></span>加载中…</span>
- <span class="github-refresh-time" id="stock-refresh-time" title="最后一次成功刷新的时间"></span>
- <button class="btn-ghost" id="stock-refresh">刷新</button>
- </div>
- </div>
- <div class="stock-list" id="stock-list">
- <div class="empty-state">
- <div class="empty-mark">◈</div>
- <div class="empty-title">正在获取行情…</div>
- <div class="empty-text">首次加载需要几秒</div>
- </div>
- </div>
- </div>
- <!-- 记录:支持 Markdown 源码编辑与实时预览切换 -->
- <div class="tab-panel panel-record" id="tab-record">
- <div class="panel-head">
- <div>
- <div class="record-path-desc" id="record-path-desc"></div>
- </div>
- <div class="record-head-actions">
- <div class="record-mode" id="record-mode" role="group">
- <button class="record-mode-btn is-active" id="record-mode-edit" type="button">编辑</button>
- <button class="record-mode-btn" id="record-mode-preview" type="button">预览</button>
- </div>
- <button class="btn-ghost" id="record-save">保存</button>
- </div>
- </div>
- <textarea class="record-editor" id="record-editor" placeholder="在这里记录零碎信息…(支持 Markdown,可切换预览查看效果)" spellcheck="false"></textarea>
- <div class="record-preview markdown-body" id="record-preview"></div>
- <div class="record-status" id="record-status"></div>
- </div>
- <!-- 待办:每行记录一个待完成任务,可勾选完成 / 编辑 / 删除 -->
- <div class="tab-panel panel-todo" id="tab-todo">
- <div class="panel-head">
- <div class="todo-path-desc" id="todo-path-desc"></div>
- <button class="btn-ghost" id="todo-save">保存</button>
- </div>
- <div class="todo-list" id="todo-list"></div>
- <div class="todo-actions">
- <button class="btn-ghost" id="todo-add">添加任务</button>
- </div>
- <div class="todo-status" id="todo-status"></div>
- </div>
- <!-- 硬件:内嵌硬件监控页,地址可在设置中修改 -->
- <div class="tab-panel panel-embed" id="tab-hardware">
- <iframe id="frame-hardware" src="http://192.168.100.190/" title="硬件" loading="lazy"></iframe>
- </div>
- <!-- 工具:本地开发/运维辅助工具集 -->
- <div class="tab-panel" id="tab-tools">
- <!-- 工具 1:Web 服务——选择目录,开启本地浏览服务 -->
- <div class="tool-card is-collapsed">
- <div class="tool-card-head" role="button" tabindex="0" aria-expanded="false">
- <span class="tool-card-title"><span class="tool-arrow">▸</span><span class="dot"></span>Web 服务</span>
- <span class="tool-status" id="websvc-status"></span>
- </div>
- <div class="tool-card-body">
- <p class="tool-desc">选择任意目录,在本机开启浏览服务,默认页为 <code>index.html</code> 或 <code>readme.md</code>。</p>
- <div class="tool-row">
- <input class="input tool-dir" id="websvc-dir" type="text" placeholder="未选择目录" readonly>
- <button class="btn-ghost" id="websvc-pick">选择目录</button>
- </div>
- <div class="tool-row tool-actions">
- <button class="btn-primary" id="websvc-start">开启浏览服务</button>
- <button class="btn-ghost" id="websvc-stop" disabled>停止服务</button>
- <span class="tool-hint" id="websvc-hint"></span>
- </div>
- <div class="websvc-preview" id="websvc-preview" hidden>
- <iframe id="websvc-frame" title="Web 服务预览"></iframe>
- </div>
- </div>
- </div>
- <!-- 工具 2:翻译——中文→英文 / 英文→中文,自动检测 -->
- <div class="tool-card is-collapsed">
- <div class="tool-card-head" role="button" tabindex="0" aria-expanded="false">
- <span class="tool-card-title"><span class="tool-arrow">▸</span><span class="dot"></span>翻译</span>
- <span class="tool-status" id="tr-status"></span>
- </div>
- <div class="tool-card-body">
- <p class="tool-desc">输入中文自动翻译为英文,输入英文自动翻译为中文。免费接口有每日配额,超额请稍后再试。</p>
- <textarea class="input tr-input" id="tr-source" rows="3" placeholder="输入要翻译的中文或英文……"></textarea>
- <div class="tool-row tool-actions">
- <button class="btn-primary" id="tr-go">翻译</button>
- <span class="tool-hint" id="tr-hint"></span>
- </div>
- <div class="tr-result" id="tr-result" hidden></div>
- </div>
- </div>
- <!-- 工具 3:二维码生成——输入字符串生成二维码图片 -->
- <div class="tool-card is-collapsed">
- <div class="tool-card-head" role="button" tabindex="0" aria-expanded="false">
- <span class="tool-card-title"><span class="tool-arrow">▸</span><span class="dot"></span>二维码生成</span>
- <span class="tool-status" id="qr-status"></span>
- </div>
- <div class="tool-card-body">
- <p class="tool-desc">输入任意字符串,即时生成二维码图片。可用于网址、文本、联系方式等。</p>
- <textarea class="input tr-input" id="qr-input" rows="3" placeholder="输入要生成二维码的内容……"></textarea>
- <div class="tool-row tool-actions">
- <button class="btn-primary" id="qr-go">生成二维码</button>
- <span class="tool-hint" id="qr-hint"></span>
- </div>
- <div class="qr-box" id="qr-box" hidden>
- <img id="qr-img" alt="二维码" title="点击下载 PNG">
- <button class="btn-ghost" id="qr-save">下载 PNG</button>
- </div>
- </div>
- </div>
- <!-- 工具 4:发送 ntfy 消息——输入主题 / 标题 / 内容,推送到 ntfy 频道 -->
- <div class="tool-card is-collapsed">
- <div class="tool-card-head" role="button" tabindex="0" aria-expanded="false">
- <span class="tool-card-title"><span class="tool-arrow">▸</span><span class="dot"></span>发送 ntfy 消息</span>
- <span class="tool-status" id="ntfy-status"></span>
- </div>
- <div class="tool-card-body">
- <p class="tool-desc">向 ntfy 服务推送通知,用于手机 / 浏览器 / 其他设备即时提醒。主题(Topic)为监听频道名,输入过的主题会自动记忆。</p>
- <div class="tool-row">
- <input class="input" id="ntfy-topic" type="text" placeholder="主题(Topic),如 my-alerts" list="ntfy-topic-list" autocomplete="off">
- <datalist id="ntfy-topic-list"></datalist>
- </div>
- <input class="input" id="ntfy-title" type="text" placeholder="标题(可留空)">
- <textarea class="input tr-input" id="ntfy-message" rows="3" placeholder="输入要发送的消息内容……"></textarea>
- <div class="tool-row tool-actions">
- <button class="btn-primary" id="ntfy-go">发送</button>
- <span class="tool-hint" id="ntfy-hint"></span>
- </div>
- </div>
- </div>
- <!-- 工具 5:ntfy 聊天室——输入昵称与主题,订阅并实时收发消息(QQ 气泡风格) -->
- <div class="tool-card is-collapsed">
- <div class="tool-card-head" role="button" tabindex="0" aria-expanded="false">
- <span class="tool-card-title"><span class="tool-arrow">▸</span><span class="dot"></span>ntfy 聊天室</span>
- <span class="tool-status" id="chat-status"></span>
- </div>
- <div class="tool-card-body">
- <p class="tool-desc">输入昵称(作为发送方标识,记忆上次使用)与聊天室名称(ntfy 主题)后开始监听,像 QQ 一样左右气泡收发消息。</p>
- <div class="tool-row">
- <input class="input" id="chat-nickname" type="text" placeholder="昵称(作为发送方标题)" list="ntfy-nickname-list" autocomplete="off">
- <input class="input" id="chat-topic" type="text" placeholder="聊天室名称(ntfy 主题),留空则不监听" list="ntfy-topic-list" autocomplete="off">
- <button class="btn-ghost" id="chat-toggle">开始监听</button>
- </div>
- <div class="chat-box" id="chat-box" hidden>
- <div class="chat-list" id="chat-list"></div>
- <div class="chat-input-row">
- <input class="input" id="chat-message" type="text" placeholder="输入消息,回车发送" autocomplete="off">
- <button class="btn-ghost" id="chat-send">发送</button>
- </div>
- </div>
- </div>
- </div>
- <!-- 工具 6:古诗词——显示 footer 最近获取的古诗,可刷新获取新诗 -->
- <div class="tool-card is-collapsed">
- <div class="tool-card-head" role="button" tabindex="0" aria-expanded="false">
- <span class="tool-card-title"><span class="tool-arrow">▸</span><span class="dot"></span>古诗词</span>
- <span class="tool-status" id="poem-status"></span>
- </div>
- <div class="tool-card-body">
- <p class="tool-desc">显示主窗口 footer 最近获取到的古诗词内容,可手动刷新获取新的一首。数据来自古诗词网随机接口。</p>
- <div class="tool-row tool-actions">
- <button class="btn-primary" id="poem-tool-refresh">刷新获取</button>
- <button class="btn-ghost" id="poem-tool-read">朗读</button>
- <span class="tool-hint" id="poem-tool-hint"></span>
- </div>
- <div class="poem-tool" id="poem-tool-box" hidden>
- <div class="poem-tool-title" id="poem-tool-title"></div>
- <div class="poem-tool-author" id="poem-tool-author"></div>
- <div class="poem-tool-content" id="poem-tool-content"></div>
- </div>
- </div>
- </div>
- <!-- 工具 7:屏幕截图——隐藏本程序后截取全屏,完成后重新显示 -->
- <div class="tool-card is-collapsed">
- <div class="tool-card-head" role="button" tabindex="0" aria-expanded="false">
- <span class="tool-card-title"><span class="tool-arrow">▸</span><span class="dot"></span>屏幕截图</span>
- <span class="tool-status" id="shot-status"></span>
- </div>
- <div class="tool-card-body">
- <p class="tool-desc">点击截屏后自动隐藏本程序窗口,截取整个屏幕(全部显示器),完成后重新显示并预览。截到的画面不含本程序自身。</p>
- <div class="tool-row tool-actions">
- <button class="btn-primary" id="shot-capture">截屏</button>
- <span class="tool-hint" id="shot-hint"></span>
- </div>
- <div class="screenshot-box" id="screenshot-box" hidden>
- <div class="screenshot-head">
- <span class="card-title"><span class="dot"></span>屏幕截图</span>
- <span class="screenshot-hint" id="screenshot-hint"></span>
- </div>
- <img id="screenshot-img" alt="屏幕截图预览">
- </div>
- </div>
- </div>
- </div>
- <div class="tab-panel" id="tab-host">
- <div class="host-cards">
- <div class="card">
- <div class="card-title-row">
- <span class="card-title"><span class="dot"></span>API 服务</span>
- <button class="btn-ghost" id="api-toggle">停止服务</button>
- </div>
- <p id="api-status">检查中…</p>
- </div>
- <div class="card">
- <div class="card-title"><span class="dot"></span>电源命令</div>
- <p id="pc-status">暂无请求</p>
- </div>
- </div>
- <h3 class="section-title">提供的功能</h3>
- <ul class="api-list" id="api-list">
- <li><code>GET /health</code>健康检查</li>
- <li><code>POST /api/notify</code>弹出系统通知</li>
- <li><code>POST /api/window/show</code>显示主窗口</li>
- <li><code>GET /api/settings</code>读取配置</li>
- <li><code>POST /api/settings</code>保存配置</li>
- <li><code>GET /api/stocks</code>股票行情(?codes= 可临时指定)</li>
- <li><code>GET /api/screenshot</code>屏幕截图(?display= 指定显示器)</li>
- <li><code>GET /api/pc/poweroff</code>30 秒后关机</li>
- <li><code>GET /api/pc/restart</code>30 秒后重启</li>
- <li><code>GET /api/pc/sleep</code>30 秒后休眠</li>
- <li><code>GET /api/pc/lock</code>立即锁屏</li>
- <li><code>GET /api/pc/cancel</code>取消待执行命令</li>
- <li><code>GET /api/pc/status</code>查询命令状态</li>
- <li><code>GET /api/pc/timesync</code>同步系统时间</li>
- </ul>
- <div class="section-title section-title-row">
- <span>Gin 日志</span>
- <button class="btn-ghost" id="log-clear">清空日志</button>
- </div>
- <pre class="log-view" id="log-view">暂无日志</pre>
- </div>
- <!-- 聊天:内嵌网页,地址可在设置中修改 -->
- <div class="tab-panel panel-embed" id="tab-chat">
- <iframe id="frame-chat" src="https://c.scwy.net" title="聊天" loading="lazy"></iframe>
- </div>
- <!-- 设置 -->
- <div class="tab-panel" id="tab-settings">
- <h2>设置</h2>
- <div class="setting-list">
- <!-- 界面样式:暗色 / 亮色 -->
- <div class="setting-row">
- <div class="setting-info">
- <div class="setting-title">界面样式</div>
- <div class="setting-hint">在暗色与亮色主题之间切换</div>
- </div>
- <div class="segmented" id="theme-seg">
- <button class="seg-btn active" data-theme-value="dark">暗色</button>
- <button class="seg-btn" data-theme-value="light">亮色</button>
- </div>
- </div>
- <!-- 界面字号:全局 +- 调整 -->
- <div class="setting-row">
- <div class="setting-info">
- <div class="setting-title">界面字号</div>
- <div class="setting-hint">统一调整全部文字大小,范围 +-3</div>
- </div>
- <div class="stepper">
- <button class="step-btn" id="font-minus" title="减小字号">−</button>
- <span class="step-value" id="font-delta-value">0</span>
- <button class="step-btn" id="font-plus" title="增大字号">+</button>
- </div>
- </div>
- <!-- 系统启动时运行:默认勾选 -->
- <div class="setting-row">
- <div class="setting-info">
- <div class="setting-title">系统启动时运行</div>
- <div class="setting-hint">开机后自动启动腾图工具箱(默认开启)</div>
- </div>
- <label class="switch">
- <input type="checkbox" id="autostart" checked>
- <span class="switch-track"></span>
- </label>
- </div>
- <!-- 窗口置顶 -->
- <div class="setting-row">
- <div class="setting-info">
- <div class="setting-title">窗口置顶</div>
- <div class="setting-hint">主窗口始终显示在其他窗口之上</div>
- </div>
- <label class="switch">
- <input type="checkbox" id="always-on-top">
- <span class="switch-track"></span>
- </label>
- </div>
- <!-- 呼出窗口热键 -->
- <div class="setting-row">
- <div class="setting-info">
- <div class="setting-title">呼出窗口热键</div>
- <div class="setting-hint">点击输入框后按下组合键,例如 Ctrl+Shift+G</div>
- </div>
- <input class="input hotkey-input" id="hotkey" readonly placeholder="按下组合键">
- </div>
- <!-- 笔记页地址 -->
- <div class="setting-row" data-tab-group="notes">
- <div class="setting-info">
- <div class="setting-title">笔记页地址</div>
- <div class="setting-hint">「笔记」标签内嵌的网页</div>
- </div>
- <input class="input" id="notes-url" type="text" placeholder="https://m.scwy.net">
- </div>
- <!-- 控制页地址 -->
- <div class="setting-row" data-tab-group="control">
- <div class="setting-info">
- <div class="setting-title">控制页地址</div>
- <div class="setting-hint">「控制」标签内嵌的网页</div>
- </div>
- <input class="input" id="control-url" type="text" placeholder="https://a7.scwy.net/4191">
- </div>
- <!-- 博客页地址 -->
- <div class="setting-row" data-tab-group="blog">
- <div class="setting-info">
- <div class="setting-title">博客页地址</div>
- <div class="setting-hint">「博客」标签内嵌的网页</div>
- </div>
- <input class="input" id="blog-url" type="text" placeholder="https://i.scwy.net">
- </div>
- <!-- 聊天页地址 -->
- <div class="setting-row" data-tab-group="chat">
- <div class="setting-info">
- <div class="setting-title">聊天页地址</div>
- <div class="setting-hint">「聊天」标签内嵌的网页</div>
- </div>
- <input class="input" id="chat-url" type="text" placeholder="https://c.scwy.net">
- </div>
- <!-- Tab 显示顺序 -->
- <div class="setting-row" data-tab-group="settings">
- <div class="setting-info">
- <div class="setting-title">Tab 显示顺序</div>
- <div class="setting-hint">用逗号分隔 Tab 名称,从左到右依次显示;未列出的追加到末尾</div>
- </div>
- <input class="input" id="tab-order" type="text" placeholder="笔记, 控制, 博客, 聊天, 网址, 新闻">
- </div>
- <!-- 自定义 Tab 页面 -->
- <div class="setting-row setting-row-col" data-tab-group="settings">
- <div class="setting-info">
- <div class="setting-title">自定义 Tab 页面</div>
- <div class="setting-hint">每行一条,格式:页面名称|网址;保存后新增 Tab,名称也用于 Tab 显示顺序</div>
- </div>
- <textarea class="input textarea" id="custom-tabs" rows="3" placeholder="示例|https://example.com"></textarea>
- </div>
- <!-- 硬件页地址 -->
- <div class="setting-row" data-tab-group="hardware">
- <div class="setting-info">
- <div class="setting-title">硬件页地址</div>
- <div class="setting-hint">「硬件」标签内嵌的网页</div>
- </div>
- <input class="input" id="hardware-url" type="text" placeholder="http://192.168.100.190/">
- </div>
- <!-- 股市代码 -->
- <div class="setting-row" data-tab-group="stock">
- <div class="setting-info">
- <div class="setting-title">股市代码</div>
- <div class="setting-hint">多个代码用逗号分隔,纯数字会自动补市场前缀</div>
- </div>
- <input class="input" id="stock-codes" type="text" placeholder="600519, 000001">
- </div>
- <!-- 涨跌颜色 -->
- <div class="setting-row" data-tab-group="stock">
- <div class="setting-info">
- <div class="setting-title">涨跌颜色</div>
- <div class="setting-hint">上涨 / 下跌在列表、图表与滚动条中的显示颜色</div>
- </div>
- <div class="ticker-controls">
- <span class="num-unit">涨</span>
- <input class="input-color" id="stock-up-color" type="color" title="上涨颜色">
- <span class="num-unit">跌</span>
- <input class="input-color" id="stock-down-color" type="color" title="下跌颜色">
- </div>
- </div>
- <!-- 股市刷新间隔 -->
- <div class="setting-row" data-tab-group="stock">
- <div class="setting-info">
- <div class="setting-title">股市刷新间隔</div>
- <div class="setting-hint">自动刷新行情的间隔,默认 30 秒</div>
- </div>
- <div class="num-group">
- <input class="input input-num" id="stock-refresh-secs" type="number" min="5" max="3600">
- <span class="num-unit">秒</span>
- </div>
- </div>
- <!-- 休市刷新间隔 -->
- <div class="setting-row" data-tab-group="stock">
- <div class="setting-info">
- <div class="setting-title">休市刷新间隔</div>
- <div class="setting-hint">休市时自动刷新行情的间隔,默认 2 小时</div>
- </div>
- <div class="num-group">
- <input class="input input-num" id="stock-closed-refresh-secs" type="number" min="60" max="86400">
- <span class="num-unit">秒</span>
- </div>
- </div>
- <!-- 常用网址 -->
- <div class="setting-row setting-row-col" data-tab-group="links">
- <div class="setting-info">
- <div class="setting-title">常用网址</div>
- <div class="setting-hint">每行一条,格式:名称|网址,例如 煎蛋|https://jandan.net/</div>
- </div>
- <textarea class="input textarea" id="links-text" rows="4" placeholder="名称|网址,每行一条"></textarea>
- </div>
- <!-- 新闻关键词 -->
- <div class="setting-row" data-tab-group="news">
- <div class="setting-info">
- <div class="setting-title">新闻关键词</div>
- <div class="setting-hint">逗号分隔;命中关键词的新闻在「新闻」页置顶高亮</div>
- </div>
- <input class="input" id="news-keywords" type="text" placeholder="AI, 芯片, 苹果">
- </div>
- <!-- B站登录 cookie -->
- <div class="setting-row setting-row-col" data-tab-group="news">
- <div class="setting-info">
- <div class="setting-title">B站 cookie</div>
- <div class="setting-hint">登录 bilibili.com 后从浏览器 Cookie 复制 SESSDATA=xxx(整个 cookie 串)。用于在「新闻」页展示你关注的人的最新动态;为空或失效时回退热门视频。cookie 会过期,需定期更新。</div>
- </div>
- <input class="input" id="bili-cookie" type="text" placeholder="SESSDATA=xxxxxxxx; bili_jct=xxxx" spellcheck="false">
- </div>
- <!-- 新闻刷新间隔 -->
- <div class="setting-row" data-tab-group="news">
- <div class="setting-info">
- <div class="setting-title">新闻刷新间隔</div>
- <div class="setting-hint">自动抓取新闻的间隔,默认 2 小时</div>
- </div>
- <div class="num-group">
- <input class="input input-num" id="news-refresh-mins" type="number" min="5" max="1440">
- <span class="num-unit">分钟</span>
- </div>
- </div>
- <!-- 新闻显示条数 -->
- <div class="setting-row" data-tab-group="news">
- <div class="setting-info">
- <div class="setting-title">新闻显示条数</div>
- <div class="setting-hint">「新闻」页最多显示的条目数,默认 30 条</div>
- </div>
- <div class="num-group">
- <input class="input input-num" id="news-count" type="number" min="5" max="200">
- <span class="num-unit">条</span>
- </div>
- </div>
- <!-- Github 项目 -->
- <div class="setting-row setting-row-col" data-tab-group="github">
- <div class="setting-info">
- <div class="setting-title">Github 项目</div>
- <div class="setting-hint">每行一条,格式:仓库地址|项目说明|本地版本(版本可选,用于提示更新)</div>
- </div>
- <textarea class="input textarea" id="github-repos" rows="4" placeholder="https://github.com/wailsapp/wails|Wails 框架|3.0.0"></textarea>
- </div>
- <!-- Github 刷新间隔 -->
- <div class="setting-row" data-tab-group="github">
- <div class="setting-info">
- <div class="setting-title">Github 刷新间隔</div>
- <div class="setting-hint">自动监听仓库更新的间隔,默认 2 小时</div>
- </div>
- <div class="num-group">
- <input class="input input-num" id="github-refresh-mins" type="number" min="5" max="1440">
- <span class="num-unit">分钟</span>
- </div>
- </div>
- <!-- API 监听地址 -->
- <div class="setting-row" data-tab-group="host">
- <div class="setting-info">
- <div class="setting-title">API 监听地址</div>
- <div class="setting-hint">内置 API 服务监听地址,保存后自动重启服务</div>
- </div>
- <input class="input" id="api-addr" type="text" placeholder="127.0.0.1:17890">
- </div>
- <!-- 记录文件路径 -->
- <div class="setting-row" data-tab-group="record">
- <div class="setting-info">
- <div class="setting-title">记录文件路径</div>
- <div class="setting-hint">「记录」标签编辑的文本文件</div>
- </div>
- <input class="input" id="record-path" type="text" placeholder="D:\My\腾图\记录.txt">
- </div>
- <!-- 待办文件路径 -->
- <div class="setting-row" data-tab-group="todo">
- <div class="setting-info">
- <div class="setting-title">待办文件路径</div>
- <div class="setting-hint">「待办」标签每行一个任务,保存到该文本文件</div>
- </div>
- <input class="input" id="todo-path" type="text" placeholder="D:\My\腾图\待办.txt">
- </div>
- <!-- 股票滚动条 -->
- <div class="setting-row" data-tab-group="stock">
- <div class="setting-info">
- <div class="setting-title">股票滚动条</div>
- <div class="setting-hint">屏幕顶部一行置顶滚动显示实时行情,可拖动位置</div>
- </div>
- <div class="ticker-controls">
- <label class="switch" title="显示滚动条">
- <input type="checkbox" id="stock-ticker-enabled">
- <span class="switch-track"></span>
- </label>
- <label class="mini-label" title="背景透明"><input type="checkbox" id="stock-ticker-transparent">透明</label>
- <input class="input input-num" id="stock-ticker-width" type="number" min="200" max="6000" title="宽度 px">
- <input class="input input-num" id="stock-ticker-size" type="number" min="10" max="40" title="字号 px">
- <input class="input-color" id="stock-ticker-color" type="color" title="文字颜色">
- <input class="input input-num" id="stock-ticker-speed" type="number" min="20" max="400" title="滚动速度 px/s">
- </div>
- </div>
- <!-- 新闻滚动条 -->
- <div class="setting-row" data-tab-group="news">
- <div class="setting-info">
- <div class="setting-title">新闻滚动条</div>
- <div class="setting-hint">屏幕顶部一行置顶滚动显示新闻标题,点击标题打开详情</div>
- </div>
- <div class="ticker-controls">
- <label class="switch" title="显示滚动条">
- <input type="checkbox" id="news-ticker-enabled">
- <span class="switch-track"></span>
- </label>
- <label class="mini-label" title="背景透明"><input type="checkbox" id="news-ticker-transparent">透明</label>
- <input class="input input-num" id="news-ticker-width" type="number" min="200" max="6000" title="宽度 px">
- <input class="input input-num" id="news-ticker-size" type="number" min="10" max="40" title="字号 px">
- <input class="input-color" id="news-ticker-color" type="color" title="文字颜色">
- <input class="input input-num" id="news-ticker-speed" type="number" min="20" max="400" title="滚动速度 px/s">
- </div>
- </div>
- <!-- 随机古诗 -->
- <div class="setting-row" data-tab-group="poem">
- <div class="setting-info">
- <div class="setting-title">随机古诗</div>
- <div class="setting-hint">footer 版本后面水平滚动显示一首随机古诗,可点击换一首、朗读(TTS)</div>
- </div>
- <div class="ticker-controls">
- <label class="switch" title="显示古诗">
- <input type="checkbox" id="poem-enabled">
- <span class="switch-track"></span>
- </label>
- <input class="input-color" id="poem-color" type="color" title="文字颜色">
- <input class="input input-num" id="poem-size" type="number" min="12" max="48" title="字号 px">
- <label class="mini-label" title="滚动速度(秒/轮),数值越小滚动越快"><input type="number" id="poem-speed" class="input input-num" min="5" max="120" title="滚动速度(秒/轮)">速度</label>
- <label class="mini-label" title="显示朗读按钮"><input type="checkbox" id="poem-tts">朗读</label>
- </div>
- </div>
- </div>
- <!-- 保存栏 -->
- <div class="save-bar">
- <button class="btn-primary" id="save-settings">保存设置</button>
- <span class="save-status" id="save-status"></span>
- </div>
- </div>
- </div>
- </div>
- <!-- 股票图表弹窗:点击股市行打开,可切换分时图 / 日K图 -->
- <div class="chart-modal" id="chart-modal" hidden>
- <div class="chart-mask" id="chart-mask"></div>
- <div class="chart-dialog" role="dialog" aria-modal="true" aria-label="股票图表">
- <div class="chart-head">
- <div class="chart-title-wrap">
- <div class="chart-title" id="chart-title">--</div>
- <div class="chart-sub" id="chart-sub"></div>
- </div>
- <div class="segmented" id="chart-kind">
- <button class="seg-btn active" data-chart-kind="minute">分时</button>
- <button class="seg-btn" data-chart-kind="kline">日K</button>
- </div>
- <button class="chart-close" id="chart-close" title="关闭">×</button>
- </div>
- <canvas id="chart-canvas"></canvas>
- <div class="chart-legend" id="chart-legend"></div>
- </div>
- </div>
- <!-- 待办提醒弹窗:到点时弹出,置顶显示 -->
- <div class="remind-modal" id="remind-modal" hidden>
- <div class="remind-mask" id="remind-mask"></div>
- <div class="remind-dialog" role="alertdialog" aria-modal="true" aria-label="待办提醒">
- <div class="remind-icon">⏰</div>
- <div class="remind-title">待办提醒</div>
- <div class="remind-text" id="remind-text"></div>
- <div class="remind-time" id="remind-time"></div>
- <div class="remind-actions">
- <button class="btn-primary" id="remind-ok">知道了</button>
- </div>
- </div>
- </div>
- <footer class="footer">
- <span class="footer-version"><span class="dot"></span>腾图工具箱 <span id="footer-version-text"></span></span>
- <div class="footer-desc" id="footer-desc">
- <span class="footer-marquee" id="footer-marquee"></span>
- <button class="poem-read" id="poem-read" title="朗读古诗" hidden>🔊</button>
- </div>
- <span class="footer-time" id="time">--:--:--</span>
- <a class="footer-docs" data-wml-openURL="https://v3.wails.io" aria-label="Wails documentation">官方文档</a>
- </footer>
- <script type="module" src="/src/main.js"></script>
- </body>
- </html>
|