coder/vision-record
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: 重写设置模态框HTML结构，所有内容在同一层级

Browse Source
This commit is contained in:
hubian
2026-04-17 12:05:43 +08:00
parent d207db8fb0
commit 7f513cc632
1 changed files with 33 additions and 63 deletions
Download Patch File Download Diff File Expand all files Collapse all files

96
web/static/index.html
View File

@@ -102,144 +102,114 @@
<div class="modal" id="settings-modal" onclick="closeModalOnBackground(event, 'settings-modal')">
<div class="modal-content settings-modal-content" onclick="event.stopPropagation()">
<span class="modal-close" onclick="closeSettingsModal()">×</span>
<h2>⚙️ 系统设置</h2>
<h2>Settings</h2>
<div class="settings-section">
<h4>保存设置</h4>
<h4>Save Settings</h4>
<div class="setting-item">
<label>图片保存目录:</label>
<input type="text" id="setting-images-dir" placeholder="例如: D:\vision-images">
<button onclick="browseImagesDir()" class="btn-small">选择目录</button>
<label>Save Dir:</label>
<input type="text" id="setting-images-dir">
</div>
<p class="setting-note">每天的图片会自动保存到子文件夹（如 2026-04-16）</p>
</div>
<div class="settings-section">
<h4>拍照设置</h4>
<div class="setting-item">
<label>拍照间隔 (秒):</label>
<label>Interval (s):</label>
<input type="number" id="setting-interval" value="60" min="10" max="3600">
</div>
<div class="setting-item">
<label>摄像头索引:</label>
<input type="number" id="setting-camera-index" value="0" min="0" max="10">
</div>
<div class="setting-item">
<label>自动分析:</label>
<input type="checkbox" id="setting-auto-analyze" checked>
</div>
</div>
<div class="settings-section">
<h4>显示设置</h4>
<div class="setting-item">
<label>显示最近数量:</label>
<label>Display Limit:</label>
<input type="number" id="setting-display-limit" value="20" min="5" max="100">
</div>
<div class="setting-item">
<label>页面刷新间隔 (秒):</label>
<label>Refresh (s):</label>
<input type="number" id="setting-refresh-interval" value="5" min="1" max="60">
</div>
</div>
<div class="settings-section">
<h4>👤 Person Detection (YOLO)</h4>
<h4>Person Detection (YOLO)</h4>
<div class="setting-item">
<label>Enable YOLO:</label>
<label>Enable:</label>
<input type="checkbox" id="setting-use-yolo" checked>
<span class="setting-desc">Human body detection</span>
</div>
<div class="setting-item">
<label>Min Confidence:</label>
<label>Min Conf:</label>
<input type="number" id="setting-yolo-confidence" value="0.3" min="0.1" max="1" step="0.1">
<span class="setting-desc">Detection threshold (lower = more sensitive)</span>
</div>
</div>
<div class="settings-section">
<h4>🔍 Person Identification</h4>
<h4>Person Identification</h4>
<div class="setting-item">
<label>Face Recognition:</label>
<label>Face Rec:</label>
<input type="checkbox" id="setting-use-face-rec" checked>
<span class="setting-desc">Best accuracy (requires dlib)</span>
</div>
<div class="setting-item">
<label>MediaPipe Face:</label>
<label>MediaPipe:</label>
<input type="checkbox" id="setting-use-mediapipe" checked>
<span class="setting-desc">Face landmarks detection</span>
</div>
<div class="setting-item">
<label>Color Histogram:</label>
<label>Color Hist:</label>
<input type="checkbox" id="setting-use-color-hist" checked>
<span class="setting-desc">Backup method</span>
</div>
<div class="setting-item">
<label>Match Threshold:</label>
<label>Threshold:</label>
<input type="number" id="setting-match-threshold" value="0.6" min="0.1" max="1" step="0.1">
<span class="setting-desc">Lower = stricter matching</span>
</div>
</div>
<div class="settings-section">
<h4>✅ Confirmation Settings</h4>
<h4>Confirmation</h4>
<div class="setting-item">
<label>Confirm Frames:</label>
<input type="number" id="setting-confirm-frames" value="3" min="1" max="10">
<span class="setting-desc">Frames to confirm change</span>
</div>
<div class="setting-item">
<label>Leave Frames:</label>
<input type="number" id="setting-leave-frames" value="2" min="1" max="10">
<span class="setting-desc">Frames to confirm leaving</span>
</div>
</div>
<div class="settings-section">
<h4>🤖 AI Analysis</h4>
</div>
</div>
<div class="settings-section">
<h4>AI Analysis</h4>
<div class="setting-item">
<label>启用大模型分析:</label>
<label>Enable:</label>
<input type="checkbox" id="setting-use-vision-api">
<span class="setting-desc">调用 Vision API 详细分析</span>
</div>
<div class="setting-item">
<label>触发条件:</label>
<label>Trigger:</label>
<select id="setting-vision-trigger">
<option value="person_change">人员变化时</option>
<option value="motion">运动检测时</option>
<option value="brightness">亮度变化时</option>
<option value="always">总是分析</option>
<option value="person_change">Person Change</option>
<option value="motion">Motion</option>
<option value="brightness">Brightness</option>
<option value="always">Always</option>
</select>
</div>
</div>
<div class="settings-section">
<h4>API 设置</h4>
<h4>API Config</h4>
<div class="setting-item">
<label>Vision API URL:</label>
<input type="text" id="setting-api-url" placeholder="API URL">
<label>URL:</label>
<input type="text" id="setting-api-url">
</div>
<div class="setting-item">
<label>API Key:</label>
<input type="password" id="setting-api-key" placeholder="API Key">
<label>Key:</label>
<input type="password" id="setting-api-key">
</div>
<div class="setting-item">
<label>模型名称:</label>
<input type="text" id="setting-model" placeholder="模型名称">
<label>Model:</label>
<input type="text" id="setting-model">
</div>
</div>
<div class="settings-actions">
<button onclick="saveSettings()" class="btn-primary">保存设置</button>
<button onclick="closeSettingsModal()" class="btn-secondary">取消</button>
<button onclick="saveSettings()" class="btn-primary">Save</button>
<button onclick="closeSettingsModal()" class="btn-secondary">Cancel</button>
</div>
</div>
</div>
<!-- 统计图表模态框 -->
<!-- 统计图表模态框 -->
<div class="modal" id="stats-modal" onclick="closeModalOnBackground(event, 'stats-modal')">
<div class="modal-content stats-modal-content" onclick="event.stopPropagation()">