got colors converted into pdfs on client side.

client side order submission nearly done, but one issue is that delphi appears to be unable to create a json object with an array.

kgOrdersClient/View.IncidentProperty.html

+<div class="container pb-5 mt-5">
+  <h3 id="crime_title"></h3>
+  <div id="status_message" class="alert" style="display: none;"></div>
+  <hr class="custom-hr">
+  <h4 class="custom-h4 mt-3">Incident Information</h4>
+  <p>Please enter all the information that applies. A valid address is required.</p>
+  <hr class="custom-hr">
+  <form>
+    <h4 class="custom-h4 mt-3">Incident Location</h4>
+    <hr class="custom-hr">
+    <div class="row mt-3">
+      <div class="col-md-4">
+        <label for="edt_street_number" class="form-label">Street number*</label>
+        <input type="text" class="form-control" id="edt_street_number">
+      </div>
+      <div class="col-md-4">
+        <label for="drp_street_direction" class="form-label">St Dir</label>
+        <select class="form-select" id="drp_street_direction">
+          <!-- Street directions options will be loaded dynamically -->
+        </select>
+      </div>
+      <div class="col-md-4">
+        <label for="edt_street_name" class="form-label">Street Name*</label>
+        <input type="text" class="form-control" id="edt_street_name">
+      </div>
+      <div class="col-md-2">
+        <label for="drp_street_type" class="form-label">St Type*</label>
+        <select class="form-select" id="drp_street_type">
+          <!-- Street types options will be loaded dynamically -->
+        </select>
+      </div>
+      <div class="col-md-2">
+        <label for="edt_apt_unit" class="form-label">Apt/Unit</label>
+        <input type="text" class="form-control" id="edt_apt_unit">
+      </div>
+      <div class="col-md-4">
+        <label for="drp_state" class="form-label">State*</label>
+        <select class="form-select" id="drp_state">
+          <!-- States options will be loaded dynamically -->
+        </select>
+      </div>
+      <div class="col-md-4">
+        <label for="edt_zip_code" class="form-label">Zip Code*</label>
+        <input type="text" class="form-control" id="edt_zip_code">
+      </div>
+    </div>
+    <h4 class="custom-h4 mt-3">Incident Time</h4>
+    <hr class="custom-hr">
+    <div class="row mt-3">
+      <div class="col-md-3">
+        <label for="dpt_incident_time_start" class="form-label">Incident Time (start)*</label>
+        <input type="datetime-local" class="form-control" id="dpt_incident_time_start">
+      </div>
+      <div class="col-md-3">
+        <label for="dpt_incident_time_end" class="form-label">Incident Time (end)*</label>
+        <input type="datetime-local" class="form-control" id="dpt_incident_time_end">
+      </div>
+      <div class="col-md-3">
+        <label for="drp_location_type" class="form-label">Location Type</label>
+        <select class="form-select" id="drp_location_type">
+          <!-- Location type options will be loaded dynamically -->
+        </select>
+      </div>
+    </div>
+    <div class="mt-4">
+      <button id="btn_submit" type="submit" class="btn btn-secondary">Submit</button>
+    </div>
+  </form>
+</div>

kgOrdersClient/View.IncidentProperty.pas

+unit View.IncidentProperty;
+
+interface
+
+uses
+  System.SysUtils, System.Classes, JS, Web, WEBLib.Graphics, WEBLib.Controls,
+  WEBLib.Forms, WEBLib.Dialogs, App.Types, ConnectionModule, Data.DB,
+  WEBLib.DB, XData.Web.JsonDataset, XData.Web.Dataset, WEBLib.ExtCtrls,
+  XData.Web.Client, Vcl.StdCtrls, WEBLib.StdCtrls, WEBLib.DBCtrls, Vcl.Controls;
+
+type
+  TFIncidentProperty = class(TWebForm)
+    WebLabel1: TWebLabel;
+    WebLabel2: TWebLabel;
+    WebLabel3: TWebLabel;
+    WebLabel4: TWebLabel;
+    WebLabel6: TWebLabel;
+    WebLabel7: TWebLabel;
+    WebLabel8: TWebLabel;
+    WebLabel9: TWebLabel;
+    pnlMessage: TWebPanel;
+    lblMessage: TWebLabel;
+    btnCloseNotification: TWebButton;
+    dtpOrderDate: TWebDateTimePicker;
+    dtpProofDate: TWebDateTimePicker;
+    dtpShipDate: TWebDateTimePicker;
+    dtpArtDue: TWebDateTimePicker;
+    dtpPlateDue: TWebDateTimePicker;
+    dtpMountDue: TWebDateTimePicker;
+    WebButton1: TWebButton;
+    dtpColorContractDate2: TWebDateTimePicker;
+    edtCompanyName: TWebDBEdit;
+    edtCompanyAccountName: TWebDBEdit;
+    edtInQuickBooks: TWebDBEdit;
+    edtShipVia: TWebDBEdit;
+    edtQuantity: TWebDBEdit;
+    edtPrice: TWebDBEdit;
+    edtInvoiceTo: TWebDBEdit;
+    edtShipTo: TWebDBEdit;
+    edtPONumber: TWebDBEdit;
+    edtJobName: TWebDBEdit;
+    edtQuickBooksItem: TWebDBEdit;
+    edtArtLocation: TWebDBEdit;
+    edtDimensionalLayout: TWebDBEdit;
+    edtEmail: TWebDBEdit;
+    edtFTP: TWebDBEdit;
+    edtOther: TWebDBEdit;
+    edtTotalInchesUsed: TWebDBEdit;
+    edtSheetsUsed: TWebDBEdit;
+    edtInitials: TWebDBEdit;
+    edtPitch: TWebDBEdit;
+    edtAround: TWebDBEdit;
+    edtAcross: TWebDBEdit;
+    edtCutoffDimension: TWebDBEdit;
+    edtCylinderRepeat: TWebDBEdit;
+    edtReversePrint: TWebDBEdit;
+    edtSurfacePrint: TWebDBEdit;
+    edtBleeded: TWebDBEdit;
+    edtDigitalColorKey: TWebDBEdit;
+    edtColorContract: TWebDBEdit;
+    edtColorContractTo: TWebDBEdit;
+    edtInkJetTo2: TWebDBEdit;
+    edtInkJetTo: TWebDBEdit;
+    edtPDFTo: TWebDBEdit;
+    edtAniloxInfo: TWebDBEdit;
+    edtPressName: TWebDBEdit;
+    edtJobNumber: TWebDBEdit;
+    edtPlateMaterial: TWebDBEdit;
+    edtThickness: TWebDBEdit;
+    cbPDFFile: TWebDBCheckBox;
+    cbFullSizeInkJet: TWebDBCheckBox;
+    cbPlate: TWebDBCheckBox;
+    cbColorCopy: TWebDBCheckBox;
+    cbBWCopy: TWebDBCheckBox;
+    edtComments: TWebDBEdit;
+    XDataWebClient1: TXDataWebClient;
+    tmrScrollTop: TWebTimer;
+    XDataWebDataSet1: TXDataWebDataSet;
+    XDataWebDataSet1Quantity: TStringField;
+    XDataWebDataSet1accountCompanyName: TStringField;
+    XDataWebDataSet1acrossNo: TStringField;
+    XDataWebDataSet1approvedDate: TStringField;
+    XDataWebDataSet1aroundNo: TStringField;
+    XDataWebDataSet1artApprovedAsIs: TBooleanField;
+    XDataWebDataSet1artDue: TStringField;
+    XDataWebDataSet1artLocation: TStringField;
+    XDataWebDataSet1bwCopy: TBooleanField;
+    XDataWebDataSet1cadFile: TStringField;
+    XDataWebDataSet1clemson: TStringField;
+    XDataWebDataSet1companyName: TStringField;
+    XDataWebDataSet1crossHairs: TIntegerField;
+    XDataWebDataSet1customAdhesive: TStringField;
+    XDataWebDataSet1customBacking: TStringField;
+    XDataWebDataSet1cylinderSize: TStringField;
+    XDataWebDataSet1dieCutNo: TStringField;
+    XDataWebDataSet1dimensionalLayout: TStringField;
+    XDataWebDataSet1diskOrCD: TBooleanField;
+    XDataWebDataSet1email: TStringField;
+    XDataWebDataSet1emailAttn: TStringField;
+    XDataWebDataSet1excaliburDie: TBooleanField;
+    XDataWebDataSet1existingCuttingDie: TStringField;
+    XDataWebDataSet1fax: TStringField;
+    XDataWebDataSet1faxAttn: TStringField;
+    XDataWebDataSet1ftp: TStringField;
+    XDataWebDataSet1fullMount: TBooleanField;
+    XDataWebDataSet1fullSizePanel: TBooleanField;
+    XDataWebDataSet1inQuickBooks: TStringField;
+    XDataWebDataSet1jobName: TStringField;
+    XDataWebDataSet1jobNumber: TStringField;
+    XDataWebDataSet1loose: TStringField;
+    XDataWebDataSet1machineIdent: TStringField;
+    XDataWebDataSet1mountDue: TStringField;
+    XDataWebDataSet1orderDate: TStringField;
+    XDataWebDataSet1other: TStringField;
+    XDataWebDataSet1pdfFile: TBooleanField;
+    XDataWebDataSet1plateDue: TStringField;
+    XDataWebDataSet1plateMaterial: TStringField;
+    XDataWebDataSet1plates: TBooleanField;
+    XDataWebDataSet1printCard: TBooleanField;
+    XDataWebDataSet1proofDate: TStringField;
+    XDataWebDataSet1proofEmail: TStringField;
+    XDataWebDataSet1proofOther: TStringField;
+    XDataWebDataSet1proofShipTo: TStringField;
+    XDataWebDataSet1quickBooksItem: TStringField;
+    XDataWebDataSet1refArtPrintCard: TStringField;
+    XDataWebDataSet1rscStyle: TStringField;
+    XDataWebDataSet1rscd: TStringField;
+    XDataWebDataSet1rescl: TStringField;
+    XDataWebDataSet1rscw: TStringField;
+    XDataWebDataSet1sampleCarton: TBooleanField;
+    XDataWebDataSet1shipDate: TStringField;
+    XDataWebDataSet1shipTo: TStringField;
+    XDataWebDataSet1shipVia: TStringField;
+    XDataWebDataSet1specialInstructions: TStringField;
+    XDataWebDataSet1standardSetup: TStringField;
+    XDataWebDataSet1stickyBak: TBooleanField;
+    XDataWebDataSet1stripMount: TStringField;
+    XDataWebDataSet1thickness: TStringField;
+    XDataWebDataSet1wideFormat: TStringField;
+    XDataWebDataSet1price: TStringField;
+    XDataWebDataSet1invoiceTo: TStringField;
+    XDataWebDataSet1colorCopy: TBooleanField;
+    XDataWebDataSet1refArtAPDF: TStringField;
+    XDataWebDataSet1poNumber: TStringField;
+    XDataWebDataSet1colors: TStringField;
+    WebDataSource1: TWebDataSource;
+    edtDisk: TWebDBEdit;
+    edtCutback: TWebDBEdit;
+    edtMinimumTrapDim: TWebDBEdit;
+    edtMaximumTrapDim: TWebDBEdit;
+    dtpPDFDate3: TWebDateTimePicker;
+    dtpPDFDate2: TWebDateTimePicker;
+    dtpPDFDate1: TWebDateTimePicker;
+    dtpInkJetDate3: TWebDateTimePicker;
+    dtpInkJetDate2: TWebDateTimePicker;
+    dtpInkJetDate1: TWebDateTimePicker;
+    dtpColorContractDate1: TWebDateTimePicker;
+    dtpDigitalColorDate: TWebDateTimePicker;
+    edtDigitalColorTo: TWebDBEdit;
+    WebLabel5: TWebLabel;
+    edtOtherComments: TWebDBEdit;
+    edtPlateOther: TWebDBEdit;
+    edtColorBarsComments: TWebDBEdit;
+    edtColorBars: TWebDBEdit;
+    edtCrosshairsComments: TWebDBEdit;
+    edtCrosshairs: TWebDBEdit;
+    edtMicrodotsComments: TWebDBEdit;
+    edtMicrodots: TWebDBEdit;
+  private
+    FAgencyCode: string;
+    FCurrentReportType: string;
+    FReportID: string;
+    //FJSONProc: TJSONProc;
+  public
+    class function CreateForm(AElementID, AReportType, AAgencyCode, AReportID: string): TWebForm;
+  end;
+
+var
+  FIncidentProperty: TFIncidentProperty;
+
+implementation
+
+{$R *.dfm}
+
+class function TFIncidentProperty.CreateForm(AElementID, AReportType, AAgencyCode, AReportID: string): TWebForm;
+begin
+  Application.CreateForm(TFIncidentProperty, AElementID, Result,
+    procedure(AForm: TObject)
+    begin
+      with TFIncidentProperty(AForm) do
+      begin
+        FAgencyCode := AAgencyCode;
+        FCurrentReportType := AReportType;
+        FReportID := AReportID;
+        //FJSONProc := AJSONProc;
+//        InitializeForm;
+      end;
+    end
+  );
+end;
+
+end. 
\ No newline at end of file

kgOrdersClient/View.Main.pas

@@ -64,7 +64,7 @@ uses
   View.Users,
   View.EditUser,
   View.Orders,
-  View.OrderEntry;
+  View.OrderEntryCorrugated;
 
 {$R *.dfm}
 
@@ -162,7 +162,7 @@ begin
   Application.CreateForm(AFormClass, WebPanel1.ElementID, FChildForm);
 end;
 
-procedure TFViewMain.EditUser( Mode, Username, Password, Name, Status, Email,
+procedure TFViewMain.EditUser(Mode, Username, Password, Name, Status, Email,
                                Access, Rights, Perspective, QB: string);
 begin
   if Assigned(FChildForm) then
@@ -171,7 +171,7 @@ begin
                                 Password, Name, Status, Email, Access, Rights, Perspective, QB);
 end;
 
-procedure TFViewMain.ViewOrderEntry( orderInfo: string);
+procedure TFViewMain.ViewOrderEntry(orderInfo: string);
 begin
   if Assigned(FChildForm) then
     FChildForm.Free;

kgOrdersClient/View.OrderEntry.dfm → kgOrdersClient/View.OrderEntryCorrugated.dfm

@@ -199,8 +199,8 @@ object FOrderEntry: TFOrderEntry
     Text = ''
   end
   object dtpMountDue: TWebDateTimePicker
-    Left = 26
-    Top = 596
+    Left = 24
+    Top = 592
     Width = 170
     Height = 22
     ElementID = 'dtpmountdue'
@@ -981,6 +981,18 @@ object FOrderEntry: TFOrderEntry
     DataField = 'specialInstructions'
     DataSource = WebDataSource1
   end
+  object btnConfirm: TWebButton
+    Left = 752
+    Top = 558
+    Width = 96
+    Height = 25
+    Caption = 'Confirm'
+    ChildOrder = 79
+    ElementID = 'btnconfirm'
+    HeightPercent = 100.000000000000000000
+    WidthPercent = 100.000000000000000000
+    OnClick = btnConfirmClick
+  end
   object XDataWebClient1: TXDataWebClient
     Connection = DMConnection.ApiConnection
     Left = 244

kgOrdersClient/View.OrderEntry.html → kgOrdersClient/View.OrderEntryCorrugated.html

@@ -315,6 +315,11 @@
                             <input type="text" class="form-control" id="edtspecialinstructions" style="width: 300px;">
                         </div>
                     </div>
+                    <div class="row">
+                        <div class="col-auto">
+                            <button id="btnconfirm" class="btn btn-primary btn-sm float-end">Confirm</button>
+                        </div>
+                    </div>
                 </div>
 <script>
 

kgOrdersClient/View.OrderEntry.pas → kgOrdersClient/View.OrderEntryCorrugated.pas

-unit View.OrderEntry;
+unit View.OrderEntryCorrugated;
 
 interface
 
 uses
-  System.SysUtils, System.Classes, JS, Web, WEBLib.Graphics, WEBLib.Controls,
+  System.SysUtils, System.Generics.Collections, System.Classes, JS, Web, WEBLib.Graphics, WEBLib.Controls,
   WEBLib.Forms, WEBLib.Dialogs, WEBLib.Menus, WEBLib.ExtCtrls, WEBLib.StdCtrls,
   WEBLib.JSON, Auth.Service, XData.Web.Client, WebLib.Storage,
   ConnectionModule, App.Types, Vcl.StdCtrls, Vcl.Controls, WEBLib.DBCtrls,
@@ -163,6 +163,7 @@ type
     XDataWebDataSet1refArtAPDF: TStringField;
     XDataWebDataSet1poNumber: TStringField;
     XDataWebDataSet1colors: TStringField;
+    btnConfirm: TWebButton;
     procedure WebFormCreate(Sender: TObject);
     procedure HideNotification();
     procedure ShowNotification(Notification: string);
@@ -171,6 +172,7 @@ type
     procedure tmrScrollTopTimer(Sender: TObject);
     procedure WebButton1Click(Sender: TObject);
     procedure addColorRow(num, Color, LPI, Size: string);
+    procedure btnConfirmClick(Sender: TObject);
   private
     FAgencyCode: string;
     FCurrentReportType: string;
@@ -191,6 +193,66 @@ implementation
 uses
   View.Home;
 
+procedure TFOrderEntry.btnConfirmClick(Sender: TObject);
+var
+  colorList: TList<TJSONObject>;
+  container: TJSElement;
+  colorCollection: TJSHTMLCollection;
+  color: TJSHTMLElement;
+  I, J: integer;
+  colorJSON: TJSONObject;
+  fieldNames: TStringList;
+  itemList: TJSNodeList;
+  header, value: string;
+begin
+  //TJSONObject.Create;
+  colorList := TList<TJSONObject>.Create;
+  container := document.getElementById('additionalFields');
+  colorCollection := container.children;
+  for I := 0 to colorCollection.length - 1 do
+  begin
+    colorJSON := TJSONObject.Create;
+    itemList := colorCollection[I].childNodes;
+    //console.log(itemList.length);
+    for J := 0 to itemList.length - 2 do
+    begin
+      header := TJSHTMLElement(itemList[J]).children[0].innerText.Replace(':', '').Trim();
+      value := TJSHTMLInputElement(TJSHTMLElement(itemList[J]).childNodes[1]).value;
+      colorJSON.AddPair(header, value);
+    end;
+    colorList.Add(colorJson);
+  end;
+  for colorJSON in colorList do
+    begin
+      console.log(colorJSON.ToString); // Log each JSON object
+    end;
+
+
+  //XDataWebDataSet1.Insert;
+  //XDataWebDataSet1colors.AsString := ' ';
+  //XDataWebDataSet1.Post;
+  {asm
+    const container = document.getElementById('additionalFields');
+    const rows = container.children;
+    const inputData = [];
+
+    for (let i = 0; i < rows.length; i++) {
+        const inputs = rows[i].getElementsByTagName('input');
+        const rowData = {};
+
+        {for (let j = 0; j < inputs.length; j++) {
+            const label = inputs[j].previousElementSibling.textContent.replace(':', '').trim();
+            rowData[label] = inputs[j].value;
+        }
+
+        {inputData.push(rowData);
+    }
+
+    {console.log(inputData);
+  end;}
+
+end;
+
 class function TFOrderEntry.CreateForm(AElementID, orderInfo: string): TWebForm;
 begin
   Application.CreateForm(TFOrderEntry, AElementID, Result,
@@ -231,7 +293,7 @@ begin
         const inputElement = document.createElement('input');
         inputElement.className = 'form-control input-sm';
         inputElement.style.width = '100%';
-        inputElement.id = 'input-' + index; // Set an id for easy reference
+        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);
@@ -293,16 +355,12 @@ begin
     XDataWebDataSet1.Close;
     XDataWebDataSet1.SetJsonData(order);
     XDataWebDataSet1.Open;
-    console.log(order);
-    //console.log(XDataWebDataSet1ftp.Value);
-    //console.log(XDataWebDataSet1fullMount.Value);
     colorObject := TJSObject(TJSJSON.parse(XDataWebDataSet1colors.Value));
   colorList := TJSArray(colorObject['items']);
   colorLength := colorList.length;
   for i := 0 to colorLength - 1 do
   begin
     color := TJSObject(colorList[i]);
-    console.log(color);
     addColorRow(String(color['#']), string(color['Color']), string(color['LPI']), string(color['Size']));
   end;
   if not (XDataWebDataSet1orderDate.AsString = '') then
@@ -318,7 +376,9 @@ begin
   if not (XDataWebDataSet1mountDue.AsString = '') then
     dtpMountDue.Date := StrToDateTime(XDataWebDataSet1mountDue.Value);
   if not (XDataWebDataSet1approvedDate.AsString = '') then
-    dtpApprovedDate.Date := StrToDateTime(XDataWebDataSet1approvedDate.Value);
+    dtpApprovedDate.Date := StrToDateTime(XDataWebDataSet1approvedDate.Value)
+  else
+    dtpApprovedDate.Date := Now;
 end;
 
 procedure TFOrderEntry.WebFormShow(Sender: TObject);

kgOrdersClient/View.Orders.pas

@@ -222,7 +222,6 @@ begin
   NewRow.appendChild(Cell);
 
   // Plate Done Cell
-  console.log('plate done');
   Cell := TJSHTMLElement(document.createElement('td'));
   Cell.setAttribute('data-label', 'Plate Done');
   if XDataWebDataSet1plateDone.Value = '' then
@@ -524,7 +523,6 @@ begin
     data := TJSArray(orderList['data']);
     callListLength := integer(orderList['count']);
     ClearTable();
-    console.log(orderList['data']);
     XDataWebDataSet1.Close;
     XDataWebDataSet1.SetJsonData(orderList['data']);
     XDataWebDataSet1.Open;

kgOrdersClient/webKGOrders.dpr

@@ -17,7 +17,8 @@ uses
   View.Users in 'View.Users.pas' {FViewUsers: TWebForm} {*.html},
   View.EditUser in 'View.EditUser.pas' {FViewEditUser: TWebForm} {*.html},
   View.Orders in 'View.Orders.pas' {FViewOrders: TWebForm} {*.html},
-  View.OrderEntry in 'View.OrderEntry.pas' {FOrderEntry: TWebForm} {*.html};
+  View.OrderEntryCorrugated in 'View.OrderEntryCorrugated.pas' {FOrderEntry: TWebForm} {*.html},
+  View.IncidentProperty in 'View.IncidentProperty.pas' {FIncidentProperty: TWebForm} {*.html};
 
 {$R *.res}
 

kgOrdersClient/webKGOrders.dproj

@@ -166,11 +166,16 @@
             <FormType>dfm</FormType>
             <DesignClass>TWebForm</DesignClass>
         </DCCReference>
-        <DCCReference Include="View.OrderEntry.pas">
+        <DCCReference Include="View.OrderEntryCorrugated.pas">
             <Form>FOrderEntry</Form>
             <FormType>dfm</FormType>
             <DesignClass>TWebForm</DesignClass>
         </DCCReference>
+        <DCCReference Include="View.IncidentProperty.pas">
+            <Form>FIncidentProperty</Form>
+            <FormType>dfm</FormType>
+            <DesignClass>TWebForm</DesignClass>
+        </DCCReference>
         <None Include="index.html"/>
         <None Include="template\css\app.css"/>
         <BuildConfiguration Include="Base">

kgOrdersServer/kgOrdersServer.ini

 [Options]
 
-LogFileNum=137
+LogFileNum=139
 
 UpdateTimerLength=0