{{define "Content"}}
<div class="card bg-base-100 shadow-xl">
    <div class="card-body">
        <h2 class="card-title">配置管理</h2>
        <div class="flex gap-2 mb-4">
            <button class="btn btn-primary" onclick="saveConfig()">保存配置</button>
            <button class="btn" onclick="loadConfig()">刷新配置</button>
            <button class="btn" onclick="formatJson()">格式化JSON</button>
        </div>
        <div id="editor" class="h-[600px] w-full border border-base-300 rounded-lg"></div>
    </div>
</div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.4.12/ace.js"></script>
<script>
    let editor = ace.edit("editor");
    editor.setTheme("ace/theme/monokai");
    editor.session.setMode("ace/mode/json");
    editor.setOptions({
        fontSize: "14px"
    });

    async function loadConfig() {
        try {
            const response = await fetch('/admin/config/get', {
                headers: getAuthHeaders()
            });
            if (!response.ok) {
                throw new Error('加载配置失败');
            }
            const config = await response.json();
            editor.setValue(JSON.stringify(config, null, 2), -1);
            showToast('配置已加载');
        } catch (error) {
            showToast(error.message, true);
        }
    }

    async function saveConfig() {
        try {
            const config = JSON.parse(editor.getValue());
            const response = await fetch('/admin/config/save', {
                method: 'POST',
                headers: getAuthHeaders(),
                body: JSON.stringify(config)
            });

            if (!response.ok) {
                const error = await response.text();
                throw new Error(error);
            }

            const result = await response.json();
            showToast(result.message);
        } catch (error) {
            showToast(error.message, true);
        }
    }

    function formatJson() {
        try {
            const config = JSON.parse(editor.getValue());
            editor.setValue(JSON.stringify(config, null, 2), -1);
            showToast('JSON已格式化');
        } catch (error) {
            showToast('JSON格式错误: ' + error.message, true);
        }
    }

    // 初始加载配置
    loadConfig();
</script>
{{end}}