From da7968d36493ec8b912cf8b0b4269d8375e3b026 Mon Sep 17 00:00:00 2001
From: ssongliu <73214554+ssongliu@users.noreply.github.com>
Date: Tue, 5 Aug 2025 22:10:12 +0800
Subject: [PATCH] fix: Fix firewall routing jump exception issue (#9869)

---
 frontend/src/routers/modules/host.ts          |  1 +
 .../src/views/host/firewall/status/index.vue  | 68 ++++++++++---------
 2 files changed, 36 insertions(+), 33 deletions(-)

diff --git a/frontend/src/routers/modules/host.ts b/frontend/src/routers/modules/host.ts
index 18367007f..4b6d90760 100644
--- a/frontend/src/routers/modules/host.ts
+++ b/frontend/src/routers/modules/host.ts
@@ -47,6 +47,7 @@ const hostRouter = {
             name: 'FirewallPort',
             component: () => import('@/views/host/firewall/port/index.vue'),
             meta: {
+                activeMenu: '/hosts/firewall/port',
                 title: 'menu.firewall',
                 detail: 'firewall.portRule',
                 requiresAuth: false,
diff --git a/frontend/src/views/host/firewall/status/index.vue b/frontend/src/views/host/firewall/status/index.vue
index 41f3c71e8..034446fa1 100644
--- a/frontend/src/views/host/firewall/status/index.vue
+++ b/frontend/src/views/host/firewall/status/index.vue
@@ -1,40 +1,42 @@
 <template>
-    <div class="app-status card-interval" v-if="baseInfo.isExist">
-        <el-card>
-            <div class="flex w-full flex-col gap-4 md:flex-row">
-                <div class="flex flex-wrap gap-4 ml-3">
-                    <el-tag effect="dark" type="success">{{ baseInfo.name }}</el-tag>
-                    <Status class="mt-0.5" :status="baseInfo.isActive ? 'enable' : 'disable'" />
-                    <el-tag>{{ $t('app.version') }}: {{ baseInfo.version }}</el-tag>
-                </div>
-                <div class="mt-0.5">
-                    <el-button type="primary" v-if="baseInfo.isActive" @click="onOperate('stop')" link>
-                        {{ $t('commons.button.stop') }}
-                    </el-button>
-                    <el-button type="primary" v-if="!baseInfo.isActive" @click="onOperate('start')" link>
-                        {{ $t('commons.button.start') }}
-                    </el-button>
-                    <el-divider direction="vertical" />
-                    <el-button type="primary" @click="onOperate('restart')" link>
-                        {{ $t('commons.button.restart') }}
-                    </el-button>
-                    <span v-if="onPing !== 'None'">
+    <div>
+        <div class="app-status card-interval" v-if="baseInfo.isExist">
+            <el-card>
+                <div class="flex w-full flex-col gap-4 md:flex-row">
+                    <div class="flex flex-wrap gap-4 ml-3">
+                        <el-tag effect="dark" type="success">{{ baseInfo.name }}</el-tag>
+                        <Status class="mt-0.5" :status="baseInfo.isActive ? 'enable' : 'disable'" />
+                        <el-tag>{{ $t('app.version') }}: {{ baseInfo.version }}</el-tag>
+                    </div>
+                    <div class="mt-0.5">
+                        <el-button type="primary" v-if="baseInfo.isActive" @click="onOperate('stop')" link>
+                            {{ $t('commons.button.stop') }}
+                        </el-button>
+                        <el-button type="primary" v-if="!baseInfo.isActive" @click="onOperate('start')" link>
+                            {{ $t('commons.button.start') }}
+                        </el-button>
                         <el-divider direction="vertical" />
-                        <el-button type="primary" link>{{ $t('firewall.noPing') }}</el-button>
-                        <el-switch
-                            size="small"
-                            class="ml-2"
-                            inactive-value="Disable"
-                            active-value="Enable"
-                            @change="onPingOperate"
-                            v-model="onPing"
-                        />
-                    </span>
+                        <el-button type="primary" @click="onOperate('restart')" link>
+                            {{ $t('commons.button.restart') }}
+                        </el-button>
+                        <span v-if="onPing !== 'None'">
+                            <el-divider direction="vertical" />
+                            <el-button type="primary" link>{{ $t('firewall.noPing') }}</el-button>
+                            <el-switch
+                                size="small"
+                                class="ml-2"
+                                inactive-value="Disable"
+                                active-value="Enable"
+                                @change="onPingOperate"
+                                v-model="onPing"
+                            />
+                        </span>
+                    </div>
                 </div>
-            </div>
-        </el-card>
+            </el-card>
+        </div>
+        <NoSuchService v-if="!baseInfo.isExist" name="Firewalld / Ufw" />
     </div>
-    <NoSuchService v-if="!baseInfo.isExist" name="Firewalld / Ufw" />
 </template>
 
 <script lang="ts" setup>