สมัครสอบตามตำแหน่ง

2023-04-06 03:05:54 +07:00 · 2023-04-06 03:05:54 +07:00 · cce5f7adfd
commit cce5f7adfd
parent 24b6365afe
6 changed files with 121 additions and 87 deletions
--- a/src/modules/01_exam/components/ExamForm.vue
+++ b/src/modules/01_exam/components/ExamForm.vue
@ -81,9 +81,10 @@ const formFamily = ref<any>({})
 const formOccupation = ref<any>({})

 onMounted(async () => {
-  if (props.status !== 'register') {
-    acceptTermOfUse.value = true
-  }
+  //   if (props.status !== 'register') {
+  //     acceptTermOfUse.value = true
+  //   }
+  await fetchStatus()
 })

 const okModalConfirm = () => {
@ -98,6 +99,20 @@ const okModalConfirm = () => {
    )
  }
 }
+const fetchStatus = async () => {
+  loader.value = true
+  await http
+    .get(config.API.candidateStatus(examId.value, positionId.value))
+    .then((res) => {
+      acceptTermOfUse.value = true
+    })
+    .catch(() => {
+      acceptTermOfUse.value = false
+    })
+    .finally(() => {
+      loader.value = false
+    })
+}

 const saveForm = async () => {
  //saveform
--- a/src/modules/01_exam/components/ExamPayment.vue
+++ b/src/modules/01_exam/components/ExamPayment.vue
@ -3,7 +3,7 @@
    <div class="row q-px-sm">
      <div class="text-bold text-subtitle1 q-pb-md">เลือกวีธีการชำระเงิน</div>
      <div class="row col-12 q-gutter-y-md q-mb-lg">
-        <q-list bordered class="col-12 rounded-borders">
+        <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" />
@ -16,35 +16,42 @@
                >อนุมัติหลังแจ้งการโอนภายใน 24 ชั่วโมง</q-item-label
              >
            </q-item-section>
-            <q-item-section avatar class="gt-xs">
+            <!-- <q-item-section avatar class="gt-xs">
              <q-avatar size="32px">
                <q-img src="@/assets/krungthai.png" class="col-12" />
              </q-avatar>
-            </q-item-section>
-            <q-item-section side>
+            </q-item-section> -->
+            <!-- <q-item-section side>
              <q-radio v-model="pay" val="teal" color="blue" />
-            </q-item-section>
+            </q-item-section> -->
          </q-item>
-          <q-separator v-show="pay == 'teal'" />
+          <q-separator />
          <q-slide-transition :duration="100" class="">
-            <div v-show="pay == 'teal'" class="q-pa-md bg-grey-1">
+            <div class="q-pa-md bg-grey-1">
              <div class="row q-col-gutter-sm">
                <div class="col-xs-12 col-sm-7">
                  <q-card bordered class="items-start q-pa-md row q-mb-sm" style="height: 300px">
                    <div class="row col-12">
-                      <div class="col-12 row no-wrap items-center">
-                        <q-avatar size="50px">
-                          <q-img src="@/assets/krungthai.png" />
-                        </q-avatar>
-                        <div class="column q-pl-md">
-                          <strong>ธนาคารกรุงไทย</strong>
-                          สำนักงานทรัพยากรบุคคล
-                          <div>387-3-94793-0</div>
+                      <div class="col-12" v-for="item in bank" :key="item.id">
+                        <div class="row q-pl-md col-12">
+                          <div class="q-pb-xs col-4">
+                            <span class="text-weight-medium">ธนาคาร :</span>
+                            <span class="text-blue q-pl-xs">{{ item.bankName }}</span>
+                          </div>
+                          <div class="q-pb-xs col-4">
+                            <span class="text-weight-medium">ชื่อบัญชี :</span>
+                            <span class="text-blue q-pl-xs">{{ item.accountName }}</span>
+                          </div>
+                          <div class="q-pb-xs col-4">
+                            <span class="text-weight-medium">เลขบัญชี :</span>
+                            <span class="text-blue q-pl-xs"> {{ item.accountNumber }}</span>
+                          </div>
                        </div>
+                        <q-separator class="q-my-md" />
                      </div>
                      <div class="col-12">
-                        <q-separator class="q-my-md" />
-                        <div class="q-pb-sm">
+                        <!-- <q-separator class="q-my-md" /> -->
+                        <!-- <div class="q-pb-sm">
                          <span class="text-weight-medium">ชื่อบัญชี :</span>
                          <span class="text-blue q-pl-sm">สำนักงานทรัพยากรบุคคล</span>
                        </div>
@ -55,7 +62,7 @@
                        <div class="q-pb-sm">
                          <span class="text-weight-medium">รหัสใบสั่งซื้อ :</span>
                          <span class="text-blue q-pl-sm">12837495985900</span>
-                        </div>
+                        </div> -->
                        <div>
                          <span class="text-weight-medium">ยอดสุทธิ (บาท) :</span>
                          <span class="text-blue q-pl-sm text-bold">200.00</span>
@ -79,14 +86,18 @@
                      <div class="absolute-bottom text-center">หลักฐานชำระเงิน</div>
                    </q-img>
                  </label>
-                  <input id="file-upload" type="file" />
+                  <input
+                    id="file-upload"
+                    type="file"
+                    v-if="status == 'payment' || status == 'rejectPayment'"
+                  />
                </div>
              </div>
            </div>
          </q-slide-transition>
        </q-list>

-        <q-list bordered class="col-12 rounded-borders">
+        <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-icon name="mdi-cash" color="positive" size="30px" />
@ -97,18 +108,18 @@
              >
              <q-item-label caption class="gt-xs">อนุมัติทันทีหลังชำระ</q-item-label>
            </q-item-section>
-            <q-item-section avatar class="gt-xs">
+            <!-- <q-item-section avatar class="gt-xs">
              <q-avatar size="32px">
                <q-img src="@/assets/krungthai.png" class="col-12" />
              </q-avatar>
-            </q-item-section>
-            <q-item-section side>
+            </q-item-section> -->
+            <!-- <q-item-section side>
              <q-radio v-model="pay" val="orange" color="blue" />
-            </q-item-section>
+            </q-item-section> -->
          </q-item>
-          <q-separator v-show="pay == 'orange'" />
+          <q-separator />
          <q-slide-transition :duration="100">
-            <div v-show="pay == 'orange'" class="q-pa-md bg-grey-1">
+            <div class="q-pa-md bg-grey-1">
              <q-card bordered class="q-pa-md">
                <div class="q-pb-sm">
                  <span class="text-weight-medium">รหัสใบสั่งซื้อ :</span>
@ -153,51 +164,20 @@
          </q-slide-transition>
        </q-list>
      </div>
-      <!-- <q-card flat class="q-pa-md text-left row q-mb-md" :class="getClass(status)">
-          <div class="text-bold col-12" :class="getFontColor(status)">
-            {{ message(status) }}
-          </div>
-          <div class="col-12" v-if="status === 'rejectPayment'" :class="getFontColor(status)">
-            <li>{{ rejectMessage }}</li>
-          </div>
-        </q-card> -->
-
-      <!-- <q-file
-          borderless
-          v-model="fileData"
-          stack-label
-          @update:model-value="uploadImg"
-          :disable="status != 'payment' && status != 'rejectPayment'"
-        >
-          <q-img :src="img" fit="contain" style="max-height: 300px" class="col-12">
-            <div class="absolute-bottom text-center">หลักฐานชำระเงิน</div>
-          </q-img>
-        </q-file> -->
    </div>
  </div>
-  <!-- <div class="q-pa-md text-center col-12" v-if="status == 'payment' || status == 'rejectPayment'">
-      <q-btn
-        
-        color="primary"
-        @click="clickPayment"
-        label="ส่งหลักฐานการชำระเงิน"
-      />
-    </div>
-    <div class="text-black text-center q-pb-lg q-pt-sm col-12 text-deep-orange">
-      <q-icon name="mdi-alert" size="18px" color="deep-orange" class="q-mr-sm" />ถ้าต้องการเเก้ไขหลักฐานการโอนเงินกรุณาอัปโหลดซ้ำ
-    </div> -->
  <div class="row col-12 justify-center">
    <q-btn
-      :color="pay === null ? 'grey' : 'primary'"
-      :disable="pay === null"
      style="width: 200px"
      label="แจ้งการชำระเงิน"
+      @click="clickPayment"
+      v-if="status == 'payment' || status == 'rejectPayment'"
    />
  </div>
 </template>

 <script setup lang="ts">
-import { ref } from 'vue'
+import { onMounted, ref } from 'vue'
 import { useQuasar } from 'quasar'
 import { useCounterMixin } from '@/stores/mixin'
 import http from '@/plugins/http'
@ -226,6 +206,11 @@ const pay = ref(null)
 const route = useRoute()
 const examId = ref<string>(route.params.id.toString())
 const positionId = ref<string>(route.params.positionId.toString())
+const bank = ref<any>([])
+
+onMounted(async () => {
+  await fetchPaymentExam()
+})

 const uploadImg = (file: any) => {
  fileData.value = null
@ -235,10 +220,25 @@ const uploadImg = (file: any) => {
    'https://www.bangkokbank.com/-/media/feature/page-content/bbl-corporate/image-carousel-slides/digital-banking/bualuang-mbanking/how-to-use/payment/others/7_en.png'
 }

+const fetchPaymentExam = async () => {
+  loader.value = true
+  await http
+    .get(config.API.periodExamPayment(examId.value))
+    .then((res) => {
+      const data = res.data.result
+      bank.value = data
+    })
+    .catch(() => {})
+    .finally(async () => {
+      loader.value = false
+      props.fetchStep()
+    })
+}
+
 const clickPayment = async () => {
  loader.value = true
  await http
-    .get(config.API.candidatePayment(examId.value, positionId.value))
+    .put(config.API.candidatePayment(examId.value, positionId.value))
    .then(() => {
      success($q, 'ส่งหลักฐานชำระเงินสำเร็จ')
    })
--- a/src/modules/01_exam/components/Form/Document.vue
+++ b/src/modules/01_exam/components/Form/Document.vue
@ -157,7 +157,7 @@ const props = defineProps({
 })
 const route = useRoute()
 const examId = ref<string>(route.params.id.toString())
-
+const positionId = ref<string>(route.params.positionId.toString())
 const uploader = ref<any>()
 const loader = ref<boolean>(false)
 const edit = ref<boolean>(props.status == 'register' || props.status == 'rejectRegister')
@ -198,7 +198,7 @@ const fileUpload = async (file: any) => {
 const getData = async () => {
  loader.value = true
  await http
-    .get(config.API.candidateUpload(examId.value))
+    .get(config.API.candidateUpload(examId.value, positionId.value))
    .then((res) => {
      const data = res.data.result
      //   console.log(data)
@ -216,7 +216,7 @@ const deleteData = async (id: string) => {
    documentId: id
  }
  await http
-    .delete(config.API.candidateUpload(examId.value), {
+    .delete(config.API.candidateUpload(examId.value, positionId.value), {
      params
    })
    .then((res) => {
@ -235,7 +235,7 @@ const uploadData = async () => {
  const formData = new FormData()
  formData.append('FileData', fileDataUpload.value)
  await http
-    .put(config.API.candidateUpload(examId.value), formData)
+    .put(config.API.candidateUpload(examId.value, positionId.value), formData)
    .then((res) => {
      const data = res.data.result
      console.log(data)
--- a/src/modules/01_exam/views/ExamDetail.vue
+++ b/src/modules/01_exam/views/ExamDetail.vue
@ -1,9 +1,7 @@
 <!-- page:detail page รายการสอบทั้งหมด -->
 <template>
  <q-toolbar class="q-pa-sm text-center">
-    <q-toolbar-title class="text-dark">
-      {{ tittle }}
-    </q-toolbar-title>
+    <q-toolbar-title class="text-dark"> {{ tittle }} {{ position }} </q-toolbar-title>
  </q-toolbar>
  <q-stepper
    v-model="step"
@ -75,6 +73,7 @@ const { modalError } = mixin
 const step = ref<number>(1)
 const stepRaw = ref<number>(1)
 const tittle = ref<string>('')
+const position = ref<string>('')
 const route = useRoute()
 const examId = ref<string>(route.params.id.toString())
 const positionId = ref<string>(route.params.positionId.toString())
@ -96,8 +95,13 @@ const candidateCheck = async () => {
    .then(async (res) => {
      const data = res.data.result
      store.consend = data.consend
-      const poition = data.positionExam
-      if (poition == true) {
+      const positionExam = data.positionExam
+      if (
+        positionId.value != '00000000-0000-0000-0000-000000000000' &&
+        positionExam.id != positionId.value &&
+        data.status != 'register' &&
+        data.status != 'rejectRegister'
+      ) {
        modalError(
          $q,
          'คุณได้สมัครสอบตำแหน่งอื่นในรอบนี้แล้ว',
@ -164,10 +168,11 @@ const fetchStep = async () => {
 const fetchPeriodExam = async () => {
  loader.value = true
  await http
-    .get(config.API.periodExamId(examId.value))
+    .get(config.API.periodExamPosition(examId.value, positionId.value))
    .then((res) => {
      const data = res.data.result
      tittle.value = data.name
+      position.value = data.posiiton == null ? '' : '(' + data.posiiton.positionName + ')'
    })
    .catch(() => {})
    .finally(() => {