DONE: update logo to original official logo, update letterhead and letterfooter layout (#8)

Co-authored-by: ISMAIL MASSERAN <topaz@Mac.dlinkrouter.local>
Reviewed-on: #8

fe/src/modules/membership-application/pages/MembershipApplicationDetail.vue

@@ -93,6 +93,8 @@ const previewUrl = ref<string | null>(null)
 const previewDocument = ref<MembershipApplicationDocumentDetail | null>(null)
 const boardMeetingReference = ref('')
 const boardMeetingReferenceError = ref<string | null>(null)
+const boardMeetingDate = ref(dayjs().format('YYYY-MM-DD'))
+const boardMeetingDateError = ref<string | null>(null)
 const deleteConfirmDialogOpen = ref(false)
 const pendingDeleteDocument = ref<MembershipApplicationDocumentDetail | null>(null)
 
@@ -372,6 +374,8 @@ function openConfirmAction(
   if (action.type === 'complete') {
     boardMeetingReference.value = ''
     boardMeetingReferenceError.value = null
+    boardMeetingDate.value = dayjs().format('YYYY-MM-DD')
+    boardMeetingDateError.value = null
   }
 
   pendingAction.value = action
@@ -383,6 +387,8 @@ function closeConfirmDialog() {
   pendingAction.value = null
   boardMeetingReference.value = ''
   boardMeetingReferenceError.value = null
+  boardMeetingDate.value = dayjs().format('YYYY-MM-DD')
+  boardMeetingDateError.value = null
 }
 
 async function confirmPendingAction() {
@@ -391,6 +397,7 @@ async function confirmPendingAction() {
   error.value = null
   successMessage.value = null
   boardMeetingReferenceError.value = null
+  boardMeetingDateError.value = null
 
   if (pendingAction.value.type === 'complete') {
     const reference = boardMeetingReference.value.trim()
@@ -398,6 +405,10 @@ async function confirmPendingAction() {
       boardMeetingReferenceError.value = 'Rujukan mesyuarat lembaga diperlukan.'
       return
     }
+    if (!boardMeetingDate.value) {
+      boardMeetingDateError.value = 'Tarikh mesyuarat lembaga diperlukan.'
+      return
+    }
     completeSubmitting.value = true
   } else {
     reviewSubmitting.value = true
@@ -421,6 +432,7 @@ async function confirmPendingAction() {
     } else {
       response = await completeMembershipApplication(applicationId.value, {
         board_meeting_reference: boardMeetingReference.value.trim(),
+        board_meeting_date: boardMeetingDate.value,
       })
     }
 
@@ -436,6 +448,9 @@ async function confirmPendingAction() {
     if (validationErrors?.board_meeting_reference?.[0]) {
       boardMeetingReferenceError.value = validationErrors.board_meeting_reference[0]
     }
+    if (validationErrors?.board_meeting_date?.[0]) {
+      boardMeetingDateError.value = validationErrors.board_meeting_date[0]
+    }
   } finally {
     reviewSubmitting.value = false
     completeSubmitting.value = false
@@ -1003,6 +1018,12 @@ onUnmounted(() => {
               @input="boardMeetingReferenceError = null" />
             <FieldError v-if="boardMeetingReferenceError">{{ boardMeetingReferenceError }}</FieldError>
           </Field>
+          <Field v-if="pendingAction?.type === 'complete'" class="mt-4 text-left">
+            <FieldLabel for="detail-board-meeting-date">Tarikh Mesyuarat Lembaga</FieldLabel>
+            <Input id="detail-board-meeting-date" v-model="boardMeetingDate" type="date"
+              :disabled="completeSubmitting" @input="boardMeetingDateError = null" />
+            <FieldError v-if="boardMeetingDateError">{{ boardMeetingDateError }}</FieldError>
+          </Field>
         </div>
         <div class="px-5 pb-8 text-center">
           <DialogCloseTrigger class="mr-2 w-28" :disabled="reviewSubmitting || completeSubmitting">