cief/shipping-portal
1
0
Fork 0
mirror of https://gitlab.com/CIEFWorldwideSdnBhd/shipping-portal.git synced 2026-08-19 04:24:12 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'dillon/51-vue-polling-experimental-2' into dillon/34-jenkins-vapor

Browse Source
This commit is contained in:
Dillon Ngo
2023-12-26 04:22:11 +08:00
parent add6de3410 4d682c2ac6
commit 3880dbd616
2 changed files with 40 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/assets/vue/components/paymentsBilling/sections/AdminPaymentsBillingSectionComponent.vue
+16 -9
View File
@@ -6,7 +6,7 @@
<div class="row justify-content-end">
<div class="col">
<div class="row fs-12 text-center">
<div class="col p-t-20 p-b-20 m-r-5 bg-master-lighter tabButton" :class="{'active': item ? item.status === 2 : true }" tab-name="pendingInvoice">
<div class="col p-t-20 p-b-20 m-r-5 bg-master-lighter tabButton" :class="{'active': item ? item.status === 2 : true }" tab-name="pendingInvoice" @click="setActiveTab($event)">
<div class="row justify-content-center m-b-5">
<div class="col-auto">
<svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
@@ -29,7 +29,7 @@
<div class="row justify-content-end">
<div class="col">
<div class="row fs-12 text-center">
<div class="col p-t-20 p-b-20 m-r-5 bg-master-lighter tabButton" tab-name="pendingApproval">
<div class="col p-t-20 p-b-20 m-r-5 bg-master-lighter tabButton" tab-name="pendingApproval" @click="setActiveTab($event)">
<div class="row justify-content-center m-b-5">
<div class="col-auto">
<svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
@@ -52,7 +52,7 @@
<div class="row justify-content-end">
<div class="col">
<div class="row fs-12 text-center">
<div class="col p-t-20 p-b-20 m-r-5 bg-master-lighter tabButton" tab-name="pendingPayment">
<div class="col p-t-20 p-b-20 m-r-5 bg-master-lighter tabButton" tab-name="pendingPayment" @click="setActiveTab($event)">
<div class="row justify-content-center m-b-5">
<div class="col-auto">
<svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
@@ -78,7 +78,7 @@
<div class="row justify-content-end">
<div class="col">
<div class="row fs-12 text-center">
<div class="col p-t-20 p-b-20 bg-master-lighter tabButton" tab-name="paidInvoice">
<div class="col p-t-20 p-b-20 bg-master-lighter tabButton" tab-name="paidInvoice" @click="setActiveTab($event)">
<div class="row justify-content-center m-b-5">
<div class="col-auto">
<svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
@@ -100,23 +100,23 @@
</div>
<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="row tabsContainer tabContent" tab-name="pendingInvoice" v-if="isActiveTab('pendingInvoice') || showTabContent('pendingInvoice')">
<div class="col">
<admin-payments-billing-with-search-component :options="{does_not_have_transaction_type: 1, type: 2, per_page: 5, priority: 2}" section="pendingInvoiceSection" invoice_status="Pending Invoice"></admin-payments-billing-with-search-component>
</div>
</div>
<div class="row tabsContainer tabContent hide" tab-name="pendingApproval">
<div class="row tabsContainer tabContent hide" tab-name="pendingApproval" v-if="isActiveTab('pendingApproval') || showTabContent('pendingApproval')">
<div class="col">
<admin-payments-billing-with-search-component :options="{has_invoice_status_in: [0, 1], per_page: 5, priority: 2}" section="pendingApprovalSection" invoice_status="Pending Approval"></admin-payments-billing-with-search-component>
</div>
</div>
<div class="row tabsContainer tabContent hide" tab-name="pendingPayment">
<div class="row tabsContainer tabContent hide" tab-name="pendingPayment" v-if="isActiveTab('pendingPayment') || showTabContent('pendingPayment')">
<div class="col">
<payment-filter-component :endpoint="route('api.packing_list.list')" :data="data"></payment-filter-component>
<admin-payments-billing-with-search-component :options="{has_invoice_status_in: [2], packing_list_ordered_by_invoice_date: true, per_page: 5, priority: 1}" section="pendingPaymentSection" invoice_status="Pending Payment" :with_export="true"></admin-payments-billing-with-search-component>
</div>
</div>
<div class="row tabsContainer tabContent hide" tab-name="paidInvoice">
<div class="row tabsContainer tabContent hide" tab-name="paidInvoice" v-if="isActiveTab('paidInvoice') || showTabContent('paidInvoice')">
<div class="col">
<admin-payments-billing-with-search-component :options="{has_invoice_status_in: [3], per_page: 5, priority: 2}" section="paidInvoiceSection" invoice_status="Paid Invoice" :with_export="true"></admin-payments-billing-with-search-component>
</div>
@@ -128,7 +128,14 @@
</template>
<script>
import componentHandler from '../../../general/mixins/componentHandler';
import tabHandler from '../../../general/mixins/tabHandler';
export default {
mixins: [componentHandler]
data() {
return {
activeTab: 'pendingInvoice',
displayedTabs: ['pendingInvoice'],
};
},
mixins: [componentHandler, tabHandler]
}
</script>
resources/assets/vue/general/mixins/tabHandler.js
Vendored
+24
View File
@@ -0,0 +1,24 @@
export default {
data() {
return {
activeTab: null,
displayedTabs: [],
};
},
methods: {
setActiveTab(event) {
const tabName = event.currentTarget.getAttribute('tab-name');
// console.log(`Tab "${tabName}" clicked`);
this.activeTab = tabName;
if (!this.displayedTabs.includes(tabName)) {
this.displayedTabs.push(tabName);
}
},
isActiveTab(tabName) {
return this.activeTab === tabName;
},
showTabContent(tabName) {
return this.displayedTabs.includes(tabName);
},
},
}