bootstrap table自用

$(function() {
        //1.初始化Table
        var oTable = new TableInit();
        oTable.Init();

        //表格高度进行页面大小监听
        $(window).resize(function() {
            $('#table').bootstrapTable('resetView', {
                height : $(window).height() - 25
            });
        });

    });

    var TableInit = function() {
        var oTableInit = new Object();
        //初始化Table
        oTableInit.Init = function() {
            $('#table').bootstrapTable({
                url : ConstantHome + '/getListInfo', //请求后台的URL(*)
                method : 'post', //请求方式(*)
                toolbar : '#toolbar', //工具按钮用哪个容器
                toolbarAlign : 'right',//工具按钮位置
                strictSearch : true,//设置为 true启用全匹配搜索,否则为模糊搜索。
                striped : true, //是否显示行间隔色
                cache : false, //是否使用缓存,默认为true,所以一般情况下需要设置一下这个属性(*)
                pagination : true, //是否显示分页(*)
                queryParams : oTableInit.queryParams,//传递参数(*)
                sidePagination : "server", //分页方式:client客户端分页,server服务端分页(*)
                pageNumber : 1, //初始化加载第一页,默认第一页
                pageSize : 10, //每页的记录行数(*)
                pageList : [ 10, 20, 50, 100 ], //可供选择的每页的行数(*)
                strictSearch : true,
                clickToSelect : true, //是否启用点击选中行
                height : $(window).height() - 25, //自定义表格的高度,保持和页面高度一致
                //height : 460, //行高,如果没有设置height属性,表格自动根据记录条数觉得表格高度
                uniqueId : "id", //每一行的唯一标识,一般为主键列
                dataType : "json", //返回值类型
                columns : [ {
                    checkbox : true
                }, {
                    field : 'num',//可不加
                    title : '序号',//标题  可不加
                    width:"36px",
                    formatter : function(value, row, index) {
                        var pageSize=$('#table').bootstrapTable('getOptions').pageSize;//通过表的#id 可以得到每页多少条
                        var pageNumber=$('#table').bootstrapTable('getOptions').pageNumber;//通过表的#id 可以得到当前第几页
                        return pageSize * (pageNumber - 1) + index + 1;
                    }
                }, {
                    field : 'ID',
                    title : '主键',
                    visible : false

                }, {
                    field : 'appType',
                    title : 'app类型',
                    width : '50px',
                    formatter : function(value, row, index) {
                        return formatAppType(value)
                    }
                }, {
                    field : 'version',
                    title : '版本号',
                    width:"30px",
                }, {
                    field : 'uploadApp',
                    title : 'apk',
                    width:"45px",
                    formatter : oTableInit.formatUrl
                }, {
                    field : 'newFeature',
                    title : '新特性'
                }, {
                    field : 'isEnforcement',
                    title : '是否强制更新',
                    width:"45px",
                    formatter : function(value, row, index) {
                        return formatEnforcement(value)
                    }
                }, {
                    field : 'isCheck',
                    title : '审核状态',
                    width : "110px",
                    formatter : function(value, row, index) {
                        if(!authority["/appEdition/EditSave"]){
                            var dict = [[${check_status}]];
                            return formatTypeByCode(dict,value); 
                        }
                        let audit="";
                        audit+='<select data-number="'+row.id+'" id="isCheck'+row.id+'" name="isCheck" class="tdselect">';
                        if(row.isCheck==0){
                            audit+='<option selected="selected" value="0">待审核</option>';
                            audit+='<option value="1">审核通过</option>';
                            audit+='<option value="2">审核拒绝</option>';
                        }else if(row.isCheck==1){
                            audit+='<option value="0">待审核</option>';
                            audit+='<option selected="selected" value="1">审核通过</option>';
                            audit+='<option value="2">审核拒绝</option>';
                        }else if(row.isCheck==2){
                            audit+='<option value="0">待审核</option>';
                            audit+='<option value="1">审核通过</option>';
                            audit+='<option selected="selected" value="2">审核拒绝</option>';
                        }
                        audit+='</select>';
                        return audit;
                    }
                }, {
                    field : 'downNumber',
                    title : '下载次数',
                    width:"45px",
                }, {
                    field : 'createTime',
                    title : '创建时间',
                    width:"146px",
                    formatter : function(value, row, index) {
                        return formatDate(value)
                    }
                }, {
                    field : 'updateTime',
                    title : '修改时间',
                    width:"146px",
                    formatter : function(value, row, index) {
                        return formatDate(value)
                    }
                }, {
                    title : '操作',
                    field : 'button',
                    align : 'center',
                    width : "160px",
                    events : oTableInit.operateEvents,
                    formatter : oTableInit.AddFunctionButton
                } ]
            });

        };
        
        oTableInit.formatUrl= function(value, row, index) {
            return [
                '<a href="'+value+'">下载</a>'
            ].join("")
        }

        //得到查询的参数
        oTableInit.queryParams = function(params) {
            var param = {
                limit : params.limit,
                offset : params.offset,
                search : $("select[ name='search_text' ] ").val(), //定义传输的搜索参数
                order : params.sortOrder,
                sort : params.sortName
            };
            search_trim(param);
            return param;

        };

        oTableInit.AddFunctionButton = function(value, row, index) {
            var x1 = x2 = x3 = "display:none";
            if(authority["/appEdition/view"]){x1 = ""}
            if(authority["/appEdition/edit"]){x2 = ""}
            if(authority["/appEdition/Delete"]){x3 = ""}
            return [
                    '<button id="TableView" style="'+x1+'" type="button" class="btn btn-info btn-xs right10">详情</button>',

                    '<button id="TableEdit" style="'+x2+'" type="button" class="btn btn-warning btn-xs right10">修改</button>',

                    '<button id="TableDelete" style="'+x3+'" type="button" class="btn btn-danger btn-xs right10">删除</button>' ]
                    .join("")
        }

        oTableInit.operateEvents = {
            'click #TableView' : function(e, value, row, index) {
                layer.open({
                    type : 2,
                    title : '详情',
                    maxmin: true,
                    area : [ '70%', '70%' ],
                    content : ConstantHome + '/view?id=' + row.id, //iframe的url
                });
            },
            'click #TableDelete' : function(e, value, row, index) {
                deleteItem(row.id);
            },
            'click #TableEdit' : function(e, value, row, index) {
                layer.open({
                    type : 2,
                    title : '修改',
                    maxmin: true,
                    area : [ '70%', '70%' ],
                    content : ConstantHome + '/edit?id=' + row.id, //iframe的url
                });
            }
        }

        $('#table').on('load-success.bs.table', function(data) {//table加载成功后的监听函数
            $(".pull-right").css("display", "block");
        
            $("select[name='isCheck']").change(function(){
                
                let id=$(this).attr("data-number");
                let isCheck=$(this).val();
                let data={
                    id:id,
                    isCheck:isCheck    
                };
                
                layer.confirm("确定修改审核状态吗?", {
                    btn: ["确定","取消"],
                    closeBtn: 0
                }, function(index){
                    // 修改审核状态
                    postData(ConstantHome+'/EditSave',data,function(ret){
                        if(!paramIsNull(ret)){
                            if(ret.code==0){
                                layer.msg("修改审核状态成功");
                                setTimeout(function(){
                                    refresh2();
                                },1000);
                            }else{
                                if (ret.code == null) {
                                    layer.open({
                                        title : '您没有权限',
                                        content : ret
                                    });

                                } else {
                                    layer.msg(ret.msg);
                                }
                            }
                        }else{
                            layer.msg('服务器繁忙,请重试');
                        }
                    }); 
                }, function(index){
                    layer.close(index);
                    //refresh();
                });
            });

            //加载完成后执行 界面权限控制
            //judgeAuthority();
            setTimeout(function(){
                $('#table').bootstrapTable('resetView', {
                    height : $(window).height() - 25
                });
            },0)
            
        });
        return oTableInit;
    };

猜你喜欢

转载自www.cnblogs.com/beimingbingpo/p/9776419.html
今日推荐