refactor: select input & filter

src/i18n/en-US/index.ts

@@ -65,6 +65,7 @@ export default {
   showing: 'Showing',
   dataSum: 'Data Summaries',
   createdAt: 'Created At',
+  noResults: 'No results',
   ...status,
   ...main,
   ...address,

src/i18n/th-th/index.ts

@@ -64,6 +64,7 @@ export default {
   showing: 'แสดงทีละ',
   dataSum: 'สรุปจำนวนข้อมูล',
   createdAt: 'สร้างเมื่อ',
+  noResults: 'ไม่มีผลลัพธ์',
   ...status,
   ...main,
   ...address,

src/stores/utils/index.ts

@@ -2,7 +2,7 @@ import { Dialog, QSelect } from 'quasar';
 import GlobalDialog from 'components/GlobalDialog.vue';
 import { ComposerTranslation, useI18n } from 'vue-i18n';
 import { defineStore } from 'pinia';
-import { ref } from 'vue';
+import { Ref, ref } from 'vue';
 
 export function dialog(opts: {
   title: string;
@@ -74,6 +74,42 @@ export function formatNumberDecimal(num: number, point: number): string {
   });
 }
 
+export function selectFilterOptionRefMod(
+  source: Ref<Record<string, unknown>[]>,
+  destination: Ref<Record<string, unknown>[]>,
+  filterField?: string,
+) {
+  destination.value = source.value;
+
+  const filter = ((value, update) => {
+    if (value === '') update(() => (destination.value = source.value));
+    else
+      update(
+        () => {
+          destination.value = source.value.filter((v) => {
+            const label = v[filterField || 'label'];
+
+            if (typeof label !== 'string') {
+              throw new Error('Label must be of type string.');
+            }
+
+            return (
+              label.toLocaleLowerCase().indexOf(value.toLocaleLowerCase()) > -1
+            );
+          });
+        },
+        (ref) => {
+          if (value !== '' && destination.value.length > 0) {
+            ref.setOptionIndex(-1);
+            ref.moveOptionSelection(1, true);
+          }
+        },
+      );
+  }) satisfies QSelect['onFilter'];
+
+  return filter;
+}
+
 export function selectOptionFilter(
   list: Record<string, unknown>[],
   filterField?: string,