ข้อมูลบุคคล: ปรับสไตล์/validate/ใส่catch

src/modules/01_metadataNew/components/personal/DialogForm.vue

@@ -63,7 +63,7 @@ async function onSubmit() {
 
 <template>
   <q-dialog v-model="dialog" class="dialog" persistent>
-    <q-card style="min-width: 350px" class="bg-grey-11">
+    <q-card style="min-width: 350px">
       <form @submit.prevent="validateForm">
         <q-card-section class="flex justify-between" style="padding: 0">
           <dialog-header
@@ -74,37 +74,39 @@ async function onSubmit() {
 
         <q-separator color="grey-4" />
         <q-card-section class="q-pa-none">
-          <q-input
-            ref="dataRef"
-            outlined
-            v-model="data"
-            :label="personalName"
-            dense
-            lazy-rules
-            borderless
-            class="col-12 bg-white q-ma-md"
-            :rules="[(val) => val.length > 0 || 'กรุณากรอก' + personalName]"
-            hide-bottom-space
-          />
+          <div class="col-12 q-ma-md">
+            <q-input
+              ref="dataRef"
+              outlined
+              v-model="data"
+              :label="personalName"
+              dense
+              lazy-rules
+              borderless
+              :rules="[(val) => val.length > 0 || 'กรุณากรอก' + personalName]"
+              hide-bottom-space
+            />
+          </div>
         </q-card-section>
         <q-card-section
           class="q-pa-none"
           v-if="personalName === 'ระดับการศึกษา'"
         >
-          <q-input
-            ref="educationRankRef"
-            outlined
-            v-model="educationRank"
-            label="ลำดับ"
-            dense
-            type="number"
-            lazy-rules
-            borderless
-            min="1"
-            class="col-12 bg-white q-ma-md"
-            :rules="[(val) => val != undefined || 'กรุณากรอกลำดับ']"
-            hide-bottom-space
-          />
+          <div class="col-12 q-ma-md">
+            <q-input
+              ref="educationRankRef"
+              outlined
+              v-model="educationRank"
+              label="ลำดับ"
+              dense
+              type="number"
+              lazy-rules
+              borderless
+              min="1"
+              :rules="[(val) => val != undefined || 'กรุณากรอกลำดับ']"
+              hide-bottom-space
+            />
+          </div>
         </q-card-section>
 
         <q-card-actions align="right">
@@ -115,7 +117,6 @@ async function onSubmit() {
             unelevated
             label="บันทึก"
             color="public"
-            class="q-px-md"
           >
             <q-tooltip>บันทึกข้อมูล</q-tooltip>
           </q-btn>