添加分页插件

VisualInspection/js/constant/constant.js

@@ -2,13 +2,13 @@ var page_size=10;
 // var p_cur = 1; //页号
 // var p_pages; //总页码
 // var p_totalRecords;
-// var curTable;
+var curTable;
 var curDatas;
 function queryConstant(){
-    p_cur = 1;
+    // p_cur = 1;
     getConstant();
 }
-function getConstant(p_cur){
+function getConstant(){
     // var data = {
     //     "flag_name": $("#keywords").val()
     // }
@@ -33,8 +33,8 @@ function updateTable(){
     // var tableData=data.list;
     var cols = [
                 {width: 80, text: '序号', type: 'number', flex: false, field: 'num'},
-                {width: 80, text: '代码编号', type: 'date', flex: false, field: 'code_flag'},
-                {width: 80, text: '代码名称', type: 'string', flex: true, field: 'code_name'},
+                {width: 80, text: '字典值', type: 'date', flex: false, field: 'code_value'},
+                {width: 80, text: '字典名称', type: 'string', flex: true, field: 'code_name'},
                 {width: 80, text: '有效标志', type: 'date', flex: false, field: 'valid'},
                 {width: 80, text: '代码标识', type: 'string', flex: true, field: 'code_flag'},
                 {width: 160, text: '标识名称', type: 'date', flex: false, field: 'flag_name'},
@@ -48,19 +48,14 @@ function updateTable(){
             ];
     
     var pager = {
-        page_size:10,
-        p_cur : data.pageNum, //页号
-        p_pages:data.pages, //总页码
-        p_totalRecords:data.total,
-        'cb':getConstant
+        page_size:10
     }
-    curTable = $('.datatable').mytable({'cols':cols,
-                                        'tableData':'',//tableData,
-                                        'url':"/constant/getConstantByName/",
-                                        'param':data,
-                                        'pager':pager}
-                                        );
-    
+    $('.datatable').mytable({'cols':cols,
+                            // 'tableData':tableData,
+                            'url':"/constant/getConstantByName/",
+                            'param':data,
+                            'pager':pager}
+                            );
 }
 
 function showAddConstant(){
@@ -72,7 +67,7 @@ function showAddConstant(){
     $('#sort_no').val('');
     $('#remark').val('');
     $("#valid").attr('checked','true');
-    $("#operation-btn").click(function(){
+    $("#operation-btn").unbind("click").click(function(){
         addConstant();
     });
 }
@@ -81,10 +76,12 @@ function addConstant(){
     addOrUpdateConstant("/constant/add/");
 }
 
+var cur_id;
 function addOrUpdateConstant(url){
     var valid=1;
     if(!$("#valid").is(':checked')) valid=0;
     var param ={
+        'id':cur_id,
         'code_flag':$('#code_flag').val(),
         'flag_name':$('#flag_name').val(),
         'code_value':Number($('#code_value').val()),
@@ -103,9 +100,9 @@ function addOrUpdateConstant(url){
 }
 
 function showEditConstant(id){
-    
-    // alert(curTable.getPager());
+    cur_id='';
     $('#formModal').modal('toggle');
+    var curDatas = $('.datatable').mytable('getTableData');
     var rowData;
     for(var i=0;i<curDatas.length;i++){
         if(id==curDatas[i].id){
@@ -113,21 +110,24 @@ function showEditConstant(id){
             break;            
         }
     }
-    $('#code_flag').val(rowData.code_flag);
-    $('#flag_name').val(rowData.flag_name);
-    $('#code_value').val(rowData.code_value);
-    $('#code_name').val(rowData.code_name);
-    $('#sort_no').val(rowData.sort_no);
-    $('#remark').val(rowData.remark);
-    if(rowData.valid==1){
-        $("#valid").attr('checked','true');
-    }else{
-        $("#valid").attr('checked','false');
+    if(rowData) {
+        cur_id = rowData.id;
+        $('#code_flag').val(rowData.code_flag);
+        $('#flag_name').val(rowData.flag_name);
+        $('#code_value').val(rowData.code_value);
+        $('#code_name').val(rowData.code_name);
+        $('#sort_no').val(rowData.sort_no);
+        $('#remark').val(rowData.remark);
+        if(rowData.valid==1){
+            $("#valid").attr('checked','true');
+        }else{
+            $("#valid").attr('checked','false');
+        }
+        
+        $("#operation-btn").unbind("click").click(function(){
+            updateConstant();
+        });
     }
-    
-    $("#operation-btn").click(function(){
-        updateConstant();
-    });
 }
 
 function updateConstant(){

VisualInspection/js/constant/pager.js

@@ -1,160 +0,0 @@
-(function($) {
-    'use strict';
-
-    var con;
-    var options;
-    var pager;
-    var curDatas;
-    /**
-     * Datatable class
-     * 
-     * @param object element           DOM element or jquery element
-     * @param object options           Datatable options
-     */
-    var mytable = function(element, options) {
-        this.options = options;
-        this.pager = options.pager;
-        this.con = $(element);
-        this.getRemoteData(options,this);
-        
-        return this;       
-    };
-
-
-    // default options
-    mytable.DEFAULTS = {
-        container:"",
-        pages:'',
-        curr:'',
-        groups:'',
-        first:1,
-        last:1,
-        prev:1,
-        next:1,
-        jump:null
-    };
-
-    // Get options
-    mytable.prototype.getOptions = function(options) {
-        
-    };
-
-    mytable.prototype.getRemoteData = function(options,obj) {
-        var url = options.url;
-        var p_cur = 1;
-        if(this.pager.p_cur) p_cur=this.pager.p_cur;
-        // var data = options.param;
-        common_post_service(url+"/"+p_cur+"/"+this.pager.page_size, options.param, function(data) {
-            // curDatas=data.list;
-            // updateTable(data);
-            options.tableData=data.list;
-            obj.setTable(element, options);    
-            if(obj.pager) obj.setPager();
-            //pager();
-        }, function(error) {
-            alert(error);
-        });
-    };
-
-    // Get options
-    mytable.prototype.setTable = function(element, options) {
-        var cols = options.cols;
-        var tableData = options.tableData;
-        var p_cur = 1;
-        if(this.pager.p_cur) p_cur=this.pager.p_cur;
-        var rowData = formatTableData(tableData, cols);
-        clearTable(cols);
-        // 使用data参数更新数据：
-        this.con.datatable('load',  {
-                cols: cols,
-                rows:rowData
-            }
-        );
-        function formatTableData(data,cols){
-            var rows = [];
-            for(var i=0;i<data.length;i++){
-                data[i].num=(p_cur-1)*10+i+1;
-                rows.push(genRow(data[i],cols));
-            }
-            return rows;
-        }
-
-        function genRow(obj,cols){
-            var row = {checked: false, data:null};
-            var dArr=[];
-            for(var i=0;i<cols.length;i++){
-                if(cols[i].oper!=null) {
-                    var oper = cols[i].oper;
-                    var operStr="";
-                    for(var j=0;j<oper.length;j++){
-                        operStr+='<a href="#" onclick="'+oper[j].func+'('+obj[cols[i].field]+')"><i class="icon icon-edit"></i>'+oper[j].text+'</a> ';
-                    }
-                    dArr.push(operStr);
-                }else{
-                    dArr.push(obj[cols[i].field]);
-                }
-            }
-            row.data=dArr;
-            return row;
-        }
-        function clearTable(cols){
-            $(element).datatable( {
-                checkable:false,
-                sortable:false,
-                data: {
-                    cols: cols,
-                    rows:[]
-                }
-            });
-        }
-    };
-    mytable.prototype.setPager = function(data) {
-        var pager = this.options.pager;
-        var p_cur = pager.p_cur;
-        var p_pages = pager.p_pages;
-        var p_totalRecords = pager.p_totalRecords;
-        kkpager.generPageHtml({
-            pno : p_cur,
-            total : p_pages,
-            totalRecords : p_totalRecords,
-            mode : 'click',
-            click : function(n){
-                pager.p_cur = n;
-                this.selectPage(n);
-                pager.cb(n);//调用获取数据方法
-                return false;
-            }
-        },true);
-    };
-    // Get options
-    mytable.prototype.getPager = function(options) {
-        return this.pager;
-    };
-    // Load data form options or table dom
-    mytable.prototype.load = function(data) {
-        var options = this.options,
-            cols;
-
-        this.render();
-    };
-
-    // Render datatable
-    mytable.prototype.render = function() {
-        var that = this;
-    };
-
-
-    $.fn.mytable = function(option) {
-        return this.each(function() {
-            var $this = $(this);
-            new mytable(this,option);
-        });
-    };
-
-    $.fn.mytable.getData = function() {
-        return this.getPager();
-    };
-
-    // $.fn.pager.Constructor = mytable;
-}(jQuery));
-

VisualInspection/js/lib/mytable.js

@@ -0,0 +1,170 @@
+(function($) {
+    'use strict';
+
+    var con;
+    var options;
+    var curDatas;
+    var element;
+    var obj;
+    /**
+     * Datatable class
+     * 
+     * @param object element           DOM element or jquery element
+     * @param object options           Datatable options
+     */
+    var mytable = function(element, options) {
+        this.element = element;
+        this.options = options;
+        this.pager = options.pager;
+        this.con = $(element);
+        this.obj = this;
+        $(element).html('');
+        $(element).append('<div class="row"><div id="my_table" data-checkable="true" data-sortable="true"></div></div>'
+                           + '<div id="kkpager" class="row" style="text-align:center"></div>');
+        this.getRemoteData(element,options,this);
+        return this;       
+    };
+
+
+    // default options
+    mytable.DEFAULTS = {
+        container:"",
+        pages:'',
+        curr:'',
+        groups:'',
+        first:1,
+        last:1,
+        prev:1,
+        next:1,
+        jump:null
+    };
+
+    // Get options
+    mytable.prototype = {
+        getRemoteData:function(element,options,obj){
+            if(!element) element = this.element;
+            if(!options) options = this.options;
+            var url = options.url;
+            var p_cur = 1;
+            var pager = options.pager;
+            this.getServerData(p_cur, options, element, obj);
+        },
+        getRemoteData1:function(p_cur){
+            this.getServerData(p_cur, this.options, this.element, this.obj);
+        },
+        getServerData:function(p_cur, options, element, obj){
+            var url = options.url;
+            var pager = options.pager;
+            var page_size = pager.page_size;
+            var param = options.param;
+            // var obj = this.obj;
+            common_post_service(url+"/"+p_cur+"/"+page_size, param, function(data) {
+                // $(element).html("");
+                element.tt_data=data.list;
+                options.tableData=data.list;
+                obj.setTable(data.list,element, options,p_cur); 
+                if(obj.options.pager){
+                    options.pager = {
+                        page_size:10,
+                        p_cur : data.pageNum, //页号
+                        p_pages:data.pages, //总页码
+                        p_totalRecords:data.total
+                        // 'cb':'getRemoteData
+                    }   
+                    obj.setPager();
+                }
+            }, function(error) {
+                alert(error);
+            });
+        },
+        setTable:function(datas, element, options,p_cur) {
+            var cols = options.cols;
+            var tableData = datas;
+            // var pager = options.pager;
+            clearTable(cols);
+            var rowData = formatTableData(tableData, cols, p_cur);
+
+            // 使用data参数更新数据：
+            $('#my_table').datatable('load',{
+                    cols: cols,
+                    rows:rowData
+                }
+            );
+            function formatTableData(data,cols,p_cur){
+                var rows = [];
+                for(var i=0;i<data.length;i++){
+                    data[i].num=(p_cur-1)*10+i+1;
+                    rows.push(genRow(data[i],cols));
+                }
+                return rows;
+            }
+
+            function genRow(obj,cols){
+                var row = {checked: false, data:null};
+                var dArr=[];
+                for(var i=0;i<cols.length;i++){
+                    if(cols[i].oper!=null) {
+                        var oper = cols[i].oper;
+                        var operStr="";
+                        for(var j=0;j<oper.length;j++){
+                            operStr+='<a href="#" onclick="'+oper[j].func+'('+obj[cols[i].field]+')"><i class="icon icon-edit"></i>'+oper[j].text+'</a> ';
+                        }
+                        dArr.push(operStr);
+                    }else{
+                        dArr.push(obj[cols[i].field]);
+                    }
+                }
+                row.data=dArr;
+                return row;
+            }
+            function clearTable(cols){
+                $('#my_table').datatable( {
+                    checkable:false,
+                    sortable:false,
+                    data: {
+                        cols: cols,
+                        rows:[]
+                    }
+                });
+            }
+        },
+        setPager:function(data) {
+            var pager = this.options.pager;
+            var p_cur = pager.p_cur;
+            var p_pages = pager.p_pages;
+            var p_totalRecords = pager.p_totalRecords;
+            var obj=this;
+            kkpager.generPageHtml({
+                pno : p_cur,
+                total : p_pages,
+                totalRecords : p_totalRecords,
+                mode : 'click',
+                click : function(n){
+                    obj.options.pager.p_cur = n;
+                    this.selectPage(n);
+                    obj.getRemoteData1(n);//调用获取数据方法
+                    return false;
+                }
+            },true);
+        }
+    };
+
+    $.fn.mytable = function(options) {
+        if (typeof options == 'string') {
+            switch (options) {
+                case 'getTableData': 
+                    return this[0].tt_data; 
+            }
+         }   else{
+        return this.each(function() {
+            // var $this = $(this);
+                new mytable(this,options);
+            //  $(this).attr('tableData',mytable.tableData);
+            });
+        }
+    };
+
+
+    $.fn.mytable.Constructor = mytable;
+}(jQuery));
+

VisualInspection/node_modules/zui/dist/lib/mytable/mytable.js

@@ -0,0 +1,170 @@
+(function($) {
+    'use strict';
+
+    var con;
+    var options;
+    var curDatas;
+    var element;
+    var obj;
+    /**
+     * Datatable class
+     * 
+     * @param object element           DOM element or jquery element
+     * @param object options           Datatable options
+     */
+    var mytable = function(element, options) {
+        this.element = element;
+        this.options = options;
+        this.pager = options.pager;
+        this.con = $(element);
+        this.obj = this;
+        $(element).html('');
+        $(element).append('<div class="row"><div id="my_table" data-checkable="true" data-sortable="true"></div></div>'
+                           + '<div id="kkpager" class="row" style="text-align:center"></div>');
+        this.getRemoteData(element,options,this);
+        return this;       
+    };
+
+
+    // default options
+    mytable.DEFAULTS = {
+        container:"",
+        pages:'',
+        curr:'',
+        groups:'',
+        first:1,
+        last:1,
+        prev:1,
+        next:1,
+        jump:null
+    };
+
+    // Get options
+    mytable.prototype = {
+        getRemoteData:function(element,options,obj){
+            if(!element) element = this.element;
+            if(!options) options = this.options;
+            var url = options.url;
+            var p_cur = 1;
+            var pager = options.pager;
+            this.getServerData(p_cur, options, element, obj);
+        },
+        getRemoteData1:function(p_cur){
+            this.getServerData(p_cur, this.options, this.element, this.obj);
+        },
+        getServerData:function(p_cur, options, element, obj){
+            var url = options.url;
+            var pager = options.pager;
+            var page_size = pager.page_size;
+            var param = options.param;
+            // var obj = this.obj;
+            common_post_service(url+"/"+p_cur+"/"+page_size, param, function(data) {
+                // $(element).html("");
+                element.tt_data=data.list;
+                options.tableData=data.list;
+                obj.setTable(data.list,element, options,p_cur); 
+                if(obj.options.pager){
+                    options.pager = {
+                        page_size:10,
+                        p_cur : data.pageNum, //页号
+                        p_pages:data.pages, //总页码
+                        p_totalRecords:data.total
+                        // 'cb':'getRemoteData
+                    }   
+                    obj.setPager();
+                }
+            }, function(error) {
+                alert(error);
+            });
+        },
+        setTable:function(datas, element, options,p_cur) {
+            var cols = options.cols;
+            var tableData = datas;
+            // var pager = options.pager;
+            clearTable(cols);
+            var rowData = formatTableData(tableData, cols, p_cur);
+
+            // 使用data参数更新数据：
+            $('#my_table').datatable('load',{
+                    cols: cols,
+                    rows:rowData
+                }
+            );
+            function formatTableData(data,cols,p_cur){
+                var rows = [];
+                for(var i=0;i<data.length;i++){
+                    data[i].num=(p_cur-1)*10+i+1;
+                    rows.push(genRow(data[i],cols));
+                }
+                return rows;
+            }
+
+            function genRow(obj,cols){
+                var row = {checked: false, data:null};
+                var dArr=[];
+                for(var i=0;i<cols.length;i++){
+                    if(cols[i].oper!=null) {
+                        var oper = cols[i].oper;
+                        var operStr="";
+                        for(var j=0;j<oper.length;j++){
+                            operStr+='<a href="#" onclick="'+oper[j].func+'('+obj[cols[i].field]+')"><i class="icon icon-edit"></i>'+oper[j].text+'</a> ';
+                        }
+                        dArr.push(operStr);
+                    }else{
+                        dArr.push(obj[cols[i].field]);
+                    }
+                }
+                row.data=dArr;
+                return row;
+            }
+            function clearTable(cols){
+                $('#my_table').datatable( {
+                    checkable:false,
+                    sortable:false,
+                    data: {
+                        cols: cols,
+                        rows:[]
+                    }
+                });
+            }
+        },
+        setPager:function(data) {
+            var pager = this.options.pager;
+            var p_cur = pager.p_cur;
+            var p_pages = pager.p_pages;
+            var p_totalRecords = pager.p_totalRecords;
+            var obj=this;
+            kkpager.generPageHtml({
+                pno : p_cur,
+                total : p_pages,
+                totalRecords : p_totalRecords,
+                mode : 'click',
+                click : function(n){
+                    obj.options.pager.p_cur = n;
+                    this.selectPage(n);
+                    obj.getRemoteData1(n);//调用获取数据方法
+                    return false;
+                }
+            },true);
+        }
+    };
+
+    $.fn.mytable = function(options) {
+        if (typeof options == 'string') {
+            switch (options) {
+                case 'getTableData': 
+                    return this[0].tt_data; 
+            }
+         }   else{
+        return this.each(function() {
+            // var $this = $(this);
+                new mytable(this,options);
+            //  $(this).attr('tableData',mytable.tableData);
+            });
+        }
+    };
+
+
+    $.fn.mytable.Constructor = mytable;
+}(jQuery));
+

VisualInspection/node_modules/zui/dist/lib/pager/pager.js

@@ -1,137 +0,0 @@
-(function($) {
-    'use strict';
-
-    var con;
-
-    /**
-     * Datatable class
-     * 
-     * @param object element           DOM element or jquery element
-     * @param object options           Datatable options
-     */
-    var mytable = function(element, options) {
-        this.name = name;
-        this.con = $(element);
-        var cols = options.cols;
-        var tableData = options.tableData;
-        var rowData = formatTableData(tableData, cols);
-        clearTable(cols);
-        // 使用data参数更新数据：
-            this.con.datatable('load',  {
-                cols: cols,
-                rows:rowData
-            }
-        );
-
-        function formatTableData(data,cols){
-            var rows = [];
-            for(var i=0;i<data.length;i++){
-                data[i].num=(p_cur-1)*10+i+1;
-                rows.push(genRow(data[i],cols));
-            }
-            return rows;
-        }
-
-        function genRow(obj,cols){
-            var row = {checked: false, data:null};
-            var dArr=[];
-            for(var i=0;i<cols.length;i++){
-                if(cols[i].text=='操作') {
-                    var str='<a href="#" onclick="showEditConstant('+obj[cols[i].field]+')"><i class="icon icon-edit"></i> 修改</a><a href="#" onclick="deleteConstant('+obj[cols[i].field]+')"><i class="icon icon-remove-circle"></i> 删除</a>';
-                    dArr.push(str);
-                }else{
-                    dArr.push(obj[cols[i].field]);
-                }
-            }
-            row.data=dArr;
-            return row;
-        }
-        function clearTable(cols){
-            $(element).datatable( {
-                checkable:false,
-                sortable:false,
-                data: {
-                    cols: cols,
-                    rows:[]
-                }
-            });
-        }
-    };
-
-
-    // default options
-    mytable.DEFAULTS = {
-        container:"",
-        pages:'',
-        curr:'',
-        groups:'',
-        first:1,
-        last:1,
-        prev:1,
-        next:1,
-        jump:null
-    };
-
-    // Get options
-    mytable.prototype.getOptions = function(options) {
-        var $e = this.$;
-        options = $.extend({}, DataTable.DEFAULTS, this.$.data(), options);
-
-        options.tableClass = options.tableClass || '';
-        options.tableClass = ' ' + options.tableClass + ' table-datatable';
-
-        $.each(['bordered', 'condensed', 'striped', 'condensed', 'fixed'], function(idx, cls) {
-            cls = 'table-' + cls;
-            if($e.hasClass(cls)) options.tableClass += ' ' + cls;
-        });
-
-        if($e.hasClass('table-hover') || options.rowHover) {
-            options.tableClass += ' table-hover';
-        }
-
-        if(!options.checkable || !$.fn.selectable) options.selectable = false;
-
-        this.options = options;
-    };
-
-    // Load data form options or table dom
-    mytable.prototype.load = function(data) {
-        var options = this.options,
-            cols;
-
-        this.render();
-    };
-
-    // Render datatable
-    mytable.prototype.render = function() {
-        var that = this;
-        
-    };
-
-    // Bind global events
-    mytable.prototype.bindEvents = function() {
-        var that = this,
-            data = this.data,
-            options = this.options,
-            $datatable = this.$datatable;
-
-        var $dataSpans = that.$dataSpans = $datatable.children('.datatable-head, .datatable-rows').find('.datatable-span');
-        var $rowsSpans = that.$rowsSpans = $datatable.children('.datatable-rows').children('.datatable-rows-span');
-        var $headSpans = that.$headSpans = $datatable.children('.datatable-head').children('.datatable-head-span');
-        var $cells = that.$cells = $dataSpans.find('td, th');
-        var $dataCells = that.$dataCells = $cells.filter('td');
-        that.$headCells = $cells.filter('th');
-        var $rows = that.$rows = that.$rowsSpans.find('.table > tbody > tr');
-
-    };
-
-    $.fn.mytable = function(option) {
-        return this.each(function() {
-            var $this = $(this);
-            new mytable(this,option);
-        });
-    };
-
-    // $.fn.pager.Constructor = mytable;
-}(jQuery));
-

VisualInspection/view/common/commonscriptlink.html

@@ -4,7 +4,8 @@
 <script src="/node_modules/zui/dist/js/zui.min.js"></script>
 <script src="/node_modules/zui/dist/lib/datetimepicker/datetimepicker.min.js"></script>
 <script src="/node_modules/zui/dist/lib/datatable/zui.datatable.min.js"></script>
-<script src="/js/constant/pager.js?v=11"></script>  
+<!--<script src="/node_modules/zui/dist/lib/mytable/mytable.js"></script>  -->
+<script src="/js/lib/mytable.js"></script>
 <script src="/node_modules/moment/min/moment.min.js"></script>
 <script src="/node_modules/moment/locale/zh-cn.js"></script>
 <script src="/node_modules/blueimp-md5/js/md5.min.js"></script>

VisualInspection/view/constant/constant.html

@@ -19,13 +19,12 @@
             </div>
         </div>
         <br>
-
-        <div class="row">
-             <!-- 使用一个div来显示数据表格 -->
+        <div class="datatable"></div>
+        <!--<div class="row">
             <div class="datatable" data-checkable="true" data-sortable="true"></div 
         </div>
         <div id="kkpager" class="row" style="text-align:center">           
-        </div>
+        </div>-->
     </div>
     <!-- 对话框HTML -->
     <div class="modal fade" id="formModal">

VisualInspection/view/constant/form.html

@@ -1,6 +1,8 @@
 <div class="container-fluid ">
         <form class="form-horizontal">
             <div class="form-group">
+            </div>
+            <div class="form-group">
                 <label for="exampleInputAccount4" class="col-sm-2">字典标识</label>
                 <div class="col-md-6 col-sm-10">
                 <input type="text" class="form-control" id="code_flag" placeholder="字典标识">