From 8a6ab584cf36ba0ace946fc642323d37c7219ab0 Mon Sep 17 00:00:00 2001
From: AnandaTon <125332905+anandaAiemvong@users.noreply.github.com>
Date: Tue, 21 Mar 2023 11:08:27 +0700
Subject: [PATCH 1/3] =?UTF-8?q?=E0=B9=81=E0=B8=81=E0=B9=89=E0=B8=AA?=
 =?UTF-8?q?=E0=B8=B5=20tap=20=E0=B9=80=E0=B8=A1=E0=B8=B7=E0=B9=88=E0=B8=AD?=
 =?UTF-8?q?=E0=B8=81=E0=B8=94=E0=B8=AD=E0=B8=B1=E0=B8=9E=E0=B9=80=E0=B8=94?=
 =?UTF-8?q?=E0=B8=97=20status?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../01_exam/components/ExamPayment.vue        | 46 ++++++++++++-------
 1 file changed, 30 insertions(+), 16 deletions(-)

diff --git a/src/modules/01_exam/components/ExamPayment.vue b/src/modules/01_exam/components/ExamPayment.vue
index f9c6496..7cce5c5 100644
--- a/src/modules/01_exam/components/ExamPayment.vue
+++ b/src/modules/01_exam/components/ExamPayment.vue
@@ -1,16 +1,17 @@
 <template>
-  <q-card class="my-card q-mb-sm" bordered>
-    <q-card-actions class="q-pa-md text-left row" :class="getClass(status)">
-      <div class="text-black text-bold col-12" style="font-size: 16px">
-        {{ message(status) }}
-      </div>
-      <div class="text-black col-12" v-if="status === 'rejected'">
-        <li>{{ rejectMessage }}</li>
-      </div>
-      <!-- <q-space /> -->
-    </q-card-actions>
-  </q-card>
-
+  <div>
+    <q-card class="my-card q-mb-sm" bordered>
+      <q-card-actions class="q-pa-md text-left row justify-center" :class="getClass(status)">
+        <div class="text-bold col-12" :style="{ color: getFontColor(status) }">
+          {{ message(status) }}
+        </div>
+        <div class="col-12" v-if="status === 'rejected'" :style="{ color: getFontColor(status) }">
+          <li>{{ rejectMessage }}</li>
+        </div>
+        <!-- <q-space /> -->
+      </q-card-actions>
+    </q-card>
+  </div>
   <div class="d-flex justify-content-center align-items-center row col-12">
     <!-- <div class="text-center q-pb-lg">
       <q-badge
@@ -101,13 +102,13 @@ const setStatus = (val: string) => {
 const getClass = (val: string) => {
   switch (val) {
     case 'processing':
-      return 'bg-lime-12'
+      return 'bg-yellow-3'
     case 'rejected':
-      return 'bg-deep-orange-11'
+      return 'bg-red-2'
     case 'success':
-      return 'bg-green-12'
+      return 'bg-light-green-11'
     default:
-      return 'bg-blue-4'
+      return 'bg-light-blue-1'
   }
 }
 const message = (val: string) => {
@@ -122,6 +123,19 @@ const message = (val: string) => {
       return 'รออัปโหลดหลักฐานชำระเงิน'
   }
 }
+const getFontColor = (val: string) => {
+  switch (val) {
+    case 'processing':
+      return 'orange'
+    case 'rejected':
+      return 'red'
+    case 'success':
+      return 'green'
+    default:
+      return 'blue'
+  }
+}
+console.log(getFontColor)
 </script>
 
 <style lang="scss" scoped>

From c2658b45946b27127284c9326162caeb3f96a4f4 Mon Sep 17 00:00:00 2001
From: AnandaTon <125332905+anandaAiemvong@users.noreply.github.com>
Date: Tue, 21 Mar 2023 11:19:23 +0700
Subject: [PATCH 2/3] =?UTF-8?q?=E0=B8=A2=E0=B9=89=E0=B8=B2=E0=B8=A2?=
 =?UTF-8?q?=E0=B8=8A=E0=B8=B7=E0=B9=88=E0=B8=AD=E0=B9=80=E0=B8=AD=E0=B8=81?=
 =?UTF-8?q?=E0=B8=AA=E0=B8=B2=E0=B8=A3=E0=B8=81=E0=B8=B1=E0=B8=9A=E0=B9=84?=
 =?UTF-8?q?=E0=B8=9F=E0=B8=A5=E0=B9=8C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

ย้ายชื่อ เอกสารกับไฟล์ ไปข้างบนของอัปโหลด ลิส
---
 .../01_exam/components/Form/Document.vue      | 56 ++++++++-----------
 1 file changed, 24 insertions(+), 32 deletions(-)

diff --git a/src/modules/01_exam/components/Form/Document.vue b/src/modules/01_exam/components/Form/Document.vue
index dd15887..a981b99 100644
--- a/src/modules/01_exam/components/Form/Document.vue
+++ b/src/modules/01_exam/components/Form/Document.vue
@@ -10,39 +10,7 @@
       :cancel="cancelData"
     />
     <div class="row col-12 q-gutter-sm q-pt-sm">
-      <q-card bordered flat class="full-width">
-        <q-list separator>
-          <q-item v-for="file in files" :key="file.key" class="q-my-xs">
-            <q-item-section>
-              <q-item-label class="full-width ellipsis">
-                {{ file.name }}
-              </q-item-label>
-
-              <q-item-label caption> สถานะ: {{ file.status }} / {{ file.sizeLabel }} </q-item-label>
-            </q-item-section>
-            <q-item-section top side>
-              <div class="q-gutter-sm">
-                <q-btn size="12px" flat dense round color="blue" icon="mdi-download-outline">
-                  <q-tooltip>ดาวน์โหลด</q-tooltip>
-                </q-btn>
-                <q-btn
-                  size="12px"
-                  flat
-                  dense
-                  round
-                  color="red"
-                  icon="mdi-delete-outline"
-                  v-if="edit"
-                >
-                  <q-tooltip>ลบไฟล์</q-tooltip>
-                </q-btn>
-              </div>
-            </q-item-section>
-          </q-item>
-        </q-list>
-      </q-card>
       <div v-if="edit" class="col-12 q-ma-none">
-        <q-separator class="q-mt-sm" />
         <q-input
           class="q-my-sm"
           hide-bottom-space
@@ -68,6 +36,30 @@
         />
       </div>
     </div>
+    <q-separator class="q-mt-sm" />
+    <q-card bordered flat class="full-width">
+      <q-list separator>
+        <q-item v-for="file in files" :key="file.key" class="q-my-xs">
+          <q-item-section>
+            <q-item-label class="full-width ellipsis">
+              {{ file.name }}
+            </q-item-label>
+
+            <q-item-label caption> สถานะ: {{ file.status }} / {{ file.sizeLabel }} </q-item-label>
+          </q-item-section>
+          <q-item-section top side>
+            <div class="q-gutter-sm">
+              <q-btn size="12px" flat dense round color="blue" icon="mdi-download-outline">
+                <q-tooltip>ดาวน์โหลด</q-tooltip>
+              </q-btn>
+              <q-btn size="12px" flat dense round color="red" icon="mdi-delete-outline" v-if="edit">
+                <q-tooltip>ลบไฟล์</q-tooltip>
+              </q-btn>
+            </div>
+          </q-item-section>
+        </q-item>
+      </q-list>
+    </q-card>
   </q-card>
 </template>
 <script setup lang="ts">

From b19660a3bf6ca3ffbabd15dbc59c203b2ecf36b9 Mon Sep 17 00:00:00 2001
From: AnandaTon <125332905+anandaAiemvong@users.noreply.github.com>
Date: Tue, 21 Mar 2023 12:05:29 +0700
Subject: [PATCH 3/3] =?UTF-8?q?Update=20class=20=E0=B9=83=E0=B8=99=20payme?=
 =?UTF-8?q?nt?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Update class ใน payment กับ upload ให้ดักจับชื่อ files
---
 src/modules/01_exam/components/ExamPayment.vue   | 14 +++++++-------
 src/modules/01_exam/components/Form/Document.vue |  1 +
 2 files changed, 8 insertions(+), 7 deletions(-)

diff --git a/src/modules/01_exam/components/ExamPayment.vue b/src/modules/01_exam/components/ExamPayment.vue
index 7cce5c5..cd5971f 100644
--- a/src/modules/01_exam/components/ExamPayment.vue
+++ b/src/modules/01_exam/components/ExamPayment.vue
@@ -2,10 +2,10 @@
   <div>
     <q-card class="my-card q-mb-sm" bordered>
       <q-card-actions class="q-pa-md text-left row justify-center" :class="getClass(status)">
-        <div class="text-bold col-12" :style="{ color: getFontColor(status) }">
+        <div class="text-bold col-12" :class="getFontColor(status)">
           {{ message(status) }}
         </div>
-        <div class="col-12" v-if="status === 'rejected'" :style="{ color: getFontColor(status) }">
+        <div class="col-12" v-if="status === 'rejected'" :class="getFontColor(status)">
           <li>{{ rejectMessage }}</li>
         </div>
         <!-- <q-space /> -->
@@ -106,7 +106,7 @@ const getClass = (val: string) => {
     case 'rejected':
       return 'bg-red-2'
     case 'success':
-      return 'bg-light-green-11'
+      return 'bg-light-green-3'
     default:
       return 'bg-light-blue-1'
   }
@@ -126,13 +126,13 @@ const message = (val: string) => {
 const getFontColor = (val: string) => {
   switch (val) {
     case 'processing':
-      return 'orange'
+      return 'text-orange'
     case 'rejected':
-      return 'red'
+      return 'text-red-12'
     case 'success':
-      return 'green'
+      return 'text-green'
     default:
-      return 'blue'
+      return 'text-blue'
   }
 }
 console.log(getFontColor)
diff --git a/src/modules/01_exam/components/Form/Document.vue b/src/modules/01_exam/components/Form/Document.vue
index a981b99..ff429a7 100644
--- a/src/modules/01_exam/components/Form/Document.vue
+++ b/src/modules/01_exam/components/Form/Document.vue
@@ -116,6 +116,7 @@ onMounted(async () => {
 })
 
 const fileUpload = async (file: any) => {
+  name.value = file[0].name
   return {
     url: 'http://localhost:4444/upload',
     method: 'POST'