<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>站点设置</title>
    <link rel="stylesheet" href="/static/layui/css/layui.css">
    <link rel="stylesheet" href="/static/css/style.css">
</head>
<body>
    <div class="layui-fluid">
        <div class="layui-card">
            <div class="layui-card-header">站点设置</div>
            <div class="layui-card-body">
                <form class="layui-form" lay-filter="siteSettingsForm">
                    <div class="layui-form-item">
                        <label class="layui-form-label">站点标题</label>
                        <div class="layui-input-block">
                            <input type="text" name="title" required lay-verify="required" 
                                placeholder="请输入站点标题" autocomplete="off" class="layui-input">
                        </div>
                    </div>
                    
                    <div class="layui-form-item">
                        <label class="layui-form-label">站点描述</label>
                        <div class="layui-input-block">
                            <textarea name="description" placeholder="请输入站点描述" 
                                class="layui-textarea"></textarea>
                        </div>
                    </div>
                    
                    <div class="layui-form-item">
                        <label class="layui-form-label">基础URL</label>
                        <div class="layui-input-block">
                            <input type="text" name="baseUrl" required lay-verify="required" 
                                placeholder="请输入基础URL" autocomplete="off" class="layui-input">
                        </div>
                    </div>
                    
                    <div class="layui-form-item">
                        <label class="layui-form-label">ICP备案号</label>
                        <div class="layui-input-block">
                            <input type="text" name="icp" placeholder="请输入ICP备案号" 
                                autocomplete="off" class="layui-input">
                        </div>
                    </div>
                    
                    <div class="layui-form-item">
                        <label class="layui-form-label">版权信息</label>
                        <div class="layui-input-block">
                            <input type="text" name="copyright" required lay-verify="required" 
                                placeholder="请输入版权信息" autocomplete="off" class="layui-input">
                        </div>
                    </div>
                    
                    <div class="layui-form-item">
                        <label class="layui-form-label">Logo</label>
                        <div class="layui-input-inline">
                            <input type="text" name="logo" placeholder="Logo路径" 
                                autocomplete="off" class="layui-input">
                        </div>
                        <div class="layui-input-inline" style="width: auto;">
                            <button type="button" class="layui-btn" id="uploadLogo">
                                <i class="layui-icon">&#xe67c;</i>上传Logo
                            </button>
                        </div>
                        <div class="layui-input-inline" style="width: auto;">
                            <img id="currentLogo" src="" style="display:none;max-height:38px;margin-left:10px;">
                        </div>
                    </div>
                    
                    <div class="layui-form-item">
                        <label class="layui-form-label">Favicon</label>
                        <div class="layui-input-inline">
                            <input type="text" name="favicon" placeholder="Favicon路径" 
                                autocomplete="off" class="layui-input">
                        </div>
                        <div class="layui-input-inline" style="width: auto;">
                            <button type="button" class="layui-btn" id="uploadFavicon">
                                <i class="layui-icon">&#xe67c;</i>上传Favicon
                            </button>
                        </div>
                        <div class="layui-input-inline" style="width: auto;">
                            <img id="currentFavicon" src="" style="display:none;max-height:38px;margin-left:10px;">
                        </div>
                    </div>
                    
                    <div class="layui-form-item">
                        <div class="layui-input-block">
                            <button class="layui-btn" lay-submit lay-filter="siteSubmit">保存设置</button>
                            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <script src="/static/layui/layui.js"></script>
    <script>
    layui.use(['form', 'upload', 'layer'], function(){
        var form = layui.form;
        var upload = layui.upload;
        var layer = layui.layer;
        var $ = layui.$;
        
        // 加载当前配置
        fetch('/api/site/settings', {
            headers: {
                'Authorization': 'Bearer ' + localStorage.getItem('token')
            }
        })
        .then(response => response.json())
        .then(data => {
            if (data.error) {
                layer.msg(data.error);
                return;
            }
            form.val('siteForm', data);
        })
        .catch(error => {
            layer.msg('加载配置失败：' + error.message);
        });
        
        // 上传Logo
        upload.render({
            elem: '#uploadLogo',
            url: '/api/uploads/site',
            headers: {
                'Authorization': 'Bearer ' + localStorage.getItem('token')
            },
            accept: 'images',
            done: function(res){
                if (res.error) {
                    layer.msg(res.error);
                    return;
                }
                $('input[name=logo]').val(res.url);
            }
        });
        
        // 上传Favicon
        upload.render({
            elem: '#uploadFavicon',
            url: '/api/uploads/site',
            headers: {
                'Authorization': 'Bearer ' + localStorage.getItem('token')
            },
            accept: 'images',
            done: function(res){
                if (res.error) {
                    layer.msg(res.error);
                    return;
                }
                $('input[name=favicon]').val(res.url);
            }
        });
        
        // 表单提交
        form.on('submit(siteSubmit)', function(data){
            fetch('/api/site/settings', {
                method: 'PUT',
                headers: {
                    'Authorization': 'Bearer ' + localStorage.getItem('token'),
                    'Content-Type': 'application/json'
                },
                body: JSON.stringify(data.field)
            })
            .then(response => response.json())
            .then(result => {
                if (result.error) {
                    layer.msg(result.error);
                    return;
                }
                layer.msg('保存成功');
            })
            .catch(error => {
                layer.msg('保存失败：' + error.message);
            });
            
            return false;
        });
    });
    </script>
</body>
</html> 