design(configurable-proxy): 修图标(补 plus/私有服务用 shield)+ 桌面补齐 + 模式语义

- icons.js 补 'plus'(原缺失致「添加规则」+ 空);私有服务图标 server(不存在)→ shield
- 桌面 routing 视图:内置规则加图标框(与移动一致)+ 从文本导入/重置默认已在
- 移动 routing 子屏:补「从文本导入/重置默认」
- 两端加模式说明:用户规则仅「智能分流」生效;全局/直连忽略(系统层仍强制)
- 说明文档加三模式语义表 + 系统层解释

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
wangjia
2026-07-27 02:26:48 +08:00
parent 27b9f0965a
commit f1292b757c
4 changed files with 21 additions and 5 deletions
+1
View File
@@ -47,6 +47,7 @@
// ── 源自 lucide-react 包(web/website/node_modules/lucide-react v0.469.0usercenter 未含)──
'power': '<path d="M12 2v10"/><path d="M18.4 6.6a9 9 0 1 1-12.77.04"/>',
'plus': '<path d="M5 12h14"/><path d="M12 5v14"/>',
'loader-circle': '<path d="M21 12a9 9 0 1 1-6.219-8.56"/>',
'globe': '<circle cx="12" cy="12" r="10"/><path d="M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20"/><path d="M2 12h20"/>',
'user': '<path d="M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2"/><circle cx="12" cy="7" r="4"/>',
+5 -4
View File
@@ -740,16 +740,17 @@
<div class="view-body settings-view">
<button class="pv-back" id="rtBack"><svg><use href="#i-arrow-left"/></svg><span>返回设置</span></button>
<div class="sec-label">代理模式</div>
<div class="segswitch" style="margin-bottom:var(--space-5)">
<div class="segswitch">
<button class="segswitch-opt"><span>全局代理</span></button>
<button class="segswitch-opt is-active"><span>智能分流</span></button>
<button class="segswitch-opt"><span>全部直连</span></button>
</div>
<p style="font-size:var(--text-caption);color:var(--fg3);margin:var(--space-2) 0 var(--space-5)">下方「我的规则」仅在<b>智能分流</b>模式生效。全局代理 / 全部直连为一刀切模式,忽略自定义规则(系统强制层仍保留)。</p>
<div class="sec-label">内置规则</div>
<div class="card card-flush" style="margin-bottom:var(--space-5)">
<div class="setting-row"><div class="st-body"><div class="st-title">国内直连</div><div class="st-sub">GeoIP / GeoSite CN</div></div><span class="st-trail"><button class="toggle is-on"><i></i></button></span></div>
<div class="setting-row"><div class="st-body"><div class="st-title">局域网 / 私网直连</div><div class="st-sub">强制,不可关</div></div><span class="st-trail"><span class="pill is-neutral">🔒 强制</span></span></div>
<div class="setting-row"><div class="st-body"><div class="st-title">私有服务走隧道</div><div class="st-sub">服务端下发</div></div><span class="st-trail"><span class="pill is-neutral">🔒 服务端</span></span></div>
<div class="setting-row"><span class="icon-box"><svg><use href="#i-globe"/></svg></span><div class="st-body"><div class="st-title">国内直连</div><div class="st-sub">GeoIP / GeoSite CN</div></div><span class="st-trail"><button class="toggle is-on"><i></i></button></span></div>
<div class="setting-row"><span class="icon-box"><svg><use href="#i-home"/></svg></span><div class="st-body"><div class="st-title">局域网 / 私网直连</div><div class="st-sub">强制,不可关</div></div><span class="st-trail"><span class="pill is-neutral">🔒 强制</span></span></div>
<div class="setting-row"><span class="icon-box"><svg><use href="#i-shield"/></svg></span><div class="st-body"><div class="st-title">私有服务走隧道</div><div class="st-sub">服务端下发</div></div><span class="st-trail"><span class="pill is-neutral">🔒 服务端</span></span></div>
</div>
<div class="sec-label">我的规则 · 有序,首命中生效</div>
<div class="card card-flush" style="margin-bottom:var(--space-4)">
+6 -1
View File
@@ -924,11 +924,12 @@
<button class="segswitch-opt is-active"><span>智能分流</span></button>
<button class="segswitch-opt"><span>全部直连</span></button>
</div>
<p class="sub-note" style="text-align:left;margin:0">「我的规则」仅在<b>智能分流</b>模式生效;全局 / 直连为一刀切,忽略自定义规则(系统强制层仍保留)。</p>
<div class="sec-label">内置规则</div>
<div class="card card-flush">
<div class="setting-row"><span class="icon-box"><svg><use href="#i-globe"/></svg></span><div class="st-body"><div class="st-title">国内直连</div><div class="st-sub">GeoIP / GeoSite CN</div></div><div class="st-trail"><button class="toggle is-on"><i></i></button></div></div>
<div class="setting-row"><span class="icon-box"><svg><use href="#i-home"/></svg></span><div class="st-body"><div class="st-title">局域网 / 私网直连</div><div class="st-sub">强制,不可关</div></div><div class="st-trail"><span class="pill is-neutral">🔒</span></div></div>
<div class="setting-row"><span class="icon-box"><svg><use href="#i-server"/></svg></span><div class="st-body"><div class="st-title">私有服务走隧道</div><div class="st-sub">服务端下发</div></div><div class="st-trail"><span class="pill is-neutral">🔒</span></div></div>
<div class="setting-row"><span class="icon-box"><svg><use href="#i-shield"/></svg></span><div class="st-body"><div class="st-title">私有服务走隧道</div><div class="st-sub">服务端下发</div></div><div class="st-trail"><span class="pill is-neutral">🔒</span></div></div>
</div>
<div class="sec-label">我的规则 · 首命中生效</div>
<div class="card card-flush">
@@ -937,6 +938,10 @@
<div class="setting-row"><span style="color:var(--fg3);opacity:.55"></span><div class="st-body"><div class="st-title" style="font-family:var(--font-mono);font-size:var(--text-sm)">category-ads</div><div class="st-sub">GeoSite 规则集</div></div><div class="st-trail"><span class="pill is-danger">拒绝</span></div></div>
</div>
<button class="btn btn-subtle btn-block"><svg><use href="#i-plus"/></svg>添加规则</button>
<div style="display:flex;gap:var(--space-2)">
<button class="btn btn-ghost" style="flex:1"><svg><use href="#i-download"/></svg>从文本导入</button>
<button class="btn btn-ghost" style="flex:1"><svg><use href="#i-refresh-cw"/></svg>重置默认</button>
</div>
<div class="sec-label">最终(未命中)</div>
<div class="card card-flush"><div class="setting-row"><div class="st-body"><div class="st-title">FINAL 兜底</div></div><div class="st-trail"><span class="pill is-warning">走隧道</span></div></div></div>
</div>
+9
View File
@@ -118,6 +118,15 @@ App ◀────────── 完整 sing-box 配置(含用户规则)
<tr><td>撞到锁定的系统目标(如给私有服务域名加规则)</td><td>「该域名由系统强制走隧道,此规则不生效」</td></tr>
</table>
<h3>三模式语义 · 用户规则仅「智能分流」生效</h3>
<table>
<tr><th>模式</th><th>行为</th><th>用户规则</th></tr>
<tr><td>智能分流(默认)</td><td>完整规则链:系统层 → 用户规则 → 国内分流 → FINAL</td><td><b>生效</b></td></tr>
<tr><td>全局代理</td><td>除系统层(LAN/私有服务)外全走隧道</td><td>忽略</td></tr>
<tr><td>全部直连</td><td>除系统层(私有服务走隧道)外全直连</td><td>忽略</td></tr>
</table>
<p><b>系统层(层1-3)在任何模式都强制生效</b>——全局/直连只改 FINAL 兜底 + 是否套用用户规则,不会关掉 DNS 劫持/LAN 直连/私有服务。UI 在非智能分流模式下把「我的规则」区灰化并注明"当前模式忽略以下规则"。</p>
<h3>与现有 Settings「Smart routing」的衔接</h3>
<p>现在 Settings 的 <code>Smart routing</code> 是二元开关(= <code>builtin.china_direct</code>)。改为<b>渐进式披露入口</b>:该行变成「分流规则」设置行(右侧显示当前模式 + chevron →),点进去即分流规则屏。休闲用户维持"智能分流"不点即可(等价现在开关开着),高级用户点进去自定义。老的二元开关被三模式(全局/智能分流/直连)涵盖。</p>