Skip to content

K
KGOrders
Commit 4dbb5392 by Mac Stephens
Options

asm block for addcolorrow updated to use native web core, minor bug fixes, fixed… 

asm block for addcolorrow updated to use native web core, minor bug fixes, fixed success and failure spacing issue and message issue on server
parent ad6c43d1
Showing with 299 additions and 202 deletions
kgOrdersClient/Utils.pas
...@@ -9,7 +9,7 @@ procedure ShowStatusMessage(const AMessage, AClass: string; const AElementId: st ...@@ -9,7 +9,7 @@ procedure ShowStatusMessage(const AMessage, AClass: string; const AElementId: st
procedure HideStatusMessage(const AElementId: string); procedure HideStatusMessage(const AElementId: string);
procedure ShowSpinner(SpinnerID: string); procedure ShowSpinner(SpinnerID: string);
procedure HideSpinner(SpinnerID: string); procedure HideSpinner(SpinnerID: string);
procedure ShowErrorModal(const msg: string); procedure ShowErrorModal(msg: string);
function CalculateAge(DateOfBirth: TDateTime): Integer; function CalculateAge(DateOfBirth: TDateTime): Integer;
function FormatPhoneNumber(PhoneNumber: string): string; function FormatPhoneNumber(PhoneNumber: string): string;
procedure ApplyReportTitle(CurrentReportType: string); procedure ApplyReportTitle(CurrentReportType: string);
...@@ -84,9 +84,8 @@ begin ...@@ -84,9 +84,8 @@ begin
end; end;
// The $IFNDEF WIN32 was recommended by Holger to deal with any modal issues // The $IFNDEF WIN32 was recommended by Holger to deal with any modal issues
procedure ShowErrorModal(const msg: string); procedure ShowErrorModal(msg: string);
begin begin
{$IFNDEF WIN32}
asm asm
var modal = document.getElementById('main_errormodal'); var modal = document.getElementById('main_errormodal');
var label = document.getElementById('main_lblmodal_body'); var label = document.getElementById('main_lblmodal_body');
...@@ -110,13 +109,9 @@ begin ...@@ -110,13 +109,9 @@ begin
var bsModal = new bootstrap.Modal(modal, { keyboard: false }); var bsModal = new bootstrap.Modal(modal, { keyboard: false });
bsModal.show(); bsModal.show();
end; end;
{$ENDIF}
end; end;
function CalculateAge(DateOfBirth: TDateTime): Integer; function CalculateAge(DateOfBirth: TDateTime): Integer;
var var
Today, BirthDate: TJSDate; Today, BirthDate: TJSDate;
......
kgOrdersClient/View.Main.pas
...@@ -101,7 +101,6 @@ begin ...@@ -101,7 +101,6 @@ begin
ShowForm(TFViewOrders); ShowForm(TFViewOrders);
lblAppTitle.Caption := 'Koehler-Gibson Orders'; lblAppTitle.Caption := 'Koehler-Gibson Orders';
lblVersion.Caption := 'v' + DMConnection.clientVersion; lblVersion.Caption := 'v' + DMConnection.clientVersion;
setActive('Orders'); setActive('Orders');
end; end;
......
kgOrdersClient/View.OrderEntryCorrugated.html
...@@ -220,7 +220,7 @@ ...@@ -220,7 +220,7 @@
<hr class="custom-hr"> <hr class="custom-hr">
<div class="row"> <div class="row">
<div class="col-auto"> <div class="col-auto">
<label for="wdbe_first_name" class="form-label mt-2">Loose:</label> <label for="wdbe_first_name" style="font-weight: 700; font-size: 15px;" class="form-label mt-2">Loose:</label>
<input type="checkbox" id="cbloose"> <input type="checkbox" id="cbloose">
<input id="edtloose" class="form-control input-sm" style="width: 150px"/> <input id="edtloose" class="form-control input-sm" style="width: 150px"/>
</div> </div>
...@@ -367,23 +367,18 @@ ...@@ -367,23 +367,18 @@
<div class="modal fade" id="confirmation_modal" tabindex="-1" aria-labelledby="confirmation_modal_label" aria-hidden="true"> <div class="modal fade" id="confirmation_modal" tabindex="-1" aria-labelledby="confirmation_modal_label" aria-hidden="true">
<div class="modal-dialog"> <div class="modal-dialog">
<div class="modal-content"> <div class="modal-content shadow-lg">
<div class="modal-header"> <div class="modal-header">
<h5 class="modal-title" id="confirmation_modal_label">Confirm</h5> <h5 class="modal-title" id="confirmation_modal_label">Confirm</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button> <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div> </div>
<div class="modal-body" id="modal_body"> <div class="modal-body fs-6 fw-bold" id="modal_body">
Are you sure you want to delete this order? Are you sure you want to delete this order?
</div> </div>
<div class="modal-footer"> <div class="modal-footer justify-content-center">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal" id= 'btn_confirm_cancel'>Cancel</button> <button type="button" class="btn btn-secondary me-3" data-bs-dismiss="modal" id="btn_confirm_cancel">Cancel</button>
<button type="button" class="btn btn-primary" data-bs-dismiss="modal" id="btn_confirm_delete">Delete</button> <button type="button" class="btn btn-primary" data-bs-dismiss="modal" id="btn_confirm_delete">Delete</button>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<style>
.modal-backdrop {
opacity: 0 !important;
}
</style>
kgOrdersClient/View.OrderEntryCorrugated.pas
...@@ -251,6 +251,7 @@ type ...@@ -251,6 +251,7 @@ type
mode: string; mode: string;
changed: boolean; changed: boolean;
notification: string; notification: string;
procedure RemoveColorRow(Sender: TObject);
//FJSONProc1: TJSONProc1; //FJSONProc1: TJSONProc1;
public public
class function CreateForm(AElementID, orderInfo, customerInfo, mode, info: string): TWebForm; class function CreateForm(AElementID, orderInfo, customerInfo, mode, info: string): TWebForm;
...@@ -485,7 +486,7 @@ begin ...@@ -485,7 +486,7 @@ begin
dtpApprovedDate.Date := 0; dtpApprovedDate.Date := 0;
edtOrderNum.Text := ''; edtOrderNum.Text := '';
EditMode(); EditMode();
ShowNotification('Success:Order Successfully Copied'); ShowNotification('Success: Order Successfully Copied');
window.scrollTo(0, 0); window.scrollTo(0, 0);
end; end;
...@@ -495,8 +496,16 @@ begin ...@@ -495,8 +496,16 @@ begin
document.getElementById('btn_confirm_cancel').innerText := 'Cancel'; document.getElementById('btn_confirm_cancel').innerText := 'Cancel';
document.getElementById('btn_confirm_delete').innerText := 'Delete'; document.getElementById('btn_confirm_delete').innerText := 'Delete';
asm asm
var confirmationModal = new bootstrap.Modal(document.getElementById('confirmation_modal'), { var modal = document.getElementById('confirmation_modal');
keyboard: false });
// Ensure modal is a direct child of <body> to avoid z-index/backdrop issues
if (modal && modal.parentNode !== document.body) {
document.body.appendChild(modal);
}
var confirmationModal = new bootstrap.Modal(modal, {
keyboard: false
});
confirmationModal.show(); confirmationModal.show();
end; end;
end; end;
...@@ -511,7 +520,7 @@ begin ...@@ -511,7 +520,7 @@ begin
if mode = 'EDIT' then if mode = 'EDIT' then
GenerateReportPDF GenerateReportPDF
else else
showNotification('Failure:Cannot Generate PDF when Adding an Order'); showNotification('Failure: Cannot Generate PDF when Adding an Order');
end; end;
procedure TFOrderEntryCorrugated.btn_confirm_deleteClick(Sender: TObject); procedure TFOrderEntryCorrugated.btn_confirm_deleteClick(Sender: TObject);
...@@ -521,7 +530,7 @@ begin ...@@ -521,7 +530,7 @@ begin
FViewMain.change := false; FViewMain.change := false;
if OrderID <> '' then if OrderID <> '' then
begin begin
FViewMain.ViewOrderEntryCorrugated(OrderID, '', 'EDIT', 'Failure:Changes Discarded'); FViewMain.ViewOrderEntryCorrugated(OrderID, '', 'EDIT', 'Failure: Changes Discarded');
end end
else else
FViewMain.ViewOrders(''); FViewMain.ViewOrders('');
...@@ -583,7 +592,6 @@ begin ...@@ -583,7 +592,6 @@ begin
mode := 'EDIT'; mode := 'EDIT';
console.log(jsObj); console.log(jsObj);
ShowNotification(string(jsObj.Properties['status'])); ShowNotification(string(jsObj.Properties['status']));
end; end;
procedure TFOrderEntryCorrugated.DelOrder(); procedure TFOrderEntryCorrugated.DelOrder();
...@@ -619,59 +627,80 @@ begin ...@@ -619,59 +627,80 @@ begin
); );
end; end;
procedure TFOrderEntryCorrugated.addColorRow(num: string; Color: string; LPI: string; Size: string);
// Java script code to add a row of colors when a button is clicked procedure TFOrderEntryCorrugated.addColorRow(num, color, LPI, size: string);
// all variables are information to be placed in the boxes when loading an order. var
// TODO: convert to Delphi container, newRow, col, labelEl, inputEl, removeCol: TJSHTMLElement;
removeBtn: TWebButton;
values: array[0..3] of string;
labels: array[0..3] of string;
i: Integer;
begin begin
asm container := TJSHTMLElement(document.getElementById('additionalFields'));
const container = document.getElementById('additionalFields');
// Create a new row for the new fields
const newRow = document.createElement('div');
newRow.className = 'row mb-2';
const labels = ['#', 'Color', 'LPI', 'Size'];
const values = [num, Color, LPI, Size];
labels.forEach((label, index) => {
const col = document.createElement('div');
col.className = 'col-sm';
const labelElement = document.createElement('label');
labelElement.className = 'pe-2';
labelElement.style.fontWeight = '700';
labelElement.style.fontSize = '15px';
labelElement.textContent = label + ':';
const inputElement = document.createElement('input');
inputElement.className = 'form-control input-sm';
inputElement.style.width = '100%';
inputElement.id = 'input-' + container.childElementCount + '-' + index; // Unique ID based on count
inputElement.value = values[index]; // Set the value based on the parameter
col.appendChild(labelElement);
col.appendChild(inputElement);
newRow.appendChild(col);
});
const removeButtonCol = document.createElement('div'); // Create the new row container
removeButtonCol.className = 'col-auto d-flex align-items-center mt-3'; newRow := TJSHTMLElement(document.createElement('div'));
newRow.className := 'row mb-2';
const removeButton = document.createElement('button'); labels[0] := '#'; values[0] := num;
removeButton.className = 'btn btn-danger btn-sm mt-1'; labels[1] := 'Color'; values[1] := color;
removeButton.textContent = 'Remove'; labels[2] := 'LPI'; values[2] := LPI;
removeButton.addEventListener('click', function() { labels[3] := 'Size'; values[3] := size;
container.removeChild(newRow);
}); for i := 0 to 3 do
begin
col := TJSHTMLElement(document.createElement('div'));
col.className := 'col-sm';
labelEl := TJSHTMLElement(document.createElement('label'));
labelEl.className := 'pe-2';
labelEl.style.setProperty('font-weight', '700');
labelEl.style.setProperty('font-size', '15px');
labelEl.textContent := labels[i] + ':';
inputEl := TJSHTMLElement(document.createElement('input'));
inputEl.className := 'form-control input-sm';
inputEl.setAttribute('style', 'width: 100%');
inputEl.setAttribute('value', values[i]);
inputEl.setAttribute('id', 'input-' + IntToStr(container.childElementCount) + '-' + IntToStr(i));
col.appendChild(labelEl);
col.appendChild(inputEl);
newRow.appendChild(col);
end;
removeButtonCol.appendChild(removeButton); // Add remove button
newRow.appendChild(removeButtonCol); removeCol := TJSHTMLElement(document.createElement('div'));
removeCol.className := 'col-auto d-flex align-items-end pb-1';
container.appendChild(newRow); removeBtn := TWebButton.Create(Self);
end; removeBtn.Caption := 'Remove';
removeBtn.ElementClassName := 'btn btn-danger btn-sm mt-1';
removeBtn.ParentElement := removeCol;
removeBtn.ElementHandle.style.setProperty('height', '30px');
removeBtn.OnClick := RemoveColorRow;
newRow.appendChild(removeCol);
container.appendChild(newRow);
end; end;
procedure TFOrderEntryCorrugated.RemoveColorRow(Sender: TObject);
var
btn: TWebButton;
rowElement: TJSHTMLElement;
begin
EditMode();
btn := TWebButton(Sender);
if Assigned(btn.ElementHandle) and Assigned(btn.ElementHandle.parentElement) then
begin
// Assuming button is inside a <div> inside the row
rowElement := TJSHTMLElement(btn.ElementHandle.parentElement.parentElement);
if Assigned(rowElement) then
rowElement.remove;
end;
end;
procedure TFOrderEntryCorrugated.btnAddColorClick(Sender: TObject); procedure TFOrderEntryCorrugated.btnAddColorClick(Sender: TObject);
begin begin
addColorRow('','','',''); addColorRow('','','','');
...@@ -787,13 +816,23 @@ begin ...@@ -787,13 +816,23 @@ begin
document.getElementById('modal_body').innerHTML := 'Are you sure you want to cancel all changes?'; document.getElementById('modal_body').innerHTML := 'Are you sure you want to cancel all changes?';
document.getElementById('btn_confirm_cancel').innerText := 'No'; document.getElementById('btn_confirm_cancel').innerText := 'No';
document.getElementById('btn_confirm_delete').innerText := 'Yes'; document.getElementById('btn_confirm_delete').innerText := 'Yes';
asm asm
var confirmationModal = new bootstrap.Modal(document.getElementById('confirmation_modal'), { var modal = document.getElementById('confirmation_modal');
keyboard: false });
// Ensure modal is a direct child of <body> to avoid z-index/backdrop issues
if (modal && modal.parentNode !== document.body) {
document.body.appendChild(modal);
}
var confirmationModal = new bootstrap.Modal(modal, {
keyboard: false
});
confirmationModal.show(); confirmationModal.show();
end; end;
end; end;
procedure TFOrderEntryCorrugated.btnCloseClick(Sender: TObject); procedure TFOrderEntryCorrugated.btnCloseClick(Sender: TObject);
begin begin
FViewMain.ViewOrders(''); FViewMain.ViewOrders('');
......
kgOrdersClient/View.OrderEntryCuttingDie.html
...@@ -131,24 +131,18 @@ ...@@ -131,24 +131,18 @@
</div> </div>
<div class="modal fade" id="confirmation_modal" tabindex="-1" aria-labelledby="confirmation_modal_label" aria-hidden="true"> <div class="modal fade" id="confirmation_modal" tabindex="-1" aria-labelledby="confirmation_modal_label" aria-hidden="true">
<div class="modal-dialog"> <div class="modal-dialog">
<div class="modal-content"> <div class="modal-content shadow-lg">
<div class="modal-header"> <div class="modal-header">
<h5 class="modal-title" id="confirmation_modal_label">Confirm</h5> <h5 class="modal-title" id="confirmation_modal_label">Confirm</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button> <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div> </div>
<div class="modal-body" id="modal_body"> <div class="modal-body fs-6 fw-bold" id="modal_body">
Are you sure you want to delete this order? Are you sure you want to delete this order?
</div> </div>
<div class="modal-footer"> <div class="modal-footer justify-content-center">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal" id=btn_confirm_cancel>Cancel</button> <button type="button" class="btn btn-secondary me-3" data-bs-dismiss="modal" id="btn_confirm_cancel">Cancel</button>
<button type="button" class="btn btn-primary" data-bs-dismiss="modal" id="btn_confirm_delete">Delete</button> <button type="button" class="btn btn-primary" data-bs-dismiss="modal" id="btn_confirm_delete">Delete</button>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div>
<style>
.modal-backdrop {
opacity: 0 !important;
}
</style>
kgOrdersClient/View.OrderEntryCuttingDie.pas
...@@ -332,8 +332,16 @@ begin ...@@ -332,8 +332,16 @@ begin
document.getElementById('btn_confirm_cancel').innerText := 'Cancel'; document.getElementById('btn_confirm_cancel').innerText := 'Cancel';
document.getElementById('btn_confirm_delete').innerText := 'Delete'; document.getElementById('btn_confirm_delete').innerText := 'Delete';
asm asm
var confirmationModal = new bootstrap.Modal(document.getElementById('confirmation_modal'), { var modal = document.getElementById('confirmation_modal');
keyboard: false });
// Ensure modal is a direct child of <body> to avoid z-index/backdrop issues
if (modal && modal.parentNode !== document.body) {
document.body.appendChild(modal);
}
var confirmationModal = new bootstrap.Modal(modal, {
keyboard: false
});
confirmationModal.show(); confirmationModal.show();
end; end;
end; end;
...@@ -494,8 +502,16 @@ begin ...@@ -494,8 +502,16 @@ begin
document.getElementById('btn_confirm_cancel').innerText := 'No'; document.getElementById('btn_confirm_cancel').innerText := 'No';
document.getElementById('btn_confirm_delete').innerText := 'Yes'; document.getElementById('btn_confirm_delete').innerText := 'Yes';
asm asm
var confirmationModal = new bootstrap.Modal(document.getElementById('confirmation_modal'), { var modal = document.getElementById('confirmation_modal');
keyboard: false });
// Ensure modal is a direct child of <body> to avoid z-index/backdrop issues
if (modal && modal.parentNode !== document.body) {
document.body.appendChild(modal);
}
var confirmationModal = new bootstrap.Modal(modal, {
keyboard: false
});
confirmationModal.show(); confirmationModal.show();
end; end;
end; end;
......
kgOrdersClient/View.OrderEntryWeb.dfm
...@@ -743,7 +743,7 @@ object FOrderEntryWeb: TFOrderEntryWeb ...@@ -743,7 +743,7 @@ object FOrderEntryWeb: TFOrderEntryWeb
Top = 87 Top = 87
Width = 96 Width = 96
Height = 25 Height = 25
Caption = '+' Caption = 'Add Color'
ChildOrder = 59 ChildOrder = 59
ElementID = 'btnaddcolor' ElementID = 'btnaddcolor'
HeightPercent = 100.000000000000000000 HeightPercent = 100.000000000000000000
......
kgOrdersClient/View.OrderEntryWeb.html
...@@ -248,25 +248,43 @@ ...@@ -248,25 +248,43 @@
<input class="form-control input-sm" id="dtpdigitalcolordate" type="date"> <input class="form-control input-sm" id="dtpdigitalcolordate" type="date">
</div> </div>
</div> </div>
<h4 class="custom-h4 mt-3">Quantity and Colors</h4> <h4 class="custom-h4 mt-3">Quantity</h4>
<hr class="custom-hr"> <hr class="custom-hr">
<div class="row"> <div class="row">
<div class="col-auto"> <div class="col-auto">
<label style="font-weight: 700; font-size: 15px;" class="form-label mt-2">Press Name:</label> <label style="font-weight: 700; font-size: 15px;" class="form-label mt-2">Press Name:</label>
<input id="edtpressname" class="form-control input-sm" width='50%'/> <input id="edtpressname" class="form-control input-sm" width="50%" />
</div> </div>
<div class="col-auto"> <div class="col-auto">
<label style="font-weight: 700; font-size: 15px;" class="form-label mt-2">Anilax Info:</label> <label style="font-weight: 700; font-size: 15px;" class="form-label mt-2">Anilax Info:</label>
<input id="edtanilaxinfo" class="form-control input-sm" width='50%'/> <input id="edtanilaxinfo" class="form-control input-sm" width="50%" />
</div> </div>
<div class="col-auto"> </div>
<label for="wdbe_first_name" style="font-weight: 700; font-size: 15px;" class="form-label mt-2">Colors:</label>
<button id="btnaddcolor" class="btn btn-primary btn-sm float-end">+</button> <h4 class="custom-h4 mt-3">Colors</h4>
<div id="additionalFields" class="row mt-3"></div> <hr class="custom-hr">
</div>
<div class="row align-items-center">
<!-- placeholders for the 4 dynamic input columns to center the Add Color button -->
<div class="col-sm"></div>
<div class="col-sm"></div>
<div class="col-sm"></div>
<div class="col-sm"></div>
<div class="col-auto d-flex justify-content-center">
<!-- Delphi-generated TWebButton stays here -->
<button id="btnaddcolor" class="btn btn-primary btn-sm me-3">
Add Color
</button>
</div>
</div> </div>
<!-- Dynamically injected color rows go here -->
<div id="additionalFields" class="row mt-3"></div>
<h4 class="custom-h4 mt-3">Plate Marks</h4> <h4 class="custom-h4 mt-3">Plate Marks</h4>
<hr class="custom-hr"> <hr class="custom-hr">
<div class="row"> <div class="row">
<div class="col-auto"> <div class="col-auto">
<label label style="font-weight: 700; font-size: 15px;" class="form-label mt-2">Microdots:</label> <label label style="font-weight: 700; font-size: 15px;" class="form-label mt-2">Microdots:</label>
...@@ -433,24 +451,18 @@ ...@@ -433,24 +451,18 @@
</div> </div>
<div class="modal fade" id="confirmation_modal" tabindex="-1" aria-labelledby="confirmation_modal_label" aria-hidden="true"> <div class="modal fade" id="confirmation_modal" tabindex="-1" aria-labelledby="confirmation_modal_label" aria-hidden="true">
<div class="modal-dialog"> <div class="modal-dialog">
<div class="modal-content"> <div class="modal-content shadow-lg">
<div class="modal-header"> <div class="modal-header">
<h5 class="modal-title" id="confirmation_modal_label">Confirm</h5> <h5 class="modal-title" id="confirmation_modal_label">Confirm</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button> <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div> </div>
<div class="modal-body" id="modal_body"> <div class="modal-body fs-6 fw-bold" id="modal_body">
Are you sure you want to delete this order? Are you sure you want to delete this order?
</div> </div>
<div class="modal-footer"> <div class="modal-footer justify-content-center">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal" id=btn_confirm_cancel>Cancel</button> <button type="button" class="btn btn-secondary me-3" data-bs-dismiss="modal" id="btn_confirm_cancel">Cancel</button>
<button type="button" class="btn btn-primary" data-bs-dismiss="modal" id="btn_confirm_delete">Delete</button> <button type="button" class="btn btn-primary" data-bs-dismiss="modal" id="btn_confirm_delete">Delete</button>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div>
<style>
.modal-backdrop {
opacity: 0 !important;
}
</style>
kgOrdersClient/View.OrderEntryWeb.pas
...@@ -247,6 +247,7 @@ type ...@@ -247,6 +247,7 @@ type
customerID: string; customerID: string;
mode: string; mode: string;
notification: string; notification: string;
procedure RemoveColorRow(Sender: TObject);
//FJSONProc1: TJSONProc1; //FJSONProc1: TJSONProc1;
public public
class function CreateForm(AElementID, orderInfo, customerInfo, mode, info: string): TWebForm; class function CreateForm(AElementID, orderInfo, customerInfo, mode, info: string): TWebForm;
...@@ -422,8 +423,16 @@ begin ...@@ -422,8 +423,16 @@ begin
document.getElementById('btn_confirm_cancel').innerText := 'Cancel'; document.getElementById('btn_confirm_cancel').innerText := 'Cancel';
document.getElementById('btn_confirm_delete').innerText := 'Delete'; document.getElementById('btn_confirm_delete').innerText := 'Delete';
asm asm
var confirmationModal = new bootstrap.Modal(document.getElementById('confirmation_modal'), { var modal = document.getElementById('confirmation_modal');
keyboard: false });
// Ensure modal is a direct child of <body> to avoid z-index/backdrop issues
if (modal && modal.parentNode !== document.body) {
document.body.appendChild(modal);
}
var confirmationModal = new bootstrap.Modal(modal, {
keyboard: false
});
confirmationModal.show(); confirmationModal.show();
end; end;
end; end;
...@@ -651,56 +660,75 @@ begin ...@@ -651,56 +660,75 @@ begin
end; end;
procedure TFOrderEntryWeb.addColorRow(num: string; Color: string; LPI: string; Size: string); procedure TFOrderEntryWeb.addColorRow(num: string; Color: string; LPI: string; Size: string);
// Java script code to add a row of colors when a button is clicked var
// all variables are information to be placed in the boxes when loading an order. container, newRow, col, labelEl, inputEl, removeCol: TJSHTMLElement;
// TODO: convert to Delphi removeBtn: TWebButton;
values: array[0..3] of string;
labels: array[0..3] of string;
i: Integer;
begin begin
asm container := TJSHTMLElement(document.getElementById('additionalFields'));
const container = document.getElementById('additionalFields');
// Create a new row for the new fields
const newRow = document.createElement('div');
newRow.className = 'row mb-2';
const labels = ['#', 'Color', 'LPI', 'Size'];
const values = [num, Color, LPI, Size];
labels.forEach((label, index) => {
const col = document.createElement('div');
col.className = 'col-sm';
const labelElement = document.createElement('label');
labelElement.className = 'pe-2';
labelElement.style.fontWeight = '700';
labelElement.style.fontSize = '15px';
labelElement.textContent = label + ':';
const inputElement = document.createElement('input');
inputElement.className = 'form-control input-sm';
inputElement.style.width = '100%';
inputElement.id = 'input-' + container.childElementCount + '-' + index; // Unique ID based on count
inputElement.value = values[index]; // Set the value based on the parameter
col.appendChild(labelElement);
col.appendChild(inputElement);
newRow.appendChild(col);
});
const removeButtonCol = document.createElement('div'); // Create the new row container
removeButtonCol.className = 'col-auto d-flex align-items-center'; newRow := TJSHTMLElement(document.createElement('div'));
newRow.className := 'row mb-2';
const removeButton = document.createElement('button'); labels[0] := '#'; values[0] := num;
removeButton.className = 'btn btn-danger btn-sm'; labels[1] := 'Color'; values[1] := color;
removeButton.textContent = 'Remove'; labels[2] := 'LPI'; values[2] := LPI;
removeButton.addEventListener('click', function() { labels[3] := 'Size'; values[3] := size;
container.removeChild(newRow);
});
removeButtonCol.appendChild(removeButton); for i := 0 to 3 do
newRow.appendChild(removeButtonCol); begin
col := TJSHTMLElement(document.createElement('div'));
col.className := 'col-sm';
labelEl := TJSHTMLElement(document.createElement('label'));
labelEl.className := 'pe-2';
labelEl.style.setProperty('font-weight', '700');
labelEl.style.setProperty('font-size', '15px');
labelEl.textContent := labels[i] + ':';
inputEl := TJSHTMLElement(document.createElement('input'));
inputEl.className := 'form-control input-sm';
inputEl.setAttribute('style', 'width: 100%');
inputEl.setAttribute('value', values[i]);
inputEl.setAttribute('id', 'input-' + IntToStr(container.childElementCount) + '-' + IntToStr(i));
col.appendChild(labelEl);
col.appendChild(inputEl);
newRow.appendChild(col);
end;
container.appendChild(newRow); // Add remove button
end; removeCol := TJSHTMLElement(document.createElement('div'));
removeCol.className := 'col-auto d-flex align-items-end pb-1';
removeBtn := TWebButton.Create(Self);
removeBtn.Caption := 'Remove';
removeBtn.ElementClassName := 'btn btn-danger btn-sm mt-1';
removeBtn.ParentElement := removeCol;
removeBtn.ElementHandle.style.setProperty('height', '30px');
removeBtn.OnClick := RemoveColorRow;
newRow.appendChild(removeCol);
container.appendChild(newRow);
end;
procedure TFOrderEntryWeb.RemoveColorRow(Sender: TObject);
var
btn: TWebButton;
rowElement: TJSHTMLElement;
begin
EditMode();
btn := TWebButton(Sender);
if Assigned(btn.ElementHandle) and Assigned(btn.ElementHandle.parentElement) then
begin
// Assuming button is inside a <div> inside the row
rowElement := TJSHTMLElement(btn.ElementHandle.parentElement.parentElement);
if Assigned(rowElement) then
rowElement.remove;
end;
end; end;
procedure TFOrderEntryWeb.WebButton1Click(Sender: TObject); procedure TFOrderEntryWeb.WebButton1Click(Sender: TObject);
...@@ -747,12 +775,22 @@ end; ...@@ -747,12 +775,22 @@ end;
procedure TFOrderEntryWeb.btnCancelClick(Sender: TObject); procedure TFOrderEntryWeb.btnCancelClick(Sender: TObject);
begin begin
document.getElementById('modal_body').innerHTML := 'Are you sure you want to cancel all changes to the customer?'; console.log('click');
document.getElementById('modal_body').innerHTML := 'Are you sure you want to cancel all changes?';
document.getElementById('btn_confirm_cancel').innerText := 'No'; document.getElementById('btn_confirm_cancel').innerText := 'No';
document.getElementById('btn_confirm_delete').innerText := 'Yes'; document.getElementById('btn_confirm_delete').innerText := 'Yes';
asm asm
var confirmationModal = new bootstrap.Modal(document.getElementById('confirmation_modal'), { var modal = document.getElementById('confirmation_modal');
keyboard: false });
// Ensure modal is a direct child of <body> to avoid z-index/backdrop issues
if (modal && modal.parentNode !== document.body) {
document.body.appendChild(modal);
}
var confirmationModal = new bootstrap.Modal(modal, {
keyboard: false
});
confirmationModal.show(); confirmationModal.show();
end; end;
end; end;
......
kgOrdersClient/View.Orders.dfm
object FViewOrders: TFViewOrders object FViewOrders: TFViewOrders
Width = 676 Width = 676
Height = 480 Height = 480
Caption = 'main.errorpanel'
CSSLibrary = cssBootstrap CSSLibrary = cssBootstrap
ElementFont = efCSS ElementFont = efCSS
Font.Charset = DEFAULT_CHARSET Font.Charset = DEFAULT_CHARSET
......
kgOrdersClient/index.html
<html><head> <!DOCTYPE html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <html>
<meta content="width=device-width, initial-scale=1" name="viewport"/> <head>
<noscript>Your browser does not support JavaScript!</noscript> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<link href="data:;base64,=" rel="icon"/> <meta name="viewport" content="width=device-width, initial-scale=1"/>
<title>Web KG Orders</title> <noscript>Your browser does not support JavaScript!</noscript>
<link href="https://cdnjs.cloudflare.com/ajax/libs/flag-icon-css/2.3.1/css/flag-icon.min.css" rel="stylesheet"/> <link href="data:;base64,=" rel="icon"/>
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"/>
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.0/css/all.min.css" rel="stylesheet"/> <title>EM Systems webKGOrders App</title>
<link crossorigin="anonymous" href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/js/bootstrap.bundle.min.js" type="text/javascript"></script> <link href="https://cdnjs.cloudflare.com/ajax/libs/flag-icon-css/2.3.1/css/flag-icon.min.css" rel="stylesheet"/>
<script crossorigin="anonymous" integrity="sha256-eKhayi8LEQwp4NKxN+CfCh+3qOVUtJn3QNZ0TciWLP4=" src="https://code.jquery.com/jquery-3.7.1.js"></script> <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"/>
<script src="$(ProjectName).js" type="text/javascript"></script> <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.0/css/all.min.css" rel="stylesheet"/>
<title>EM Systems webKGOrders App</title> <link crossorigin="anonymous" href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css" rel="stylesheet"/>
<link href="css/app.css" rel="stylesheet" type="text/css"/>
<link href="css/spinner.css" rel="stylesheet" type="text/css"> <link href="css/app.css" rel="stylesheet" type="text/css"/>
<script src="$(ProjectName).js" type="text/javascript"></script> <link href="css/spinner.css" rel="stylesheet" type="text/css"/>
<body>
</body> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/js/bootstrap.bundle.min.js" type="text/javascript"></script>
<script type="text/javascript">rtl.run();</script> <script crossorigin="anonymous" integrity="sha256-eKhayi8LEQwp4NKxN+CfCh+3qOVUtJn3QNZ0TciWLP4=" src="https://code.jquery.com/jquery-3.7.1.js"></script>
<script src="$(ProjectName).js" type="text/javascript"></script>
</head>
<body>
</body>
<script type="text/javascript">
rtl.run();
</script>
</html> </html>
kgOrdersServer/Source/Lookup.ServiceImpl.pas
...@@ -110,7 +110,7 @@ begin ...@@ -110,7 +110,7 @@ begin
OrdersDB.UniQuery1.SQL.Text := SQL; OrdersDB.UniQuery1.SQL.Text := SQL;
OrdersDB.UniQuery1.ExecSQL; OrdersDB.UniQuery1.ExecSQL;
result := TJSONObject.Create; result := TJSONObject.Create;
result.AddPair('status', 'Success:Address Successfully Deleted'); result.AddPair('status', 'Success: Address Successfully Deleted');
SQL := 'select * FROM customers c LEFT JOIN customers_ship s ON c.CUSTOMER_ID = s.customer_id WHERE c.CUSTOMER_ID = ' + CustomerID; SQL := 'select * FROM customers c LEFT JOIN customers_ship s ON c.CUSTOMER_ID = s.customer_id WHERE c.CUSTOMER_ID = ' + CustomerID;
doQuery(ordersDB.UniQuery1, SQL); doQuery(ordersDB.UniQuery1, SQL);
ADDRESS_LIST := TJSONArray.Create; ADDRESS_LIST := TJSONArray.Create;
...@@ -356,10 +356,10 @@ begin ...@@ -356,10 +356,10 @@ begin
if mode = 'ADD' then if mode = 'ADD' then
begin begin
msg := 'Success:Shipping Address Successfully Added'; msg := 'Success: Shipping Address Successfully Added';
end end
else else
msg := 'Success:Shipping Address Successfully Edited'; msg := 'Success: Shipping Address Successfully Edited';
// Sends the updated Address List Back. // Sends the updated Address List Back.
...@@ -485,9 +485,9 @@ begin ...@@ -485,9 +485,9 @@ begin
ordersDB.UniQuery1.Post; ordersDB.UniQuery1.Post;
if mode = 'ADD' then if mode = 'ADD' then
msg := 'Success:Customer Successfully Added' msg := 'Success: Customer Successfully Added'
else else
msg := 'Success:Customer Successfully Edited'; msg := 'Success: Customer Successfully Edited';
Result := TJSONObject.Create.AddPair('status', msg); Result := TJSONObject.Create.AddPair('status', msg);
...@@ -1558,7 +1558,7 @@ begin ...@@ -1558,7 +1558,7 @@ begin
end;} end;}
ordersDB.UniQuery1.Post; ordersDB.UniQuery1.Post;
Result := 'Success: Edit Successful'; Result := 'Success: User Successfully Edited';
end; end;
ordersDB.UniQuery1.Close; ordersDB.UniQuery1.Close;
end; end;
...@@ -1686,9 +1686,9 @@ begin ...@@ -1686,9 +1686,9 @@ begin
addToRevisionsTable(intToStr(ORDER_ID), 'corrugated_plate_orders_revisions', JSONData); addToRevisionsTable(intToStr(ORDER_ID), 'corrugated_plate_orders_revisions', JSONData);
if mode = 'ADD' then if mode = 'ADD' then
msg := 'Success:Customer Successfully Added' msg := 'Success: Order Successfully Added'
else else
msg := 'Success:Customer Successfully Edited'; msg := 'Success: Order Successfully Edited';
Result := TJSONObject.Create.AddPair('status', msg); Result := TJSONObject.Create.AddPair('status', msg);
Result.AddPair('OrderID', ORDER_ID); Result.AddPair('OrderID', ORDER_ID);
...@@ -1957,10 +1957,10 @@ begin ...@@ -1957,10 +1957,10 @@ begin
ordersDB.UniQuery1.FieldByName('QB_ID').AsString := QB; ordersDB.UniQuery1.FieldByName('QB_ID').AsString := QB;
ordersDB.UniQuery1.Post; ordersDB.UniQuery1.Post;
Result := 'Success:User successfully added'; Result := 'Success: User successfully added';
end end
else else
Result := 'Failure:Username already taken'; Result := 'Failure: Username already taken';
except except
on E: Exception do on E: Exception do
raise EXDataHttpException.Create(500, 'AddUser failed: ' + E.Message); raise EXDataHttpException.Create(500, 'AddUser failed: ' + E.Message);
...@@ -2005,7 +2005,7 @@ begin ...@@ -2005,7 +2005,7 @@ begin
ordersDB.UniQuery1.FieldByName('status').AsString := 'INACTIVE'; ordersDB.UniQuery1.FieldByName('status').AsString := 'INACTIVE';
ordersDB.UniQuery1.Post; ordersDB.UniQuery1.Post;
Result.AddPair('msg', 'Success:Item successfully added'); Result.AddPair('msg', 'Success: Item successfully added');
end end
else else
Result.AddPair('msg', 'Failure: Item already exists'); Result.AddPair('msg', 'Failure: Item already exists');
...@@ -2122,9 +2122,9 @@ begin ...@@ -2122,9 +2122,9 @@ begin
AddToRevisionsTable(IntToStr(ORDER_ID), 'web_plate_orders_revisions', JSONData); AddToRevisionsTable(IntToStr(ORDER_ID), 'web_plate_orders_revisions', JSONData);
if mode = 'ADD' then if mode = 'ADD' then
msg := 'Success:Customer Successfully Added' msg := 'Success: Order Successfully Added'
else else
msg := 'Success:Customer Successfully Edited'; msg := 'Success: Order Successfully Edited';
Result := TJSONObject.Create.AddPair('status', msg); Result := TJSONObject.Create.AddPair('status', msg);
Result.AddPair('OrderID', ORDER_ID); Result.AddPair('OrderID', ORDER_ID);
...@@ -2213,9 +2213,9 @@ begin ...@@ -2213,9 +2213,9 @@ begin
AddToRevisionsTable(IntToStr(ORDER_ID), 'cutting_die_orders_revisions', JSONData); AddToRevisionsTable(IntToStr(ORDER_ID), 'cutting_die_orders_revisions', JSONData);
if mode = 'ADD' then if mode = 'ADD' then
msg := 'Success:Customer Successfully Added' msg := 'Success: Order Successfully Added'
else else
msg := 'Success:Customer Successfully Edited'; msg := 'Success: Order Successfully Edited';
Result := TJSONObject.Create.AddPair('status', msg); Result := TJSONObject.Create.AddPair('status', msg);
Result.AddPair('OrderID', ORDER_ID); Result.AddPair('OrderID', ORDER_ID);
...@@ -2842,9 +2842,9 @@ begin ...@@ -2842,9 +2842,9 @@ begin
OrdersDB.UniQuery1.Post; OrdersDB.UniQuery1.Post;
if mode = 'ADD' then if mode = 'ADD' then
msg := 'Success:Customer Successfully Added' msg := 'Success: Customer Successfully Added'
else else
msg := 'Success:Customer Successfully Edited'; msg := 'Success: Customer Successfully Edited';
Result := TJSONObject.Create; Result := TJSONObject.Create;
Result.AddPair('status', msg); Result.AddPair('status', msg);
......
kgOrdersServer/kgOrdersServer.ini
...@@ -2,11 +2,11 @@ ...@@ -2,11 +2,11 @@
MemoLogLevel=3 MemoLogLevel=3
FileLogLevel=5 FileLogLevel=5
webClientVersion=0.9.4 webClientVersion=0.9.4
LogFileNum=722 LogFileNum=728
[Database] [Database]
Server=192.168.159.131 --Server=192.168.159.131
--Server=192.168.102.130 Server=192.168.102.130
--Server=192.168.75.133 --Server=192.168.75.133
Database=kg_order_entry Database=kg_order_entry
Username=root Username=root
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment