layui.use(['laytpl', 'treeTable', 'jquery', 'iconPickerFa', 'form', 'miniTab', 'xmSelect'], function () {
    let $ = layui.jquery,
        form = layui.form,
        treeTable = layui.treeTable,
        iconPickerFa = layui.iconPickerFa,
        layer = layui.layer,
        miniTab = layui.miniTab,
        xmSelect = layui.xmSelect;



    /**** index begin ***/
    //index页面
    if ($('.location-index-page').length > 0) {
        miniTab.listen();

        // 渲染表格
        let listUrl = $('#menu-table').data('url');
        let insTb = treeTable.render({
            elem: '#menu-table',
            toolbar: '#toolbar-tpl',
            defaultToolbar: [],
            method: 'POST',
            url: listUrl,
            page: false,
            tree: {
                iconIndex: 1,           // 折叠图标显示在第几列
                isPidData: true,        // 是否是id、pid形式数据
                idName: 'code',  // id字段名称
                pidName: 'pcode',    // pid字段名称
                Spid: '86'     // pid字段名称
            },
            cols: [[
                {type: 'checkbox'},
                {field: 'name', title: '名称', minWidth: 150, singleLine: true},
                {field: 'name', title: '状态'},
                {field: 'sort', title: '排序',edit:"text"},
                {templet: '#row-status',field: 'status', minWidth: 180,align: 'center', title: '状态'},
            ]],
            done: function () {
            }
        });
        let modifyUrl = $('#row-modify').data('url');

        //监听状态改变
        form.on('switch(changeStatus)', function(obj){
            let val = obj.elem.checked ? 1 : 0;
            $.post(modifyUrl, {id: this.value, field: this.name, value: val}, function (res) {
                layer.msg(res.msg)
                if (res.code === 0) {
                    setTimeout(function () {
                        //insTb.reload();
                    }, 1000)
                }
            })
        });
        let sort = $('#table-container-sort').data('url');
        treeTable.on('edit(menu-table)', function (obj) {
            let id = obj.data.id;
            if (obj.field == 'sort') {
                $.ajax(sort, {
                    data: {
                        "sort": obj.value,
                        "id": id
                    }
                    ,dataType : 'json'
                    ,type: 'POST'
                })
                    .done(function () {
                        insTb.reload();
                    })
            }
        });

        //监听工具条 注意区别toolbar和tool  toolbar是表头上的工具条 tool是行中的工具条
        treeTable.on('toolbar(menu-table)', function (obj) {
            let layEvent = obj.event;

            //全部展开
            if (layEvent === 'expand') {
                insTb.expandAll();
                return false;
            }

            //全部折叠
            if (layEvent === 'fold') {
                insTb.foldAll();
                return false;
            }

            //删除
            if (layEvent === 'del') {
                let selected = insTb.checkStatus(false);
                let ids = [];
                let url = $(obj.elem.context).data('href')
                $.each(selected, function (index, val) {
                    ids.push(val.id);
                })

                del(url, ids);
                return false;
            }


        });

        //刷新
        $('body').on('click', '[data-table-refresh]', function () {
            insTb.refresh();
        });


    }
    /*** index end ***/



    iconPickerFa.render({
        // 选择器，推荐使用input
        elem: '.iconPicker',
        // fa 图标接口
        url: "/static/layuimini/lib/font-awesome-4.7.0/less/variables.less",
        // 是否开启搜索：true/false，默认true
        search: true,
        // 是否开启分页：true/false，默认true
        page: true,
        // 每页显示数量，默认12
        limit: 12,
        // 点击回调
        click: function (data) {
            // console.log(data);
        },
        // 渲染成功后的回调
        success: function (d) {
            // console.log(d);
        }
    });
});