layui.extend({
    common: 'js/common',
    xmSelect: 'layui/dist/xm-select',
}).use(['jquery', 'layer', 'common', 'form', 'xmSelect', 'table'], function () {
    //  Jquery插件
    var $ = layui.jquery;
    //  弹窗插件
    var layer = layui.layer;
    //  引入表单插件
    var form = layui.form;
    //  引入公共模块
    var common = layui.common;
    //  引入下拉菜单
    var xmSelect = layui.xmSelect;
    //  引入表格
    var table = layui.table;

    var layuiTable = null;

    var $node = {
        //取消按钮
        resetBtn        :   $('button[type="reset"]'),
        //  单元搜索
        unitId: $('#unit_id'),
        //  房间搜索
        roomId: $('#room_id'),
        //  住户姓名
        nameInput: $('input[name="name"]'),
        //  联系方式
        telInput: $('input[name="tel"]'),
        //  身份证
        idCardInput: $('input[name="idCard"]'),
    };

    var pageData = {
        residentialId: $('input[name="resId"]'),

        cardNo : $('#card_no')
    }

    var radioData = null;

    //  初始化表格
    layuiTable = common.layuiTable.render(layui.table, {
        elem: '#table_id'
        , url: '/estate/user/showUserList?residentialId=' + pageData.residentialId.val()
        , cellMinWidth: 80 //全局定义常规单元格的最小宽度，
        , cols: [[
            {type: 'radio'}
            , {field: 'name', title: '姓名', align: 'center'}
            , {field: 'sex', title: '性别', templet: '#is_sex', align: 'center', sort: true}
            , {field: 'residentialName', title: '所属小区', align: 'center'}
            , {field: 'unitName', title: '所属单元', align: 'center'}
            , {field: 'roomName', title: '所属房间', align: 'center'}
            , {field: 'type', title: '住户类型', templet: '#is_type', align: 'center', sort: true}
            , {field: 'idCard', title: '证件号码', align: 'center'}
            , {field: 'tel', title: '联系方式', align: 'center'}
            , {
                field: '', title: '卡号', align: 'center', templet: function (d) {
                    if (d.accessCard) {
                        return d.accessCard.cardNo;
                    }
                    return "";
                }
            }
        ]]
        //  开启分页功能
        , page: true
        , done: function (res, curr, count) {
            // // 设置换页勾选之前的
            // table_data = res.data;
            // for(var i=0;i<res.data.length;i++){
            //     for(var j=0;j<ids.length;j++){
            //         if(res.data[i].id==ids[j]){
            //             //这里才是真正的有效勾选
            //             res.data[i]["LAY_CHECKED"]='true';
            //             //找到对应数据改变勾选样式，呈现出选中效果
            //             var index= res.data[i]['LAY_TABLE_INDEX'];
            //             $('.layui-table tr[data-index=' + index + '] input[type="checkbox"]').prop('checked', true);
            //             $('.layui-table tr[data-index=' + index + '] input[type="checkbox"]').next().addClass('layui-form-checked');
            //         }
            //     }
            // }
            // //设置全选checkbox的选中状态，只有改变LAY_CHECKED的值， table.checkStatus才能抓取到选中的状态
            // var checkStatus = table.checkStatus('table_id');
            // if(checkStatus.isAll){
            //     $(' .layui-table-header th[data-field="0"] input[type="checkbox"]').prop('checked', true);
            //     $('.layui-table-header th[data-field="0"] input[type="checkbox"]').next().addClass('layui-form-checked');
            // }
        }
    });

    //监听选择行数据 lay-filter="table_event"
    table.on('radio(table_data)', function (obj) {
        if (obj.checked) {
            radioData = obj.data
            $('#user_name').val(radioData.name)
        }
    });


    //  重新加载表格
    var reloadTable = function (obj) {
        //重新加载表格
        layuiTable.reload({
            where: {
                residentialId: pageData.residentialId.val(),
                unitId: $node.unitId.val(),
                roomId: $node.roomId.val(),
                name: $node.nameInput.val(),
                tel: $node.telInput.val(),
                idCard: $node.idCardInput.val(),
            }
            //重新从第1页开始
            , page: {
                curr: 1
            },
            initSort: obj
        });
    };

    //监听重置查询
    form.on('submit(reset)', function () {
        unitSelect.setValue([]);
        roomSelect.update({data: [], disabled: true});
        $node.unitId.val('');
        $node.roomId.val('');
        $node.nameInput.val('');
        $node.telInput.val('');
        $node.idCardInput.val('');
        reloadTable();
    });

    //监听搜索
    form.on('submit(query)', function () {
        reloadTable();
    });

    //  绑定表单提交事件
    layui.form.on("submit(submit_button)",function(data){
        layer.confirm('是否确认保存？',{icon: 7, title:'提示'}, function(index){
            var userId = radioData.id
            var cardNo = pageData.cardNo.val()
            var residentialId = pageData.residentialId.val()
            $.ajax({
                url     :   '/estate/accessCard/realNameReg',
                data    :   {userId : userId,cardNo: cardNo,residentialId: residentialId},
                type    :   'POST',
                success :   function () {
                    $node.resetBtn.click();
                    parent.location.reload();
                }
            });
        });
    });

    //  点击取消事件
    $node.resetBtn.on('click',function () {
        var index = parent.layer.getFrameIndex(window.name);
        parent.layer.close(index);
    });

    //单元查询下拉列表
    var unitSelect = xmSelect.render({
        el: '#unit_name',
        tips: '请先选择单元',
        radio: true,
        prop: {
            name: 'name',
            value: 'id',
        },
        toolbar: {
            show: true,
            list: [{
                name: '清空',
                method: function () {
                    unitSelect.setValue([]);
                    $node.unitId.val('');
                    roomSelect.update({disabled: true}).setValue([]);
                    $node.roomId.val('');
                }
            }]
        },
        clickClose: true,
        filterable: true,
        remoteSearch: true,
        remoteMethod: function (val, cb, show) {
            $.ajax({
                type: 'GET',
                url: '/estate/unit/getListByLikeName',
                data: {
                    name: val,
                    residentialId: pageData.residentialId.val(),
                    isSelect: true
                },
                success: function (result) {
                    cb(result.list);
                },
                error: function () {
                    cb([]);
                }
            });
        },
        //监听选择
        on: function (data) {
            var change = data.change;
            if (change.length > 0) {
                $node.unitId.val(change[0].id);
                roomSelect.update({
                    data: initRoomFn({
                        residentialId: pageData.residentialId.val(),
                        unitId: change[0].id
                    }), disabled: false
                });
            }
            if (!data.isAdd) {
                $node.unitId.val('');
                roomSelect.update({data: [], disabled: true});
            }
            $node.roomId.val('');
        },
        //显示方式
        model: {
            label: {
                type: 'text',
                text: {
                    //左边拼接的字符
                    left: '',
                    //右边拼接的字符
                    right: '',
                    //中间的分隔符
                    separator: ', ',
                },
            }
        },
    });

    //房间查询下拉列表
    var roomSelect = xmSelect.render({
        el: '#room_name',
        disabled: true,
        tips: '请先选择单元',
        radio: true,
        prop: {
            name: 'name',
            value: 'id',
        },
        toolbar: {
            show: true,
            list: [{
                name: '清空',
                method: function () {
                    roomSelect.setValue([]);
                    $node.roomId.val('');
                }
            }]
        },
        clickClose: true,
        filterable: true,
        remoteSearch: true,
        remoteMethod: function (val, cb, show) {
            $.ajax({
                type: 'GET',
                url: '/estate/room/getListByLikeName',
                data: {
                    name: val,
                    residentialId: pageData.residentialId.val(),
                    unitId: $node.unitId.val(),
                    isSelect: true
                },
                success: function (result) {
                    cb(result.list);
                },
                error: function () {
                    cb([]);
                }
            });
        },
        //监听选择
        on: function (data) {
            var change = data.change;
            if (change.length > 0) {
                $node.roomId.val(change[0].id)
            }
            if (!data.isAdd) {
                $node.roomId.val('');
            }
        },
        //显示方式
        model: {
            label: {
                type: 'text',
                text: {
                    //左边拼接的字符
                    left: '',
                    //右边拼接的字符
                    right: '',
                    //中间的分隔符
                    separator: ', ',
                },
            }
        },
    });

    function initUnitFn(data) {
        var unitList;
        common.sendSyncRequest("/estate/unit/getListByLikeName", 'get', {
            residentialId: pageData.residentialId.val(),
            id: data.id,
            isSelect: true
        }, function (result) {
            unitList = result.list;
        });
        return unitList;
    }

    function initRoomFn(data) {
        var roomList;
        common.sendSyncRequest("/estate/room/getListByLikeName", 'get', {
            residentialId: pageData.residentialId.val(),
            unitId: data.unitId,
            id: data.id,
            isSelect: true
        }, function (result) {
            roomList = result.list;
        });
        return roomList;
    }

});





