@@ -45,6 +45,9 @@
+
+ {{thisQRInfo.uniqueID}}
+
{{thisQRInfo.departmentName}}
@@ -318,11 +321,10 @@
@* Submit and Reset Buttons *@
-
@@ -508,6 +510,10 @@
if (response.ok) {
// If the form submission was successful, display a success message
alert('Success!', 'Item form has been successfully submitted.', 'success');
+ const updatedItem = await response.json();
+ this.items.push(updatedItem);
+
+ this.fetchItem();
// Reset the form
this.resetForm();
@@ -569,16 +575,6 @@
else { return data }
}
},
- // {
- // "title": "Image",
- // "data": "imageProduct",
- // "render": function (data, type, full, meta) {
- // var image = `
- //
- // `;
- // return image;
- // },
- // },
{
"title": "Print",
"data": "uniqueID",
@@ -604,6 +600,8 @@
const data = this.data(); // Row data
const containerId = `qr${data.uniqueID}`;
const container = $(`#${containerId}`);
+ container.empty();
+ container.append(`${data.uniqueID}`);
// console.log(container[0]);
if (container) {
// Generate QR code only if not already generated
@@ -613,7 +611,7 @@
height: 150,
colorDark: "#000000",
colorLight: "#ffffff",
- correctLevel: QRCode.CorrectLevel.H
+ correctLevel: QRCode.CorrectLevel.M
});
}
});
@@ -643,7 +641,6 @@
}
if (imageSrc) {
- console.log(imageSrc);
self.printItem(itemId, imageSrc); // Call the print function with the itemId and imageSrc
} else {
console.error("Image source not found.");
@@ -669,6 +666,9 @@
}
this.items = await response.json();
+ if (this.itemDatatable) {
+ this.itemDatatable.clear().destroy();
+ }
this.initiateTable();
}
catch (error) {
@@ -753,24 +753,23 @@
this.productName = null;
this.imageProduct = null;
this.serialNumber = '';
- this.quantity = 0;
+ this.quantity = 1;
this.supplierName = null;
this.purchaseDate = null;
this.PO = null;
- this.currency = null;
- this.DefaultPrice = null;
- this.currencyRate = null;
- this.convertPrice = null;
+ this.currency = 'MYR';
+ this.DefaultPrice = 0.01;
+ this.currencyRate = 1;
+ this.convertPrice = 0.01;
this.DODate = null;
- this.warranty = null;
+ this.warranty = 0;
this.EndWDate = null;
this.invoiceDate = null;
- this.selectedProduct = "";
- this.selectedSupplier = "";
- this.selectedCompany = "";
- this.selectedDepartment = "";
- this.currentUserCompanyDept = null;
- this.selectedTeamType = "";
+ this.selectedProduct = '';
+ this.selectedSupplier = '';
+ this.selectedCompany = this.currentUserCompanyDept.companyId;
+ this.selectedDepartment = '';
+ this.selectedTeamType = '';
},
// FRONT END FUNCTIONS
@@ -835,33 +834,6 @@
this.loading = false;
}
},
- async generateItemQr(itemId) {
- try {
- // Clear any existing QR code in the container
- const container = document.getElementById(QrContainer);
- if (!container) {
- console.error(`Container with ID ${containerId} not found.`);
- return;
- }
- // Clear any existing QR code in the container
- container.innerHTML = '';
-
- // Generate the QR code
- new QRCode(container, {
- text: itemId,
- width: 128,
- height: 128,
- colorDark: "#000000",
- colorLight: "#ffffff",
- correctLevel: QRCode.CorrectLevel.H
- });
-
- }
- catch (error) {
- console.error("Error generating QR code:", error);
- alert("An error occurred while generating the QR code.");
- }
- },
async printItem(itemId, imgSrc) {
try {
this.thisQRInfo.uniqueID = itemId;
@@ -875,7 +847,7 @@
// Safely set image content
const sanitizedImgSrc = encodeURI(imgSrc); // Sanitize the URL
- container.innerHTML = `

`;
+ container.innerHTML = `

`;
// Fetch QR information
const qrInfo = this.getPrintedQR(uniqueQR);
@@ -884,7 +856,9 @@
return;
}
- this.thisQRInfo = qrInfo; // Save the QR info to a property
+ this.thisQRInfo = qrInfo;
+ this.thisQRInfo.imgSrc = sanitizedImgSrc
+ this.thisQRInfo.imgContainer = container.innerHTML
$(`#QrItemModal`).modal('show'); // Show modal
}
catch (error) {
@@ -959,79 +933,83 @@
// }
// }
// },
- printQRInfo() {
- // Create a virtual DOM element
- const virtualElement = document.createElement('div');
- virtualElement.style.width = '500px'; // Set dimensions
- virtualElement.style.height = 'auto';
- virtualElement.style.position = 'absolute';
- virtualElement.style.left = '-9999px'; // Position offscreen
+ printQRInfo() {
+ // Create a virtual DOM element
+ const virtualElement = document.createElement('div');
+ virtualElement.style.width = '340px '; // Match label size for 2 inches at 203 DPI
+ virtualElement.style.height = '180px';
+ virtualElement.style.position = 'absolute';
+ virtualElement.style.left = '-9999px'; // Position offscreen to avoid rendering on the main UI
+ // virtualElement.style.border = '1px solid #000'; // Optional: Add a border for debugging dimensions
- // Populate the virtual DOM with content
- virtualElement.innerHTML = `
-
-
-
-
-
-
-
${this.thisQRInfo.uniqueID}
+ // Populate the virtual DOM with content
+ virtualElement.innerHTML = `
+
+
+
+
+
+
${this.thisQRInfo.imgContainer}
+
+
+
+
+
+
${this.thisQRInfo.uniqueID}
+
${this.thisQRInfo.departmentName}
+
${this.thisQRInfo.productName}
+
${this.thisQRInfo.endWDate}
+
+
-
-
-
${this.thisQRInfo.departmentName}
-
${this.thisQRInfo.productName}
-
${this.thisQRInfo.endWDate}
-
-
-
- `;
+ `;
- // Append the virtual DOM to the body (temporarily)
- document.body.appendChild(virtualElement);
+ // Append the virtual DOM to the body (temporarily)
+ document.body.appendChild(virtualElement);
- // Use html2canvas to convert the virtual DOM to an image
- html2canvas(virtualElement, {
- scale: 10, // Increase scale for sharper image
- useCORS: true,
- allowTaint: true,
- }).then((canvas) => {
- // Convert the canvas to an image
- const imgData = canvas.toDataURL('image/png');
+ // Wait for the font to be loaded (important for custom fonts like OCR-A)
+ document.fonts.load('1em "OCR A"').then(() => {
+ // Use html2canvas to convert the virtual DOM to an image
+ html2canvas(virtualElement, {
+ scale: 1, // Increase scale for sharper images
+ }).then((canvas) => {
+ // Convert the canvas to an image
+ const imgData = canvas.toDataURL('image/png');
- // Use printJS to print the image
- printJS({
- printable: imgData,
- type: 'image',
- css: '/../lib/bootstrap/dist/css/bootstrap.css',
- style: `
- @@media print {
- @@page {
- margin-top: 15px;
- margin-bottom: 15px;
- }
- body { margin: 0; }
- img {
- display: block;
- margin: auto;
- width: auto;
- max-width: 100%;
- height: auto;
- max-height: 100vh;
- }
- }
- `
+ // Open the image in a new tab for preview (optional)
+ const newWindow = window.open();
+ newWindow.location.href = imgData;
+ console.log(imgData)
+ // Use printJS to print the image
+ printJS({
+ printable: imgData,
+ type: 'image',
+ css: '/../lib/bootstrap/dist/css/bootstrap.css',
+ style: `
+ @@media print {
+ @@page {
+ margin: 2px;
+ }
+ body { margin: 0; }
+ }
+ `
+ });
+
+ // Remove the virtual DOM from the body after use
+ document.body.removeChild(virtualElement);
+ }).catch((error) => {
+ console.error("Error generating image:", error);
+ // Remove the virtual DOM if an error occurs
+ document.body.removeChild(virtualElement);
+ });
+ }).catch((error) => {
+ console.error("Error loading font:", error);
+ // Remove the virtual DOM if font loading fails
+ document.body.removeChild(virtualElement);
});
+ },
- // Remove the virtual DOM from the body after use
- document.body.removeChild(virtualElement);
- }).catch((error) => {
- console.error("Error generating image:", error);
- // Remove the virtual DOM if an error occurs
- document.body.removeChild(virtualElement);
- });
- },
},
});
diff --git a/Areas/Inventory/Views/Main/ManifacturerRegistration.cshtml b/Areas/Inventory/Views/Main/ManifacturerRegistration.cshtml
index e2f2401..c0de4db 100644
--- a/Areas/Inventory/Views/Main/ManifacturerRegistration.cshtml
+++ b/Areas/Inventory/Views/Main/ManifacturerRegistration.cshtml
@@ -15,7 +15,7 @@
Loading...
-
+