From 9e44592a1e67ae8d6650c900ff211ac0b07792dc Mon Sep 17 00:00:00 2001
From: Net <thanaphon@frappet.com>
Date: Tue, 16 Jul 2024 14:59:14 +0700
Subject: [PATCH] =?UTF-8?q?=E0=B9=81=E0=B8=AA=E0=B8=94=E0=B8=87=20?=
 =?UTF-8?q?=E0=B8=82=E0=B8=99=E0=B8=B2=E0=B8=94=E0=B8=82=E0=B8=AD=E0=B8=87?=
 =?UTF-8?q?=E0=B9=84=E0=B8=9F=E0=B8=A5=E0=B9=8C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/cardBackupRestore.vue          | 41 +++++++++++++++++--
 .../04_system/interface/response/Main.ts      |  2 +
 2 files changed, 40 insertions(+), 3 deletions(-)

diff --git a/src/modules/04_system/components/cardBackupRestore.vue b/src/modules/04_system/components/cardBackupRestore.vue
index c53a9d07..bda1b0a9 100644
--- a/src/modules/04_system/components/cardBackupRestore.vue
+++ b/src/modules/04_system/components/cardBackupRestore.vue
@@ -28,6 +28,7 @@ const {
   deleteBackUp,
   backupRunningList,
   restoreRunningList,
+  getSize,
 } = useDataStore();
 const storeData = useDataStore();
 const { dataBackUp, backupRunTotal, restoreRunTotal } = storeToRefs(storeData);
@@ -41,7 +42,13 @@ const tab = defineModel<string>("tab", { required: true });
  * Table
  */
 const filter = ref<string>("");
-const visibleColumns = ref<string[]>(["name", "createAt", "status"]);
+const visibleColumns = ref<string[]>([
+  "name",
+  "createAt",
+  "databaseSize",
+  "storageSize",
+  "status",
+]);
 const baseColumns = ref<QTableProps["columns"]>([
   {
     name: "name",
@@ -63,6 +70,26 @@ const baseColumns = ref<QTableProps["columns"]>([
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
   },
+  {
+    name: "databaseSize",
+    align: "center",
+    label: "ขนาดของฐานข้อมูล ",
+    sortable: true,
+    // field: (v) => date2Thai(v, false, true),
+    field: "databaseSize",
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px",
+  },
+  {
+    name: "storageSize",
+    align: "center",
+    label: "ขนาดของไฟล์ ",
+    sortable: true,
+    // field: (v) => date2Thai(v, false, true),
+    field: "storageSize",
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px",
+  },
   {
     name: "status",
     align: "center",
@@ -188,8 +215,16 @@ onMounted(async () => {
       <template v-slot:body="props">
         <q-tr :props="props">
           <q-td v-for="(col, i) in props.cols" :key="col.name" :props="props">
-            <div :class="{ 'text-center': i === 2 }">
-              {{ i !== 2 ? col.value : col.value === "สำเร็จ" ? "สำเร็จ" : "" }}
+            <div :class="{ 'text-center': i === 4 }">
+              {{
+                i !== 4 && i !== 2 && i !== 3
+                  ? col.value
+                  : col.value === "สำเร็จ"
+                  ? "สำเร็จ"
+                  : i === 2 || i === 3
+                  ? getSize(col.value)
+                  : ""
+              }}
 
               <q-circular-progress
                 v-if="props.row.status === 'running' && col.name === 'status'"
diff --git a/src/modules/04_system/interface/response/Main.ts b/src/modules/04_system/interface/response/Main.ts
index 6d7dde1d..b34204ef 100644
--- a/src/modules/04_system/interface/response/Main.ts
+++ b/src/modules/04_system/interface/response/Main.ts
@@ -2,6 +2,8 @@ interface DataBackup {
   id: string;
   name: string;
   timestamp: Date;
+  databaseSize: number;
+  storageSize: number;
   status: string;
 }