RWPrint

RWPrint is a print library that decorate all templates of Primavera, you can customize footer, header and add custom styles providing a cdn(url) path or inline css.

Install

Yarn

yarn add @redwagon/rw-print

NPM

npm install -S @redwagon/rw-print

Usage

import { RwPrint } from '@redwagon/rw-print'

// some styles for the element (optional)

const rw = new RwPrint()

// you can use styles with css text or cdn 
const styles = {
    cssText:{
        header:{
            font-size: '10px';
        },
        table td: {
            boder: '1px solid gray' 
        }
    }
}

const styles = {
    cdn: 'https://cdn.primaverahealthcare.com/styles/css/print-patient.css'
}

const header = {
    title: 'Test for print header',
    logoUrl: 'https://cdn.primaverahealthcare.com/static/images/logo.svg'
}

const footer = {
    patientName: 'Nicolas Restrepo',
    printedBy: 'Rolian Ruiz',
    logoUrl: 'https://cdn.primaverahealthcare.com/static/images/logo.svg'
}

const config = {
    styles,
    header,
    footer
}
const template = document.getElementById('mytable'); //item in dom o template custom 

// opens the "print dialog" of your browser to print the element
rw.print(template, config )

API

Methods

constructor

The constructor supports an optional parent element (HTMLElement) where the printable element will be appended. Default value is window.document.body.

Example:

const rw = new RwPrint( document.getElementById('parent') )

Interfaces:

    interface IStyles {
        cssText?: string;
        cdn?: string;
    }

    interface IFooterData {
        printedBy: string;
        patientName?: string;
        logoUrl: string;
    }
    interface IHeaderData {
        title: string;
        logoUrl: string;
    }
    interface IConfig {
        styles?: IStyles;
        header?: IHeaderData;
        footer?: IFooterData;
    }

print

Function to print the current HTMLElement.

Params:

• el: The HTMLElement to print.
• config: Optional to configure styles, footer and header._
  • styles:
    • cssText: Optional CSS Text to add custom styles to the current element.
    • cdn: Optional CDN Styles in this cdn use css styles minified
  • header: Optional header config
    • title: Required title
    • logoUrl: Optional logoUrl from cdn
  • footer: Optional footer config
    • patientName: Optional patient name
    • printedBy: Required name of the user who printed document
    • logoUrl: Optional logoUrl from cdn
• callback: Optional callback function. Inside the callback it's necessary to call launchPrint(win) to trigger the printing.
  • win: Window reference.
  • doc: Document reference.
  • node: HTMLElement reference.
  • launchPrint(win): Function to trigger the printing on demand.

1. Basic example:

const rw = new RwPrint()

const styles = {
    cdn: 'https://cdn.primaverahealthcare.com/styles/css/print-patient.css'
}

const header = {
    title: 'Test for print header',
    logoUrl: 'https://cdn.primaverahealthcare.com/static/images/logo.svg'
}

const footer = {
    patientName: 'Nicolas Restrepo',
    printedBy: 'Rolian Ruiz',
    logoUrl: 'https://cdn.primaverahealthcare.com/static/images/logo.svg'
}

const config = {
    styles,
    header,
    footer
}
rw.print(document.getElementById('h1'), config)

getIFrame

Returns the current HTMLIFrameElement reference.

Events

const { contentWindow } = rw.getIFrame()

contentWindow.addEventListener('beforeprint', () => console.log('before print!'))
contentWindow.addEventListener('afterprint', () => console.log('after print!'))

License

MIT license