Imfdj/electron-vue-printer

An electron-vue plugin, silent print pictures。electron-vue可静默打印图片插件。

electron-vue-printer

electron-vue 打印图片插件。使用非常简单，可静默打印图片。

Simple and easy silent print pictures for electron-vue plugin.

Features

• Silent print
• Ultra small
• Simple usage
• No other dependencies

Demo

vue-cli-plugin-electron-builder-print-demo Based on vue-cli-plugin-electron-builder.

Hint

• Electron version 4 is not supported

Installation

npm install electron-vue-printer -S
or
yarn add electron-vue-printer -S

Usage

index.vue -->
<template>
  <div class="index">
    <button @click="doPrint">doPrint</button>
    <electron-vue-printer
      ref="electronVuePrinter"
      :show="true"
      :silent="false"
    ></electron-vue-printer>
  </div>
</template>

<script>
import electronVuePrinter from 'electron-vue-printer'

export default {
  name: 'index',
  components: {
    electronVuePrinter
  },
  methods: {
    doPrint () {
      this.$refs.electronVuePrinter.print('https://cdn.pixabay.com/photo/2017/06/10/07/29/printer-2389244_960_720.png')
      // or base64
      // this.$refs.electronVuePrinter.print('data:image/png;base64,iVBORw0KGgoAAAANt7U2lJh......')
    }
  }
}
</script>

Configuration	Type	Default	Description
options	object		options.offsetX: number. Left the offset,default 0.
			options.offsetY: number. Top the offset,default 0.
			options.imageWidth: number. Width of picture.
			options.imageHeight: number. Height of picture.
rotateType	number	0	Image rotation direction. 0: normal;1: Clockwise;2: Counterclockwise;3: Upside down.
imgStyle	string		Customize image styles.Width and height can override options.imageWidth and options.imageHeight.Transform will cause rotateType to become invalid.
show	boolean	false	Whether to display preview.For debugging.
silent	boolean	false	Whether to enable silent printing.

Events	Description
webview-ready(webview)	The webview for the user to render the printed content is ready,And return the dom of the webview.
get-printer-list(data: Array)	Return printer list data.Maybe setPrinterName method can use it.
webview-render-begin	Print content starts to render.
webview-render-finish	The printed content is rendered.
start-printing(state: Boolean)	Start printing, and return whether to start printing normally.

Methods

• print([src,base64]:String) - Set print picture src(The absolute path of the local picture or the address of the online picture) or base64 to trigger print automatically.
• setPrinterName(name:String, callBack(err)) - Set the printer device name.If you don't want to use the default printer, you can use it.If err in callBack is not empty, it means the setting failed.

License

MIT