image: img/spreadsheet-templates-invoices.jpg folder: accounts-and-finance category: template

const config = {
    tabs: true,
    toolbar: true,
    worksheets: [{
        worksheetName: 'Provider',
        worksheetId: 'providers',
        tabs: true,
        columns: [{
                type: 'text',
                title: 'Name',
                width: '200px'
            },
            {
                type: 'notes',
                title: 'Location',
                width: '200px'
            },
            {
                type: 'image',
                title: 'Logo',
                width: '100px'
            },
        ],
        data: [
            {
                id: 1,
                data: [
                    'Adela Jerde',
                    '617 Rolfson Well\nNew Ila, SC 53246-3814'
                ]
            },
            {
                id: 2,
                data: [
                    'Mattie McGlynn',
                    '2089 Earnest Drive\nMartinehaven, NM 41139'
                ]
            },
            {
                id: 3,
                data: [
                    'Kiel Hilll Sr.',
                    '6690 Marc Terrace\nDeckowtown, MS 29018'
                ]
            },
            {
                id: 4,
                data: [
                    'Letitia Connelly',
                    '543 Padberg Roads\nNew Kellie, DE 49448'
                ]
            },
        ],
    },
    {
        worksheetName: 'Receiver',
        worksheetId: 'receivers',
        columns: [{
                type: 'text',
                title: 'Name',
                width: '200px'
            },
            {
                type: 'notes',
                title: 'Location',
                width: '200px'
            },
        ],
        data: [
            {
                id: 1,
                data: [
                    'Allie Vandervort',
                    '980 Medhurst Roads\nHeaneyport, AK 08314-5970'
                ]
            },
            {
                id: 2,
                data: [
                    'Claud Bahringer',
                    '36346 Feil Oval\nEast Carlosstad, IA 43675-5989'
                ]
            },
            {
                id: 3,
                data: [
                    'Gillian Hills',
                    '63146 Walsh Mount\nBennyville, MN 48399'
                ]
            },
            {
                id: 4,
                data: [
                    'Landen McGlynn',
                    '058 Caden Fork\nKautzerborough, DE 63385'
                ]
            },
            {
                id: 5,
                data: [
                    'Rashad Kovacek',
                    '3482 Ayana Greens\nEast Renehaven, CO 88507-2335'
                ]
            },
            {
                id: 6,
                data: [
                    'Willy Schultz',
                    '7240 Daniel Street\nEast Russellview, MD 76779'
                ]
            },
        ],
    },
    {
        worksheetName: 'Item',
        columns: [{
                type: 'record',
                title: 'Invoice',
                worksheetId: 'invoices',
            },
            {
                type: 'text',
                title: 'Name',
                width: '200px'
            },
            {
                type: 'text',
                title: 'Quantity',
                width: '120px'
            },
            {
                type: 'number',
                title: 'Price',
                mask: '$ #.##,00',
                width: '100px',
                decimal: ',',
                disabledMaskOnEdition: true
            },
            {
                type: 'number',
                title: 'Amount',
                mask: '$ #.##,00',
                width: '120px',
                decimal: ',',
                disabledMaskOnEdition: true,
            },
        ],
        data: [
            [
                '1',
                'Game A',
                '10',
                '30',
                '=C1*D1'
            ],
            [
                '3',
                'Graphics Card',
                '1',
                '500',
                '=C2*D2'
            ],
            [
                '3',
                'Gaming Keyboard',
                '1',
                '200',
                '=C3*D3'
            ],
            [
                '2',
                'Cooler',
                '2',
                '40',
                '=C4*D4'
            ],
            [
                '4',
                'Software B',
                '1',
                '20',
                '=C5*D5'
            ],
        ],
    },
    {
        worksheetName: 'Invoice',
        worksheetId: 'invoices',
        columns: [
            {
                type: 'autonumber',
                title: 'Identifier',
                width: '80px',
                readOnly: true
            },
            {
                type: 'record',
                title: 'Provider',
                worksheetId: 'providers',
                width: '120px',
                source: []
            },
            {
                type: 'record',
                title: 'Receiver',
                worksheetId: 'receivers',
                width: '120px',
                source: []
            },
            {
                type: 'notes',
                title: 'Ship to',
                width: '150px'
            },
            {
                type: 'calendar',
                title: 'Date',
                width: '100px'
            },
            {
                type: 'calendar',
                title: 'Due date',
                width: '100px'
            },
            {
                type: 'notes',
                title: 'Terms',
                width: '120px'
            },
            {
                type: 'notes',
                title: 'Notes',
                width: '120px'
            },
            {
                type: 'number',
                title: 'Shipping',
                mask: '$ #.##,00',
                width: '100px',
                decimal: ',',
                disabledMaskOnEdition: true,
            },
            {
                type: 'number',
                title: 'Tax',
                mask: '$ #.##,00',
                width: '100px',
                decimal: ',',
                disabledMaskOnEdition: true,
            }, {
                type: 'number',
                title: 'Discount',
                mask: '$ #.##,00',
                width: '100px',
                decimal: ',',
                disabledMaskOnEdition: true,
            },
        ],
        data: [
            {
                id: 1,
                data: [
                    '',
                    '3',
                    '3',
                    '',
                    '2021-06-09',
                    '2021-06-16',
                    'Agency: XXXXXXXXXX\nAccount: XXXXXXXX',
                    '',
                    '',
                    '30',
                    '5'
                ]
            },
            {
                id: 2,
                data: [
                    '',
                    '1',
                    '5',
                    '409 Arnold Landing\nWendellbury, MT 82352-2715',
                    '2021-02-01',
                    '2021-03-01',
                    'Agency: XXXXXXXXXX\nAccount: XXXXXXXX',
                    '',
                    '20',
                    '45',
                    '10'
                ]
            },
            {
                id: 3,
                data: [
                    '',
                    '1',
                    '6',
                    '1866 Rogelio Field\nDorianstad, LA 71707',
                    '2021-04-16',
                    '2021-04-26',
                    'Agency: XXXXXXXXXX\nAccount: XXXXXXXX',
                    '',
                    '0',
                    '60',
                    '0'
                ]
            },
            {
                id: 4,
                data: [
                    '',
                    '2',
                    '4',
                    '',
                    '2021-07-28',
                    '2021-07-30',
                    'Agency: XXXXXXXXXX\nAccount: XXXXXXXX',
                    '',
                    '',
                    '0',
                    '16'
                ]
            },
        ],
    }]
}