@iservice365/layer-common 1.4.2 → 1.5.0

package/components/FacilityForm.vue

@@ -1,226 +0,0 @@
-<template>
-  <v-card width="100%" :loading="processing">
-    <v-toolbar>
-      <v-row no-gutters class="fill-height px-6" align="center">
-        <span class="font-weight-bold text-h5 text-capitalize">
-          {{ prop.mode }} Facility
-        </span>
-      </v-row>
-    </v-toolbar>
-    <v-card-text style="max-height: 100vh; overflow-y: auto" class="pa-5 my-3">
-      <v-form ref="formRef" v-model="validForm" :disabled="processing" @click="errorMessage = ''">
-        <v-row no-gutters class="pt-4">
-
-          <v-col cols="12">
-            <v-expansion-panels v-model="panels">
-              <template v-for="section in sections" :key="section.value">
-                <v-expansion-panel :value="section.value" :color="panels.includes(section.value) ? 'primary-button' : 'grey-lighten-3'" elevation="3" >
-                  <v-expansion-panel-title>
-                    <span class="font-weight-bold">{{ section.label }}</span>
-                  </v-expansion-panel-title>
-                  <v-expansion-panel-text>
-                    <component :is="section.component" class="" />
-                    <!-- v-model="form[section.value]" -->
-                  </v-expansion-panel-text>
-                </v-expansion-panel>
-              </template>
-            </v-expansion-panels>
-          </v-col>
-
-          <v-col v-if="prop.mode === 'add'" cols="12" class="mt-2">
-            <v-checkbox v-model="createMore" density="comfortable" hide-details>
-              <template #label>
-                <span class="text-subtitle-2 font-weight-bold">
-                  Create more
-                </span>
-              </template>
-            </v-checkbox>
-          </v-col>
-
-        </v-row>
-      </v-form>
-    </v-card-text>
-
-    <v-row no-gutters class="w-100" v-if="errorMessage">
-      <p class="text-error w-100 text-center text-subtitle-2">{{ errorMessage }}</p>
-    </v-row>
-    <v-toolbar density="compact">
-      <v-row no-gutters>
-        <v-col cols="6">
-          <v-btn tile block variant="text" class="text-none" size="48" @click="close" text="Close" />
-        </v-col>
-        <v-col cols="6">
-          <v-btn tile block variant="flat" color="primary-button" class="text-none" size="48" :disabled="processing || !validForm" text="Submit" />
-        </v-col>
-      </v-row>
-    </v-toolbar>
-  </v-card>
-</template>
-
-<script setup lang="ts">
-import FacilityFormInformation from './FacilityFormInformation.vue';
-import FacilityFormAvailability from './FacilityFormAvailability.vue';
-import FacilityFormDescription from './FacilityFormDescription.vue';
-import FacilityFormRefund from './FacilityFormRefund.vue';
-import FacilityFormBookingFee from './FacilityFormBookingFee.vue';
-import FacilityFormDepositFee from './FacilityFormDepositFee.vue';
-import FacilityFormBookingPolicy from './FacilityFormBookingPolicy.vue';
-import FacilityFormSecurityChecklist from './FacilityFormSecurityChecklist.vue';
-import FacilityFormRulesAndPolicies from './FacilityFormRulesAndPolicies.vue';
-
-
-
-const prop = defineProps({
-  site: {
-    type: String,
-    required: true
-  },
-  mode: {
-    type: String as PropType<'add' | 'edit'>,
-    default: 'add'
-  },
-  activeId: {
-    type: String as PropType<string | null>, // id of person you are trying to update
-    default: null
-  },
-  people: {
-    type: Object as PropType<TPeople>,
-    required: false
-  }
-});
-
-const { requiredRule, formatDateISO8601 } = useUtils();
-const { getSiteById, getSiteLevels, getSiteUnits } = useSiteSettings();
-const { create, updateById } = usePeople();
-
-const emit = defineEmits(['back', 'select', 'done', 'done:more', 'error', 'close']);
-const panels = ref<string[]>(['facilityInformation'])
-
-const sections = [
-  { label: "Facility Information", value: "facilityInformation", component: FacilityFormInformation },
-  { label: "Facility Availability", value: "facilityAvailability", component: FacilityFormAvailability },
-  { label: "Facility Description", value: "facilityDescription", component: FacilityFormDescription },
-  { label: "Refund", value: "refund", component: FacilityFormRefund },
-  { label: "Booking Fee", value: "bookingFee", component: FacilityFormBookingFee },
-  { label: "Deposit Fee", value: "depositFee", component: FacilityFormDepositFee },
-  { label: "Booking Policy", value: "bookingPolicy", component: FacilityFormBookingPolicy },
-  { label: "Security Checklist", value: "securityChecklist", component: FacilityFormSecurityChecklist },
-  { label: "Facility Rules and Policies", value: "facilityRulesAndPolicies", component: FacilityFormRulesAndPolicies },
-];
-
-const form = reactive<Partial<TPeoplePayload>>({})
-
-
-const validForm = ref(false);
-const formRef = ref<HTMLFormElement | null>(null);
-const processing = ref(false);
-const message = ref('');
-const errorMessage = ref('');
-const createMore = ref(false)
-
-
-const step = ref(1)
-
-
-
-function dateToday() {
-  const today = new Date()
-  return today.toISOString()
-}
-
-
-
-function close(){
-  emit('close')
-}
-
-
-function resetForm() {
-  formRef.value?.resetValidation();
-  Object.assign(form, {
-  });
-
-  validForm.value = false;
-}
-
-
-
-async function submit() {
-  formRef.value!.validate()
-  errorMessage.value = '';
-  processing.value = true;
-
-  let payload: Partial<TPeoplePayload> = {}
-
-  if (prop.mode === 'add') {
-    payload = {
-      ...payload,
-      site: prop.site,
-      ...form,
-    }
-
-  } else if (prop.mode === 'edit') {
-    const { type, ...rest } = form
-    payload = {
-      ...payload,
-      ...rest
-    }
-
-  }
-  try {
-    if (prop.mode === 'add') {
-      await create(payload)
-    } else if (prop.mode === 'edit') {
-      const userId = prop.activeId
-      if (!userId) {
-        throw new Error('User Id prop is not defined')
-      }
-
-      await updateById(userId, payload)
-    }
-
-    if (createMore.value) {
-      resetForm()
-      step.value = 1;
-      errorMessage.value = ""
-      emit("done:more")
-      createMore.value = false
-    } else emit("done")
-
-  } catch (error: any) {
-    const err = error?.data?.message
-    errorMessage.value = err || `Failed to ${prop.mode === 'add' ? 'add' : 'update'}. Please try again.`;
-  } finally {
-    processing.value = false;
-  }
-}
-
-
-async function mountExistingData() {
-  setTimeout(() => {
-    const people = prop.people
-    if (!people) return
-
-    (Object.keys(form) as (keyof typeof form)[]).forEach((key) => {
-      if (key in people) {
-        form[key] = people[key as keyof TPeople]
-      }
-    })
-  }, 100)
-}
-
-onMounted(() => {
-  createMore.value = false;
-  if (prop.mode === 'edit') {
-    mountExistingData()
-  } else {
-    form.start = dateToday()
-  }
-})
-
-</script>
-<style scoped>
-.button-outline-class {
-  border: 1px solid rgba(var(--v-theme-primary));
-}
-</style>

package/components/FacilityFormAvailability.vue

@@ -1,13 +0,0 @@
-<template>
-    <div>
-        Im a Form
-    </div>
-</template>
-
-<script setup lang="ts">
-
-</script>
-
-<style scoped>
-
-</style>

package/components/FacilityFormBookingFee.vue

@@ -1,13 +0,0 @@
-<template>
-    <div>
-        Im a Form
-    </div>
-</template>
-
-<script setup lang="ts">
-
-</script>
-
-<style scoped>
-
-</style>

package/components/FacilityFormBookingPolicy.vue

@@ -1,13 +0,0 @@
-<template>
-    <div>
-        Im a Form
-    </div>
-</template>
-
-<script setup lang="ts">
-
-</script>
-
-<style scoped>
-
-</style>

package/components/FacilityFormDepositFee.vue

@@ -1,13 +0,0 @@
-<template>
-    <div>
-        Im a Form
-    </div>
-</template>
-
-<script setup lang="ts">
-
-</script>
-
-<style scoped>
-
-</style>

package/components/FacilityFormDescription.vue

@@ -1,13 +0,0 @@
-<template>
-    <div>
-        Im a Form
-    </div>
-</template>
-
-<script setup lang="ts">
-
-</script>
-
-<style scoped>
-
-</style>

package/components/FacilityFormInformation.vue

@@ -1,40 +0,0 @@
-<template>
-    <v-row no-gutters>
-        <v-col cols="12">
-            <InputLabel class="text-capitalize" title="Facility Name" required />
-            <v-text-field v-model.trim="form.name" density="compact" :rules="[requiredRule]" />
-        </v-col>
-
-        <v-col cols="12">
-            <InputLabel class="text-capitalize" title="Select Icon" required />
-            <v-select v-model="form.icon" :items="iconsArray" density="comfortable"
-                 @update:model-value="handleChangeLevel" :rules="[requiredRule]" />
-        </v-col>
-
-        <v-col cols="12">
-            <InputLabel class="text-capitalize" title="Attach Image" />
-            <InputFileV2 v-model="form.gallery" multiple :max-length="3" />
-        </v-col>
-    </v-row>
-</template>
-
-<script setup lang="ts">
-const { requiredRule } = useUtils()
-
-const form = defineModel({
-    default: {
-        name: "",
-        icon: "",
-        gallery: [] as string[]
-    }
-})
-
-const iconsArray = ref([])
-
-function handleChangeLevel(){
-    
-}
-
-</script>
-
-<style scoped></style>

package/components/FacilityFormRefund.vue

@@ -1,13 +0,0 @@
-<template>
-    <div>
-        Im a Form
-    </div>
-</template>
-
-<script setup lang="ts">
-
-</script>
-
-<style scoped>
-
-</style>

package/components/FacilityFormRulesAndPolicies.vue

@@ -1,13 +0,0 @@
-<template>
-    <div>
-        Im a Form
-    </div>
-</template>
-
-<script setup lang="ts">
-
-</script>
-
-<style scoped>
-
-</style>

package/components/FacilityFormSecurityChecklist.vue

@@ -1,13 +0,0 @@
-<template>
-    <div>
-        Im a Form
-    </div>
-</template>
-
-<script setup lang="ts">
-
-</script>
-
-<style scoped>
-
-</style>