From 19d68a92a7fe55b44097526fe2614bbb948758fe Mon Sep 17 00:00:00 2001
From: Net <93821485+somnetsak123@users.noreply.github.com>
Date: Fri, 16 Feb 2024 16:21:18 +0700
Subject: [PATCH] =?UTF-8?q?=E0=B9=80=E0=B8=9E=E0=B8=B4=E0=B9=88=E0=B8=A1?=
 =?UTF-8?q?=E0=B8=81=E0=B8=B2=E0=B8=A3=E0=B9=81=E0=B8=AA=E0=B8=94=E0=B8=87?=
 =?UTF-8?q?=20=E0=B8=A7=E0=B8=B1=E0=B8=99=E0=B8=97=E0=B8=B5=E0=B9=88?=
 =?UTF-8?q?=E0=B8=AA=E0=B8=A3=E0=B9=89=E0=B8=B2=E0=B8=87?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/category/TableCategory.vue     | 100 ++++++++++--------
 1 file changed, 53 insertions(+), 47 deletions(-)

diff --git a/src/modules/00_support/components/category/TableCategory.vue b/src/modules/00_support/components/category/TableCategory.vue
index 82d3b25ba..7ce4a9efb 100644
--- a/src/modules/00_support/components/category/TableCategory.vue
+++ b/src/modules/00_support/components/category/TableCategory.vue
@@ -4,13 +4,17 @@ import DialogCategory from "@/modules/00_support/components/category/DialogCateg
 import { onMounted, ref } from "vue";
 import { useRouter } from "vue-router";
 import type { QTableProps } from "quasar";
+import { useQuasar } from "quasar";
 const router = useRouter();
 const store = useSupportStore();
 const open = ref<boolean>(false);
 const currentName = ref<string>("");
 const status = ref<"add" | "edit" | "delete">("add");
 const categoryId = ref<string>("");
+import { useCounterMixin } from "@/stores/mixin";
+const { dialogRemove, convertDateDisplay, date2Thai } = useCounterMixin();
 
+const $q = useQuasar();
 const columnsCategory = [
   {
     name: "name",
@@ -21,6 +25,16 @@ const columnsCategory = [
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
   },
+
+  {
+    name: "createdAt",
+    align: "left",
+    label: "วันที่สร้าง",
+    field: "createdAt",
+    sortable: true,
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px",
+  },
   {
     name: "actions",
     align: "right",
@@ -43,7 +57,7 @@ onMounted(async () => {
       round
       class="bg-teal-1 full-height q-mr-sm"
       color="primary"
-      icon="mdi-chevron-left"
+      icon="mdi-arrow-left"
       dense
       @click="router.go(-1)"
     >
@@ -60,9 +74,9 @@ onMounted(async () => {
       color="primary"
       @click="
         () => {
-          currentName = '';
           open = true;
           status = 'add';
+          currentName = '';
         }
       "
       icon="mdi-plus"
@@ -80,58 +94,50 @@ onMounted(async () => {
         dense
         class="border_custom"
       >
+        <template v-slot:body-cell-createdAt="data">
+          <q-td>
+            {{ date2Thai(data.row.createdAt) }}
+          </q-td>
+        </template>
+
         <template v-slot:body-cell-actions="data">
           <q-td>
             <div class="align-right">
               <q-btn
-                color="grey"
                 flat
                 dense
-                round
-                size="14px"
-                icon="more_vert"
-                @click.stop
+                id="listViewFolderEdit"
+                icon="edit"
+                color="edit"
+                @click="
+                  () => {
+                    open = true;
+                    status = 'edit';
+                    categoryId = data.row.id;
+                    currentName = data.row.name;
+                  }
+                "
               >
-                <q-menu>
-                  <q-list dense>
-                    <q-item
-                      v-close-popup
-                      clickable
-                      @click.stop="
-                        () => {
-                          open = true;
-                          status = 'edit';
-                          categoryId = data.row.id;
-                          currentName = data.row.name;
-                        }
-                      "
-                    >
-                      <q-item-section>
-                        <div class="row items-center white">
-                          <q-icon name="edit" color="positive" />
-                          <span class="q-ml-sm">แก้ไข</span>
-                        </div>
-                      </q-item-section>
-                    </q-item>
-                    <q-item clickable>
-                      <q-item-section
-                        @click="
-                          () => {
-                            open = true;
-                            status = 'delete';
-                            categoryId = data.row.id;
-                          }
-                        "
-                        v-close-popup
-                      >
-                        <div class="row items-center white">
-                          <q-icon name="mdi-delete" color="red" />
-                          <span class="q-ml-sm">ลบ</span>
-                        </div>
-                      </q-item-section>
-                    </q-item>
-                  </q-list>
-                </q-menu>
+                <q-tooltip>แก้ไขข้อมูล</q-tooltip>
+              </q-btn>
+
+              <q-btn
+                class="q-ma-sm"
+                flat
+                dense
+                id="listViewFolderDelete"
+                color="red"
+                icon="mdi-delete"
+                :data-testid="data.row.name"
+                @click="
+                  () => {
+                    dialogRemove($q, () => {
+                      store.deleteCategory(data.row.id);
+                    });
+                  }
+                "
+              >
+                <q-tooltip>ลบข้อมูล</q-tooltip>
               </q-btn>
             </div>
           </q-td>