fix(cloudflare): 隧道弹窗去除与应用配置重复字段并发布 v1.6.4

CHANGELOG.md

@@ -2,6 +2,22 @@
 
 All notable changes to this project will be documented in this file.
 
+## [v1.6.4] - 2026-09-28
+
+### 变更
+
+- **新建 / 编辑隧道弹窗去重**：移除与应用配置重复的 Token 输入与网络调优字段；Token、传输协议、边缘地址族、HA 连接数、代理模式统一在「应用配置」中维护，保存时自动应用到新建或编辑的隧道
+- 新建隧道前若未配置默认 Token，弹窗内直接提示并阻止提交；编辑已有隧道不受影响
+- 隧道弹窗现在只保留名称、模式、暴露域名、回源 service 与自动启动
+
+### 变更
+
+- 版本号提升到 1.6.4；`AgentVersion` 保持 **0.14.1**
+
+### 测试
+
+- `npm run typecheck`、`npm test`、`npm run build` 通过
+
 ## [v1.6.3] - 2026-09-28
 
 ### 新增

VERSION

@@ -1 +1 @@
-1.6.3
+1.6.4

docs/README.md

@@ -1,7 +1,7 @@
 # Fonu 文档索引
 
 > 维护约定：新增方案 / 审查文档时在下方登记；方案落地后在「状态」列标注实施结果，并给已被推翻的描述加时效说明。
-> 最近更新：2026-09-28（v1.6.3）
+> 最近更新：2026-09-28（v1.6.4）
 
 ## 方案与设计（本目录）
 

docs/system-upgrade.md

@@ -238,16 +238,16 @@ FONU_VERSION=<旧版本> docker compose up -d --no-deps --force-recreate fonu
 
 ## 10. 在线升级验证
 
-示例页面用于验证升级结果。v1.6.3 的验证流程：
+示例页面用于验证升级结果。v1.6.4 的验证流程：
 
 1. 确认当前线上实例为 v1.3.0，且 `fonu-updater` sidecar 已运行。
-2. 确认远端 `main` 分支的 `VERSION` 为 `1.6.3`。
+2. 确认远端 `main` 分支的 `VERSION` 为 `1.6.4`。
 3. 在侧栏看到「一键升级」后点击并确认。
 4. 等待升级弹窗显示成功，页面自动刷新。
 5. 打开侧栏「示例页面」，确认：
    - 页面路由为 `/example`；
-   - 页面显示的版本为 `1.6.3`；
-   - 页面显示验证标识 `v1.6.3-example-page`；
+   - 页面显示的版本为 `1.6.4`；
+   - 页面显示验证标识 `v1.6.4-example-page`；
    - 页面显示独立的「本次升级验证」区块；
    - 「升级验证」显示为「通过」。
 

web/package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "fonu-web",
-  "version": "1.6.3",
+  "version": "1.6.4",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "fonu-web",
-      "version": "1.6.3",
+      "version": "1.6.4",
       "dependencies": {
         "@codemirror/commands": "^6.11.1",
         "@codemirror/lang-javascript": "^6.2.5",

web/package.json

@@ -1,7 +1,7 @@
 {
   "name": "fonu-web",
   "private": true,
-  "version": "1.6.3",
+  "version": "1.6.4",
   "packageManager": "npm@10.9.4",
   "type": "module",
   "scripts": {

web/src/views/CloudflareView.vue

@@ -42,18 +42,13 @@
       <n-alert :type="form.mode === 'token-remote' ? 'warning' : 'info'" :bordered="false" class="cf-mode-alert">
         {{ modeHint }}
       </n-alert>
+      <n-alert v-if="!appSettings.default_token_configured" type="warning" :bordered="false" class="cf-mode-alert">
+        还没有默认 Token，请先到「应用配置」保存，再创建隧道。
+      </n-alert>
       <n-divider title-placement="left">基本信息</n-divider>
       <n-form label-placement="top">
         <n-form-item label="名称"><n-input v-model:value="form.name" placeholder="例如 home-nas" /></n-form-item>
         <n-form-item label="模式"><n-select v-model:value="form.mode" :options="modeOptions" /></n-form-item>
-        <n-form-item :label="editing ? 'Token（留空保留原值）' : 'Token'">
-          <n-input
-            v-model:value="form.token"
-            type="password"
-            show-password-on="click"
-            :placeholder="appSettings.default_token_configured ? '留空使用应用配置中的默认 token' : 'Cloudflare 面板生成的隧道 token'"
-          />
-        </n-form-item>
       </n-form>
       <n-divider title-placement="left">暴露规则</n-divider>
       <n-form v-if="form.mode === 'token-local'" label-placement="top">
@@ -67,14 +62,11 @@
       <n-alert v-else type="warning" :bordered="false" class="cf-mode-alert">
         云端规则模式下，本地域名与回源配置不生效，请在 Cloudflare 面板管理 ingress。
       </n-alert>
-      <n-divider title-placement="left">网络调优</n-divider>
+      <n-divider title-placement="left">运行</n-divider>
       <n-form label-placement="top">
-        <n-form-item label="传输协议"><n-select v-model:value="form.network.transport_protocol" :options="protocolOptions" /></n-form-item>
-        <n-form-item label="边缘地址族"><n-select v-model:value="form.network.edge_ip_version" :options="edgeOptions" /></n-form-item>
-        <n-form-item label="HA 连接数"><n-input-number v-model:value="form.network.ha_connections" :min="1" :max="4" /></n-form-item>
-        <n-form-item label="代理模式"><n-select v-model:value="form.network.proxy_mode" :options="proxyOptions" /></n-form-item>
         <n-form-item label="随 Fonu 自动启动"><n-switch v-model:value="form.auto_start" /></n-form-item>
       </n-form>
+      <p class="cf-hint">Token 与网络调优统一在「应用配置」中管理，保存后会应用到新建隧道。</p>
     </div>
     <template #footer>
       <div class="cf-modal__footer">
@@ -287,7 +279,7 @@ function openEdit(item: CfTunnel) {
     token: '',
     hostnames: [...(item.hostnames || [])],
     origin_service: item.origin_service || 'http://127.0.0.1:80',
-    network: { ...item.network },
+    network: emptyNetwork(),
     auto_start: item.auto_start,
   }
   editorVisible.value = true
@@ -298,20 +290,25 @@ async function saveTunnel() {
     message.warning('请填写隧道名称')
     return
   }
-  if (!editing.value && !(form.value.token || '').trim() && !appSettings.value.default_token_configured) {
-    message.warning('请填写 token，或先在「应用配置」中保存默认 token')
+  if (!editing.value && !appSettings.value.default_token_configured) {
+    message.warning('请先在「应用配置」中保存默认 Token')
     return
   }
   if (form.value.mode === 'token-local' && !form.value.hostnames.length) {
     message.warning('本地规则模式至少需要一个暴露域名')
     return
   }
+  const payload: CfTunnelPayload = {
+    ...form.value,
+    token: '',
+    network: { ...appSettings.value.network },
+  }
   saving.value = true
   try {
     if (editing.value) {
-      await api.updateCfTunnel(editing.value.id, form.value)
+      await api.updateCfTunnel(editing.value.id, payload)
     } else {
-      await api.createCfTunnel(form.value)
+      await api.createCfTunnel(payload)
     }
     editorVisible.value = false
     message.success('隧道已保存')

web/src/views/ExampleView.vue

@@ -8,7 +8,7 @@
     </template>
   </PageHeader>
 
-  <n-alert type="success" :bordered="false" class="example-alert" title="v1.6.3 示例页面验证标识已生效">
+  <n-alert type="success" :bordered="false" class="example-alert" title="v1.6.4 示例页面验证标识已生效">
     当前页面由 v{{ version }} 提供，验证标识为 <span class="mono">{{ verificationMarker }}</span>。
     如果你是在升级后首次看到这行内容，说明前端构建、镜像重建和服务重启均已成功。
   </n-alert>
@@ -19,7 +19,7 @@
       <strong class="example-proof__value">{{ verificationRound }}</strong>
     </div>
     <div class="example-proof__hint">
-      看到这个新区块，说明前端资源已经从旧版本切换到 v1.6.3。
+      看到这个新区块，说明前端资源已经从旧版本切换到 v1.6.4。
     </div>
   </div>
 
@@ -33,16 +33,16 @@
     <StatCard label="本次验证标识" :value="verificationMarker" sub="用于区分升级前后的前端资源" tone="blue" value-small>
       <template #icon><n-icon :component="FlashOutline" /></template>
     </StatCard>
-    <StatCard label="页面状态" value="已更新" sub="v1.6.3 前端资源已加载" tone="teal">
+    <StatCard label="页面状态" value="已更新" sub="v1.6.4 前端资源已加载" tone="teal">
       <template #icon><n-icon :component="CheckmarkCircleOutline" /></template>
     </StatCard>
   </div>
 
   <FonuCard title="本次示例页变化" subtitle="用于确认升级后的页面内容确实发生变化">
     <ul class="example-changes">
-      <li>页面版本提示更新为 v1.6.3。</li>
-      <li>「本次升级验证」区块和页面状态同步更新为 v1.6.3。</li>
-      <li>验证标识更新为 <span class="mono">v1.6.3-example-page</span>。</li>
+      <li>页面版本提示更新为 v1.6.4。</li>
+      <li>「本次升级验证」区块和页面状态同步更新为 v1.6.4。</li>
+      <li>验证标识更新为 <span class="mono">v1.6.4-example-page</span>。</li>
     </ul>
   </FonuCard>
 
@@ -87,8 +87,8 @@ const message = useMessage()
 const version = ref(__APP_VERSION__)
 const checkedAt = ref('')
 const refreshing = ref(false)
-const verificationRound = 'v1.6.3'
-const verificationMarker = 'v1.6.3-example-page'
+const verificationRound = 'v1.6.4'
+const verificationMarker = 'v1.6.4-example-page'
 
 async function refreshVersion() {
   refreshing.value = true