mirror of
https://gitlab.com/uldvstar/exchange-2.0.git
synced 2026-08-19 04:24:16 +00:00
EXCHANGE-149 - Frontend bug fixes, clean-up
This commit is contained in:
Fairuz
@@ -1,26 +1,21 @@
|
||||
<template>
|
||||
<div class="row m-b-10 parentContainer">
|
||||
<div class="col">
|
||||
<loading-component style="height: 200px; top: 0;" key="1" color="success" v-show="isLoading"></loading-component>
|
||||
<div class="row" v-show="!isLoading">
|
||||
<div class="col">
|
||||
<div class="row align-items-center">
|
||||
<div class="col p-t-5 p-b-5">
|
||||
<div class="col text-center">
|
||||
<div class="row m-b-20">
|
||||
<div class="col">
|
||||
<h5 class="all-caps">Merge Transfers</h5>
|
||||
<div class="fs-11">Are you sure you want to merge? This action is undoable.</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col p-r-5">
|
||||
<div data-dismiss="modal" class="btn btn-sm btn-default bg-master-lighter btn-block b-rad-none">Cancel</div>
|
||||
</div>
|
||||
<div class="col p-l-5">
|
||||
<div data-dismiss="modal" class="btn btn-sm btn-success btn-block b-rad-none" @click="mergeTransfer()">Merge</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row align-items-center">
|
||||
<div class="col p-t-5 p-b-5">
|
||||
<div class="col text-center">
|
||||
<div class="row m-b-20">
|
||||
<div class="col">
|
||||
<h5 class="all-caps">Merge Transfers</h5>
|
||||
<div class="fs-11">Are you sure you want to merge? This action is undoable.</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col p-r-5">
|
||||
<div data-dismiss="modal" class="btn btn-sm btn-default bg-master-lighter btn-block b-rad-none">Cancel</div>
|
||||
</div>
|
||||
<div class="col p-l-5">
|
||||
<div data-dismiss="modal" class="btn btn-sm btn-success btn-block b-rad-none" @click="mergeTransfer()">Merge</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -47,10 +42,13 @@
|
||||
data(){
|
||||
return {
|
||||
parameters:null,
|
||||
isLoading: true,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
mergeTransfer(){
|
||||
this.$root.$emit('setLoading', true);
|
||||
|
||||
let bookings=[];
|
||||
this.data.forEach(function(booking) {
|
||||
bookings.push(booking.id);
|
||||
@@ -67,7 +65,10 @@
|
||||
setTimeout(function(){
|
||||
window.location.href = this.route('dashboard');
|
||||
}, 2000);
|
||||
}
|
||||
},
|
||||
errorHandler() {
|
||||
this.$root.$emit('setLoading', false);
|
||||
},
|
||||
},
|
||||
mixins: [componentHandler, staticFormHandler]
|
||||
}
|
||||
|
||||
@@ -1,32 +1,35 @@
|
||||
<template>
|
||||
<div class="row align-items-center m-b-15 parentContainer">
|
||||
<div class="row align-items-center m-b-10 parentContainer">
|
||||
<div class="row w-100 m-0 p-0">
|
||||
<div class="col-auto hide" @click="showPurchaseDetails(item.id)">
|
||||
<div class="hint-text">
|
||||
<i class="fa fa-plus fs-8 muted hint-text"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<div class="col-auto pt-1 pb-0 pr-1">
|
||||
<div class="font-heading fs-12" style="line-height: 0px;">
|
||||
<input type="checkbox" v-bind:data-id="this.item.id" @change="selectedBookings">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-2">
|
||||
<div class="font-heading all-caps fs-10 muted">{{this.item.created_at}}</div>
|
||||
<div class="col-auto" :style="minWidth">
|
||||
<div class="font-heading all-caps fs-11">{{this.item.created_at}}</div>
|
||||
</div>
|
||||
<div class="col-2">
|
||||
<div class="col-auto" :style="minWidth">
|
||||
<div class="font-heading all-caps fs-11 bold">{{this.item.marking}}</div>
|
||||
</div>
|
||||
<div class="col-2">
|
||||
<div class="font-heading fs-12 bold">
|
||||
<span class="flag-icon fs-12" :class="'flag-icon-'+item.convertible_currency.country.short_code.toLowerCase()"></span> {{this.item.convertible_currency.short_code}}
|
||||
<div class="col-auto" :style="minWidth">
|
||||
<div class="font-heading fs-11 bold">
|
||||
<span class="flag-icon fs-11" :class="'flag-icon-'+item.convertible_currency.country.short_code.toLowerCase()"></span> {{this.item.convertible_currency.short_code}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-2">
|
||||
<div class="col-auto" :style="minWidth">
|
||||
<div class="font-heading fs-11">{{this.item.service.name}}</div>
|
||||
</div>
|
||||
<div class="col-2">
|
||||
<div class="font-heading fs-11 text-success bold">{{this.item.amount}} {{this.item.fixed_currency.short_code}}</div>
|
||||
<div class="col-auto" :style="minWidth150">
|
||||
<div class="font-heading fs-11 text-success bold">{{formatAmount(this.item.purchase_order.amount)}} {{this.item.purchase_order.original_currency.short_code}}</div>
|
||||
</div>
|
||||
<div class="col-auto" :style="minWidth150">
|
||||
<div class="font-heading fs-11 text-success bold">{{formatAmount(this.item.amount)}} {{this.item.fixed_currency.short_code}}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -53,6 +56,12 @@
|
||||
export default {
|
||||
data(){
|
||||
return {
|
||||
minWidth:{
|
||||
minWidth:'100px',
|
||||
},
|
||||
minWidth150:{
|
||||
minWidth:'150px',
|
||||
},
|
||||
selected_id:0,
|
||||
}
|
||||
},
|
||||
@@ -64,6 +73,9 @@
|
||||
console.log(this.selected_id);
|
||||
this.selected_id = id;
|
||||
},
|
||||
formatAmount(amount){
|
||||
return (Math.round((amount + Number.EPSILON) * 100) / 100).toFixed(2)
|
||||
},
|
||||
},
|
||||
mixins: [componentHandler]
|
||||
}
|
||||
|
||||
+45
-37
@@ -11,7 +11,7 @@
|
||||
</div>
|
||||
<div class="absolute shadow-sm " style="top: 0px; right: 0px; width: 0px; height: 0px; border-style: solid; border-width: 100px 0px 0px 100px; border-color: transparent transparent transparent rgb(255, 255, 255); z-index: 1;"></div>
|
||||
<!--<bear-component class="animate__animated animate__slow animate__fadeInDown" v-on:mouseover.native="bearShowing = true" v-on:mouseleave.native="bearShowing = false" v-if="bearShowing"></bear-component>-->
|
||||
<div class="row align-items-center m-b-25">
|
||||
<div class="row align-items-center m-b-0">
|
||||
<div class="col-auto p-r-0">
|
||||
<div class="icon-thumbnail icon-35 bg-transparent">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
|
||||
@@ -27,23 +27,19 @@
|
||||
<p>Merge multiple transfer orders to generate a single invoice for your purchase order</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row b-b b-dashed b-grey p-b-25" >
|
||||
<div class="row b-b b-dashed b-grey p-b-0" >
|
||||
<div class="col-10">
|
||||
<div class="row m-b-15">
|
||||
<div class="col-4">
|
||||
<div class="row">
|
||||
<div class="col-auto">
|
||||
<div class="font-heading fs-10 muted all-caps">Date</div>
|
||||
<div class="font-heading fs-10">
|
||||
{{booking.created_at}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<div class="font-heading fs-10 muted all-caps">Reference</div>
|
||||
<div class="font-heading fs-10">
|
||||
{{booking.marking}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<div class="font-heading fs-10 muted all-caps">Date</div>
|
||||
<div class="font-heading fs-10">
|
||||
{{booking.created_at}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<div class="font-heading fs-10 muted all-caps">Reference</div>
|
||||
<div class="font-heading fs-10">
|
||||
{{booking.marking}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
@@ -52,17 +48,16 @@
|
||||
{{booking.company.identification.reference}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="row align-items-end">
|
||||
<div class="col-auto">
|
||||
<div class="font-heading fs-10 muted all-caps">Contact</div>
|
||||
<div class="font-heading fs-10 bold">
|
||||
{{booking.company.contact.phone}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto p-l-0 hide">
|
||||
<button class="btn btn-xs btn-default bg-master-lightest no-border b-rad-none"><i class="fa fa-pencil text-complete"></i></button>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<div class="font-heading fs-10 muted all-caps">Purchase Order Amount</div>
|
||||
<div class="font-heading fs-10 text-info">
|
||||
{{formatAmount(booking.purchase_order.amount)}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<div class="font-heading fs-10 muted all-caps">Booking Amount</div>
|
||||
<div class="font-heading fs-10 text-info">
|
||||
{{formatAmount(booking.amount)}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -76,26 +71,29 @@
|
||||
<p class="col-auto pull-left">Select Transfer Orders to merge with the order above</p>
|
||||
</div>
|
||||
<div class="b-b b-dashed b-grey p-b-25">
|
||||
<div class="row align-items-center m-b-15 parentContainer">
|
||||
<div class="col-auto">
|
||||
<div class="row align-items-center m-b-5 parentContainer">
|
||||
<div class="col-auto pl3">
|
||||
<div class="font-heading fs-12" style="line-height: 0px;">
|
||||
<input type="checkbox" class="hide"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-2">
|
||||
<div class="col-auto" :style="minWidth">
|
||||
<div class="font-heading fs-10 muted all-caps">Created At</div>
|
||||
</div>
|
||||
<div class="col-2">
|
||||
<div class="col-auto" :style="minWidth">
|
||||
<div class="font-heading fs-10 muted all-caps">Marking</div>
|
||||
</div>
|
||||
<div class="col-2">
|
||||
<div class="col-auto" :style="minWidth">
|
||||
<div class="font-heading fs-10 muted all-caps">Currency</div>
|
||||
</div>
|
||||
<div class="col-2">
|
||||
<div class="col-auto" :style="minWidth">
|
||||
<div class="font-heading fs-10 muted all-caps">Type</div>
|
||||
</div>
|
||||
<div class="col-2">
|
||||
<div class="font-heading fs-10 muted all-caps">Amount</div>
|
||||
<div class="col-auto" :style="minWidth150">
|
||||
<div class="font-heading fs-10 muted all-caps">P.O. Amount</div>
|
||||
</div>
|
||||
<div class="col-auto" :style="minWidth150">
|
||||
<div class="font-heading fs-10 muted all-caps">Booking Amount</div>
|
||||
</div>
|
||||
</div>
|
||||
<list-component key="2" section="transferSection" :endpoint="route('api.booking.list')" :options="{per_page: 10, id_not: booking.id, status: 2,service_id:booking.service.id,convertible_currency_id:booking.convertible_currency.id,fixed_currency_id:booking.fixed_currency.id,with_transactions:true}">
|
||||
@@ -141,8 +139,6 @@
|
||||
<modal-component type="mergeTransferModal">
|
||||
<booking-merge-modal-component section="bookingDetailSection" :id="booking.id" :data="this.bookings"></booking-merge-modal-component>
|
||||
</modal-component>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -166,6 +162,12 @@
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
minWidth:{
|
||||
minWidth:'100px',
|
||||
},
|
||||
minWidth150:{
|
||||
minWidth:'150px',
|
||||
},
|
||||
section: 'bookingDetailSection',
|
||||
selected_id: '',
|
||||
isLoading: true,
|
||||
@@ -216,6 +218,9 @@
|
||||
}
|
||||
}
|
||||
});
|
||||
this.$root.$on('setLoading', (isLoading) => {
|
||||
this.isLoading = isLoading;
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
fetchBooking(){
|
||||
@@ -232,6 +237,9 @@
|
||||
getAmountClass(){
|
||||
return this.totalAmount == this.totalPurchaseAmount ? 'text-success' : 'text-danger';
|
||||
},
|
||||
formatAmount(amount){
|
||||
return (Math.round((amount + Number.EPSILON) * 100) / 100).toFixed(2)
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
Reference in New Issue
Block a user