{layout name="layout" /}
<link rel="stylesheet" href="__PUBLIC__/auth/css/set.css">
<script src="__PUBLIC__/auth/js/main.js" type="text/jscript"></script>
<style>
	.mactive{
		background:#fff;
		border:1px solid #23b7e5;
	}
	.layui-btn a{
		color:#fff;
	}
	.mactive a{
		color:#23b7e5;
	}
.layui-form-item {
    /* margin-bottom: 15px; */
    clear: both;
    margin-top: 10px;
}
</style>
<div class="if_wrap">
    <div class="cus-con">
        <div class="set-top">
			{$topmenu}          
            <div class="layui-inline">
                <div class="layui-input-inline">
                    <input type="text" id="menu_name1" value="{$menu_name}" class="layui-input"  lay-search placeholder="请输入功能菜单名称">
                </div>
                <button class="layui-btn layui-btn-sm" id="btn">查询</button>
            </div>
        </div>
        <table class="layui-table" lay-data="{ url:'/vip/setting/getMenuJSON.html',page:true, id:'idTest'}" lay-filter="demo">
            <thead>
            <tr>
                <th lay-data="{width:100,field:'id',align:'center',templet: '#titleTpl'}">序号</th>
                <th lay-data="{width:200,field:'showName'}">菜单名称</th>
                <th lay-data="{width:150,field:'menu_code'}">标识码</th>
                <th lay-data="{width:200,field:'menu_url'}">菜单url</th>
                <th lay-data="{width:100,field:'status', toolbar: '#enabledModal'}">是否隐藏</th>
                <th lay-data="{width:100,field:'sort',align:'center'}">排序</th>
                {if condition="$del || $add"}
                <th lay-data="{width:200,field:'score', toolbar: '#operationModal'}">操作</th>
                {/if}
            </tr>
            </thead>
        </table>
    </div>
</div>
<script type="text/html" id="titleTpl">
    {{d.LAY_TABLE_INDEX+1}}
</script>
<script type="text/html" id="enabledModal">

    {{#  if(d.status == 1){ }}
  <!--  <input type="checkbox" checked="" name="status" value="{d.status}" lay-skin="switch" lay-text="显示|隐藏" lay-filter="switch_change" class="switch_change">  -->
    <a class="layui-btn layui-btn-sm" style="line-height:20px;">显示</a>
    {{#  } else { }}
  <!--  <input type="checkbox"  name="status" lay-skin="switch" lay-text="显示|隐藏" lay-filter="switch_change" class="switch_change">  -->
  <a class="layui-btn layui-btn-sm layui-btn-danger" style="line-height:20px;">隐藏</a>
    {{#  } }}
</script>
<script type="text/html" id="operationModal">
{notempty name="add"}
    <a class="layui-btn layui-btn-sm" style="line-height:20px;" lay-event="edit">编辑</a>
{/notempty}
{notempty name="del"}
    <a class="layui-btn layui-btn-sm layui-btn-danger" style="line-height:20px;" lay-event="del">删除</a>
{/notempty}
</script>
<script>
    layui.use(['form','table'], function() {
        var table = layui.table; //表格
        $('#btn').click(function () {
            table.reload('idTest', {
                url: 'getMenuJSON'
                , where: {menu_name: $('#menu_name1').val()} //设定异步数据接口的额外参数
                //,height: 300
            });
        });
    });

    layui.use(['laydate', 'laypage', 'layer', 'table', 'carousel', 'upload', 'element','form'], function(){
        var laydate = layui.laydate //日期
                ,laypage = layui.laypage //分页
                ,layer = layui.layer //弹层
                ,table = layui.table //表格
                ,carousel = layui.carousel //轮播
                ,upload = layui.upload //上传
                ,element = layui.element;//元素操作
                var form=layui.form;

        table.on('tool(demo)', function (obj) { //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
            var data = obj.data //获得当前行数据
                    , layEvent = obj.event; //获得 lay-event 对应的值
            if (layEvent === 'del') {
                layer.confirm('确定删除此菜单吗？', function (index) {
                    var id = obj.data.id;
                    //向服务端发送删除指令
                    $.ajax({
                        type: "POST",
                        url: "{:Url('vip/Setting/delMenu')}",
                        data: {id:id},
                        dataType:'json',
                        success: function(ret){
                            if(ret){
                            	layer.open({
                					content: '恭喜删除成功！',
                					btn: ['确认'],
                					yes: function(index, layero) {
                						location.reload();
                					},
                				});
                                
                            }else{
                                layer.alert('功能菜单删除失败');
                            }
                        },
                        error:function(XMLHttpRequest, textStatus, errorThrown){
                            var ret = XMLHttpRequest.responseJSON
                            layer.alert('操作失败');
                        }
                    });
                    //obj.del(); //删除对应行（tr）的DOM结构
                    layer.close(index);
                    //向服务端发送删除指令
                });
            } else if (layEvent === 'edit') {
                layui.form.render(); //更新全部
                var id = obj.data.id;
                load_page(
                        '/vip/Setting/addMenuSet.html?id='+obj.data.id,
                        '修改菜单',
                        function(){
                            addmenu(obj.data.id);
                        },
                        ['保存','取消'],
                        500,
                        400
                );
            }
        });
        //添加功能事件
        $(".fp-btn").click(function(){
            layui.form.render(); //更新全部
            load_page(
                    '/vip/Setting/addMenuSet.html',
                    '新增菜单',
                    function(){
                        addmenu();
                    },
                    ['保存','取消'],
                    500,
                    400
            );
        });

        //分页
        laypage.render({
            elem: 'pageDemo' //分页容器的id
            ,count: 100 //总页数
            ,skin: '#1E9FFF' //自定义选中色值
            ,jump: function(obj, first){
                if(!first){
                    layer.msg('第'+ obj.curr +'页');
                }
            }
        });

        layui.use('form', function(){
            var form = layui.form;
            form.on('switch(isable)', function(data){
                console.log(data.elem.checked); //开关是否开启，true或者false
            });


        });

    });


</script>