pinia prefix

src/plugins/FullLoader.vue

@@ -1,24 +0,0 @@
-<!-- แสดง ui การโหลด -->
-<template>
-  <q-inner-loading :showing="loaderVisibility" class="loader">
-    <q-spinner-cube size="80px" color="primary" />
-  </q-inner-loading>
-</template>
-
-<script setup lang="ts">
-import { watch, ref } from "vue";
-const props = defineProps({
-  visibility: Boolean,
-});
-
-const loaderVisibility = ref<boolean>(props.visibility);
-
-watch(props, (count, prevCount) => {
-  loaderVisibility.value = props.visibility;
-});
-</script>
-
-<style lang="sass">
-.loader
-    z-index: 1000
-</style>

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;