lodop多页-打印-分组

 //打印预览
    printPreview:function() {
        // console.log(this.grid.data);
        var LODOP;
        LODOP = getCLodop();
        this.CreateOneFormPage();
        LODOP.PREVIEW();
    },
    //分组（区分，每页，展示不同的类型下的所有数据）
    groupBy:function(list, fn){
        const groups = {};
        list.forEach(function (o) {
            const group = JSON.stringify(fn(o));
            groups[group] = groups[group] || [];
            groups[group].push(o);
        });
        // return Object.keys(groups).map(function (group) {
        //     return groups[group];
        // });
        return groups;
    },
    
    CreateOneFormPage:function(){  

        var me = this;
        var groupData = me.groupBy(me.grid.data, function(link) {
             return link.Parameter
        })
        var LODOP;
        LODOP = getCLodop();     
        LODOP.PRINT_INIT("产品套材卡报表"); 
        var strBodyStyle = "<style>" + document.getElementById("style1").innerHTML + "</style>";    

        var ProductObj = me.ProductListHtml();
        var count = 0;
        for (var i in groupData ) {
            var LinkedItem = count*3+1;
            count++;
            LODOP.ADD_PRINT_TABLE("15%", "2%", "96%", "70%", strBodyStyle + me.setTableHtml(groupData[i]));
            LODOP.SET_PRINT_STYLEA(0, "Vorient", 3);
            
            LODOP.ADD_PRINT_HTM('3%', "2%", "96%", "12%", strBodyStyle + me.topTable(i,count));

            LODOP.SET_PRINT_STYLEA(0, "ItemType", 1);
            LODOP.SET_PRINT_STYLEA(0, "LinkedItem", LinkedItem);

            LODOP.ADD_PRINT_HTM('85%', "2%", "96%", "5%",  me.footerTable());
            LODOP.SET_PRINT_STYLEA(0, "ItemType", 1);
            LODOP.SET_PRINT_STYLEA(0, "LinkedItem", LinkedItem);//LinkedItem从1开始，不一样

            LODOP.NewPageA();
        }
        // LODOP.ADD_PRINT_HTM('85%', "2%", "96%", "5%",  me.footerTable());
        // LODOP.SET_PRINT_STYLEA(0, "ItemType", 1);
        LODOP.SET_PREVIEW_WINDOW(0,0,0,0,0,""); 
        LODOP.SET_SHOW_MODE("LANDSCAPE_DEFROTATED",1);//横向时的正向显示
    },
    topTable:function(data,index){
        var me = this;
        var topHtml = '';
        topHtml = '<div id="TitleDiv'+index+'">'+
            '<div class="tableTitle">'+
               
            '</div>'+
            '<div style="display: flex;justify-content: space-around;font-size:12pt;">'+
                '<span>xx：'+me.dataRender(data,"SerialA")+'</span>'+
                '<span>xx：<span>'+me.dataRender(data,"Specifications")+'</span></span>'+
                '<span>xx：'+me.dataRender(data,"SerialB")+'</span>'+
                '<span>xx：'+mini.DateTransform(new Date())+'</span>'+
            '</div>'+
        '</div>';
        return topHtml;
    },
    setTableHtml:function(data){
        var me = this;
        var TableHtml = '';
        TableHtml = '<div id="tableDiv">'+
                '<table style="width:100%;" class="MsoTableGrid" border=1 cellspacing=0 cellpadding="5">'+
                    '<thead>'+
                        '<tr>'+
                            '<td style="width:80px;" >xx</td>'+
                            '<td style="width:80px;" >xx</td>'+
                            '<td style="width:80px;" >xx</td>'+
                            '<td style="width:60px;" >xx</td>'+
                            '<td style="width:40px;" >xx</td>'+
                            '<td style="width:60px;" >xx</td>'+
                            '<td style="width:140px;" >x</td>'+
                            '<td style="width:80px;" >xx</td>'+
                            '<td style="width:80px;" >xx</td>'+
                            '<td style="width:60px;">备注</td>'+
                        '</tr>'+
                    '</thead>'+
                    '<tbody >'+me.ProductListHtml(data)+'</tbody>'+
                '</table>'+
            '</div>';
        return TableHtml;
    },
    ProductListHtml:function(Items){
        var me =this;
        var ListHtml = '';
        // var Items = me.grid.data;
        var n = 1;
        if(!mini.isEmpty(Items)){
            for (var i = 0; i<Items.length; i++) {
                var Item = Items[i];
                ListHtml += '<tr><td>'+me.isValueEmpty(Item.BatchCode)+'</td> <td>'+me.isValueEmpty(Item.BorrowDrawingNo)+'</td>'
                         + '<td>'+me.isValueEmpty(Item.DrawingNo)+'</td> <td>'+me.isValueEmpty(Item.VehicleTimes)+'</td>'
                         + '<td>'+me.isValueEmpty(Item.Quantity)+'</td> <td>'+me.isValueEmpty(Item.Specifications)+'</td>'
                         + '<td>'+me.isValueEmpty(Item.Routes)+'</td> <td>'+me.isValueEmpty(Item.Weight1)+'</td>'
                         + '<td>'+me.isValueEmpty(Item.Weight2)+'</td> <td>'+me.isValueEmpty(Item.Note)+'</td></tr>';
            }
			//**不够一页数据，补充空行**
            var ItemsLength = Items.length>17 ? 17-(Items.length%17) : 17-Items.length;
            if(ItemsLength !==0 && ItemsLength !==17){
                for(var i = 0;i<ItemsLength;i++){
                    ListHtml +='<tr><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td></tr>'
                }
            }
           
        }
        return ListHtml;
    },
    

lodop打印时展示页码

// LODOP.ADD_PRINT_HTM(1,600,300,100,"总页号：<font color='#0000ff' format='ChineseNum'><span tdata='pageNO'>第##页</span>/<span tdata='pageCount'>共##页</span></font>");

样式：

.MsoTable {
            width: 35cm;            
            text-align: center; 
            margin: 0 auto;       
        }        
        table.MsoTableGrid {         
            font-size:10.5pt;  
            border-colspan: colspan;  
            width:100%;   
            text-align: center;   
        }
        table.MsoTableGrid tr {
            line-height: 25px;
            height: 25px;
        }
        .tableTitle {
            font-size: 13.5pt;
            font-weight: bold;
            letter-spacing: 3px;
            line-height: 50px;
            text-align: center;
        }