- 移除管理员初始化/登录/JWT 流程,改为固定进入密钥(19735500), 首次启动自动初始化到数据库 settings 表(可改库更新) - analyze 接口支持可选密钥鉴权:X-Access-Key 请求头或 access_key 字段, 带密钥强制校验(错误 401),不带密钥保持免鉴权 - 解锁后顶栏"复制 API 文档"按钮:以当前访问 URL 为基础地址动态生成 Markdown 文档(免鉴权/带密钥两种 curl 示例,供智能体直接调用) - 白昼/黑夜主题切换:CSS 变量驱动,localStorage 持久化,默认跟随系统 - 修复 hidden 属性被 display:flex 覆盖导致解锁层无法隐藏的问题 - 页面去除"免费/Agnes"文案,页脚署名青梧映星软件开发工作室 - build.bat/build.sh 简化为 Linux 交叉编译(CGO_ENABLED=0) - 依赖精简:移除 golang-jwt/bcrypt,直接依赖仅 gin/sqlite/gorm/yaml Co-Authored-By: Claude <noreply@anthropic.com>
70 lines
2.6 KiB
HTML
70 lines
2.6 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="zh-CN">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>Vision Tool — 在线图片识别</title>
|
||
<link rel="stylesheet" href="/css/style.css">
|
||
</head>
|
||
<body>
|
||
<header class="topbar">
|
||
<div class="brand">
|
||
<span class="logo">👁️</span>
|
||
<div>
|
||
<h1>Vision Tool</h1>
|
||
<p>在线图片识别</p>
|
||
</div>
|
||
</div>
|
||
<div class="account" id="accountArea">
|
||
<button class="btn btn-ghost" id="themeBtn" title="切换白昼/黑夜">🌙</button>
|
||
<!-- 解锁状态由 JS 渲染 -->
|
||
</div>
|
||
</header>
|
||
|
||
<main class="container">
|
||
<section class="card upload-card">
|
||
<div class="dropzone" id="dropzone">
|
||
<input type="file" id="fileInput" accept="image/png,image/jpeg,image/gif,image/webp,image/bmp,image/tiff" multiple hidden>
|
||
<div class="dropzone-icon">🖼️</div>
|
||
<p class="dropzone-title">点击选择或拖拽图片到这里</p>
|
||
<p class="dropzone-hint">支持 PNG / JPG / GIF / WebP / BMP,可多张同时识别(对比异同)</p>
|
||
</div>
|
||
<div class="preview-list" id="previewList"></div>
|
||
|
||
<div class="prompt-row">
|
||
<input type="text" id="promptInput" class="prompt-input"
|
||
placeholder="可选:自定义分析提问,例如「提取图中所有文字」「分析这个 UI 的布局结构」">
|
||
<button class="btn btn-primary" id="analyzeBtn" disabled>开始识别</button>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="card result-card" id="resultCard" hidden>
|
||
<div class="result-head">
|
||
<h2>识别结果</h2>
|
||
<div class="result-actions">
|
||
<button class="btn btn-ghost" id="copyBtn">复制</button>
|
||
</div>
|
||
</div>
|
||
<pre class="result-body" id="resultBody"></pre>
|
||
<p class="result-meta" id="resultMeta"></p>
|
||
</section>
|
||
</main>
|
||
|
||
<!-- 进入密钥解锁层 -->
|
||
<div class="unlock-mask" id="unlockLayer">
|
||
<div class="unlock-card">
|
||
<div class="unlock-icon">🔐</div>
|
||
<h2>Vision Tool</h2>
|
||
<p class="unlock-desc">请输入进入密钥</p>
|
||
<input type="password" id="unlockKey" class="unlock-input" placeholder="进入密钥" autofocus>
|
||
<div class="modal-error" id="unlockError"></div>
|
||
<button class="btn btn-primary btn-block" id="unlockBtn">进入</button>
|
||
</div>
|
||
</div>
|
||
|
||
<footer class="footer">在线图片识别 · 识别接口支持 API 直接调用<br>© 青梧映星软件开发工作室 版权所有</footer>
|
||
|
||
<script src="/js/app.js"></script>
|
||
</body>
|
||
</html>
|