@7365admin1/layer-common 1.11.18 → 1.11.20

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @iservice365/layer-common
 
+## 1.11.20
+
+### Patch Changes
+
+- e9bd022: fix feedbacks page when refreshing or reloading the page
+
+## 1.11.19
+
+### Patch Changes
+
+- e340731: Update Layer-common
+
 ## 1.11.18
 
 ### Patch Changes

package/components/AddPassKeyToVisitor.vue

@@ -0,0 +1,207 @@
+<template>
+    <v-card width="100%" :loading="processing">
+        <v-toolbar>
+            <v-row no-gutters class="fill-height px-6 d-flex justify-space-between align-center" align="center">
+                <span class="font-weight-bold text-subtitle-1">Assign Pass & Keys</span>
+                <ButtonClose @click="emit('close')" />
+            </v-row>
+        </v-toolbar>
+
+        <v-card-text>
+            <v-row no-gutters class="ga-1">
+                <v-col cols="12">
+                    <span class="text-subtitle-2 text-medium-emphasis">
+                       Name: {{ prop.visitor.name }}
+                    </span>
+                </v-col>
+
+                <v-col cols="12" class="mt-3">
+                    <InputLabel title="Pass" />
+                    <v-autocomplete
+                        v-model="selectedPass"
+                        v-model:search="passInput"
+                        :hide-no-data="false"
+                        :items="passItems"
+                        item-title="prefixAndName"
+                        item-value="_id"
+                        variant="outlined"
+                        hide-details
+                        density="compact"
+                        small-chips
+                        :loading="fetchPassesPending"
+                    >
+                        <template v-slot:chip="{ props: chipProps, item }">
+                            <v-chip v-if="selectedPass" v-bind="chipProps" prepend-icon="mdi-card-bulleted-outline"
+                                :text="item.raw?.prefixAndName" />
+                        </template>
+                        <template v-slot:no-data>
+                            <v-list-item density="compact">
+                                <v-list-item-title>No available passes</v-list-item-title>
+                            </v-list-item>
+                        </template>
+                    </v-autocomplete>
+                </v-col>
+
+                <v-col v-if="showKeys" cols="12" class="mt-3">
+                    <InputLabel title="Keys" />
+                    <v-autocomplete
+                        v-model="selectedKeys"
+                        v-model:search="keyInput"
+                        :hide-no-data="false"
+                        :items="keyItems"
+                        item-title="prefixAndName"
+                        item-value="_id"
+                        multiple
+                        variant="outlined"
+                        hide-details
+                        density="compact"
+                        small-chips
+                        :loading="fetchKeysPending"
+                    >
+                        <template v-slot:chip="{ props: chipProps, item }">
+                            <v-chip v-if="selectedKeys.length > 0" v-bind="chipProps" prepend-icon="mdi-key"
+                                :text="item.raw?.prefixAndName" />
+                        </template>
+                        <template v-slot:no-data>
+                            <v-list-item density="compact">
+                                <v-list-item-title>No available keys</v-list-item-title>
+                            </v-list-item>
+                        </template>
+                    </v-autocomplete>
+                </v-col>
+            </v-row>
+
+            <v-row v-if="errorMessage" no-gutters class="mt-2">
+                <p class="text-error text-subtitle-2 w-100 text-center">{{ errorMessage }}</p>
+            </v-row>
+        </v-card-text>
+
+        <v-toolbar density="compact">
+            <v-row no-gutters>
+                <v-col cols="6">
+                    <v-btn tile block variant="text" class="text-none" size="48" text="Cancel" @click="emit('close')" />
+                </v-col>
+                <v-col cols="6">
+                    <v-btn
+                        tile block variant="flat" color="black" class="text-none" size="48"
+                        text="Assign"
+                        :disabled="!selectedPass && selectedKeys.length === 0"
+                        :loading="processing"
+                        @click="handleSubmit"
+                    />
+                </v-col>
+            </v-row>
+        </v-toolbar>
+    </v-card>
+</template>
+
+<script setup lang="ts">
+import type { PropType } from 'vue'
+import usePassKey from '../composables/usePassKey'
+import useVisitor from '../composables/useVisitor'
+
+const prop = defineProps({
+    visitor: {
+        type: Object as PropType<TVisitor>,
+        required: true,
+    },
+    site: {
+        type: String,
+        required: true,
+    },
+    type: {
+        type: String as PropType<TVisitorType>,
+        required: true,
+    },
+    contractorType: {
+        type: String,
+        default: '',
+    },
+})
+
+const emit = defineEmits<{
+    (e: 'done'): void
+    (e: 'close'): void
+}>()
+
+const { getPassKeysByPageSearch } = usePassKey()
+const { updateVisitor } = useVisitor()
+
+const processing = ref(false)
+const errorMessage = ref('')
+
+const selectedPass = ref<string>('')
+const selectedKeys = ref<string[]>([])
+const passInput = ref('')
+const keyInput = ref('')
+const passItems = ref<TPassKey[]>([])
+const keyItems = ref<TPassKey[]>([])
+
+const showKeys = computed(() => prop.visitor.type === 'contractor')
+
+const passTypesComputed = computed(() => {
+    if (prop.type === 'contractor') {
+        return prop.contractorType === 'property-agent' ? ['agent-pass'] : ['contractor-pass']
+    }
+    return ['visitor-pass']
+})
+
+const { data: passesData, pending: fetchPassesPending } = await useLazyAsyncData(
+    `add-pass-key-visitor-passes-${prop.visitor._id}`,
+    () => getPassKeysByPageSearch({
+        search: passInput.value,
+        page: 1,
+        limit: 500,
+        passTypes: passTypesComputed.value,
+        sites: [prop.site],
+        statuses: ['Available'],
+    })
+)
+
+const { data: keysData, pending: fetchKeysPending } = await useLazyAsyncData(
+    `add-pass-key-visitor-keys-${prop.visitor._id}`,
+    () => getPassKeysByPageSearch({
+        search: keyInput.value,
+        page: 1,
+        limit: 500,
+        passTypes: ['pass-key'],
+        sites: [prop.site],
+        statuses: ['Available'],
+    })
+)
+
+watch(passesData, (data: any) => {
+    passItems.value = Array.isArray(data?.items) ? data.items : []
+})
+
+watch(keysData, (data: any) => {
+    keyItems.value = Array.isArray(data?.items) ? data.items : []
+})
+
+async function handleSubmit() {
+    if (!prop.visitor._id) return
+    errorMessage.value = ''
+    processing.value = true
+
+    try {
+        const payload: Partial<TVisitorPayload> = {}
+
+        if (selectedPass.value) {
+            payload.visitorPass = [{ keyId: selectedPass.value, status: "In Use" }]
+        }
+
+        if (selectedKeys.value.length > 0) {
+            payload.passKeys = selectedKeys.value.map(keyId => ({ keyId, status: "In Use" }))
+        }
+
+        await updateVisitor(prop.visitor._id, payload)
+        emit('done')
+    } catch (error: any) {
+        errorMessage.value = error?.data?.message || 'Failed to assign pass & keys. Please try again.'
+    } finally {
+        processing.value = false
+    }
+}
+</script>
+
+<style scoped></style>

package/components/AreaChecklistHistoryMain.vue

@@ -14,6 +14,22 @@
         @refresh="getAreaChecklistHistoryRefresh"
         @row-click="handleRowClick"
       >
+        <template #actions>
+          <v-row class="w-100" align="center" no-gutters>
+            <v-col cols="auto">
+              <v-btn
+                variant="text"
+                color="primary"
+                class="text-none"
+                @click="back"
+              >
+                <v-icon left>mdi-arrow-left</v-icon>
+                Back
+              </v-btn>
+            </v-col>
+          </v-row>
+        </template>
+
         <template #extension>
           <v-row no-gutters class="w-100 d-flex flex-column">
             <v-card
@@ -84,7 +100,7 @@ const props = defineProps({
   scheduleRoute: { type: String, default: "cleaning-schedule" },
 });
 
-const { formatDate } = useUtils();
+const { formatDate, back, debounce } = useUtils();
 
 const loading = ref(false);
 const message = ref("");
@@ -160,6 +176,18 @@ watchEffect(() => {
   }
 });
 
+const debouncedSearchRefresh = debounce(() => {
+  const wasPage = page.value;
+  page.value = 1;
+  if (wasPage === 1) {
+    getAreaChecklistHistoryRefresh();
+  }
+}, 450);
+
+watch(searchInput, () => {
+  debouncedSearchRefresh();
+});
+
 function handleRowClick(data: any) {
   const item = data?.item ?? data;
   const id = item?._id || item?.id || item?.areaId;

package/components/BuildingUnitFormEdit.vue

@@ -227,6 +227,17 @@
 
             </v-row>
           </v-col>
+
+          <v-col cols="12" class="mt-2">
+            <InputLabel class="text-capitalize d-block mb-1" title="Unit Documents" />
+            <InputFileV2
+              v-model="buildingUnit.buildingUnitFiles"
+              :multiple="true"
+              accept="*/*"
+              title="Upload documents"
+              :height="104"
+            />
+          </v-col>
         </v-row>
       </template>
     </v-card-text>
@@ -331,6 +342,35 @@ const buildingUnit = ref({
 
 buildingUnit.value = JSON.parse(JSON.stringify(prop.roomFacility));
 
+// Normalize buildingUnitFiles: extract IDs for InputFileV2, keep names in a separate map
+const buildingUnitFilesNames = ref<Record<string, string>>({});
+const rawFiles = buildingUnit.value.buildingUnitFiles as any[];
+if (rawFiles?.length && typeof rawFiles[0] === 'object') {
+  rawFiles.forEach((f: { id: string; name: string }) => {
+    buildingUnitFilesNames.value[f.id] = f.name ?? "";
+  });
+  buildingUnit.value.buildingUnitFiles = rawFiles.map((f: { id: string }) => f.id);
+}
+
+const { getFileById } = useFile();
+
+watch(
+  () => buildingUnit.value.buildingUnitFiles as string[],
+  async (ids) => {
+    for (const id of ids) {
+      if (!buildingUnitFilesNames.value[id]) {
+        try {
+          const meta = await getFileById(id) as any;
+          buildingUnitFilesNames.value[id] = meta?.data?.name ?? meta?.name ?? "";
+        } catch {
+          buildingUnitFilesNames.value[id] = "";
+        }
+      }
+    }
+  },
+  { deep: true }
+);
+
 const emit = defineEmits(["cancel", "success", "success:create-more", "delete-unit"]);
 
 
@@ -462,7 +502,7 @@ async function submit() {
       name: buildingUnit.value.name,
       level: buildingUnit.value.level,
       // category: buildingUnit.value.category,
-      buildingUnitFiles: buildingUnit.value.buildingUnitFiles || [],
+      buildingUnitFiles: (buildingUnit.value.buildingUnitFiles as string[] || []).map((id) => ({ id, name: buildingUnitFilesNames.value[id] ?? "" })),
       companyName: buildingUnit.value.companyName,
       companyRegistrationNumber: buildingUnit.value.companyRegistrationNumber || "",
       leaseStart: buildingUnit.value.leaseStart,

package/components/CleaningScheduleMain.vue

@@ -116,7 +116,7 @@ const props = defineProps({
 
 const startDate = ref("");
 const endDate = ref("");
-const status = ref<TScheduleAreaStatus>("All");
+const status = ref<TScheduleAreaStatus>("all");
 const statusOptions = [
   { title: "All", value: "all" },
   { title: "Open", value: "open" },
@@ -191,7 +191,7 @@ const {
       site: props.site,
       startDate: startDate.value,
       endDate: endDate.value,
-      status: status.value === "All" ? undefined : status.value,
+      status: status.value === "all" ? undefined : status.value,
       serviceType: props.serviceType,
     }),
   {

package/components/Input/DateTimePicker.vue

@@ -1,13 +1,13 @@
 <template>
     <div class="d-flex flex-column">
         <v-text-field v-bind="$attrs" ref="dateTimePickerRef" :model-value="dateTimeFormattedReadOnly" autocomplete="off"
-            :placeholder="placeholder" :rules="rules" style="z-index: 10" @click="openDatePicker">
+            :placeholder="inputPlaceholder" :rules="rules" style="z-index: 10" @click="openDatePicker">
             <template #append-inner>
                 <v-icon icon="mdi-calendar" @click.stop="openDatePicker" />
             </template>
         </v-text-field>
         <div class="w-100 d-flex align-end ga-3 hidden-input">
-            <input ref="dateInput" type="datetime-local" v-model="dateTime" />
+            <input ref="dateInput" :type="inputType" v-model="dateTime" />
         </div>
     </div>
 </template>
@@ -23,6 +23,10 @@ const prop = defineProps({
     placeholder: {
         type: String,
         default: 'DD/MM/YYYY, HH:MM AM/PM'
+    },
+    dateOnly: {
+        type: Boolean,
+        default: false
     }
 })
 
@@ -31,6 +35,10 @@ const dateTime = defineModel<string | null>({ default: null }) //2025-10-10T13:0
 const dateTimeUTC = defineModel<string | null>('utc', { default: null }) // UTC format
 
 const dateTimeFormattedReadOnly = ref<string | null>(null)
+const inputType = computed(() => (prop.dateOnly ? 'date' : 'datetime-local'))
+const inputPlaceholder = computed(() => (
+    prop.placeholder || (prop.dateOnly ? 'MM/DD/YYYY' : 'DD/MM/YYYY, HH:MM AM/PM')
+))
 
 
 
@@ -55,11 +63,16 @@ function convertToReadableFormat(dateStr: string): string {
     if (!dateStr) return "";
 
     const date = new Date(dateStr)
+    if (Number.isNaN(date.getTime())) return "";
 
-    const day = String(date.getDate()).padStart(2, '0')
     const month = String(date.getMonth() + 1).padStart(2, '0')
+    const day = String(date.getDate()).padStart(2, '0')
     const year = date.getFullYear()
 
+    if (prop.dateOnly) {
+        return `${month}/${day}/${year}`
+    }
+
     let hours = date.getHours()
     const minutes = String(date.getMinutes()).padStart(2, '0')
 
@@ -72,17 +85,36 @@ function convertToReadableFormat(dateStr: string): string {
     return `${day}/${month}/${year}, ${formattedTime}`
 }
 
+function toDateOnlyInputValue(dateStr: string): string {
+    if (!dateStr) return ''
+    if (/^\d{4}-\d{2}-\d{2}$/.test(dateStr)) return dateStr
+    const date = new Date(dateStr)
+    if (Number.isNaN(date.getTime())) return ''
+    const year = date.getFullYear()
+    const month = String(date.getMonth() + 1).padStart(2, '0')
+    const day = String(date.getDate()).padStart(2, '0')
+    return `${year}-${month}-${day}`
+}
+
 function handleInitialDate(){
     const dateDefault = dateTime.value
     const dateUTC = dateTimeUTC.value
     if(dateDefault){
         dateTimeFormattedReadOnly.value = convertToReadableFormat(dateDefault)
-        const localDate = new Date(dateDefault)
-        dateTimeUTC.value = localDate.toISOString()
+        if (prop.dateOnly) {
+            dateTimeUTC.value = toDateOnlyInputValue(dateDefault)
+        } else {
+            const localDate = new Date(dateDefault)
+            dateTimeUTC.value = localDate.toISOString()
+        }
     } else if (dateUTC){
         dateTimeFormattedReadOnly.value = convertToReadableFormat(dateUTC)
-        const localDate = new Date(dateUTC)
-        dateTime.value = formatDateISO8601(localDate)
+        if (prop.dateOnly) {
+            dateTime.value = toDateOnlyInputValue(dateUTC)
+        } else {
+            const localDate = new Date(dateUTC)
+            dateTime.value = formatDateISO8601(localDate)
+        }
     } else {
         dateTimeFormattedReadOnly.value = null
     }
@@ -98,8 +130,12 @@ watch(dateTime, (dateVal) => {
     }
 
     dateTimeFormattedReadOnly.value = convertToReadableFormat(dateVal)
-    const localDate = new Date(dateVal)
-    dateTimeUTC.value = localDate.toISOString()
+    if (prop.dateOnly) {
+        dateTimeUTC.value = toDateOnlyInputValue(dateVal)
+    } else {
+        const localDate = new Date(dateVal)
+        dateTimeUTC.value = localDate.toISOString()
+    }
 
 }, { immediate: false })
 

package/components/Input/FileV2.vue

@@ -77,7 +77,7 @@ const props = defineProps({
   }
 })
 
-const { addFile, deleteFile, getFileUrl, urlToFile } = useFile()
+const { addFile, deleteFile, getFileUrl, getFileById, urlToFile } = useFile()
 
 const showImageCarousel = ref(false)
 const activeImageId = ref("")
@@ -187,8 +187,9 @@ async function downloadFile(id: string, filename: string) {
     const result: { file: File; id: string }[] = []
     for (const id of ids) {
       try {
-        const url = await getFileUrl(id)
-        const name = decodeURIComponent(url.split('/').pop() || `file_${id}`)
+        const meta = await getFileById(id) as any
+        const name: string = meta?.data?.name || meta?.name || `file_${id}`
+        const url = getFileUrl(id)
         const file = await urlToFile(url, name)
         result.push({ file, id })
       } catch (err) {

package/components/MemberInformation.vue

@@ -19,7 +19,7 @@
                         </v-col>
 
                         <v-col cols="12">
-                            <v-autocomplete v-model="memberForm.visitorPass" v-model:search="passInput"
+                            <v-autocomplete v-model="selectedPass" v-model:search="passInput"
                                 :hide-no-data="false" class="mt-3" :items="passItemsFilteredFinal"
                                 item-title="prefixAndName" item-value="_id" label="Pass (optional)" variant="outlined"
                                 hide-details density="compact" persistent-hint small-chips>
@@ -35,7 +35,7 @@
                                 </template>
 
                                 <template v-slot:chip="{ props, item }">
-                                    <v-chip v-if="memberForm.visitorPass" v-bind="props"
+                                    <v-chip v-if="selectedPass" v-bind="props"
                                         prepend-icon="mdi-card-bulleted-outline"
                                         :text="item.raw?.prefixAndName"></v-chip>
                                 </template>
@@ -116,6 +116,8 @@ const errorMessage = ref('')
 const passInput = ref('')
 const passItems = ref<TPassKey[]>([])
 
+const selectedPass = ref<string>('')
+
 const members = defineModel<TMemberInfo[]>({ required: true, default: [] })
 const committedMembers = ref<TMemberInfo[]>([])
 
@@ -171,6 +173,10 @@ const membersDisplayed = computed(() => {
     })
 })
 
+watch(selectedPass, (newVal) => {
+    memberForm.visitorPass = [{ keyId: newVal }]
+})
+
 
 
 function handleClearForm() {

package/components/OvernightParkingAvailability.vue

@@ -111,7 +111,8 @@ const isHydrating = ref(true)
 
 const { requiredRule } = useUtils()
 const { generateTimeSlots, generateTimeSlotsFromStart } = useFacilityUtils()
-const { updateOvernightParkingAvailability, getOvernightParkingAvailability } = useSiteSettings()
+const { currentUser } = useLocalAuth()
+const { getOvernightParkingAvailabilityV2, createOrUpdateOvernightParkingAvailabilityV2 } = useSiteSettings()
 
 type TDay = Exclude<keyof TOvernightParkingAvailability, 'autoApproveOvernightParking'>
 type TOvernightParkingSlot = TOvernightParkingDay & { day: TDay }
@@ -139,9 +140,11 @@ const applyDialog = reactive({
 
 
 
-const { data: availabilityDataReq, refresh: refreshAvailability } = await useLazyAsyncData<TOvernightParkingAvailability>(
+const userType = computed(() => currentUser.value?.type ?? "site")
+const updatedByValue = computed(() => currentUser.value?._id ?? currentUser.value?.email ?? "system")
+const { data: availabilityDataReq, refresh: refreshAvailability } = await useLazyAsyncData<Record<string, any>>(
   `overnight-parking-availability-${props.site}`,
-  () => getOvernightParkingAvailability(props.site)
+  () => getOvernightParkingAvailabilityV2(props.site, userType.value)
 )
 
 watch(availabilityDataReq, (data) => {
@@ -152,15 +155,16 @@ watch(availabilityDataReq, (data) => {
     slot.isEnabled = data?.[day]?.isEnabled ?? false
     slot.startTime = data?.[day]?.startTime ?? null
     slot.endTime = data?.[day]?.endTime ?? null
-   setTimeout(() => {
-      isHydrating.value = false
-    }, 500)
   })
-
-  autoApproveOvernightParking.value = data?.autoApproveOvernightParking === true
+  autoApproveOvernightParking.value =
+    data?.autoApproveOvernightParking === true || data?.isAutoApproved === true
+  setTimeout(() => {
+    isHydrating.value = false
+  }, 500)
 }, { immediate: true })
 
 
+
 const overnightParkingSlotsArray = ref<TOvernightParkingSlot[]>(
   orderedDays.map((day) => ({
     day,
@@ -240,23 +244,20 @@ async function handleSave(action: 'toggle' | 'save') {
 
   let payload = {}
 
-  if(action === 'save') {
-    payload = {
-      ...model.value
-    }
-  } else if (action === 'toggle') {
-    payload = {
-      autoApproveOvernightParking: autoApproveOvernightParking.value,
-    }
+  payload = {
+    ...model.value,
+    autoApproveOvernightParking: autoApproveOvernightParking.value,
+    isAutoApproved: autoApproveOvernightParking.value,
+    updatedBy: updatedByValue.value,
   }
 
   try {
     loading.updating = true
-    await updateOvernightParkingAvailability(props.site, payload)
+    await createOrUpdateOvernightParkingAvailabilityV2(props.site, payload, userType.value)
+    refreshAvailability()
     message.value = 'Overnight parking settings updated successfully.'
     messageColor.value = 'success'
     messageSnackbar.value = true
-    refreshAvailability()
   } catch (error) {
     message.value = 'Failed to update overnight parking settings. Please try again.'
     messageColor.value = 'error'

package/components/ScheduleAreaMain.vue

@@ -208,12 +208,12 @@ const isScheduleClosed = computed(
 
 const items = ref<Array<Record<string, any>>>([]);
 
-const statusFilter = ref<TScheduleAreaStatus>("All");
+const statusFilter = ref<TScheduleAreaStatus>("all");
 const statusOptions = [
-  { title: "All", value: "All" },
-  { title: "Open", value: "Open" },
-  { title: "Ongoing", value: "Ongoing" },
-  { title: "Completed", value: "Completed" },
+  { title: "All", value: "all" },
+  { title: "Open", value: "open" },
+  { title: "Ongoing", value: "ongoing" },
+  { title: "Completed", value: "completed" },
 ];
 const areaTypeFilter = ref<TAreaType>("all");
 const typeOptions = [
@@ -235,7 +235,7 @@ const {
     getScheduleAreas({
       page: page.value,
       scheduleAreaId: props.scheduleAreaId,
-      status: statusFilter.value === "All" ? undefined : statusFilter.value,
+      status: statusFilter.value === "all" ? undefined : statusFilter.value,
       type: areaTypeFilter.value === "all" ? undefined : areaTypeFilter.value,
       serviceType: props.serviceType,
     }),

package/components/VisitorManagement.vue

@@ -20,8 +20,8 @@
                 <span class="text-caption">Not Checked Out</span>
               </template>
             </v-checkbox>
-            <InputDateTimePicker v-model:utc="dateFrom" density="compact" hide-details />
-            <InputDateTimePicker v-model:utc="dateTo" density="compact" hide-details />
+            <InputDatePicker v-model="dateFrom" density="compact" hide-details />
+            <InputDatePicker v-model="dateTo" density="compact" hide-details />
             <v-select v-if="activeTab == 'registered'" v-model="filterTypes" label="Filter by types" item-title="label"
               item-value="value" :items="visitorSelection" density="compact" clearable multiple max-width="200"
               hide-details>
@@ -43,7 +43,8 @@
           </span>
           <span class="text-capitalize">{{ item?.name }}</span>
         </span>
-        <span class="text-grey text-caption" v-if="item?.members?.length > 0">( +{{ item?.members?.length }} members)</span>
+        <span class="text-grey text-caption" v-if="item?.members?.length > 0">( +{{ item?.members?.length }}
+          members)</span>
       </template>
 
       <template v-slot:item.type-company="{ item }">
@@ -51,7 +52,7 @@
           <v-icon icon="mdi-user" size="15" />
           <span v-if="item.type === 'contractor'" class="text-capitalize">{{
             formatCamelCaseToWords(item.contractorType)
-          }}</span>
+            }}</span>
           <span v-else class="text-capitalize">{{ formatType(item) }}</span>
         </span>
         <span class="d-flex align-center ga-2">
@@ -90,7 +91,7 @@
             <v-icon icon="mdi-clock-time-four-outline" color="green" size="20" />
             <span class="text-capitalize">{{
               UTCToLocalTIme(item.checkIn) || "-"
-              }}</span>
+            }}</span>
             <span>
               <v-icon v-if="item?.snapshotEntryImage" size="17" icon="mdi-image"
                 @click.stop="handleViewImage(item.snapshotEntryImage)" />
@@ -101,7 +102,7 @@
             <template v-if="item.checkOut">
               <span class="text-capitalize">{{
                 UTCToLocalTIme(item.checkOut) || "-"
-                }}</span>
+              }}</span>
               <span>
                 <v-icon v-if="item?.snapshotExitImage" size="17" icon="mdi-image"
                   @click.stop="handleViewImage(item.snapshotExitImage)" />
@@ -127,6 +128,13 @@
               {{ (key as any)?.prefixAndName }}
             </v-chip>
           </div>
+          <div v-if="showAddPassKeyButton(item)" class="d-flex flex-wrap ga-1 mt-1 mt-2"
+            @click.stop="handleCheckout(item._id)">
+            <v-chip size="x-small" variant="tonal" prepend-icon="mdi-key" @click.stop="handleOpenAddPassKey(item)">
+              Add Pass/Key
+            </v-chip>
+
+          </div>
         </v-row>
       </template>
 
@@ -180,7 +188,7 @@
               </span>
 
               <span v-else-if="selectedVisitorObject[key]" class="d-flex ga-3 align-center"><strong>{{ label
-              }}:</strong>
+                  }}:</strong>
                 {{ formatValues(key, selectedVisitorObject[key]) }}
                 <TooltipInfo v-if="key === 'checkOut'" text="Manual Checkout" density="compact" size="x-small" />
               </span>
@@ -251,9 +259,9 @@
                 {{ (pass as any)?.prefixAndName }}
               </v-chip>
               <v-select hide-details max-width="200px" density="compact" :items="passStatusOptions" item-title="label"
-                item-value="value" v-model="pass.status"></v-select>
+                item-value="value" v-model="pass.status" :disabled="selectedVisitorObject.checkOut"></v-select>
               <v-textarea v-if="pass.status === 'Lost' || pass.status === 'Damaged'" no-resize rows="3" class="w-100"
-                density="compact" v-model="pass.remarks"></v-textarea>
+                density="compact" v-model="pass.remarks" :disabled="selectedVisitorObject.checkOut"></v-textarea>
             </v-row>
           </div>
           <div v-if="(keyReturnStatuses.length > 0)" class="mb-2">
@@ -264,32 +272,37 @@
                 {{ (key as any)?.prefixAndName }}
               </v-chip>
               <v-select hide-details max-width="200px" density="compact" :items="passStatusOptions" item-title="label"
-                item-value="value" v-model="key.status">
-              </v-select>
+                item-value="value" v-model="key.status" :disabled="selectedVisitorObject.checkOut"></v-select>
               <v-textarea v-if="key.status === 'Lost' || key.status === 'Damaged'" no-resize rows="3" class="w-100"
-                density="compact" v-model="key.remarks"></v-textarea>
+                density="compact" v-model="key.remarks" :disabled="selectedVisitorObject.checkOut"></v-textarea>
             </v-row>
           </div>
 
           <v-row no-gutters class="my-5">
-            <v-btn variant="flat" color="blue" density="comfortable" class="text-capitalize" :loading="loading.updatingPassKeys" @click.stop="handleUpdatePassKeys">Update Pass/Keys</v-btn>
+            <v-btn variant="flat" color="blue" density="comfortable" class="text-capitalize" :disabled="selectedVisitorObject.checkOut"
+              :loading="loading.updatingPassKeys" @click.stop="handleUpdatePassKeys" >Update Pass/Keys</v-btn>
           </v-row>
         </v-card-text>
         <v-toolbar class="pa-0" density="compact">
           <v-row no-gutters>
             <v-col cols="6">
-              <v-btn variant="text" block :disabled="loading.checkingOut"
+              <v-btn variant="text" block
                 @click="dialog.returnPassesKeys = false">Close</v-btn>
             </v-col>
             <v-col cols="6">
               <v-btn color="red" variant="flat" height="48" rounded="0" block :loading="loading.checkingOut"
-                :disabled="!canConfirmCheckout" @click="proceedCheckout">Confirm Checkout</v-btn>
+                :disabled="!canConfirmCheckout || selectedVisitorObject.checkOut" @click="proceedCheckout">Confirm Checkout</v-btn>
             </v-col>
           </v-row>
         </v-toolbar>
       </v-card>
     </v-dialog>
 
+    <v-dialog v-model="dialog.addPassKey" width="450" persistent>
+      <AddPassKeyToVisitor :visitor="selectedVisitorDataObject" :site="siteId" @close="dialog.addPassKey = false" 
+        @update="getVisitorRefresh" />
+    </v-dialog>
+
     <Snackbar v-model="messageSnackbar" :text="message" :color="messageColor" />
   </v-row>
 </template>
@@ -379,6 +392,7 @@ const dialog = reactive({
   snapshotImage: false,
   remarks: false,
   returnPassesKeys: false,
+  addPassKey: false
 });
 
 const snapshotImageUrl = ref("");
@@ -404,6 +418,19 @@ const tabOptions = [
   { name: "Resident Transactions", value: "resident-transactions" },
 ];
 
+function normalizeDateOnly(value: string) {
+  if (!value) return "";
+  if (/^\d{4}-\d{2}-\d{2}$/.test(value)) return value;
+
+  const parsedDate = new Date(value);
+  if (Number.isNaN(parsedDate.getTime())) return "";
+
+  const year = parsedDate.getFullYear();
+  const month = String(parsedDate.getMonth() + 1).padStart(2, "0");
+  const day = String(parsedDate.getDate()).padStart(2, "0");
+  return `${year}-${month}-${day}`;
+}
+
 const selectedVisitorDataObject = computed(() => {
   return items.value.find((x: any) => x?._id === selectedVisitorId.value) || {};
 });
@@ -472,8 +499,8 @@ const {
       page: page.value,
       site: siteId,
       search: searchInput.value,
-      dateTo: dateTo.value,
-      dateFrom: dateFrom.value,
+      dateTo: normalizeDateOnly(dateTo.value),
+      dateFrom: normalizeDateOnly(dateFrom.value),
       type: (filterTypes.value.length === 0 && activeTab.value === 'registered' ? "contractor,delivery,walk-in,pick-up,drop-off,guest" : filterTypes.value.filter(Boolean).join(",")),
       checkedOut: displayNotCheckedOut.value ? false : undefined
     }
@@ -507,8 +534,8 @@ const {
 
 watch(getVisitorReq, (newData: any) => {
   if (newData) {
-    // items.value = newData.items ?? [];
-    items.value = [{ _id: "testid", name: "John Doe", type: "Contractor", company: "ABC Corp", location: "Block A, Level 1, Unit 101", contact: "12345678", plateNumber: "SGX1234A", checkIn: new Date().toISOString(), checkOut: null, status: "registered", visitorPass: [{ _id: "1", keyId: "pass1", prefixAndName: "VIP Pass" }, { _id: "2", keyId: "pass2", prefixAndName: "VIP Pass 2" }], passKeys: [{ _id: "1", keyId: "key2", prefixAndName: "Master Key" }] }];
+    items.value = newData.items ?? [];
+    // items.value = [{ _id: "testid", name: "John Doe", type: "Contractor", company: "ABC Corp", location: "Block A, Level 1, Unit 101", contact: "12345678", plateNumber: "SGX1234A", checkIn: new Date().toISOString(), checkOut: null, status: "registered", visitorPass: [{ _id: "1", keyId: "pass1", prefixAndName: "VIP Pass" }, { _id: "2", keyId: "pass2", prefixAndName: "VIP Pass 2" }], passKeys: [{ _id: "1", keyId: "key2", prefixAndName: "Master Key" }] }];
     pages.value = newData.pages ?? 0;
     pageRange.value = newData?.pageRange ?? "-- - -- of --";
   }
@@ -540,6 +567,8 @@ function formatValues(key: string, value: any) {
   return value;
 }
 
+
+
 function handleAddNew() {
   dialog.showSelection = true;
   activeVisitorFormType.value = null;
@@ -555,6 +584,15 @@ function handleUpdatePage(newPageNum: number) {
   page.value = newPageNum;
 }
 
+function showAddPassKeyButton(item: any) {
+  const hasPasses = (item?.visitorPass?.length ?? 0) > 0;
+  const hasKeys = (item?.passKeys?.length ?? 0) > 0;
+
+  const isTypeWithPassKey = ["contractor", "guest", "walk-in"].includes(item?.type);
+
+  return !hasPasses && !hasKeys && isTypeWithPassKey && item?.status === "registered" && !item?.checkOut;
+}
+
 function handleSelectVisitorType(type: TVisitorType) {
   dialog.showSelection = false;
   dialog.showForm = true;
@@ -607,6 +645,11 @@ function handleViewImage(imageId: string) {
   dialog.snapshotImage = true;
 }
 
+function handleOpenAddPassKey(item: any) {
+  selectedVisitorId.value = item?._id;
+  dialog.addPassKey = true;
+}
+
 function handleOpenRemarks(item: any, type: 'checkIn' | 'checkOut') {
   selectedVisitorId.value = item?._id;
   remarksType.value = type;
@@ -635,16 +678,18 @@ async function handleSaveRemarks() {
   }
 }
 
-async function handleUpdatePassKeys(){
+async function handleUpdatePassKeys() {
   if (!selectedVisitorId.value) return;
   try {
     loading.updatingPassKeys = true;
     const payload: any = {};
     if (passReturnStatuses.value.length > 0) {
-      payload.visitorPass = passReturnStatuses.value;
+      const passReturnStatusesPayload = passReturnStatuses.value.map(p => ({ keyId: p.keyId, status: p.status, remarks: p.remarks }));
+      payload.visitorPass = passReturnStatusesPayload;
     }
     if (keyReturnStatuses.value.length > 0) {
-      payload.passKeys = keyReturnStatuses.value;
+      const keyReturnStatusesPayload = keyReturnStatuses.value.map(k => ({ keyId: k.keyId, status: k.status, remarks: k.remarks }));
+      payload.passKeys = keyReturnStatusesPayload;
     }
     await updateVisitor(selectedVisitorId.value, payload);
     showMessage("Pass/Key statuses updated successfully!", "info");
@@ -723,10 +768,14 @@ async function proceedCheckout() {
 
   try {
     loading.checkingOut = true;
+
+    const passReturnStatusesPayload = passReturnStatuses.value.map(p => ({ keyId: p.keyId, status: p.status, remarks: p.remarks }));
+    const keyReturnStatusesPayload = keyReturnStatuses.value.map(k => ({ keyId: k.keyId, status: k.status, remarks: k.remarks }));
+
     const res = await updateVisitor(userId as string, {
       checkOut: new Date().toISOString(),
-      ...(passReturnStatuses.value.length > 0 ? { visitorPass: passReturnStatuses.value } : {}),
-      ...(keyReturnStatuses.value.length > 0 ? { passKeys: keyReturnStatuses.value } : {}),
+      ...(passReturnStatuses.value.length > 0 ? { visitorPass: passReturnStatusesPayload } : {}),
+      ...(keyReturnStatuses.value.length > 0 ? { passKeys: keyReturnStatusesPayload } : {}),
     });
     if (res) {
       showMessage("Visitor successfully checked-out!", "info");
@@ -769,8 +818,13 @@ const updateRouteQuery = debounce(
 watch(
   [searchInput, dateFrom, dateTo, filterTypes, activeTab, displayNotCheckedOut],
   ([search, from, to, types, tab, checkedOut]) => {
+    const normalizedFrom = normalizeDateOnly(from);
+    const normalizedTo = normalizeDateOnly(to);
+    dateFrom.value = normalizedFrom;
+    dateTo.value = normalizedTo;
+
     // updateRouteQuery(search, from, to, types, status, checkedOut)
-    updateRouteQuery({ search, from, to, types, tab, checkedOut })
+    updateRouteQuery({ search, from: normalizedFrom, to: normalizedTo, types, tab, checkedOut })
     getVisitorRefresh();
   },
   { deep: true }
@@ -781,8 +835,8 @@ watch(
 onMounted(() => {
   activeTab.value = (route.query.tab as string) || "unregistered"
   searchInput.value = (route.query.search as string) || "";
-  dateFrom.value = (route.query.dateFrom as string) || "";
-  dateTo.value = (route.query.dateTo as string) || "";
+  dateFrom.value = normalizeDateOnly((route.query.dateFrom as string) || "");
+  dateTo.value = normalizeDateOnly((route.query.dateTo as string) || "");
   filterTypes.value = ((route.query.type as string)?.split(",") || []).filter(Boolean) as TVisitorType[];
   displayNotCheckedOut.value = (route.query.checkedOut as string) == 'true' || false
 })

package/composables/useFeedback.ts

@@ -100,7 +100,7 @@ export default function useFeedback() {
           status,
           provider,
           service,
-          ...(currentUser.value.type != "site" && {
+          ...(currentUser.value?.type != "site" && {
             userId,
           }),
         },

package/composables/useSiteSettings.ts

@@ -98,6 +98,19 @@ export default function () {
     });
   }
 
+  async function updateSiteInformation(
+    siteId: string,
+    payload: { bgImage: string; description: string; docs: { id: string; name: string }[] }
+  ) {
+    return await useNuxtApp().$api<Record<string, any>>(
+      `/api/sites/information/id/${siteId}`,
+      {
+        method: "PATCH",
+        body: payload,
+      }
+    );
+  }
+
   async function setSiteGuardPosts(siteId: string, value: number) {
     return await useNuxtApp().$api<Record<string, any>>(
       `/api/sites/guard-post/id/${siteId}`,
@@ -127,6 +140,33 @@ export default function () {
     );
   }
 
+  async function getOvernightParkingAvailabilityV2(
+    siteId: string,
+    userType = "site"
+  ) {
+    return await useNuxtApp().$api<Record<string, any>>(
+      `/api/overnight-parking-approval-settings2/v1`,
+      {
+        method: "PATCH",
+        body: JSON.stringify({ site: siteId, userType }),
+      }
+    );
+  }
+
+  async function createOrUpdateOvernightParkingAvailabilityV2(
+    siteId: string,
+    payload: Record<string, any>,
+    userType = "site"
+  ) {
+    return await useNuxtApp().$api<Record<string, any>>(
+      `/api/overnight-parking-approval-settings2/v1`,
+      {
+        method: "POST",
+        body: JSON.stringify({ site: siteId, userType, ...payload }),
+      }
+    );
+  }
+
   return {
     getSiteById,
     getSiteLevels,
@@ -138,7 +178,10 @@ export default function () {
     updateSiteCamera,
     deleteSiteCameraById,
     updateSitebyId,
+    updateSiteInformation,
     getOvernightParkingAvailability,
-    updateOvernightParkingAvailability
+    updateOvernightParkingAvailability,
+    getOvernightParkingAvailabilityV2,
+    createOrUpdateOvernightParkingAvailabilityV2,
   };
 }

package/package.json

@@ -2,7 +2,7 @@
   "name": "@7365admin1/layer-common",
   "license": "MIT",
   "type": "module",
-  "version": "1.11.18",
+  "version": "1.11.20",
   "author": "7365admin1",
   "main": "./nuxt.config.ts",
   "publishConfig": {