@7365admin1/layer-common 1.11.51 → 1.11.52

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @iservice365/layer-common
 
+## 1.11.52
+
+### Patch Changes
+
+- 11b93db: fix site org filters invitation module
+
 ## 1.11.51
 
 ### Patch Changes

package/components/Facility/BookingSetup.vue

@@ -483,6 +483,122 @@
           </v-list-item>
         </draggable>
       </section>
+
+      <v-col cols="12" class="mt-10">
+        <p class="header-style font-weight-bold mb-5 mt-md-0 ml-md-4">
+          Other Settings
+        </p>
+        <v-row align="center" class="border pa-md-4" no-gutters>
+          <v-col cols="9" class="d-flex align-center text-body-2">
+            <v-row no-gutters>
+              <v-col cols="12" class="header-style mt-5 mt-md-0">
+                Monthly Booking limit per unit
+              </v-col>
+              <v-col cols="12" class="text-body-2 text-medium-emphasis">
+                Sets the maximum number of bookings per unit
+              </v-col>
+            </v-row>
+          </v-col>
+          <v-col cols="3" class="d-flex align-center justify-end">
+            <v-switch
+              v-model="facility.isBookingUnitLimitEnabled"
+              class="d-flex align-center"
+              color="primary"
+              hide-details
+              @update:model-value="onToggleBookingUnitLimit"
+            />
+          </v-col>
+          <v-col cols="12" class="mt-4">
+            <v-number-input
+              v-model="facility.bookingUnitLimit"
+              :reverse="false"
+              controlVariant="default"
+              label="Monthly booking limit per unit"
+              :hideInput="false"
+              :inset="false"
+              :min="1"
+              :max="500"
+              hide-details
+              :disabled="!facility.isBookingUnitLimitEnabled"
+            />
+          </v-col>
+        </v-row>
+
+        <v-row align="center" class="border pa-md-4 mt-4" no-gutters>
+          <v-col cols="9" class="d-flex align-center text-body-2">
+            <v-row no-gutters>
+              <v-col cols="12" class="header-style mt-5 mt-md-0">
+                Maximum No. of Guest
+              </v-col>
+              <v-col cols="12" class="text-body-2 text-medium-emphasis">
+                The maximum number of guests refers to the highest allowable
+                capacity a venue can safely and comfortably accommodate for an
+                event.
+              </v-col>
+            </v-row>
+          </v-col>
+          <v-col cols="3" class="d-flex align-center justify-end">
+            <v-switch
+              v-model="facility.isMaxNumberGuestLimitEnabled"
+              class="d-flex align-center"
+              color="primary"
+              hide-details
+              @update:model-value="onToggleMaxNumberGuestLimit"
+            />
+          </v-col>
+          <v-col cols="12" class="mt-4">
+            <v-number-input
+              v-model="facility.maxNumberGuest"
+              :reverse="false"
+              controlVariant="default"
+              label="Maximum no. of guests"
+              :hideInput="false"
+              :inset="false"
+              :min="1"
+              :max="500"
+              hide-details
+              :disabled="!facility.isMaxNumberGuestLimitEnabled"
+            />
+          </v-col>
+        </v-row>
+
+        <v-row align="center" class="border pa-md-4 mt-4" no-gutters>
+          <v-col cols="9" class="d-flex align-center text-body-2">
+            <v-row no-gutters>
+              <v-col cols="12" class="header-style mt-5 mt-md-0">
+                Cancel allowed up to (Days prior)
+              </v-col>
+              <v-col cols="12" class="text-body-2 text-medium-emphasis">
+                Number of days before a scheduled booking that a user is allowed
+                to cancel.
+              </v-col>
+            </v-row>
+          </v-col>
+          <v-col cols="3" class="d-flex align-center justify-end">
+            <v-switch
+              v-model="facility.isCancelAllowedLimitEnabled"
+              class="d-flex align-center"
+              color="primary"
+              hide-details
+              @update:model-value="onToggleCancelAllowedLimit"
+            />
+          </v-col>
+          <v-col cols="12" class="mt-4">
+            <v-number-input
+              v-model="facility.daysAllowedCancel"
+              :reverse="false"
+              controlVariant="default"
+              label="Cancel allowed up to (Days prior)"
+              :hideInput="false"
+              :inset="false"
+              :min="1"
+              :max="500"
+              hide-details
+              :disabled="!facility.isCancelAllowedLimitEnabled"
+            />
+          </v-col>
+        </v-row>
+      </v-col>
     </v-col>
 
     <!-- remarks -->
@@ -896,6 +1012,36 @@ const confirmDelete = () => {
 const handlePolicy = (newContent: string) => {
   facility.value.bookingPolicy = newContent;
 };
+
+function onToggleBookingUnitLimit(val: any) {
+  if (val) {
+    isBookingUnitLimitEnabled.value = true;
+    facility.value.bookingUnitLimit = 1;
+  } else {
+    isBookingUnitLimitEnabled.value = false;
+    facility.value.bookingUnitLimit = null;
+  }
+}
+
+function onToggleMaxNumberGuestLimit(val: any) {
+  if (val) {
+    isMaxNumberGuestLimitEnabled.value = true;
+    facility.value.maxNumberGuest = 1;
+  } else {
+    isMaxNumberGuestLimitEnabled.value = false;
+    facility.value.maxNumberGuest = null;
+  }
+}
+
+function onToggleCancelAllowedLimit(val: any) {
+  if (val) {
+    isCancelAllowedLimitEnabled.value = true;
+    facility.value.daysAllowedCancel = 1;
+  } else {
+    isCancelAllowedLimitEnabled.value = false;
+    facility.value.daysAllowedCancel = null;
+  }
+}
 </script>
 
 <style scoped>

package/components/InvitationMain.vue

@@ -22,7 +22,7 @@
               fab
               icon
               density="comfortable"
-              @click="_getVerifications({ search: headerSearch, status })"
+              @click="getVerifications()"
             >
               <v-icon>mdi-refresh</v-icon>
             </v-btn>
@@ -210,8 +210,6 @@ const headers = [
   },
 ];
 
-const status = (useRoute().params.status as string) ?? "";
-
 const { getVerifications: _getVerifications, cancelUserInvitation } =
   useVerification();
 
@@ -248,6 +246,8 @@ const {
     search: headerSearch.value,
     type: "user-invite,member-invite",
     app: props.app,
+    orgId: props.org,
+    siteId: props.siteId,
   })
 );
 

package/components/OnlineFormConfigurationForm.vue

@@ -7,18 +7,85 @@
         </span>
       </v-row>
     </v-toolbar>
+    <v-col v-if="prop.mode !== 'edit'" cols="12" class="px-6 pt-4 pb-0">
+      <InputLabel title="Form Template" />
+      <v-list
+        density="compact"
+        lines="one"
+        max-height="160"
+        style="overflow-y: auto; border: 1px solid rgba(0,0,0,0.18); border-radius: 4px;"
+        class="pa-0"
+      >
+        <v-list-item
+          v-if="availableTemplateNames.length === 0"
+          disabled
+          title="All templates have already been created"
+          class="text-caption text-medium-emphasis"
+        />
+        <v-list-item
+          v-for="name in availableTemplateNames"
+          :key="name"
+          :title="name"
+          :active="selectedTemplate === name"
+          active-color="primary"
+          class="text-caption"
+          @click="selectedTemplate = name; applyTemplate(name)"
+        />
+      </v-list>
+    </v-col>
+    <v-divider v-if="prop.mode !== 'edit'" class="mt-3" />
+
     <v-card-text style="max-height: 100vh; overflow-y: auto" class="pa-0">
       <v-form v-model="validForm" :disabled="disable">
         <v-col cols="12" class="px-6">
           <InputLabel class="text-capitalize" title="Attachment" />
-          <v-select
-            v-model="onlineForm.attachment"
-            :items="attachments"
-            item-title="name"
-            item-value="attachment"
-            density="comfortable"
-            type="text"
-          />
+
+          <div v-if="onlineForm.attachment" class="d-flex align-center" style="gap:8px">
+            <v-card
+              variant="outlined"
+              border="thin"
+              class="px-3 flex-grow-1 text-caption"
+              height="40"
+              :href="getFileUrl(onlineForm.attachment)"
+              target="_blank"
+            >
+              <v-row no-gutters class="fill-height" align="center" style="gap:6px">
+                <v-icon size="15">mdi-file-document-outline</v-icon>
+                {{ attachmentFileName || 'View attachment' }}
+                <v-icon size="13" class="ml-auto">mdi-open-in-new</v-icon>
+              </v-row>
+            </v-card>
+            <v-btn icon variant="text" size="small" density="comfortable" :disabled="disable" @click="clearAttachment">
+              <v-icon size="17">mdi-close</v-icon>
+            </v-btn>
+          </div>
+
+          <div
+            v-else
+            class="upload-drop-zone"
+            :class="{ 'drag-over': isDragOver, 'is-uploading': isUploading }"
+            @dragover.prevent="isDragOver = true"
+            @dragleave.prevent="isDragOver = false"
+            @drop.prevent="handleDrop"
+            @click="fileInputRef?.click()"
+          >
+            <v-progress-circular v-if="isUploading" indeterminate size="24" width="2" color="primary" class="mb-1" />
+            <v-icon v-else size="26" :color="isDragOver ? 'primary' : undefined" class="mb-1 text-medium-emphasis">
+              mdi-cloud-upload-outline
+            </v-icon>
+            <span class="text-caption text-medium-emphasis">
+              {{ isUploading ? 'Uploading…' : 'Drop file here or click to browse' }}
+            </span>
+            <input
+              ref="fileInputRef"
+              type="file"
+              accept=".pdf,application/pdf,image/*"
+              style="display:none"
+              @change="handleFileInputChange"
+            />
+          </div>
+
+          <span v-if="attachmentError" class="text-caption text-error d-block mt-1">{{ attachmentError }}</span>
         </v-col>
 
         <v-col cols="12" class="px-6">
@@ -30,62 +97,74 @@
         </v-col>
 
         <template v-for="(inputLabel, inputLabelIndex) in onlineForm.inputs">
+          <v-row class="px-6 mb-0" align="center" no-gutters>
+            <v-col>
+              <span class="text-caption font-weight-medium text-medium-emphasis">
+                Field {{ inputLabelIndex + 1 }}
+              </span>
+            </v-col>
+            <v-col cols="auto">
+              <v-btn
+                icon
+                size="small"
+                variant="text"
+                color="error"
+                :disabled="onlineForm.inputs.length === 1"
+                @click="onlineForm.inputs.splice(inputLabelIndex, 1)"
+              >
+                <v-icon size="18">mdi-delete-outline</v-icon>
+              </v-btn>
+            </v-col>
+          </v-row>
           <v-row class="px-6">
             <v-col cols="6">
-              <InputLabel
-                class="text-capitalize"
-                :title="`Label ${+inputLabelIndex + 1}`"
-              />
+              <InputLabel title="Label" />
               <v-text-field
                 v-model.trim="inputLabel.label"
                 density="comfortable"
-              ></v-text-field>
+              />
             </v-col>
             <v-col cols="6">
-              <InputLabel
-                class="text-capitalize"
-                :title="`Data Type ${+inputLabelIndex + 1}`"
-              />
+              <InputLabel title="Data Type" />
               <v-select v-model="inputLabel.dataType" :items="dataTypes" />
             </v-col>
-            <v-col cols="6">
-              <InputLabel
-                class="text-capitalize"
-                :title="`Required ${+inputLabelIndex + 1}`"
+            <v-col v-if="inputLabel.dataType === 'Select'" cols="12">
+              <InputLabel title="Options" />
+              <v-combobox
+                v-model="inputLabel.options"
+                chips
+                closable-chips
+                multiple
+                density="comfortable"
+                variant="outlined"
+                placeholder="Type an option and press Enter"
+                hint="Press Enter after each option to add it"
+                persistent-hint
               />
-              <v-checkbox v-model="inputLabel.required" />
             </v-col>
             <v-col cols="6">
-              <InputLabel
-                class="text-capitalize"
-                :title="`Multiple ${+inputLabelIndex + 1}`"
-              />
-              <v-checkbox v-model="inputLabel.multiple" />
+              <InputLabel title="Required" />
+              <v-checkbox v-model="inputLabel.required" />
             </v-col>
             <v-col cols="6">
-              <v-btn
-                block
-                color="red"
-                variant="text"
-                class="text-none font-weight-bold"
-                text="Remove"
-                :disabled="onlineForm.inputs.length === 1"
-                @click="onlineForm.inputs.splice(inputLabelIndex, 1)"
-              />
+              <InputLabel title="Multiple" />
+              <v-checkbox v-model="inputLabel.multiple" />
             </v-col>
           </v-row>
           <v-divider class="my-3" />
         </template>
 
-        <v-col cols="12" class="px-6">
+        <v-col cols="12" class="px-6 pb-4">
           <v-btn
             block
+            variant="outlined"
             color="primary"
-            variant="text"
-            class="text-none font-weight-bold"
-            text="Add"
+            class="text-none"
+            prepend-icon="mdi-plus"
             @click="addNewInput"
-          ></v-btn>
+          >
+            Add Field
+          </v-btn>
         </v-col>
 
         <v-col cols="12">
@@ -123,12 +202,7 @@
             color="black"
             class="text-none"
             size="48"
-            :disabled="
-              !validForm ||
-              disable ||
-              onlineForm.attachment.length == 0 ||
-              onlineForm.name == ''
-            "
+            :disabled="!validForm || disable || onlineForm.name == ''"
             @click="submit"
             :loading="disable"
           >
@@ -140,6 +214,10 @@
   </v-card>
 </template>
 <script setup lang="ts">
+import useFile from "../composables/useFile";
+import useOnlineForm from "../composables/useOnlineForm";
+import useOnlineFormTemplates from "../composables/useOnlineFormTemplates";
+
 const prop = defineProps({
   mode: {
     type: String,
@@ -168,22 +246,40 @@ const emit = defineEmits(["cancel", "success"]);
 const validForm = ref(false);
 const disable = ref(false);
 const message = ref("");
+const selectedTemplate = ref<string | null>(null);
+
+const { formTemplates, templateNames } = useOnlineFormTemplates();
+
+function applyTemplate(name: string | null) {
+  if (!name) return;
+  const template = formTemplates[name];
+  if (!template) return;
+  onlineForm.value.name = name;
+  onlineForm.value.inputs = template.map((f) => ({ ...f }));
+}
 
 const route = useRoute();
 const siteId = route.params.site as string;
 const orgId = route.params.org as string;
 
-const attachments = ref<any>([
-  {
-    _id: "",
-    name: "",
-    attachment: "",
-    type: "",
-  },
-]);
+const { addFile, getFileUrl } = useFile();
+const { add: _add, updateOnlineFormById: _update, getAllBySiteId: _getAllBySiteId } = useOnlineForm();
 
-const { getDocumentsBySiteId: _getAllDocuments } = useDocument();
-const { add: _add, updateOnlineFormById: _update } = useOnlineForm();
+const { data: existingFormsData } = useLazyAsyncData(
+  `online-forms-template-filter-${siteId}`,
+  () => _getAllBySiteId(siteId, { limit: 100 })
+);
+
+const availableTemplateNames = computed(() => {
+  const existing = new Set(existingFormsData.value?.items?.map((f: any) => f.name) ?? []);
+  return templateNames.filter((name) => !existing.has(name));
+});
+
+const isDragOver = ref(false);
+const isUploading = ref(false);
+const attachmentError = ref("");
+const attachmentFileName = ref("");
+const fileInputRef = ref<HTMLInputElement | null>(null);
 
 const onlineForm = ref<Record<string, any>>({
   name: "",
@@ -207,37 +303,43 @@ const dataTypes = ref([
   "Checkbox",
 ]);
 
-const {
-  data: getDocumentReq,
-  refresh: getDocuments,
-  status: getAllReqStatus,
-} = useLazyAsyncData("get-all-documents", () =>
-  _getAllDocuments(siteId, "Online Form")
-);
-
-watchEffect(() => {
-  if (getDocumentReq.value) {
-    attachments.value = getDocumentReq.value;
-  }
-});
-
 if (prop.mode === "edit") {
   onlineForm.value.attachment = prop.onlineForm.attachment;
   onlineForm.value.name = prop.onlineForm.name;
   onlineForm.value.inputs = prop.onlineForm.inputs;
 }
 
-watch(
-  () => onlineForm.value.attachment,
-  (newVal) => {
-    if (newVal) {
-      const val = attachments.value.find(
-        (attachment: any) => attachment.attachment === newVal
-      );
-      onlineForm.value.name = val.name;
-    }
+function handleDrop(e: DragEvent) {
+  isDragOver.value = false;
+  const file = e.dataTransfer?.files[0];
+  if (file) uploadAttachment(file);
+}
+
+function handleFileInputChange(e: Event) {
+  const file = (e.target as HTMLInputElement).files?.[0];
+  if (file) uploadAttachment(file);
+}
+
+async function uploadAttachment(file: File) {
+  isUploading.value = true;
+  attachmentError.value = "";
+  try {
+    const res = await addFile(file);
+    onlineForm.value.attachment = res.id;
+    attachmentFileName.value = file.name;
+  } catch (e: any) {
+    attachmentError.value = e?.message || "Upload failed. Please try again.";
+  } finally {
+    isUploading.value = false;
   }
-);
+}
+
+function clearAttachment() {
+  onlineForm.value.attachment = "";
+  attachmentFileName.value = "";
+  attachmentError.value = "";
+  if (fileInputRef.value) fileInputRef.value.value = "";
+}
 
 function cancel() {
   emit("cancel");
@@ -249,6 +351,7 @@ function addNewInput() {
     dataType: "",
     required: true,
     multiple: false,
+    options: [],
   });
 }
 
@@ -288,3 +391,28 @@ async function submit() {
   }
 }
 </script>
+
+<style scoped>
+.upload-drop-zone {
+  border: 2px dashed rgba(0, 0, 0, 0.2);
+  border-radius: 8px;
+  padding: 18px 12px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  min-height: 80px;
+  transition: border-color 0.2s, background-color 0.2s;
+  user-select: none;
+}
+.upload-drop-zone:hover,
+.upload-drop-zone.drag-over {
+  border-color: rgb(var(--v-theme-primary));
+  background-color: rgba(var(--v-theme-primary), 0.04);
+}
+.upload-drop-zone.is-uploading {
+  pointer-events: none;
+  opacity: 0.65;
+}
+</style>

package/components/OnlineFormRenderPreview.vue

@@ -0,0 +1,107 @@
+<template>
+  <v-dialog
+    :model-value="modelValue"
+    @update:model-value="$emit('update:modelValue', $event)"
+    width="560"
+    persistent
+  >
+    <v-card max-height="85vh" class="d-flex flex-column">
+      <v-toolbar color="grey-darken-3" class="flex-grow-0">
+        <v-toolbar-title class="text-subtitle-1 font-weight-bold text-white text-uppercase">
+          {{ form?.name }}
+        </v-toolbar-title>
+      </v-toolbar>
+
+      <v-card-subtitle class="px-6 pt-3 pb-0 text-caption text-medium-emphasis flex-grow-0">
+        Form preview — fields are read-only
+      </v-card-subtitle>
+
+      <v-card-text class="px-6 py-4 flex-grow-1" style="overflow-y: auto">
+        <template v-for="(input, index) in form?.inputs" :key="index">
+          <v-text-field
+            v-if="input.dataType === 'Text Input'"
+            :label="input.label"
+            density="comfortable"
+            variant="outlined"
+            class="mb-1"
+            :hint="input.required ? 'Required' : ''"
+            persistent-hint
+            readonly
+          />
+          <v-textarea
+            v-else-if="input.dataType === 'Text Area'"
+            :label="input.label"
+            density="comfortable"
+            variant="outlined"
+            rows="3"
+            class="mb-1"
+            :hint="input.required ? 'Required' : ''"
+            persistent-hint
+            readonly
+          />
+          <v-text-field
+            v-else-if="input.dataType === 'Date Input'"
+            :label="input.label"
+            type="date"
+            density="comfortable"
+            variant="outlined"
+            class="mb-1"
+            :hint="input.required ? 'Required' : ''"
+            persistent-hint
+            readonly
+          />
+          <v-select
+            v-else-if="input.dataType === 'Select'"
+            :label="input.label"
+            :items="input.options || []"
+            density="comfortable"
+            variant="outlined"
+            class="mb-1"
+            :hint="input.required ? 'Required' : ''"
+            persistent-hint
+            readonly
+          />
+          <v-checkbox
+            v-else-if="input.dataType === 'Checkbox'"
+            :label="input.label"
+            density="comfortable"
+            class="mb-1"
+            readonly
+          />
+        </template>
+      </v-card-text>
+
+      <v-toolbar density="compact" class="flex-grow-0">
+        <v-row no-gutters>
+          <v-col cols="12">
+            <v-btn
+              tile
+              block
+              variant="flat"
+              color="black"
+              class="text-none"
+              height="48"
+              @click="$emit('update:modelValue', false)"
+            >
+              Close Preview
+            </v-btn>
+          </v-col>
+        </v-row>
+      </v-toolbar>
+    </v-card>
+  </v-dialog>
+</template>
+<script setup lang="ts">
+defineProps({
+  modelValue: {
+    type: Boolean,
+    default: false,
+  },
+  form: {
+    type: Object as PropType<TOnlineForm | null>,
+    default: null,
+  },
+});
+
+defineEmits(["update:modelValue"]);
+</script>