mirror of
https://gitlab.com/CIEFWorldwideSdnBhd/portal.git
synced 2026-08-19 04:23:59 +00:00
create loading when click
This commit is contained in:
+30
-9
@@ -2,7 +2,7 @@
|
||||
<div class="row tabsContainer">
|
||||
<div class="col no-padding">
|
||||
<div class="row m-l-0 m-r-0">
|
||||
<div class="col">
|
||||
<div class="col" @click="changeTabName('pendingInvoice')">
|
||||
<div class="row justify-content-end">
|
||||
<div class="col">
|
||||
<div class="row fs-12 text-center">
|
||||
@@ -25,7 +25,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="col" @click="changeTabName('pendingApproval')">
|
||||
<div class="row justify-content-end">
|
||||
<div class="col">
|
||||
<div class="row fs-12 text-center">
|
||||
@@ -48,7 +48,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="col" @click="changeTabName('pendingPayment')">
|
||||
<div class="row justify-content-end">
|
||||
<div class="col">
|
||||
<div class="row fs-12 text-center">
|
||||
@@ -74,7 +74,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="col" @click="changeTabName('paidInvoice')">
|
||||
<div class="row justify-content-end">
|
||||
<div class="col">
|
||||
<div class="row fs-12 text-center">
|
||||
@@ -101,25 +101,30 @@
|
||||
<div class="row no-margin">
|
||||
<div class="col bg-master-lightest p-1 p-sm-4">
|
||||
<div class="row tabsContainer tabContent" tab-name="pendingInvoice">
|
||||
<div class="col">
|
||||
<keep-alive>
|
||||
<div class="col" v-if="tabName == 'pendingInvoice'">
|
||||
<list-component section="pendingInvoiceSection" :endpoint="route('api.packing_list.list')" :options="{does_not_have_transaction_type: 1, type: 2}">
|
||||
<template slot="list" slot-scope="{data}">
|
||||
<admin-payments-billing-component :data="data" invoice_status="Pending Invoice" section="pendingInvoiceSection" ></admin-payments-billing-component>
|
||||
</template>
|
||||
</list-component>
|
||||
</div>
|
||||
</keep-alive>
|
||||
</div>
|
||||
<div class="row tabsContainer tabContent hide" tab-name="pendingApproval">
|
||||
<div class="col">
|
||||
<keep-alive>
|
||||
<div class="col" v-if="tabName == 'pendingApproval'">
|
||||
<list-component section="pendingApprovalSection" :endpoint="route('api.packing_list.list')" :options="{has_invoice_status_in: [0, 1]}">
|
||||
<template slot="list" slot-scope="{data}">
|
||||
<admin-payments-billing-component :data="data" invoice_status="Pending Approval" section="pendingApprovalSection" ></admin-payments-billing-component>
|
||||
</template>
|
||||
</list-component>
|
||||
</div>
|
||||
</keep-alive>
|
||||
</div>
|
||||
<div class="row tabsContainer tabContent hide" tab-name="pendingPayment">
|
||||
<div class="col">
|
||||
<keep-alive>
|
||||
<div class="col" v-if="tabName == 'pendingPayment'">
|
||||
<payment-filter-component :endpoint="route('api.packing_list.list')" :data="data"></payment-filter-component>
|
||||
<list-component section="pendingPaymentSection" :endpoint="route('api.packing_list.list')" :options="{has_invoice_status_in: [2], packing_list_ordered_by_invoice_date: true}">
|
||||
<template slot="list" slot-scope="{data}">
|
||||
@@ -127,9 +132,11 @@
|
||||
</template>
|
||||
</list-component>
|
||||
</div>
|
||||
</keep-alive>
|
||||
</div>
|
||||
<div class="row tabsContainer tabContent hide" tab-name="paidInvoice">
|
||||
<div class="col">
|
||||
<keep-alive>
|
||||
<div class="col" v-if="tabName == 'paidInvoice'">
|
||||
<div class="row">
|
||||
<div class="col-12 col-md-6 no-padding">
|
||||
<download-billing-with-dates-component section="paymentsReportSection" ></download-billing-with-dates-component>
|
||||
@@ -141,6 +148,7 @@
|
||||
</template>
|
||||
</list-component>
|
||||
</div>
|
||||
</keep-alive>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -150,6 +158,19 @@
|
||||
<script>
|
||||
import componentHandler from '../../../general/mixins/componentHandler';
|
||||
export default {
|
||||
mixins: [componentHandler]
|
||||
mixins: [componentHandler],
|
||||
data() {
|
||||
return {
|
||||
tabName: ''
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.tabName = "pendingInvoice"
|
||||
},
|
||||
methods: {
|
||||
changeTabName(value) {
|
||||
this.tabName = value;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user