优化标签小票打印

This commit is contained in:
gyq 2024-06-24 16:43:54 +08:00
parent 408e0e44c4
commit 87627e7b35
13 changed files with 220 additions and 318 deletions

View File

@ -1,171 +1 @@
"use strict";
const path = require("path");
const electron = require("electron");
let win;
electron.app.whenReady().then(() => {
win = new electron.BrowserWindow({
title: "银收客",
width: 1024,
height: 768,
fullscreenable: true,
fullscreen: process.env.VITE_DEV_SERVER_URL ? false : true,
simpleFullscreen: true,
frame: process.env.VITE_DEV_SERVER_URL ? true : false,
webPreferences: {
// 集成网页和 Node.js也就是在渲染进程中可以调用 Node.js 方法
nodeIntegration: true,
contextIsolation: false
}
});
if (process.env.VITE_DEV_SERVER_URL) {
win.loadURL(process.env.VITE_DEV_SERVER_URL);
} else {
win.loadFile(path.resolve(__dirname, "../dist/index.html"));
}
electron.app.on("activate", () => {
if (electron.BrowserWindow.getAllWindows().length === 0) {
createWindow();
}
});
electron.ipcMain.on("quitHandler", (_, msg) => {
electron.app.quit();
});
electron.ipcMain.on("getPrintList", () => {
win.webContents.getPrintersAsync().then((res) => {
win.webContents.send("printList", res);
});
});
const printWin = new electron.BrowserWindow({
show: false,
width: 464,
height: 1726,
webPreferences: {
// 集成网页和 Node.js也就是在渲染进程中可以调用 Node.js 方法
nodeIntegration: true,
contextIsolation: false
}
});
if (process.env.VITE_DEV_SERVER_URL) {
printWin.loadFile(path.join(__dirname, "../public/print.html"));
} else {
printWin.loadFile(path.resolve(__dirname, "../dist/print.html"));
}
electron.ipcMain.on("printerInfoSync", (event, arg) => {
printWin.webContents.send("getParams", arg);
});
electron.ipcMain.on("printStart", (event, arg) => {
console.log(arg);
const _parmas = JSON.parse(arg);
let name = _parmas.deviceName;
printWin.webContents.print({
silent: true,
deviceName: name,
pageSize: {
width: 58e3,
height: 216e3
},
scaleFactor: 80,
landscape: false,
margins: {
marginType: "none",
top: 0,
bottom: 0,
left: 0,
right: 0
},
dpi: {
horizontal: 203,
vertical: 203
}
});
});
const workPrintWin = new electron.BrowserWindow({
show: false,
width: 464,
height: 1726,
webPreferences: {
nodeIntegration: true,
contextIsolation: false
}
});
if (process.env.VITE_DEV_SERVER_URL) {
workPrintWin.loadFile(path.join(__dirname, "../public/work_print.html"));
} else {
workPrintWin.loadFile(path.resolve(__dirname, "../dist/work_print.html"));
}
electron.ipcMain.on("printerWorkSync", (event, arg) => {
workPrintWin.webContents.send("getParams", arg);
});
electron.ipcMain.on("printWorkStart", (event, arg) => {
const _parmas = JSON.parse(arg);
let name = _parmas.deviceName;
workPrintWin.webContents.print({
silent: true,
deviceName: name,
pageSize: {
width: 58e3,
height: 216e3
},
scaleFactor: 80,
landscape: false,
margins: {
marginType: "none",
top: 0,
bottom: 0,
left: 0,
right: 0
},
dpi: {
horizontal: 203,
vertical: 203
}
});
});
const tagPrintWin = new electron.BrowserWindow({
show: false,
width: 320,
height: 240,
webPreferences: {
nodeIntegration: true,
contextIsolation: false
}
});
if (process.env.VITE_DEV_SERVER_URL) {
tagPrintWin.loadFile(path.join(__dirname, "../public/tag_print.html"));
} else {
tagPrintWin.loadFile(path.resolve(__dirname, "../dist/tag_print.html"));
}
electron.ipcMain.on("printerTagSync", (event, arg) => {
console.log(arg);
tagPrintWin.webContents.send("getParams", arg);
});
electron.ipcMain.on("printTagStart", (event, arg) => {
const _parmas = JSON.parse(arg);
let name = _parmas.deviceName;
tagPrintWin.webContents.print({
silent: true,
deviceName: name,
pageSize: {
width: 4e4,
height: 3e4
},
scaleFactor: 80,
landscape: false,
margins: {
marginType: "none",
top: 0,
bottom: 0,
left: 0,
right: 0
},
dpi: {
horizontal: 203,
vertical: 203
}
});
});
});
electron.app.on("window-all-closed", () => {
if (process.platform !== "darwin")
electron.app.quit();
});
"use strict";const i=require("path"),e=require("electron");let o;e.app.whenReady().then(()=>{o=new e.BrowserWindow({title:"银收客",width:1024,height:768,fullscreenable:!0,fullscreen:!process.env.VITE_DEV_SERVER_URL,simpleFullscreen:!0,frame:!!process.env.VITE_DEV_SERVER_URL,webPreferences:{nodeIntegration:!0,contextIsolation:!1}}),process.env.VITE_DEV_SERVER_URL?o.loadURL(process.env.VITE_DEV_SERVER_URL):o.loadFile(i.resolve(__dirname,"../dist/index.html")),e.app.on("activate",()=>{e.BrowserWindow.getAllWindows().length===0&&createWindow()}),e.ipcMain.on("quitHandler",(t,n)=>{e.app.quit()}),e.ipcMain.on("getPrintList",()=>{o.webContents.getPrintersAsync().then(t=>{o.webContents.send("printList",t)})});const a=new e.BrowserWindow({show:!1,width:464,height:1726,webPreferences:{nodeIntegration:!0,contextIsolation:!1}});process.env.VITE_DEV_SERVER_URL?a.loadFile(i.join(__dirname,"../public/print.html")):a.loadFile(i.resolve(__dirname,"../dist/print.html")),e.ipcMain.on("printerInfoSync",(t,n)=>{a.webContents.send("getParams",n)}),e.ipcMain.on("printStart",(t,n)=>{console.log(n);let r=JSON.parse(n).deviceName;a.webContents.print({silent:!0,deviceName:r,pageSize:{width:58e3,height:216e3},scaleFactor:80,landscape:!1,margins:{marginType:"none",top:0,bottom:0,left:0,right:0},dpi:{horizontal:203,vertical:203}})});const s=new e.BrowserWindow({show:!1,width:464,height:1726,webPreferences:{nodeIntegration:!0,contextIsolation:!1}});process.env.VITE_DEV_SERVER_URL?s.loadFile(i.join(__dirname,"../public/work_print.html")):s.loadFile(i.resolve(__dirname,"../dist/work_print.html")),e.ipcMain.on("printerWorkSync",(t,n)=>{s.webContents.send("getParams",n)}),e.ipcMain.on("printWorkStart",(t,n)=>{let r=JSON.parse(n).deviceName;s.webContents.print({silent:!0,deviceName:r,pageSize:{width:58e3,height:216e3},scaleFactor:80,landscape:!1,margins:{marginType:"none",top:0,bottom:0,left:0,right:0},dpi:{horizontal:203,vertical:203}})});const l=new e.BrowserWindow({show:!1,width:320,height:240,webPreferences:{nodeIntegration:!0,contextIsolation:!1}});process.env.VITE_DEV_SERVER_URL?l.loadFile(i.join(__dirname,"../public/tag_print.html")):l.loadFile(i.resolve(__dirname,"../dist/tag_print.html")),e.ipcMain.on("printerTagSync",(t,n)=>{console.log(n),l.webContents.send("getParams",n)}),e.ipcMain.on("printTagStart",(t,n)=>{console.log(n);let r=JSON.parse(n).deviceName;l.webContents.print({silent:!0,deviceName:r,pageSize:{width:4e4,height:3e4},scaleFactor:80,landscape:!1,margins:{marginType:"none",top:0,bottom:0,left:0,right:0},dpi:{horizontal:203,vertical:203}})})});e.app.on("window-all-closed",()=>{process.platform!=="darwin"&&e.app.quit()});

View File

@ -188,7 +188,7 @@ app.whenReady().then(() => {
// 执行标签小票的打印操作
ipcMain.on("printTagStart", (event, arg) => {
// console.log(arg);
console.log(arg);
const _parmas = JSON.parse(arg);
// console.log(_parmas)
let name = _parmas.deviceName;

View File

@ -1,7 +1,7 @@
{
"name": "vite-electron",
"private": true,
"version": "1.3.14",
"version": "1.3.18",
"main": "dist-electron/main.js",
"scripts": {
"dev": "chcp 65001 && vite",

View File

@ -15,9 +15,11 @@ body {
position: relative;
}
.print_view .ewm {
width: 50px;
height: 50px;
position: absolute;
top: 0;
right: 4px;
right: 0;
z-index: 99;
}
.print_view .header {

View File

@ -11,9 +11,12 @@ body {
.print_view {
position: relative;
.ewm {
$size: 50px;
width: $size;
height: $size;
position: absolute;
top: 0;
right: 4px;
right: 0;
z-index: 99;
}
.header {

View File

@ -2,7 +2,7 @@
<el-config-provider size="large">
<div class="container">
<div class="left" v-if="!hideLeftMenu">
<left-menu ref="leftMenuRef" />
<left-menu ref="leftMenuRef" @connectWsHandle="initWebSocket()" />
</div>
<div :class="{ view: !hideLeftMenu }">
<!-- <div class="wrapper">
@ -33,8 +33,10 @@ import { dayjs, ElMessage } from "element-plus";
import { ipcRenderer } from 'electron'
import { scanSendMessage } from '@/api/order/index'
import { useGlobal } from '@/store/global.js'
import { useSocket } from '@/store/socket.js'
const global = useGlobal()
const socketStore = useSocket()
const leftMenuRef = ref(null)
@ -184,21 +186,21 @@ function checkLabelPrint(props) {
let pids = printLabelList.value[0].config.categoryList.map(item => item.id)
let labelList = []
let count = 0
let sum = 0
// let count = 0
// let sum = 0
// props.carts.map(item => {
// if (pids.some(el => el == item.categoryId)) {
// for (let i = 0; i < item.number; i++) {
// sum++
// }
// }
// })
props.carts.map(item => {
if (pids.some(el => el == item.categoryId)) {
for (let i = 0; i < item.number; i++) {
sum++
}
}
})
props.carts.map(item => {
if (pids.some(el => el == item.categoryId)) {
for (let i = 0; i < item.number; i++) {
count++
// count++
labelList.push(
{
outNumber: props.outNumber,
@ -207,7 +209,7 @@ function checkLabelPrint(props) {
masterId: props.orderInfo.tableName,
deviceName: printLabelList.value[0].config.deviceName,
createdAt: dayjs(props.createdAt).format('YYYY-MM-DD HH:mm:ss'),
count: `${count}/${sum}`
// count: `${count}/${sum}`
}
)
}
@ -220,13 +222,15 @@ function checkLabelPrint(props) {
//
function printLabel(list) {
// console.log(list);
if (!checkLocalPrint(printLabelList.value[0].config.deviceName)) {
ElMessage.error("本地打印机无法使用,请检查打印机是否正确连接");
} else {
for (let i = 0; i <= list.length - 1; i++) {
// ipcRenderer.send('printerTagSync', JSON.stringify(list[i]))
setTimeout(() => {
ipcRenderer.send('printerTagSync', JSON.stringify(list[i]))
}, i * 1000)
}, i * 800)
}
}
}
@ -243,6 +247,8 @@ function initWebSocket(wsUrl = import.meta.env.VITE_API_WSS) {
ws.value.onopen = function () {
console.log('wss连接成功');
socketStore.changeOnline(true)
//
clearInterval(heartbeatTimer.value)
heartbeatTimer.value = null
@ -277,6 +283,7 @@ function initWebSocket(wsUrl = import.meta.env.VITE_API_WSS) {
//
ws.value.onerror = function () {
console.log("WebSocket连接发生错误");
socketStore.changeOnline(false)
//
clearInterval(heartbeatTimer.value)
@ -289,6 +296,7 @@ function initWebSocket(wsUrl = import.meta.env.VITE_API_WSS) {
//
ws.value.onclose = function (e) {
console.log('ws关闭了', e);
socketStore.changeOnline(false)
//
clearInterval(heartbeatTimer.value)

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.2 KiB

View File

@ -1,10 +1,17 @@
<template>
<div class="left_menu_wrap">
<div class="item online">
<div class="item" :class="{ online: socketStore.online }" @click="connectWsHandle">
<el-icon class="icon">
<Monitor />
</el-icon>
<el-text type="success">在线</el-text>
<el-text :type="socketStore.online ? 'success' : ''">
<template v-if="socketStore.online">
在线
</template>
<template v-else>
离线
</template>
</el-text>
</div>
<router-link class="item" :class="{ active: route.path == item.path }" v-for="item in menus" :key="item.path"
:to="item.path">
@ -29,9 +36,14 @@
<script setup>
import { ref } from 'vue'
import { useRoute } from 'vue-router'
import { useSocket } from '@/store/socket.js'
import more from '@/components/more.vue'
import callNumber from './callNumber.vue'
const emits = defineEmits(['connectWsHandle'])
const socketStore = useSocket()
const route = useRoute()
const moreref = ref(null)
const callNumberRef = ref(null)
@ -82,6 +94,12 @@ function openCall() {
callNumberRef.value.show()
}
// ws
function connectWsHandle() {
if (socketStore.online) return
emits('connectWsHandle')
}
defineExpose({
updateCallNumber
})

View File

@ -3,10 +3,38 @@ import { defineStore } from "pinia";
export const usePrint = defineStore({
id: "print",
state: () => ({
localDevices: [], // 本地打印机列表
deviceList: [], // 添加的打印机
data: "", // 要打印的数据
}),
actions: {
// 更新本地打印机列表
updateLocalDevice(list) {
this.localDevices = list;
},
// 更新已添加的打印机
updateDevice(list) {
this.deviceList = list;
},
// 检查本地打印机是否能正常使用
checkLocalPrint(deviceName) {
let print = "";
for (let item of this.localDevices) {
if (item.name == deviceName) {
print = item;
}
}
if (!print.name) {
return false;
} else {
return true;
}
},
// 执行打印操作
printHandle(state) {},
printHandle(state, type = "label") {
if (type == "label") {
}
},
},
});

14
src/store/socket.js Normal file
View File

@ -0,0 +1,14 @@
import { defineStore } from "pinia";
export const useSocket = defineStore({
id: "socket",
state: () => ({
online: false,
}),
actions: {
// 登录
changeOnline(state) {
this.online = state;
},
},
});

View File

@ -76,27 +76,32 @@
</div>
<div class="menu_wrap">
<div class="print_view">
<div class="title t1 blod">#A9 #A9</div>
<div class="row blod">
<span>甜橙马黛茶</span>
<span style="margin-left: 30px">1</span>
<canvas class="ewm" ref="canvasRef"></canvas>
<div class="header">
<img class="logo" src="../../assets/prinnt_label_logo.png" />
<!-- <span class="title">双屿Pisces</span> -->
</div>
<div class="row blod">加奶加珍珠</div>
<div class="row blod" style="margin-top: 10px">
<span>03-08 16:58</span>
<span style="margin-left: 30px">28</span>
<div class="number_wrap">
<div class="num" v-if="printData.outNumber">{{ printData.outNumber }}</div>
<div class="info" v-if="printData.masterId">座位号{{ printData.masterId }}</div>
</div>
<div class="btn_wrap">
<div class="btn">
<el-button plain style="width: 100%" @click="printHandle">
打印测试小票
</el-button>
</div>
<div class="btn">
<el-button type="primary" style="width: 100%" :loading="loading" @click="submitHandle">
保存
</el-button>
</div>
<div class="shop_info">
<div class="name">{{ printData.name }}</div>
<div class="text" v-if="printData.skuName">{{ printData.skuName }}</div>
</div>
<div class="time">{{ printData.createdAt }}</div>
<div class="tips">建议尽快享用风味更佳 {{ printData.count }}</div>
</div>
<div class="btn_wrap">
<div class="btn">
<el-button plain style="width: 100%" @click="printHandle">
打印测试小票
</el-button>
</div>
<div class="btn">
<el-button type="primary" style="width: 100%" :loading="loading" @click="submitHandle">
保存
</el-button>
</div>
</div>
</div>
@ -114,6 +119,7 @@ import { tbPrintMachinePost, tbPrintMachineDetail } from "@/api/device";
import { useUser } from "@/store/user.js";
import { Loading } from "element-plus/es/components/loading/src/service";
import classify from "@/components/classify/index.vue";
import QRCode from 'qrcode'
const store = useUser();
@ -145,6 +151,16 @@ const form = ref({
shopId: store.userInfo.shopId,
});
const canvasRef = ref(null)
const printData = ref({
deviceName: form.value.config.deviceName,
outNumber: '123',
name: '甜橙马黛茶',
skuName: '加奶、加珍珠',
masterId: '#A9',
createdAt: dayjs().format('YYYY-MM-DD HH:mm:ss')
})
//
function getPrintList() {
ipcRenderer.send("getPrintList");
@ -161,14 +177,7 @@ function printHandle() {
}
ipcRenderer.send(
"printerTagSync",
JSON.stringify({
deviceName: form.value.config.deviceName,
outNumber: '123',
name: '甜橙马黛茶',
skuName: '加奶、加珍珠',
masterId: '#A9',
createdAt: dayjs().format('YYYY-MM-DD HH:mm:ss')
})
JSON.stringify(printData.value)
);
}
@ -204,6 +213,11 @@ onMounted(() => {
if (route.query.id) {
tbPrintMachineDetailAjax(route.query.id);
}
QRCode.toCanvas(canvasRef.value, printData.value.outNumber, function (error) {
if (error) console.error(error)
console.log('success!');
})
});
</script>
@ -244,78 +258,59 @@ onMounted(() => {
padding: 0 15px;
.print_view {
position: relative;
.ewm {
$size: 50px;
width: $size;
height: $size;
position: absolute;
top: 0;
right: 0;
z-index: 99;
}
.header {
display: flex;
align-items: center;
.logo {
$size: 90px;
width: $size;
}
.title {
margin-left: 6px;
}
}
.number_wrap {
display: flex;
align-items: flex-end;
.num {
font-size: 18px;
font-weight: bold;
}
.info {
margin-left: 12px;
padding-bottom: 4px;
}
}
.time {
font-weight: bold;
}
}
.btn_wrap {
display: flex;
gap: 20px;
padding: 20px 0;
.blod {
font-weight: 600;
}
.title {
display: flex;
justify-content: center;
margin-bottom: 4px;
&.t1 {
font-size: 24px;
}
&.t2 {
margin-bottom: 15px;
}
}
.row {
margin-top: 2px;
&.between {
display: flex;
justify-content: space-between;
}
}
.btn_wrap {
display: flex;
gap: 20px;
padding: 20px 0;
.btn {
flex: 1;
}
}
.line {
margin: 10px 0;
border-bottom: 1px solid #ddd;
}
.table {
width: 100%;
tr {
width: 100%;
display: flex;
&:not(:last-child) {
margin-bottom: 10px;
}
td {
flex: 1;
&:nth-child(1) {
flex: 2;
}
&:not(:first-child) {
display: flex;
justify-content: flex-end;
}
.sku {
font-size: 14px;
}
}
}
.btn {
flex: 1;
}
}
}

View File

@ -169,27 +169,27 @@ function checkLocalPrint(deviceName) {
//
function checkLabelPrint(props) {
console.log(props);
// console.log(props);
if (!checkLocalPrint(printLabelList.value[0].config.deviceName)) {
ElMessage.error("本地打印机无法使用请检查打印机是否正确连接1");
} else {
let pids = printLabelList.value[0].config.categoryList.map(item => item.id)
let labelList = []
let count = 0
let sum = 0
// let count = 0
// let sum = 0
// props.carts.map(item => {
// if (pids.some(el => el == item.categoryId)) {
// for (let i = 0; i < item.number; i++) {
// sum++
// }
// }
// })
props.carts.map(item => {
if (pids.some(el => el == item.categoryId)) {
for (let i = 0; i < item.number; i++) {
sum++
}
}
})
props.carts.map(item => {
if (pids.some(el => el == item.categoryId)) {
for (let i = 0; i < item.number; i++) {
count++
// count++
labelList.push(
{
outNumber: props.outNumber,
@ -198,7 +198,7 @@ function checkLabelPrint(props) {
masterId: props.orderInfo.tableName,
deviceName: printLabelList.value[0].config.deviceName,
createdAt: dayjs(props.createdAt).format('YYYY-MM-DD HH:mm:ss'),
count: `${count}/${sum}`
// count: `${count}/${sum}`
}
)
}
@ -210,17 +210,18 @@ function checkLabelPrint(props) {
}
//
const printLabel = (list) => {
const printLabel = _.throttle(function (list) {
if (!checkLocalPrint(printLabelList.value[0].config.deviceName)) {
ElMessage.error("本地打印机无法使用,请检查打印机是否正确连接");
} else {
for (let i = 0; i <= list.length - 1; i++) {
// ipcRenderer.send('printerTagSync', JSON.stringify(list[i]))
setTimeout(() => {
ipcRenderer.send('printerTagSync', JSON.stringify(list[i]))
}, i * 1000)
}, i * 800)
}
}
}
}, 1500, { leading: true, trailing: false })
//
async function printHandle() {

View File

@ -317,21 +317,21 @@ function checkLabelPrint(props) {
} else {
let pids = printLabelList.value[0].config.categoryList.map(item => item.id)
let labelList = []
let count = 0
let sum = 0
// let count = 0
// let sum = 0
// props.skuInfos.map(item => {
// if (pids.some(el => el == item.categoryId)) {
// for (let i = 0; i < item.num; i++) {
// sum++
// }
// }
// })
props.skuInfos.map(item => {
if (pids.some(el => el == item.categoryId)) {
for (let i = 0; i < item.num; i++) {
sum++
}
}
})
props.skuInfos.map(item => {
if (pids.some(el => el == item.categoryId)) {
for (let i = 0; i < item.num; i++) {
count++
// count++
labelList.push(
{
outNumber: props.outNumber,
@ -340,7 +340,7 @@ function checkLabelPrint(props) {
masterId: props.tableName,
deviceName: printLabelList.value[0].config.deviceName,
createdAt: dayjs(props.createAt).format('YYYY-MM-DD HH:mm:ss'),
count: `${count}/${sum}`
// count: `${count}/${sum}`
}
)
}
@ -355,10 +355,13 @@ const printLabel = lodash.throttle(function (list) {
if (!checkLocalPrint(printLabelList.value[0].config.deviceName)) {
ElMessage.error("本地打印机无法使用,请检查打印机是否正确连接");
} else {
console.log(list.length);
for (let i = 0; i <= list.length - 1; i++) {
// console.log(list[i]);
// ipcRenderer.send('printerTagSync', JSON.stringify(list[i]))
setTimeout(() => {
ipcRenderer.send('printerTagSync', JSON.stringify(list[i]))
}, i * 1000)
}, i * 800)
}
}
}, 1500, { leading: true, trailing: false })