{$layout}
{$template "waf_menu"}

<form method="post" class="ui form" data-tea-action="$" data-tea-success="success">
	<csrf-token></csrf-token>
	<input type="hidden" name="firewallPolicyId" :value="firewallPolicyId"/>

	<div class="left-right-box-container">
		<div class="right-box">
			<!-- 入站规则设置 -->
			<div class="config-section">
				<div class="section-title">
					<i class="icon sign-in"></i>
					{{t('waf_export@入站规则设置')}}
				</div>

				<div class="config-item">
					<div class="item-label">{{t('waf_export@启用的入站规则')}}</div>
					<div class="item-content">
						<b-empty v-if="enabledInboundGroups.length == 0">{{t('waf_export@无入站规则')}}</b-empty>
						<div class="groups-box" v-show="enabledInboundGroups.length > 0">
							<div v-for="g in enabledInboundGroups" class="group-box">
								<checkbox name="inboundGroupIds" :v-value="true" :v-value="g.id">{{g.name}}</checkbox>
							</div>
						</div>
					</div>
				</div>

				<div class="config-item" v-if="disabledInboundGroups.length > 0">
					<div class="item-label">{{t('waf_export@停用的入站规则')}}</div>
					<div class="item-content">
						<div class="groups-box">
							<div v-for="g in disabledInboundGroups" class="group-box">
								<checkbox name="inboundGroupIds" :value="false" :v-value="g.id">{{g.name}} &nbsp;<sup><span class="red">{{t('waf_export@停用')}}</span></sup></checkbox>
							</div>
						</div>
					</div>
				</div>
			</div>

			<!-- 出站规则设置 -->
			<div class="config-section">
				<div class="section-title">
					<i class="icon sign-out"></i>
					{{t('waf_export@出站规则设置')}}
				</div>

				<div class="config-item">
					<div class="item-label">{{t('waf_export@启用的出站规则')}}</div>
					<div class="item-content">
						<b-empty v-if="enabledOutboundGroups.length == 0">{{t('waf_export@无出站规则')}}</b-empty>
						<div class="groups-box" v-show="enabledOutboundGroups.length > 0">
							<div v-for="g in enabledOutboundGroups" class="group-box">
								<checkbox name="outboundGroupIds" :value="true" :v-value="g.id">{{g.name}}</checkbox>
							</div>
						</div>
					</div>
				</div>

				<div class="config-item" v-if="disabledOutboundGroups.length > 0">
					<div class="item-label">{{t('waf_export@停用的出站规则')}}</div>
					<div class="item-content">
						<div class="groups-box">
							<div v-for="g in disabledOutboundGroups" class="group-box">
								<checkbox name="outboundGroupIds" :value="false" :v-value="g.id">{{g.name}} &nbsp;<sup><span class="red">{{t('waf_export@停用')}}</span></sup></checkbox>
							</div>
						</div>
					</div>
				</div>
			</div>

			<div class="margin"></div>
			<submit-btn>{{t('waf_export@导出')}}</submit-btn>
		</div>
	</div>
</form>