ปรับ วินัย

src/modules/11_discipline/components/7_ListSuspend/DialogSendToCommand.vue

@@ -2,8 +2,6 @@
 import { ref, computed, watch } from "vue";
 import { useQuasar } from "quasar";
 
-import http from "@/plugins/http";
-import config from "@/app.config";
 import { useCounterMixin } from "@/stores/mixin";
 import { useCommandMainStore } from "@/modules/18_command/store/Main";
 
@@ -18,12 +16,13 @@ import DialogCreateCommand from "@/modules/18_command/components/DialogCreateCom
 const $q = useQuasar();
 const storeCommand = useCommandMainStore();
 const mixin = useCounterMixin();
-const { dialogConfirm } = mixin;
+const { dialogConfirm, onSearchDataTable } = mixin;
 
 const modal = defineModel<boolean>("modal", { required: true });
 const modalCommand = ref<boolean>(false); // ตัวแปร popup สร้างคำสั่ง
 
 const rows = ref<dataType[]>([]);
+const rowsMain = ref<dataType[]>([]);
 const selected = ref<dataType[]>([]);
 const dataMapToSend = computed(() => {
   return selected.value.map((i: any) => ({
@@ -128,7 +127,6 @@ function closeModal() {
  */
 function filterSelector(val: string, update: Function) {
   update(() => {
-    commandType.value = val ? "" : commandType.value;
     commandOp.value = listCommand.value.filter(
       (v: any) => v.name.indexOf(val) > -1
     );
@@ -148,6 +146,14 @@ function saveOrder() {
   );
 }
 
+function serchDataTable() {
+  rows.value = onSearchDataTable(
+    filterKeyword.value,
+    rowsMain.value,
+    columns.value ? columns.value : []
+  );
+}
+
 /**
  * เมื่อ props.modal เป็น true
  * กำหนดให้  selected เป็นค่าว่างและกำหนด filter ประเภทตำแหน่งตามประเภทการสอบ
@@ -157,6 +163,7 @@ watch(
   async () => {
     if (modal.value === true) {
       rows.value = props.rows ? props.rows : [];
+      rowsMain.value = props.rows ? props.rows : [];
       selected.value = [];
       const data = await storeCommand.getCommandTypes();
       listCommand.value = data.filter(
@@ -189,7 +196,7 @@ watch(
             use-input
             style="width: 350px; max-width: auto"
             @update:model-value="selected = []"
-            @filter="(inputValue:any,
+            @filter="(inputValue:string,
                     doneFn:Function) => filterSelector(inputValue, doneFn
                     ) "
           >
@@ -205,10 +212,10 @@ watch(
             borderless
             outlined
             dense
-            debounce="300"
             v-model="filterKeyword"
             placeholder="ค้นหา"
             style="width: 200px; max-width: auto"
+            @keydown.enter.pervent="serchDataTable"
           >
             <template v-slot:append>
               <q-icon name="search" />
@@ -234,7 +241,6 @@ watch(
         <d-table
           :columns="columns"
           :rows="rows"
-          :filter="filterKeyword.trim()"
           row-key="id"
           :visible-columns="visibleColumns"
           selection="multiple"

src/modules/11_discipline/components/7_ListSuspend/ListsPage.vue

@@ -175,13 +175,13 @@ async function getList() {
       );
       total.value = res.data.result.total;
       await dataStore.getData(data);
-      hideLoader();
     })
     .catch((e) => {
       messageError($q, e);
-      hideLoader();
     })
-    .finally(() => {});
+    .finally(() => {
+      hideLoader();
+    });
 }
 
 function filterFn() {
@@ -221,23 +221,24 @@ onMounted(async () => {
     <q-separator />
     <div class="row q-pa-md">
       <div class="col-12">
-        <div class="row col-12">
-          <q-btn
-            v-if="checkPermission($route)?.attrIsUpdate"
-            @click="openModalOrder"
-            flat
-            round
-            dense
-            color="primary"
-            icon="mdi-account-arrow-right"
-          >
-            <q-tooltip>ส่งไปออกคำสั่ง</q-tooltip>
-          </q-btn>
+        <div class="row col-12 q-col-gutter-sm">
+          <div>
+            <q-btn
+              v-if="checkPermission($route)?.attrIsUpdate"
+              @click="openModalOrder"
+              flat
+              round
+              dense
+              color="primary"
+              icon="mdi-account-arrow-right"
+            >
+              <q-tooltip>ส่งไปออกคำสั่ง</q-tooltip>
+            </q-btn>
+          </div>
           <q-space />
 
           <q-input
             for="#search"
-            class="col-xs-12 col-sm-3 col-md-2"
             standout
             dense
             v-model="filterKeyword"
@@ -263,7 +264,6 @@ onMounted(async () => {
             :options="columns"
             option-value="name"
             style="min-width: 140px"
-            class="col-xs-12 col-sm-3 col-md-2 q-ml-sm"
           />
         </div>