@iservice365/layer-common 1.1.0 → 1.3.0

package/components/WorkOrder/Create.vue

@@ -16,22 +16,27 @@
       @errored="onImageError"
     />
 
-    <v-text-field
+    <v-autocomplete
+      v-model="workOrder.subject"
+      :items="subjects"
+      item-title="title"
+      item-value="value"
+      item-props
       label="Subject"
       variant="outlined"
       density="compact"
-      v-model="localWorkOrder.subject"
-      class="mb-1"
-      dense
+      class="mb-2"
+      clearable
       :readonly="
-        props.createdFrom === 'feedback' && localWorkOrder.subject !== ''
+        props.createdFrom === 'feedback' && workOrder.subject !== ''
           ? true
           : false
       "
+      :custom-filter="customFilter"
     />
 
     <v-autocomplete
-      v-model="localWorkOrder.category"
+      v-model="workOrder.category"
       :items="categories"
       item-title="title"
       item-value="value"
@@ -41,22 +46,18 @@
       density="compact"
       class="mb-2"
       :clearable="
-        props.createdFrom === 'feedback' && localWorkOrder.category !== ''
+        props.createdFrom === 'feedback' && workOrder.category !== ''
           ? false
           : true
       "
       :readonly="
-        props.createdFrom === 'feedback' && localWorkOrder.category !== ''
+        props.createdFrom === 'feedback' && workOrder.category !== ''
           ? true
           : false
       "
     />
 
-    <v-checkbox
-      v-model="localWorkOrder.highPriority"
-      density="compact"
-      class="ma-0"
-    >
+    <v-checkbox v-model="workOrder.highPriority" density="compact" class="ma-0">
       <template #label>
         <span class="text-caption">
           Set work order as High Priority (Optional)
@@ -64,55 +65,55 @@
       </template>
     </v-checkbox>
 
-    <v-autocomplete
+    <!-- <v-autocomplete
       label="Block"
       variant="outlined"
       density="compact"
-      v-model="localWorkOrder.block"
+      v-model="workOrder.block"
       :items="blocks"
       class="mt-1"
       clearable
-    />
+    /> -->
 
-    <v-autocomplete
+    <!-- <v-autocomplete
       label="Level"
       variant="outlined"
       density="compact"
-      v-model="localWorkOrder.level"
+      v-model="workOrder.level"
       :items="levels"
       class="mt-1"
       clearable
-    />
+    /> -->
 
     <v-autocomplete
       label="Unit"
       variant="outlined"
       density="compact"
-      v-model="localWorkOrder.unit"
+      v-model="workOrder.unit"
       :items="units"
       class="mt-1"
       clearable
     />
 
-    <v-text-field
+    <!-- <v-text-field
       label="Specific Location"
       variant="outlined"
       density="compact"
-      v-model="localWorkOrder.location"
+      v-model="workOrder.location"
       class="mt-1"
       dense
       :readonly="
-        props.createdFrom === 'feedback' && localWorkOrder.location !== ''
+        props.createdFrom === 'feedback' && workOrder.location !== ''
           ? true
           : false
       "
-    />
+    /> -->
 
     <v-textarea
       label="Work Order Description"
       variant="outlined"
       density="compact"
-      v-model="localWorkOrder.description"
+      v-model="workOrder.description"
       class="mt-1"
       rows="4"
       clearable
@@ -135,10 +136,11 @@
 </template>
 
 <script setup lang="ts">
+import useBuildingUnit from "../../composables/useBuildingUnit";
+
 const props = defineProps<{
   modelValue: boolean;
   createdFrom: string;
-  workOrder: TWorkOrderCreate & { specificLocation?: string };
   isEditMode: boolean;
   loading: boolean;
   categories: { title: string; value: string }[];
@@ -150,25 +152,32 @@ const props = defineProps<{
   specificLocations?: string[];
 }>();
 
-const emit = defineEmits<{
-  (e: "update:modelValue", value: boolean): void;
-  (e: "update:workOrder", value: TWorkOrderCreate): void;
-  (e: "close"): void;
-  (e: "submit", payload: TWorkOrderCreate): void;
-  (e: "fileAdded", file: File): void;
-  (e: "fileDeleted", url: string): void;
-}>();
+const workOrder = defineModel("workOrder", {
+  default: {
+    subject: "",
+    category: "",
+    highPriority: false,
+    unit: "",
+    location: "",
+    description: "",
+    attachments: [],
+  },
+});
+
+const emit = defineEmits([
+  "update:modelValue",
+  "update:workOrder",
+  "close",
+  "submit",
+  "fileAdded",
+  "fileDeleted",
+]);
 
 const dialog = computed({
   get: () => props.modelValue,
   set: (val) => emit("update:modelValue", val),
 });
 
-const localWorkOrder = computed({
-  get: () => props.workOrder,
-  set: (val) => emit("update:workOrder", val),
-});
-
 const localErroredImages = ref<string[]>(props.erroredImages || []);
 
 watch(
@@ -179,7 +188,7 @@ watch(
 );
 
 const displayedAttachments = computed(() => {
-  return localWorkOrder.value.attachments || [];
+  return workOrder.value.attachments || [];
 });
 
 function handleFileAdded(file: File) {
@@ -202,17 +211,46 @@ function closeDialog() {
 }
 
 function submitWorkOrder() {
-  emit("submit", { ...localWorkOrder.value });
+  emit("submit", { ...workOrder.value });
 }
 
-// expose location fields as fallback empty arrays if not passed
-// const blocks = computed(() => props.blocks || []);
-// const levels = computed(() => props.levels || []);
-// const units = computed(() => props.units || []);
+const units = ref<Array<{ title: string; value: string }>>([]);
+
+const { getAll } = useBuildingUnit();
+const { data } = await useLazyAsyncData("get-building-units-by-status", () =>
+  getAll({ status: "active" })
+);
+
+watchEffect(() => {
+  if (data.value && data.value.items && data.value.items.length > 0) {
+    units.value = data.value.items.map((item: any) => {
+      return {
+        title: `${item.name} - ${item.level} - ${item.buildingName}`,
+        value: item._id,
+      };
+    });
+  }
+});
+
+const workOrderUnit = computed(() => {
+  return workOrder.value.unit;
+});
+
+watch(workOrderUnit, (val: string) => {
+  if (val) {
+    const unit = units.value.find((unit: any) => unit.value === val);
+    if (unit) {
+      workOrder.value.location = unit.title;
+    }
+  }
+});
 
-const blocks = computed(() => ["Block A", "Block B", ...(props.blocks || [])]);
-const levels = computed(() => ["Level 1", "Level 2", ...(props.levels || [])]);
-const units = computed(() => ["Unit 101", "Unit 102", ...(props.units || [])]);
+const { subjects } = useLocal();
 
-const specificLocations = computed(() => props.specificLocations || []);
+const customFilter = (value: string, query: string, item: any) => {
+  const title = item?.raw?.title?.toLowerCase() || "";
+  const subtitle = item?.raw?.subtitle?.toLowerCase() || "";
+  const search = query.toLowerCase();
+  return title.includes(search) || subtitle.includes(search);
+};
 </script>

package/components/WorkOrder/Main.vue

@@ -28,7 +28,7 @@
             @click="showCreateDialog = true"
             class="text-capitalize"
           >
-            Work Order
+            Create Work Order
           </v-btn>
         </template>
 
@@ -76,7 +76,7 @@
 
   <WorkOrderCreate
     v-model="showCreateDialog"
-    :created-from="'workOrder'"
+    created-from="workOrder"
     :work-order="_workOrder"
     @update:work-order="(val: TWorkOrderCreate) => (_workOrder = val)"
     :is-edit-mode="isEditMode"
@@ -97,6 +97,7 @@
 
 <script setup lang="ts">
 import { useTheme } from "vuetify";
+import useBuilding from "../../composables/useBuilding";
 const emit = defineEmits(["click:create", "update:pagination"]);
 
 const props = defineProps({
@@ -132,6 +133,10 @@ const props = defineProps({
     type: Boolean,
     default: false,
   },
+  category: {
+    type: String,
+    default: "",
+  },
 });
 
 const theme = useTheme().name;
@@ -192,11 +197,11 @@ const {
   data: getAllWorkOrderReq,
   refresh: getAllReqRefresh,
   status: getAllReqStatus,
-} = useLazyAsyncData("get-all-work-orders", () =>
+} = useLazyAsyncData("get-all-work-orders-" + props.category, () =>
   _getWorkOrders({
     page: page.value,
-    organization: route.params.org as string,
     site: route.params.site as string,
+    category: props.category,
   })
 );
 
@@ -272,20 +277,20 @@ function handleCloseDialog() {
 const serviceProviders = ref<
   Array<{ title: string; value: string; subtitle: string }>
 >([]);
-const { getAll: getAllServiceProvider } = useServiceProvider();
 
-const { data: getAllReq } = useLazyAsyncData("get-all-service-providers", () =>
-  getAllServiceProvider({
-    siteId: useRoute().params.site as string,
-  })
+const { getBySiteAsServiceProvider } = useCustomerSite();
+
+const { data: getAllReq } = useLazyAsyncData(
+  "get-by-site-as-service-provider",
+  () => getBySiteAsServiceProvider(useRoute().params.site as string)
 );
 
 watchEffect(() => {
   if (getAllReq.value) {
-    serviceProviders.value = getAllReq.value.items.map((i: any) => ({
+    serviceProviders.value = getAllReq.value.map((i: any) => ({
       title: i.nature.replace(/_/g, " "),
-      value: i.serviceProviderOrgId,
-      subtitle: i.name,
+      subtitle: i.title,
+      value: i.nature
     }));
   }
 });

package/composables/useBuilding.ts

@@ -0,0 +1,250 @@
+export default function useBuilding() {
+  const categories = ref([
+    {
+      title: "Academic Spaces",
+      value: "academic-spaces",
+    },
+    {
+      title: "Support Facilities",
+      value: "support-facilities",
+    },
+    {
+      title: "Activity & Recreation Areas",
+      value: "activity-recreation-areas",
+    },
+    {
+      title: "Utility & Sanitary",
+      value: "utility-sanitary",
+    },
+    {
+      title: "Dormitories & Lodging",
+      value: "dormitories-lodging",
+    },
+  ]);
+
+  const types = ref([
+    {
+      title: "Classroom",
+      value: "classroom",
+      category: "academic-spaces",
+      subtitle: "Standard teaching room",
+    },
+    {
+      title: "Laboratory",
+      value: "laboratory",
+      category: "academic-spaces",
+      subtitle: "Science, computer, or language labs",
+    },
+    {
+      title: "Library",
+      value: "library",
+      category: "academic-spaces",
+      subtitle: "Reading and study area",
+    },
+    {
+      title: "Faculty Room",
+      value: "faculty_room",
+      category: "academic-spaces",
+      subtitle: "Shared working space for teachers",
+    },
+    {
+      title: "Lecture Hall",
+      value: "lecture_hall",
+      category: "academic-spaces",
+      subtitle: "Large room for lectures",
+    },
+    {
+      title: "Tutorial Room",
+      value: "tutorial_room",
+      category: "academic-spaces",
+      subtitle: "Small group learning or mentoring",
+    },
+    {
+      title: "Exam Room",
+      value: "exam_room",
+      category: "academic-spaces",
+      subtitle: "Designated exam space",
+    },
+    {
+      title: "Office",
+      value: "office",
+      category: "support-facilities",
+      subtitle: "Admin, registrar, finance, principal's office",
+    },
+    {
+      title: "Clinic",
+      value: "clinic",
+      category: "support-facilities",
+      subtitle: "School nurse or medical emergency room",
+    },
+    {
+      title: "Storage",
+      value: "storage",
+      category: "support-facilities",
+      subtitle: "For site supplies, janitorial, or equipment",
+    },
+    {
+      title: "Server Room",
+      value: "server_room",
+      category: "support-facilities",
+      subtitle: "For IT infrastructure",
+    },
+    {
+      title: "Equipment Room",
+      value: "equipment_room",
+      category: "support-facilities",
+      subtitle: "PE or technical equipment",
+    },
+    {
+      title: "Gymnasium",
+      value: "gymnasium",
+      category: "activity-recreation-areas",
+      subtitle: "Indoor sports",
+    },
+    {
+      title: "Sports Area",
+      value: "sports_area",
+      category: "activity-recreation-areas",
+      subtitle: "Outdoor field or court",
+    },
+    {
+      title: "Music Room",
+      value: "music_room",
+      category: "activity-recreation-areas",
+      subtitle: "For music classes or practice",
+    },
+    {
+      title: "Art Room",
+      value: "art_room",
+      category: "activity-recreation-areas",
+      subtitle: "Visual arts room",
+    },
+    {
+      title: "Theater",
+      value: "theater",
+      category: "activity-recreation-areas",
+      subtitle: "Stage and performance space",
+    },
+    {
+      title: "Canteen",
+      value: "canteen",
+      category: "activity-recreation-areas",
+      subtitle: "Food service area",
+    },
+    {
+      title: "Toilet",
+      value: "toilet",
+      category: "utility-sanitary",
+      subtitle: "Restroom facilities",
+    },
+    {
+      title: "Shower Room",
+      value: "shower_room",
+      category: "utility-sanitary",
+      subtitle: "Common in dorms or gyms",
+    },
+    {
+      title: "Janitor Room",
+      value: "janitor_room",
+      category: "utility-sanitary",
+      subtitle: "Cleaning supplies, mop sinks",
+    },
+    {
+      title: "Mechanical Room",
+      value: "mechanical_room",
+      category: "utility-sanitary",
+      subtitle: "Electrical, HVAC, plumbing systems",
+    },
+    {
+      title: "Dorm Room",
+      value: "dorm_room",
+      category: "dormitories-lodging",
+      subtitle: "Sleeping quarters",
+    },
+    {
+      title: "Common Room",
+      value: "common_room",
+      category: "dormitories-lodging",
+      subtitle: "Lounge or social area",
+    },
+    {
+      title: "Laundry",
+      value: "laundry",
+      category: "dormitories-lodging",
+      subtitle: "Washing facilities",
+    },
+  ]);
+
+  function getAll({
+    page = 1,
+    search = "",
+    limit = 20,
+    status = "active",
+    site = "",
+  } = {}) {
+    return useNuxtApp().$api<Record<string, any>>("/api/buildings", {
+      method: "GET",
+      query: {
+        page,
+        search,
+        limit,
+        status,
+        site,
+      },
+    });
+  }
+
+  function getById(id = "") {
+    return useNuxtApp().$api<Record<string, any>>(`/api/buildings/id/${id}`, {
+      method: "GET",
+    });
+  }
+
+  function getByName(name = "") {
+    return useNuxtApp().$api(`/api/buildings/name/${name}`, {
+      method: "GET",
+    });
+  }
+
+  function createBuilding(data: TBuilding) {
+    return useNuxtApp().$api("/api/buildings", {
+      method: "POST",
+      body: data,
+    });
+  }
+
+  function updateBuildingField(id: string, field: string, value: string) {
+    return useNuxtApp().$api(`/api/buildings/${id}`, {
+      method: "PATCH",
+      body: { field, value },
+    });
+  }
+
+  function updateById(
+    id: string,
+    data: Pick<TBuilding, "name" | "block" | "levels">
+  ) {
+    return useNuxtApp().$api(`/api/buildings/id/${id}`, {
+      method: "PATCH",
+      body: data,
+    });
+  }
+
+  function deleteById(id: string) {
+    return useNuxtApp().$api(`/api/buildings/id/${id}`, {
+      method: "DELETE",
+    });
+  }
+
+  return {
+    categories,
+    types,
+    getAll,
+    getById,
+    getByName,
+    createBuilding,
+    updateBuildingField,
+    deleteById,
+    updateById,
+  };
+}

package/composables/useBuildingUnit.ts

@@ -0,0 +1,116 @@
+export default function useBuildingUnit() {
+  const categories = ref([
+    {
+      title: "Management",
+      value: "management",
+    },
+    {
+      title: "Residential",
+      value: "residential",
+    },
+    {
+      title: "Commercial",
+      value: "commercial",
+    },
+    {
+      title: "Amenities",
+      value: "amenities",
+    },
+  ]);
+
+  function getAll({
+    page = 1,
+    search = "",
+    limit = 20,
+    status = "active",
+    site = "",
+  } = {}) {
+    return useNuxtApp().$api<Record<string, any>>("/api/building-units", {
+      method: "GET",
+      query: {
+        page,
+        search,
+        limit,
+        status,
+        site,
+      },
+    });
+  }
+
+  function getAllUnits({
+    page = 1,
+    search = "",
+    limit = 20,
+    status = "active",
+    site = "",
+    building = "",
+  } = {}) {
+    return useNuxtApp().$api<Record<string, any>>("/api/building-units", {
+      method: "GET",
+      query: {
+        page,
+        search,
+        limit,
+        status,
+        site,
+        building,
+      },
+    });
+  }
+
+  function getById(id = "") {
+    return useNuxtApp().$api<Record<string, any>>(
+      `/api/building-units/id/${id}`,
+      {
+        method: "GET",
+      }
+    );
+  }
+
+  function getByName(name = "") {
+    return useNuxtApp().$api(`/api/building-units/name/${name}`, {
+      method: "GET",
+    });
+  }
+
+  function add(data: { labels: string[]; unit: TBuildingUnit; qty?: number }) {
+    return useNuxtApp().$api("/api/building-units", {
+      method: "POST",
+      body: data,
+    });
+  }
+
+  type TUpdateOption = Pick<TBuildingUnit, "name" | "category" | "level">;
+
+  function updateById(id: string, value: TUpdateOption) {
+    return useNuxtApp().$api(`/api/building-units/id/${id}`, {
+      method: "PATCH",
+      body: value,
+    });
+  }
+
+  function deleteById(id: string) {
+    return useNuxtApp().$api(`/api/building-units/id/${id}`, {
+      method: "DELETE",
+    });
+  }
+
+  const region = ref({
+    _id: "",
+    name: "",
+    director: "",
+    directorName: "",
+  });
+
+  return {
+    categories,
+    region,
+    getAll,
+    getById,
+    getByName,
+    add,
+    updateById,
+    deleteById,
+    getAllUnits,
+  };
+}