瀏覽代碼

feat: frappe.ui.Scanner

- Uses https://github.com/mebjas/html5-qrcode
- Supports a number of different formats including barcodes and qrcodes
- Simple and generic API
version-14
Faris Ansari 3 年之前
父節點
當前提交
bbcead50c1
共有 4 個檔案被更改,包括 94 行新增0 行删除
  1. +1
    -0
      frappe/public/js/desk.bundle.js
  2. +87
    -0
      frappe/public/js/frappe/scanner/index.js
  3. +1
    -0
      package.json
  4. +5
    -0
      yarn.lock

+ 1
- 0
frappe/public/js/desk.bundle.js 查看文件

@@ -103,3 +103,4 @@ import "./frappe/ui/datatable.js";
import "./frappe/ui/driver.js";
import "./frappe/ui/plyr.js";
import "./frappe/barcode_scanner/index.js";
import "./frappe/scanner";

+ 87
- 0
frappe/public/js/frappe/scanner/index.js 查看文件

@@ -0,0 +1,87 @@
frappe.provide("frappe.ui");

frappe.ui.Scanner = class Scanner {
constructor(options) {
this.dialog = null;
this.handler = null;
this.options = options;

if (!("multiple" in this.options)) {
this.options.multiple = false;
}
if (options.container) {
this.$scan_area = $(options.container);
this.scan_area_id = frappe.dom.set_unique_id(this.$scan_area);
}
if (options.dialog) {
this.dialog = this.make_dialog();
this.dialog.show();
}
}

scan() {
this.load_lib().then(() => this.start_scan());
}

start_scan() {
if (!this.handler) {
this.handler = new Html5Qrcode(this.scan_area_id);
}
this.handler
.start(
{ facingMode: "environment" },
{ fps: 10, qrbox: 250 },
(decodedText, decodedResult) => {
if (this.options.on_scan) {
this.options.on_scan(decodedResult);
}
if (!this.options.multiple) {
this.stop_scan();
}
},
errorMessage => {
// parse error, ignore it.
}
)
.catch(err => {
console.warn(errorMessage);
});
}

stop_scan() {
if (this.handler) {
this.handler.stop().then(() => {
this.$scan_area.empty();
});
}
}

make_dialog() {
let dialog = new frappe.ui.Dialog({
title: __("Scan QRCode"),
fields: [
{
fieldtype: "HTML",
fieldname: "scan_area"
}
],
on_page_show: () => {
this.$scan_area = dialog.get_field("scan_area").$wrapper;
this.$scan_area.addClass("barcode-scanner");
this.scan_area_id = frappe.dom.set_unique_id(this.$scan_area);
this.scan();
}
});
return dialog;
}

hide_dialog() {
this.dialog && this.dialog.hide();
}

load_lib() {
return frappe.require(
"/assets/frappe/node_modules/html5-qrcode/dist/html5-qrcode.min.js"
);
}
};

+ 1
- 0
package.json 查看文件

@@ -36,6 +36,7 @@
"frappe-gantt": "^0.5.0",
"fuse.js": "^3.4.6",
"highlight.js": "^10.4.1",
"html5-qrcode": "^2.0.11",
"jquery": "3.5.0",
"js-sha256": "^0.9.0",
"jsbarcode": "^3.9.0",


+ 5
- 0
yarn.lock 查看文件

@@ -2930,6 +2930,11 @@ hsla-regex@^1.0.0:
resolved "https://registry.yarnpkg.com/hsla-regex/-/hsla-regex-1.0.0.tgz#c1ce7a3168c8c6614033a4b5f7877f3b225f9c38"
integrity sha1-wc56MWjIxmFAM6S194d/OyJfnDg=

html5-qrcode@^2.0.11:
version "2.0.11"
resolved "https://registry.yarnpkg.com/html5-qrcode/-/html5-qrcode-2.0.11.tgz#2cc5f63e767be53dd6c6d56b6c4f180a12aa8075"
integrity sha512-cCrVOK2yJGPGSTjchqRhkBJIrxvojEwF/pDKLNxmTH1wiAsVc61ZnIqyApIVyNfn5dKRFax70Qpr7pZwbUNiUw==

http-cache-semantics@^4.0.0:
version "4.1.0"
resolved "https://registry.yarnpkg.com/http-cache-semantics/-/http-cache-semantics-4.1.0.tgz#49e91c5cbf36c9b94bcfcd71c23d5249ec74e390"


Loading…
取消
儲存