如何使特定行加粗？

Question

我正在生成PDF，目前进展顺利，但我想让特定的几行字体加粗。例如查看图片：jspdf-autotable的网格模板，如何使id = 1和id = 3的行加粗？以下是我的代码。

function createPDF() {
            if(vm.activeCompanyYear){
                var url = "/coci/report/registry/"+vm.activeCompanyYear;

                DataApiService.callApi(url,null,"GET").then(function(reportData){

                    if(reportData){
                        var doc = new jsPDF('p', 'pt');
                        var row = 45;
                        addPdfHeader(doc, row, "");
                        doc.printingHeaderRow = true;
                        var columns = [ "Description", vm.activeCompanyYear,vm.activeCompanyYear-1, vm.activeCompanyYear-2,vm.activeCompanyYear-3,vm.activeCompanyYear-4,"% t.o.v.'13" ];

                        var rows = [];

                        for(var j=0; j<reportData.length; j++){
                            var obj = reportData[j];

                            if (!obj.description ) {obj.description = '';}

                            if (!obj.year5 ) {obj.year5 = '';}

                            if (!obj.year4 ) {obj.year4 = '';}

                            if (!obj.year3 ) {obj.year3 = '';}

                            if (!obj.year2 ) {obj.year2 = '';}

                            if (!obj.year1 ) {obj.year1 = '';}

                            if (!obj.delta ) {obj.delta = '';}


                            /*TODO : Align data right in grid*/

                            var singleRow = [obj.description,obj.year5,obj.year4,obj.year3,obj.year2,obj.year1,obj.delta];
                            rows.push(singleRow);

                        }                       

                        doc.autoTable(columns, rows, {
                            theme : 'grid',
                            styles: {
                                    halign: 'right',
                                     },
                            headerStyles: {
                                         fillColor: [33, 150, 243],
                                         halign:'center'
                            },
                            margin : {
                                top : 100
                                },
                            columnStyles:{
                                 0: {halign:'left'}
                            }

                        });


                        vm.isLoading = false;
                        blockUI.stop();
                        /* doc.save(); */
                        vm.reportData = doc.output('datauristring');

                    }
                });
            }
        }

- akshay bhoendie

Answer 1

类似以下这样的代码应该可以运行：

doc.autoTable({
  html: '#table',
  didParseCell: function(cell, data) {
    if (data.row.index === 0 || data.row.index === 2) {
      cell.styles.fontStyle = 'bold';
    }
  }
})

- Simon Bengtsson

---

嗨朋友，我试了以下的方法，它正常工作了：doc.autoTable(cols, data, { createdCell: function(cell, data) { if (data.row.index === 0 || data.row.index === 2) { cell.styles.fontStyle = 'bold'; } } }) - akshay bhoendie

对我来说，数据参数未定义，必须使用单元格参数本身，如下所示： didParseCell: function(cell, data) { if (cell.row.index === 0) { cell.cell.styles.fontStyle = 'bold'; } }, 不确定为什么会发生这种情况。 - Sharath

嘿@Sharath，这是因为他们将函数更改为仅接收一个参数，该参数包括单元格和数据。而不是使用函数（cell，data），请使用函数（hookData），然后在内部分别使用hookData.data和hookData.cell。 - Tamir Gilany

Answer 2

我尝试了以下方法，它有效：

 doc.autoTable(cols, data, { createdCell: function(cell, data) { if (data.row.index === 0 || data.row.index === 2) { cell.styles.fontStyle = 'bold'; } } })

- akshay bhoendie

Answer 3

由于我建议的编辑队列已满，无法为顶部接受的评论添加修复，因此我将添加自己的评论并进行修复。

  doc.autoTable({
    html: '#table',
    didDrawCell: function (hookData) {
      if (hookData.section === 'body') {
        if (hookData.row.index === 2) {
          for (const cell of Object.values(hookData.row.cells)) {
            cell.styles.fontStyle = 'bold';
          }
        }
      }
    },
  });

- Tamir Gilany

Answer 4

    var res = doc.autoTableHtmlToJson(document.getElementById(m));
        var idm=document.getElementById(m);
               // console.log("res.rows",res.rows);
                var clength=res.columns.length;
                 var crow=res.rows.length;
        //console.log("columns.length:",clength);
        //console.log("rows.length:",crow);
                var fsize;
                if(clength>13)
                     {fsize=10;}
                else  if(clength>10) 
                     {fsize=10;}
                else  if(clength>7) 
                     {fsize=10;}
                else  if(clength<6) 
                     {fsize=10;}
                if(PdfType=='Flexible')
                     {fsize=7.5;}
                      

    
               //console.log("res.columns:", res.columns, "res.data:", res.data, res);
         doc.autoTable(res.columns, res.data, {margin: {top: vy+25},pageBreak: 'auto',styles: {cellPadding: 1.5,fontSize:fsize , },fontStyle: 'bold',drawRow: function (row, data) {
                currentRow = row;
                        currentRow.height =30;
                       // console.log("row",row);
                       // console.log("data::::",data);
                       
                     
 if((currentRow.cells[0].text[0].includes('Total')) || (currentRow.cells[0].text[0].includes('Avg'))||(currentRow.cells[0].text[0].includes('count'))||(currentRow.cells[0].text[0].includes('Min'))||(currentRow.cells[0].text[0].includes('Max')))

  {
                     // console.log("cell length",res.columns.length);
                      
                      //console.log("cell",currentRow.cells[i].text);
   
                         for(var i=0;i<res.columns.length;i++)
                              {
                              
                                  currentRow.cells[i].styles.fontStyle = "bold";
                                  currentRow.cells[i].styles.font = "sans-serif" ; 
                                  currentRow.cells[i].styles.fillColor = [243,205,204];                 
                                  currentRow.cells[1].styles.columnWidth="wrap";
                                  currentRow.cells[1].styles.FontSize=30;
                                  
                                  }
                                 
                               
                                  
  }                    
        
                
    },columnStyles: {0: {columnWidth: columnwidthrgroup},},});

我只需要获取该行中的所有单元格，很简单

- CRYZAL