layui.use(['form', 'table', 'laydate'], function(){
    var form = layui.form;
    var table = layui.table;
    var laydate = layui.laydate;

    laydate.render({
        elem: '#begin_time' //指定元素
    });

    laydate.render({
        elem: '#end_time' //指定元素
    });

    var renderTable = function () {
        table.render({
            id: 'list'
            ,elem: '#blacklist'
            ,url: '/api/ApiBrandBlackList' //数据接口
            ,method:'post'
            ,cellMinWidth: 80 //全局定义常规单元格的最小宽度
            ,page: true //开启分页
            ,cols: [[ //表头
                {title: '序号', type: 'numbers', fixed: 'left', width: 80}
                ,{field: 'id', title: 'ID', width: 100}
                ,{field: 'brand_name', title: '品牌名称', width: 320}
                ,{field: 'com_name', title: '公司名称', width: 320}
                ,{field: 'status', title: '状态', templet: '#status', width: 200}
                ,{field: 'create_time', title: '创建时间', width: 180}
                ,{field: 'update_time', title: '更新时间', width: 180}
                ,{title: '操作',  align:'center', fixed: 'right', toolbar: '#list_action', width: 218}
            ]]
            ,limit: 10
            ,limits: [10, 20, 50,]
        });
    }
    
    renderTable();

    form.on('submit(load)', function(data) {         
        //执行重载
        table.reload('list', {
            page: {
                curr: 1
            }
            ,where: data.field
        });    

        return false;
    });

    // 新增
    $('.add').click(function() {
        $('.set-brand-name').val('');
        $('.set-com-name').val('');

        blacklist_set('新增黑名单');
    })

    function blacklist_set(title) 
    {
        layer.open({
            area: ['400px'],
            title: title,
            type: 1,
            content: $('#black-action'),
            btn: ['确认', '取消'],
            yes: function(index) {
                var brand_name = $('.set-brand-name').val();
                var com_name = $('.set-com-name').val();

                if (!brand_name) {
                    layer.tips('请输入品牌名称', $('.set-brand-name'));
                    return false;
                }

                if (!com_name) {
                    layer.tips('请输入公司名称', $('.set-com-name'));
                    return false;
                }

                $.ajax({
                    url : '/api/ApiSetBrandBlackList',
                    type: 'post',
                    data: $('.blacklist-form').serialize(),
                    dataType: 'json',
                    success: function(resp) {
                        if (resp.errcode == 0) {
                            layer.close(index);
                            layer.msg(resp.errmsg);
                            renderTable(); // 重新加载table
                            return false;
                        }

                        layer.msg(resp.errmsg);
                    }, 
                    error: function(err) {
                        console.log(err)
                    }
                })

                layer.msg(title+'中...', {icon: 16, time: 0, shade: 0.3}); // 阻止重复提交

                return false;
            },
            cancel: function(index) {
                layer.close(index);
            }
        })
    }

     // tool操作
    table.on('tool(blacklist)', function(obj){ //注：tool是工具条事件名，test是table原始容器的属性lay-filter="对应的值"
        var data     = obj.data; //获得当前行数据
        var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
        var url      = '';
        var title    = '';
        var content  = '';
        var datax    = {};
        
        datax.id = data.id;

        if(layEvent === 'edit') { 
            $('.set-id').val(data.id);
            $('.set-brand-name').val(data.brand_name);
            $('.set-com-name').val(data.com_name);

            blacklist_set('编辑黑名单');
            return false;
        } else if (layEvent === 'del') { 
            url     = '/api/ApiDelBrandBlackList';
            title   = '删除黑名单';
            content = '<div style="margin: 40px;">确定删除该黑名单吗？</div>';
        } else if (layEvent === 'enable') { 
            url     = '/api/ApiActionBrandBlackList';
            title   = '启用黑名单';
            content = '<div style="margin: 40px;">确定启用该黑名单吗？</div>';
            datax.status = 1;
        } else if (layEvent === 'forbid') { 
            url     = '/api/ApiActionBrandBlackList';
            title   = '禁用黑名单';
            content = '<div style="margin: 40px;">确定禁用该黑名单吗？</div>';
            datax.status = -1;
        }

        layer.open({
            area: ['400px', '200px'],
            title: title,
            type: 1,
            content: content,
            btn: ['确认', '取消'],
            yes: function(index) {
                $.ajax({
                    url : url,
                    type: 'post',
                    data: datax,
                    dataType: 'json',
                    success: function(resp) {
                        if (resp.errcode == 0) {
                            layer.close(index);
                            layer.msg(resp.errmsg);
                            renderTable(); // 重新加载table

                            return false;
                        }

                        layer.msg(resp.errmsg);
                    }, 
                    error: function(err) {
                        console.log(err)
                    }
                })

                layer.msg(title+'中...', {icon: 16, time: 0, shade: 0.3}); // 阻止重复提交

                return false;
            },
            cancel: function(index) {
                layer.close(index);
            }
        })

        if (layEvent == 'edit') {
            $('.kefu-email').val(data.email);
        }
    }); 

    // 批量导入物料
    $('.import').click(function() {
        // 上传文件
        var form = $('<form id="formUpload" method="post" enctype="multipart/form-data">\
                    <input type="file" name="upload" id="fileInput" accept="application/vnd.ms-excel, application/x-excel, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, .csv">\
                </form>');

        form.find('input').change(function(){
            var formData = new FormData();
            formData.append('file', this.files[0]);

            $.ajax({
                type: "POST",
                url: '/ajax/batchImportBlackList',
                data: formData,
                dataType: 'json',
                cache: false,
                processData: false,
                contentType: false,
                success: function(resp){
                    if (resp.errcode == 0) {
                        layer.msg(resp.errmsg);
                        return false;
                    }   

                    layer.alert(resp.errmsg); 
                }
            })
        })

        form.find('input[type="file"]').trigger('click');   
    })


});