ability to add occupant on occupancy create

handlers/lotOccupancies-get/new.js

@@ -1,5 +1,5 @@
 import { dateToInteger, dateToString } from "@cityssm/expressjs-server-js/dateTimeFns.js";
-import { getLotStatuses, getLotTypes, getOccupancyTypes } from "../../helpers/functions.cache.js";
+import { getLotOccupantTypes, getLotStatuses, getLotTypes, getOccupancyTypes } from "../../helpers/functions.cache.js";
 import { getLot } from "../../helpers/lotOccupancyDB/getLot.js";
 import { getMaps } from "../../helpers/lotOccupancyDB/getMaps.js";
 import * as configFunctions from "../../helpers/functions.config.js";
@@ -17,6 +17,7 @@ export const handler = (request, response) => {
         lotOccupancy.mapName = lot.mapName;
     }
     const occupancyTypes = getOccupancyTypes();
+    const lotOccupantTypes = getLotOccupantTypes();
     const lotTypes = getLotTypes();
     const lotStatuses = getLotStatuses();
     const maps = getMaps();
@@ -28,6 +29,7 @@ export const handler = (request, response) => {
             "  Record",
         lotOccupancy,
         occupancyTypes,
+        lotOccupantTypes,
         lotTypes,
         lotStatuses,
         maps,

handlers/lotOccupancies-get/new.ts

@@ -2,7 +2,7 @@ import type { RequestHandler } from "express";
 
 import { dateToInteger, dateToString } from "@cityssm/expressjs-server-js/dateTimeFns.js";
 
-import { getLotStatuses, getLotTypes, getOccupancyTypes } from "../../helpers/functions.cache.js";
+import { getLotOccupantTypes, getLotStatuses, getLotTypes, getOccupancyTypes } from "../../helpers/functions.cache.js";
 
 import { getLot } from "../../helpers/lotOccupancyDB/getLot.js";
 import { getMaps } from "../../helpers/lotOccupancyDB/getMaps.js";
@@ -28,6 +28,7 @@ export const handler: RequestHandler = (request, response) => {
     }
 
     const occupancyTypes = getOccupancyTypes();
+    const lotOccupantTypes = getLotOccupantTypes();
     const lotTypes = getLotTypes();
     const lotStatuses = getLotStatuses();
     const maps = getMaps();
@@ -42,6 +43,7 @@ export const handler: RequestHandler = (request, response) => {
         lotOccupancy,
 
         occupancyTypes,
+        lotOccupantTypes,
         lotTypes,
         lotStatuses,
         maps,

helpers/lotOccupancyDB/addLotOccupancy.d.ts

@@ -7,6 +7,16 @@ interface AddLotOccupancyForm {
     occupancyEndDateString: string;
     occupancyTypeFieldIds?: string;
     [lotOccupancyFieldValue_occupancyTypeFieldId: string]: unknown;
+    lotOccupantTypeId: string;
+    occupantName?: string;
+    occupantAddress1?: string;
+    occupantAddress2?: string;
+    occupantCity?: string;
+    occupantProvince?: string;
+    occupantPostalCode?: string;
+    occupantPhoneNumber?: string;
+    occupantEmailAddress?: string;
+    occupantComment?: string;
 }
 export declare const addLotOccupancy: (lotOccupancyForm: AddLotOccupancyForm, requestSession: recordTypes.PartialSession, connectedDatabase?: sqlite.Database) => number;
 export default addLotOccupancy;

helpers/lotOccupancyDB/addLotOccupancy.js

@@ -2,6 +2,7 @@ import sqlite from "better-sqlite3";
 import { lotOccupancyDB as databasePath } from "../../data/databasePaths.js";
 import * as dateTimeFunctions from "@cityssm/expressjs-server-js/dateTimeFns.js";
 import { addOrUpdateLotOccupancyField } from "./addOrUpdateLotOccupancyField.js";
+import addLotOccupancyOccupant from "./addLotOccupancyOccupant.js";
 export const addLotOccupancy = (lotOccupancyForm, requestSession, connectedDatabase) => {
     const database = connectedDatabase || sqlite(databasePath);
     const rightNowMillis = Date.now();
@@ -31,6 +32,21 @@ export const addLotOccupancy = (lotOccupancyForm, requestSession, connectedDatab
             }, requestSession, database);
         }
     }
+    if (lotOccupancyForm.lotOccupantTypeId) {
+        addLotOccupancyOccupant({
+            lotOccupancyId,
+            lotOccupantTypeId: lotOccupancyForm.lotOccupantTypeId,
+            occupantName: lotOccupancyForm.occupantName,
+            occupantAddress1: lotOccupancyForm.occupantAddress1,
+            occupantAddress2: lotOccupancyForm.occupantAddress2,
+            occupantCity: lotOccupancyForm.occupantCity,
+            occupantProvince: lotOccupancyForm.occupantProvince,
+            occupantPostalCode: lotOccupancyForm.occupantPostalCode,
+            occupantPhoneNumber: lotOccupancyForm.occupantPhoneNumber,
+            occupantEmailAddress: lotOccupancyForm.occupantEmailAddress,
+            occupantComment: lotOccupancyForm.occupantComment
+        }, requestSession, database);
+    }
     if (!connectedDatabase) {
         database.close();
     }

helpers/lotOccupancyDB/addLotOccupancy.ts

@@ -7,6 +7,7 @@ import * as dateTimeFunctions from "@cityssm/expressjs-server-js/dateTimeFns.js"
 import { addOrUpdateLotOccupancyField } from "./addOrUpdateLotOccupancyField.js";
 
 import type * as recordTypes from "../../types/recordTypes";
+import addLotOccupancyOccupant from "./addLotOccupancyOccupant.js";
 
 interface AddLotOccupancyForm {
     occupancyTypeId: string | number;
@@ -17,6 +18,17 @@ interface AddLotOccupancyForm {
 
     occupancyTypeFieldIds?: string;
     [lotOccupancyFieldValue_occupancyTypeFieldId: string]: unknown;
+
+    lotOccupantTypeId: string;
+    occupantName?: string;
+    occupantAddress1?: string;
+    occupantAddress2?: string;
+    occupantCity?: string;
+    occupantProvince?: string;
+    occupantPostalCode?: string;
+    occupantPhoneNumber?: string;
+    occupantEmailAddress?: string;
+    occupantComment?: string;
 }
 
 export const addLotOccupancy = (
@@ -80,6 +92,26 @@ export const addLotOccupancy = (
         }
     }
 
+    if (lotOccupancyForm.lotOccupantTypeId) {
+        addLotOccupancyOccupant(
+            {
+                lotOccupancyId,
+                lotOccupantTypeId: lotOccupancyForm.lotOccupantTypeId,
+                occupantName: lotOccupancyForm.occupantName,
+                occupantAddress1: lotOccupancyForm.occupantAddress1,
+                occupantAddress2: lotOccupancyForm.occupantAddress2,
+                occupantCity: lotOccupancyForm.occupantCity,
+                occupantProvince: lotOccupancyForm.occupantProvince,
+                occupantPostalCode: lotOccupancyForm.occupantPostalCode,
+                occupantPhoneNumber: lotOccupancyForm.occupantPhoneNumber,
+                occupantEmailAddress: lotOccupancyForm.occupantEmailAddress,
+                occupantComment: lotOccupancyForm.occupantComment
+            },
+            requestSession,
+            database
+        );
+    }
+
     if (!connectedDatabase) {
         database.close();
     }

public-typescript/lotOccupancyEdit.js

@@ -466,7 +466,16 @@ Object.defineProperty(exports, "__esModule", { value: true });
         endDatePicker.refresh();
     });
     los.initializeUnlockFieldButtons(formElement);
-    if (!isCreate) {
+    if (isCreate) {
+        const lotOccupantTypeIdElement = document.querySelector("#lotOccupancy--lotOccupantTypeId");
+        lotOccupantTypeIdElement.addEventListener("change", () => {
+            const occupantFields = formElement.querySelectorAll("[data-table='LotOccupancyOccupant']");
+            for (const occupantField of occupantFields) {
+                occupantField.disabled = (lotOccupantTypeIdElement.value === "");
+            }
+        });
+    }
+    else {
         let lotOccupancyOccupants = exports.lotOccupancyOccupants;
         delete exports.lotOccupancyOccupants;
         const openEditLotOccupancyOccupant = (clickEvent) => {

public-typescript/lotOccupancyEdit.ts

@@ -694,7 +694,20 @@ declare const bulmaJS: BulmaJS;
      * Occupants
      */
 
-    if (!isCreate) {
+    if (isCreate) {
+
+        const lotOccupantTypeIdElement = document.querySelector("#lotOccupancy--lotOccupantTypeId") as HTMLSelectElement;
+
+        lotOccupantTypeIdElement.addEventListener("change", () => {
+
+            const occupantFields = formElement.querySelectorAll("[data-table='LotOccupancyOccupant']") as NodeListOf<HTMLInputElement | HTMLTextAreaElement>;
+
+            for (const occupantField of occupantFields) {
+                occupantField.disabled = (lotOccupantTypeIdElement.value === "");
+            }
+        });
+
+    } else {
         let lotOccupancyOccupants: recordTypes.LotOccupancyOccupant[] =
             exports.lotOccupancyOccupants;
 

views/lotOccupancy-edit.ejs

@@ -261,6 +261,105 @@
                 </div>
             </div>
         </div>
+        <% if (isCreate) { %>
+            <div class="panel-block is-block">
+                <h3 class="title is-4"><%= configFunctions.getProperty("aliases.occupant") %></h3>
+                <div class="columns">
+                    <div class="column">
+                        <div class="field">
+                            <label class="label" for="lotOccupancy--lotOccupantTypeId">
+                                <%= configFunctions.getProperty("aliases.occupant") %> Type
+                            </label>
+                            <div class="control">
+                                <div class="select is-fullwidth">
+                                    <select id="lotOccupancy--lotOccupantTypeId" name="lotOccupantTypeId">
+                                        <option value="">(Select a Type to Create a <%= configFunctions.getProperty("aliases.occupant") %>)</option>
+                                        <% for (const lotOccupantType of lotOccupantTypes) { %>
+                                            <option value="<%= lotOccupantType.lotOccupantTypeId %>"><%= lotOccupantType.lotOccupantType %></option>
+                                        <% } %>
+                                    </select>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="field">
+                            <label class="label" for="lotOccupancy--occupantName">
+                                <%= configFunctions.getProperty("aliases.occupant") %> Name
+                            </label>
+                            <div class="control">
+                                <input class="input" id="lotOccupancy--occupantName" data-table="LotOccupancyOccupant" name="occupantName" type="text" maxlength="200" autocomplete="off" required disabled />
+                            </div>
+                        </div>
+                        <div class="field">
+                            <label class="label" for="lotOccupancy--occupantAddress1">Address</label>
+                            <div class="control">
+                                <input class="input" id="lotOccupancy--occupantAddress1" data-table="LotOccupancyOccupant" name="occupantAddress1" type="text" maxlength="50" placeholder="Line 1" autocomplete="off" disabled />
+                            </div>
+                        </div>
+                        <div class="field">
+                            <div class="control">
+                                <input class="input" id="lotOccupancy--occupantAddress2" data-table="LotOccupancyOccupant" name="occupantAddress2" type="text" maxlength="50" placeholder="Line 2" autocomplete="off" aria-label="Address Line 2" disabled />
+                            </div>
+                        </div>
+                        <div class="columns">
+                            <div class="column">
+                                <div class="field">
+                                    <label class="label" for="lotOccupancy--occupantCity">City</label>
+                                    <div class="control">
+                                        <input class="input" id="lotOccupancy--occupantCity" data-table="LotOccupancyOccupant" name="occupantCity" type="text" maxlength="20" value="<%= configFunctions.getProperty("settings.lotOccupancy.occupantCityDefault") %>" disabled />
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="column">
+                                <div class="field">
+                                    <label class="label" for="lotOccupancy--occupantProvince">Province</label>
+                                    <div class="control">
+                                        <input class="input" id="lotOccupancy--occupantProvince" data-table="LotOccupancyOccupant" name="occupantProvince" type="text" maxlength="2" value="<%= configFunctions.getProperty("settings.lotOccupancy.occupantProvinceDefault") %>" disabled />
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="column">
+                                <div class="field">
+                                    <label class="label" for="lotOccupancy--occupantPostalCode">Postal Code</label>
+                                    <div class="control">
+                                        <input class="input" id="lotOccupancy--occupantPostalCode" data-table="LotOccupancyOccupant" name="occupantPostalCode" type="text" maxlength="7" autocomplete="off" disabled />
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="columns">
+                            <div class="column">
+                                <div class="field">
+                                    <label class="label" for="lotOccupancy--occupantPhoneNumber">Phone Number</label>
+                                    <div class="control">
+                                        <input class="input" id="lotOccupancy--occupantPhoneNumber" data-table="LotOccupancyOccupant" name="occupantPhoneNumber" type="text" maxlength="30" autocomplete="off" disabled />
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="column">
+                                <div class="field">
+                                    <label class="label" for="lotOccupancy--occupantEmailAddress">Email Address</label>
+                                    <div class="control">
+                                        <input class="input" id="lotOccupancy--occupantEmailAddress" data-table="LotOccupancyOccupant" name="occupantEmailAddress" type="email" maxlength="200" autocomplete="off" disabled />
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="field">
+                            <label class="label" for="lotOccupancy--occupantComment">Comment</label>
+                            <div class="control">
+                                <textarea class="textarea" id="lotOccupancy--occupantComment" data-table="LotOccupancyOccupant" name="occupantComment" disabled></textarea>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="column">
+                        <div class="message is-info">
+                            <p class="message-body">Additional <%= configFunctions.getProperty("aliases.occupants").toLowerCase() %> can be added after the record has been created.</p>
+                        </div>
+                    </div>
+                </div>
+               
+            </div>
+        <% } %>
         <div class="panel-block is-justify-content-right is-hidden-print">
             <button class="button is-primary" type="submit">
                 <span class="icon is-small"><i class="fas fa-save" aria-hidden="true"></i></span>