钜星新版审处方客户端初始提交

2021-12-09 14:51:57 +08:00
commit b432b8624f
36 changed files with 6053 additions and 0 deletions
--- a/src/views/list_printer.html
+++ b/src/views/list_printer.html
@ -0,0 +1,136 @@
+<!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) {
+        if (printer === defaultPrinter) {
+          html.push(`<a href="#" class="list-group-item list-group-item-action active" data-name="${printer}">
+                        <i class="bi bi-printer-fill"></i> &nbsp;${printer}
+                     </a>
+          `)
+          continue;
+        }
+        html.push(`<a href="#" class="list-group-item list-group-item-action" data-name="${printer}">
+                      <i class="bi bi-printer-fill"></i> &nbsp;${printer}
+                   </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>