แก้ในสมัครสอบคัดเลือกลบรายละเอียดบัตรประชาชน

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

@@ -56,12 +56,12 @@
       </div>
       <div class="col-xs-12 col-sm-3 col-md-3">
         <q-input
-          :class="getClass(status == 'register' || status == 'rejectRegister')"
-          :outlined="status == 'register' || status == 'rejectRegister'"
+          :class="getClass(false)"
+          :outlined="false"
           dense
           lazy-rules
-          :readonly="!(status == 'register' || status == 'rejectRegister')"
-          :borderless="!(status == 'register' || status == 'rejectRegister')"
+          :readonly="!false"
+          :borderless="!false"
           v-model="defaultInformation.nationality"
           :rules="[(val) => !!val || `${'กรุณากรอก สัญชาติ'}`]"
           :label="`${'สัญชาติ'}`"
@@ -136,17 +136,17 @@
           :class="getClass(status == 'register' || status == 'rejectRegister')"
           :readonly="!(status == 'register' || status == 'rejectRegister')"
           :borderless="!(status == 'register' || status == 'rejectRegister')"
-          :rules="[(val) => !!val || `${'กรุณาเลือก สถานภาพ'}`]"
+          :rules="[(val) => !!val || `${'กรุณาเลือก ศาสนา'}`]"
           :outlined="status == 'register' || status == 'rejectRegister'"
           dense
           lazy-rules
-          v-model="defaultInformation.relationshipId"
+          v-model="defaultInformation.religionId"
           emit-value
           map-options
           option-label="name"
-          :options="relationshipOptions"
+          :options="religionOptions"
           option-value="id"
-          :label="`${'สถานภาพ'}`"
+          :label="`${'ศาสนา'}`"
         />
       </div>
       <div class="col-xs-12 col-sm-3 col-md-3">
@@ -163,99 +163,12 @@
           v-model="defaultInformation.cardid"
           maxlength="13"
           :rules="[
-            (val) => !!val || `${'กรุณากรอก เลขบัตรประจำตัวประชาชน'}`,
-            (val) => /^[0-9]*$/.test(val) || `${'กรุณากรอกเลขบัตรประจำตัวประชาชนให้ถูกต้อง'}`
+            (val) => val.length == 13 || `${'กรุณากรอก เลขประจำตัวประชาชน'}`,
+            (val) => /^[0-9]*$/.test(val) || `${'กรุณากรอกเลขประจำตัวประชาชนให้ถูกต้อง'}`
           ]"
           label="เลขบัตรประจำตัวประชาชน"
         />
       </div>
-      <div class="col-xs-12 col-sm-3 col-md-3">
-        <q-select
-          :class="getClass(status == 'register' || status == 'rejectRegister')"
-          :readonly="!(status == 'register' || status == 'rejectRegister')"
-          :borderless="!(status == 'register' || status == 'rejectRegister')"
-          :rules="[(val) => !!val || `${'กรุณาเลือก จังหวัด'}`]"
-          :outlined="status == 'register' || status == 'rejectRegister'"
-          dense
-          lazy-rules
-          v-model="defaultInformation.provinceId"
-          emit-value
-          map-options
-          option-label="name"
-          :options="provinceOptions"
-          option-value="id"
-          :label="`${'ออกให้ ณ จังหวัด'}`"
-          @update:model-value="(value) => selectProvince(value)"
-        />
-      </div>
-      <div class="col-xs-12 col-sm-3 col-md-3">
-        <q-select
-          :class="getClass(status == 'register' || status == 'rejectRegister')"
-          :readonly="!(status == 'register' || status == 'rejectRegister')"
-          :borderless="!(status == 'register' || status == 'rejectRegister')"
-          :rules="[(val) => !!val || `${'กรุณากรอกอำเภอ'}`]"
-          :outlined="status == 'register' || status == 'rejectRegister'"
-          dense
-          lazy-rules
-          v-model="defaultInformation.districtId"
-          emit-value
-          map-options
-          option-label="name"
-          :options="districtOptions"
-          option-value="id"
-          :label="`${'ออกให้ ณ อำเภอ'}`"
-        />
-      </div>
-
-      <div class="col-xs-12 col-sm-3 col-md-3">
-        <datepicker
-          menu-class-name="modalfix"
-          v-model="defaultInformation.cardIdDate"
-          :locale="'th'"
-          autoApply
-          :enableTimePicker="false"
-          week-start="0"
-          :max-date="new Date()"
-          :disabled="!(status == 'register' || status == 'rejectRegister')"
-        >
-          <template #year="{ year }">
-            {{ year + 543 }}
-          </template>
-          <template #year-overlay-value="{ value }">
-            {{ parseInt(value + 543) }}
-          </template>
-          <template #trigger>
-            <q-input
-              :class="getClass(status == 'register' || status == 'rejectRegister')"
-              :outlined="status == 'register' || status == 'rejectRegister'"
-              dense
-              lazy-rules
-              :readonly="!(status == 'register' || status == 'rejectRegister')"
-              :borderless="!(status == 'register' || status == 'rejectRegister')"
-              :model-value="
-                defaultInformation.cardIdDate == null
-                  ? null
-                  : date2Thai(defaultInformation.cardIdDate)
-              "
-              :rules="[(val) => !!val || `${'กรุณาเลือก วัน/เดือน/ปี ที่ออกบัตร'}`]"
-              :label="`${'วัน/เดือน/ปี ที่ออกบัตร'}`"
-            >
-              <template v-slot:prepend>
-                <q-icon
-                  name="mdi-calendar-outline"
-                  class="cursor-pointer"
-                  :style="
-                    status == 'register' || status == 'rejectRegister'
-                      ? 'color: var(--q-primary)'
-                      : 'color: var(--q-grey)'
-                  "
-                >
-                </q-icon>
-              </template>
-            </q-input>
-          </template>
-        </datepicker>
-      </div>
       <div class="col-xs-12 col-sm-3 col-md-3">
         <q-input
           :outlined="status == 'register' || status == 'rejectRegister'"
@@ -270,10 +183,12 @@
           :borderless="!(status == 'register' || status == 'rejectRegister')"
           v-model="defaultInformation.tel"
           :label="`${'โทรศัพท์'}`"
-        />
-        <!-- :rules="[
+          :rules="[
+            (val) => val.length == 10 || `${'กรุณากรอก โทรศัพท์'}`,
             (val) => /^[0-9]*$/.test(val) || `${'กรุณากรอกข้อมูลโทรศัพท์ให้ถูกต้อง'}`
-          ]" -->
+          ]"
+        />
+        <!--  -->
       </div>
       <div class="col-xs-12 col-sm-3 col-md-3">
         <q-input
@@ -289,7 +204,7 @@
           :borderless="!(status == 'register' || status == 'rejectRegister')"
           v-model="defaultInformation.phone"
           :rules="[
-            (val) => !!val || `${'กรุณากรอก โทรศัพท์มือถือ'}`,
+            (val) => val.length == 10 || `${'กรุณากรอก โทรศัพท์มือถือ'}`,
             (val) => /^[0-9]*$/.test(val) || `${'กรุณากรอกข้อมูลโทรศัพท์มือถือให้ถูกต้อง'}`
           ]"
           :label="`${'โทรศัพท์มือถือ'}`"
@@ -333,7 +248,7 @@
         <input id="file-upload" type="file" accept="image/*" @change="uploadImage" />
       </div>
     </div>
-    <div class="col-xs-12 col-sm-9 col-md-12">
+    <!-- <div class="col-xs-12 col-sm-9 col-md-12">
       <q-input
         :class="getClass(status == 'register' || status == 'rejectRegister')"
         :outlined="status == 'register' || status == 'rejectRegister'"
@@ -345,7 +260,7 @@
         label="ความรู้ความสามารถพิเศษ"
         type="textarea"
       />
-    </div>
+    </div> -->
   </q-form>
 </template>
 <script setup lang="ts">
@@ -367,7 +282,7 @@ const props = defineProps({
     type: Array as PropType<DataOption[]>,
     required: true
   },
-  relationshipOptions: {
+  religionOptions: {
     type: Array as PropType<DataOption[]>,
     required: true
   },
@@ -431,7 +346,7 @@ const fetchData = async () => {
         data.citizenDate == null ? null : new Date(data.citizenDate)
       defaultInformation.value.cardid = data.citizenId
       defaultInformation.value.firstname = data.firstName
-      defaultInformation.value.relationshipId = data.relationshipId
+      defaultInformation.value.religionId = data.religionId
       defaultInformation.value.nationality = data.nationality
       defaultInformation.value.email = data.email
       defaultInformation.value.phone = data.mobilePhone