start commit for admin system

src/plugins/axios.ts

@@ -0,0 +1,25 @@
+import axios from "axios"
+import config from "process"
+// import { dotnetPath } from "../path/axiosPath";
+// import { getToken } from "@baloise/vue-keycloak";
+import keycloak from "../plugins/keycloak"
+
+const axiosInstance = axios.create({
+    withCredentials: false,
+})
+
+// axiosInstance.defaults.baseURL = dotnetPath;
+axiosInstance.interceptors.request.use(
+    async (config) => {
+        const token = await keycloak.token
+        config.headers = {
+            Authorization: `Bearer ${token}`,
+        }
+        return config
+    },
+    (error) => {
+        Promise.reject(error)
+    }
+)
+
+export default axiosInstance

src/plugins/filters.ts

@@ -0,0 +1,22 @@
+/**
+ * GLOABL Filters
+ *   - ไฟล์นี้จะไว้เก็บฟังก์ชันง่าย ๆ พวก Helper Functions ทั้งหลาย
+ */
+
+
+const filters = {
+
+	/**
+	 * ฟังก์ชัน compactNumber ใช้แปลงตัวเลขยาว ๆ ให้กลายเป็นเลขสั้น ๆ แบบที่พวก Social Media ชอบใช้กัน เช่น 1,000 แปลงเป็น 1K หรือ 1,000,000 แปลงเป็น 1M
+	 * วิธีใช้ : {{ $filters.compactNumber(value) }}
+	 *
+	 * @param val รับค่าพารามิเตอร์เป็นตัวแปรชนิดตัวเลข
+	 * @returns คืนค่าเป็นตัวเลขที่แปลงค่าแล้ว
+	 */
+	compactNumber (val: number) {
+		const formatter = Intl.NumberFormat('en', { notation: 'compact'})
+		return formatter.format(val)
+	}
+}
+
+export default filters;

src/plugins/genreport.ts

@@ -0,0 +1,59 @@
+import axios from "axios";
+import config from "@/app.config";
+
+import { useQuasar } from "quasar";
+import { useCounterMixin } from "@/stores/mixin";
+
+const $q = useQuasar();
+
+const mixin = useCounterMixin();
+const { showLoader, hideLoader, messageError } = mixin;
+
+async function genReport(data: any, fileName: string, type: string = "docx") {
+  showLoader();
+  await axios
+    .post(`${config.API.reportTemplate}/docx`, data, {
+      headers:
+        type == "docx"
+          ? {
+              accept:
+                "application/vnd.openxmlformats-officedocument.wordprocessingml.document",
+              "content-Type": "application/json",
+            }
+          : {
+              accept: "application/pdf",
+              "content-Type": "application/json",
+            },
+      responseType: "arraybuffer",
+    })
+    .then((res) => {
+      const data = res.data;
+      if (data) {
+        // สร้าง Blob จาก array buffer
+        const blob = new Blob([data], {
+          type: "application/vnd.openxmlformats-officedocument.wordprocessingml.document",
+        });
+
+        // สร้าง URL สำหรับไฟล์ Blob
+        const url = URL.createObjectURL(blob);
+
+        // สร้างลิงก์เพื่อดาวน์โหลดไฟล์
+        const link = document.createElement("a");
+        link.href = url;
+        link.download = `${fileName}.${type === "docx" ? "docx" : "pdf"}`; // กำหนดชื่อไฟล์ที่จะดาวน์โหลด
+        document.body.appendChild(link);
+        link.click();
+
+        // ลบ URL ที่สร้างขึ้นหลังจากใช้งาน
+        URL.revokeObjectURL(url);
+      }
+    })
+    .catch((err) => {
+      messageError($q, err);
+    })
+    .finally(() => {
+      hideLoader();
+    });
+}
+
+export default genReport;

src/plugins/genreportxlsx.ts

@@ -0,0 +1,62 @@
+import axios from "axios";
+import config from "@/app.config";
+
+import { useQuasar } from "quasar";
+import { useCounterMixin } from "@/stores/mixin";
+
+const $q = useQuasar();
+
+const mixin = useCounterMixin();
+const { showLoader, hideLoader, messageError } = mixin;
+
+async function genReportXLSX(
+  data: any,
+  fileName: string,
+  type: string = "xlsx"
+) {
+  showLoader();
+  await axios
+    .post(`${config.API.reportTemplate}/xlsx`, data, {
+      headers:
+        type == "xlsx"
+          ? {
+              accept:
+                "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
+              "content-Type": "application/json",
+            }
+          : {
+              accept: "application/pdf",
+              "content-Type": "application/json",
+            },
+
+      responseType: "blob",
+    })
+    .then((res) => {
+      const data = res.data;
+      if (data) {
+        // สร้าง Blob จาก array buffer
+        const blob = new Blob([data]);
+
+        // สร้าง URL สำหรับไฟล์ Blob
+        const url = URL.createObjectURL(blob);
+
+        // สร้างลิงก์เพื่อดาวน์โหลดไฟล์
+        const link = document.createElement("a");
+        link.href = url;
+        link.download = `${fileName}.${type}`; // กำหนดชื่อไฟล์ที่จะดาวน์โหลด
+        document.body.appendChild(link);
+        link.click();
+
+        // ลบ URL ที่สร้างขึ้นหลังจากใช้งาน
+        URL.revokeObjectURL(url);
+      }
+    })
+    .catch((err) => {
+      messageError($q, err);
+    })
+    .finally(() => {
+      hideLoader();
+    });
+}
+
+export default genReportXLSX;

src/plugins/http.ts

@@ -0,0 +1,45 @@
+import Axios, { type AxiosRequestConfig, type AxiosResponse } from "axios";
+import keycloak from "./keycloak";
+
+const http = Axios.create({
+  timeout: 1000000000, // เพิ่มค่า timeout
+  headers: {
+    "X-Requested-With": "XMLHttpRequest",
+  },
+});
+
+http.interceptors.request.use(
+  async function (config: AxiosRequestConfig<any>) {
+    await keycloak.updateToken(1);
+    config.headers = config.headers ?? {};
+    const token = keycloak.token;
+    // const token = localStorage.getItem("access_token")
+    // const token =
+    //   "eyJhbGciOiJSUzI1NiIsInR5cCIgOiAiSldUIiwia2lkIiA6ICIxU2VKV2dVRFVlNXZwNS13Q1ZHaG9lT2l4bDJTTkdKemthLU5ZN211NXZJIn0.eyJleHAiOjE2NzI0MTI1NDksImlhdCI6MTY3MjM3NjU0OSwiYXV0aF90aW1lIjoxNjcyMzc2NTQ5LCJqdGkiOiI1MTVhY2IwNC1jODQ3LTQzM2YtYjUxOC03ODUzMzJhY2ZjNWYiLCJpc3MiOiJodHRwczovL2tleWNsb2FrLmZyYXBwZXQuc3lub2xvZ3kubWUvYXV0aC9yZWFsbXMvYm1hLWVociIsImF1ZCI6ImFjY291bnQiLCJzdWIiOiJlZmM5YjRlMC1mZGU2LTQ1NDQtYmU1OS1lMTA0MjEwMjUzZjAiLCJ0eXAiOiJCZWFyZXIiLCJhenAiOiJibWEtZWhyIiwibm9uY2UiOiI3NjMyMGI3ZS0xZTMxLTQ5ODYtYWIzOC1iOTUyYjFlODY3OGYiLCJzZXNzaW9uX3N0YXRlIjoiMDZlNTBkZjktNzAyNi00ZGIwLTkxMjgtMWY3Y2FiYTRkNDEyIiwiYWNyIjoiMSIsImFsbG93ZWQtb3JpZ2lucyI6WyJodHRwczovL2xvY2FsaG9zdDo3MDA2Il0sInJlYWxtX2FjY2VzcyI6eyJyb2xlcyI6WyJkZWZhdWx0LXJvbGVzLWJtYS1laHIiLCJvZmZsaW5lX2FjY2VzcyIsImFkbWluIiwidW1hX2F1dGhvcml6YXRpb24iXX0sInJlc291cmNlX2FjY2VzcyI6eyJhY2NvdW50Ijp7InJvbGVzIjpbIm1hbmFnZS1hY2NvdW50IiwibWFuYWdlLWFjY291bnQtbGlua3MiLCJ2aWV3LXByb2ZpbGUiXX19LCJzY29wZSI6Im9wZW5pZCBlbWFpbCBwcm9maWxlIiwic2lkIjoiMDZlNTBkZjktNzAyNi00ZGIwLTkxMjgtMWY3Y2FiYTRkNDEyIiwiZW1haWxfdmVyaWZpZWQiOnRydWUsInJvbGUiOlsiZGVmYXVsdC1yb2xlcy1ibWEtZWhyIiwib2ZmbGluZV9hY2Nlc3MiLCJhZG1pbiIsInVtYV9hdXRob3JpemF0aW9uIl0sIm5hbWUiOiJTeXN0ZW0gQWRtaW5pc3RyYXRvciIsInByZWZlcnJlZF91c2VybmFtZSI6ImFkbWluIiwiZ2l2ZW5fbmFtZSI6IlN5c3RlbSIsImZhbWlseV9uYW1lIjoiQWRtaW5pc3RyYXRvciIsImVtYWlsIjoiYWRtaW5AbG9jYWxob3N0In0.xmfJ3pzI-jLYsaiFXyjTW7gfAEpvUmMVsp9BsB1CfRCVOKiGBbuZhnQY8W-1SWVAx1NjJ55L-zMHPK6hk1dRPLbEse3DlIBZw04W9j8m-Wz3eqdHf_UCjmrXb8qAwkeq0Iaxq9mVfJJeQWeKhFBi-Ff8ek4hCXTYDICXS8ny_BaC5WkyrefHQ2xBqQjwRyoxsg4IoVMjXYNb8L9A-4BNlRfs928SqgFYCRlF5h6zw_rC0XoLrGTmqeacBdpey-r3j2g_lTqWy8mQg2T9s65IDqW3kFPOsr0SVO88sjlFbN9Et0L57RmiqORk_RwzbWg-_Yb6dOuolXsnjBOhOoTzkA";
+    if (token) config.headers.Authorization = `Bearer ${token}`;
+    return config;
+  },
+  function (error: any) {
+    return Promise.reject(error);
+  }
+);
+
+http.interceptors.response.use(
+  function (response: AxiosResponse<any, any>) {
+    return response;
+  },
+  function (error: any) {
+    if (typeof error !== undefined) {
+      // eslint-disable-next-line no-prototype-builtins
+      if (error.hasOwnProperty("response")) {
+        if (error.response.status === 401 || error.response.status === 403) {
+          // Store.commit("SET_ERROR_MESSAGE", error.response.data.message);
+          // Store.commit("REMOVE_ACCESS_TOKEN")
+        }
+      }
+    }
+    return Promise.reject(error);
+  }
+);
+
+export default http;

src/plugins/keycloak.ts

@@ -0,0 +1,17 @@
+/**
+ * front connect to keycloak
+ */
+import Keycloak from "keycloak-js";
+
+const initOptions = {
+  realm: import.meta.env.VITE_REALM_KEYCLOAK,
+  clientId: import.meta.env.VITE_CLIENTID_KEYCLOAK,
+  url: import.meta.env.VITE_URL_KEYCLOAK,
+}; //option keycloak ที่จะ connect
+
+const keycloak = Keycloak(initOptions);
+
+keycloak.onAuthSuccess = () => {}; //เพิ่มlogin สำเร็จจะมาทำฟังก์ชันนี้
+
+await keycloak.init({ onLoad: "check-sso", checkLoginIframe: false }); //ทำการ connect keycloak
+export default keycloak;