|
|
@@ -2071,9 +2071,9 @@
|
|
|
<div>
|
|
|
<div class="flex items-center gap-2 mb-1">
|
|
|
<span class="px-2.5 py-0.5 rounded-full text-[10px] font-semibold bg-emerald-500/20 text-emerald-300 border border-emerald-500/30 tracking-wide uppercase">Packet Inspection</span>
|
|
|
- <h2 class="text-base font-bold text-white">Firewall & Traffic Controller</h2>
|
|
|
+ <h2 class="text-base font-bold text-white">iptables Firewall</h2>
|
|
|
</div>
|
|
|
- <p class="text-xs text-slate-400">Enterprise stateful inspection firewall, network address translation (NAT), packet marking (Mangle), IP address lists, and active connection tracking (conntrack).</p>
|
|
|
+ <p class="text-xs text-slate-400">Manage Linux filter, NAT and mangle tables, address lists (ipset), GeoIP and connection tracking (conntrack). Rules are evaluated in order within each chain.</p>
|
|
|
</div>
|
|
|
|
|
|
<div class="flex items-center space-x-2.5">
|
|
|
@@ -2089,7 +2089,7 @@
|
|
|
<!-- Sub Tabs: Filter / NAT / Mangle / Address Lists / Connections -->
|
|
|
<div class="flex border-b border-slate-800 space-x-1 overflow-x-auto">
|
|
|
<button id="fw-subtab-btn-filter" onclick="switchFWSubTab('filter')" class="px-4 py-2.5 text-xs font-bold border-b-2 border-emerald-500 text-white transition flex items-center gap-2 whitespace-nowrap">
|
|
|
- <span>Filter Rules</span>
|
|
|
+ <span>Filter</span>
|
|
|
<span id="fw-badge-filter" class="px-1.5 py-0.2 rounded text-[10px] bg-slate-800 text-slate-300">0</span>
|
|
|
</button>
|
|
|
<button id="fw-subtab-btn-nat" onclick="switchFWSubTab('nat')" class="px-4 py-2.5 text-xs font-bold border-b-2 border-transparent text-slate-400 hover:text-slate-200 transition flex items-center gap-2 whitespace-nowrap">
|
|
|
@@ -2118,7 +2118,7 @@
|
|
|
<div id="fw-subtab-filter" class="bg-slate-900/90 border border-slate-800 rounded-xl overflow-hidden">
|
|
|
<div class="p-4 border-b border-slate-800 flex items-center justify-between flex-wrap gap-3">
|
|
|
<div class="flex items-center gap-3">
|
|
|
- <h3 class="text-sm font-bold text-white">Firewall Filter Rules</h3>
|
|
|
+ <h3 class="text-sm font-bold text-white">Filter table</h3>
|
|
|
<span id="filter-count-badge" class="text-xs font-mono text-slate-400">0 Rules</span>
|
|
|
</div>
|
|
|
<div class="flex items-center gap-2">
|
|
|
@@ -2137,14 +2137,14 @@
|
|
|
<thead class="text-slate-400 bg-slate-950/60 border-b border-slate-800 uppercase tracking-wider text-[10px] font-sans">
|
|
|
<tr>
|
|
|
<th class="py-2.5 px-3 w-10 text-center">#</th>
|
|
|
- <th class="py-2.5 px-3 w-12 text-center" title="Flags: X=Disabled, C=Comment">Flag</th>
|
|
|
+ <th class="py-2.5 px-3 w-12 text-center" title="Status: X=Disabled, C=Comment">Status</th>
|
|
|
<th class="py-2.5 px-3">Chain</th>
|
|
|
<th class="py-2.5 px-3">Src. Address</th>
|
|
|
<th class="py-2.5 px-3">Dst. Address</th>
|
|
|
<th class="py-2.5 px-3">Protocol</th>
|
|
|
<th class="py-2.5 px-3">Ports</th>
|
|
|
<th class="py-2.5 px-3">In / Out</th>
|
|
|
- <th class="py-2.5 px-3">Action</th>
|
|
|
+ <th class="py-2.5 px-3">Target</th>
|
|
|
<th class="py-2.5 px-3">Packets / Bytes</th>
|
|
|
<th class="py-2.5 px-3">Comment</th>
|
|
|
<th class="py-2.5 px-3 text-right font-sans">Order & Actions</th>
|
|
|
@@ -2170,8 +2170,10 @@
|
|
|
<label class="text-xs text-slate-400 font-sans">Chain:</label>
|
|
|
<select id="nat-filter-chain" onchange="renderNATRules()" class="bg-slate-800 border border-slate-700 rounded-lg px-2.5 py-1 text-xs text-white font-mono">
|
|
|
<option value="">All Chains</option>
|
|
|
- <option value="srcnat">srcnat (SNAT / Masquerade)</option>
|
|
|
- <option value="dstnat">dstnat (Port Forwarding)</option>
|
|
|
+ <option value="prerouting">PREROUTING</option>
|
|
|
+ <option value="input">INPUT</option>
|
|
|
+ <option value="output">OUTPUT</option>
|
|
|
+ <option value="postrouting">POSTROUTING</option>
|
|
|
</select>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -2181,13 +2183,13 @@
|
|
|
<thead class="text-slate-400 bg-slate-950/60 border-b border-slate-800 uppercase tracking-wider text-[10px] font-sans">
|
|
|
<tr>
|
|
|
<th class="py-2.5 px-3 w-10 text-center">#</th>
|
|
|
- <th class="py-2.5 px-3 w-12 text-center">Flag</th>
|
|
|
+ <th class="py-2.5 px-3 w-12 text-center">Status</th>
|
|
|
<th class="py-2.5 px-3">Chain</th>
|
|
|
<th class="py-2.5 px-3">Src. Address</th>
|
|
|
<th class="py-2.5 px-3">Dst. Address</th>
|
|
|
<th class="py-2.5 px-3">Proto/Port</th>
|
|
|
<th class="py-2.5 px-3">Out / In</th>
|
|
|
- <th class="py-2.5 px-3">Action</th>
|
|
|
+ <th class="py-2.5 px-3">Target</th>
|
|
|
<th class="py-2.5 px-3">To Address:Port</th>
|
|
|
<th class="py-2.5 px-3">Packets / Bytes</th>
|
|
|
<th class="py-2.5 px-3">Comment</th>
|
|
|
@@ -2207,7 +2209,7 @@
|
|
|
<div id="fw-subtab-mangle" class="hidden bg-slate-900/90 border border-slate-800 rounded-xl overflow-hidden">
|
|
|
<div class="p-4 border-b border-slate-800 flex items-center justify-between flex-wrap gap-3">
|
|
|
<div class="flex items-center gap-3">
|
|
|
- <h3 class="text-sm font-bold text-white">Mangle Packet & Connection Marking</h3>
|
|
|
+ <h3 class="text-sm font-bold text-white">Mangle table</h3>
|
|
|
<span id="mangle-count-badge" class="text-xs font-mono text-slate-400">0 Rules</span>
|
|
|
</div>
|
|
|
<div class="flex items-center gap-2">
|
|
|
@@ -2228,11 +2230,11 @@
|
|
|
<thead class="text-slate-400 bg-slate-950/60 border-b border-slate-800 uppercase tracking-wider text-[10px] font-sans">
|
|
|
<tr>
|
|
|
<th class="py-2.5 px-3 w-10 text-center">#</th>
|
|
|
- <th class="py-2.5 px-3 w-12 text-center">Flag</th>
|
|
|
+ <th class="py-2.5 px-3 w-12 text-center">Status</th>
|
|
|
<th class="py-2.5 px-3">Chain</th>
|
|
|
<th class="py-2.5 px-3">Src. Address</th>
|
|
|
<th class="py-2.5 px-3">Dst. Address</th>
|
|
|
- <th class="py-2.5 px-3">Action</th>
|
|
|
+ <th class="py-2.5 px-3">Target</th>
|
|
|
<th class="py-2.5 px-3">New Mark / Value</th>
|
|
|
<th class="py-2.5 px-3 text-center">Pass</th>
|
|
|
<th class="py-2.5 px-3">Packets / Bytes</th>
|
|
|
@@ -2269,7 +2271,7 @@
|
|
|
<thead class="text-slate-400 bg-slate-950/60 border-b border-slate-800 uppercase tracking-wider text-[10px] font-sans">
|
|
|
<tr>
|
|
|
<th class="py-2.5 px-3 w-10 text-center">#</th>
|
|
|
- <th class="py-2.5 px-3 w-12 text-center">Flag</th>
|
|
|
+ <th class="py-2.5 px-3 w-12 text-center">Status</th>
|
|
|
<th class="py-2.5 px-3">List Name</th>
|
|
|
<th class="py-2.5 px-3">IP Address / CIDR</th>
|
|
|
<th class="py-2.5 px-3">Comment</th>
|
|
|
@@ -2316,7 +2318,7 @@
|
|
|
<th class="py-2.5 px-3">TCP State</th>
|
|
|
<th class="py-2.5 px-3">Mark</th>
|
|
|
<th class="py-2.5 px-3">Timeout</th>
|
|
|
- <th class="py-2.5 px-3 text-right font-sans">Action</th>
|
|
|
+ <th class="py-2.5 px-3 text-right font-sans">Target</th>
|
|
|
</tr>
|
|
|
</thead>
|
|
|
<tbody id="conns-table-body" class="divide-y divide-slate-800/60"></tbody>
|
|
|
@@ -5771,16 +5773,7 @@
|
|
|
<!-- Window Title Bar -->
|
|
|
<div class="bg-[#162335] border-b border-[#223145] px-3.5 py-1.5 flex items-center justify-between shrink-0">
|
|
|
<div class="flex items-center gap-2">
|
|
|
- <!-- WinBox v4 Logo -->
|
|
|
- <div class="flex items-center gap-0.5 text-cyan-400 font-bold font-mono text-[11px] leading-none">
|
|
|
- <svg class="w-3.5 h-3.5 text-cyan-400" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5">
|
|
|
- <path d="M4 5l3.5 10L11 5" stroke-linecap="round" stroke-linejoin="round"/>
|
|
|
- <path d="M15 5v5h4m0-5v10" stroke-linecap="round" stroke-linejoin="round"/>
|
|
|
- <circle cx="12" cy="20" r="1.5" fill="currentColor"/>
|
|
|
- </svg>
|
|
|
- <span class="text-cyan-400 font-bold text-xs tracking-tight">v4</span>
|
|
|
- </div>
|
|
|
- <span class="text-slate-200 font-medium text-xs">Firewall Rule ></span>
|
|
|
+ <span class="text-slate-200 font-medium text-xs">Filter rule</span>
|
|
|
<span id="fw-modal-badge" class="bg-[#0078d4] text-white text-[11px] px-2 py-0.5 rounded font-mono font-medium">New...</span>
|
|
|
</div>
|
|
|
<div class="flex items-center gap-2">
|
|
|
@@ -5796,7 +5789,7 @@
|
|
|
<button type="button" onclick="switchFwRuleTab('general')" id="fw-tab-btn-general" class="fw-rule-tab-btn bg-[#182638] text-white border-t-2 border-sky-400 px-3.5 py-1.5 text-xs font-medium transition-colors">General</button>
|
|
|
<button type="button" onclick="switchFwRuleTab('advanced')" id="fw-tab-btn-advanced" class="fw-rule-tab-btn text-slate-400 hover:text-white hover:bg-[#15202d] border-t-2 border-transparent px-3.5 py-1.5 text-xs font-medium transition-colors">Advanced</button>
|
|
|
<button type="button" onclick="switchFwRuleTab('extra')" id="fw-tab-btn-extra" class="fw-rule-tab-btn text-slate-400 hover:text-white hover:bg-[#15202d] border-t-2 border-transparent px-3.5 py-1.5 text-xs font-medium transition-colors">Extra</button>
|
|
|
- <button type="button" onclick="switchFwRuleTab('action')" id="fw-tab-btn-action" class="fw-rule-tab-btn text-slate-400 hover:text-white hover:bg-[#15202d] border-t-2 border-transparent px-3.5 py-1.5 text-xs font-medium transition-colors">Action</button>
|
|
|
+ <button type="button" onclick="switchFwRuleTab('action')" id="fw-tab-btn-action" class="fw-rule-tab-btn text-slate-400 hover:text-white hover:bg-[#15202d] border-t-2 border-transparent px-3.5 py-1.5 text-xs font-medium transition-colors">Target</button>
|
|
|
<button type="button" onclick="switchFwRuleTab('statistics')" id="fw-tab-btn-statistics" class="fw-rule-tab-btn text-slate-400 hover:text-white hover:bg-[#15202d] border-t-2 border-transparent px-3.5 py-1.5 text-xs font-medium transition-colors">Statistics</button>
|
|
|
</div>
|
|
|
|
|
|
@@ -6175,8 +6168,8 @@
|
|
|
<div class="flex-1 flex items-center gap-1.5 min-w-0">
|
|
|
<button type="button" onclick="toggleFwField('natstate', true)" id="fw-plus-natstate" class="w-5 h-5 flex items-center justify-center bg-[#172435] hover:bg-[#1e3047] border border-[#2b3e56] rounded text-slate-300 hover:text-sky-300 text-xs font-bold leading-none">+</button>
|
|
|
<div id="fw-field-natstate" class="hidden flex-1 flex items-center gap-3 min-w-0 bg-[#15202e] border border-[#26374d] rounded px-2 py-1">
|
|
|
- <label class="flex items-center gap-1 cursor-pointer"><input type="checkbox" id="filter-modal-nat-srcnat" class="rounded bg-[#101721] border-[#2b3e56] text-sky-500"><span class="text-slate-300">srcnat</span></label>
|
|
|
- <label class="flex items-center gap-1 cursor-pointer"><input type="checkbox" id="filter-modal-nat-dstnat" class="rounded bg-[#101721] border-[#2b3e56] text-sky-500"><span class="text-slate-300">dstnat</span></label>
|
|
|
+ <label class="flex items-center gap-1 cursor-pointer"><input type="checkbox" id="filter-modal-nat-srcnat" class="rounded bg-[#101721] border-[#2b3e56] text-sky-500"><span class="text-slate-300">SNAT</span></label>
|
|
|
+ <label class="flex items-center gap-1 cursor-pointer"><input type="checkbox" id="filter-modal-nat-dstnat" class="rounded bg-[#101721] border-[#2b3e56] text-sky-500"><span class="text-slate-300">DNAT</span></label>
|
|
|
<button type="button" onclick="toggleFwField('natstate', false)" class="w-5 h-5 flex items-center justify-center text-slate-500 hover:text-rose-400 text-xs font-bold leading-none shrink-0 ml-auto" title="Remove / Clear">-</button>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -6447,19 +6440,19 @@
|
|
|
<div id="fw-pane-action" class="fw-rule-pane hidden space-y-2">
|
|
|
<!-- Action -->
|
|
|
<div class="flex items-center text-xs py-1">
|
|
|
- <label class="w-36 sm:w-44 text-right pr-3.5 text-slate-300 shrink-0 select-none">Action</label>
|
|
|
+ <label class="w-36 sm:w-44 text-right pr-3.5 text-slate-300 shrink-0 select-none">Target</label>
|
|
|
<div class="flex-1">
|
|
|
<select id="filter-modal-action" onchange="toggleFilterActionFields()" class="bg-[#15202e] border border-[#26374d] rounded px-2.5 py-1 text-xs text-sky-400 font-mono focus:outline-none focus:border-sky-500 w-full cursor-pointer">
|
|
|
- <option value="accept" selected>accept</option>
|
|
|
- <option value="add-dst-to-address-list">add-dst-to-address-list</option>
|
|
|
- <option value="add-src-to-address-list">add-src-to-address-list</option>
|
|
|
- <option value="drop">drop</option>
|
|
|
-
|
|
|
- <option value="jump">jump</option>
|
|
|
- <option value="log">log</option>
|
|
|
- <option value="passthrough">passthrough</option>
|
|
|
- <option value="reject">reject</option>
|
|
|
- <option value="return">return</option>
|
|
|
+ <option value="accept" selected>ACCEPT</option>
|
|
|
+ <option value="add-dst-to-address-list">SET — add destination to address list</option>
|
|
|
+ <option value="add-src-to-address-list">SET — add source to address list</option>
|
|
|
+ <option value="drop">DROP</option>
|
|
|
+
|
|
|
+ <option value="jump">JUMP to user chain</option>
|
|
|
+ <option value="log">LOG</option>
|
|
|
+ <option value="passthrough">COUNT / continue</option>
|
|
|
+ <option value="reject">REJECT</option>
|
|
|
+ <option value="return">RETURN</option>
|
|
|
|
|
|
</select>
|
|
|
</div>
|
|
|
@@ -6637,16 +6630,7 @@
|
|
|
<!-- Window Title Bar -->
|
|
|
<div class="bg-[#162335] border-b border-[#223145] px-3.5 py-1.5 flex items-center justify-between shrink-0">
|
|
|
<div class="flex items-center gap-2">
|
|
|
- <!-- WinBox v4 Logo -->
|
|
|
- <div class="flex items-center gap-0.5 text-cyan-400 font-bold font-mono text-[11px] leading-none">
|
|
|
- <svg class="w-3.5 h-3.5 text-cyan-400" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5">
|
|
|
- <path d="M4 5l3.5 10L11 5" stroke-linecap="round" stroke-linejoin="round"/>
|
|
|
- <path d="M15 5v5h4m0-5v10" stroke-linecap="round" stroke-linejoin="round"/>
|
|
|
- <circle cx="12" cy="20" r="1.5" fill="currentColor"/>
|
|
|
- </svg>
|
|
|
- <span class="text-cyan-400 font-bold text-xs tracking-tight">v4</span>
|
|
|
- </div>
|
|
|
- <span class="text-slate-200 font-medium text-xs">NAT Rule ></span>
|
|
|
+ <span class="text-slate-200 font-medium text-xs">NAT rule</span>
|
|
|
<span id="nat-modal-badge" class="bg-[#0078d4] text-white text-[11px] px-2 py-0.5 rounded font-mono font-medium">New...</span>
|
|
|
</div>
|
|
|
<div class="flex items-center gap-2">
|
|
|
@@ -6696,44 +6680,42 @@
|
|
|
<label class="w-36 sm:w-44 text-right pr-3.5 text-slate-300 shrink-0 select-none">Chain</label>
|
|
|
<div class="flex-1">
|
|
|
<input id="nat-modal-chain" oninput="handleNATChainChange()" onchange="handleNATChainChange()" class="bg-[#15202e] border border-[#26374d] rounded px-2.5 py-1 text-xs text-sky-400 font-mono focus:outline-none focus:border-sky-500 w-full cursor-pointer" list="nat-chain-options" maxlength="16" required><datalist id="nat-chain-options">
|
|
|
- <option value="dstnat">dstnat — incoming (prerouting)</option>
|
|
|
- <option value="srcnat" selected>srcnat — outgoing (postrouting)</option>
|
|
|
- <option value="prerouting">prerouting — incoming before routing</option>
|
|
|
- <option value="input">input — delivered to this machine</option>
|
|
|
- <option value="output">output — generated by this machine</option>
|
|
|
- <option value="postrouting">postrouting — outgoing after routing</option>
|
|
|
+ <option value="prerouting">PREROUTING — incoming before routing</option>
|
|
|
+ <option value="input">INPUT — delivered to this machine</option>
|
|
|
+ <option value="output">OUTPUT — generated by this machine</option>
|
|
|
+ <option value="postrouting">POSTROUTING — outgoing after routing</option>
|
|
|
</datalist>
|
|
|
- <p class="mt-1 text-slate-400">dstnat = prerouting; srcnat = postrouting. Custom chains require a jump from an active chain.</p>
|
|
|
+ <p class="mt-1 text-slate-400">PREROUTING: incoming DNAT; POSTROUTING: SNAT/MASQUERADE. Custom chains require a jump from an active chain.</p>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
<!-- Action -->
|
|
|
<div class="flex items-center text-xs py-1">
|
|
|
- <label class="w-36 sm:w-44 text-right pr-3.5 text-slate-300 shrink-0 select-none">Action</label>
|
|
|
+ <label class="w-36 sm:w-44 text-right pr-3.5 text-slate-300 shrink-0 select-none">Target</label>
|
|
|
<div class="flex-1">
|
|
|
<select id="nat-modal-action" onchange="handleNATActionChange()" class="bg-[#15202e] border border-[#26374d] rounded px-2.5 py-1 text-xs text-sky-400 font-mono focus:outline-none focus:border-sky-500 w-full cursor-pointer">
|
|
|
- <option value="accept">accept</option>
|
|
|
- <option value="add-dst-to-address-list">add dst to address list</option>
|
|
|
- <option value="add-src-to-address-list">add src to address list</option>
|
|
|
- <option value="dst-nat">dst-nat</option>
|
|
|
+ <option value="accept">ACCEPT</option>
|
|
|
+ <option value="add-dst-to-address-list">SET — add destination to address list</option>
|
|
|
+ <option value="add-src-to-address-list">SET — add source to address list</option>
|
|
|
+ <option value="dst-nat">DNAT</option>
|
|
|
|
|
|
- <option value="jump">jump</option>
|
|
|
- <option value="log">log</option>
|
|
|
- <option value="masquerade" selected>masquerade</option>
|
|
|
- <option value="netmap">netmap</option>
|
|
|
- <option value="passthrough">passthrough</option>
|
|
|
- <option value="redirect">redirect</option>
|
|
|
- <option value="return">return</option>
|
|
|
+ <option value="jump">JUMP to user chain</option>
|
|
|
+ <option value="log">LOG</option>
|
|
|
+ <option value="masquerade" selected>MASQUERADE</option>
|
|
|
+ <option value="netmap">NETMAP</option>
|
|
|
+ <option value="passthrough">COUNT / continue</option>
|
|
|
+ <option value="redirect">REDIRECT</option>
|
|
|
+ <option value="return">RETURN</option>
|
|
|
|
|
|
|
|
|
- <option value="src-nat">src-nat</option>
|
|
|
+ <option value="src-nat">SNAT</option>
|
|
|
</select>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
<!-- To Addresses (Shown for src-nat, dst-nat, netmap, same, socksify, endpoint-independent-nat) -->
|
|
|
<div id="nat-row-toaddr" class="hidden flex items-center text-xs py-1">
|
|
|
- <label class="w-36 sm:w-44 text-right pr-3.5 text-slate-300 shrink-0 select-none" for="nat-modal-toaddr">To IP / address</label>
|
|
|
+ <label class="w-36 sm:w-44 text-right pr-3.5 text-slate-300 shrink-0 select-none" for="nat-modal-toaddr">Translate to address</label>
|
|
|
<div class="flex-1">
|
|
|
<input type="text" id="nat-modal-toaddr" placeholder="192.168.10.50 or WAN IP" class="bg-[#15202e] border border-[#26374d] rounded px-2.5 py-1 text-xs text-white font-mono focus:outline-none focus:border-sky-500 w-full">
|
|
|
</div>
|
|
|
@@ -6741,7 +6723,7 @@
|
|
|
|
|
|
<!-- To Ports (Shown for src-nat, dst-nat, redirect, masquerade, netmap, socksify, endpoint-independent-nat) -->
|
|
|
<div id="nat-row-toport" class="hidden flex items-center text-xs py-1">
|
|
|
- <label class="w-36 sm:w-44 text-right pr-3.5 text-slate-300 shrink-0 select-none" for="nat-modal-toport">To port (optional)</label>
|
|
|
+ <label class="w-36 sm:w-44 text-right pr-3.5 text-slate-300 shrink-0 select-none" for="nat-modal-toport">Translate to port (optional)</label>
|
|
|
<div class="flex-1">
|
|
|
<input type="text" id="nat-modal-toport" placeholder="80 or 8080 or 1024-65535" class="bg-[#15202e] border border-[#26374d] rounded px-2.5 py-1 text-xs text-white font-mono focus:outline-none focus:border-sky-500 w-full">
|
|
|
</div>
|
|
|
@@ -7462,16 +7444,7 @@
|
|
|
<!-- Window Title Bar -->
|
|
|
<div class="bg-[#162335] border-b border-[#223145] px-3.5 py-1.5 flex items-center justify-between shrink-0">
|
|
|
<div class="flex items-center gap-2">
|
|
|
- <!-- WinBox v4 Logo -->
|
|
|
- <div class="flex items-center gap-0.5 text-cyan-400 font-bold font-mono text-[11px] leading-none">
|
|
|
- <svg class="w-3.5 h-3.5 text-cyan-400" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5">
|
|
|
- <path d="M4 5l3.5 10L11 5" stroke-linecap="round" stroke-linejoin="round"/>
|
|
|
- <path d="M15 5v5h4m0-5v10" stroke-linecap="round" stroke-linejoin="round"/>
|
|
|
- <circle cx="12" cy="20" r="1.5" fill="currentColor"/>
|
|
|
- </svg>
|
|
|
- <span class="text-cyan-400 font-bold text-xs tracking-tight">v4</span>
|
|
|
- </div>
|
|
|
- <span class="text-slate-200 font-medium text-xs">Mangle Rule ></span>
|
|
|
+ <span class="text-slate-200 font-medium text-xs">Mangle rule</span>
|
|
|
<span id="mangle-modal-badge" class="bg-[#0078d4] text-white text-[11px] px-2 py-0.5 rounded font-mono font-medium">New...</span>
|
|
|
</div>
|
|
|
<div class="flex items-center gap-2">
|
|
|
@@ -7487,7 +7460,7 @@
|
|
|
<button type="button" onclick="switchMangleRuleTab('general')" id="mangle-tab-btn-general" class="mangle-rule-tab-btn bg-[#182638] text-white border-t-2 border-sky-400 px-3.5 py-1.5 text-xs font-medium transition-colors">General</button>
|
|
|
<button type="button" onclick="switchMangleRuleTab('advanced')" id="mangle-tab-btn-advanced" class="mangle-rule-tab-btn text-slate-400 hover:text-white hover:bg-[#15202d] border-t-2 border-transparent px-3.5 py-1.5 text-xs font-medium transition-colors">Advanced</button>
|
|
|
<button type="button" onclick="switchMangleRuleTab('extra')" id="mangle-tab-btn-extra" class="mangle-rule-tab-btn text-slate-400 hover:text-white hover:bg-[#15202d] border-t-2 border-transparent px-3.5 py-1.5 text-xs font-medium transition-colors">Extra</button>
|
|
|
- <button type="button" onclick="switchMangleRuleTab('action')" id="mangle-tab-btn-action" class="mangle-rule-tab-btn text-slate-400 hover:text-white hover:bg-[#15202d] border-t-2 border-transparent px-3.5 py-1.5 text-xs font-medium transition-colors">Action</button>
|
|
|
+ <button type="button" onclick="switchMangleRuleTab('action')" id="mangle-tab-btn-action" class="mangle-rule-tab-btn text-slate-400 hover:text-white hover:bg-[#15202d] border-t-2 border-transparent px-3.5 py-1.5 text-xs font-medium transition-colors">Target</button>
|
|
|
<button type="button" onclick="switchMangleRuleTab('statistics')" id="mangle-tab-btn-statistics" class="mangle-rule-tab-btn text-slate-400 hover:text-white hover:bg-[#15202d] border-t-2 border-transparent px-3.5 py-1.5 text-xs font-medium transition-colors">Statistics</button>
|
|
|
</div>
|
|
|
|
|
|
@@ -7866,8 +7839,8 @@
|
|
|
<div class="flex-1 flex items-center gap-1.5 min-w-0">
|
|
|
<button type="button" onclick="toggleMangleField('natstate', true)" id="mangle-plus-natstate" class="w-5 h-5 flex items-center justify-center bg-[#172435] hover:bg-[#1e3047] border border-[#2b3e56] rounded text-slate-300 hover:text-sky-300 text-xs font-bold leading-none">+</button>
|
|
|
<div id="mangle-field-natstate" class="hidden flex-1 flex items-center gap-3 min-w-0 bg-[#15202e] border border-[#26374d] rounded px-2 py-1">
|
|
|
- <label class="flex items-center gap-1 cursor-pointer"><input type="checkbox" id="mangle-modal-nat-srcnat" class="rounded bg-[#101721] border-[#2b3e56] text-sky-500"><span class="text-slate-300">srcnat</span></label>
|
|
|
- <label class="flex items-center gap-1 cursor-pointer"><input type="checkbox" id="mangle-modal-nat-dstnat" class="rounded bg-[#101721] border-[#2b3e56] text-sky-500"><span class="text-slate-300">dstnat</span></label>
|
|
|
+ <label class="flex items-center gap-1 cursor-pointer"><input type="checkbox" id="mangle-modal-nat-srcnat" class="rounded bg-[#101721] border-[#2b3e56] text-sky-500"><span class="text-slate-300">SNAT</span></label>
|
|
|
+ <label class="flex items-center gap-1 cursor-pointer"><input type="checkbox" id="mangle-modal-nat-dstnat" class="rounded bg-[#101721] border-[#2b3e56] text-sky-500"><span class="text-slate-300">DNAT</span></label>
|
|
|
<button type="button" onclick="toggleMangleField('natstate', false)" class="w-5 h-5 flex items-center justify-center text-slate-500 hover:text-rose-400 text-xs font-bold leading-none shrink-0 ml-auto" title="Remove / Clear">-</button>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -8197,26 +8170,26 @@
|
|
|
<div id="mangle-pane-action" class="mangle-rule-pane hidden space-y-2">
|
|
|
<!-- Action -->
|
|
|
<div class="flex items-center text-xs py-1">
|
|
|
- <label class="w-36 sm:w-44 text-right pr-3.5 text-slate-300 shrink-0 select-none">Action</label>
|
|
|
+ <label class="w-36 sm:w-44 text-right pr-3.5 text-slate-300 shrink-0 select-none">Target</label>
|
|
|
<div class="flex-1">
|
|
|
<select id="mangle-modal-action" onchange="toggleMangleActionFields()" class="bg-[#15202e] border border-sky-600/80 rounded px-2.5 py-1 text-xs text-sky-400 font-mono focus:outline-none focus:border-sky-500 w-full cursor-pointer">
|
|
|
- <option value="accept" selected>accept</option>
|
|
|
- <option value="add-dst-to-address-list">add-dst-to-address-list</option>
|
|
|
- <option value="add-src-to-address-list">add-src-to-address-list</option>
|
|
|
- <option value="change-dscp">change-dscp</option>
|
|
|
- <option value="change-mss">change-mss</option>
|
|
|
- <option value="change-ttl">change-ttl</option>
|
|
|
-
|
|
|
-
|
|
|
- <option value="jump">jump</option>
|
|
|
- <option value="log">log</option>
|
|
|
- <option value="mark-connection">mark-connection</option>
|
|
|
- <option value="mark-packet">mark-packet</option>
|
|
|
- <option value="mark-routing">mark-routing</option>
|
|
|
- <option value="passthrough">passthrough</option>
|
|
|
- <option value="return">return</option>
|
|
|
-
|
|
|
- <option value="set-priority">set-priority</option>
|
|
|
+ <option value="accept" selected>ACCEPT</option>
|
|
|
+ <option value="add-dst-to-address-list">SET — add destination to address list</option>
|
|
|
+ <option value="add-src-to-address-list">SET — add source to address list</option>
|
|
|
+ <option value="change-dscp">DSCP</option>
|
|
|
+ <option value="change-mss">TCPMSS</option>
|
|
|
+ <option value="change-ttl">TTL / HL</option>
|
|
|
+
|
|
|
+
|
|
|
+ <option value="jump">JUMP to user chain</option>
|
|
|
+ <option value="log">LOG</option>
|
|
|
+ <option value="mark-connection">CONNMARK — set connection mark</option>
|
|
|
+ <option value="mark-packet">MARK — set packet mark</option>
|
|
|
+ <option value="mark-routing">MARK — set routing mark</option>
|
|
|
+ <option value="passthrough">COUNT / continue</option>
|
|
|
+ <option value="return">RETURN</option>
|
|
|
+
|
|
|
+ <option value="set-priority">CLASSIFY</option>
|
|
|
|
|
|
|
|
|
|