{include file="public/header"/}

<style>
    .handler .back .img{
        width: 16px;
        height: 16px;
        margin: 6px 0 0 16px;
        float: left;
        background: url("__image__/admin/B/back-system.png");
    }
    .group .layui-layer-ico{
        height: 24px;
        width: 24px;
        background:url("__image__/admin/B/cha.png") no-repeat;
    }
    .recycle{
        width: 20px;
        height: 20px;
        background:url("__image__/admin/B/delete.png");
        cursor: pointer;
    }
    .layui-layer label {
        width: 100px;
    }
    .group .layui-input-block{
        padding-top: 5px;
    }
    #container{
        background-color: #fff;
    }
</style>
<div id="container" style="padding-bottom: 42px">

    <h2 class="page-header" style="font-size: 18px;color: #555555;"> 分组管理</h2>
    <div class="handler">
        <a href="{:url('admin/index/set')}">
            <div class="back">
                <i class="img"></i>
                <span>返回设置</span>
            </div>
        </a>

        <a onclick="add()" class="" data-pjax>
            <div class="button">
                +添加分组
            </div>
        </a>
    </div>


    <div style="height:40px;line-height:40px;padding-left:16px;color: #555555;font-size: 14px;border-radius: 8px;background: #F5FAFF;margin: 20px 0 20px 0;">
        每添加或删除分组，都需要再次去生成新的前端部署代码
    </div>

    <table class="layui-table">

        <colgroup>
            <col width="740">
            <col>
        </colgroup>
        <thead>
        <tr>
            <th>分组名</th>
            <th>操作</th>
        </tr>
        </thead>

        <tbody>
            {volist name='group' id='g'}
            <tr>
                <td>{$g.groupname}</td>
                <td> <a onclick="getdelete({$g.id})"  title="删除"> <div class='recycle'></div></a></td>
            </tr>
            {/volist}
        </tbody>
    </table>
    {$page}
</div>
<script>
	
	 var getdelete =function(id){

        $.ajax({
            url:CGWL_ROOT_URL+'/admin/manager/delclass',
            type:'post',
            data:{cid:id},
            success:function(res){
                  
                  if(res.code == 0){
                    layer.msg(res.msg,{icon:1,end:function(){
                        location.href = "{:url('admin/manager/group')}";
                    }}); 
                  }else{
                     layer.msg(res.msg,{icon:2}); 
                  }
            }
        });
    }

   function add(){
   	var html  ='';
   	    html +='<form class="layui-form" style="margin-top:30px;padding: 0 40px;">';
   	    html +='<div class="layui-form-item"><label class="layui-form-label" style="font-size: 13px;color: #999999;">分组名:</label>';
   	    html +='<div class="layui-input-block">';
   	    html +=' <input type="text" id="classname" required placeholder="请输入分组名" autocomplete="off" class="layui-input" style="width:260px;"></div>';
   	    html +='</div></form>';

   	    var lock = false;
   	  layer.open({
        skin: 'group',
   	  	type:1,
   	  	title:'添加分组',
   	  	area:['501px','213px'],
   	  	content:html,
   	  	btn: ['提交', '取消'],
   	  	yes:function(){

            var name =$("#classname").val().trim();
            if (!name) {
                layer.msg('分组名不能为空',{icon:2});
                return false;
            }

            if (!lock) {
                lock = true;
                $.ajax({
                    url:'{:url("admin/manager/addclass")}',
                    type:'post',
                    data:{groupname:name},
                    dataType:'json',
                    success:function(res){

                        if(res.code == 0){
                            layer.msg(res.msg,{icon:1,end:function(){
                                    location.reload();
                                }});
                        }else{
                            layer.msg(res.msg,{icon:2});
                        }
                    }
                });
            }
   	  	}
   	  })
   }

</script>

{include file="public/footer"/}