@iservice365/layer-common 0.1.0 → 0.2.0

package/composables/useUtils.ts

@@ -6,6 +6,35 @@ export default function useUtils() {
     return regex.test(v) || "Please enter a valid email address";
   };
 
+  const validateDate = (value: string): boolean | string => {
+    const dateRegex = /^(0[1-9]|1[0-2])\/(0[1-9]|[12][0-9]|3[01])\/\d{4}$/;
+
+    if (!dateRegex.test(value)) return "Invalid date format (MM/DD/YYYY)";
+
+    return true;
+  };
+
+  function requireListRule(value: string[]) {
+    return value.length ? "" : "Required";
+  }
+
+  const minOneMonthAdvance = (value: string): boolean | string => {
+    if (!/^(0[1-9]|1[0-2])\/(0[1-9]|[12][0-9]|3[01])\/\d{4}$/.test(value)) {
+      return "Invalid date format (MM/DD/YYYY)";
+    }
+
+    const [month, day, year] = value.split("/").map(Number);
+    const selectedDate = new Date(year, month - 1, day);
+
+    const currentDate = new Date();
+    const minDate = new Date();
+    minDate.setMonth(currentDate.getMonth() + 1); // 1 month in advance
+
+    return (
+      selectedDate >= minDate || "Date must be at least 1 month in advance"
+    );
+  };
+
   const passwordRule = (v: string) =>
     v.length >= 8 || "Password must be at least 8 characters long";
 
@@ -26,6 +55,11 @@ export default function useUtils() {
     }
   };
 
+  const validateWord = (value: string): boolean | string => {
+    if (value.trim().length < 3) return "Must be at least 3 characters";
+    return true;
+  };
+
   const validatePassword = (
     password: Ref<string>,
     passwordErrors: Ref<string[]>
@@ -66,13 +100,16 @@ export default function useUtils() {
       return ""; // Default fallback for invalid input
     }
 
-    const initials = name
-      .trim()
-      .split(/\s+/) // Split by spaces
-      .map((word) => word[0]?.toUpperCase()) // Take the first letter of each word and capitalize
-      .join(""); // Combine all initials
+    const words = name.trim().split(/\s+/); // Split by spaces
 
-    return initials.slice(0, 2); // Limit to 2 characters
+    if (words.length === 1) {
+      return words[0].slice(0, 2).toUpperCase(); // Take first two letters of the single word
+    }
+
+    return words
+      .map((word) => word[0]?.toUpperCase()) // Take the first letter of each word and capitalize
+      .join("")
+      .slice(0, 2); // Limit to 2 characters
   }
 
   function getDimensions(
@@ -93,12 +130,171 @@ export default function useUtils() {
     });
   }
 
+  async function getCountries() {
+    try {
+      const countries = await useNuxtApp().$api<Array<Record<string, any>>>(
+        "https://restcountries.com/v3.1/all?fields=name,idd",
+        { method: "GET" }
+      );
+
+      const uniqueCountries = new Map();
+
+      countries.forEach((country) => {
+        let suffixes = country.idd?.suffixes?.[0] || "";
+        let code = `${country.idd?.root || ""}${suffixes}`;
+        let name = country.name?.common || "";
+
+        if (name && code && !uniqueCountries.has(code)) {
+          uniqueCountries.set(code, { index: `${name}-${code}`, name, code });
+        }
+      });
+
+      return Array.from(uniqueCountries.values()).sort((a, b) =>
+        a.name.localeCompare(b.name)
+      );
+    } catch (error) {
+      console.error(error);
+      throw new Error("Failed to fetch countries.");
+    }
+  }
+
+  const formatter = new Intl.NumberFormat("en-US", {
+    minimumFractionDigits: 2,
+    maximumFractionDigits: 2,
+  });
+
+  function formatNumber(
+    amount: number,
+    options: {
+      currency?: string;
+      locale?: string;
+      useSymbol?: boolean;
+      decimalPlaces?: number;
+    } = {}
+  ): string {
+    const {
+      currency,
+      locale = "en-US",
+      useSymbol = false,
+      decimalPlaces = 2,
+    } = options;
+
+    return new Intl.NumberFormat(locale, {
+      style: useSymbol && currency ? "currency" : "decimal",
+      currency: currency || "USD", // Default currency (ignored if `useSymbol` is false)
+      minimumFractionDigits: decimalPlaces,
+      maximumFractionDigits: decimalPlaces,
+    }).format(amount);
+  }
+
+  // 🔹 Examples:
+  // console.log(formatNumber(1234.56)); // "1,234.56" (comma separator, 2 decimals)
+  // console.log(formatNumber(1234.56, { decimalPlaces: 0 })); // "1,234" (no decimals)
+  // console.log(formatNumber(1234.56, { useSymbol: true, currency: "USD" })); // "$1,234.56"
+  // console.log(formatNumber(1234.56, { useSymbol: true, currency: "SGD", decimalPlaces: 0 })); // "S$1,234"
+  // console.log(formatNumber(1234.56, { useSymbol: false, decimalPlaces: 0 })); // "1,234"
+  // console.log(formatNumber(1234.56, { useSymbol: true, currency: "EUR", locale: "de-DE" })); // "1.234,56 €"
+  // console.log(formatNumber(1234.56, { useSymbol: true, currency: "EUR", locale: "de-DE", decimalPlaces: 0 })); // "1.234 €"
+
+  function convertPermissionsToArray(permissions: TPermissions) {
+    return Object.entries(permissions).flatMap(([resource, actions]) =>
+      Object.keys(actions).map((action) => `${resource}:${action}`)
+    );
+  }
+
   function redirect(link: string, page?: string) {
     const href = page ? `${link}/${page}` : link;
 
     window.location.href = href;
   }
 
+  function computeTieredCost(seats: number, tiers: TPromoTier[]) {
+    let totalCost = 0;
+
+    for (let i = 0; i < tiers.length; i++) {
+      let { min, max, price } = tiers[i];
+
+      if (max === 0) max = Infinity; // Handle unlimited tier
+
+      if (seats >= min) {
+        let seatsInTier = Math.min(seats, max) - min + 1;
+        totalCost += seatsInTier * price;
+      }
+
+      if (seats <= max) break; // Stop when all seats are counted
+    }
+
+    return totalCost;
+  }
+
+  const getColorStatus = (status: string) => {
+    switch (status.toLowerCase()) {
+      case "in-progress":
+      case "in progress":
+        return "warning";
+      case "to-do":
+      case "to do":
+        return "#052439";
+      case "complete":
+      case "active":
+        return "success";
+
+      case "suspended":
+        return "error";
+
+      default:
+        return "grey";
+    }
+  };
+
+  function getOrigin() {
+    if (process.client) {
+      return window.location.origin;
+    }
+    return "";
+  }
+
+  const search = useState("search", () => "");
+
+  function formatDate(dateString: string) {
+    if (!dateString) return "N/A";
+
+    const date = new Date(dateString);
+    return date.toLocaleDateString("en-US", {
+      year: "numeric",
+      month: "short",
+      day: "numeric",
+      hour: "2-digit",
+      minute: "2-digit",
+    });
+  }
+
+  function formatNature(value: string): string {
+    if (!value) return "";
+    return value
+      .split("_")
+      .map((word) => word.charAt(0).toUpperCase() + word.slice(1))
+      .join(" ");
+  }
+
+  function replaceMatch(str: string, match: string, replace: string) {
+    return str.replace(new RegExp(match, "g"), replace);
+  }
+
+  function setRouteParams(...args: Array<Record<string, string>>) {
+    const params: Record<string, string> = {};
+
+    args.forEach((arg) => {
+      Object.entries(arg).forEach(([key, value]) => {
+        if (value !== undefined && value !== null && value !== "") {
+          params[key] = value;
+        }
+      });
+    });
+
+    return params;
+  }
+
   return {
     requiredRule,
     emailRule,
@@ -111,6 +307,22 @@ export default function useUtils() {
     insertBetween,
     getNameInitials,
     getDimensions,
+    validateWord,
+    getCountries,
+    formatter,
+    formatNumber,
+    validateDate,
+    minOneMonthAdvance,
+    requireListRule,
+    convertPermissionsToArray,
     redirect,
+    computeTieredCost,
+    getColorStatus,
+    getOrigin,
+    search,
+    formatDate,
+    formatNature,
+    replaceMatch,
+    setRouteParams,
   };
 }

package/composables/useVerification.ts

@@ -0,0 +1,33 @@
+export default function useVerification() {
+  function getVerifications({
+    status = "pending",
+    type = "user-invite",
+    search = "",
+    page = 1,
+    email = "",
+  } = {}): Promise<{
+    items: TMiniVerification[];
+    pages: number;
+    pageRange: string;
+  }> {
+    return useNuxtApp().$api("/api/verifications", {
+      method: "GET",
+      query: { status, search, page, type, email },
+    });
+  }
+
+  function cancelUserInvitation(id: string) {
+    console.log("Calling API to cancel:", id);
+    return useNuxtApp().$api<Record<string, any>>(
+      `/api/verifications/${id}/cancel`,
+      {
+        method: "PUT",
+      }
+    );
+  }
+
+  return {
+    getVerifications,
+    cancelUserInvitation,
+  };
+}

package/composables/useWorkOrder.ts

@@ -0,0 +1,68 @@
+export default function useFeedback() {
+  const workOrders = useState<Array<TWorkOrder>>("workOrders", () => []);
+  const page = useState("page", () => 1);
+  const pages = useState("pages", () => 0);
+  const pageRange = useState("pageRange", () => "-- - -- of --");
+  const workOrder = useState<TWorkOrder>("workOrder", () => ({
+    _id: "",
+    subject: "",
+    description: "",
+    createdBy: "",
+    service: "",
+    provider: "",
+    organization: "",
+    site: "",
+    createdByName: "",
+    assignee: "",
+    location: "",
+    attachments: [],
+    feedback: "",
+    status: "",
+    createdAt: "",
+    updatedAt: "",
+    deletedAt: "",
+    highPriority: false,
+    block: "",
+    level: "",
+    unit: "",
+    serviceProvider: "",
+  }));
+
+  async function getWorkOrders({
+    page = 1,
+    organization = "",
+    site = "",
+    status = "to-do",
+    search = "",
+    limit = 10,
+  } = {}) {
+    try {
+      return useNuxtApp().$api<Record<string, any>>(
+        `/api/work-orders/organization/${organization}/site/${site}/status/${status}`,
+        {
+          method: "GET",
+          query: { page, search, limit },
+        }
+      );
+    } catch (err) {
+      console.error(err);
+    }
+  }
+
+  function createWorkOrder(payload: TWorkOrderCreate) {
+    return useNuxtApp().$api<Record<string, any>>("/api/work-orders", {
+      method: "POST",
+      body: payload,
+    });
+  }
+
+  return {
+    workOrders,
+    workOrder,
+    page,
+    pages,
+    pageRange,
+    createWorkOrder,
+    getWorkOrders,
+  };
+}

package/middleware/01.auth.ts

@@ -0,0 +1,11 @@
+export default defineNuxtRouteMiddleware(async () => {
+  const { cookieConfig } = useRuntimeConfig().public;
+
+  // Get access token from cookies
+  const accessToken = useCookie("accessToken", cookieConfig).value;
+
+  if (!accessToken) {
+    // Redirect to login page if no access token
+    return navigateTo({ name: "index" });
+  }
+});

package/middleware/02.org.ts

@@ -0,0 +1,18 @@
+import { z } from "zod";
+
+const hexSchema = z
+  .string()
+  .regex(/^[0-9a-fA-F]{24}$/, "Invalid organization ID");
+
+export default defineNuxtRouteMiddleware(async (to) => {
+  if (import.meta.server) return;
+
+  const { organization, org } = to.params;
+
+  if (!hexSchema.safeParse(organization ?? org).success) {
+    return navigateTo(
+      { name: "require-organization-membership" },
+      { replace: true }
+    );
+  }
+});

package/middleware/03.customer.ts

@@ -0,0 +1,13 @@
+import { z } from "zod";
+
+const hexSchema = z.string().regex(/^[0-9a-fA-F]{24}$/, "Invalid customer ID");
+
+export default defineNuxtRouteMiddleware(async (to, from) => {
+  if (import.meta.server) return;
+
+  const site = to.params.site as string;
+
+  if (!hexSchema.safeParse(site).success) {
+    return navigateTo({ name: "require-customer" }, { replace: true });
+  }
+});

package/nuxt.config.ts

@@ -3,7 +3,7 @@ import vuetify, { transformAssetUrls } from "vite-plugin-vuetify";
 export default defineNuxtConfig({
   devtools: { enabled: true },
   build: {
-    transpile: ["vuetify"],
+    transpile: ["vuetify", "nuxt-signature-pad"],
   },
 
   runtimeConfig: {
@@ -37,6 +37,7 @@ export default defineNuxtConfig({
         config.plugins.push(vuetify({ autoImport: true }));
       });
     },
+    "nuxt-signature-pad",
   ],
 
   vite: {

package/package.json

@@ -2,7 +2,7 @@
   "name": "@iservice365/layer-common",
   "license": "MIT",
   "type": "module",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "main": "./nuxt.config.ts",
   "publishConfig": {
     "access": "public"
@@ -20,14 +20,18 @@
     "@nuxt/eslint": "latest",
     "eslint": "^9.14.0",
     "nuxt": "^3.13.2",
-    "typescript": "^5.6.3",
+    "nuxt-signature-pad": "1.3.0",
+    "typescript": "^5.8.3",
     "vite-plugin-vuetify": "^2.0.4",
     "vue": "latest",
     "vuetify": "^3.7.3"
   },
   "packageManager": "yarn@1.22.22+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e",
   "dependencies": {
+    "@iconify/vue": "^5.0.0",
     "@mdi/font": "^7.4.47",
-    "sass": "^1.80.6"
+    "sass": "^1.80.6",
+    "vue3-signature": "^0.2.4",
+    "zod": "^3.24.2"
   }
 }

package/pages/index.vue

@@ -0,0 +1,3 @@
+<template>
+  <h1>index</h1>
+</template>

package/pages/payment-method-linked.vue

@@ -0,0 +1,31 @@
+<template>
+  <v-row no-gutters class="fill-height" justify="center" align-content="center">
+    <v-card class="pa-4" elevation="4" color="success lighten-1">
+      <v-card-title class="text-white d-flex align-center">
+        <v-icon class="mr-2">mdi-check-circle</v-icon>
+        Successfully Linked Payment Method
+      </v-card-title>
+
+      <v-card-actions class="d-flex justify-center">
+        <v-btn
+          color="white"
+          variant="tonal"
+          rounded="xl"
+          size="large"
+          @click="closeWindow"
+          >Close</v-btn
+        >
+      </v-card-actions>
+    </v-card>
+  </v-row>
+</template>
+
+<script setup>
+definePageMeta({
+  layout: "plain",
+});
+
+const closeWindow = () => {
+  window.close();
+};
+</script>

package/pages/require-customer.vue

@@ -0,0 +1,56 @@
+<template>
+  <v-row no-gutters class="fill-height" align="center" justify="center">
+    <v-col cols="12" lg="6" md="6" sm="6" class="text-center text-subtitle-1">
+      You must have a customer to view this page. Please join or contact your
+      administrator for access.
+      <v-row no-gutters justify="center" align="center" class="mt-2">
+        <v-btn
+          @click="goToAccount"
+          rounded="xl"
+          variant="tonal"
+          class="text-none text-subtitle-2"
+        >
+          Go to Organization Page
+        </v-btn>
+        <span class="mx-2">or</span>
+        <v-btn
+          @click="createCustomer"
+          rounded="xl"
+          variant="tonal"
+          class="text-none text-subtitle-2"
+        >
+          Create an Customer
+        </v-btn>
+      </v-row>
+    </v-col>
+  </v-row>
+</template>
+
+<script setup lang="ts">
+definePageMeta({
+  layout: "plain",
+});
+
+const { APP_NAME, APP_ORG } = useRuntimeConfig().public;
+
+function goToAccount() {
+  window.location.href = `${APP_ORG}`;
+}
+
+const { authenticate } = useLocalAuth();
+
+authenticate();
+
+const { currentUser } = useLocalAuth();
+
+function createCustomer() {
+  if (APP_NAME.toLowerCase() === "org") {
+    navigateTo({
+      name: "org-organizations-customers-add",
+      params: { organization: currentUser.value?.defaultOrg },
+    });
+  } else {
+    window.location.href = `${APP_ORG}/org/${currentUser.value?.defaultOrg}/customers/add`;
+  }
+}
+</script>

package/pages/require-organization-membership.vue

@@ -0,0 +1,47 @@
+<template>
+  <v-row no-gutters class="fill-height" align="center" justify="center">
+    <v-col cols="12" lg="6" md="6" sm="6" class="text-center text-subtitle-1">
+      You must be a member of an organization to view this page. Please join or
+      contact your administrator for access.
+      <v-row no-gutters justify="center" align="center" class="mt-2">
+        <v-btn
+          @click="goToAccount"
+          rounded="xl"
+          variant="tonal"
+          class="text-none text-subtitle-2"
+        >
+          Go to Account Page
+        </v-btn>
+        <span class="mx-2">or</span>
+        <v-btn
+          @click="createOrg"
+          rounded="xl"
+          variant="tonal"
+          class="text-none text-subtitle-2"
+        >
+          Create an Organization
+        </v-btn>
+      </v-row>
+    </v-col>
+  </v-row>
+</template>
+
+<script setup lang="ts">
+definePageMeta({
+  layout: "plain",
+});
+
+const { APP_ACCOUNT, APP_NAME, APP_ORG } = useRuntimeConfig().public;
+
+function goToAccount() {
+  window.location.href = `${APP_ACCOUNT}/home`;
+}
+
+function createOrg() {
+  if (APP_NAME.toLowerCase() === "org") {
+    navigateTo({ name: "organizations-create" });
+  } else {
+    window.location.href = `${APP_ORG}/organizations/create`;
+  }
+}
+</script>

package/pages/unauthorized.vue

@@ -0,0 +1,29 @@
+<template>
+  <v-row no-gutters class="fill-height" align="center" justify="center">
+    <v-col cols="12" lg="6" md="6" sm="6" class="text-center text-subtitle-1">
+      You must be a member of an organization to view this page. Please join or
+      contact your administrator for access.
+      <v-row no-gutters justify="center" class="mt-2">
+        <v-btn
+          @click="goToAccount"
+          rounded="xl"
+          variant="tonal"
+          class="text-none text-subtitle-2"
+        >
+          Go to Account Page
+        </v-btn>
+      </v-row>
+    </v-col>
+  </v-row>
+</template>
+
+<script setup lang="ts">
+definePageMeta({
+  layout: "plain",
+});
+
+function goToAccount() {
+  const { APP_ACCOUNT } = useRuntimeConfig().public;
+  window.location.href = `${APP_ACCOUNT}/home`;
+}
+</script>

package/plugins/API.ts

@@ -8,9 +8,7 @@ export default defineNuxtPlugin(() => {
     retryDelay: 500,
     onRequest({ options }) {
       const accessToken = useCookie("accessToken", cookieConfig).value;
-      options.headers = accessToken
-        ? { Authorization: `Bearer ${accessToken}` }
-        : {};
+      options.headers.set("Authorization", `Bearer ${accessToken}`);
     },
 
     async onResponseError({ response }) {

package/plugins/iconify.client.ts

@@ -0,0 +1,5 @@
+import { Icon } from "@iconify/vue";
+
+export default defineNuxtPlugin((nuxtApp) => {
+  nuxtApp.vueApp.component("Icon", Icon);
+});

package/plugins/vuetify.ts

@@ -31,6 +31,8 @@ export default defineNuxtPlugin((app) => {
           dark: false,
           colors: {
             primary: "#042134",
+            "primary-button": "#1867C0",
+            "text-primary": "#052439",
           },
         },
       },