dear anyone has an update on this
Just throwing it out there.
I made something like this and added to the Item dashboard section. It uses the same JS library that frappe uses, lindell/JsBarcode to render EAN13 barcodes. To download the label, I used tsayen/dom-to-image. So apparently, generating images won’t work on Safari or IE.
I also added a menu item to generate valid EAN13 barcodes by hashing the item_code. I hope I’m not breaking any laws generating pseudo random EAN13 codes.
!
5 Likes
Looks good @sunhoww
Would you mind giving us a step by step on this ?
Especially on how you created the menu item to generate Valid EAN13 barcodes
Regards
1 Like
This is excellent. You captured all relevant information in the print format. Thank you.
To render the label,
- I created an HTML template along with some CSS styles in the same repo
- Fetch barcode data from a whitelisted python method
Everything else is pretty much here
1 Like
Another older barcode related thread
You might want to refer to https://erpnext.com/docs/user/manual/en/customize-erpnext/custom-scripts to know more about how custom scripts are run.
This is for new user in erpnext how to generate barcode and print it…
Using JsBarcode
→ write below code to custom script ( Settings → Custome script)
→ create Print Format (write HTML and css in print format)
3 Likes
Hi all
The barcode looks great
I have a query
How do i generate a valid Barcode
Does a bar code scanner scan both Ean and Upc-a in India or is there any specific for the country
anybody can provide a step by step help to implement it
the above code shown is in a image format, cant copy that code
Please help
Regards
Krishnan Hemanth
would you please share the text for those, as we are all here new users…
I can manage to write it, but it might not work if i forget a brace or a semicolon…
also what is after else in the first photo??
Thanks
Hi @michaeleino @krishnanhemanth plz find below code for barcode generate…that i share in image!!, now i m trying to another way generate barcode once it complete i will share… Thank u…
Settings → Custom Script → Item-Client
frappe.ui.form.on('Item','validate', function(frm) {
var cur_doc = frm.doc;
frappe.model.set_value(cur_doc.doctype, cur_doc.name, "custom_bar_code", cur_doc.item_code);
if (cur_doc.custom_barcode_gener === 0) {
if(cur_doc.custom_bar_code){
$(frm.fields_dict['custom_barcode_image'].wrapper).html('<svg id="code128"></svg>');
$.getScript("/assets/frappe/js/lib/JsBarcode.all.min.js", function( data, textStatus, jqxhr ) {
JsBarcode("#code128", cur_doc.custom_bar_code, {
height: 40,
width: 2,
fontSize: 11,
flat: true,
background: "#FFFFFF"
});
var svg = $('#code128').parent().html();
frappe.model.set_value(cur_doc.doctype, cur_doc.name, "custom_barcode_svg", svg);
frappe.model.set_value(cur_doc.doctype, cur_doc.name, "custom_barcode_gener", 1);
cur_frm.save();
});
} else
{
frappe.msgprint(__("Eles Please enter Barcode to to be printed"));
}
}
})
Create Custom field → Settings → Customize Form
Create Print Format → Settings → Print Format → New Print format
HTML
<div class="dashboard-section">
<div class="barcode-label-container">
<div id="barcode-label" class="barcode-label">
<div class="barcode-header">RS Super Market</div>
<div class="barcode-text">
<span class="barcode-strong">{{ doc.item_name }}</span>
</div>
<div class="barcode-area">{{ doc.custom_barcode_svg }}</div>
<div class="barcode-foot barcode-strong barcode-rotated">
Sh.{{ doc.standard_rate }}
</div>
</div>
</div>
</div>
CSS
.dashboard-section {
display: flex;
flex-flow: row nowrap;
align-items: flex-end;
}
.dashboard-section > button {
margin-left: 10px;
}
.barcode-label-container {
border: 1px solid #d1d8dd;
width: fit-content;
overflow: hidden;
}
.barcode-label {
background-color: #ffffff;
color: #000000;
box-sizing: border-box;
height: 34mm;
width: 64mm;
padding: 1.5mm;
display: grid;
grid-template-columns: 1fr 6mm;
grid-template-rows: 4mm 1fr 17.5mm;
grid-template-areas: 'header footer' 'text footer' 'barcode footer';
font-family: monospace;
font-size: 8pt;
line-height: 1.2;
text-align: center;
}
.barcode-rotated {
line-height: 6mm;
transform: translate(calc(-12.5mm), 0) rotate(-90deg);
transform-origin: center center;
height: 6mm;
width: calc(31mm);
}
.barcode-header {
grid-area: header;
text-transform: uppercase;
}
.barcode-text {
grid-area: text;
height: calc(28.8pt);
overflow-y: hidden;
align-self: center;
}
.barcode-area {
grid-area: barcode;
align-self: center;
}
.barcode-foot {
grid-area: footer;
font-size: 1.4em;
align-self: center;
}
.barcode-strong {
font-weight: bold;
}
6 Likes
image. Screenshot%20from%202020-04-09%2017-52-57|690x123
edit:
Need to have an extra column in the barcodes sectionthat would display the barcode image.How do i go about customising?
Hi
I have tried to add this to v12, and followed all instructions step by step including reviewing your screenshots to ensure there are no mistakes, but this is not working when I create a new item.
Assuming I need to enter the item code, item name, item group and then some number in the item_barcode_gener field, the barcode should be generated. Am I right ?
Would love your guidance on this.
@danishaak No need to enter value in barcode_gener this value we set as 1 before form save please check script cur_frm.save()
And this value just for checking barcode already generated or not
Please share your script we will check…
What version is this for ?
ERPNext version12
Am trying it on 11 …not working
Is there anything stopping it from working on 12 ?