{extend name="admin/layout/layout" /}

{block name="content"}
<div style="padding: 15px;">
    <div class="layui-card">
        <div class="layui-card-header">系统设置</div>
        <div class="layui-card-body">
            <form class="layui-form" lay-filter="systemForm" action="javascript:;">
                <div class="layui-form-item">
                    <label class="layui-form-label">站点标题</label>
                    <div class="layui-input-block">
                        <input type="text" name="site_title" value="{$config.site_title}" placeholder="请输入站点标题" class="layui-input">
                    </div>
                </div>
                
                <div class="layui-form-item">
                    <label class="layui-form-label">站点描述</label>
                    <div class="layui-input-block">
                        <textarea name="site_desc" placeholder="请输入站点描述" class="layui-textarea">{$config.site_desc}</textarea>
                    </div>
                </div>
                
                <div class="layui-form-item">
                    <label class="layui-form-label">站点关键词</label>
                    <div class="layui-input-block">
                        <input type="text" name="site_keywords" value="{$config.site_keywords}" placeholder="请输入站点关键词，多个用英文逗号分隔" class="layui-input">
                    </div>
                </div>
    
                <div class="layui-form-item">
                    <label class="layui-form-label">访问密码</label>
                    <div class="layui-input-inline">
                        <input type="checkbox" name="password_enable" value="1" lay-skin="switch" lay-text="开启|关闭" lay-filter="password_enable" {if $config.password_enable}checked{/if}>
                    </div>
                </div>
                
                <div class="layui-form-item password-group" {if !$config.password_enable}style="display:none"{/if}>
                    <label class="layui-form-label">密码设置</label>
                    <div class="layui-input-inline">
                        <input type="text" name="access_password" value="{$config.access_password}" placeholder="请输入访问密码" class="layui-input">
                    </div>
                    <div class="layui-form-mid layui-word-aux">访问网站时需要输入此密码</div>
                </div>
                
                
                <div class="layui-form-item password-group" {if !$config.password_enable}style="display:none"{/if}>
                    <label class="layui-form-label">验证说明</label>
                    <div class="layui-input-block">
                       
                        <textarea name="ys_sy" value="{$config.ys_sy}" placeholder="请输入站点描述" class="layui-textarea">{$config.ys_sy}</textarea>
                        
                       <div class="layui-form-mid layui-word-aux">访问密码输入页添加说明内容，支持添加html代码 换行 &#60;br> | 链接 &#60;a href="链接地址如http://www.ermeb.com" target="_blank">名称例如：ermeb &#60;/a></div>
                    </div>
                </div>
                

                <div class="layui-form-item">
                    <label class="layui-form-label">上传限制</label>
                    <div class="layui-input-inline" style="width: 100px;">
                        <input type="number" name="upload_size_limit" value="{$config.upload_size_limit}" class="layui-input">
                    </div>
                    <div class="layui-form-mid">MB</div>
                </div>
                
                <div class="layui-form-item">
                    <label class="layui-form-label">手机端访问</label>
                    <div class="layui-input-block">
                        <input type="radio" name="mobile_access_mode" value="mobile" title="手机端" {if $config.mobile_access_mode=='mobile'}checked{/if}>
                        <input type="radio" name="mobile_access_mode" value="pc" title="电脑端" {if $config.mobile_access_mode=='pc'}checked{/if}>
                        <input type="radio" name="mobile_access_mode" value="auto" title="自动切换" {if $config.mobile_access_mode=='auto'}checked{/if}>
                    </div>
                    <div class="layui-form-mid layui-word-aux">手机访问时的显示方式</div>
                </div>
                
                <div class="layui-form-item">
                    <label class="layui-form-label">游客留言</label>
                    <div class="layui-input-block">
                        <input type="checkbox" name="guest_comment" value="1" lay-skin="switch" lay-text="开启|关闭" {if $config.guest_comment}checked{/if}>
                    </div>
                </div>
                
                <div class="layui-form-item">
                    <label class="layui-form-label">访问人数</label>
                    <div class="layui-input-block">
                        <input type="checkbox" name="ys_rqkg" value="1" lay-skin="switch" lay-text="开启|关闭" {if $config.ys_rqkg}checked{/if}>
                    </div>
                </div>
                
                <div class="layui-form-item">
                    <label class="layui-form-label">开关IP</label>
                    <div class="layui-input-block">
                        <input type="checkbox" name="ys_ipkg" value="1" lay-skin="switch" lay-text="开启|关闭" {if $config.ys_ipkg}checked{/if}>
                    </div>
                </div>
                
                <div class="layui-form-item">
                    <label class="layui-form-label">模板选择</label>
                    <div class="layui-input-block">
                        <div class="layui-form" style="margin-top: 20px;">
                            <select name="moban"><!--/npc/img/tb0-->
                                    <option value="npc" {if $config.moban=='npc'}selected{/if}>永硕E盘模板</option>
                                    <option value="pc" {if $config.moban=='pc'}selected{/if}>ERMEB模板</option>
                            </select>
                        </div>
                    </div>
               
                </div>
                <hr>
                
                <div class="layui-form-item">
                    <label class="layui-form-label">储存方式</label>
                    <div class="layui-input-block">
                        <input type="radio" name="storage_mode" value="local" title="本地储存" lay-filter="storage" {if $config.storage_mode=='local'}checked{/if}>
                        <input type="radio" name="storage_mode" value="aliyun" title="阿里云OSS" lay-filter="storage" {if $config.storage_mode=='aliyun'}checked{/if}>
                        <input type="radio" name="storage_mode" value="qcloud" title="腾讯云COS" lay-filter="storage" {if $config.storage_mode=='qcloud'}checked{/if}>
                        <input type="radio" name="storage_mode" value="qiniu" title="七牛云" lay-filter="storage" {if $config.storage_mode=='qiniu'}checked{/if}>
                    </div>
                </div>
                
                <div class="layui-form-item storage-config" id="aliyun-config" {if $config.storage_mode!='aliyun'}style="display:none"{/if}>
                    <label class="layui-form-label">阿里云配置</label>
                    <div class="layui-input-inline">
                        <input type="text" name="aliyun_access_key" value="{$config.aliyun_access_key}" placeholder="AccessKey" class="layui-input">
                    </div>
                    <div class="layui-input-inline">
                        <input type="text" name="aliyun_secret_key" value="{$config.aliyun_secret_key}" placeholder="SecretKey" class="layui-input">
                    </div>
                    <div class="layui-input-inline">
                        <input type="text" name="aliyun_bucket" value="{$config.aliyun_bucket}" placeholder="Bucket" class="layui-input">
                    </div>
                    <div class="layui-input-inline">
                        <input type="text" name="aliyun_endpoint" value="{$config.aliyun_endpoint}" placeholder="上传域名" class="layui-input">
                    </div>
                    <div class="layui-input-inline">
                        <input type="text" name="aliyun_domain" value="{$config.aliyun_domain}" placeholder="CDN域名" class="layui-input">
                    </div>
                </div>

                <div class="layui-form-item storage-config" id="qcloud-config" {if $config.storage_mode!='qcloud'}style="display:none"{/if}>
                    <label class="layui-form-label">腾讯云配置</label>
                    <div class="layui-input-inline">
                        <input type="text" name="qcloud_secret_id" value="{$config.qcloud_secret_id}" placeholder="SecretId" class="layui-input">
                    </div>
                    <div class="layui-input-inline">
                        <input type="text" name="qcloud_secret_key" value="{$config.qcloud_secret_key}" placeholder="SecretKey" class="layui-input">
                    </div>
                    <div class="layui-input-inline">
                        <input type="text" name="qcloud_bucket" value="{$config.qcloud_bucket}" placeholder="Bucket" class="layui-input">
                    </div>
                    <div class="layui-input-inline">
                        <input type="text" name="qcloud_region" value="{$config.qcloud_region}" placeholder="上传地域" class="layui-input">
                    </div>
                    <div class="layui-input-inline">
                        <input type="text" name="qcloud_domain" value="{$config.qcloud_domain}" placeholder="CDN域名" class="layui-input">
                    </div>

                </div>

                <div class="layui-form-item storage-config" id="qiniu-config" {if $config.storage_mode!='qiniu'}style="display:none"{/if}>
                    <label class="layui-form-label">七牛云配置</label>
                    <div class="layui-input-inline">
                        <input type="text" name="qiniu_access_key" value="{$config.qiniu_access_key}" placeholder="AccessKey" class="layui-input">
                    </div>
                    <div class="layui-input-inline">
                        <input type="text" name="qiniu_secret_key" value="{$config.qiniu_secret_key}" placeholder="SecretKey" class="layui-input">
                    </div>
                    <div class="layui-input-inline">
                        <input type="text" name="qiniu_bucket" value="{$config.qiniu_bucket}" placeholder="Bucket" class="layui-input">
                    </div>
                    <div class="layui-input-inline">
                        <input type="text" name="qiniu_domain" value="{$config.qiniu_domain}" placeholder="CDN域名" class="layui-input">
                    </div>
                </div>
                
                <div class="layui-form-item">
                    <label class="layui-form-label">目录顺序</label>
                    <div class="layui-input-block">
                        <select name="dir_order">
                            <option value="name_asc" {if $config.dir_order=='name_asc'}selected{/if}>名称升序</option>
                            <option value="name_desc" {if $config.dir_order=='name_desc'}selected{/if}>名称降序</option>
                            <option value="time_asc" {if $config.dir_order=='time_asc'}selected{/if}>时间升序</option>
                            <option value="time_desc" {if $config.dir_order=='time_desc'}selected{/if}>时间降序</option>
                        </select>
                    </div>
                </div>
                
                <div class="layui-form-item">
                    <div class="layui-input-block">
                        <button class="layui-btn" lay-submit lay-filter="systemForm">保存设置</button>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>
{/block}

{block name="script"}
<script>
layui.use(['form', 'layer'], function(){
    var form = layui.form;
    var layer = layui.layer;
    var $ = layui.jquery;
    
    // 监听访问密码开关
    form.on('switch(password_enable)', function(data){
        $('.password-group').toggle(data.elem.checked);
        if (data.elem.checked && !$('input[name="access_password"]').val()) {
            $('input[name="access_password"]').focus();
        }
    });
    
    

    form.on('switch(ys_tanchuang)', function(data){
        $('.password_ys168').toggle(data.elem.checked);
        if (data.elem.checked && !$('input[name="ys_tannei"]').val()) {
            $('input[name="ys_tannei"]').focus();
        }
    });
    
    
    form.on('switch(ys_sp)', function(data){
        $('.password_sp').toggle(data.elem.checked);
        if (data.elem.checked && !$('input[name="ys_spnr"]').val()) {
            $('input[name="ys_spnr"]').focus();
        }
    });
    
    
    // 监听储存方式切换
    form.on('radio(storage)', function(data){
        $('.storage-config').hide();  // 先隐藏所有配置
        if(data.value !== 'local') {  // 如果不是本地储存
            $('#' + data.value + '-config').show();  // 显示对应的配置项
        }
    });
    
    form.on('submit(systemForm)', function(data){
        // 如果开启了访问密码但没有设置密码
        if (data.field.password_enable && !data.field.access_password) {
            layer.msg('请设置访问密码', {icon: 2});
            $('input[name="access_password"]').focus();
            return false;
        }

        // 验证云储存配置
        if(data.field.storage_mode !== 'local') {
            var mode = data.field.storage_mode;
            var config = {
                'aliyun': ['aliyun_access_key', 'aliyun_secret_key', 'aliyun_bucket'],
                'qcloud': ['qcloud_secret_id', 'qcloud_secret_key', 'qcloud_bucket'],
                'qiniu': ['qiniu_access_key', 'qiniu_secret_key', 'qiniu_bucket']
            };
            
            var fields = config[mode];
            for(var i = 0; i < fields.length; i++) {
                if(!data.field[fields[i]]) {
                    layer.msg('请完善' + {
                        'aliyun': '阿里云',
                        'qcloud': '腾讯云',
                        'qiniu': '七牛云'
                    }[mode] + '配置信息', {icon: 2});
                    return false;
                }
            }
        }
        
        var loading = layer.load();
        $.ajax({
            url: '/admin/system/save',
            type: 'POST',
            data: data.field,
            success: function(res){
                layer.close(loading);
                if(res.code == 0){
                    layer.msg(res.msg, {icon: 1});
                }else{
                    layer.msg(res.msg, {icon: 2});
                }
            }
        });
        return false;
    });
});

</script>
{/block}