diff --git a/internal/web/actions/default/servers/components/waf/index.go b/internal/web/actions/default/servers/components/waf/index.go
index bd2fc518..70517b34 100644
--- a/internal/web/actions/default/servers/components/waf/index.go
+++ b/internal/web/actions/default/servers/components/waf/index.go
@@ -70,10 +70,17 @@ func (this *IndexAction) RunGet(params struct {
 		}
 		countClusters := countClustersResp.Count
 
+		// mode
+		if len(policy.Mode) == 0 {
+			policy.Mode = firewallconfigs.FirewallModeDefend
+		}
+
 		policyMaps = append(policyMaps, maps.Map{
 			"id":            policy.Id,
 			"isOn":          policy.IsOn,
 			"name":          policy.Name,
+			"mode":          policy.Mode,
+			"modeInfo":      firewallconfigs.FindFirewallMode(policy.Mode),
 			"countInbound":  countInbound,
 			"countOutbound": countOutbound,
 			"countClusters": countClusters,
diff --git a/internal/web/actions/default/servers/components/waf/policy.go b/internal/web/actions/default/servers/components/waf/policy.go
index 60955df1..84718808 100644
--- a/internal/web/actions/default/servers/components/waf/policy.go
+++ b/internal/web/actions/default/servers/components/waf/policy.go
@@ -4,6 +4,7 @@ import (
 	"github.com/TeaOSLab/EdgeAdmin/internal/web/actions/actionutils"
 	"github.com/TeaOSLab/EdgeCommon/pkg/rpc/dao"
 	"github.com/TeaOSLab/EdgeCommon/pkg/rpc/pb"
+	"github.com/TeaOSLab/EdgeCommon/pkg/serverconfigs/firewallconfigs"
 	"github.com/iwind/TeaGo/maps"
 )
 
@@ -46,11 +47,17 @@ func (this *PolicyAction) RunGet(params struct {
 		}
 	}
 
+	// 模式
+	if len(firewallPolicy.Mode) == 0 {
+		firewallPolicy.Mode = firewallconfigs.FirewallModeDefend
+	}
 	this.Data["firewallPolicy"] = maps.Map{
 		"id":           firewallPolicy.Id,
 		"name":         firewallPolicy.Name,
 		"isOn":         firewallPolicy.IsOn,
 		"description":  firewallPolicy.Description,
+		"mode":         firewallPolicy.Mode,
+		"modeInfo":     firewallconfigs.FindFirewallMode(firewallPolicy.Mode),
 		"groups":       internalGroups,
 		"blockOptions": firewallPolicy.BlockOptions,
 	}
diff --git a/internal/web/actions/default/servers/components/waf/update.go b/internal/web/actions/default/servers/components/waf/update.go
index 9ab50b31..dcd8bd90 100644
--- a/internal/web/actions/default/servers/components/waf/update.go
+++ b/internal/web/actions/default/servers/components/waf/update.go
@@ -42,11 +42,18 @@ func (this *UpdateAction) RunGet(params struct {
 		}
 	}
 
+	// mode
+	if len(firewallPolicy.Mode) == 0 {
+		firewallPolicy.Mode = firewallconfigs.FirewallModeDefend
+	}
+	this.Data["modes"] = firewallconfigs.FindAllFirewallModes()
+
 	this.Data["firewallPolicy"] = maps.Map{
 		"id":           firewallPolicy.Id,
 		"name":         firewallPolicy.Name,
 		"description":  firewallPolicy.Description,
 		"isOn":         firewallPolicy.IsOn,
+		"mode":         firewallPolicy.Mode,
 		"blockOptions": firewallPolicy.BlockOptions,
 	}
 
@@ -79,6 +86,7 @@ func (this *UpdateAction) RunPost(params struct {
 	BlockOptionsJSON []byte
 	Description      string
 	IsOn             bool
+	Mode             string
 
 	Must *actions.Must
 }) {
@@ -103,6 +111,7 @@ func (this *UpdateAction) RunPost(params struct {
 		Description:          params.Description,
 		FirewallGroupCodes:   params.GroupCodes,
 		BlockOptionsJSON:     params.BlockOptionsJSON,
+		Mode:                 params.Mode,
 	})
 	if err != nil {
 		this.ErrorPage(err)
diff --git a/web/views/@default/servers/components/waf/index.html b/web/views/@default/servers/components/waf/index.html
index 2068ca17..de22d5fd 100644
--- a/web/views/@default/servers/components/waf/index.html
+++ b/web/views/@default/servers/components/waf/index.html
@@ -37,10 +37,19 @@
     </thead>
     <tr v-for="policy in policies">
         <td><a :href="'/servers/components/waf/policy?firewallPolicyId=' + policy.id"><keyword :v-word="keyword">{{policy.name}}</keyword></a></td>
-        <td class="center">{{policy.countInbound}}</td>
-        <td class="center">{{policy.countOutbound}}</td>
+        <td class="center">
+            <a :href="'/servers/components/waf/groups?firewallPolicyId=' + policy.id +  '&type=inbound'"><span :class="{disabled:policy.countInbound == 0 }">{{policy.countInbound}}</span></a>
+        </td>
+        <td class="center">
+            <a :href="'/servers/components/waf/groups?firewallPolicyId=' + policy.id +  '&type=outbound'"><span :class="{disabled:policy.countOutbound == 0 }">{{policy.countOutbound}}</span></a>
+        </td>
         <td class="center">{{policy.countClusters}}</td>
-        <td class="center"><label-on :v-is-on="policy.isOn"></label-on></td>
+        <td class="center">
+            <span v-if="!policy.isOn" class="red">已停用</span>
+            <div v-else-if="policy.modeInfo != null">
+                <span :class="{green: policy.modeInfo.code == 'defend', blue: policy.modeInfo.code == 'observe', grey: policy.modeInfo.code == 'pass'}">{{policy.modeInfo.name}}</span>
+            </div>
+        </td>
         <td>
             <a :href="'/servers/components/waf/policy?firewallPolicyId=' + policy.id">详情</a> &nbsp;
             <a href="" @click.prevent="deletePolicy(policy.id)">删除</a>
diff --git a/web/views/@default/servers/components/waf/policy.html b/web/views/@default/servers/components/waf/policy.html
index 81b9291a..bca32e5b 100644
--- a/web/views/@default/servers/components/waf/policy.html
+++ b/web/views/@default/servers/components/waf/policy.html
@@ -7,9 +7,13 @@
         <td>{{firewallPolicy.name}}</td>
     </tr>
     <tr>
-        <td>是否启用</td>
+        <td>状态</td>
         <td>
-            <label-on :v-is-on="firewallPolicy.isOn"></label-on>
+            <span v-if="!firewallPolicy.isOn" class="red">已停用</span>
+            <div v-else-if="firewallPolicy.modeInfo != null">
+                <span :class="{green: firewallPolicy.modeInfo.code == 'defend', blue: firewallPolicy.modeInfo.code == 'observe', grey: firewallPolicy.modeInfo.code == 'pass'}">{{firewallPolicy.modeInfo.name}}</span>
+                <p class="comment">{{firewallPolicy.modeInfo.description}}</p>
+            </div>
         </td>
     </tr>
     <tr>
diff --git a/web/views/@default/servers/components/waf/update.html b/web/views/@default/servers/components/waf/update.html
index 209063f5..b8d3ac71 100644
--- a/web/views/@default/servers/components/waf/update.html
+++ b/web/views/@default/servers/components/waf/update.html
@@ -12,6 +12,15 @@
 					<p class="comment">给策略起一个容易识别的名字。</p>
 				</td>
 			</tr>
+            <tr>
+                <td>当前模式</td>
+                <td>
+                    <select class="ui dropdown auto-width" name="mode" v-model="firewallPolicy.mode">
+                        <option v-for="mode in modes" :value="mode.code">{{mode.name}}</option>
+                    </select>
+                    <p class="comment" v-for="mode in modes" v-if="mode.code == firewallPolicy.mode">{{mode.description}}</p>
+                </td>
+            </tr>
 			<tr>
 				<td>启用预置的规则</td>
 				<td>