Как удалить границы вокруг lo go в заголовке и заголовке изображения на всех страницах при печати с использованием базы данных angular

Question

Я использую angular таблицы данных для печати с помощью кнопки print. файл buttons.print.js выглядит так, как показано

/*!


(function( factory ){
    if ( typeof define === 'function' && define.amd ) {
        // AMD
        define( ['jquery', 'datatables.net', 'datatables.net-buttons'], function ( $ ) {
            return factory( $, window, document );
        } );
    }
    else if ( typeof exports === 'object' ) {
        // CommonJS
        module.exports = function (root, $) {
            if ( ! root ) {
                root = window;
            }

            if ( ! $ || ! $.fn.dataTable ) {
                $ = require('datatables.net')(root, $).$;
            }

            if ( ! $.fn.dataTable.Buttons ) {
                require('datatables.net-buttons')(root, $);
            }

            return factory( $, root, root.document );
        };
    }
    else {
        // Browser
        factory( jQuery, window, document );
    }
}(function( $, window, document, undefined ) {
'use strict';
var DataTable = $.fn.dataTable;


var _link = document.createElement( 'a' );

/**
 * Clone link and style tags, taking into account the need to change the source
 * path.
 *
 * @param  {node}     el Element to convert
 */
var _styleToAbs = function( el ) {
    var url;
    var clone = $(el).clone()[0];
    var linkHost;

    if ( clone.nodeName.toLowerCase() === 'link' ) {
        clone.href = _relToAbs( clone.href );
    }

    return clone.outerHTML;
};

/**
 * Convert a URL from a relative to an absolute address so it will work
 * correctly in the popup window which has no base URL.
 *
 * @param  {string} href URL
 */
var _relToAbs = function( href ) {
    // Assign to a link on the original page so the browser will do all the
    // hard work of figuring out where the file actually is
    _link.href = href;
    var linkHost = _link.host;

    // IE doesn't have a trailing slash on the host
    // Chrome has it on the pathname
    if ( linkHost.indexOf('/') === -1 && _link.pathname.indexOf('/') !== 0) {
        linkHost += '/';
    }

    return _link.protocol+"//"+linkHost+_link.pathname+_link.search;
};


DataTable.ext.buttons.print = {
    className: 'buttons-print',

    text: function ( dt ) {
        return dt.i18n( 'buttons.print', 'Print' );
    },

    action: function ( e, dt, button, config ) {
        var data = dt.buttons.exportData(
            $.extend( {decodeEntities: false}, config.exportOptions ) // XSS protection
        );
        var exportInfo = dt.buttons.exportInfo( config );
        var columnClasses = dt
            .columns( config.exportOptions.columns )
            .flatten()
            .map( function (idx) {
                return dt.settings()[0].aoColumns[dt.column(idx).index()].sClass;
            } )
            .toArray();

        var addRow = function ( d, tag ) {
            var str = '<tr>';

            for ( var i=0, ien=d.length ; i<ien ; i++ ) {
                // null and undefined aren't useful in the print output
                var dataOut = d[i] === null || d[i] === undefined ?
                    '' :
                    d[i];
                var classAttr = columnClasses[i] ?
                    'class="'+columnClasses[i]+'"' :
                    '';

                str += '<'+tag+' '+classAttr+'>'+dataOut+'</'+tag+'>';
            }

            return str + '</tr>';
        };

        // Construct a table for printing
        var html = '<table class="'+dt.table().node().className+'">';

        html += '<thead>';
        
        // Adding logo to the page (repeats for every page while print)
        if(config.repeatingHead.logo) {
            var logoPosition = (['left','right','center'].indexOf(config.repeatingHead.logoPosition) > 0) ? config.repeatingHead.logoPosition : 'right';
            html += '<tr><th colspan="'+data.header.length+'" style="padding: 0;margin: 0;text-align: '+logoPosition+';"><img style="'+config.repeatingHead.logoStyle+'" src="'+config.repeatingHead.logo+'"/></th></tr>';
        }
        
        // Adding title (repeats for every page while print)
        if(config.repeatingHead.title) {
            html += '<tr><th colspan="'+data.header.length+'">'+config.repeatingHead.title+'</th></tr>';
        }
        
        if ( config.header ) {
            html += addRow( data.header, 'th' );
        }
        
        html += '</thead>';

        html += '<tbody>';
        for ( var i=0, ien=data.body.length ; i<ien ; i++ ) {
            html += addRow( data.body[i], 'td' );
        }
        html += '</tbody>';

        if ( config.footer && data.footer ) {
            html += '<tfoot>'+ addRow( data.footer, 'th' ) +'</tfoot>';
        }
        html += '</table>';

        // Open a new window for the printable table
        var win = window.open( '', '' );
        win.document.close();

        // Inject the title and also a copy of the style and link tags from this
        // document so the table can retain its base styling. Note that we have
        // to use string manipulation as IE won't allow elements to be created
        // in the host document and then appended to the new window.
        var head = '<title>'+exportInfo.title+'</title>';
        $('style, link').each( function () {
            head += _styleToAbs( this );
        } );

        try {
            win.document.head.innerHTML = head; // Work around for Edge
        }
        catch (e) {
            $(win.document.head).html( head ); // Old IE
        }

        // Inject the table and other surrounding information
        win.document.body.innerHTML =
            '<h1>'+exportInfo.title+'</h1>'+
            '<div>'+(exportInfo.messageTop || '')+'</div>'+
            html+
            '<div>'+(exportInfo.messageBottom || '')+'</div>';

        $(win.document.body).addClass('dt-print-view');

        $('img', win.document.body).each( function ( i, img ) {
            img.setAttribute( 'src', _relToAbs( img.getAttribute('src') ) );
        } );

        if ( config.customize ) {
            config.customize( win, config, dt );
        }

        // Allow stylesheets time to load
        var autoPrint = function () {
            if ( config.autoPrint ) {
                win.print(); // blocking - so close will not
                win.close(); // execute until this is done
            }
        };

        if ( navigator.userAgent.match(/Trident\/\d.\d/) ) { // IE needs to call this without a setTimeout
            autoPrint();
        }
        else {
            win.setTimeout( autoPrint, 1000 );
        }
    },

    title: '*',

    messageTop: '*',

    messageBottom: '*',
    
    repeatingHead: {},

    exportOptions: {},

    header: true,

    footer: false,

    autoPrint: true,

    customize: null
};


return DataTable.Buttons;
}));

Мои настройки кнопки такие, как показано

            buttons: [{
                extend: 'print',
                autoPrint: true,
                title: '',

                //For repeating heading.
                repeatingHead: {
                    logo: 'assets/dist/img/report-logo.png',
                    logoPosition: 'right',
                    logoStyle: '',
                    title: ''
                }
            }]

Я использую следующий подход, чтобы добавить css к моему предварительному просмотру печати

          customize: function (win) {
            $(win.document.body).find('table')
              .addClass('table-bordered');
           }

From Как добавить заголовок и заголовок изображения на все страницы при печати с использованием DataTable

вкладов, они указали, что вы можете добиться этого, добавив новый класс dt-print -таблицу в свою таблицу и добавьте стиль ниже в свой css файл, как показано ниже

@media print
{
html, body { height: auto; }
.dt-print-table, .dt-print-table thead, .dt-print-table th, .dt-print-table tr {border: 0 none !important;}
}

Как я могу добиться удаления рамки на изображении в моем файле машинописного текста, используя следующий подход

          customize: function (win) {
            $(win.document.body).find('table')
              .addClass('table-bordered');
       }