{% extends "base.html" %}
{% block title %}访问控制 - Squid Manager{% endblock %}
{% block content %}
<div class="page-header">
    <h1>🔐 访问控制规则</h1>
    <div class="page-actions">
        <button onclick="document.getElementById('add-form').style.display='block'" class="btn btn-primary btn-small">➕ 添加规则</button>
    </div>
</div>

<div class="card" id="add-form" style="display:none;">
    <h3 class="card-title">添加新规则</h3>
    <form method="post" class="inline-form">
    <input type="hidden" name="_csrf" value="{{ csrf_token() }}">
        <input type="hidden" name="action" value="add">
        <div class="filter-grid">
            <div class="form-group">
                <label>指令</label>
                <select name="directive" class="form-input">
                    {% for d in rule_directives %}
                    <option value="{{ d }}">{{ d }}</option>
                    {% endfor %}
                </select>
            </div>
            <div class="form-group">
                <label>动作</label>
                <select name="action_type" class="form-input">
                    <option value="allow">allow</option>
                    <option value="deny">deny</option>
                </select>
            </div>
            <div class="form-group" style="grid-column: span 2;">
                <label>ACL 列表 <span class="hint">(空格分隔，! 表示取反，如 !localhost my_net)</span></label>
                <input type="text" name="acls" class="form-input" placeholder="!localhost allowed_net">
            </div>
            <div class="form-group" style="grid-column: span 2;">
                <label>备注</label>
                <input type="text" name="comment" class="form-input">
            </div>
        </div>
        <div class="form-actions">
            <button type="submit" class="btn btn-primary">添加</button>
            <button type="button" onclick="document.getElementById('add-form').style.display='none'" class="btn btn-secondary">取消</button>
        </div>
    </form>
</div>

<div class="card">
    <p class="card-desc">访问规则按顺序从上到下匹配，命中即停止。共 {{ rules | length }} 条规则。</p>
    <p class="meta-text">可用的 ACL:
        {% for name in acls_by_name.keys() %}
        <code>{{ name }}</code>{% if not loop.last %} · {% endif %}
        {% endfor %}
    </p>
    <form method="post">
    <input type="hidden" name="_csrf" value="{{ csrf_token() }}">
        <input type="hidden" name="action" value="save">
        <div class="table-scroll">
        <table class="data-table rules-table">
            <thead>
            <tr>
                <th style="width:60px;">顺序</th>
                <th style="width:160px;">指令</th>
                <th style="width:100px;">动作</th>
                <th>ACL</th>
                <th>备注</th>
                <th style="width:80px;">删除</th>
            </tr>
            </thead>
            <tbody>
            {% for r in rules %}
            <tr>
                <td>{{ loop.index }}
                    <input type="hidden" name="id[]" value="{{ loop.index }}">
                </td>
                <td>
                    <select name="directive[]" class="form-input">
                        {% for d in rule_directives %}
                        <option value="{{ d }}" {% if r.directive == d %}selected{% endif %}>{{ d }}</option>
                        {% endfor %}
                    </select>
                </td>
                <td>
                    <select name="action_type[]" class="form-input">
                        <option value="allow" {% if r.action == 'allow' %}selected{% endif %}>allow</option>
                        <option value="deny" {% if r.action == 'deny' %}selected{% endif %}>deny</option>
                    </select>
                </td>
                <td><input type="text" name="acls[]" value="{{ r.acls | join(' ') }}" class="form-input"></td>
                <td><input type="text" name="comment[]" value="{{ r.comment }}" class="form-input"></td>
                <td>
                    <button type="button" class="btn btn-danger btn-tiny" onclick="this.closest('tr').remove()">删除</button>
                </td>
            </tr>
            {% endfor %}
            {% if not rules %}
            <tr><td colspan="6" class="empty-row">暂无规则。点击上方"添加规则"按钮开始。</td></tr>
            {% endif %}
            </tbody>
        </table>
        </div>
        {% if rules %}
        <div class="form-actions">
            <button type="submit" class="btn btn-primary">💾 保存所有规则</button>
        </div>
        {% endif %}
    </form>
</div>

<div class="card">
    <h3 class="card-title">📖 规则说明</h3>
    <ul>
        <li><code>http_access</code>: 控制 HTTP 请求是否允许通过代理</li>
        <li><code>https_access</code>: 控制 CONNECT 隧道 (HTTPS) 请求</li>
        <li><code>icp_access</code>: 控制 ICP 查询 (邻居间)</li>
        <li><code>snmp_access</code>: 控制 SNMP 监控访问</li>
        <li><code>always_direct</code>: 强制直接访问 (不走 peer)</li>
        <li><code>never_direct</code>: 强制走父代理</li>
        <li>ACL 列表支持 <code>!</code> 取反，多个 ACL 之间为 AND 关系 (全部满足才匹配)</li>
    </ul>
</div>
{% endblock %}