Как создать заголовок нескольких таблиц

Я пытаюсь объединить таблицу с двумя заголовками. На данный момент я сделал 2 отдельные таблицы с 2 отдельными заголовками, и это выглядит хорошо, но когда ширина таблицы расширяется, первый заголовок таблицы не расширяется. Как я могу объединить 2 заголовка или я могу сделать 1 таблицу с двумя таблицами. Пожалуйста, см. Рисунок (как таблица в настоящее время с двумя таблицами)

Вот мой код:

function createPDF(){
             /** START PDF INSTANCE */
            //var doc = new jsPDF('p', 'pt');
            var doc = new jsPDF('l', 'pt');
            var row = 80;
            addPdfHeader(doc, row, vm.translate("REPORT.LEGALFORMS ")+" "+vm.activeCompanyYear);

            doc.setFillColor(33, 150, 243); 
            var columns = [ "               ",vm.activeCompanyYear,vm.activeCompanyYear-1,vm.activeCompanyYear-2];

            var rows = [];

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


                description = obj.descriptionEng;

                if(description == "total"){
                    description = vm.translate("REPORT.REGISTRY.TOTAL");
                } 

                var singleRow = [description,
                                 obj.year3Total,
                                 obj.year3Local,
                                 obj.year3International,
                                 obj.year2Total,
                                 obj.year2Local,
                                 obj.year2International,  
                                 obj.year1Total,
                                 obj.year1Local,
                                 obj.year1International
                               ]
               rows.push(singleRow);
            }                       

            doc.autoTable(columns, [], {
                theme : 'grid',
                styles: {
                   halign: 'right'
                },
                headerStyles: {
                   fillColor: [33, 150, 243],
                   halign:'center',
                   lineWidth: 1,
                   lineColor: [221, 221, 221]

                },
                columnStyles:{
                     0: {columnWidth: 266}
                },
                margin : {
                  top : 100
                }
            });

            var columns2 = [ vm.translate("MENU.SETTINGS.LEGALFORM"), 
                             vm.translate("REPORT.REGISTRY.TOTAL"),
                             vm.translate("REPORT.REGISTRY.LOCAL"),
                             vm.translate("REPORT.REGISTRY.INTERNATIONAL"),
                             vm.translate("REPORT.REGISTRY.TOTAL"),
                             vm.translate("REPORT.REGISTRY.LOCAL"),
                             vm.translate("REPORT.REGISTRY.INTERNATIONAL"),
                             vm.translate("REPORT.REGISTRY.TOTAL"),
                             vm.translate("REPORT.REGISTRY.LOCAL"),
                             vm.translate("REPORT.REGISTRY.INTERNATIONAL")
                            ];

            doc.autoTable(columns2, rows, {
                theme : 'grid',
                styles: {
                   halign: 'right'
                },
                headerStyles: {
                   halign:'center',
                   lineWidth: 1,
                   lineColor: [221, 221, 221]
                },
                margin : {
                  top : 120
                },
                columnStyles:{
                     0: {halign:'left'}
                },
                createdCell: function(cell, data) {
                   if(data.row.raw[0] === vm.translate("REPORT.REGISTRY.TOTAL")) {
                      cell.styles.fontStyle = 'bold';
                      cell.styles.fillColor = [255,251,204];
                   }
                }

            });

            doc.save();
        };