{% extends "base.html" %}
{% block title %}原始编辑 - Squid Manager{% endblock %}
{% block content %}
<div class="page-header">
    <h1>📝 原始配置编辑</h1>
    <div class="page-actions">
        <span class="meta-text">配置文件: <code>{{ squid_conf_path }}</code></span>
    </div>
</div>

{% if error %}
<div class="flash flash-error">⚠️ {{ error }}</div>
{% endif %}

<div class="card">
    <p class="card-desc">直接编辑 squid.conf 原始内容。保存时可选启用语法校验。
    所有结构化编辑 (主配置、ACL、规则等) 在保存后会重新生成完整配置文件。</p>

    <form method="post">
    <input type="hidden" name="_csrf" value="{{ csrf_token() }}">
        <div class="form-group">
            <textarea name="content" rows="35" class="form-input monospace raw-editor">{{ content }}</textarea>
        </div>
        <div class="form-actions">
            <label class="checkbox-label">
                <input type="checkbox" name="validate" checked> 保存前校验 (<code>squid -k parse</code>)
            </label>
            <button type="submit" class="btn btn-primary">💾 保存</button>
            <button type="button" onclick="validateOnly()" class="btn btn-secondary">🔍 仅校验 (不保存)</button>
            <a href="{{ url_for('backups_view') }}" class="btn btn-secondary">📦 查看备份</a>
        </div>
    </form>

    <div id="validate-result" class="svc-result" style="display:none;"></div>
</div>

<div class="card">
    <h3 class="card-title">⚠️ 注意事项</h3>
    <ul>
        <li>保存前会自动备份当前配置到 <code>backups/</code> 目录</li>
        <li>校验需要本机安装 squid 二进制 (否则仅做结构解析)</li>
        <li>保存成功后，需要 <a href="{{ url_for('service_view') }}">重载服务</a> 才能生效</li>
        <li>如果使用结构化编辑页面，原始编辑的修改可能被覆盖</li>
    </ul>
</div>
{% endblock %}

{% block scripts %}
<script>
function validateOnly() {
    const content = document.querySelector('textarea[name="content"]').value;
    const box = document.getElementById('validate-result');
    box.style.display = 'block';
    box.className = 'svc-result svc-loading';
    box.textContent = '校验中...';
    fetch('/api/validate', {
        method: 'POST',
        headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
        body: 'content=' + encodeURIComponent(content)
    })
    .then(r => r.json())
    .then(d => {
        box.className = 'svc-result ' + (d.ok ? 'svc-ok' : 'svc-err');
        box.innerHTML = '<strong>' + (d.ok ? '✅ 校验通过' : '❌ 校验失败') + '</strong><pre>' + (d.message || '') + '</pre>';
    })
    .catch(e => {
        box.className = 'svc-result svc-err';
        box.textContent = '请求失败: ' + e;
    });
}
</script>
{% endblock %}