polish fees admin

- more mobile friendly
- faster sorting with shift key

handlers/admin-post/doMoveFeeCategoryDown.js

@@ -1,7 +1,9 @@
-import { moveFeeCategoryDown } from "../../helpers/lotOccupancyDB/moveFeeCategoryDown.js";
+import { moveFeeCategoryDown, moveFeeCategoryDownToBottom } from "../../helpers/lotOccupancyDB/moveFeeCategoryDown.js";
 import { getFeeCategories } from "../../helpers/lotOccupancyDB/getFeeCategories.js";
 export const handler = async (request, response) => {
-    const success = moveFeeCategoryDown(request.body.feeCategoryId);
+    const success = request.body.moveToBottom === "1"
+        ? moveFeeCategoryDownToBottom(request.body.feeCategoryId)
+        : moveFeeCategoryDown(request.body.feeCategoryId);
     const feeCategories = getFeeCategories({}, {
         includeFees: true
     });

handlers/admin-post/doMoveFeeCategoryDown.ts

@@ -1,11 +1,17 @@
 import type { RequestHandler } from "express";
 
-import { moveFeeCategoryDown } from "../../helpers/lotOccupancyDB/moveFeeCategoryDown.js";
+import {
+    moveFeeCategoryDown,
+    moveFeeCategoryDownToBottom
+} from "../../helpers/lotOccupancyDB/moveFeeCategoryDown.js";
 
 import { getFeeCategories } from "../../helpers/lotOccupancyDB/getFeeCategories.js";
 
 export const handler: RequestHandler = async (request, response) => {
-    const success = moveFeeCategoryDown(request.body.feeCategoryId);
+    const success =
+        request.body.moveToBottom === "1"
+            ? moveFeeCategoryDownToBottom(request.body.feeCategoryId)
+            : moveFeeCategoryDown(request.body.feeCategoryId);
 
     const feeCategories = getFeeCategories(
         {},

handlers/admin-post/doMoveFeeCategoryUp.js

@@ -1,7 +1,9 @@
-import { moveFeeCategoryUp } from "../../helpers/lotOccupancyDB/moveFeeCategoryUp.js";
+import { moveFeeCategoryUp, moveFeeCategoryUpToTop } from "../../helpers/lotOccupancyDB/moveFeeCategoryUp.js";
 import { getFeeCategories } from "../../helpers/lotOccupancyDB/getFeeCategories.js";
 export const handler = async (request, response) => {
-    const success = moveFeeCategoryUp(request.body.feeCategoryId);
+    const success = request.body.moveToTop === "1"
+        ? moveFeeCategoryUpToTop(request.body.feeCategoryId)
+        : moveFeeCategoryUp(request.body.feeCategoryId);
     const feeCategories = getFeeCategories({}, {
         includeFees: true
     });

handlers/admin-post/doMoveFeeCategoryUp.ts

@@ -1,11 +1,17 @@
 import type { RequestHandler } from "express";
 
-import { moveFeeCategoryUp } from "../../helpers/lotOccupancyDB/moveFeeCategoryUp.js";
+import {
+    moveFeeCategoryUp,
+    moveFeeCategoryUpToTop
+} from "../../helpers/lotOccupancyDB/moveFeeCategoryUp.js";
 
 import { getFeeCategories } from "../../helpers/lotOccupancyDB/getFeeCategories.js";
 
 export const handler: RequestHandler = async (request, response) => {
-    const success = moveFeeCategoryUp(request.body.feeCategoryId);
+    const success =
+        request.body.moveToTop === "1"
+            ? moveFeeCategoryUpToTop(request.body.feeCategoryId)
+            : moveFeeCategoryUp(request.body.feeCategoryId);
 
     const feeCategories = getFeeCategories(
         {},

handlers/admin-post/doMoveFeeDown.js

@@ -1,7 +1,9 @@
-import { moveFeeDown } from "../../helpers/lotOccupancyDB/moveFeeDown.js";
+import { moveFeeDown, moveFeeDownToBottom } from "../../helpers/lotOccupancyDB/moveFeeDown.js";
 import { getFeeCategories } from "../../helpers/lotOccupancyDB/getFeeCategories.js";
 export const handler = async (request, response) => {
-    const success = moveFeeDown(request.body.feeId);
+    const success = request.body.moveToBottom === "1"
+        ? moveFeeDownToBottom(request.body.feeId)
+        : moveFeeDown(request.body.feeId);
     const feeCategories = getFeeCategories({}, {
         includeFees: true
     });

handlers/admin-post/doMoveFeeDown.ts

@@ -1,11 +1,14 @@
 import type { RequestHandler } from "express";
 
-import { moveFeeDown } from "../../helpers/lotOccupancyDB/moveFeeDown.js";
+import { moveFeeDown, moveFeeDownToBottom } from "../../helpers/lotOccupancyDB/moveFeeDown.js";
 
 import { getFeeCategories } from "../../helpers/lotOccupancyDB/getFeeCategories.js";
 
 export const handler: RequestHandler = async (request, response) => {
-    const success = moveFeeDown(request.body.feeId);
+    const success =
+        request.body.moveToBottom === "1"
+            ? moveFeeDownToBottom(request.body.feeId)
+            : moveFeeDown(request.body.feeId);
 
     const feeCategories = getFeeCategories(
         {},

handlers/admin-post/doMoveFeeUp.js

@@ -1,7 +1,9 @@
-import { moveFeeUp } from "../../helpers/lotOccupancyDB/moveFeeUp.js";
+import { moveFeeUp, moveFeeUpToTop } from "../../helpers/lotOccupancyDB/moveFeeUp.js";
 import { getFeeCategories } from "../../helpers/lotOccupancyDB/getFeeCategories.js";
 export const handler = async (request, response) => {
-    const success = moveFeeUp(request.body.feeId);
+    const success = request.body.moveToTop === "1"
+        ? moveFeeUpToTop(request.body.feeId)
+        : moveFeeUp(request.body.feeId);
     const feeCategories = getFeeCategories({}, {
         includeFees: true
     });

handlers/admin-post/doMoveFeeUp.ts

@@ -1,11 +1,14 @@
 import type { RequestHandler } from "express";
 
-import { moveFeeUp } from "../../helpers/lotOccupancyDB/moveFeeUp.js";
+import { moveFeeUp, moveFeeUpToTop } from "../../helpers/lotOccupancyDB/moveFeeUp.js";
 
 import { getFeeCategories } from "../../helpers/lotOccupancyDB/getFeeCategories.js";
 
 export const handler: RequestHandler = async (request, response) => {
-    const success = moveFeeUp(request.body.feeId);
+    const success =
+        request.body.moveToTop === "1"
+            ? moveFeeUpToTop(request.body.feeId)
+            : moveFeeUp(request.body.feeId);
 
     const feeCategories = getFeeCategories(
         {},

helpers/lotOccupancyDB/addFee.js

@@ -14,7 +14,7 @@ export const addFee = (feeForm, requestSession) => {
         " recordCreate_userName, recordCreate_timeMillis," +
         " recordUpdate_userName, recordUpdate_timeMillis)" +
         " values (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)")
-        .run(feeForm.feeCategoryId, feeForm.feeName, feeForm.feeDescription, feeForm.occupancyTypeId || undefined, feeForm.lotTypeId || undefined, feeForm.feeAmount || undefined, feeForm.feeFunction || undefined, feeForm.taxAmount || undefined, feeForm.taxPercentage || undefined, feeForm.includeQuantity ? 1 : 0, feeForm.quantityUnit, feeForm.isRequired ? 1 : 0, feeForm.orderNumber || 0, requestSession.user.userName, rightNowMillis, requestSession.user.userName, rightNowMillis);
+        .run(feeForm.feeCategoryId, feeForm.feeName, feeForm.feeDescription, feeForm.occupancyTypeId || undefined, feeForm.lotTypeId || undefined, feeForm.feeAmount || undefined, feeForm.feeFunction || undefined, feeForm.taxAmount || undefined, feeForm.taxPercentage || undefined, feeForm.includeQuantity ? 1 : 0, feeForm.quantityUnit, feeForm.isRequired ? 1 : 0, feeForm.orderNumber || -1, requestSession.user.userName, rightNowMillis, requestSession.user.userName, rightNowMillis);
     database.close();
     return result.lastInsertRowid;
 };

helpers/lotOccupancyDB/addFee.ts

@@ -53,7 +53,7 @@ export const addFee = (
             feeForm.includeQuantity ? 1 : 0,
             feeForm.quantityUnit,
             feeForm.isRequired ? 1 : 0,
-            feeForm.orderNumber || 0,
+            feeForm.orderNumber || -1,
             requestSession.user.userName,
             rightNowMillis,
             requestSession.user.userName,

helpers/lotOccupancyDB/addFeeCategory.js

@@ -9,7 +9,7 @@ export const addFeeCategory = (feeCategoryForm, requestSession) => {
         " recordCreate_userName, recordCreate_timeMillis," +
         " recordUpdate_userName, recordUpdate_timeMillis)" +
         " values (?, ?, ?, ?, ?, ?)")
-        .run(feeCategoryForm.feeCategory, feeCategoryForm.orderNumber || 0, requestSession.user.userName, rightNowMillis, requestSession.user.userName, rightNowMillis);
+        .run(feeCategoryForm.feeCategory, feeCategoryForm.orderNumber || -1, requestSession.user.userName, rightNowMillis, requestSession.user.userName, rightNowMillis);
     database.close();
     return result.lastInsertRowid;
 };

helpers/lotOccupancyDB/addFeeCategory.ts

@@ -26,7 +26,7 @@ export const addFeeCategory = (
         )
         .run(
             feeCategoryForm.feeCategory,
-            feeCategoryForm.orderNumber || 0,
+            feeCategoryForm.orderNumber || -1,
             requestSession.user.userName,
             rightNowMillis,
             requestSession.user.userName,

helpers/lotOccupancyDB/getFee.d.ts

@@ -1,3 +1,4 @@
+import sqlite from "better-sqlite3";
 import type * as recordTypes from "../../types/recordTypes";
-export declare const getFee: (feeId: number | string) => recordTypes.Fee;
+export declare const getFee: (feeId: number | string, connectedDatabase?: sqlite.Database) => recordTypes.Fee;
 export default getFee;

helpers/lotOccupancyDB/getFee.js

@@ -1,7 +1,8 @@
 import sqlite from "better-sqlite3";
 import { lotOccupancyDB as databasePath } from "../../data/databasePaths.js";
-export const getFee = (feeId) => {
+export const getFee = (feeId, connectedDatabase) => {
-    const database = sqlite(databasePath, {
+    const database = connectedDatabase ||
+        sqlite(databasePath, {
             readonly: true
         });
     const fee = database
@@ -13,7 +14,7 @@ export const getFee = (feeId) => {
         " ifnull(f.feeAmount, 0) as feeAmount, f.feeFunction," +
         " f.taxAmount, f.taxPercentage," +
         " f.includeQuantity, f.quantityUnit," +
-        " f.isRequired" +
+        " f.isRequired, f.orderNumber" +
         " from Fees f" +
         " left join FeeCategories c on f.feeCategoryId = c.feeCategoryId" +
         " left join OccupancyTypes o on f.occupancyTypeId = o.occupancyTypeId" +
@@ -21,7 +22,9 @@ export const getFee = (feeId) => {
         " where f.recordDelete_timeMillis is null" +
         " and f.feeId = ?")
         .get(feeId);
+    if (!connectedDatabase) {
         database.close();
+    }
     return fee;
 };
 export default getFee;

helpers/lotOccupancyDB/getFee.ts

@@ -4,8 +4,13 @@ import { lotOccupancyDB as databasePath } from "../../data/databasePaths.js";
 
 import type * as recordTypes from "../../types/recordTypes";
 
-export const getFee = (feeId: number | string): recordTypes.Fee => {
+export const getFee = (
-    const database = sqlite(databasePath, {
+    feeId: number | string,
+    connectedDatabase?: sqlite.Database
+): recordTypes.Fee => {
+    const database =
+        connectedDatabase ||
+        sqlite(databasePath, {
             readonly: true
         });
 
@@ -19,7 +24,7 @@ export const getFee = (feeId: number | string): recordTypes.Fee => {
                 " ifnull(f.feeAmount, 0) as feeAmount, f.feeFunction," +
                 " f.taxAmount, f.taxPercentage," +
                 " f.includeQuantity, f.quantityUnit," +
-                " f.isRequired" +
+                " f.isRequired, f.orderNumber" +
                 " from Fees f" +
                 " left join FeeCategories c on f.feeCategoryId = c.feeCategoryId" +
                 " left join OccupancyTypes o on f.occupancyTypeId = o.occupancyTypeId" +
@@ -29,7 +34,9 @@ export const getFee = (feeId: number | string): recordTypes.Fee => {
         )
         .get(feeId);
 
+    if (!connectedDatabase) {
         database.close();
+    }
 
     return fee;
 };

helpers/lotOccupancyDB/moveFeeCategoryDown.d.ts

@@ -1,2 +1,3 @@
 export declare const moveFeeCategoryDown: (feeCategoryId: number | string) => boolean;
+export declare const moveFeeCategoryDownToBottom: (feeCategoryId: number | string) => boolean;
 export default moveFeeCategoryDown;

helpers/lotOccupancyDB/moveFeeCategoryDown.js

@@ -3,9 +3,7 @@ import { lotOccupancyDB as databasePath } from "../../data/databasePaths.js";
 export const moveFeeCategoryDown = (feeCategoryId) => {
     const database = sqlite(databasePath);
     const currentOrderNumber = database
-        .prepare("select orderNumber" +
+        .prepare("select orderNumber from FeeCategories where feeCategoryId = ?")
-        " from FeeCategories" +
-        " where feeCategoryId = ?")
         .get(feeCategoryId).orderNumber;
     database
         .prepare("update FeeCategories" +
@@ -14,11 +12,33 @@ export const moveFeeCategoryDown = (feeCategoryId) => {
         " and orderNumber = ? + 1")
         .run(currentOrderNumber);
     const result = database
-        .prepare("update FeeCategories" +
+        .prepare("update FeeCategories set orderNumber = ? + 1 where feeCategoryId = ?")
-        " set orderNumber = ? + 1" +
-        " where feeCategoryId = ?")
         .run(currentOrderNumber, feeCategoryId);
     database.close();
     return result.changes > 0;
 };
+export const moveFeeCategoryDownToBottom = (feeCategoryId) => {
+    const database = sqlite(databasePath);
+    const currentOrderNumber = database
+        .prepare("select orderNumber from FeeCategories where feeCategoryId = ?")
+        .get(feeCategoryId).orderNumber;
+    const maxOrderNumber = database
+        .prepare("select max(orderNumber) as maxOrderNumber" +
+        " from FeeCategories" +
+        " where recordDelete_timeMillis is null")
+        .get().maxOrderNumber;
+    if (currentOrderNumber !== maxOrderNumber) {
+        database
+            .prepare("update FeeCategories set orderNumber = ? + 1 where feeCategoryId = ?")
+            .run(maxOrderNumber, feeCategoryId);
+        database
+            .prepare("update FeeCategories" +
+            " set orderNumber = orderNumber - 1" +
+            " where recordDelete_timeMillis is null" +
+            " and orderNumber > ?")
+            .run(currentOrderNumber);
+    }
+    database.close();
+    return true;
+};
 export default moveFeeCategoryDown;

helpers/lotOccupancyDB/moveFeeCategoryDown.ts

@@ -2,17 +2,11 @@ import sqlite from "better-sqlite3";
 
 import { lotOccupancyDB as databasePath } from "../../data/databasePaths.js";
 
-export const moveFeeCategoryDown = (
+export const moveFeeCategoryDown = (feeCategoryId: number | string): boolean => {
-    feeCategoryId: number | string
-): boolean => {
     const database = sqlite(databasePath);
 
     const currentOrderNumber: number = database
-        .prepare(
+        .prepare("select orderNumber from FeeCategories where feeCategoryId = ?")
-            "select orderNumber" +
-                " from FeeCategories" +
-                " where feeCategoryId = ?"
-        )
         .get(feeCategoryId).orderNumber;
 
     database
@@ -25,11 +19,7 @@ export const moveFeeCategoryDown = (
         .run(currentOrderNumber);
 
     const result = database
-        .prepare(
+        .prepare("update FeeCategories set orderNumber = ? + 1 where feeCategoryId = ?")
-            "update FeeCategories" +
-                " set orderNumber = ? + 1" +
-                " where feeCategoryId = ?"
-        )
         .run(currentOrderNumber, feeCategoryId);
 
     database.close();
@@ -37,4 +27,39 @@ export const moveFeeCategoryDown = (
     return result.changes > 0;
 };
 
+export const moveFeeCategoryDownToBottom = (feeCategoryId: number | string): boolean => {
+    const database = sqlite(databasePath);
+
+    const currentOrderNumber: number = database
+        .prepare("select orderNumber from FeeCategories where feeCategoryId = ?")
+        .get(feeCategoryId).orderNumber;
+
+    const maxOrderNumber: number = database
+        .prepare(
+            "select max(orderNumber) as maxOrderNumber" +
+                " from FeeCategories" +
+                " where recordDelete_timeMillis is null"
+        )
+        .get().maxOrderNumber;
+
+    if (currentOrderNumber !== maxOrderNumber) {
+        database
+            .prepare("update FeeCategories set orderNumber = ? + 1 where feeCategoryId = ?")
+            .run(maxOrderNumber, feeCategoryId);
+
+        database
+            .prepare(
+                "update FeeCategories" +
+                    " set orderNumber = orderNumber - 1" +
+                    " where recordDelete_timeMillis is null" +
+                    " and orderNumber > ?"
+            )
+            .run(currentOrderNumber);
+    }
+
+    database.close();
+
+    return true;
+};
+
 export default moveFeeCategoryDown;

helpers/lotOccupancyDB/moveFeeCategoryUp.d.ts

@@ -1,2 +1,3 @@
 export declare const moveFeeCategoryUp: (feeCategoryId: number | string) => boolean;
+export declare const moveFeeCategoryUpToTop: (feeCategoryId: number | string) => boolean;
 export default moveFeeCategoryUp;

helpers/lotOccupancyDB/moveFeeCategoryUp.js

@@ -3,9 +3,7 @@ import { lotOccupancyDB as databasePath } from "../../data/databasePaths.js";
 export const moveFeeCategoryUp = (feeCategoryId) => {
     const database = sqlite(databasePath);
     const currentOrderNumber = database
-        .prepare("select orderNumber" +
+        .prepare("select orderNumber from FeeCategories where feeCategoryId = ?")
-        " from FeeCategories" +
-        " where feeCategoryId = ?")
         .get(feeCategoryId).orderNumber;
     if (currentOrderNumber <= 0) {
         database.close();
@@ -18,11 +16,28 @@ export const moveFeeCategoryUp = (feeCategoryId) => {
         " and orderNumber = ? - 1")
         .run(currentOrderNumber);
     const result = database
-        .prepare("update FeeCategories" +
+        .prepare("update FeeCategories set orderNumber = ? - 1 where feeCategoryId = ?")
-        " set orderNumber = ? - 1" +
-        " where feeCategoryId = ?")
         .run(currentOrderNumber, feeCategoryId);
     database.close();
     return result.changes > 0;
 };
+export const moveFeeCategoryUpToTop = (feeCategoryId) => {
+    const database = sqlite(databasePath);
+    const currentOrderNumber = database
+        .prepare("select orderNumber from FeeCategories where feeCategoryId = ?")
+        .get(feeCategoryId).orderNumber;
+    if (currentOrderNumber > 0) {
+        database
+            .prepare("update FeeCategories set orderNumber = -1 where feeCategoryId = ?")
+            .run(feeCategoryId);
+        database
+            .prepare("update FeeCategories" +
+            " set orderNumber = orderNumber + 1" +
+            " where recordDelete_timeMillis is null" +
+            " and orderNumber < ?")
+            .run(currentOrderNumber);
+    }
+    database.close();
+    return true;
+};
 export default moveFeeCategoryUp;

helpers/lotOccupancyDB/moveFeeCategoryUp.ts

@@ -6,11 +6,7 @@ export const moveFeeCategoryUp = (feeCategoryId: number | string): boolean => {
     const database = sqlite(databasePath);
 
     const currentOrderNumber: number = database
-        .prepare(
+        .prepare("select orderNumber from FeeCategories where feeCategoryId = ?")
-            "select orderNumber" +
-                " from FeeCategories" +
-                " where feeCategoryId = ?"
-        )
         .get(feeCategoryId).orderNumber;
 
     if (currentOrderNumber <= 0) {
@@ -28,11 +24,7 @@ export const moveFeeCategoryUp = (feeCategoryId: number | string): boolean => {
         .run(currentOrderNumber);
 
     const result = database
-        .prepare(
+        .prepare("update FeeCategories set orderNumber = ? - 1 where feeCategoryId = ?")
-            "update FeeCategories" +
-                " set orderNumber = ? - 1" +
-                " where feeCategoryId = ?"
-        )
         .run(currentOrderNumber, feeCategoryId);
 
     database.close();
@@ -40,4 +32,31 @@ export const moveFeeCategoryUp = (feeCategoryId: number | string): boolean => {
     return result.changes > 0;
 };
 
+export const moveFeeCategoryUpToTop = (feeCategoryId: number | string): boolean => {
+    const database = sqlite(databasePath);
+
+    const currentOrderNumber: number = database
+        .prepare("select orderNumber from FeeCategories where feeCategoryId = ?")
+        .get(feeCategoryId).orderNumber;
+
+    if (currentOrderNumber > 0) {
+        database
+            .prepare("update FeeCategories set orderNumber = -1 where feeCategoryId = ?")
+            .run(feeCategoryId);
+
+        database
+            .prepare(
+                "update FeeCategories" +
+                    " set orderNumber = orderNumber + 1" +
+                    " where recordDelete_timeMillis is null" +
+                    " and orderNumber < ?"
+            )
+            .run(currentOrderNumber);
+    }
+
+    database.close();
+
+    return true;
+};
+
 export default moveFeeCategoryUp;

helpers/lotOccupancyDB/moveFeeDown.d.ts

@@ -1,2 +1,3 @@
 export declare const moveFeeDown: (feeId: number | string) => boolean;
+export declare const moveFeeDownToBottom: (feeId: number | string) => boolean;
 export default moveFeeDown;

helpers/lotOccupancyDB/moveFeeDown.js

@@ -1,20 +1,44 @@
 import sqlite from "better-sqlite3";
 import { lotOccupancyDB as databasePath } from "../../data/databasePaths.js";
+import { getFee } from "./getFee.js";
 export const moveFeeDown = (feeId) => {
     const database = sqlite(databasePath);
-    const currentOrderNumber = database
+    const currentFee = getFee(feeId, database);
-        .prepare("select orderNumber" + " from Fees" + " where feeId = ?")
-        .get(feeId).orderNumber;
     database
         .prepare("update Fees" +
         " set orderNumber = orderNumber - 1" +
         " where recordDelete_timeMillis is null" +
+        " and feeCategoryId = ?" +
         " and orderNumber = ? + 1")
-        .run(currentOrderNumber);
+        .run(currentFee.feeCategoryId, currentFee.orderNumber);
     const result = database
-        .prepare("update Fees" + " set orderNumber = ? + 1" + " where feeId = ?")
+        .prepare("update Fees set orderNumber = ? + 1 where feeId = ?")
-        .run(currentOrderNumber, feeId);
+        .run(currentFee.orderNumber, feeId);
     database.close();
     return result.changes > 0;
 };
+export const moveFeeDownToBottom = (feeId) => {
+    const database = sqlite(databasePath);
+    const currentFee = getFee(feeId, database);
+    const maxOrderNumber = database
+        .prepare("select max(orderNumber) as maxOrderNumber" +
+        " from Fees" +
+        " where recordDelete_timeMillis is null" +
+        " and feeCategoryId = ?")
+        .get(currentFee.feeCategoryId).maxOrderNumber;
+    if (currentFee.orderNumber !== maxOrderNumber) {
+        database
+            .prepare("update Fees set orderNumber = ? + 1 where feeId = ?")
+            .run(maxOrderNumber, feeId);
+        database
+            .prepare("update Fees" +
+            " set orderNumber = orderNumber - 1" +
+            " where recordDelete_timeMillis is null" +
+            " and feeCategoryId = ?" +
+            " and orderNumber > ?")
+            .run(currentFee.feeCategoryId, currentFee.orderNumber);
+    }
+    database.close();
+    return true;
+};
 export default moveFeeDown;

helpers/lotOccupancyDB/moveFeeDown.ts

@@ -2,31 +2,65 @@ import sqlite from "better-sqlite3";
 
 import { lotOccupancyDB as databasePath } from "../../data/databasePaths.js";
 
+import { getFee } from "./getFee.js";
+
 export const moveFeeDown = (feeId: number | string): boolean => {
     const database = sqlite(databasePath);
 
-    const currentOrderNumber: number = database
+    const currentFee = getFee(feeId, database);
-        .prepare("select orderNumber" + " from Fees" + " where feeId = ?")
-        .get(feeId).orderNumber;
 
     database
         .prepare(
             "update Fees" +
                 " set orderNumber = orderNumber - 1" +
                 " where recordDelete_timeMillis is null" +
+                " and feeCategoryId = ?" +
                 " and orderNumber = ? + 1"
         )
-        .run(currentOrderNumber);
+        .run(currentFee.feeCategoryId, currentFee.orderNumber);
 
     const result = database
-        .prepare(
+        .prepare("update Fees set orderNumber = ? + 1 where feeId = ?")
-            "update Fees" + " set orderNumber = ? + 1" + " where feeId = ?"
+        .run(currentFee.orderNumber, feeId);
-        )
-        .run(currentOrderNumber, feeId);
 
     database.close();
 
     return result.changes > 0;
 };
 
+export const moveFeeDownToBottom = (feeId: number | string): boolean => {
+    const database = sqlite(databasePath);
+
+    const currentFee = getFee(feeId, database);
+
+    const maxOrderNumber: number = database
+        .prepare(
+            "select max(orderNumber) as maxOrderNumber" +
+                " from Fees" +
+                " where recordDelete_timeMillis is null" +
+                " and feeCategoryId = ?"
+        )
+        .get(currentFee.feeCategoryId).maxOrderNumber;
+
+    if (currentFee.orderNumber !== maxOrderNumber) {
+        database
+            .prepare("update Fees set orderNumber = ? + 1 where feeId = ?")
+            .run(maxOrderNumber, feeId);
+
+        database
+            .prepare(
+                "update Fees" +
+                    " set orderNumber = orderNumber - 1" +
+                    " where recordDelete_timeMillis is null" +
+                    " and feeCategoryId = ?" +
+                    " and orderNumber > ?"
+            )
+            .run(currentFee.feeCategoryId, currentFee.orderNumber);
+    }
+
+    database.close();
+
+    return true;
+};
+
 export default moveFeeDown;

helpers/lotOccupancyDB/moveFeeUp.d.ts

@@ -1,2 +1,3 @@
 export declare const moveFeeUp: (feeId: number | string) => boolean;
+export declare const moveFeeUpToTop: (feeId: number | string) => boolean;
 export default moveFeeUp;

helpers/lotOccupancyDB/moveFeeUp.js

@@ -1,11 +1,10 @@
 import sqlite from "better-sqlite3";
 import { lotOccupancyDB as databasePath } from "../../data/databasePaths.js";
+import { getFee } from "./getFee.js";
 export const moveFeeUp = (feeId) => {
     const database = sqlite(databasePath);
-    const currentOrderNumber = database
+    const currentFee = getFee(feeId, database);
-        .prepare("select orderNumber" + " from Fees" + " where feeId = ?")
+    if (currentFee.orderNumber <= 0) {
-        .get(feeId).orderNumber;
-    if (currentOrderNumber <= 0) {
         database.close();
         return true;
     }
@@ -13,12 +12,29 @@ export const moveFeeUp = (feeId) => {
         .prepare("update Fees" +
         " set orderNumber = orderNumber + 1" +
         " where recordDelete_timeMillis is null" +
+        " and feeCategoryId = ?" +
         " and orderNumber = ? - 1")
-        .run(currentOrderNumber);
+        .run(currentFee.feeCategoryId, currentFee.orderNumber);
     const result = database
-        .prepare("update Fees" + " set orderNumber = ? - 1" + " where feeId = ?")
+        .prepare("update Fees set orderNumber = ? - 1 where feeId = ?")
-        .run(currentOrderNumber, feeId);
+        .run(currentFee.orderNumber, feeId);
     database.close();
     return result.changes > 0;
 };
+export const moveFeeUpToTop = (feeId) => {
+    const database = sqlite(databasePath);
+    const currentFee = getFee(feeId, database);
+    if (currentFee.orderNumber > 0) {
+        database.prepare("update Fees set orderNumber = -1 where feeId = ?").run(feeId);
+        database
+            .prepare("update Fees" +
+            " set orderNumber = orderNumber + 1" +
+            " where recordDelete_timeMillis is null" +
+            " and feeCategoryId = ?" +
+            " and orderNumber < ?")
+            .run(currentFee.feeCategoryId, currentFee.orderNumber);
+    }
+    database.close();
+    return true;
+};
 export default moveFeeUp;

helpers/lotOccupancyDB/moveFeeUp.ts

@@ -2,14 +2,14 @@ import sqlite from "better-sqlite3";
 
 import { lotOccupancyDB as databasePath } from "../../data/databasePaths.js";
 
+import { getFee } from "./getFee.js";
+
 export const moveFeeUp = (feeId: number | string): boolean => {
     const database = sqlite(databasePath);
 
-    const currentOrderNumber: number = database
+    const currentFee = getFee(feeId, database);
-        .prepare("select orderNumber" + " from Fees" + " where feeId = ?")
-        .get(feeId).orderNumber;
 
-    if (currentOrderNumber <= 0) {
+    if (currentFee.orderNumber <= 0) {
         database.close();
         return true;
     }
@@ -19,19 +19,42 @@ export const moveFeeUp = (feeId: number | string): boolean => {
             "update Fees" +
                 " set orderNumber = orderNumber + 1" +
                 " where recordDelete_timeMillis is null" +
+                " and feeCategoryId = ?" +
                 " and orderNumber = ? - 1"
         )
-        .run(currentOrderNumber);
+        .run(currentFee.feeCategoryId, currentFee.orderNumber);
 
     const result = database
-        .prepare(
+        .prepare("update Fees set orderNumber = ? - 1 where feeId = ?")
-            "update Fees" + " set orderNumber = ? - 1" + " where feeId = ?"
+        .run(currentFee.orderNumber, feeId);
-        )
-        .run(currentOrderNumber, feeId);
 
     database.close();
 
     return result.changes > 0;
 };
 
+export const moveFeeUpToTop = (feeId: number | string): boolean => {
+    const database = sqlite(databasePath);
+
+    const currentFee = getFee(feeId, database);
+
+    if (currentFee.orderNumber > 0) {
+        database.prepare("update Fees set orderNumber = -1 where feeId = ?").run(feeId);
+
+        database
+            .prepare(
+                "update Fees" +
+                    " set orderNumber = orderNumber + 1" +
+                    " where recordDelete_timeMillis is null" +
+                    " and feeCategoryId = ?" +
+                    " and orderNumber < ?"
+            )
+            .run(currentFee.feeCategoryId, currentFee.orderNumber);
+    }
+
+    database.close();
+
+    return true;
+};
+
 export default moveFeeUp;

helpers/lotOccupancyDB/moveLotTypeFieldUp.js

@@ -4,7 +4,7 @@ import { clearLotTypesCache } from "../functions.cache.js";
 export const moveLotTypeFieldUp = (lotTypeFieldId) => {
     const database = sqlite(databasePath);
     const currentField = database
-        .prepare("select lotTypeId, orderNumber" + " from LotTypeFields" + " where lotTypeFieldId = ?")
+        .prepare("select lotTypeId, orderNumber from LotTypeFields where lotTypeFieldId = ?")
         .get(lotTypeFieldId);
     if (currentField.orderNumber <= 0) {
         database.close();
@@ -18,7 +18,7 @@ export const moveLotTypeFieldUp = (lotTypeFieldId) => {
         " and orderNumber = ? - 1")
         .run(currentField.lotTypeId, currentField.orderNumber);
     const result = database
-        .prepare("update LotTypeFields" + " set orderNumber = ? - 1" + " where lotTypeFieldId = ?")
+        .prepare("update LotTypeFields set orderNumber = ? - 1 where lotTypeFieldId = ?")
         .run(currentField.orderNumber, lotTypeFieldId);
     database.close();
     clearLotTypesCache();

helpers/lotOccupancyDB/moveLotTypeFieldUp.ts

@@ -8,9 +8,7 @@ export const moveLotTypeFieldUp = (lotTypeFieldId: number | string): boolean =>
     const database = sqlite(databasePath);
 
     const currentField: { lotTypeId: number; orderNumber: number } = database
-        .prepare(
+        .prepare("select lotTypeId, orderNumber from LotTypeFields where lotTypeFieldId = ?")
-            "select lotTypeId, orderNumber" + " from LotTypeFields" + " where lotTypeFieldId = ?"
-        )
         .get(lotTypeFieldId);
 
     if (currentField.orderNumber <= 0) {
@@ -29,7 +27,7 @@ export const moveLotTypeFieldUp = (lotTypeFieldId: number | string): boolean =>
         .run(currentField.lotTypeId, currentField.orderNumber);
 
     const result = database
-        .prepare("update LotTypeFields" + " set orderNumber = ? - 1" + " where lotTypeFieldId = ?")
+        .prepare("update LotTypeFields set orderNumber = ? - 1 where lotTypeFieldId = ?")
         .run(currentField.orderNumber, lotTypeFieldId);
 
     database.close();

public-typescript/adminFees.js

@@ -17,42 +17,40 @@ Object.defineProperty(exports, "__esModule", { value: true });
         feeCategoriesContainerElement.innerHTML = "";
         for (const feeCategory of feeCategories) {
             const feeCategoryContainerElement = document.createElement("section");
-            feeCategoryContainerElement.className =
+            feeCategoryContainerElement.className = "panel container--feeCategory";
-                "panel container--feeCategory";
             feeCategoryContainerElement.dataset.feeCategoryId =
                 feeCategory.feeCategoryId.toString();
             feeCategoryContainerElement.innerHTML =
                 '<div class="panel-heading">' +
-                    '<div class="level is-mobile">' +
+                    '<div class="columns">' +
-                    ('<div class="level-left">' +
+                    ('<div class="column">' +
-                        '<div class="level-item">' +
                         '<h2 class="title is-4">' +
                         cityssm.escapeHTML(feeCategory.feeCategory) +
                         "</h2>" +
-                        "</div>" +
                         "</div>") +
-                    ('<div class="level-right">' +
+                    ('<div class="column is-narrow">' +
+                        '<div class="field is-grouped is-justify-content-end">' +
                         (feeCategory.fees.length === 0
-                            ? '<div class="level-item">' +
+                            ? '<div class="control">' +
                                 '<button class="button is-small is-danger button--deleteFeeCategory" type="button">' +
                                 '<span class="icon is-small"><i class="fas fa-trash" aria-hidden="true"></i></span>' +
                                 "<span>Delete Category</span>" +
                                 "</button>" +
                                 "</div>"
                             : "") +
-                        ('<div class="level-item">' +
+                        ('<div class="control">' +
                             '<button class="button is-small is-primary button--editFeeCategory" type="button">' +
                             '<span class="icon is-small"><i class="fas fa-pencil-alt" aria-hidden="true"></i></span>' +
                             "<span>Edit Category</span>" +
                             "</button>" +
                             "</div>") +
-                        ('<div class="level-item">' +
+                        ('<div class="control">' +
                             '<button class="button is-small is-success button--addFee" type="button">' +
                             '<span class="icon is-small"><i class="fas fa-plus" aria-hidden="true"></i></span>' +
                             "<span>Add Fee</span>" +
                             "</button>" +
                             "</div>") +
-                        ('<div class="level-item">' +
+                        ('<div class="control">' +
                             '<div class="field has-addons">' +
                             '<div class="control">' +
                             '<button class="button is-small button--moveFeeCategoryUp" data-tooltip="Move Up" type="button" aria-label="Move Up">' +
@@ -81,8 +79,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
             else {
                 for (const fee of feeCategory.fees) {
                     const panelBlockElement = document.createElement("div");
-                    panelBlockElement.className =
+                    panelBlockElement.className = "panel-block is-block container--fee";
-                        "panel-block is-block container--fee";
                     panelBlockElement.dataset.feeId = fee.feeId.toString();
                     panelBlockElement.innerHTML =
                         '<div class="columns">' +
@@ -92,15 +89,11 @@ Object.defineProperty(exports, "__esModule", { value: true });
                                 cityssm.escapeHTML(fee.feeName) +
                                 "</a><br />" +
                                 "<small>" +
-                                cityssm
+                                cityssm.escapeHTML(fee.feeDescription).replace(/\n/g, "<br />") +
-                                    .escapeHTML(fee.feeDescription)
-                                    .replace(/\n/g, "<br />") +
                                 "</small>" +
                                 "</p>" +
                                 '<p class="tags">' +
-                                (fee.isRequired
+                                (fee.isRequired ? '<span class="tag is-warning">Required</span>' : "") +
-                                    ? '<span class="tag is-warning">Required</span>'
-                                    : "") +
                                 (fee.occupancyTypeId
                                     ? ' <span class="tag has-tooltip-bottom" data-tooltip="' +
                                         cityssm.escapeHTML(exports.aliases.occupancy) +
@@ -117,6 +110,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
                                     : "") +
                                 "</p>" +
                                 "</div>") +
+                            ('<div class="column">' +
+                                '<div class="columns is-mobile">' +
                                 ('<div class="column has-text-centered">' +
                                     (fee.feeFunction
                                         ? cityssm.escapeHTML(fee.feeFunction) +
@@ -140,8 +135,10 @@ Object.defineProperty(exports, "__esModule", { value: true });
                                             "<small>Quantity</small>"
                                         : "") +
                                     "</div>") +
+                                "</div>" +
+                                "</div>") +
                             ('<div class="column is-narrow">' +
-                                '<div class="field has-addons">' +
+                                '<div class="field has-addons is-justify-content-end">' +
                                 '<div class="control">' +
                                 '<button class="button is-small button--moveFeeUp" data-tooltip="Move Up" type="button" aria-label="Move Up">' +
                                 '<i class="fas fa-arrow-up" aria-hidden="true"></i>' +
@@ -155,9 +152,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
                                 "</div>" +
                                 "</div>") +
                             "</div>";
-                    panelBlockElement
+                    panelBlockElement.querySelector("a").addEventListener("click", openEditFee);
-                        .querySelector("a")
-                        .addEventListener("click", openEditFee);
                     panelBlockElement
                         .querySelector(".button--moveFeeUp")
                         .addEventListener("click", moveFeeUp);
@@ -187,9 +182,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
             feeCategoriesContainerElement.append(feeCategoryContainerElement);
         }
     };
-    document
+    document.querySelector("#button--addFeeCategory").addEventListener("click", () => {
-        .querySelector("#button--addFeeCategory")
-        .addEventListener("click", () => {
         let addCloseModalFunction;
         const doAddFeeCategory = (submitEvent) => {
             submitEvent.preventDefault();
@@ -213,9 +206,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
                 bulmaJS.toggleHtmlClipped();
                 modalElement.querySelector("#feeCategoryAdd--feeCategory").focus();
                 addCloseModalFunction = closeModalFunction;
-                modalElement
+                modalElement.querySelector("form").addEventListener("submit", doAddFeeCategory);
-                    .querySelector("form")
-                    .addEventListener("submit", doAddFeeCategory);
             },
             onremoved: () => {
                 bulmaJS.toggleHtmlClipped();
@@ -253,9 +244,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
             onshown: (modalElement, closeModalFunction) => {
                 bulmaJS.toggleHtmlClipped();
                 editCloseModalFunction = closeModalFunction;
-                modalElement
+                modalElement.querySelector("form").addEventListener("submit", doUpdateFeeCategory);
-                    .querySelector("form")
-                    .addEventListener("submit", doUpdateFeeCategory);
                 modalElement.querySelector("#feeCategoryEdit--feeCategory").focus();
             },
             onremoved: () => {
@@ -295,7 +284,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
     const moveFeeCategoryUp = (clickEvent) => {
         const feeCategoryId = Number.parseInt(clickEvent.currentTarget.closest(".container--feeCategory").dataset.feeCategoryId, 10);
         cityssm.postJSON(urlPrefix + "/admin/doMoveFeeCategoryUp", {
-            feeCategoryId
+            feeCategoryId,
+            moveToTop: clickEvent.shiftKey ? "1" : "0"
         }, (responseJSON) => {
             if (responseJSON.success) {
                 feeCategories = responseJSON.feeCategories;
@@ -313,7 +303,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
     const moveFeeCategoryDown = (clickEvent) => {
         const feeCategoryId = Number.parseInt(clickEvent.currentTarget.closest(".container--feeCategory").dataset.feeCategoryId, 10);
         cityssm.postJSON(urlPrefix + "/admin/doMoveFeeCategoryDown", {
-            feeCategoryId
+            feeCategoryId,
+            moveToBottom: clickEvent.shiftKey ? "1" : "0"
         }, (responseJSON) => {
             if (responseJSON.success) {
                 feeCategories = responseJSON.feeCategories;
@@ -363,8 +354,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
                 const occupancyTypeElement = modalElement.querySelector("#feeAdd--occupancyTypeId");
                 for (const occupancyType of exports.occupancyTypes) {
                     const optionElement = document.createElement("option");
-                    optionElement.value =
+                    optionElement.value = occupancyType.occupancyTypeId.toString();
-                        occupancyType.occupancyTypeId.toString();
                     optionElement.textContent = occupancyType.occupancyType;
                     occupancyTypeElement.append(optionElement);
                 }
@@ -381,9 +371,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
             onshown: (modalElement, closeModalFunction) => {
                 bulmaJS.toggleHtmlClipped();
                 addCloseModalFunction = closeModalFunction;
-                modalElement
+                modalElement.querySelector("form").addEventListener("submit", doAddFee);
-                    .querySelector("form")
-                    .addEventListener("submit", doAddFee);
                 modalElement.querySelector("#feeAdd--feeName").focus();
                 modalElement
                     .querySelector("#feeAdd--feeFunction")
@@ -391,16 +379,12 @@ Object.defineProperty(exports, "__esModule", { value: true });
                     const feeAmountElement = modalElement.querySelector("#feeAdd--feeAmount");
                     const feeFunctionElement = modalElement.querySelector("#feeAdd--feeFunction");
                     if (feeFunctionElement.value === "") {
-                        feeFunctionElement
+                        feeFunctionElement.closest(".select").classList.remove("is-success");
-                            .closest(".select")
-                            .classList.remove("is-success");
                         feeAmountElement.classList.add("is-success");
                         feeAmountElement.disabled = false;
                     }
                     else {
-                        feeFunctionElement
+                        feeFunctionElement.closest(".select").classList.add("is-success");
-                            .closest(".select")
-                            .classList.add("is-success");
                         feeAmountElement.classList.remove("is-success");
                         feeAmountElement.disabled = true;
                     }
@@ -437,7 +421,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
         clickEvent.preventDefault();
         const feeContainerElement = clickEvent.currentTarget.closest(".container--fee");
         const feeId = Number.parseInt(feeContainerElement.dataset.feeId, 10);
-        const feeCategoryId = Number.parseInt(feeContainerElement.closest(".container--feeCategory").dataset.feeCategoryId);
+        const feeCategoryId = Number.parseInt(feeContainerElement.closest(".container--feeCategory").dataset
+            .feeCategoryId);
         const feeCategory = feeCategories.find((currentFeeCategory) => {
             return currentFeeCategory.feeCategoryId === feeCategoryId;
         });
@@ -497,16 +482,12 @@ Object.defineProperty(exports, "__esModule", { value: true });
             const feeAmountElement = editModalElement.querySelector("#feeEdit--feeAmount");
             const feeFunctionElement = editModalElement.querySelector("#feeEdit--feeFunction");
             if (feeFunctionElement.value === "") {
-                feeFunctionElement
+                feeFunctionElement.closest(".select").classList.remove("is-success");
-                    .closest(".select")
-                    .classList.remove("is-success");
                 feeAmountElement.classList.add("is-success");
                 feeAmountElement.disabled = false;
             }
             else {
-                feeFunctionElement
+                feeFunctionElement.closest(".select").classList.add("is-success");
-                    .closest(".select")
-                    .classList.add("is-success");
                 feeAmountElement.classList.remove("is-success");
                 feeAmountElement.disabled = true;
             }
@@ -527,12 +508,14 @@ Object.defineProperty(exports, "__esModule", { value: true });
         };
         const toggleQuantityFields = () => {
             editModalElement.querySelector("#feeEdit--quantityUnit").disabled =
-                editModalElement.querySelector("#feeEdit--includeQuantity").value === "";
+                editModalElement.querySelector("#feeEdit--includeQuantity")
+                    .value === "";
         };
         cityssm.openHtmlModal("adminFees-editFee", {
             onshow: (modalElement) => {
                 editModalElement = modalElement;
-                modalElement.querySelector("#feeEdit--feeId").value = fee.feeId.toString();
+                modalElement.querySelector("#feeEdit--feeId").value =
+                    fee.feeId.toString();
                 const feeCategoryElement = modalElement.querySelector("#feeEdit--feeCategoryId");
                 for (const feeCategory of feeCategories) {
                     const optionElement = document.createElement("option");
@@ -543,13 +526,13 @@ Object.defineProperty(exports, "__esModule", { value: true });
                     }
                     feeCategoryElement.append(optionElement);
                 }
-                modalElement.querySelector("#feeEdit--feeName").value = fee.feeName;
+                modalElement.querySelector("#feeEdit--feeName").value =
+                    fee.feeName;
                 modalElement.querySelector("#feeEdit--feeDescription").value = fee.feeDescription;
                 const occupancyTypeElement = modalElement.querySelector("#feeEdit--occupancyTypeId");
                 for (const occupancyType of exports.occupancyTypes) {
                     const optionElement = document.createElement("option");
-                    optionElement.value =
+                    optionElement.value = occupancyType.occupancyTypeId.toString();
-                        occupancyType.occupancyTypeId.toString();
                     optionElement.textContent = occupancyType.occupancyType;
                     if (occupancyType.occupancyTypeId === fee.occupancyTypeId) {
                         optionElement.selected = true;
@@ -566,16 +549,16 @@ Object.defineProperty(exports, "__esModule", { value: true });
                     }
                     lotTypeElement.append(optionElement);
                 }
-                modalElement.querySelector("#feeEdit--feeAmount").value = fee.feeAmount ? fee.feeAmount.toFixed(2) : "";
+                modalElement.querySelector("#feeEdit--feeAmount").value =
+                    fee.feeAmount ? fee.feeAmount.toFixed(2) : "";
                 modalElement
                     .querySelector("#feeEdit--feeFunction")
                     .addEventListener("change", toggleFeeFields);
                 toggleFeeFields();
-                modalElement.querySelector("#feeEdit--taxAmount").value = fee.taxAmount ? fee.taxAmount.toFixed(2) : "";
+                modalElement.querySelector("#feeEdit--taxAmount").value =
+                    fee.taxAmount ? fee.taxAmount.toFixed(2) : "";
                 const taxPercentageElement = modalElement.querySelector("#feeEdit--taxPercentage");
-                taxPercentageElement.value = fee.taxPercentage
+                taxPercentageElement.value = fee.taxPercentage ? fee.taxPercentage.toString() : "";
-                    ? fee.taxPercentage.toString()
-                    : "";
                 taxPercentageElement.addEventListener("keyup", toggleTaxFields);
                 toggleTaxFields();
                 const includeQuantityElement = modalElement.querySelector("#feeEdit--includeQuantity");
@@ -583,7 +566,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
                     includeQuantityElement.value = "1";
                 }
                 includeQuantityElement.addEventListener("change", toggleQuantityFields);
-                modalElement.querySelector("#feeEdit--quantityUnit").value = fee.quantityUnit || "";
+                modalElement.querySelector("#feeEdit--quantityUnit").value =
+                    fee.quantityUnit || "";
                 toggleQuantityFields();
                 if (fee.isRequired) {
                     modalElement.querySelector("#feeEdit--isRequired").value = "1";
@@ -593,9 +577,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
             onshown: (modalElement, closeModalFunction) => {
                 bulmaJS.toggleHtmlClipped();
                 editCloseModalFunction = closeModalFunction;
-                modalElement
+                modalElement.querySelector("form").addEventListener("submit", doUpdateFee);
-                    .querySelector("form")
-                    .addEventListener("submit", doUpdateFee);
                 bulmaJS.init(modalElement);
                 modalElement
                     .querySelector(".button--deleteFee")
@@ -610,7 +592,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
         const feeContainerElement = clickEvent.currentTarget.closest(".container--fee");
         const feeId = Number.parseInt(feeContainerElement.dataset.feeId, 10);
         cityssm.postJSON(urlPrefix + "/admin/doMoveFeeUp", {
-            feeId
+            feeId,
+            moveToTop: clickEvent.shiftKey ? "1" : "0"
         }, (responseJSON) => {
             if (responseJSON.success) {
                 feeCategories = responseJSON.feeCategories;
@@ -629,7 +612,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
         const feeContainerElement = clickEvent.currentTarget.closest(".container--fee");
         const feeId = Number.parseInt(feeContainerElement.dataset.feeId, 10);
         cityssm.postJSON(urlPrefix + "/admin/doMoveFeeDown", {
-            feeId
+            feeId,
+            moveToBottom: clickEvent.shiftKey ? "1" : "0"
         }, (responseJSON) => {
             if (responseJSON.success) {
                 feeCategories = responseJSON.feeCategories;

public-typescript/adminFees.ts

@@ -35,47 +35,44 @@ declare const bulmaJS: BulmaJS;
         feeCategoriesContainerElement.innerHTML = "";
 
         for (const feeCategory of feeCategories) {
-            const feeCategoryContainerElement =
+            const feeCategoryContainerElement = document.createElement("section");
-                document.createElement("section");
 
-            feeCategoryContainerElement.className =
+            feeCategoryContainerElement.className = "panel container--feeCategory";
-                "panel container--feeCategory";
 
             feeCategoryContainerElement.dataset.feeCategoryId =
                 feeCategory.feeCategoryId.toString();
 
             feeCategoryContainerElement.innerHTML =
                 '<div class="panel-heading">' +
-                '<div class="level is-mobile">' +
+                '<div class="columns">' +
-                ('<div class="level-left">' +
+                ('<div class="column">' +
-                    '<div class="level-item">' +
                     '<h2 class="title is-4">' +
                     cityssm.escapeHTML(feeCategory.feeCategory) +
                     "</h2>" +
-                    "</div>" +
                     "</div>") +
-                ('<div class="level-right">' +
+                ('<div class="column is-narrow">' +
+                    '<div class="field is-grouped is-justify-content-end">' +
                     (feeCategory.fees.length === 0
-                        ? '<div class="level-item">' +
+                        ? '<div class="control">' +
                           '<button class="button is-small is-danger button--deleteFeeCategory" type="button">' +
                           '<span class="icon is-small"><i class="fas fa-trash" aria-hidden="true"></i></span>' +
                           "<span>Delete Category</span>" +
                           "</button>" +
                           "</div>"
                         : "") +
-                    ('<div class="level-item">' +
+                    ('<div class="control">' +
                         '<button class="button is-small is-primary button--editFeeCategory" type="button">' +
                         '<span class="icon is-small"><i class="fas fa-pencil-alt" aria-hidden="true"></i></span>' +
                         "<span>Edit Category</span>" +
                         "</button>" +
                         "</div>") +
-                    ('<div class="level-item">' +
+                    ('<div class="control">' +
                         '<button class="button is-small is-success button--addFee" type="button">' +
                         '<span class="icon is-small"><i class="fas fa-plus" aria-hidden="true"></i></span>' +
                         "<span>Add Fee</span>" +
                         "</button>" +
                         "</div>") +
-                    ('<div class="level-item">' +
+                    ('<div class="control">' +
                         '<div class="field has-addons">' +
                         '<div class="control">' +
                         '<button class="button is-small button--moveFeeCategoryUp" data-tooltip="Move Up" type="button" aria-label="Move Up">' +
@@ -107,8 +104,7 @@ declare const bulmaJS: BulmaJS;
             } else {
                 for (const fee of feeCategory.fees) {
                     const panelBlockElement = document.createElement("div");
-                    panelBlockElement.className =
+                    panelBlockElement.className = "panel-block is-block container--fee";
-                        "panel-block is-block container--fee";
                     panelBlockElement.dataset.feeId = fee.feeId.toString();
 
                     panelBlockElement.innerHTML =
@@ -119,20 +115,14 @@ declare const bulmaJS: BulmaJS;
                             cityssm.escapeHTML(fee.feeName) +
                             "</a><br />" +
                             "<small>" +
-                            cityssm
+                            cityssm.escapeHTML(fee.feeDescription).replace(/\n/g, "<br />") +
-                                .escapeHTML(fee.feeDescription)
-                                .replace(/\n/g, "<br />") +
                             "</small>" +
                             "</p>" +
                             '<p class="tags">' +
-                            (fee.isRequired
+                            (fee.isRequired ? '<span class="tag is-warning">Required</span>' : "") +
-                                ? '<span class="tag is-warning">Required</span>'
-                                : "") +
                             (fee.occupancyTypeId
                                 ? ' <span class="tag has-tooltip-bottom" data-tooltip="' +
-                                  cityssm.escapeHTML(
+                                  cityssm.escapeHTML(exports.aliases.occupancy) +
-                                      exports.aliases.occupancy
-                                  ) +
                                   ' Type Filter">' +
                                   cityssm.escapeHTML(fee.occupancyType) +
                                   "</span>"
@@ -146,6 +136,8 @@ declare const bulmaJS: BulmaJS;
                                 : "") +
                             "</p>" +
                             "</div>") +
+                        ('<div class="column">' +
+                            '<div class="columns is-mobile">' +
                             ('<div class="column has-text-centered">' +
                                 (fee.feeFunction
                                     ? cityssm.escapeHTML(fee.feeFunction) +
@@ -169,8 +161,10 @@ declare const bulmaJS: BulmaJS;
                                       "<small>Quantity</small>"
                                     : "") +
                                 "</div>") +
+                            "</div>" +
+                            "</div>") +
                         ('<div class="column is-narrow">' +
-                            '<div class="field has-addons">' +
+                            '<div class="field has-addons is-justify-content-end">' +
                             '<div class="control">' +
                             '<button class="button is-small button--moveFeeUp" data-tooltip="Move Up" type="button" aria-label="Move Up">' +
                             '<i class="fas fa-arrow-up" aria-hidden="true"></i>' +
@@ -185,9 +179,7 @@ declare const bulmaJS: BulmaJS;
                             "</div>") +
                         "</div>";
 
-                    panelBlockElement
+                    panelBlockElement.querySelector("a").addEventListener("click", openEditFee);
-                        .querySelector("a")
-                        .addEventListener("click", openEditFee);
 
                     panelBlockElement
                         .querySelector(".button--moveFeeUp")
@@ -230,9 +222,7 @@ declare const bulmaJS: BulmaJS;
      * Fee Categories
      */
 
-    document
+    document.querySelector("#button--addFeeCategory").addEventListener("click", () => {
-        .querySelector("#button--addFeeCategory")
-        .addEventListener("click", () => {
         let addCloseModalFunction: () => void;
 
         const doAddFeeCategory = (submitEvent: SubmitEvent) => {
@@ -265,15 +255,11 @@ declare const bulmaJS: BulmaJS;
             onshown: (modalElement, closeModalFunction) => {
                 bulmaJS.toggleHtmlClipped();
                 (
-                        modalElement.querySelector(
+                    modalElement.querySelector("#feeCategoryAdd--feeCategory") as HTMLInputElement
-                            "#feeCategoryAdd--feeCategory"
-                        ) as HTMLInputElement
                 ).focus();
 
                 addCloseModalFunction = closeModalFunction;
-                    modalElement
+                modalElement.querySelector("form").addEventListener("submit", doAddFeeCategory);
-                        .querySelector("form")
-                        .addEventListener("submit", doAddFeeCategory);
             },
             onremoved: () => {
                 bulmaJS.toggleHtmlClipped();
@@ -331,9 +317,7 @@ declare const bulmaJS: BulmaJS;
                     ) as HTMLInputElement
                 ).value = feeCategory.feeCategoryId.toString();
                 (
-                    modalElement.querySelector(
+                    modalElement.querySelector("#feeCategoryEdit--feeCategory") as HTMLInputElement
-                        "#feeCategoryEdit--feeCategory"
-                    ) as HTMLInputElement
                 ).value = feeCategory.feeCategory;
             },
             onshown: (modalElement, closeModalFunction) => {
@@ -341,14 +325,10 @@ declare const bulmaJS: BulmaJS;
 
                 editCloseModalFunction = closeModalFunction;
 
-                modalElement
+                modalElement.querySelector("form").addEventListener("submit", doUpdateFeeCategory);
-                    .querySelector("form")
-                    .addEventListener("submit", doUpdateFeeCategory);
 
                 (
-                    modalElement.querySelector(
+                    modalElement.querySelector("#feeCategoryEdit--feeCategory") as HTMLInputElement
-                        "#feeCategoryEdit--feeCategory"
-                    ) as HTMLInputElement
                 ).focus();
             },
             onremoved: () => {
@@ -403,7 +383,7 @@ declare const bulmaJS: BulmaJS;
         });
     };
 
-    const moveFeeCategoryUp = (clickEvent: Event) => {
+    const moveFeeCategoryUp = (clickEvent: MouseEvent) => {
         const feeCategoryId = Number.parseInt(
             (
                 (clickEvent.currentTarget as HTMLElement).closest(
@@ -416,7 +396,8 @@ declare const bulmaJS: BulmaJS;
         cityssm.postJSON(
             urlPrefix + "/admin/doMoveFeeCategoryUp",
             {
-                feeCategoryId
+                feeCategoryId,
+                moveToTop: clickEvent.shiftKey ? "1" : "0"
             },
             (responseJSON: {
                 success: boolean;
@@ -437,7 +418,7 @@ declare const bulmaJS: BulmaJS;
         );
     };
 
-    const moveFeeCategoryDown = (clickEvent: Event) => {
+    const moveFeeCategoryDown = (clickEvent: MouseEvent) => {
         const feeCategoryId = Number.parseInt(
             (
                 (clickEvent.currentTarget as HTMLElement).closest(
@@ -450,7 +431,8 @@ declare const bulmaJS: BulmaJS;
         cityssm.postJSON(
             urlPrefix + "/admin/doMoveFeeCategoryDown",
             {
-                feeCategoryId
+                feeCategoryId,
+                moveToBottom: clickEvent.shiftKey ? "1" : "0"
             },
             (responseJSON: {
                 success: boolean;
@@ -537,8 +519,7 @@ declare const bulmaJS: BulmaJS;
 
                 for (const occupancyType of exports.occupancyTypes as recordTypes.OccupancyType[]) {
                     const optionElement = document.createElement("option");
-                    optionElement.value =
+                    optionElement.value = occupancyType.occupancyTypeId.toString();
-                        occupancyType.occupancyTypeId.toString();
                     optionElement.textContent = occupancyType.occupancyType;
                     occupancyTypeElement.append(optionElement);
                 }
@@ -554,11 +535,9 @@ declare const bulmaJS: BulmaJS;
                     lotTypeElement.append(optionElement);
                 }
 
-                (
+                (modalElement.querySelector("#feeAdd--taxPercentage") as HTMLInputElement).value = (
-                    modalElement.querySelector(
+                    exports.taxPercentageDefault as number
-                        "#feeAdd--taxPercentage"
+                ).toString();
-                    ) as HTMLInputElement
-                ).value = (exports.taxPercentageDefault as number).toString();
 
                 los.populateAliases(modalElement);
             },
@@ -567,15 +546,9 @@ declare const bulmaJS: BulmaJS;
 
                 addCloseModalFunction = closeModalFunction;
 
-                modalElement
+                modalElement.querySelector("form").addEventListener("submit", doAddFee);
-                    .querySelector("form")
-                    .addEventListener("submit", doAddFee);
 
-                (
+                (modalElement.querySelector("#feeAdd--feeName") as HTMLInputElement).focus();
-                    modalElement.querySelector(
-                        "#feeAdd--feeName"
-                    ) as HTMLInputElement
-                ).focus();
 
                 modalElement
                     .querySelector("#feeAdd--feeFunction")
@@ -588,16 +561,12 @@ declare const bulmaJS: BulmaJS;
                         ) as HTMLSelectElement;
 
                         if (feeFunctionElement.value === "") {
-                            feeFunctionElement
+                            feeFunctionElement.closest(".select").classList.remove("is-success");
-                                .closest(".select")
-                                .classList.remove("is-success");
 
                             feeAmountElement.classList.add("is-success");
                             feeAmountElement.disabled = false;
                         } else {
-                            feeFunctionElement
+                            feeFunctionElement.closest(".select").classList.add("is-success");
-                                .closest(".select")
-                                .classList.add("is-success");
 
                             feeAmountElement.classList.remove("is-success");
                             feeAmountElement.disabled = true;
@@ -631,9 +600,7 @@ declare const bulmaJS: BulmaJS;
                     .querySelector("#feeAdd--includeQuantity")
                     .addEventListener("change", () => {
                         (
-                            modalElement.querySelector(
+                            modalElement.querySelector("#feeAdd--quantityUnit") as HTMLInputElement
-                                "#feeAdd--quantityUnit"
-                            ) as HTMLInputElement
                         ).disabled =
                             (
                                 modalElement.querySelector(
@@ -651,17 +618,14 @@ declare const bulmaJS: BulmaJS;
     const openEditFee = (clickEvent: Event) => {
         clickEvent.preventDefault();
 
-        const feeContainerElement = (
+        const feeContainerElement = (clickEvent.currentTarget as HTMLElement).closest(
-            clickEvent.currentTarget as HTMLElement
+            ".container--fee"
-        ).closest(".container--fee") as HTMLElement;
+        ) as HTMLElement;
 
         const feeId = Number.parseInt(feeContainerElement.dataset.feeId, 10);
         const feeCategoryId = Number.parseInt(
-            (
+            (feeContainerElement.closest(".container--feeCategory") as HTMLElement).dataset
-                feeContainerElement.closest(
+                .feeCategoryId
-                    ".container--feeCategory"
-                ) as HTMLElement
-            ).dataset.feeCategoryId
         );
 
         const feeCategory = feeCategories.find((currentFeeCategory) => {
@@ -750,16 +714,12 @@ declare const bulmaJS: BulmaJS;
             ) as HTMLSelectElement;
 
             if (feeFunctionElement.value === "") {
-                feeFunctionElement
+                feeFunctionElement.closest(".select").classList.remove("is-success");
-                    .closest(".select")
-                    .classList.remove("is-success");
 
                 feeAmountElement.classList.add("is-success");
                 feeAmountElement.disabled = false;
             } else {
-                feeFunctionElement
+                feeFunctionElement.closest(".select").classList.add("is-success");
-                    .closest(".select")
-                    .classList.add("is-success");
 
                 feeAmountElement.classList.remove("is-success");
                 feeAmountElement.disabled = true;
@@ -789,26 +749,18 @@ declare const bulmaJS: BulmaJS;
 
         const toggleQuantityFields = () => {
             (
-                editModalElement.querySelector(
+                editModalElement.querySelector("#feeEdit--quantityUnit") as HTMLInputElement
-                    "#feeEdit--quantityUnit"
-                ) as HTMLInputElement
             ).disabled =
-                (
+                (editModalElement.querySelector("#feeEdit--includeQuantity") as HTMLSelectElement)
-                    editModalElement.querySelector(
+                    .value === "";
-                        "#feeEdit--includeQuantity"
-                    ) as HTMLSelectElement
-                ).value === "";
         };
 
         cityssm.openHtmlModal("adminFees-editFee", {
             onshow: (modalElement) => {
                 editModalElement = modalElement;
 
-                (
+                (modalElement.querySelector("#feeEdit--feeId") as HTMLInputElement).value =
-                    modalElement.querySelector(
+                    fee.feeId.toString();
-                        "#feeEdit--feeId"
-                    ) as HTMLInputElement
-                ).value = fee.feeId.toString();
 
                 const feeCategoryElement = modalElement.querySelector(
                     "#feeEdit--feeCategoryId"
@@ -826,15 +778,10 @@ declare const bulmaJS: BulmaJS;
                     feeCategoryElement.append(optionElement);
                 }
 
+                (modalElement.querySelector("#feeEdit--feeName") as HTMLInputElement).value =
+                    fee.feeName;
                 (
-                    modalElement.querySelector(
+                    modalElement.querySelector("#feeEdit--feeDescription") as HTMLTextAreaElement
-                        "#feeEdit--feeName"
-                    ) as HTMLInputElement
-                ).value = fee.feeName;
-                (
-                    modalElement.querySelector(
-                        "#feeEdit--feeDescription"
-                    ) as HTMLTextAreaElement
                 ).value = fee.feeDescription;
 
                 const occupancyTypeElement = modalElement.querySelector(
@@ -843,8 +790,7 @@ declare const bulmaJS: BulmaJS;
 
                 for (const occupancyType of exports.occupancyTypes as recordTypes.OccupancyType[]) {
                     const optionElement = document.createElement("option");
-                    optionElement.value =
+                    optionElement.value = occupancyType.occupancyTypeId.toString();
-                        occupancyType.occupancyTypeId.toString();
                     optionElement.textContent = occupancyType.occupancyType;
 
                     if (occupancyType.occupancyTypeId === fee.occupancyTypeId) {
@@ -870,29 +816,21 @@ declare const bulmaJS: BulmaJS;
                     lotTypeElement.append(optionElement);
                 }
 
-                (
+                (modalElement.querySelector("#feeEdit--feeAmount") as HTMLInputElement).value =
-                    modalElement.querySelector(
+                    fee.feeAmount ? fee.feeAmount.toFixed(2) : "";
-                        "#feeEdit--feeAmount"
-                    ) as HTMLInputElement
-                ).value = fee.feeAmount ? fee.feeAmount.toFixed(2) : "";
                 modalElement
                     .querySelector("#feeEdit--feeFunction")
                     .addEventListener("change", toggleFeeFields);
 
                 toggleFeeFields();
 
-                (
+                (modalElement.querySelector("#feeEdit--taxAmount") as HTMLInputElement).value =
-                    modalElement.querySelector(
+                    fee.taxAmount ? fee.taxAmount.toFixed(2) : "";
-                        "#feeEdit--taxAmount"
-                    ) as HTMLInputElement
-                ).value = fee.taxAmount ? fee.taxAmount.toFixed(2) : "";
 
                 const taxPercentageElement = modalElement.querySelector(
                     "#feeEdit--taxPercentage"
                 ) as HTMLInputElement;
-                taxPercentageElement.value = fee.taxPercentage
+                taxPercentageElement.value = fee.taxPercentage ? fee.taxPercentage.toString() : "";
-                    ? fee.taxPercentage.toString()
-                    : "";
                 taxPercentageElement.addEventListener("keyup", toggleTaxFields);
 
                 toggleTaxFields();
@@ -905,24 +843,16 @@ declare const bulmaJS: BulmaJS;
                     includeQuantityElement.value = "1";
                 }
 
-                includeQuantityElement.addEventListener(
+                includeQuantityElement.addEventListener("change", toggleQuantityFields);
-                    "change",
-                    toggleQuantityFields
-                );
 
-                (
+                (modalElement.querySelector("#feeEdit--quantityUnit") as HTMLInputElement).value =
-                    modalElement.querySelector(
+                    fee.quantityUnit || "";
-                        "#feeEdit--quantityUnit"
-                    ) as HTMLInputElement
-                ).value = fee.quantityUnit || "";
 
                 toggleQuantityFields();
 
                 if (fee.isRequired) {
                     (
-                        modalElement.querySelector(
+                        modalElement.querySelector("#feeEdit--isRequired") as HTMLSelectElement
-                            "#feeEdit--isRequired"
-                        ) as HTMLSelectElement
                     ).value = "1";
                 }
 
@@ -933,9 +863,7 @@ declare const bulmaJS: BulmaJS;
 
                 editCloseModalFunction = closeModalFunction;
 
-                modalElement
+                modalElement.querySelector("form").addEventListener("submit", doUpdateFee);
-                    .querySelector("form")
-                    .addEventListener("submit", doUpdateFee);
 
                 bulmaJS.init(modalElement);
 
@@ -949,17 +877,18 @@ declare const bulmaJS: BulmaJS;
         });
     };
 
-    const moveFeeUp = (clickEvent: Event) => {
+    const moveFeeUp = (clickEvent: MouseEvent) => {
-        const feeContainerElement = (
+        const feeContainerElement = (clickEvent.currentTarget as HTMLElement).closest(
-            clickEvent.currentTarget as HTMLElement
+            ".container--fee"
-        ).closest(".container--fee") as HTMLElement;
+        ) as HTMLElement;
 
         const feeId = Number.parseInt(feeContainerElement.dataset.feeId, 10);
 
         cityssm.postJSON(
             urlPrefix + "/admin/doMoveFeeUp",
             {
-                feeId
+                feeId,
+                moveToTop: clickEvent.shiftKey ? "1" : "0"
             },
             (responseJSON: {
                 success: boolean;
@@ -980,17 +909,18 @@ declare const bulmaJS: BulmaJS;
         );
     };
 
-    const moveFeeDown = (clickEvent: Event) => {
+    const moveFeeDown = (clickEvent: MouseEvent) => {
-        const feeContainerElement = (
+        const feeContainerElement = (clickEvent.currentTarget as HTMLElement).closest(
-            clickEvent.currentTarget as HTMLElement
+            ".container--fee"
-        ).closest(".container--fee") as HTMLElement;
+        ) as HTMLElement;
 
         const feeId = Number.parseInt(feeContainerElement.dataset.feeId, 10);
 
         cityssm.postJSON(
             urlPrefix + "/admin/doMoveFeeDown",
             {
-                feeId
+                feeId,
+                moveToBottom: clickEvent.shiftKey ? "1" : "0"
             },
             (responseJSON: {
                 success: boolean;

views/admin-fees.ejs

@@ -23,16 +23,16 @@
           </ul>
         </nav>
         
-        <div class="level is-mobile">
+        <div class="level">
             <div class="level-left">
-                <div class="level-item">
+                <div class="level-item is-justify-content-start">
                     <h1 class="title is-1">
                         Fee Management
                     </h1>
                 </div>
             </div>
             <div class="level-right">
-                <div class="level-item">
+                <div class="level-item is-justify-content-end">
                     <button class="button is-success" id="button--addFeeCategory" type="button" accesskey="n">
                         <span class="icon is-small"><i class="fas fa-plus" aria-hidden="true"></i></span>
                         <span>Add Fee Category</span>