2021-12-09 14:51:57 +08:00
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html>
|
|
|
|
|
<head>
|
|
|
|
|
<title>选择打印机</title>
|
|
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
|
|
|
|
|
<link href="../../node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet" />
|
|
|
|
|
<link href="../../node_modules/bootstrap-icons/font/bootstrap-icons.css" rel="stylesheet" />
|
|
|
|
|
</head>
|
|
|
|
|
<style>
|
|
|
|
|
html, body {
|
|
|
|
|
height: 100%;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.container-fluid {
|
|
|
|
|
height: 100%;
|
|
|
|
|
padding: 5% 0;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.list-group {
|
|
|
|
|
height: 80%;
|
|
|
|
|
overflow: auto;
|
|
|
|
|
margin-bottom: 10%;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.printer-btn-box {
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: flex-end;
|
|
|
|
|
padding: 0 3%;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.printer-btn {
|
|
|
|
|
width: 100%;
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: flex-end;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.active {
|
|
|
|
|
background-color: #c6c9ce !important;
|
|
|
|
|
border-color: #c6c9ce !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.printer-button {
|
|
|
|
|
width: 65px;
|
|
|
|
|
margin-right: 10px;
|
|
|
|
|
background-color: #4495ec !important;
|
|
|
|
|
border-color: #4495ec !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.printer-button:hover {
|
|
|
|
|
background-color: #4495ec !important;
|
|
|
|
|
border-color: #4495ec !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.cancel-button {
|
|
|
|
|
width: 65px;
|
|
|
|
|
color: #4495ec !important;
|
|
|
|
|
background-color: #fff !important;
|
|
|
|
|
border-color: #4495ec !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.cancel-button:hover {
|
|
|
|
|
color: #4495ec !important;
|
|
|
|
|
background-color: #fff !important;
|
|
|
|
|
border-color: #4495ec !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
</style>
|
|
|
|
|
|
|
|
|
|
<body>
|
|
|
|
|
<div class="container-fluid" id="div">
|
|
|
|
|
<div class="list-group">
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
<div class="printer-btn-box">
|
|
|
|
|
<div class="printer-btn">
|
|
|
|
|
<button type="button" class="btn btn-success printer-button">打印</button>
|
|
|
|
|
<button type="button" class="btn btn-danger cancel-button">取消</button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</body>
|
|
|
|
|
|
|
|
|
|
<script type="text/javascript">
|
|
|
|
|
window.$ = window.jQuery = require('jquery');
|
|
|
|
|
const ipcRenderer = require('electron').ipcRenderer;
|
|
|
|
|
|
|
|
|
|
let printData = {
|
|
|
|
|
printer: '',
|
|
|
|
|
pdf_url: ''
|
|
|
|
|
}
|
|
|
|
|
$(function () {
|
|
|
|
|
// 获取打印机数据,拼接打印机列表
|
|
|
|
|
ipcRenderer.on('printerData', function (event, json_data) {
|
|
|
|
|
let data = JSON.parse(json_data)
|
|
|
|
|
let defaultPrinter = data.defaultPrinter;
|
|
|
|
|
|
|
|
|
|
printData.pdf_url = data.pdf_url;
|
|
|
|
|
|
|
|
|
|
// 绘制页面
|
|
|
|
|
let html = [];
|
|
|
|
|
for (const printer of data.listPrinter) {
|
2022-08-11 11:25:49 +08:00
|
|
|
if (printer.name === defaultPrinter) {
|
|
|
|
|
html.push(`<a href="#" class="list-group-item list-group-item-action active" data-name="${printer.name}">
|
|
|
|
|
<i class="bi bi-printer-fill"></i> ${printer.name}
|
2021-12-09 14:51:57 +08:00
|
|
|
</a>
|
|
|
|
|
`)
|
|
|
|
|
continue;
|
|
|
|
|
}
|
2022-08-11 11:25:49 +08:00
|
|
|
html.push(`<a href="#" class="list-group-item list-group-item-action" data-name="${printer.name}">
|
|
|
|
|
<i class="bi bi-printer-fill"></i> ${printer.name}
|
2021-12-09 14:51:57 +08:00
|
|
|
</a>
|
|
|
|
|
`)
|
|
|
|
|
}
|
|
|
|
|
$(".list-group").html(html.join(''));
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
// 绑定列表点击事件
|
|
|
|
|
$(".list-group").on('click', 'a', function () {
|
|
|
|
|
$(".list-group a").removeClass('active');
|
|
|
|
|
$(this).addClass('active');
|
|
|
|
|
printData.printer = $(this).data('name');
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
// 绑定打印点击事件
|
|
|
|
|
$(".printer-button").click(function () {
|
|
|
|
|
let data = JSON.stringify(printData);
|
|
|
|
|
ipcRenderer.send('print', data)
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
// 绑定取消打印事件
|
|
|
|
|
$(".cancel-button").click(function () {
|
|
|
|
|
ipcRenderer.send('close_listPrinter');
|
|
|
|
|
})
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
</script>
|
