แก้ ไอคอน ใน payment / status แก้เป็น text

เปลี่ยนไอคอน เเก้ไขชื่อให้เหมือนกันไฟล์ payment สลับกันอยู่ email -- type เงื่อนไขใน input ทำท้ายสุด
ตัดตังแต่เวลาสอบออก
สเตตัส มุมขวา เป็น text ธรรมดา เปลี่ยนแค่สี

src/modules/01_exam/components/ExamFinished.vue

@@ -41,26 +41,26 @@
             <div class="">เลขประจำตัวประชาชน :</div>
             <div class="text-black q-pl-sm">{{ citizenId }}</div>
           </div>
-          <div class="q-pt-xs row">
+          <!-- <div class="q-pt-xs row">
             <div class="">เวลาสอบ :</div>
             <div class="text-black q-pl-sm">{{ examTime }}</div>
-          </div>
+          </div> -->
           <div class="q-pt-xs row">
             <div class="">สถานที่สอบ :</div>
             <div class="text-black q-pl-sm">{{ examLocation }}</div>
           </div>
           <div class="q-pt-xs row">
-            <div class="">ชั้นที่ :</div>
+            <div class="">คะแนน</div>
             <div class="text-black q-pl-sm">{{ floor }}</div>
           </div>
-          <div class="q-pt-xs row">
+          <!-- <div class="q-pt-xs row">
             <div class="">ห้องสอบ :</div>
             <div class="text-black q-pl-sm">{{ examRoom }}</div>
           </div>
           <div class="q-pt-xs row">
             <div class="">เลขที่นั่ง :</div>
             <div class="text-black q-pl-sm">{{ seatNumber }}</div>
-          </div>
+          </div> -->
         </div>
 
         <q-card-section class="col-4 flex flex-center">

src/modules/01_exam/components/ExamPayment.vue

@@ -6,11 +6,11 @@
         <q-list bordered class="col-12 rounded-borders" v-if="bank.length > 0">
           <q-item tag="label" v-ripple class="q-pa-md">
             <q-item-section avatar>
-              <q-icon name="mdi-cellphone-settings" color="positive" size="30px" />
+              <q-icon name="mdi-cash" color="positive" size="30px" />
             </q-item-section>
             <q-item-section>
               <q-item-label class="text-weight-medium text-subtitle1"
-                >โอนเงินผ่านมือถือ</q-item-label
+                >ชำระเงินค่าสมัครสอบผ่านสำนัก/หน่วยงาน</q-item-label
               >
               <q-item-label caption class="gt-xs"
                 >อนุมัติหลังแจ้งการโอนภายใน 24 ชั่วโมง</q-item-label
@@ -119,12 +119,15 @@
 
         <q-list bordered class="col-12 rounded-borders" v-else>
           <q-item tag="label" v-ripple class="q-pa-md">
-            <q-item-section avatar>
+            <!-- <q-item-section avatar>
               <q-icon name="mdi-cash" color="positive" size="30px" />
-            </q-item-section>
+            </q-item-section> -->
+            <q-avatar size="32px">
+              <q-img src="@/assets/krungthai.png" class="col-12" />
+            </q-avatar>
             <q-item-section>
               <q-item-label class="text-weight-medium text-subtitle1"
-                >โอนเงินผ่านทางเครื่อง ATM / เคาน์เตอร์ธนาคาร</q-item-label
+                >ชำระเงินค่าสมัครสอบผ่านธนาคารกรุงไทย</q-item-label
               >
               <q-item-label caption class="gt-xs"
                 >อนุมัติหลังแจ้งการโอนภายใน 24 ชั่วโมง</q-item-label

src/modules/01_exam/components/Form/Occupation.vue

@@ -215,7 +215,12 @@
           :readonly="!(status == 'register' || status == 'rejectRegister')"
           :borderless="!(status == 'register' || status == 'rejectRegister')"
           v-model="defaultOccupation.email"
-          :rules="[(val) => !!val || `${'กรุณากรอก E-mail address'}`]"
+          :rules="[
+            (val) => !!val || 'กรุณากรอก E-mail address',
+            (val) =>
+              /^([a-zA-Z0-9._%-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,})$/.test(val) ||
+              'E-mail address ไม่ถูกต้อง'
+          ]"
           :label="`${'E-mail address'}`"
         />
       </div>

src/views/MainLayout.vue

@@ -77,6 +77,33 @@ const fetchStatus = async () => {
     })
 }
 
+const getFontColor = (val: string) => {
+  switch (val) {
+    case 'register':
+      return 'text-blue'
+    case 'checkRegister':
+      return 'text-orange'
+    case 'payment':
+      return 'text-blue'
+    case 'rejectRegister':
+      return 'text-red-12'
+    case 'checkPayment':
+      return 'text-orange'
+    case 'rejectPayment':
+      return 'text-red-12'
+    case 'checkSeat':
+      return 'text-blue'
+    case 'checkPoint':
+      return 'text-blue'
+    case 'done':
+      return 'text-green'
+    case 'waiver':
+      return 'text-orange'
+    default:
+      return '-'
+  }
+}
+
 /**
  * ดิงชื่อผู้ใช้งานจาก keycloak
  */
@@ -106,9 +133,12 @@ const fetchStatus = async () => {
           </div>
         </q-toolbar-title>
         <q-space />
-        <q-badge flat color="blue" class="q-mr-md text-bold">
+        <!-- <q-badge flat color="blue" class="q-mr-md text-bold">
           {{ statusCandidate(status) }}
-        </q-badge>
+        </q-badge> -->
+        <div class="q-mr-md text-bold" :class="getFontColor(status)">
+          {{ statusCandidate(status) }}&nbsp;&nbsp;
+        </div>
         <q-btn
           v-if="$q.screen.gt.xs"
           class="bg-amber-1 text-amber-9"