printreceipt.vue

<template>
	<div>
		<main-title>{{ message }}</main-title>
		<button @click="print">Print</button>
	</div>
</template>

<script>
	import MainTitle from "../../components/Title";
	let { remote } = require("electron");
	const { PosPrinter } = remote.require("electron-pos-printer");

	export default {
		components: { MainTitle },
		data() {
			return {
				message: "Printing Receipt...",
				printers: [],
				options: {
					preview: true, // Preview in window or print
					width: "250px", //  width of content body
					margin: "0 0 0 0", // margin of content body
					copies: 1, // Number of copies to print
					printerName: "Canon_MP250_series", // printerName: string, check it at webContent.getPrinters()
					timeOutPerLine: 400,
				},
			};
		},
		created() {
			this.getPrinters();
			this.getItems();
		},
		methods: {
			getPrinters() {
				let webContents = remote.getCurrentWebContents();
				let printers = webContents.getPrinters();

				this.printers = printers;
			},

			print() {
				let date = new Date();
				let today =
					date.getMonth() + "/" + date.getDate() + "/" + date.getFullYear();

				const dataToPrint = [
					{
						type: "text",
						value: "Department of Transportation",
						css: {
							"text-align": "center",
							"font-family": "sans-serif",
							"font-size": "10",
						},
					},
					{
						type: "text",
						value: "LAND TRANSPORTATION OFFICE",
						css: {
							"text-align": "center",
							"font-weight": "700",
							"font-family": "sans-serif",
							"margin-bottom": "5px",
						},
					},
					{
						type: "text",
						value: "East Avenue, Quezon City",
						css: {
							"text-align": "center",
							"font-family": "sans-serif",
							"font-size": "10",
						},
					},
					{
						type: "text",
						value: today,
						css: {
							"text-align": "center",
							"font-family": "sans-serif",
							"font-size": "10",
						},
					},
					{
						type: "text",
						value: "*** SALES INVOICE ***",
						css: {
							"text-align": "center",
							"font-family": "sans-serif",
							"font-size": "10",
							margin: "30px 0",
						},
					},
					{
						type: "table",
						style: {
							"text-align": "left",
						},
						tableBody: [
							[
								{
									type: "text",
									value: "Cost of Stickers",
									css: {
										"text-align": "left",
									},
								},
								{
									type: "text",
									value: "P 40.00",
									css: {
										"text-align": "right",
									},
								},
							],
							[
								{
									type: "text",
									value: "Legal Research Fund",
									css: {
										"text-align": "left",
									},
								},
								{
									type: "text",
									value: "P10.00",
									css: {
										"text-align": "right",
									},
								},
							],
							[
								{
									type: "text",
									value: "MVUC",
									css: {
										"text-align": "left",
									},
								},
								{
									type: "text",
									value: "P2500.00",
									css: {
										"text-align": "right",
									},
								},
							],
							[
								{
									type: "text",
									value: "Comp Fee",
									css: {
										"text-align": "left",
									},
								},
								{
									type: "text",
									value: "P200.00",
									css: {
										"text-align": "right",
									},
								},
							],
							[
								{
									type: "text",
									value: "TOTAL",
									css: {
										"text-align": "left",
									},
								},
								{
									type: "text",
									value: "P2,760.00",
									css: {
										"text-align": "right",
									},
								},
							],
						],
					},
				];
				PosPrinter.print(dataToPrint, this.options)
					.then(() => {
						this.message = "Get Receipt";
					})
					.catch((error) => {
						console.log(error);
					});
			},
		},
	};
</script>

WHere getItems() method is coming from?