fix:

1. number display logic,
2. using '0xxx-xxx' or '+xx-xxx ' to display phone number
3. merge invoice and quotation template
4. modify invoice and quotation pdf template

src/apis/axios.ts

@@ -2,10 +2,10 @@ import axios from "axios";
 
 const apis = axios.create({
     withCredentials: true,
-    //baseURL: `http://localhost:8080`,
+    baseURL: `http://localhost:8080`,
     // playground
     //baseURL: `https://cpsoftware.com.au`,
-    baseURL: `https://test.cpsoftware.com.au`,
+    //baseURL: `https://test.cpsoftware.com.au`,
     // alex
     //baseURL: `https://tool.srclandscaping.com.au`,
     //baseURL: `https://test.srclandscaping.com.au`,

src/lib/literals.ts

@@ -59,35 +59,46 @@ export const genAction = (path: keyof typeof routerPaths, cid?: string) => {
     }
 };
 
+/**
+ * @description form the number displaying style
+ *              - if number is start with +, then result would be +xx-xxx-xxx-xxx
+ *              - if number is start with 0, then result would be 0xxx-xxx-xxx
+ *              - otherwise, result would be xxx-xxx-xxx
+ * @param number
+ * @returns
+ */
 export const formNumberDigits = (number: string) => {
-    let formatted = number.replace(/\D/g, ""); // Remove all non-digit characters
+    const formatted: string = number.replace(/\D/g, "");
+    let formattedNumber;
 
-    if (number.startsWith("+")) {
-        formatted = "+" + formatted;
+    if (number.length <= 2) {
+        return number;
     }
 
-    if (formatted.startsWith("+")) {
-        // Handle the international format with the '+' sign
-        const match = formatted.match(
-            /^\+(\d{1,2})(\d{1,3})(\d{1,3})(\d{1,3})?$/
-        );
-        if (match) {
-            formatted = `+${match[1]}-${match[2]}`;
-            if (match[3]) {
-                formatted += `-${match[3]}`;
-            }
-            if (match[4]) {
-                formatted += `-${match[4]}`;
-            }
-        }
+    if (number.startsWith("0")) {
+        const head = formatted.slice(0, 4);
+        const body = formatted.slice(4);
+        formattedNumber = head + "-" + body.match(/.{1,3}/g)!.join("-");
+    } else if (number.startsWith("+")) {
+        const head = formatted.slice(0, 2);
+        const body = formatted.slice(2);
+        formattedNumber = "+" + head + "-" + body.match(/.{0,3}/g)!.join("-");
     } else {
-        // Handle the local format
-        formatted = formatted.replace(/(\d{3})(?=\d)/g, "$1-");
+        formattedNumber = formatted.match(/.{1,3}/g)!.join("-");
     }
 
-    return formatted;
+    return formattedNumber.replace(/-$/, "");
 };
 
+/**
+ * @description form the input content of input tag with limitation
+ *              - if type is phone, only + and numbers are allowed
+ *              - if type is number, only numbers are allowed
+ * @param type
+ * @param value
+ * @param limit
+ * @returns
+ */
 export const formNumberWLimit = (
     type: "number" | "phone" = "number",
     value: string,

src/pageComponents/modals/mClientForm/Form/FormContent.tsx

@@ -4,7 +4,7 @@ import { atClient, atInfoConflict } from "@/configs/atoms";
 import { Tclient } from "@/configs/schema/clientSchema";
 import { RES_STATUS } from "@/configs/types";
 import { AU_PHONE, PHONE_HOLDER } from "@/configs/utils/literals";
-import { formNumberDigits, formNumberWLimit } from "@/lib/literals";
+import { formNumberWLimit } from "@/lib/literals";
 import { EnvelopeIcon, PhoneIcon } from "@heroicons/react/24/outline";
 import { useAtom } from "jotai";
 import type { FC, FormEvent } from "react";
@@ -152,7 +152,7 @@ const FormContent: FC<Tprops> = ({
                                         /* {...register("phone", {
                                             required: true,
                                         })} */
-                                        value={formNumberDigits(value)}
+                                        value={value}
                                         onChange={(e) => {
                                             const number = formNumberWLimit(
                                                 "phone",

src/pageComponents/modals/mStaffForm/Form/LeftColumn.tsx

@@ -11,7 +11,7 @@ import type { FC } from "react";
 import { Controller, FieldErrors, UseFormReturn } from "react-hook-form";
 import { useTranslation } from "react-i18next";
 import PWResetBtn from "./PWResetBtn";
-import { formNumberDigits, formNumberWLimit } from "@/lib/literals";
+import { formNumberWLimit } from "@/lib/literals";
 import {
     AU_PHONE,
     BANK_ACCOUNT,
@@ -133,7 +133,7 @@ const LeftColumn: FC<Tprops> = ({ register, control, onClose, errors }) => {
                                 </div>
                                 <input
                                     /* {...register("phone")} */
-                                    value={formNumberDigits(value)}
+                                    value={value}
                                     onChange={(e) => {
                                         const number = formNumberWLimit(
                                             "phone",
@@ -333,7 +333,7 @@ const LeftColumn: FC<Tprops> = ({ register, control, onClose, errors }) => {
                             <div className="mt-1">
                                 <input
                                     //{...register("bsb")}
-                                    value={formNumberDigits(value)}
+                                    value={value}
                                     onChange={(e) => {
                                         const number = formNumberWLimit(
                                             "number",
@@ -376,7 +376,7 @@ const LeftColumn: FC<Tprops> = ({ register, control, onClose, errors }) => {
                             <div className="mt-1">
                                 <input
                                     //{...register("account")}
-                                    value={formNumberDigits(value)}
+                                    value={value}
                                     onChange={(e) => {
                                         const number = formNumberWLimit(
                                             "number",

src/pageComponents/modals/pdfMaker/invoice.tsx

@@ -2,7 +2,7 @@ import { memo, useEffect, useState } from "react";
 import type { FC } from "react";
 import { useAtom } from "jotai";
 import { useSubmit } from "react-router-dom";
-import { InvTemplate } from "@/pageComponents/pdfTemplates/invoices";
+import Template from "@/pageComponents/pdfTemplates/template1";
 import { useTranslation } from "react-i18next";
 import { Toggle } from "@/components/disclosure";
 import {
@@ -183,7 +183,8 @@ const InvContent: FC = memo(() => {
                 />
             </div>
             <div className="col-span-1 md:col-span-5">
-                <InvTemplate
+                <Template
+                    type="I"
                     client={client}
                     order={clientOrder}
                     company={company}

src/pageComponents/modals/pdfMaker/quotation.tsx

@@ -2,7 +2,7 @@ import { memo, useEffect, useState } from "react";
 import type { FC } from "react";
 import { useAtom } from "jotai";
 import { useSubmit } from "react-router-dom";
-import { QuoTemplate } from "@/pageComponents/pdfTemplates/quotations";
+import Template from "@/pageComponents/pdfTemplates/template1";
 import { useTranslation } from "react-i18next";
 import { Toggle } from "@/components/disclosure";
 import {
@@ -175,7 +175,8 @@ const QuoContent: FC = memo(() => {
                 />
             </div>
             <div className="col-span-1 md:col-span-5">
-                <QuoTemplate
+                <Template
+                    type="Q"
                     client={client}
                     order={clientOrder}
                     company={company}