refactor: handle pay installment no

src/pages/08_request-list/ProductExpansion.vue

@@ -3,7 +3,7 @@ import { baseUrl } from 'src/stores/utils';
 
 import BadgeComponent from 'src/components/BadgeComponent.vue';
 
-import { ProductRelation } from 'src/stores/quotations/types';
+import { ProductRelation, PayCondition } from 'src/stores/quotations/types';
 import { Step, RequestWorkStatus } from 'src/stores/request-list/types';
 
 const workStatus = [
@@ -32,7 +32,9 @@ defineProps<{
     total: number;
     paid?: number;
   };
+  installmentNo?: number;
   paySuccess: boolean;
+  payCondition: PayCondition;
 }>();
 
 // NOTE: Function
@@ -91,9 +93,11 @@ defineProps<{
               :label="
                 $q.screen.lt.sm
                   ? undefined
-                  : $t(
-                      `requestList.status.work.${status?.workStatus ?? RequestWorkStatus.Pending}`,
-                    )
+                  : !paySuccess
+                    ? $t('general.unavailable')
+                    : $t(
+                        `requestList.status.work.${status?.workStatus ?? RequestWorkStatus.Pending}`,
+                      )
               "
               class="text-capitalize text-weight-regular product-status rounded"
               :class="{
@@ -169,7 +173,11 @@ defineProps<{
               }"
             >
               {{
-                $t(`requestList.status.work.${status?.workStatus ?? 'Pending'}`)
+                !paySuccess
+                  ? `${$t(`quotation.payCondition.${payCondition}`)} ${payCondition.includes('Split') ? `${installmentNo}/${installmentInfo?.total} ` : ''}`
+                  : $t(
+                      `requestList.status.work.${status?.workStatus ?? 'Pending'}`,
+                    )
               }}
             </span>
           </div>

src/pages/08_request-list/RequestListView.vue

@@ -606,6 +606,7 @@ function isInstallmentPaySuccess(installmentNo: number) {
             </transition>
           </article>
           <!-- product -->
+
           <template
             v-for="(value, index) in workList?.filter((v) =>
               v.productService.work?.attributes.workflowStep?.[
@@ -622,6 +623,8 @@ function isInstallmentPaySuccess(installmentNo: number) {
               :status="
                 value.stepStatus?.find((v) => v.step === pageState.currentStep)
               "
+              :installment-no="value.productService.installmentNo"
+              :pay-condition="data?.quotation.payCondition"
               :img-url="`/product/${value.productService.productId}/image/${value.productService.product.selectedImage}`"
               :name="value.productService.product.name"
               :code="value.productService.product.code"
@@ -683,8 +686,6 @@ function isInstallmentPaySuccess(installmentNo: number) {
                     "
                     @download="
                       (opt) => {
-                        console.log(opt);
-
                         triggerViewFile({
                           id: opt.id,
                           fileName: opt.data.fileName,