{% extends "base.html" %}
{% block title %}缓存对等 - Squid Manager{% endblock %}
{% block content %}
<div class="page-header">
    <h1>🌐 缓存对等 (cache_peer)</h1>
    <div class="page-actions">
        <button onclick="document.getElementById('add-form').style.display='block'" class="btn btn-primary btn-small">➕ 添加 Peer</button>
    </div>
</div>

<div class="card" id="add-form" style="display:none;">
    <h3 class="card-title">添加 cache_peer</h3>
    <form method="post">
    <input type="hidden" name="_csrf" value="{{ csrf_token() }}">
        <input type="hidden" name="action" value="add">
        <div class="filter-grid">
            <div class="form-group">
                <label>主机 <span class="hint">*</span></label>
                <input type="text" name="host" class="form-input" required placeholder="proxy2.example.com">
            </div>
            <div class="form-group">
                <label>类型</label>
                <select name="type" class="form-input">
                    {% for t in ['parent','sibling','multicast'] %}
                    <option value="{{ t }}">{{ t }}</option>
                    {% endfor %}
                </select>
            </div>
            <div class="form-group">
                <label>HTTP 端口</label>
                <input type="number" name="http_port" class="form-input" value="3128">
            </div>
            <div class="form-group">
                <label>ICP 端口 <span class="hint">0=禁用</span></label>
                <input type="number" name="icp_port" class="form-input" value="0">
            </div>
            <div class="form-group" style="grid-column: span 2;">
                <label>额外选项</label>
                <input type="text" name="options" class="form-input" placeholder="proxy-only no-query weight=10">
            </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">
    <form method="post">
    <input type="hidden" name="_csrf" value="{{ csrf_token() }}">
        <input type="hidden" name="action" value="save">
        <p class="card-desc">共 {{ peers | length }} 个对等节点。</p>
        <div class="table-scroll">
        <table class="data-table">
            <thead>
            <tr>
                <th>#</th>
                <th>主机</th>
                <th>类型</th>
                <th>HTTP 端口</th>
                <th>ICP 端口</th>
                <th>选项</th>
                <th>删除</th>
            </tr>
            </thead>
            <tbody>
            {% for p in peers %}
            <tr>
                <td>{{ loop.index }}
                    <input type="hidden" name="id[]" value="{{ loop.index }}">
                </td>
                <td><input type="text" name="host[]" value="{{ p.host }}" class="form-input"></td>
                <td>
                    <select name="type[]" class="form-input">
                        {% for t in ['parent','sibling','multicast'] %}
                        <option value="{{ t }}" {% if p.type == t %}selected{% endif %}>{{ t }}</option>
                        {% endfor %}
                    </select>
                </td>
                <td><input type="number" name="http_port[]" value="{{ p.http_port }}" class="form-input"></td>
                <td><input type="number" name="icp_port[]" value="{{ p.icp_port }}" class="form-input"></td>
                <td><input type="text" name="options[]" value="{{ p.options | join(' ') }}" 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 peers %}
            <tr><td colspan="7" class="empty-row">暂无对等节点</td></tr>
            {% endif %}
            </tbody>
        </table>
        </div>
        {% if peers %}
        <div class="form-actions">
            <button type="submit" class="btn btn-primary">💾 保存</button>
        </div>
        {% endif %}
    </form>
</div>

<div class="card">
    <h3 class="card-title">📖 cache_peer 类型与选项</h3>
    <ul>
        <li><strong>parent</strong>: 父代理 - 找不到缓存时转发到此节点</li>
        <li><strong>sibling</strong>: 兄弟节点 - 仅查询缓存，不转发请求</li>
        <li><strong>multicast</strong>: 多播组</li>
    </ul>
    <p class="meta-text">常用选项: <code>proxy-only</code> (不缓存到本地)、
        <code>no-query</code> (不发送 ICP 查询)、
        <code>weight=N</code> (权重)、
        <code>login=user:pass</code> (代理认证)、
        <code>ssl</code> (SSL 连接)、
        <code>round-robin</code> (轮询)</p>
</div>
{% endblock %}