<link rel="stylesheet" href="<?php echo base_url();?>public/css/vendor/bootstrap/bootstrap-table.css">
<link rel="stylesheet" href="<?php echo base_url();?>public/css/vendor/bootstrap/table-fix-column.css">

<script src="<?php echo base_url();?>public/js/vendor/bootstrap/src/bootstrap-table.js"></script>
<script src="<?php echo base_url();?>public/js/vendor/bootstrap/src/table-fix-column.js"></script>

<style type="text/css">
    table {
        table-layout:fixed !important;
    }

    th{
        background: rgb(146, 208, 80);
    }

    td,th{
        max-width: 400px;
        word-wrap: break-word;
    }

    .table-hover > tbody > tr:hover {
        background-color: #c8bd6d;
    }

    input {
        width:60px;
    }

    #roleTable tr:nth-child(5n){
        background:rgb(198, 239, 206);
    } /**隔五行*/

    .fixed-table-toolbar {
        display: none;
    }

    .fileinput-button {
        position: relative;
        top: -5px;
    }

    .fileinput-button input{
        position:absolute;
        right: 0px;
        top: 0px;
        opacity: 0;
        -ms-filter: 'alpha(opacity=0)';
    }
</style>
<div class="content_wrapper">
    <div id="msg-tip"></div>
    <div class="container-fluid ">
        <div class="row">
            <div class="col-sm-12">
                <aside>
                    <header><i class="fa fa-fw fa-file"></i>签到主题配置</header>
                    <section>
                        <div class="container-fluid">
                            <button type="button" style="margin-bottom: 10px;width: 80px;" class="btn btn-danger"  id="commitBtn">提交</button>
                            <div class="row">
                                <div class="col-sm-12">
                                    <div class="table-responsive">
                                        <form method="post" class="form-horizontal skinDir" id="activityFrom" enctype="multipart/form-data" action="#">

                                        </form>
                                    </div>
                                </div>

                            </div>
                        </div>
                    </section>
                </aside>
            </div>
        </div>
    </div>


</div>


<script src="<?php echo base_url();?>public/js/common.js"></script>
<!--<script src="--><?php //echo base_url();?><!--public/js/imageChange.js"></script>-->

<script>
    var commonLineTitles={};
    var commonLineNum =0;
    var selDir,dirList,dirList_str;
    commonLineTitles = [{"tname":"目录名","vname":"dir"}];

    $(document).ready(function(){
        var html = "";
        dirList_str ='<?php echo $dirList;?>';//资源类型
        selDir = '<?php echo $selDir;?>';
        dirList = JSON.parse(dirList_str);
        // console.log(selDir,dirList_str);
        $('.skinDir').append(commonTable('皮肤目录配置'));
        for(var i=0;i<dirList.length;i++){
            commonLineNum++;
            html +=commonLine({"dir":dirList[i]});
        }
        $('#commonLine').append(html);
    });

    function addCommonLine() {
        var html='';
        var d;
        commonLineNum++;
        d = {"dir":"skin"+commonLineNum};
        html +=commonLine(d);
        $('#commonLine').append(html);
    }
    function delCommonLine() {
        if(commonLineNum>1){
            $("#commonLine").children(".row")[commonLineNum-1].remove();
            commonLineNum--;
        }
    }
    function commonTable(title) {
        var html='';
        html+='<div class="ibox-title" style="border-top: 0;"><h5 style="font-weight: bold">'+title+'</h5></div>';
        // html+='<div class="col-sm-8"></div>';
        // html+='</div>';
        html+='<div class="text-center" id="commonLine">';
        // html+='</div><botton class="btn btn-primary" id="addCommonLine" onclick="addCommonLine()">添加</botton><botton class="btn btn-danger del-tr" onclick="delCommonLine()">删除</botton></div>';
        // html +='<hr style=" height:2px;border:none;border-top:2px dotted #0b0;"><div class="form-group" id="balloon_table">';
        return html;
    }
    function  commonLine(data) {
        var html='';
        html += '<div class="row" style="border: 1px solid #CCC;margin:10px 5px;padding: 5px 0;"><div class="form-group" >';
        var sel ='';
        $.each(commonLineTitles,function(key,val) {
            html += '<label class="col-sm-1 control-label">'+val['tname']+'</label><div class="col-sm-3"><input type="text" class="form-control" readonly name="common_conf[' + (commonLineNum-1) + ']" value="' + data[val['vname']] + '"></div>';
            if(selDir==data[val['vname']]){
                sel = "checked"
            }
            html +='<label class="col-sm-2 control-label">是否使用</label><div class="col-sm-2"><input type="radio" name="selDir" value="' + data[val['vname']] + '" '+sel+'></div>';
        });

        html += '</div></div>';
        return html;
    }
    //提交表格数据
    $('#commitBtn').click(function () {
        var datas = $('#activityFrom').serializeArray();
        console.log(datas);
        $.ajax({
            type: 'POST',
            data: datas,
            dataType:'json',
            url:'config/saveSignSkinCfg',
            success: function(data){
                if(data.ret != 1){
                    window.location.reload()
                    // console.log(data);
                    // $('#commitBtn').attr('disabled', true);
                }else{
                    msgTip.messager().error(data.msg);
                }
            }
        });
    });
</script>

