@7365admin1/layer-common 1.10.9 → 1.10.10

package/components/IncidentReport/affectedEntities.vue

@@ -1,58 +1,5 @@
 <template>
   <v-row no-gutters class="px-5 pt-4">
-    <!-- Any unit affected -->
-    <v-col cols="12" class="border-b pb-5 mb-5 mt-1">
-      <p class="mb-2" style="font-size: 17px; font-weight: 600">
-        Any unit affected?
-      </p>
-      <p
-        v-if="affectedEntities?.anyUnitAffectedValue == 'no'"
-        class="mt-2 text-h6 text-capitalize"
-      >
-        {{ affectedEntities?.anyUnitAffectedValue }}
-      </p>
-      <!-- Block Level Unit Section -->
-      <v-row v-else no-gutters class="d-flex align-center mt-5">
-        <v-row
-          v-if="affectedEntities?.affectedUnit.hasOwnProperty('block')"
-          no-gutters
-        >
-          <v-col cols="12" sm="4">
-            <InputLabel class="text-capitalize" title="Block" />
-            <p class="my-1 text-h6">
-              {{ affectedEntities?.affectedUnit?.block }}
-            </p>
-          </v-col>
-          <v-col cols="12" sm="4">
-            <InputLabel class="text-capitalize" title="Level" />
-            <p class="my-1 text-h6">
-              {{ affectedEntities?.affectedUnit?.level }}
-            </p>
-          </v-col>
-          <v-col cols="12" sm="4">
-            <InputLabel class="text-capitalize" title="Unit" />
-            <p class="my-1 text-h6">
-              {{ affectedEntities?.affectedUnit?.unit }}
-            </p>
-          </v-col>
-        </v-row>
-
-        <v-col v-else cols="12" class="px-1 mb-0">
-          <InputLabel class="text-capitalize" title="Location" />
-          <p class="my-1 text-h6 text-capitalize">
-            {{ affectedEntities?.affectedUnit?.other }}
-          </p>
-        </v-col>
-
-        <v-col cols="12" class="px-1 mb-0 mt-5">
-          <InputLabel class="text-capitalize" title="Remarks" />
-          <p class="my-1 text-h6 text-capitalize">
-            {{ affectedEntities?.affectedUnit?.remarks }}
-          </p>
-        </v-col>
-      </v-row>
-    </v-col>
-
     <!-- Anyone affected/injured -->
     <v-col cols="12" class="border-b pb-5 mb-5 mt-1">
       <p class="mb-2" style="font-size: 17px; font-weight: 600">
@@ -161,6 +108,14 @@ const injuredTableHeader = [
     title: "Contact Number",
     value: "contact",
   },
+  {
+    title: "Block / Level / Unit Location",
+    value: "incidentLocation",
+  },
+  {
+    title: "Remarks",
+    value: "remarks",
+  },
 ];
 
 const damagePropertyTableHeader = [
@@ -180,10 +135,6 @@ const damagePropertyTableHeader = [
     title: "Contact Number",
     value: "contact",
   },
-  {
-    title: "Action",
-    value: "action",
-  },
 ];
 
 const isShowNRIC = ref(false);

package/components/SiteSettings.vue

@@ -0,0 +1,285 @@
+<template>
+    <v-row no-gutters>
+        <v-expansion-panels multiple v-model="openPanels" >
+
+            <!-- SITE SETTINGS -->
+            <v-expansion-panel color="primary">
+                <v-expansion-panel-title>
+                    <v-icon class="mr-2">mdi-cog</v-icon>
+                    Site Settings
+                </v-expansion-panel-title>
+
+                <v-expansion-panel-text>
+                    <v-row no-gutters class="d-flex justify-center">
+                        <v-col cols="12">
+                            <v-row no-gutters>
+                                <v-col cols="12">
+                                    <span class="text-h4 font-weight-bold"> Site Settings </span>
+                                </v-col>
+
+                                <v-col cols="12">
+                                    <v-row no-gutters>
+                                        <v-col cols="12" lg="4" class="mt-2">
+                                            <NumberSettingField v-model="blocks" title="No. of blocks" type="blocks"
+                                                :read-only="!canManageSiteSettings"
+                                                :existing-block-number="existingBlockNumber" :site-id="siteId"
+                                                :disabled="existingBlockNumber === blocks" @success="refreshSiteData" />
+                                        </v-col>
+                                    </v-row>
+                                </v-col>
+
+                                <v-col cols="12">
+                                    <v-row no-gutters>
+                                        <v-col cols="12" lg="4" class="mt-2">
+                                            <NumberSettingField v-model="guardPosts" title="No. of guard posts"
+                                                type="guard_posts" :read-only="!canManageSiteSettings"
+                                                :existing-guard-posts-number="existingGuardPostNumber" :site-id="siteId"
+                                                :disabled="existingGuardPostNumber === guardPosts"
+                                                @success="refreshSiteData" />
+                                        </v-col>
+                                    </v-row>
+                                </v-col>
+
+                                <v-col cols="12">
+                                    <v-row no-gutters>
+                                        <v-col cols="12" lg="4" class="mt-2">
+                                            <v-row no-gutters>
+                                                <v-form v-model="gracePeriodValid">
+                                                    <v-row>
+                                                        <v-col cols="6">
+                                                            <InputLabel class="text-capitalize font-weight-bold"
+                                                                title="Grace Period" required />
+                                                            <v-text-field v-model="gracePeriod" type="number"
+                                                                density="comfortable" :readonly="!canManageSiteSettings"
+                                                                :rules="[requiredRule]" />
+                                                        </v-col>
+
+                                                        <v-col cols="6">
+                                                            <v-btn v-if="canManageSiteSettings" color="primary"
+                                                                class="text-none mt-6" size="large" variant="flat"
+                                                                :disabled="!gracePeriodValid ||
+                                                                    existingGracePeriodNumber === gracePeriod
+                                                                    " :loading="gracePeriodLoading" text="Save"
+                                                                @click="handleSaveGracePeriod" />
+                                                        </v-col>
+                                                    </v-row>
+                                                </v-form>
+                                            </v-row>
+                                        </v-col>
+                                    </v-row>
+                                </v-col>
+
+                            </v-row>
+                        </v-col>
+                    </v-row>
+                </v-expansion-panel-text>
+            </v-expansion-panel>
+
+            <!-- ANPR CAMERA -->
+            <v-expansion-panel color="primary">
+                <v-expansion-panel-title>
+                    <v-icon class="mr-2">mdi-camera</v-icon>
+                    ANPR Camera
+                </v-expansion-panel-title>
+
+                <v-expansion-panel-text>
+                    <CameraMain :site="siteId" :read-only="!canManageSiteSettings"
+                        :guard-posts="siteData?.metadata?.guardPosts" />
+                </v-expansion-panel-text>
+            </v-expansion-panel>
+
+            <!-- CCTV CAMERA -->
+            <v-expansion-panel color="primary">
+                <v-expansion-panel-title>
+                    <v-icon class="mr-2">mdi-cctv</v-icon>
+                    CCTV Camera
+                </v-expansion-panel-title>
+
+                <v-expansion-panel-text>
+                    <CameraMain :site="siteId" type="ip" :read-only="!canManageSiteSettings" />
+                </v-expansion-panel-text>
+            </v-expansion-panel>
+
+            <v-expansion-panel color="primary">
+                <v-expansion-panel-title>
+                    <v-icon class="mr-2">mdi-format-list-numbered</v-icon>
+                    Work Order Settings
+                </v-expansion-panel-title>
+
+                <v-expansion-panel-text>
+                    <v-text-field v-model="prefix" label="Prefix" :disabled="isLoading || !canManageSiteSettings"
+                        @input="handleInput" />
+
+                    <v-select v-model="noOfDigits" :items="[1, 2, 3, 4, 5, 6, 7, 8, 9, 10]" label="No. of Digits"
+                        :disabled="isLoading || !canManageSiteSettings" />
+
+                    <v-text-field v-model="orderNumberPreview" label="Preview" readonly />
+
+                    <v-btn v-if="canManageSiteSettings" class="mt-2" :loading="isLoading" @click="save">
+                        Save
+                    </v-btn>
+                </v-expansion-panel-text>
+            </v-expansion-panel>
+
+
+            <v-expansion-panel color="primary">
+                <v-expansion-panel-title>
+                    <v-icon class="mr-2">mdi-truck</v-icon>
+                    Delivery Companies
+                </v-expansion-panel-title>
+                <v-expansion-panel-text class="">
+                    <DeliveryCompany :site="siteId" v-model:initial="deliveryCompanies" @refresh-site="refreshSiteData" @update:companiesValue="handleUpdateCompanies"
+                        :read-only="!canManageSiteSettings" />
+                </v-expansion-panel-text>
+
+            </v-expansion-panel>
+
+        </v-expansion-panels>
+
+        <Snackbar v-model="toast.show" :text="toast.message" :color="toast.color" />
+    </v-row>
+</template>
+
+<script setup lang="ts">
+const props = defineProps({
+    siteId: { type: String, required: true },
+    canManageSiteSettings: { type: Boolean, default: false }
+})
+
+const openPanels = ref([0]) // default open first
+
+const { getSiteById, updateSitebyId } = useSiteSettings()
+const { requiredRule } = useUtils()
+const { getFileUrl } = useFile()
+const { getWorkOrderSettings, createWorkOrderSettings } = useWorkOrder()
+
+const blocks = ref(0)
+const guardPosts = ref(0)
+const gracePeriod = ref(0)
+
+const existingBlockNumber = ref(0)
+const existingGuardPostNumber = ref(0)
+const existingGracePeriodNumber = ref(0)
+
+const gracePeriodValid = ref(false)
+const gracePeriodLoading = ref(false)
+const deliveryCompanies = ref<string[]>([])
+
+const siteLogo = ref<any[]>([])
+const uploadedSiteLogo = ref("")
+
+const prefix = ref("")
+const noOfDigits = ref(1)
+const isLoading = ref(false)
+
+const toast = reactive({
+    show: false,
+    message: "",
+    color: ""
+})
+
+const { data: siteData, refresh: refreshSiteData } = await useLazyAsyncData(
+    `site-${props.siteId}`,
+    () => getSiteById(props.siteId)
+)
+
+watch(siteData, (val: TSite) => {
+    if (!val) return
+
+    blocks.value = val.metadata?.block || 0
+    guardPosts.value = val.metadata?.guardPosts || 0
+    gracePeriod.value = val.metadata?.gracePeriod || 0
+
+    existingBlockNumber.value = blocks.value
+    existingGuardPostNumber.value = guardPosts.value
+    existingGracePeriodNumber.value = gracePeriod.value
+    deliveryCompanies.value = Array.isArray(val.deliveryCompanyList) ? [...val.deliveryCompanyList] : []
+
+    uploadedSiteLogo.value = val.metadata?.incidentLogo || ""
+}, { immediate: true })
+
+async function handleSaveGracePeriod() {
+    gracePeriodLoading.value = true
+    try {
+        await updateSitebyId(props.siteId, {
+            field: "metadata.gracePeriod",
+            value: gracePeriod.value
+        })
+        show("Grace period updated", "success")
+        refreshSiteData()
+    } catch (e: any) {
+        show(e?.data?.message || "Error updating grace period", "error")
+    } finally {
+        gracePeriodLoading.value = false
+    }
+}
+
+async function handleLogo(action: string) {
+    try {
+        await updateSitebyId(props.siteId, {
+            field: "metadata.incidentLogo",
+            value: action === "add" ? siteLogo.value[0] : 0
+        })
+        show("Logo updated", "success")
+        refreshSiteData()
+    } catch {
+        show("Error updating logo", "error")
+    } finally {
+        siteLogo.value = []
+    }
+}
+
+const onUploadedLogoPreview = () => {
+    if (!uploadedSiteLogo.value) return ""
+    return getFileUrl(uploadedSiteLogo.value)
+}
+
+const { data: workOrderSetting } = await useLazyAsyncData(
+    `work-${props.siteId}`,
+    () => getWorkOrderSettings({ site: props.siteId, service: "Security" })
+)
+
+watchEffect(() => {
+    if (workOrderSetting.value) {
+        prefix.value = workOrderSetting.value.prefix
+        noOfDigits.value = workOrderSetting.value.noOfDigits
+    }
+})
+
+function handleInput(e: any) {
+    prefix.value = e.target.value
+        .replace(/[^A-Z]/g, "")
+        .toUpperCase()
+}
+
+function handleUpdateCompanies(value: string[]) {
+    deliveryCompanies.value = value
+}
+
+const orderNumberPreview = computed(() => {
+    return `${prefix.value}${"0".repeat(noOfDigits.value - 1)}1`
+})
+
+async function save() {
+    try {
+        isLoading.value = true
+        await createWorkOrderSettings({
+            site: props.siteId,
+            service: "Security",
+            prefix: prefix.value,
+            noOfDigits: noOfDigits.value
+        })
+        show("Saved successfully", "success")
+    } catch {
+        show("Error saving", "error")
+    } finally {
+        isLoading.value = false
+    }
+}
+
+function show(message: string, color: string) {
+    toast.show = true
+    toast.message = message
+    toast.color = color
+}
+</script>

package/components/Tooltip/Info.vue

@@ -0,0 +1,33 @@
+<template>
+    <v-tooltip v-bind="$attrs" :text="text" @click.stop>
+        <template v-slot:activator="{ props: activatorProps }">
+            <v-btn icon="mdi-information-symbol" v-bind="activatorProps" class="p-0 m-0 d-flex align-center"
+                :density="density" :size="size" color="primary-button" />
+        </template>
+    </v-tooltip>
+</template>
+
+<script setup lang="ts">
+
+import type { VTooltip} from "vuetify/components"
+
+type TTooltipDensity = VTooltip["$props"]["density"]
+
+const props = defineProps({
+    text: {
+        type: String,
+        default: ""
+    },
+     size: {
+        type: String,
+        default: ""
+    },
+    density: {
+        type: String as PropType<TTooltipDensity>,
+        default: "default"
+    }
+})
+
+</script>
+
+<style scoped></style>

package/components/VisitorForm.vue

@@ -110,6 +110,36 @@
             </v-col>
           </template>
 
+          <template v-if="shouldShowField('delivery-company')">
+            <v-col cols="12">
+              <InputLabel class="text-capitalize" title="Delivery Company" />
+              <v-combobox v-model="deliveryCompany" v-model:search="deliveryCompanyInput" ref="companyCombo"
+                autocomplete="off" :hide-no-data="false" :items="deliveryCompanyList" item-value="value"
+                :loading="siteDataPending" variant="outlined"
+                density="comfortable" persistent-hint small-chips>
+                <template v-slot:no-data>
+                  <v-list-item>
+                    <v-list-item-title v-if="fetchCompanyListPending">
+                      <v-progress-circular indeterminate size="20" class="mr-3" />
+                      Searching companies…
+                    </v-list-item-title>
+                    <v-list-item-title v-else-if="companyNameInput" @click.stop="handleAddNewCompany"
+                      class="d-flex align-center ga-1">
+                      <span><v-icon icon="mdi-plus" /></span>Add "<strong>{{ companyNameInput }}</strong>" as new
+                      company.
+                    </v-list-item-title>
+                    <v-list-item-title v-else-if="!companyNameInput && companyNames.length === 0">
+                      Start typing to search for companies.
+                    </v-list-item-title>
+                    <v-list-item-title v-else>
+                      No companies available. Start typing to add a new one.
+                    </v-list-item-title>
+                  </v-list-item>
+                </template>
+              </v-combobox>
+            </v-col>
+          </template>
+
 
           <v-col v-if="shouldShowField('plateNumber')" cols="12">
             <v-row>
@@ -356,13 +386,17 @@ const blocksArray = ref<TDefaultOptionObj[]>([]);
 const levelsArray = ref<TDefaultOptionObj[]>([]);
 const unitsArray = ref<TDefaultOptionObj[]>([]);
 
+const deliveryCompany = ref("");
+const deliveryCompanyInput = ref("");
+const deliveryCompanyList = ref<string[]>([]);
+
 const matchingPlateNumberNonCheckedOutArr = ref<TVisitor[]>([])
 
 
 const vehicleNumberUserItems = ref<TPeople[]>([])
 
 
-const shouldShowField = (fieldKey: keyof TVisitorPayload) => {
+const shouldShowField = (fieldKey: keyof TVisitorPayload | 'delivery-company') => {
   if (prop.type !== "contractor" || contractorStep.value === 1) {
     const visibleFields = typeFieldMap[prop.type];
     return visibleFields?.includes(fieldKey);
@@ -634,6 +668,7 @@ const {
   data: siteData,
   refresh: refreshSiteData,
   status: blockStatus,
+  pending: siteDataPending,
 } = useLazyAsyncData(`fetch-site-data-${prop.site}`, () =>
   getSiteById(prop.site)
 );
@@ -665,7 +700,7 @@ const {
 watch(
   siteData,
   (newVal) => {
-    const siteDataValue = newVal as any;
+    const siteDataValue = newVal as TSite;
     if (siteDataValue) {
       const numberOfBlocks = siteDataValue.metadata?.block || 0;
       for (let i = 1; i <= numberOfBlocks; i++) {
@@ -674,6 +709,9 @@ watch(
           value: i,
         });
       }
+
+      deliveryCompanyList.value = Array.isArray(siteDataValue?.deliveryCompanyList) ? siteDataValue.deliveryCompanyList : [];
+
     } else {
       blocksArray.value = [];
     }
@@ -857,6 +895,14 @@ async function submit() {
       members: visitor.members,
     };
   }
+
+  if(prop.type === "delivery"){
+    payload = {
+      ...payload,
+      company: deliveryCompany.value
+    }
+  }
+
   try {
     const res = await createVisitor(payload);
     if (res) {

package/components/VisitorManagement.vue

@@ -89,13 +89,19 @@
           <span class="text-capitalize">{{
             UTCToLocalTIme(item.checkIn) || "-"
           }}</span>
+          <span>
+            <v-icon v-if="item?.snapshotEntryImage" size="17" icon="mdi-image" @click.stop="handleViewImage(item.snapshotEntryImage)" />
+          </span>
         </span>
         <span class="d-flex align-center ga-2">
           <v-icon icon="mdi-clock-time-eight-outline" color="red" size="20" />
           <template v-if="item.checkOut">
             <span class="text-capitalize">{{
-              UTCToLocalTIme(item.checkOut) || "_"
+              UTCToLocalTIme(item.checkOut) || "-"
             }}</span>
+            <span>
+              <v-icon v-if="item?.snapshotExitImage" size="17" icon="mdi-image" @click.stop="handleViewImage(item.snapshotExitImage)" />
+            </span>
             <span v-if="item?.manualCheckout">
               <TooltipInfo text="Manual Checkout" density="compact" size="x-small" />
             </span>
@@ -120,8 +126,9 @@
     </v-dialog>
 
     <v-dialog v-model="dialog.showForm" v-if="activeVisitorFormType" width="450" persistent>
-      <VisitorForm :mode="mode" :org="orgId" :site="siteId" :visitor-data="selectedVisitorDataObject" :type="activeVisitorFormType" @back="handleClickBack"
-        @done="handleVisitorFormDone" @done:more="handleVisitorFormCreateMore" @close:all="handleCloseAll" />
+      <VisitorForm :mode="mode" :org="orgId" :site="siteId" :visitor-data="selectedVisitorDataObject"
+        :type="activeVisitorFormType" @back="handleClickBack" @done="handleVisitorFormDone"
+        @done:more="handleVisitorFormCreateMore" @close:all="handleCloseAll" />
     </v-dialog>
 
     <v-dialog v-model="dialog.viewVisitor" width="450" persistent>
@@ -200,6 +207,7 @@ const {
 const { debounce, formatCamelCaseToWords, formatDate, UTCToLocalTIme } =
   useUtils();
 const { formatLocation } = useSecurityUtils();
+const {  getFileUrlAnpr } = useFile();
 // const { status: visitorStatus, search } = useRoute().query as { status: string, search: string};
 
 const route = useRoute()
@@ -276,8 +284,11 @@ const formattedFields = {
   level: "Level",
   unitName: "Unit",
   checkIn: "Check In",
+  snapshotEntryImage: "Entry Image",
   checkOut: "Check Out",
+  snapshotExitImage: "Exit Image",
   remarks: "Remarks",
+
 } as const;
 
 function filterTypeSelectionLabel() {
@@ -326,7 +337,7 @@ const {
       params.status = activeTab.value
     } else if (activeTab.value === "guests") {
       params.type = "guest"
-      params.status = undefined
+      params.status = "pending"
     }
 
     return await getVisitors(params)
@@ -348,11 +359,11 @@ watch(getVisitorReq, (newData: any) => {
 });
 
 const selectedVisitorObject = computed(() => {
+
   const obj = items.value.find((x: any) => x?._id === selectedVisitorId.value);
   if (!obj) return {};
   const type = obj?.type as TVisitorType | undefined;
-  if (!type) return {};
-  let includedKeys: string[] = ["checkIn", "checkOut"];
+  let includedKeys: string[] = ["checkIn", "checkOut", "plateNumber", "snapshotEntryImage", "snapshotExitImage"];
   includedKeys.unshift(...(typeFieldMap[type] ?? []));
   return Object.fromEntries(
     Object.entries(obj).filter(([key]) => includedKeys.includes(key))
@@ -434,6 +445,12 @@ function handleRegistrationUnregisteredVisitor(item: Partial<TVisitor>) {
   mode.value = "register";
 }
 
+function handleViewImage(imageId: string) {
+  const imageEndpoint = `${siteId}/${imageId}`;
+  const imageUrl = getFileUrlAnpr(imageEndpoint);
+  window.open(imageUrl, "_blank");
+}
+
 
 async function handleProceedDeleteVisitor() {
   try {

package/composables/useAccessManagement.ts

@@ -243,6 +243,24 @@ export default function useAccessManagement() {
     );
   }
 
+  function generateQrVms(params: {
+    site: string;
+    unitId: string;
+    quantity: number;
+  }) {
+    return useNuxtApp().$api<Record<string, any>>(
+      `/api/access-management/generate-qr-vms`,
+      {
+        method: "POST",
+        body: {
+          site: params.site,
+          unitId: params.unitId,
+          quantity: params.quantity,
+        },
+      }
+    );
+  }
+
   return {
     getDoorAccessLevels,
     getLiftAccessLevels,
@@ -261,5 +279,6 @@ export default function useAccessManagement() {
     saveVisitorAccessCardQrTag,
     getAllVisitorAccessCardsQrTags,
     getAvailableContractorCards,
+    generateQrVms,
   };
 }

package/composables/useBulletin.ts

@@ -1,12 +1,17 @@
+import type { APP_CONSTANTS } from "../constants/app";
+
 export default function(){
 
-  const recipientList: { title: string, value: TAnnouncementRecipients }[] = [
-    // resident | security_agency | cleaning_services | mechanical_electrical | property_management_agency
+  const recipientList: { title: string, value: typeof APP_CONSTANTS[keyof typeof APP_CONSTANTS] }[] = [
     { title: "Security Agency", value: "security_agency" },
     { title: "Cleaning Services", value: "cleaning_services" },
     { title: "Mechanical & Electrical", value: "mechanical_electrical" },
     { title: "Property Management Agency", value: "property_management_agency" },
-    { title: "Resident", value: "resident" }
+    { title: "Resident", value: "resident" },
+    { title: "Pest Control", value: "pest_control_services" },
+    { title: "Landscaping", value: "landscaping_services" },
+    { title: "Pool Maintenance", value: "pool_maintenance_services" },
+
 ]
 
   async function add(payload: Partial<TCreateAnnouncementPayload>) {