@eeplatform/nuxt-layer-common 1.0.0

package/components/SwitchOrg.vue

@@ -0,0 +1,159 @@
+<template>
+  <v-row no-gutters class="mb-4 pl-4 fill-height" align="center">
+    <v-avatar color="surface-variant" size="28">
+      <v-img
+        v-if="currentUser?.profile"
+        :src="profile"
+        width="200"
+        height="200"
+      />
+      <span v-else class="text-subtitle-1">{{
+        getNameInitials(selectedOrg?.text)
+      }}</span>
+    </v-avatar>
+
+    <v-menu
+      v-model="menu"
+      location="bottom"
+      offset="5px"
+      :close-on-content-click="false"
+    >
+      <template #activator="{ props }">
+        <v-btn
+          variant="text"
+          class="text-none ml-2"
+          size="large"
+          v-bind="props"
+        >
+          <div class="d-block text-truncate text-start" style="width: 130px">
+            {{ selectedOrg?.text || "Select organization" }}
+          </div>
+          <v-icon class="ml-1">mdi-menu-down</v-icon>
+        </v-btn>
+      </template>
+
+      <v-card width="300px" rounded="lg" class="pa-4">
+        <span class="text-subtitle-2 font-weight-bold">
+          Switch organization context
+        </span>
+        <v-text-field density="compact" width="100%" hide-details class="mb-2">
+          <template #prepend-inner>
+            <v-icon>mdi-magnify</v-icon>
+          </template>
+        </v-text-field>
+        <v-divider />
+        <v-list class="pa-0 my-2" density="compact" max-height="200px">
+          <v-list-item
+            density="compact"
+            class="text-caption font-weight-bold"
+            v-for="item in orgs"
+            @click="switchOrg(item.value)"
+          >
+            <v-icon size="16" class="mr-2">
+              {{ currentOrg === item.value ? "mdi-check" : "" }}
+            </v-icon>
+
+            {{ item.text }}
+          </v-list-item>
+        </v-list>
+
+        <v-btn
+          v-if="isOrg"
+          block
+          class="text-none mb-1"
+          variant="tonal"
+          @click="navigateToOrgs"
+        >
+          Manage Organizations
+        </v-btn>
+        <v-btn
+          v-if="isOrg"
+          block
+          class="text-none mt-1"
+          variant="tonal"
+          @click="createOrg"
+        >
+          Create Organization
+        </v-btn>
+      </v-card>
+    </v-menu>
+  </v-row>
+</template>
+
+<script setup lang="ts">
+const { currentUser } = useLocalAuth();
+
+const menu = ref(false);
+const { getNameInitials } = useUtils();
+
+const profile = computed(() => {
+  return `/api/public/${currentUser.value?.profile}`;
+});
+
+const { getByUserId: _getByUserId, currentOrg } = useOrg();
+
+const orgs = ref<Array<Record<string, any>>>([]);
+const page = ref(1);
+
+const selectedOrg = ref<Record<string, any> | null>();
+
+function setOrg() {
+  selectedOrg.value = orgs.value.find((org) => org.value === currentOrg.value);
+}
+
+watch(currentOrg, () => {
+  menu.value = false;
+  setOrg();
+});
+
+const { data: userOrgReq } = useLazyAsyncData("orgs-by-user", () => {
+  return _getByUserId({ user: currentUser.value?._id });
+});
+
+watchEffect(() => {
+  if (userOrgReq.value) {
+    orgs.value = userOrgReq.value.items;
+    page.value = userOrgReq.value.page;
+    setOrg();
+  }
+});
+
+function switchOrg(org: string) {
+  navigateTo({
+    name: "org-organization",
+    params: { organization: org },
+  });
+}
+
+const APP_NAME = useRuntimeConfig().public.APP_NAME;
+const APP_ORG = useRuntimeConfig().public.APP_ORG;
+
+const { redirect } = useLocal();
+
+function createOrg() {
+  if (APP_NAME.toLowerCase() === "organization") {
+    navigateTo({
+      name: "organizations-create",
+    });
+    return;
+  }
+
+  redirect(APP_ORG, "organizations/create");
+}
+
+function navigateToOrgs() {
+  if (APP_NAME.toLowerCase() === "organization") {
+    navigateTo({
+      name: "organizations",
+      params: { status: "active" },
+    });
+    return;
+  }
+
+  redirect(APP_ORG, "organizations");
+}
+
+const isOrg = computed(() => {
+  return APP_NAME.toLowerCase() === "organization";
+});
+</script>

package/components/TableList.vue

@@ -0,0 +1,130 @@
+<template>
+  <v-card
+    width="100%"
+    variant="outlined"
+    border="thin"
+    rounded="lg"
+    :loading="loading"
+  >
+    <v-toolbar density="compact" color="grey-lighten-4">
+      <template #prepend>
+        <v-checkbox v-model="selectAll" hide-details class="mx-1"></v-checkbox>
+
+        <v-btn fab icon density="comfortable" @click="emit('refresh')">
+          <v-icon>mdi-refresh</v-icon>
+        </v-btn>
+      </template>
+
+      <template #append>
+        <v-row no-gutters justify="end" align="center">
+          <span class="mr-2 text-caption text-fontgray">
+            {{ props.pageRange }}
+          </span>
+          <div class="arrow-navigation">
+            <v-btn
+              icon="mdi-chevron-left"
+              variant="text"
+              density="comfortable"
+              :disabled="page <= 1"
+              @click="decrement"
+            />
+            <v-btn
+              icon="mdi-chevron-right"
+              variant="text"
+              density="comfortable"
+              :disabled="page >= props.pages"
+              @click="increment"
+            />
+          </div>
+        </v-row>
+      </template>
+
+      <template v-if="$slots.extension" v-slot:extension>
+        <slot name="extension"></slot>
+      </template>
+    </v-toolbar>
+    <v-divider></v-divider>
+
+    <v-data-table
+      v-model="selected"
+      v-bind="attrs"
+      :headers="props.headers"
+      :items="props.items"
+      item-value="_id"
+      items-per-page="10"
+      show-select
+      fixed-header
+      hide-default-footer
+      hide-default-header
+      :loading="props.loading"
+      :style="`max-height: ${props.height};`"
+    >
+      <template v-if="$slots.item" v-slot:item>
+        <slot name="item"></slot>
+      </template>
+    </v-data-table>
+  </v-card>
+</template>
+
+<script setup lang="ts">
+const attrs = useAttrs();
+const selected = defineModel({
+  type: Array as PropType<Array<string>>,
+  default: () => [],
+});
+const page = defineModel("page", { type: Number, default: 0 });
+
+const props = defineProps({
+  headers: {
+    type: Array as PropType<Array<Record<string, string>>>,
+    required: true,
+    default: () => [],
+  },
+  items: {
+    type: Array as PropType<Array<Record<string, string>>>,
+    required: true,
+    default: () => [],
+  },
+  pages: {
+    type: Number,
+    required: true,
+    default: 0,
+  },
+  pageRange: {
+    type: String,
+    required: true,
+    default: "-- - -- of --",
+  },
+  loading: {
+    type: Boolean,
+    required: true,
+    default: true,
+  },
+  height: {
+    type: String,
+    default: "",
+  },
+});
+
+const emit = defineEmits(["refresh", "update:pagination"]);
+
+function increment() {
+  page.value++;
+  emit("update:pagination", page.value);
+}
+
+function decrement() {
+  page.value--;
+  emit("update:pagination", page.value);
+}
+
+const selectAll = ref(false);
+
+watch(selectAll, (curr) => {
+  selected.value.splice(0, selected.value.length);
+  if (curr) {
+    const ids = props.items.map((i) => i._id as string);
+    selected.value.push(...ids);
+  }
+});
+</script>

package/composables/useAddress.ts

@@ -0,0 +1,144 @@
+export default function useAddress() {
+  function add({
+    type = "",
+    user = "",
+    org = "",
+    country = "",
+    countryCode = "",
+    phoneNumber = "",
+    address = "",
+    continuedAddress = "",
+    city = "",
+    province = "",
+    postalCode = "",
+    taxId = "",
+  } = {}) {
+    return useNuxtApp().$api("/api/addresses", {
+      method: "POST",
+      body: {
+        type,
+        user,
+        org,
+        country,
+        countryCode,
+        phoneNumber,
+        address,
+        continuedAddress,
+        city,
+        province,
+        postalCode,
+        taxId,
+      },
+    });
+  }
+
+  function updateById({
+    id = "",
+    country = "",
+    address = "",
+    continuedAddress = "",
+    city = "",
+    province = "",
+    postalCode = "",
+    taxId = "",
+    orgId = "",
+  } = {}) {
+    const payload: Record<string, any> = {
+      country,
+      address,
+      continuedAddress,
+      city,
+      province,
+      postalCode,
+      taxId,
+    };
+
+    if (orgId) {
+      payload.org = orgId;
+    }
+
+    return useNuxtApp().$api(`/api/addresses/details/${id}`, {
+      method: "PUT",
+      body: payload,
+    });
+  }
+
+  function getByUserId(user = "") {
+    return useNuxtApp().$api<TAddress>(`/api/addresses/user/${user}`);
+  }
+
+  function getByOrgId(id = "") {
+    return useNuxtApp().$api<TAddress>(`/api/addresses/org/${id}`);
+  }
+
+  const _address = useState("address", (): TAddress => {
+    return {
+      type: "",
+      user: "",
+      org: "",
+      country: "",
+      address: "",
+      continuedAddress: "",
+      city: "",
+      province: "",
+      postalCode: "",
+      taxId: "",
+    };
+  });
+
+  function reset() {
+    _address.value.type = "";
+    _address.value.user = "";
+    _address.value.org = "";
+    _address.value.country = "";
+    _address.value.address = "";
+    _address.value.continuedAddress = "";
+    _address.value.city = "";
+    _address.value.province = "";
+    _address.value.postalCode = "";
+    _address.value.taxId = "";
+  }
+
+  function set({
+    type = "",
+    user = "",
+    org = "",
+    country = "",
+    address = "",
+    continuedAddress = "",
+    city = "",
+    province = "",
+    postalCode = "",
+    taxId = "",
+  } = {}) {
+    _address.value.type = type;
+    _address.value.user = user;
+    _address.value.org = org;
+    _address.value.country = country;
+    _address.value.address = address;
+    _address.value.continuedAddress = continuedAddress;
+    _address.value.city = city;
+    _address.value.province = province;
+    _address.value.postalCode = postalCode;
+    _address.value.taxId = taxId;
+  }
+
+  const { address, city, province, postalCode, country } = _address.value;
+
+  const completeAddress = computed(() => {
+    return `${address ? `${address}, ` : ""}${
+      city ? `${city}, ` : ""
+    } ${province} ${postalCode ? `${postalCode}, ` : ""} ${country}`;
+  });
+
+  return {
+    add,
+    reset,
+    set,
+    getByUserId,
+    address: _address,
+    completeAddress,
+    getByOrgId,
+    updateById,
+  };
+}

package/composables/useChartOfAccount.ts

@@ -0,0 +1,62 @@
+export default function useChartOfAccount() {
+  function getAll(
+    { page = 1, status = "active", orgId = "", children = null } = {} as {
+      page?: number;
+      status?: string;
+      orgId?: string;
+      children?: number;
+    }
+  ) {
+    return useNuxtApp().$api<Record<string, any>>("/api/chart-of-accounts", {
+      method: "GET",
+      query: { page, status, orgId, children },
+    });
+  }
+
+  type TAddPayload = {
+    orgId: string;
+    code: string;
+    name: string;
+    normalBalance: string;
+    parent?: string;
+    description?: string;
+  };
+
+  function add(value: TAddPayload) {
+    return useNuxtApp().$api<TAddPayload>("/api/chart-of-accounts", {
+      method: "POST",
+      body: value,
+    });
+  }
+
+  function getById(id: string) {
+    return useNuxtApp().$api<Record<string, any>>(
+      `/api/chart-of-accounts/id/${id}`
+    );
+  }
+
+  function updateById(
+    id: string,
+    value: Pick<TAddPayload, "name" | "code" | "normalBalance" | "parent">
+  ) {
+    return useNuxtApp().$api<TAddPayload>(`/api/chart-of-accounts/id/${id}`, {
+      method: "PUT",
+      body: value,
+    });
+  }
+
+  function deleteById(id: string) {
+    return useNuxtApp().$api<Record<string, any>>(
+      `/api/chart-of-accounts/id/${id}`,
+      { method: "DELETE" }
+    );
+  }
+
+  return {
+    getAll,
+    add,
+    getById,
+    updateById,
+    deleteById,
+  };
+}

package/composables/useCommonPermission.ts

@@ -0,0 +1,130 @@
+export function useCommonPermissions() {
+  const invitationPermissions: Record<string, TPermission> = {
+    "create-invitation": {
+      check: true,
+      description:
+        "Allows the user to create a new invitation for a invitation to join the organization.",
+    },
+    "view-invitations": {
+      check: true,
+      description:
+        "Allows the user to view the list of all invitation in the organization.",
+    },
+    "cancel-invitation": {
+      check: true,
+      description:
+        "Allows the user to permanently remove a invitation from the organization.",
+    },
+  };
+
+  const memberPermissions: Record<string, TPermission> = {
+    "view-members": {
+      check: true,
+      description:
+        "Allows the user to view the list of all members in the organization.",
+    },
+    "assign-member-role": {
+      check: true,
+      description:
+        "Allows the user to assign a specific role to a member in the organization.",
+    },
+    "suspend-member": {
+      check: true,
+      description: "Allows the user to suspend a member's account temporarily.",
+    },
+    "activate-member": {
+      check: true,
+      description:
+        "Allows the user to reactivate a suspended member's account.",
+    },
+    "delete-member": {
+      check: true,
+      description:
+        "Allows the user to permanently remove a member from the organization.",
+    },
+  };
+
+  const rolePermissions: Record<string, TPermission> = {
+    "add-role": {
+      check: true,
+      description: "Allows the user to add a new role to the system.",
+    },
+    "see-all-roles": {
+      check: true,
+      description: "Allows the user to view the list of all roles.",
+    },
+    "see-role-details": {
+      check: true,
+      description: "Allows the user to view the details of a specific role.",
+    },
+    "delete-role": {
+      check: true,
+      description:
+        "Allows the user to remove a role from the system permanently.",
+    },
+    "update-role": {
+      check: true,
+      description: "Allows the user to update the details of an existing role.",
+    },
+  };
+
+  const feedbackPermissions: Record<string, TPermission> = {
+    "add-feedback": {
+      check: true,
+      description: "Allows the user to create a new feedback.",
+    },
+    "see-all-feedback": {
+      check: true,
+      description: "Allows the user to view the list of all feedback.",
+    },
+    "see-feedback-details": {
+      check: true,
+      description:
+        "Allows the user to view the details of a specific feedback.",
+    },
+    "delete-feedback": {
+      check: true,
+      description:
+        "Allows the user to remove a feedback from the system permanently.",
+    },
+    "update-feedback": {
+      check: true,
+      description:
+        "Allows the user to update the details of an existing feedback.",
+    },
+  };
+
+  const workOrderPermissions: Record<string, TPermission> = {
+    "create-work-order": {
+      check: true,
+      description: "Allows the user to create a new work order.",
+    },
+    "see-all-work-orders": {
+      check: true,
+      description: "Allows the user to view the list of all work orders.",
+    },
+    "see-work-order-details": {
+      check: true,
+      description:
+        "Allows the user to view the details of a specific work order.",
+    },
+    "delete-work-order": {
+      check: true,
+      description:
+        "Allows the user to remove a work order from the system permanently.",
+    },
+    "update-work-order": {
+      check: true,
+      description:
+        "Allows the user to update the details of an existing work order.",
+    },
+  };
+
+  return {
+    invitationPermissions,
+    memberPermissions,
+    rolePermissions,
+    feedbackPermissions,
+    workOrderPermissions,
+  };
+}

package/composables/useFile.ts

@@ -0,0 +1,29 @@
+export default function useFile() {
+  function addFile(file: File | null) {
+    if (!file) {
+      throw new Error("File not found.");
+    }
+
+    const formData = new FormData();
+    formData.append("file", file);
+
+    return useNuxtApp().$api<Record<string, any>>("/api/files", {
+      method: "POST",
+      body: formData,
+    });
+  }
+
+  function deleteFile(attachmentId: string) {
+    return useNuxtApp().$api<Record<string, any>>(
+      `/api/files/${attachmentId}`,
+      {
+        method: "DELETE",
+      }
+    );
+  }
+
+  return {
+    addFile,
+    deleteFile,
+  };
+}

package/composables/useInvoice.ts

@@ -0,0 +1,42 @@
+export default function useInvoice() {
+  function getBySubscriptionId({ search = "", id = "", page = 1 } = {}) {
+    if (!id) {
+      throw new Error("Subscription ID is required");
+    }
+
+    return useNuxtApp().$api<Record<string, any>>(
+      `/api/invoices/subscription/${id}`,
+      {
+        method: "GET",
+        params: {
+          search,
+          page,
+        },
+      }
+    );
+  }
+
+  function getByNumber(number: string) {
+    return useNuxtApp().$api<Record<string, any>>(
+      `/api/invoices/number/${number}`,
+      {
+        method: "GET",
+      }
+    );
+  }
+
+  function getByDueDateStatus(date: string, status: string) {
+    return useNuxtApp().$api<Record<string, any>>(
+      `/api/invoices/due-date/${date}/status/${status}`,
+      {
+        method: "GET",
+      }
+    );
+  }
+
+  return {
+    getBySubscriptionId,
+    getByNumber,
+    getByDueDateStatus,
+  };
+}