[controls] Barcode Control (#4335)

* [start] display barcode based on input

* [wip]

* [barcode] use set_value

* parse and set

* remove quagga

* [barcode] set in db

* [fix] set height

* cleanup

* remove from build.json, require instead

* [fix] declare JsBarcode global in .eslintrc
This commit is contained in:
Prateeksha Singh 2017-10-18 12:24:58 +05:30 committed by Rushabh Mehta
parent 3c8689e4a2
commit 1e253b9d13
10 changed files with 52 additions and 8 deletions

View file

@ -119,7 +119,6 @@
"getCookies": true,
"get_url_arg": true,
"QUnit": true,
"Snap": true,
"mina": true
"JsBarcode": true
}
}

View file

@ -96,7 +96,7 @@
"no_copy": 0,
"oldfieldname": "fieldtype",
"oldfieldtype": "Select",
"options": "Attach\nAttach Image\nButton\nCheck\nCode\nColor\nColumn Break\nCurrency\nData\nDate\nDatetime\nDynamic Link\nFloat\nFold\nHeading\nHTML\nImage\nInt\nLink\nLong Text\nPassword\nPercent\nRead Only\nSection Break\nSelect\nSmall Text\nTable\nText\nText Editor\nTime\nSignature",
"options": "Attach\nAttach Image\nBarcode\nButton\nCheck\nCode\nColor\nColumn Break\nCurrency\nData\nDate\nDatetime\nDynamic Link\nFloat\nFold\nHeading\nHTML\nImage\nInt\nLink\nLong Text\nPassword\nPercent\nRead Only\nSection Break\nSelect\nSmall Text\nTable\nText\nText Editor\nTime\nSignature",
"permlevel": 0,
"print_hide": 0,
"print_hide_if_no_value": 0,
@ -1364,7 +1364,7 @@
"issingle": 0,
"istable": 1,
"max_attachments": 0,
"modified": "2017-08-29 15:30:55.489568",
"modified": "2017-10-07 19:20:15.888708",
"modified_by": "Administrator",
"module": "Core",
"name": "DocField",

View file

@ -66,7 +66,7 @@ docfield_properties = {
allowed_fieldtype_change = (('Currency', 'Float', 'Percent'), ('Small Text', 'Data'),
('Text', 'Data'), ('Text', 'Text Editor', 'Code', 'Signature'), ('Data', 'Select'),
('Text', 'Small Text'))
('Text', 'Small Text'), ('Text', 'Data', 'Barcode'))
allowed_fieldtype_for_options_change = ('Read Only', 'HTML', 'Select',)

View file

@ -94,7 +94,7 @@
"no_copy": 0,
"oldfieldname": "fieldtype",
"oldfieldtype": "Select",
"options": "Attach\nAttach Image\nButton\nCheck\nCode\nColor\nColumn Break\nCurrency\nData\nDate\nDatetime\nDynamic Link\nFloat\nFold\nHeading\nHTML\nImage\nInt\nLink\nLong Text\nPassword\nPercent\nRead Only\nSection Break\nSelect\nSignature\nSmall Text\nTable\nText\nText Editor\nTime",
"options": "Attach\nAttach Image\nBarcode\nButton\nCheck\nCode\nColor\nColumn Break\nCurrency\nData\nDate\nDatetime\nDynamic Link\nFloat\nFold\nHeading\nHTML\nImage\nInt\nLink\nLong Text\nPassword\nPercent\nRead Only\nSection Break\nSelect\nSignature\nSmall Text\nTable\nText\nText Editor\nTime",
"permlevel": 0,
"print_hide": 0,
"print_hide_if_no_value": 0,
@ -1202,7 +1202,7 @@
"issingle": 0,
"istable": 1,
"max_attachments": 0,
"modified": "2017-07-06 17:24:03.665171",
"modified": "2017-10-11 06:45:20.172291",
"modified_by": "Administrator",
"module": "Custom",
"name": "Customize Form Field",

View file

@ -44,6 +44,7 @@ type_map = {
,'Attach Image':('text', '')
,'Signature': ('longtext', '')
,'Color': ('varchar', varchar_len)
,'Barcode': ('longtext', '')
}
default_columns = ['name', 'creation', 'modified', 'modified_by', 'owner',

View file

@ -52,7 +52,8 @@
"public/js/frappe/form/controls/button.js",
"public/js/frappe/form/controls/html.js",
"public/js/frappe/form/controls/heading.js",
"public/js/frappe/form/controls/autocomplete.js"
"public/js/frappe/form/controls/autocomplete.js",
"public/js/frappe/form/controls/barcode.js"
],
"js/dialog.min.js": [
"public/js/frappe/dom.js",

View file

@ -440,6 +440,9 @@ fieldset[disabled] .form-control {
top: 26px;
}
}
.barcode-wrapper {
text-align: center;
}
@media (min-width: 768px) {
.video-modal .modal-dialog {
width: 700px;

View file

@ -0,0 +1,34 @@
frappe.ui.form.ControlBarcode = frappe.ui.form.ControlData.extend({
make_wrapper() {
// Create the elements for barcode area
this._super();
let $input_wrapper = this.$wrapper.find('.control-input-wrapper');
this.barcode_area = $(`<div class="barcode-wrapper border"><svg height=80></svg></div>`);
frappe.require("assets/frappe/js/lib/JsBarcode.all.min.js", () => {
this.barcode_area.appendTo($input_wrapper);
});
},
parse(value) {
// Parse raw value
return this.get_barcode_html(value);
},
set_formatted_input(value) {
// Set values to display
const svg = value;
const barcode_value = $(svg).attr('data-barcode-value');
this.$input.val(barcode_value);
this.barcode_area.html(svg);
},
get_barcode_html(value) {
// Get svg
const svg = this.barcode_area.find('svg')[0];
JsBarcode(svg, value, {height: 40});
$(svg).attr('data-barcode-value', value);
return this.barcode_area.html();
}
});

File diff suppressed because one or more lines are too long

View file

@ -245,6 +245,10 @@ textarea.form-control {
}
}
.barcode-wrapper {
text-align: center;
}
@media (min-width: 768px) {
.video-modal .modal-dialog {
width: 700px;