@7365admin1/layer-common 3.0.8 → 3.0.10

package/components/Layout/NavigationDrawer.vue

@@ -12,7 +12,7 @@
 
       <!-- NAVIGATION ITEMS -->
       <v-tooltip
-        v-for="(item, index) in props.navigationItems"
+        v-for="(item, index) in navigationItems"
         :key="`${item.title}-${index}`"
         location="right"
         :disabled="!item.disabled"
@@ -52,6 +52,36 @@ const emit = defineEmits(["navigate"]);
 
 const { drawer } = useLocal();
 const { APP_NAME } = useRuntimeConfig().public;
+const route = useRoute();
+const orgId = computed(() => String(route.params.org ?? ""));
+const siteId = computed(() => String(route.params.site ?? ""));
+const { useHidFaceReaderMenu } = useHidNavigation();
+const { menuItem: hidFaceReaderMenu } = useHidFaceReaderMenu({
+  org: orgId,
+  site: siteId,
+  cacheKey: "layout-navigation-hid-site",
+});
+
+const navigationItems = computed(() => {
+  const items = [...(props.navigationItems as TNavigationItem[])];
+
+  if (
+    hidFaceReaderMenu.value &&
+    !items.some((item) => item.title === hidFaceReaderMenu.value?.title)
+  ) {
+    const insertAfterIndex = items.findIndex(
+      (item) => item.title === "Pass & Key Mgmt",
+    );
+
+    if (insertAfterIndex >= 0) {
+      items.splice(insertAfterIndex + 1, 0, hidFaceReaderMenu.value);
+    } else {
+      items.push(hidFaceReaderMenu.value);
+    }
+  }
+
+  return items;
+});
 
 const handleClick = (item: any) => {
   if (item.disabled) return;

package/components/MemberInformation.vue

@@ -204,7 +204,7 @@ function handleScanQRPass() {
 }
 
 watch(selectedPass, (newVal) => {
-    memberForm.visitorPass = [{ keyId: newVal }]
+    memberForm.visitorPass = [...(newVal ? [{ keyId: newVal }] : [])]
 })
 
 watch(scannedPassValue, (newVal) => {

package/components/NavigationItem.vue

@@ -22,9 +22,9 @@
   </v-list-group>
 
   <v-list-item
-    v-else-if="props.route && props.route.name"
+    v-else-if="routeTo"
     :prepend-icon="icon"
-    :to="props.route"
+    :to="routeTo"
     class="text-subtitle-2"
   >
     {{ title }}
@@ -76,8 +76,15 @@ const props = defineProps({
 });
 
 function onParentClick() {
-  if (props.route && props.route.name) {
-    navigateTo(props.route);
+  if (routeTo.value) {
+    navigateTo(routeTo.value);
   }
 }
+
+const routeTo = computed(() => {
+  if (!props.route) return null;
+  if (props.route.name) return props.route;
+  if (props.route.path) return props.route;
+  return null;
+});
 </script>

package/components/SiteSettings.vue

@@ -150,7 +150,28 @@
         </v-expansion-panel-text>
       </v-expansion-panel>
 
-      <slot name="panels" :can-manage="canManageSiteSettings" :site-id="siteId" />
+      <v-expansion-panel color="primary">
+        <v-expansion-panel-title>
+          <v-icon class="mr-2">mdi-face-recognition</v-icon>
+          HID Face Reader
+        </v-expansion-panel-title>
+        <v-expansion-panel-text>
+          <HidServiceSettingsPanel
+            :site="siteId"
+            :org="orgId"
+            :site-data="siteData"
+            @refresh="refreshSiteData"
+          />
+          <v-divider class="my-4" />
+          <HidQrCodeConfiguration :site="siteId" />
+        </v-expansion-panel-text>
+      </v-expansion-panel>
+
+      <slot
+        name="panels"
+        :can-manage="canManageSiteSettings"
+        :site-id="siteId"
+      />
     </v-expansion-panels>
 
     <Snackbar v-model="toast.show" :text="toast.message" :color="toast.color" />
@@ -165,6 +186,7 @@ import useANPRSettings from "../composables/useANPRSettings";
 
 const props = defineProps({
   siteId: { type: String, required: true },
+  orgId: { type: String, default: "" },
   createdBy: { type: String },
   canManageSiteSettings: { type: Boolean, default: false },
   showAnprCamera: { type: Boolean, default: false },
@@ -227,6 +249,7 @@ const { data: siteData, refresh: refreshSiteData } = await useLazyAsyncData(
   `site-${props.siteId}`,
   () => getSiteById(props.siteId)
 );
+const orgId = computed(() => props.orgId || String((siteData.value as any)?.orgId ?? ""));
 
 watch(
   siteData,

package/components/VisitorForm.vue

@@ -357,14 +357,17 @@
               :passKeys="visitor.passKeys"
             />
             <EntryPassInformation
-              v-if="entryPassSettings?.data?.settings?.nfcPass"
+              v-if="showEntryPassInformation"
               v-model="passType"
               v-model:quantity="passQuantity"
               v-model:cards="passCards"
               :settings="entryPassSettings"
-              :loading="entryPassSettingsPending"
+              :loading="entryPassSettingsPending || siteDataPending"
               :site-id="prop.site"
               :unit-id="visitor.unit || null"
+              :visitor-type="prop.type"
+              :hid-qr-code-enabled="hidQrCodePassAllowed"
+              :hid-qr-printer-configured="hasHidQrPrinterConfig"
             />
           </v-col>
 
@@ -619,6 +622,8 @@ const visitor = reactive<Partial<TVisitorPayload>>({
 const passType = ref<string | null>(null);
 const passQuantity = ref<number | null>(1);
 const passCards = ref<{ _id: string; cardNo: string }[]>([]);
+const hidQrPrintPayload = ref<string | null>(null);
+const hidQrPrinted = ref(false);
 
 const registeredUnitCompanyName = ref("N/A");
 
@@ -685,13 +690,46 @@ const showNextButton = computed(() => {
 });
 
 const showShowKeysField = computed(() => {
-  return prop.type === "contractor";
+  return ["guest", "contractor", "walk-in"].includes(prop.type);
 });
 
 const requireNRIC = computed(() => {
   return prop.type !== "walk-in" && prop.type !== "guest";
 });
 
+const hidQrCodePassConfig = computed(() => {
+  return (siteData.value as any)?.metadata?.hidQrCodePass || {};
+});
+
+const hidQrCodePassEnabled = computed(() => {
+  return Boolean(hidQrCodePassConfig.value?.enabled);
+});
+
+const hidQrPrinterConfig = computed(() => {
+  return hidQrCodePassConfig.value?.printer || {};
+});
+
+const hasHidQrPrinterConfig = computed(() => {
+  return Boolean(hidQrPrinterConfig.value?.vendorId && hidQrPrinterConfig.value?.productId);
+});
+
+const hidQrTemplate = computed(() => {
+  return hidQrCodePassConfig.value?.template || {};
+});
+
+const hidQrValidityMinutes = computed(() => {
+  const value = Number(hidQrCodePassConfig.value?.validityMinutes);
+  return Number.isFinite(value) && value > 0 ? value : 60;
+});
+
+const hidQrCodePassAllowed = computed(() => {
+  return hidQrCodePassEnabled.value && ["guest", "contractor", "walk-in"].includes(prop.type);
+});
+
+const showEntryPassInformation = computed(() => {
+  return Boolean(entryPassSettings.value?.data?.settings?.nfcPass || hidQrCodePassAllowed.value);
+});
+
 const companyNames = ref<string[]>([]);
 const companyAutofillDataArray = ref<
   {
@@ -1189,6 +1227,13 @@ async function handleNextPage() {
 async function submit() {
   formRef.value!.validate();
   errorMessage.value = "";
+  if (!validForm.value) {
+    errorMessage.value = "Please complete all required fields *";
+    return;
+  }
+
+  if (passType.value === "HID_QR" && !validateHidQrPrinterConfig()) return;
+
   processing.value = true;
 
   let payload: Partial<TVisitorPayload> = {
@@ -1251,7 +1296,12 @@ async function submit() {
     }
 
     if (res) {
-      if (prop.type === "contractor" && passType.value) {
+      if (passType.value === "HID_QR") {
+        const printed = await printHidQrCodePass(getVisitorIdFromResponse(res), false);
+        if (!printed) return;
+      }
+
+      if (prop.type === "contractor" && (passType.value === "QR" || passType.value === "NFC")) {
         const visitorId = res as unknown as string;
         const rawUrl = entryPassSettings.value?.data?.settings?.url;
         const { encrypted: acmUrl } = await $fetch<{ encrypted: string }>(
@@ -1373,6 +1423,131 @@ async function submit() {
   }
 }
 
+function parseUsbId(value: unknown) {
+  if (typeof value === "number") return value;
+  const text = String(value || "").trim();
+  if (!text) return NaN;
+  return text.toLowerCase().startsWith("0x")
+    ? parseInt(text, 16)
+    : parseInt(text, 10);
+}
+
+function getVisitorIdFromResponse(response: any) {
+  if (typeof response === "string") return response;
+  return (
+    response?._id ||
+    response?.id ||
+    response?.data?._id ||
+    response?.data?.id ||
+    response?.insertedId ||
+    response?.data?.insertedId ||
+    ""
+  );
+}
+
+function getHidQrPrinterUsbIds() {
+  const vendorId = parseUsbId(hidQrPrinterConfig.value.vendorId);
+  const productId = parseUsbId(hidQrPrinterConfig.value.productId);
+  return { vendorId, productId };
+}
+
+function validateHidQrPrinterConfig() {
+  if (!hasHidQrPrinterConfig.value) {
+    errorMessage.value = "No printer is configured on HID settings. Please configure the HID QR Code printer before continuing.";
+    return false;
+  }
+
+  const { vendorId, productId } = getHidQrPrinterUsbIds();
+
+  if (!Number.isFinite(vendorId) || !Number.isFinite(productId)) {
+    errorMessage.value = "Invalid HID QR Code printer configuration. Please check Vendor and Product ID in Settings.";
+    return false;
+  }
+
+  return true;
+}
+
+function buildHidQrCodePayload(visitorId = "") {
+  if (hidQrPrintPayload.value) return hidQrPrintPayload.value;
+
+  const issuedAt = new Date();
+  const expiresAt = new Date(issuedAt.getTime() + hidQrValidityMinutes.value * 60 * 1000);
+  const nonce =
+    typeof crypto !== "undefined" && "randomUUID" in crypto
+      ? crypto.randomUUID()
+      : `${Date.now()}-${Math.random().toString(36).slice(2)}`;
+
+  hidQrPrintPayload.value = JSON.stringify({
+    purpose: "hid-amico-visitor-access",
+    visitorId,
+    site: prop.site,
+    org: prop.org,
+    visitorType: prop.type,
+    name: visitor.name || "",
+    company: visitor.company || "",
+    contact: visitor.contact || "",
+    nric: visitor.nric || "",
+    plateNumber: visitor.plateNumber || "",
+    block: visitor.block || "",
+    level: visitor.level || "",
+    unit: visitor.unit || "",
+    unitName: visitor.unitName || "",
+    address: buildVisitorAddress(),
+    issuedAt: issuedAt.toISOString(),
+    expiresAt: expiresAt.toISOString(),
+    nonce,
+  });
+
+  return hidQrPrintPayload.value;
+}
+
+function buildVisitorAddress() {
+  const blockLabel = blocksArray.value.find((b: any) => b.value === visitor.block)?.title || "";
+  const levelLabel = levelsArray.value.find((l: any) => l.value === visitor.level)?.title || "";
+  const unitLabel = unitsArray.value.find((u: any) => u.value === visitor.unit)?.title || visitor.unitName || "";
+  return [blockLabel, levelLabel, unitLabel].filter(Boolean).join("/");
+}
+
+async function printHidQrCodePass(visitorId = "", manageProcessing = true) {
+  if (hidQrPrinted.value) return true;
+
+  if (!validateHidQrPrinterConfig()) return false;
+
+  const { vendorId, productId } = getHidQrPrinterUsbIds();
+
+  if (manageProcessing) processing.value = true;
+  try {
+    const printResult = await testConnection(
+      vendorId,
+      productId,
+      true,
+      buildHidQrCodePayload(visitorId),
+      null,
+      null,
+      visitor.company || visitor.name || "",
+      buildVisitorAddress(),
+      hidQrTemplate.value?.header || "HID QR Code",
+      hidQrTemplate.value?.subtext || "Scan QR code for access",
+    );
+
+    if (!printResult?.success || printResult?.printTest?.success === false) {
+      errorMessage.value =
+        printResult?.printTest?.error ||
+        printResult?.error ||
+        "Unable to print HID QR Code. Please check the printer connection.";
+      return false;
+    }
+
+    hidQrPrinted.value = true;
+    return true;
+  } catch (error: any) {
+    errorMessage.value = error?.message || "Unable to print HID QR Code.";
+    return false;
+  } finally {
+    if (manageProcessing) processing.value = false;
+  }
+}
+
 watch(
   () => visitor.plateNumber,
   (newVal) => {
@@ -1380,6 +1555,22 @@ watch(
   }
 );
 
+watch(
+  [
+    () => passType.value,
+    () => visitor.name,
+    () => visitor.company,
+    () => visitor.block,
+    () => visitor.level,
+    () => visitor.unit,
+    () => visitor.unitName,
+  ],
+  () => {
+    hidQrPrintPayload.value = null;
+    hidQrPrinted.value = false;
+  }
+);
+
 const membersFieldIncomplete = computed(() => {
   if (!visitor.members || visitor.members.length === 0) return false;
 

package/components/VisitorFormSelection.vue

@@ -11,7 +11,17 @@
     <v-card-text style="max-height: 100vh; overflow-y: auto" class="pa-5 my-5">
       <span class="text-subtitle-2 w-100 font-weight-medium d-flex justify-center mb-3">Please Select Visitor Type</span>
       <template v-for="item in selection" :key="item.value">
-        <v-btn v-if="showSelection(item)" color="primary-button" block variant="flat" rounded="md" size="48" :text="item.label" @click="select(item.value)" class="my-2 text-capitalize text-subtitle-2" />
+        <v-btn
+          v-if="showSelection(item)"
+          color="primary-button"
+          block
+          variant="flat"
+          rounded="md"
+          size="48"
+          :text="item.label"
+          @click="select(item.value)"
+          class="my-2 text-capitalize text-subtitle-2"
+        />
       </template>
     </v-card-text>
 
@@ -39,7 +49,7 @@ const prop = defineProps({
   mode: {
     type: String as PropType<"add" | "edit" | "register">,
     default: "add",
-  }
+  },
 });
 
 const emit = defineEmits(['cancel', 'select']);

package/composables/useDashboard.ts

@@ -1,4 +1,22 @@
 export default function () {
+  function getDashboard(
+    site = "",
+    serviceType: TServiceType,
+    period: TDashboardValues = "today",
+    query: Record<string, any> = {}
+  ) {
+    return useNuxtApp().$api<Record<string, any>>(
+      `/api/dashboard/serviceType/${serviceType}/site/${site}`,
+      {
+        method: "GET",
+        query: {
+          period,
+          ...query,
+        },
+      }
+    );
+  }
+
   function getDashboardHygiene(
     site = "",
     period: TDashboardValues = "today",
@@ -15,7 +33,7 @@ export default function () {
     );
   }
 
-  function getDashboardHygieneWeeklyActivity(
+  function getDashboardWeeklyActivity(
     site = "",
     serviceType: TServiceType = "cleaning_services",
     period?: TDashboardValues
@@ -34,6 +52,7 @@ export default function () {
   function getDashboardHygieneTaskSchedule(
     site = "",
     serviceType: TServiceType,
+    period: TDashboardValues = "today",
     page = 1,
     limit = 4
   ) {
@@ -42,6 +61,7 @@ export default function () {
     >(`/api/dashboard/serviceType/${serviceType}/site/${site}/task-schedule`, {
       method: "GET",
       query: {
+        period,
         page,
         limit,
       },
@@ -51,6 +71,7 @@ export default function () {
   function getDashboardHygieneAttendance(
     site = "",
     serviceType: TServiceType,
+    period: TDashboardValues = "today",
     page = 1,
     limit = 4
   ) {
@@ -59,6 +80,7 @@ export default function () {
       {
         method: "GET",
         query: {
+          period,
           page,
           limit,
         },
@@ -69,6 +91,7 @@ export default function () {
   function getDashboardHygieneFeedbacks(
     site = "",
     serviceType: TServiceType,
+    period: TDashboardValues = "today",
     page = 1,
     limit = 4
   ) {
@@ -77,6 +100,7 @@ export default function () {
       {
         method: "GET",
         query: {
+          period,
           page,
           limit,
         },
@@ -86,12 +110,13 @@ export default function () {
 
   function getDashboardPropertyManagement(
     site = "",
+    serviceType: TServiceType = "property_management_agency",
     period: TDashboardValues = "today",
     type = "",
     facility = ""
   ) {
     return useNuxtApp().$api<Record<string, any>>(
-      `/api/dashboard/serviceType/property_management_agency/site/${site}`,
+      `/api/dashboard/serviceType/${serviceType}/site/${site}`,
       {
         method: "GET",
         query: {
@@ -105,11 +130,12 @@ export default function () {
 
   function getDashboardSecurity(
     site = "",
+    serviceType: TServiceType = "security_agency",
     period: TDashboardValues = "today",
     type = ""
   ) {
     return useNuxtApp().$api<Record<string, any>>(
-      `/api/dashboard/serviceType/security_agency/site/${site}`,
+      `/api/dashboard/serviceType/${serviceType}/site/${site}`,
       {
         method: "GET",
         query: {
@@ -121,8 +147,9 @@ export default function () {
   }
 
   return {
+    getDashboard,
     getDashboardHygiene,
-    getDashboardHygieneWeeklyActivity,
+    getDashboardWeeklyActivity,
     getDashboardHygieneTaskSchedule,
     getDashboardHygieneAttendance,
     getDashboardHygieneFeedbacks,

package/composables/useHidAmico.ts

@@ -0,0 +1,152 @@
+type HidReaderPayload = {
+  site?: string;
+  name?: string;
+  location?: string;
+  baseUrl?: string;
+  username?: string;
+  password?: string;
+  deviceId?: string;
+  monitorPath?: string;
+  enabled?: boolean;
+  status?: string;
+  lastSyncAt?: string;
+  lastSyncStatus?: "idle" | "running" | "completed" | "failed";
+  lastSyncMessage?: string;
+};
+
+type HidIdentityPayload = {
+  site?: string;
+  hidUserId?: string | number;
+  registration?: string;
+  cardNo?: string;
+  person?: string;
+  user?: string;
+  member?: string;
+  visitor?: string;
+  type?: "resident" | "staff" | "contractor" | "visitor" | "unknown";
+  status?: "active" | "inactive" | "deleted";
+  metadata?: Record<string, any>;
+};
+
+export default function useHidAmico() {
+  const basePath = "/api/access-management/hid";
+
+  function getReaders(query: Record<string, any> = {}) {
+    return useNuxtApp().$api<Record<string, any>>(`${basePath}/readers`, {
+      method: "GET",
+      query,
+    });
+  }
+
+  function createReader(payload: HidReaderPayload) {
+    return useNuxtApp().$api<Record<string, any>>(`${basePath}/readers`, {
+      method: "POST",
+      body: payload,
+    });
+  }
+
+  function updateReader(readerId: string, payload: HidReaderPayload) {
+    return useNuxtApp().$api<Record<string, any>>(`${basePath}/readers/${readerId}`, {
+      method: "PATCH",
+      body: payload,
+    });
+  }
+
+  function deleteReader(readerId: string) {
+    return useNuxtApp().$api<Record<string, any>>(`${basePath}/readers/${readerId}`, {
+      method: "DELETE",
+    });
+  }
+
+  function testReader(readerId: string) {
+    return useNuxtApp().$api<Record<string, any>>(`${basePath}/readers/${readerId}/test`, {
+      method: "POST",
+    });
+  }
+
+  function syncReader(readerId: string, payload: Record<string, any> = {}) {
+    return useNuxtApp().$api<Record<string, any>>(`${basePath}/readers/${readerId}/sync`, {
+      method: "POST",
+      body: payload,
+    });
+  }
+
+  function runObjectOperation(readerId: string, payload: Record<string, any>) {
+    return useNuxtApp().$api<Record<string, any>>(`${basePath}/readers/${readerId}/objects`, {
+      method: "POST",
+      body: payload,
+    });
+  }
+
+  function getReaderConfiguration(readerId: string, payload: Record<string, string[]> = {}) {
+    return useNuxtApp().$api<Record<string, any>>(`${basePath}/readers/${readerId}/configuration`, {
+      method: "POST",
+      body: payload,
+    });
+  }
+
+  function setReaderConfiguration(readerId: string, payload: Record<string, any>) {
+    return useNuxtApp().$api<Record<string, any>>(`${basePath}/readers/${readerId}/configuration`, {
+      method: "PUT",
+      body: payload,
+    });
+  }
+
+  function getIdentities(readerId: string, query: Record<string, any> = {}) {
+    return useNuxtApp().$api<Record<string, any>>(`${basePath}/readers/${readerId}/identities`, {
+      method: "GET",
+      query,
+    });
+  }
+
+  function getLogs(readerId: string, query: Record<string, any> = {}) {
+    return useNuxtApp().$api<Record<string, any>>(`${basePath}/readers/${readerId}/logs`, {
+      method: "GET",
+      query,
+    });
+  }
+
+  function getUserImage(readerId: string, hidUserId: string | number) {
+    return useNuxtApp().$api<Record<string, any>>(`${basePath}/readers/${readerId}/users/${hidUserId}/image`, {
+      method: "GET",
+    });
+  }
+
+  function createIdentity(readerId: string, payload: HidIdentityPayload) {
+    return useNuxtApp().$api<Record<string, any>>(`${basePath}/readers/${readerId}/identities`, {
+      method: "POST",
+      body: payload,
+    });
+  }
+
+  function updateIdentity(identityId: string, payload: HidIdentityPayload) {
+    return useNuxtApp().$api<Record<string, any>>(`${basePath}/identities/${identityId}`, {
+      method: "PATCH",
+      body: payload,
+    });
+  }
+
+  function deleteIdentity(identityId: string) {
+    return useNuxtApp().$api<Record<string, any>>(`${basePath}/identities/${identityId}`, {
+      method: "DELETE",
+    });
+  }
+
+  return {
+    getReaders,
+    createReader,
+    updateReader,
+    deleteReader,
+    testReader,
+    syncReader,
+    runObjectOperation,
+    getReaderConfiguration,
+    setReaderConfiguration,
+    getLogs,
+    getUserImage,
+    getIdentities,
+    createIdentity,
+    updateIdentity,
+    deleteIdentity,
+  };
+}