Merge pull request #210 from LD-Reborn/209-feature-add-more-barcode-qrcode-types

Added different barcodes

src/Views/Home/Assets.cshtml

@@ -2,8 +2,10 @@
 @using Berufsschule_HAM.Models
 @model HomeIndexViewModel
 @inject IViewLocalizer T
+@inject IConfiguration Configuration
 @{
     ViewData["Title"] = T["Assets"];
+    string barcodeType = Configuration["BarcodeType"] ?? "EAN13";
 }
 <link href="https://cdn.jsdelivr.net/npm/tom-select/dist/css/tom-select.bootstrap5.min.css" rel="preload" as="style" onload="this.onload=null;this.rel='stylesheet'"/>
 <script src="https://cdn.jsdelivr.net/npm/tom-select/dist/js/tom-select.complete.min.js" defer></script>
@@ -672,7 +674,7 @@ function registerRowDetailviewClick(row) {
                 <div class="row g-3">
                     <h6 class="fw-bold">@T["Barcode"]</h6>
                     <div class="col-md-6">
-                        <svg id="ean13" class="form-control" name="Barcode" />
+                        <svg id="@barcodeType" class="form-control" name="Barcode" />
                     </div>
                     <div class="col-md-6">
                         <button id="downloadBtn" class="form-control my-2 btn btn-primary">@T["Download Barcode"]</button>
@@ -749,15 +751,15 @@ function registerRowDetailviewClick(row) {
                 </div>` : ''}
             </div>`;
             viewContent.innerHTML = html;
-            JsBarcode("#ean13", idToEAN13(asset.Cn), {
+            JsBarcode("#@barcodeType", getBarcodeValue("@barcodeType", asset.Cn), {
-                format: "EAN13",
+                format: "@barcodeType",
                 lineColor: "#000",
                 width: 2,
                 height: 80,
                 displayValue: true
             });
             document.getElementById("downloadBtn").addEventListener("click", () => {
-                downloadBarcode("ean13", idToEAN13(asset.Cn));                    
+                downloadBarcode("@barcodeType", getBarcodeValue("@barcodeType", asset.Cn));                    
             });
             document.getElementById("printBtn").addEventListener("click", () => {
                 addAssetIdToBatch(asset.Cn);

src/Views/Home/Inventory.cshtml

@@ -2,8 +2,10 @@
 @using Berufsschule_HAM.Models
 @model HomeIndexViewModel
 @inject IViewLocalizer T
+@inject IConfiguration Configuration
 @{
     ViewData["Title"] = T["Inventory"];
+    string barcodeType = Configuration["BarcodeType"] ?? "EAN13";
 }
 <link href="https://cdn.jsdelivr.net/npm/tom-select/dist/css/tom-select.bootstrap5.min.css" rel="preload" as="style" onload="this.onload=null;this.rel='stylesheet'"/>
 <script src="https://cdn.jsdelivr.net/npm/tom-select/dist/js/tom-select.complete.min.js" defer></script>
@@ -72,7 +74,34 @@
 
         async function onScanSuccess(decodedText, decodedResult) {
             const rawDecoded = decodedText;
-            decodedText = decodedText.substr(0,11).replace(/^0+/, '');
+            const BARCODE_TYPE = "@barcodeType";
+            switch (BARCODE_TYPE.toUpperCase()) {
+                case "EAN13":
+                    decodedText = decodedText.substr(0, 11);
+                    break;
+                case "EAN8":
+                    decodedText = decodedText.substr(0, 6);
+                    break;
+                case "UPC":
+                    decodedText = decodedText.substr(0, 10);
+                    break;
+                case "ITF14":
+                    decodedText = decodedText.substr(0, 12);
+                    break;
+                case "MSI10":
+                    decodedText = decodedText.slice(0,-1);
+                    break;
+                case "MSI11":
+                    decodedText = decodedText.slice(0,-1);
+                    break;
+                case "MSI1010":
+                    decodedText = decodedText.slice(0,-2);
+                    break;
+                case "MSI1110":
+                    decodedText = decodedText.slice(0,-1);
+                    break;
+            }
+            decodedText = decodedText.replace(/^0+/, '');
             console.log(`Code matched = ${decodedText}`, decodedResult);
             document.getElementById("barcodeInput").value = decodedText;
 
@@ -105,7 +134,7 @@
                     <div class="row g-3">
                         <h6 class="fw-bold">@T["Barcode"]</h6>
                         <div class="col-md-6">
-                            <svg id="ean13" class="form-control" name="Barcode" />
+                            <svg id="@barcodeType" class="form-control" name="Barcode" />
                         </div>
                         <div class="col-md-6">
                             <button id="downloadBtn" class="form-control my-2 btn btn-primary">@T["Download Barcode"]</button>
@@ -184,15 +213,15 @@
 
                 viewContent.innerHTML = html;
                 console.log(rawDecoded);
-                JsBarcode("#ean13", idToEAN13(decodedText), {
+                JsBarcode("#@barcodeType", getBarcodeValue("@barcodeType", decodedText), {
-                    format: "EAN13",
+                    format: "@barcodeType",
                     lineColor: "#000",
                     width: 2,
                     height: 80,
                     displayValue: true
                 });
 
-                document.getElementById("downloadBtn").addEventListener("click", () => downloadBarcode("ean13", decodedText));
+                document.getElementById("downloadBtn").addEventListener("click", () => downloadBarcode("@barcodeType", decodedText));
                 document.getElementById("printBtn").addEventListener("click", () => {
                     addAssetIdToBatch(asset.Cn);
                     showToast("@T["Successfully added barcode to print batch"]", "success");

src/Views/Shared/_Batch.cshtml

@@ -1,6 +1,9 @@
 @using Microsoft.AspNetCore.Mvc.Localization
 @inject IViewLocalizer T
-
+@inject IConfiguration Configuration
+@{
+    string barcodeType = Configuration["BarcodeType"] ?? "EAN13";
+}
 
 <!-- Print Modal -->
 <div class="modal fade" id="printModal" tabindex="-1" aria-labelledby="printModalLabel" aria-hidden="true">
@@ -17,6 +20,7 @@
 </div>
 
 <script>
+    const BARCODE_TYPE = '@barcodeType';
     const printModal = document.getElementById('printModal');
     printModal.addEventListener('show.bs.modal', async () => {
         var assetIds = getAssetIdsFromBatch();
@@ -198,8 +202,8 @@
                 cell.appendChild(svg);
 
                 grid.appendChild(cell);
-                JsBarcode(svg, idToEAN13(asset.Cn), {
+                JsBarcode(svg, getBarcodeValue(BARCODE_TYPE, asset.Cn), {
-                    format: "EAN13",
+                    format: BARCODE_TYPE,
                     lineColor: "#000",
                     width: isMobileM ? 1 : (isMobileS ? 0.5 : 2),
                     height: isMobileM ? 20 : (isMobileS ? 20 : 40),
@@ -389,8 +393,8 @@
                 grid.appendChild(cell);
 
                 // Generate barcode
-                printWindow.JsBarcode(`#barcode_${i}`, idToEAN13(asset.Cn), {
+                printWindow.JsBarcode(`#barcode_${i}`, getBarcodeValue(BARCODE_TYPE, asset.Cn), {
-                    format: "EAN13",
+                    format: BARCODE_TYPE,
                     lineColor: "#000",
                     width: 2,
                     height: 50,

src/appsettings.json

@@ -16,6 +16,7 @@
         "Application": "Berufsschule_HAM"
     }
   },
+  "BarcodeType": "itf",
   "Elmah": {
       "AllowedHosts": [
         "127.0.0.1",

src/wwwroot/js/site.js

@@ -85,9 +85,53 @@ function printBarcode(svgId) {
     printWindow.close();
 }
 
-function idToEAN13(id) {
+function getBarcodeValue(BARCODE_TYPE, assetId) {
-    const padded = id.toString().padStart(12, "0"); // 12 digits
+    if (!assetId) return "";
-    return padded;
+    const type = BARCODE_TYPE.toUpperCase();
+
+    if (type === "EAN13") {
+        let numeric = assetId.replace(/\D/g, "");
+        if (numeric.length < 12) {
+            numeric = numeric.padStart(12, "0");
+        } else if (numeric.length > 12) {
+            numeric = numeric.slice(0, 12);
+        }
+        return numeric;
+    } else if (type === "EAN8") {
+        let numeric = assetId.replace(/\D/g, "");
+        if (numeric.length < 7) {
+            numeric = numeric.padStart(7, "0");
+        } else if (numeric.length > 7) {
+            numeric = numeric.slice(0, 7);
+        }
+        return numeric;
+    } else if (type === "UPC") {
+        let numeric = assetId.replace(/\D/g, "");
+        if (numeric.length < 11) {
+            numeric = numeric.padStart(11, "0");
+        } else if (numeric.length > 11) {
+            numeric = numeric.slice(0, 11);
+        }
+        return numeric;
+    } else if (type === "ITF14") {
+        let numeric = assetId.replace(/\D/g, "");
+        if (numeric.length < 13) {
+            numeric = numeric.padStart(13, "0");
+        } else if (numeric.length > 13) {
+            numeric = numeric.slice(0, 13);
+        }
+        return numeric;
+    } else if (type === "PHARMACODE") {
+        let numeric = assetId.replace(/\D/g, "");
+        if (numeric.length < 2) {
+            numeric = numeric.padStart(6, "0");
+        } else if (numeric.length > 6) {
+            numeric = numeric.slice(0, 6);
+        }
+        return numeric;
+    }
+
+    return assetId.toString().padStart(12, "0");
 }
 
 // Table filter