Vue-invoice NPM

vue-invoice

A simple, light and configurable Invoice component for Vue

Installation

npm install vue-invoice
yarn add vue-invoice

Demo

https://codesandbox.io/s/vue-invoice-3424y

Usage

Global registration

Import the component and register with vue. Ensure to add vuex store as options

import Vue from 'vue'
import Invoice from 'vue-invoice'

Vue.use(Invoice, { store } )

Sample

You can set any currency of your choice. it is set to USD by default There are different color variants. It can be set with the variant prop

<!--vue template-->
<template>
  <div id="app">
    <Invoice
      :company="company"
      :customer="customer"
      :invoice="invoice"
      :variant="1"
      currency="eur"
    />
  </div>
  </template>

Complete Props table

Props	Type	Content	Default	Required
variant	Integer	Color Variant id	1	No
currency	String	currency code	USD	No
company	Object	company name and address	undefined	Yes
customer	Object	customer name, company and email address	undefined	Yes
invoice	Object	invoice items, invoice id & due date	undefined	Yes