{include file="public/head"}
<div class="layui-fluid layui-rg-bg">
    <div class="layui-card">
        <div class="layui-card-body">
            <form class="layui-form  layui-form-pane" style="margin-top:20px;">
            {foreach $config as $key=>$vo }
            <div class="layui-form-item">
                <label class="layui-form-label">{$vo.title}</label>
                <div class="layui-input-block">
            {switch vo.type}
            {case color}
                <div class='colorpicker'>
                <div class="layui-input-inline" style="width: 120px;">
                <input type="text" name="{$key}" value="{$vo.value}" placeholder="请选择{$vo.title}" class="layui-input">
                </div>
                <div class="layui-inline" style="left: -11px;">
                <div class="color-form"></div>
                </div>
                </div>
            {/case}
            {case text}
                <input type="text" name="{$key}" autocomplete="off" placeholder="请输入{$vo.title}" class="layui-input" value="{$vo.value}">
            {/case}
            {case password}
                <input type="password" name="{$key}" autocomplete="off" placeholder="请输入{$vo.title}" class="layui-input" value="{$vo.value}">
            {/case}
            {case radio}
                {foreach $vo.options as $opk => $opv}
                <input type="radio" name="{$key}" {eq name="vo.value" value="$opk"}checked{/eq} value="{$opk}" title="{$opv}">
                {/foreach}
            {/case}
            {case checkbox}
                {foreach $vo.options as $opk => $opv}
                <input type="checkbox" name="{$key}" {in name="opk" value="$vo.value"}checked{/in} value="{$opk}" title="{$opv}">
                {/foreach}
            {/case}
            {case select}
                <select name="{$key}"  >
                {foreach $vo.options as $opk => $opv}
                <option value="{$opk}" {eq name="vo.value" value="$opk"} selected{/eq}>{$opv}</option>
                {/foreach}
                </select>
            {/case}
            {case textarea}
                <textarea name="{$key}" class="layui-textarea">{$vo.value}</textarea>
            {/case}
            {/switch}
            </div>
            </div>
            {/foreach}
            {:pagedebug()}
            <hr>
            <div class="layui-form-footer">
                <button class="layui-btn layui-btn-sm" lay-submit lay-filter="submit">{:lang('submit')}</button>
                <a class="layui-btn layui-btn-primary layui-btn-sm refresh">{:lang('reload')}</a>
                <a class="layui-btn layui-btn-sm layui-btn-primary" onclick="closelayer()"></i>{:lang('close')}</a>
            </div>
        </form>
        </div>
    </div>
    
<!---->
</div>
{include file="public/foot"}
<script>
    layui.use(['jquery', 'form', 'layer', 'element','colorpicker'],function () {
        var $ = layui.jquery;
        var form = layui.form;
        var layer = layui.layer,colorpicker = layui.colorpicker;
        $(".colorpicker").each(function(){
            var thiselem = $(this).find('.color-form');
            var thisinput = $(this).find('input');
            var thiscolor = $(this).find('input').val();
            colorpicker.render({
                elem: thiselem
                ,color: thiscolor
                ,predefine: true
                ,done: function(color){
                    thisinput.val(color);
                }
            });
        });
        
        // 表单提交
        form.on('submit(submit)',function(data){
            loading = layer.load(1, {shade: [0.1, '#fff']});
            $.ajax({
                url: '{:url("config")}?addon_name={$addon_name}',
                type: 'POST',
                dataType: 'json',
                data: data.field,
                success: function(result){
                    layer.close(loading);
                    layuialert(result,2);
                }
            });
            return false; //禁止刷新
        });
    });
</script>