@7365admin1/layer-common 4.35.1-staging.385 → 4.37.0

package/components/DocumentManagement.vue

@@ -57,24 +57,7 @@
       </div>
     </v-col>
 
-    <v-col cols="12">
-      <v-tabs
-        v-model="activeTab"
-        class="doc-tabs"
-        density="compact"
-        :hide-slider="false"
-      >
-        <v-tab value="active" class="text-none">Documents</v-tab>
-        <v-tab value="expired" class="text-none">Document (Expired)</v-tab>
-      </v-tabs>
-    </v-col>
-
-    <!--
-      Hidden on the Expired tab: that tab is a site-wide worklist rather than a
-      place in the folder tree, so a breadcrumb there would name a folder whose
-      contents are not what is on screen.
-    -->
-    <v-col cols="12" class="mb-2" v-if="isInsideFolder && !isExpiredTab">
+    <v-col cols="12" class="mb-2" v-if="isInsideFolder">
       <div class="folder-path-bar d-flex align-center ga-2 px-3 py-2">
         <v-btn
           icon="mdi-arrow-left"
@@ -166,79 +149,19 @@
           <span>{{ item.date_modified || "N/A" }}</span>
         </template>
 
-        <template #item.expiry_date="{ item }">
-          <span>{{ item.expiry_date || "N/A" }}</span>
-        </template>
-
         <template #item.remarks="{ item }">
           <span>{{ item.remarks || "N/A" }}</span>
         </template>
 
         <template #item.action="{ item }">
-          <!--
-            A document carries its primary action and a kebab beside it. Which
-            primary action depends on the tab: an expired document cannot be
-            usefully downloaded, it needs replacing, so Download gives way to
-            Update there.
-          -->
-          <template v-if="!isFolderItem(item._raw)">
-            <v-btn
-              v-if="isExpiredTab"
-              variant="flat"
-              class="table-download-btn text-none"
-              :disabled="!canUpdateDocument"
-              @click.stop="openUpdateDialog(item._raw)"
-            >
-              Update
-            </v-btn>
-
-            <v-btn
-              v-else
-              variant="flat"
-              class="table-download-btn text-none"
-              @click.stop="downloadDocument(item._raw)"
-            >
-              Download
-            </v-btn>
-
-            <v-menu
-              v-if="canUpdateDocument || canDeleteDocument"
-              v-model="documentActionMenu[item._raw._id]"
-              location="bottom end"
-              offset="6"
-            >
-              <template #activator="{ props }">
-                <v-btn
-                  v-bind="props"
-                  icon="mdi-dots-vertical"
-                  variant="text"
-                  size="small"
-                  density="comfortable"
-                  class="folder-action-btn"
-                  @click.stop
-                />
-              </template>
-
-              <v-list class="folder-action-list pa-0">
-                <v-list-item
-                  v-if="canUpdateDocument"
-                  class="folder-action-item"
-                  @click.stop="openDocumentEdit(item._raw)"
-                >
-                  <v-list-item-title class="text-body-2">Edit</v-list-item-title>
-                </v-list-item>
-                <v-list-item
-                  v-if="canDeleteDocument"
-                  class="folder-action-item"
-                  @click.stop="openDocumentDelete(item._raw)"
-                >
-                  <v-list-item-title class="text-body-2">
-                    Delete
-                  </v-list-item-title>
-                </v-list-item>
-              </v-list>
-            </v-menu>
-          </template>
+          <v-btn
+            v-if="!isFolderItem(item._raw)"
+            variant="flat"
+            class="table-download-btn text-none"
+            @click.stop="downloadDocument(item._raw)"
+          >
+            Download
+          </v-btn>
 
           <v-menu
             v-else
@@ -277,11 +200,8 @@
       </TableV3>
     </v-col>
 
-    <!--
-      Wider than the other dialogs because Add Document holds a five-column
-      table, one row per file, rather than a stacked pair of fields.
-    -->
-    <v-dialog v-model="createDialog" max-width="1100" persistent>
+    <!-- Create Dialog -->
+    <v-dialog v-model="createDialog" width="450" persistent>
       <DocumentForm
         v-if="createDialog"
         :parent-id="activeParentId"
@@ -290,17 +210,6 @@
       />
     </v-dialog>
 
-    <!-- Update Dialog: renew an expired document by replacing its file. -->
-    <v-dialog v-model="updateDialog" max-width="1100" persistent>
-      <DocumentForm
-        v-if="updateDialog"
-        mode="update"
-        :document="selectedDocument"
-        @cancel="updateDialog = false"
-        @success="successRenew()"
-      />
-    </v-dialog>
-
     <!-- Create Folder Dialog -->
     <v-dialog v-model="createFolderDialog" width="450" persistent>
       <v-card width="100%">
@@ -575,15 +484,6 @@
               </v-row>
             </v-col>
 
-            <v-col cols="12" class="mb-2">
-              <v-row no-gutters>
-                <v-col cols="6" class="text-body-1">Expiry Date</v-col>
-                <v-col cols="6" class="text-right text-body-1">{{
-                  previewDetails.expiryDate
-                }}</v-col>
-              </v-row>
-            </v-col>
-
             <v-col cols="12">
               <v-row no-gutters>
                 <v-col cols="6" class="text-body-1">Remarks</v-col>
@@ -734,10 +634,6 @@ const props = defineProps({
         title: "Date Modified",
         value: "date_modified",
       },
-      {
-        title: "Expiry Date",
-        value: "expiry_date",
-      },
       {
         title: "Remarks",
         value: "remarks",
@@ -837,13 +733,6 @@ const currentFolderPath = computed(() => {
 const fileTypes = ref(["all", "pdf", "csv", "doc"]);
 const selectedFileType = ref("all");
 
-/**
- * Which half of the list is on screen. The value is sent straight to the API as
- * its `expiry` filter, so the tab and the query cannot drift apart.
- */
-const activeTab = ref<"active" | "expired">("active");
-const isExpiredTab = computed(() => activeTab.value === "expired");
-
 const {
   data: getDocumentReq,
   refresh: getDocuments,
@@ -859,20 +748,12 @@ const {
       parentId: activeParentId.value,
       type:
         selectedFileType.value === "all" ? undefined : selectedFileType.value,
-      expiry: activeTab.value,
     }),
   {
-    watch: [page, headerSearch, activeParentId, selectedFileType, activeTab],
+    watch: [page, headerSearch, activeParentId, selectedFileType],
   }
 );
 
-// Page 3 of the Documents tab is rarely page 3 of a much shorter Expired list,
-// so a tab change that kept the page number would land on an empty table that
-// looks like "nothing has expired".
-watch(activeTab, () => {
-  page.value = 1;
-});
-
 const loading = computed(() => getAllReqStatus.value === "pending");
 
 // The page totals are the server's count of the WHOLE list, read through the
@@ -907,28 +788,6 @@ function formatDate(value?: string | null) {
   });
 }
 
-/**
- * Expiry is a day, not a moment: the picker collects `YYYY-MM-DD` and the
- * design renders `13/12/2026`. Reusing `formatDate` would append a meaningless
- * 00:00 to every row.
- */
-function formatDateOnly(value?: string | null) {
-  if (!value) {
-    return "N/A";
-  }
-
-  const dateValue = new Date(value);
-  if (Number.isNaN(dateValue.getTime())) {
-    return "N/A";
-  }
-
-  return dateValue.toLocaleDateString("en-SG", {
-    year: "numeric",
-    month: "2-digit",
-    day: "2-digit",
-  });
-}
-
 function formatBytes(bytes = 0) {
   const b = Number(bytes) || 0;
   if (b === 0) return "0 B";
@@ -964,20 +823,13 @@ const tableItems = computed(() => {
         : formatBytes(Number(doc.file_size ?? doc.size ?? 0)),
     date_created: formatDate(doc.created_at || doc.createdAt),
     date_modified: formatDate(doc.updated_at || doc.updatedAt),
-    // Folders never expire, so they read N/A rather than borrowing a date.
-    expiry_date:
-      doc.type === "folder"
-        ? "N/A"
-        : formatDateOnly(doc.expiry_date || doc.expiryDate),
     remarks: doc.remarks || "N/A",
   }));
 });
 
 const createDialog = ref(false);
 const editDialog = ref(false);
-const updateDialog = ref(false);
 const previewDialog = ref(false);
-const documentActionMenu = ref<Record<string, boolean>>({});
 
 // Create folder dialog state
 const createFolderDialog = ref(false);
@@ -1028,10 +880,6 @@ const previewDetails = computed(() => {
     fileSize,
     dateCreated: formatDate(document?.created_at || document?.createdAt),
     dateModified: formatDate(document?.updated_at || document?.updatedAt),
-    expiryDate:
-      document?.type === "folder"
-        ? "N/A"
-        : formatDateOnly(document?.expiry_date || document?.expiryDate),
     remarks: document?.remarks || "N/A",
   };
 });
@@ -1303,29 +1151,6 @@ function openDeleteDialog() {
   message.value = "";
 }
 
-/*
- * The three row-kebab entry points. Each names its document first: the dialogs
- * below all read `selectedDocument`, which until now was only ever set by
- * opening the detail modal, so firing one straight from a row without setting
- * it would have acted on whichever document was inspected last.
- */
-function openDocumentEdit(document: TDocument) {
-  selectedDocument.value = document;
-  documentActionMenu.value = {};
-  editDialog.value = true;
-}
-
-function openDocumentDelete(document: TDocument) {
-  selectedDocument.value = document;
-  documentActionMenu.value = {};
-  openDeleteDialog();
-}
-
-function openUpdateDialog(document: TDocument) {
-  selectedDocument.value = document;
-  updateDialog.value = true;
-}
-
 function openEditDialog() {
   editDialog.value = true;
 }
@@ -1354,19 +1179,6 @@ function successUpdate() {
   showMessage("Document updated successfully!", "success");
 }
 
-/**
- * A renewal usually moves the document off the tab it was renewed from, so the
- * refresh is what makes it disappear from the Expired list. A renewal that did
- * not move the expiry date forward stays put, which is the intended behaviour
- * rather than a failed save - hence the neutral wording.
- */
-function successRenew() {
-  updateDialog.value = false;
-  previewDialog.value = false;
-  getDocuments();
-  showMessage("Document updated successfully!", "success");
-}
-
 function selectFileType(type: string) {
   selectedFileType.value = type;
   filterMenu.value = false;
@@ -1391,19 +1203,6 @@ function selectFileType(type: string) {
   color: var(--text);
 }
 
-/* The tab strip sits on the table card, so it takes the card's rule rather
-   than Vuetify's default underline, and the cell type rather than the button
-   scale - the same treatment the toolbar above it already gets. */
-.doc-tabs {
-  border-bottom: 1px solid var(--border);
-}
-
-.doc-tabs :deep(.v-tab) {
-  font-size: var(--fs-cell);
-  letter-spacing: normal;
-  min-width: 0;
-}
-
 .table-download-btn {
   min-width: 106px;
   height: 30px;

package/components/EntryPass/QrTemplatePreview.vue

@@ -32,18 +32,28 @@
             </v-col>
 
             <v-col cols="12" class="mt-5">
-              <!-- The pass used to print five QRs - four 80px copies at the
-                   corners around a 130px centre one - so a strip could be cut
-                   apart. It now carries a single large QR, matching what
-                   `createReceiptLayout` sends to the thermal printer. -->
-              <img
-                v-if="qrLarge"
-                :src="qrLarge"
-                width="260"
-                height="260"
-                class="qr-preview__code my-2"
-                alt="Entry pass QR code"
-              />
+              <!-- UPPER QR -->
+              <v-row no-gutters>
+                <v-col cols="6">
+                  <img v-if="qrSmall" :src="qrSmall" width="80" height="80" />
+                </v-col>
+                <v-col cols="6">
+                  <img v-if="qrSmall" :src="qrSmall" width="80" height="80" />
+                </v-col>
+              </v-row>
+
+              <!-- CENTER QR -->
+              <img v-if="qrLarge" :src="qrLarge" width="130" height="130" class="my-2" />
+
+              <!-- LOWER QR -->
+              <v-row no-gutters>
+                <v-col cols="6">
+                  <img v-if="qrSmall" :src="qrSmall" width="80" height="80" />
+                </v-col>
+                <v-col cols="6">
+                  <img v-if="qrSmall" :src="qrSmall" width="80" height="80" />
+                </v-col>
+              </v-row>
             </v-col>
 
             <v-col cols="12" class="mt-5">
@@ -80,11 +90,12 @@ defineProps({
 
 const emit = defineEmits(["update:modelValue"]);
 
+const qrSmall = ref<string>("");
 const qrLarge = ref<string>("");
 
 onMounted(async () => {
-  // Rendered at the size it is displayed at, so the modules stay crisp.
-  qrLarge.value = await QRCode.toDataURL("123123", { width: 260, margin: 1 });
+  qrSmall.value = await QRCode.toDataURL("123123", { width: 80, margin: 1 });
+  qrLarge.value = await QRCode.toDataURL("123123", { width: 130, margin: 1 });
 });
 
 const now = new Date();
@@ -101,11 +112,4 @@ const timeStr = now.toLocaleTimeString();
   font-weight: var(--fw-card-title);
   color: var(--text);
 }
-
-/* The dialog is 550px wide but narrows on small screens, so the QR is capped
-   at its own width rather than a fixed 260px that would overflow the card. */
-.qr-preview__code {
-  max-width: 100%;
-  height: auto;
-}
 </style>

package/components/EntryPassInformation.vue

@@ -99,18 +99,10 @@
       <template v-if="passType === 'NFC'">
         <div class="mt-3">
           <InputLabel title="Select Cards" />
-          <!-- Was a `v-select` over the first 100 cards, which only lets the
-               operator scroll. Typing now goes to the endpoint as `search`
-               (debounced, page 1), and reaching the end of the list fetches
-               the next page. Vuetify's own client-side match on `cardNo` is
-               left on as well: API-core does not read `search` yet, so until
-               it does that is what makes typing narrow the list. -->
-          <v-autocomplete
+          <v-select
             v-model="selectedCards"
-            v-model:search="cardSearch"
             :items="filteredCardItems"
             :loading="cardsLoading"
-            :hide-no-data="false"
             item-title="cardNo"
             item-value="_id"
             density="comfortable"
@@ -118,30 +110,10 @@
             chips
             closable-chips
             hide-details
-            placeholder="Search or select cards..."
+            placeholder="Select cards..."
             return-object
-            @update:model-value="cardSearch = ''"
           >
-            <template #append-item>
-              <!-- Sentinel for infinite scroll. Keyed on the page so it
-                   re-mounts after each append: an IntersectionObserver only
-                   reports changes, so a sentinel that stays in view after a
-                   short page would otherwise never fire again. -->
-              <div
-                v-if="cardHasMore"
-                :key="cardPage"
-                v-intersect="onCardListEndReached"
-                class="d-flex justify-center py-2"
-              >
-                <v-progress-circular
-                  v-if="cardsLoadingMore"
-                  indeterminate
-                  size="20"
-                  width="2"
-                />
-              </div>
-            </template>
-          </v-autocomplete>
+          </v-select>
         </div>
 
         <div class="mt-3">
@@ -350,7 +322,6 @@ const props = defineProps({
 const emit = defineEmits(["update:modelValue", "update:quantity", "update:cards", "update:availableQrCount"]);
 
 const { getAvailableContractorCards, generateQrVms } = useAccessManagement();
-const { debounce } = useUtils();
 
 const nfcEnabled = computed(() => props.settings?.data?.settings?.nfcPass ?? false);
 const hidQrCodeEnabled = computed(() => {
@@ -396,53 +367,21 @@ const filteredCardItems = computed(() =>
     : cardItems.value
 );
 const cardsLoading = ref(false);
-const cardsLoadingMore = ref(false);
-// Typed text in the card picker. Reset after each pick so the next search
-// starts from the full list instead of staying narrowed to the last term.
-const cardSearch = ref("");
-const CARD_PAGE_SIZE = 100;
-const cardPage = ref(1);
-const cardHasMore = ref(false);
-// Bumped on every request. A response whose number is no longer current is
-// dropped, so a slow page-1 search cannot overwrite a newer one and a
-// load-more cannot append onto a list that has since been replaced.
-let cardRequestSeq = 0;
 const generating = ref(false);
 const availableCount = ref<number | null>(null);
 
-// The picker is NFC-only (see the template's `v-if`), so only NFC fetches
-// carry the search term and only NFC reacts to typing. The QR path keeps
-// its page-1, no-search fetch and its top-up generation untouched.
-const cardFetchType = computed<"NFC" | "QRCODE" | null>(() =>
-  passType.value === "NFC" ? "NFC" : passType.value === "QR" ? "QRCODE" : null,
-);
-
-async function fetchCards(
-  type: "NFC" | "QRCODE" = "NFC",
-  opts: { page?: number; append?: boolean } = {},
-) {
+async function fetchCards(type: "NFC" | "QRCODE" = "NFC") {
   if (!props.siteId || !props.unitId) return;
-  const page = opts.page ?? 1;
-  const append = opts.append === true;
-  const seq = ++cardRequestSeq;
-  const query = {
-    type,
-    siteId: props.siteId,
-    unitId: props.unitId,
-    page,
-    limit: CARD_PAGE_SIZE,
-    // Vuetify writes null into the search model when it clears the field.
-    search: type === "NFC" ? cardSearch.value ?? "" : undefined,
-  };
-
-  if (append) cardsLoadingMore.value = true;
-  else cardsLoading.value = true;
+  cardsLoading.value = true;
   if (type === "QRCODE") emit("update:availableQrCount", null);
   try {
-    const res = await getAvailableContractorCards(query);
-    if (seq !== cardRequestSeq) return;
-    let items: any[] = res?.data?.[0]?.items ?? [];
-    availableCount.value = (res?.data?.[2] as any)?.count ?? items.length;
+    const res = await getAvailableContractorCards({
+      type,
+      siteId: props.siteId,
+      unitId: props.unitId,
+    });
+    cardItems.value = res?.data?.[0]?.items ?? [];
+    availableCount.value = (res?.data?.[2] as any)?.count ?? cardItems.value.length;
 
     if (type === "QRCODE" && props.settings?.data?._id && availableCount.value !== null && availableCount.value > 0 && availableCount.value < 50) {
       cardsLoading.value = false;
@@ -453,64 +392,30 @@ async function fetchCards(
         quantity: 50,
       });
       // Re-fetch to get the updated count after generation
-      const refreshed = await getAvailableContractorCards(query);
-      if (seq !== cardRequestSeq) return;
-      items = refreshed?.data?.[0]?.items ?? [];
-      availableCount.value = (refreshed?.data?.[2] as any)?.count ?? items.length;
+      const refreshed = await getAvailableContractorCards({
+        type,
+        siteId: props.siteId,
+        unitId: props.unitId,
+      });
+      cardItems.value = refreshed?.data?.[0]?.items ?? [];
+      availableCount.value = (refreshed?.data?.[2] as any)?.count ?? cardItems.value.length;
       generating.value = false;
     }
 
-    cardItems.value = append ? [...cardItems.value, ...items] : items;
-    cardPage.value = page;
-    // A short page is the last one. An exact multiple of the page size costs
-    // one extra, empty fetch, which then turns this off.
-    cardHasMore.value = items.length === CARD_PAGE_SIZE;
-
     if (type === "QRCODE") emit("update:availableQrCount", availableCount.value);
   } catch (err: any) {
-    if (seq !== cardRequestSeq) return;
     const msg = err?.data?.message ?? err?.message ?? String(err);
     showSnackbar(`Entry pass service error: ${msg}`);
+    availableCount.value = null;
+    cardItems.value = [];
     generating.value = false;
-    // A failed load-more keeps what is already listed; a failed first page
-    // clears the list as before.
-    if (!append) {
-      availableCount.value = null;
-      cardItems.value = [];
-      cardHasMore.value = false;
-      if (type === "QRCODE") emit("update:availableQrCount", null);
-    }
+    if (type === "QRCODE") emit("update:availableQrCount", null);
   } finally {
-    // Only the request that is still current may clear the flags; a stale
-    // one finishing late must not switch off a newer request's spinner.
-    if (seq === cardRequestSeq) {
-      cardsLoading.value = false;
-      cardsLoadingMore.value = false;
-      generating.value = false;
-    }
+    cardsLoading.value = false;
+    generating.value = false;
   }
 }
 
-function onCardListEndReached(isIntersecting: boolean) {
-  if (!isIntersecting || !cardHasMore.value) return;
-  if (cardsLoading.value || cardsLoadingMore.value) return;
-  const type = cardFetchType.value;
-  if (!type) return;
-  fetchCards(type, { page: cardPage.value + 1, append: true });
-}
-
-const searchCards = debounce(() => {
-  if (cardFetchType.value !== "NFC") return;
-  fetchCards("NFC");
-}, 500);
-
-// Vuetify hands back null when it clears the field, and re-sets "" on blur;
-// only a real change of the trimmed term should cost a request.
-watch(cardSearch, (val, old) => {
-  if ((val ?? "").trim() === (old ?? "").trim()) return;
-  searchCards();
-});
-
 function addCard(card: any) {
   const already = selectedCards.value.some((c) => c._id === card._id);
   if (!already) selectedCards.value = [...selectedCards.value, card];

package/components/Facility/BookingSetup.vue

@@ -482,55 +482,6 @@
         </draggable>
       </section>
 
-      <!-- RESIDENT CHECKLISTS -->
-      <v-col cols="12" class="mt-4 border-t">
-        <v-row align="center" no-gutters class="pt-5">
-          <v-col cols="9" class="d-flex align-center text-body-2">
-            <v-row no-gutters>
-              <v-col cols="12" class="header-style">
-                Resident Checklists
-              </v-col>
-              <v-col cols="12" class="text-body-2 text-medium-emphasis">
-                Allow residents to view and complete assigned checklists. Each
-                checklist requires a photo upload before submission.
-              </v-col>
-            </v-row>
-          </v-col>
-          <v-col cols="3" class="d-flex align-center justify-end">
-            <v-switch
-              v-model="facility.isResidentChecklistEnabled"
-              class="d-flex align-center"
-              color="accent"
-              hide-details
-              @update:model-value="onToggleResidentChecklist"
-            />
-          </v-col>
-        </v-row>
-
-        <!-- SECURITY CHECKLISTS -->
-        <v-row align="center" no-gutters class="border-t pt-5 mt-5">
-          <v-col cols="9" class="d-flex align-center text-body-2">
-            <v-row no-gutters>
-              <v-col cols="12" class="header-style">
-                Security Checklists
-              </v-col>
-              <v-col cols="12" class="text-body-2 text-medium-emphasis">
-                Allow Security to view and complete assigned checklists
-              </v-col>
-            </v-row>
-          </v-col>
-          <v-col cols="3" class="d-flex align-center justify-end">
-            <v-switch
-              v-model="facility.isSecurityChecklistEnabled"
-              class="d-flex align-center"
-              color="accent"
-              hide-details
-              @update:model-value="onToggleSecurityChecklist"
-            />
-          </v-col>
-        </v-row>
-      </v-col>
-
       <v-col cols="12" class="mt-10">
         <p class="header-style font-weight-bold mb-5 mt-md-0 ml-md-4">
           Other Settings
@@ -1069,20 +1020,6 @@ watchEffect(() => {
   }
 });
 
-/**
- * One checklist, one owner, and always one. A facility is completed either by
- * its residents or by Security, so the two switches are each other's inverse:
- * turning either off turns the other on. There is no state where a facility
- * has no checklist owner.
- */
-function onToggleResidentChecklist(enabled: boolean | null) {
-  facility.value.isSecurityChecklistEnabled = !enabled;
-}
-
-function onToggleSecurityChecklist(enabled: boolean | null) {
-  facility.value.isResidentChecklistEnabled = !enabled;
-}
-
 function onToggleBookingUnitLimit(val: any) {
   if (val) {
     isBookingUnitLimitEnabled.value = true;