mirror of
https://gitlab.com/CIEFWorldwideSdnBhd/exchange-2.0.git
synced 2026-08-19 04:23:55 +00:00
Merge branch 'import-ambank-cief-lite-statement' of gitlab.com:CIEFWorldwideSdnBhd/exchange-2.0 into import-ambank-cief-lite-statement
# Conflicts: # app/Classes/Modules/Accounting/ControllersLogic/ImportAmbankStatementLogic.php # app/Classes/Modules/Accounting/ControllersLogic/ImportCiefLiteStatementLogic.php # app/Classes/Modules/Accounting/ControllersLogic/UpdateStatementTransactionStatusLogic.php
This commit is contained in:
Jia Sheng
Vendored
+7
@@ -34,6 +34,13 @@ Vue.use(VueTheMask);
|
||||
Vue.use(filters);
|
||||
|
||||
Vue.directive('closable', closable);
|
||||
Vue.directive('tooltip', function(el, binding){
|
||||
$(el).tooltip({
|
||||
title: binding.value,
|
||||
placement: binding.arg,
|
||||
trigger: 'hover'
|
||||
})
|
||||
})
|
||||
Vue.mixin({
|
||||
methods: {
|
||||
route: route
|
||||
|
||||
@@ -0,0 +1,39 @@
|
||||
<template>
|
||||
<div class="row m-b-10 parentContainer">
|
||||
<div class="col">
|
||||
<div class="row p-b-10 b-b b-grey">
|
||||
<div class="col-2">{{ item.imported_date }}</div>
|
||||
<div class="col-2">
|
||||
<button class="btn btn-xs btn-outline-success b-rad-none m-r-5" @click="downloadInvoiceMapped(item.imported_date)">
|
||||
Download Invoices Mapped
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import componentHandler from '../../../general/mixins/componentHandler';
|
||||
export default {
|
||||
props: {
|
||||
stage: {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
section:{
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
downloadInvoiceMapped(importedDate) {
|
||||
var arrDateTime = importedDate.split(" ");
|
||||
const fileName = 'InvoiceMapped';
|
||||
|
||||
window.open(this.route('importedInvoiceMapped.export')+'?date='+arrDateTime[0]+'&time='+arrDateTime[1]+'&fileName='+fileName, '_blank');
|
||||
},
|
||||
},
|
||||
mixins: [componentHandler]
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,39 @@
|
||||
<template>
|
||||
<div class="row m-b-10 parentContainer">
|
||||
<div class="col">
|
||||
<div class="row p-b-10 b-b b-grey">
|
||||
<div class="col-2">{{ item.imported_date }}</div>
|
||||
<div class="col-2">
|
||||
<button class="btn btn-xs btn-outline-success b-rad-none m-r-5" @click="downloadInvoiceMapped(item.imported_date)">
|
||||
Download Receipts Mapped
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import componentHandler from '../../../general/mixins/componentHandler';
|
||||
export default {
|
||||
props: {
|
||||
stage: {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
section:{
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
downloadInvoiceMapped(importedDate) {
|
||||
var arrDateTime = importedDate.split(" ");
|
||||
const fileName = 'ReceiptMapped';
|
||||
|
||||
window.open(this.route('importedReceiptMapped.export')+'?date='+arrDateTime[0]+'&time='+arrDateTime[1]+'&fileName='+fileName, '_blank');
|
||||
},
|
||||
},
|
||||
mixins: [componentHandler]
|
||||
}
|
||||
</script>
|
||||
+17
-2
@@ -75,7 +75,7 @@
|
||||
<div class="row parentContainer" v-for="owner in item.owners.pending_verification">
|
||||
<div class="col d-flex justify-content-between">
|
||||
<a :href="owner.reference_link" target="_blank">{{ owner.reference }}</a>
|
||||
<div v-if="stage === 2">
|
||||
<div v-if="stage === 2" style="display: flex;">
|
||||
<button class="btn btn-xs btn-outline-primary b-rad-none m-r-5 requestModal" data-type="approveCorrectMappingTransaction">
|
||||
<i class="fa fa-check fa-fw"></i>
|
||||
</button>
|
||||
@@ -90,6 +90,21 @@
|
||||
>
|
||||
</general-confirmation-form-component>
|
||||
</modal-component>
|
||||
|
||||
<button class="btn btn-xs btn-outline-danger b-rad-none m-r-5 requestModal" data-type="revertPendingMappingTransaction">
|
||||
<i class="fa fa-times fa-fw"></i>
|
||||
</button>
|
||||
<modal-component class="animate__animated animate__fast animate__fadeIn" type="revertPendingMappingTransaction">
|
||||
<general-confirmation-form-component
|
||||
contentText="Are you sure you want to reject this mapping?"
|
||||
modalType="delete"
|
||||
class="text-center"
|
||||
:apiRoute="route('api.accounting.statement_transaction.owner.status.update', owner.id, 'reject')"
|
||||
apiMethod="post"
|
||||
:section="section"
|
||||
>
|
||||
</general-confirmation-form-component>
|
||||
</modal-component>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -144,7 +159,7 @@
|
||||
contentText="Are you sure you want to reject this mapping?"
|
||||
modalType="delete"
|
||||
class="text-center"
|
||||
:apiRoute="route('api.accounting.statement_transaction.owner.status.update', item.id, 'reject')"
|
||||
:apiRoute="route('api.accounting.statement_transaction.owner.status.update', item.owners.pending_verification[0].id, 'reject')"
|
||||
apiMethod="post"
|
||||
:section="section"
|
||||
>
|
||||
|
||||
+4
-8
@@ -98,21 +98,17 @@
|
||||
},
|
||||
methods: {
|
||||
appendComponentTitle() {
|
||||
this.componentTitle = this.section == 'importInvoiceMapping' ? 'Imported Invoices Mapped' : 'Imported Receipts Mapped';
|
||||
this.componentTitle = 'Imported Invoices Mapped';
|
||||
},
|
||||
appendComponentTableHeader() {
|
||||
if (this.section == 'importInvoiceMapping') {
|
||||
this.tableHeaders = ['No','Doc No','Date','Debtor Code','Debtor Name','Shipping Info','Net Total','Cancelled','Mapped Status','Mapped Reference No','Payment Received Date'];
|
||||
} else {
|
||||
this.tableHeaders = ['No','OR No','Date','Creditor Code','Creditor Name','Shipping Info','Net Total','Cancelled','Mapped Status','Mapped Reference No'];
|
||||
}
|
||||
this.tableHeaders = ['No','Doc No','Date','Debtor Code','Debtor Name','Shipping Info','Net Total','Cancelled','Mapped Status','Mapped Reference No','Payment Received Date'];
|
||||
},
|
||||
importInvoice(){
|
||||
this.isLoading = true;
|
||||
this.parameters = {
|
||||
files: this.files
|
||||
};
|
||||
this.submit(this.route('api.'+(this.section == 'importInvoiceMapping' ? 'import_invoices' : 'import_receipts')+'.upload'), 'post', this.section, true, false);
|
||||
this.submit(this.route('api.import_invoices.upload'), 'post', this.section, true, false);
|
||||
},
|
||||
|
||||
successHandler(response){
|
||||
@@ -128,7 +124,7 @@
|
||||
|
||||
downloadInvoiceMapped() {
|
||||
var arrDateTime = this.importedDate.split(" ");
|
||||
const fileName = this.section == 'importInvoiceMapping' ? 'InvoiceMapped' : 'ReceiptMapped';
|
||||
const fileName = 'importInvoiceMapping';
|
||||
|
||||
window.open(this.route('importedInvoiceMapped.export')+'?date='+arrDateTime[0]+'&time='+arrDateTime[1]+'&fileName='+fileName, '_blank');
|
||||
},
|
||||
|
||||
+138
@@ -0,0 +1,138 @@
|
||||
<template>
|
||||
<div class="row h-100 parentContainer">
|
||||
<div class="col-12" style="min-height: 20px;">
|
||||
<loading-component style="height: 20px; top: 0;" key="1" color="success" v-show="isLoading"></loading-component>
|
||||
</div>
|
||||
|
||||
<div class="col-12">
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<h3>{{ componentTitle }}</h3>
|
||||
<div class="row m-b-10 animate__animated animate__fadeInUpBig animate__fast" v-if="error">
|
||||
<div class="col">
|
||||
<small class="bold fs-10 text-danger">{{error}}</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-right">
|
||||
<button class="btn btn-xs btn-outline-success b-rad-none m-r-5" @click="downloadInvoiceMapped">
|
||||
Download Receipts Mapped
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<!-- /.card-header -->
|
||||
<div class="card-body table-responsive p-0">
|
||||
<table class="table table-hover">
|
||||
<thead>
|
||||
<tr>
|
||||
<th v-for="item in tableHeaders">{{ item }}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody v-show="!isLoading">
|
||||
<tr v-for="(item, index) in $store.getters.getListData(section)">
|
||||
<td>{{index+1}}</td>
|
||||
<td>{{item.check }}</td>
|
||||
<td>{{item.doc_no}}</td>
|
||||
<td>{{item.doc_date }}}</td>
|
||||
<td>{{item.debtor_code}}</td>
|
||||
<td>{{item.company_name}}</td>
|
||||
<td>{{item.description}}</td>
|
||||
<td>{{item.payment_amount}}</td>
|
||||
<td>{{item.created_user}}</td>
|
||||
<td>{{item.curr}}</td>
|
||||
<td>{{item.to_home_rate}}</td>
|
||||
<td>{{item.local_payment_amount}}</td>
|
||||
<td>{{item.cancelled}}</td>
|
||||
<td>{{item.mapped_status}}</td>
|
||||
<td>{{item.mapped_result_reference}}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<!-- /.card-body -->
|
||||
<div class="card-footer">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12">
|
||||
<pagination-component :section="section" class="mb-5" ref="pagination"></pagination-component>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
files: {
|
||||
required: true
|
||||
},
|
||||
type: {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
section:{
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
isLoading: false,
|
||||
error: '',
|
||||
importedDate: null,
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
pendingQueue() {
|
||||
return this.$store.getters.isInCompleteQueue(this.section);
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
pendingQueue(inComplete, oldValue){
|
||||
if(inComplete){
|
||||
this.importInvoice();
|
||||
}
|
||||
},
|
||||
},
|
||||
created(){
|
||||
this.appendComponentTitle();
|
||||
this.appendComponentTableHeader();
|
||||
this.$store.dispatch('updateListQueue', {'name': this.section});
|
||||
},
|
||||
methods: {
|
||||
appendComponentTitle() {
|
||||
this.componentTitle = 'Imported Receipts Mapped';
|
||||
},
|
||||
appendComponentTableHeader() {
|
||||
this.tableHeaders = ['Check','Doc No','Doc Date','Debtor Code','Company Name','Description','Payment Amount','Created User','Curr.','To Home Rate','Local Payment Amount','Cancelled','Mapped Status','Mapped Reference No'];
|
||||
},
|
||||
importInvoice(){
|
||||
this.isLoading = true;
|
||||
this.parameters = {
|
||||
files: this.files
|
||||
};
|
||||
this.submit(this.route('api.import_receipts.upload'), 'post', this.section, true, false);
|
||||
},
|
||||
|
||||
successHandler(response){
|
||||
this.$store.dispatch('completeList', {'name': this.section, 'data': response.payload.data});
|
||||
this.importedDate = response.payload.importedDate;
|
||||
this.isLoading = false;
|
||||
},
|
||||
|
||||
errorHandler(error){
|
||||
this.isLoading = false;
|
||||
this.error = error.message;
|
||||
},
|
||||
|
||||
downloadInvoiceMapped() {
|
||||
var arrDateTime = this.importedDate.split(" ");
|
||||
const fileName = 'ReceiptMapped';
|
||||
|
||||
window.open(this.route('importedReceiptMapped.export')+'?date='+arrDateTime[0]+'&time='+arrDateTime[1]+'&fileName='+fileName, '_blank');
|
||||
},
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
+215
-7
@@ -3,19 +3,74 @@
|
||||
<div class="col">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="row justify-content-center align-items-center m-t-50 m-b-50" v-show="step === 0">
|
||||
<div class="col-5">
|
||||
<div class="row text-center">
|
||||
<div class="col b-a b-grey padding-20 m-r-15 pointer bg-complete text-white" @click="getReportFilter()">Mapped Report</div>
|
||||
<div class="justify-content-center align-items-center m-t-50 m-b-50" v-show="step === 0">
|
||||
|
||||
<div class="row">
|
||||
<div class="col-3">
|
||||
<div class="row text-center">
|
||||
<div class="col b-a b-grey padding-20 m-r-15 pointer bg-complete text-white" @click="getReportFilter()">Mapped Report</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-3">
|
||||
<div class="row text-center">
|
||||
<div class="col b-a b-grey padding-20 m-r-15 pointer bg-complete text-white" @click="getHistoryImportedInvReport()">History Imported Invoices Report</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-3">
|
||||
<div class="row text-center">
|
||||
<div class="col b-a b-grey padding-20 m-r-15 pointer bg-complete text-white" @click="getHistoryImportedRecReport()">History Imported Receipts Report</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" v-if="step == 1">
|
||||
<div class="row" v-if="step > 0 && report == 'mappedRecords'">
|
||||
<div class="col">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="justify-content-center align-items-center m-t-50 m-b-50">
|
||||
<div class="row mb-3">
|
||||
<div class="col-4">
|
||||
<validation-wrapper-component :validator="$v.parameters.owner_reference">
|
||||
<label class="text-primary">Reference</label>
|
||||
<input type="text" class="form-control" v-model="parameters.owner_reference">
|
||||
</validation-wrapper-component>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<validation-wrapper-component :validator="$v.parameters.invoice_reference">
|
||||
<label class="text-primary">Invoice Reference</label>
|
||||
<input type="text" class="form-control" v-model="parameters.invoice_reference">
|
||||
</validation-wrapper-component>
|
||||
</div>
|
||||
<div class="col-4">
|
||||
<validation-wrapper-component :validator="$v.parameters.receipt_reference">
|
||||
<label class="text-primary">Receipt Reference</label>
|
||||
<input type="text" class="form-control" v-model="parameters.receipt_reference">
|
||||
</validation-wrapper-component>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-3">
|
||||
<validation-wrapper-component :validator="$v.parameters.startDate">
|
||||
<label class="all-caps">Start Date</label>
|
||||
<date-picker-component :parameters="parameters" v-model.lazy="parameters.startDate"></date-picker-component>
|
||||
</validation-wrapper-component>
|
||||
</div>
|
||||
<div class="col-3">
|
||||
<validation-wrapper-component :validator="$v.parameters.endDate">
|
||||
<label class="all-caps">End Date</label>
|
||||
<date-picker-component :parameters="parameters" v-model.lazy="parameters.endDate"></date-picker-component>
|
||||
</validation-wrapper-component>
|
||||
</div>
|
||||
<div class="col-3">
|
||||
<div class="row text-center">
|
||||
<div class="col b-a b-grey padding-20 m-r-15 pointer bg-complete text-white" @click="getReportFilter()">Mapped Report</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row m-t-10 m-b-10">
|
||||
<div class="col">
|
||||
<div class="row p-t-10 p-b-10 b-b b-grey text-master-light">
|
||||
@@ -35,7 +90,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<list-component ref="TransactionsMappedList" section="TransactionsMappedSection" :endpoint="route('api.accounting.bank.transaction')" :options="filter">
|
||||
<list-component :key="step" ref="TransactionsMappedList" section="TransactionsMappedSection" :endpoint="route('api.accounting.bank.transaction')" :options="filter">
|
||||
<template slot="list" slot-scope="{data}">
|
||||
<statement-transaction-mapped-component :data="data" :section="section"></statement-transaction-mapped-component>
|
||||
</template>
|
||||
@@ -44,22 +99,175 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- report for imported Invoices -->
|
||||
<div class="row" v-if="step > 0 && report == 'importedInv'">
|
||||
<div class="col">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="justify-content-center align-items-center m-t-50 m-b-50">
|
||||
<div class="row">
|
||||
<div class="col-3">
|
||||
<validation-wrapper-component :validator="$v.parameters.startDate">
|
||||
<label class="all-caps">Start Date</label>
|
||||
<date-picker-component :parameters="parameters" v-model.lazy="parameters.startDate"></date-picker-component>
|
||||
</validation-wrapper-component>
|
||||
</div>
|
||||
<div class="col-3">
|
||||
<validation-wrapper-component :validator="$v.parameters.endDate">
|
||||
<label class="all-caps">End Date</label>
|
||||
<date-picker-component :parameters="parameters" v-model.lazy="parameters.endDate"></date-picker-component>
|
||||
</validation-wrapper-component>
|
||||
</div>
|
||||
<div class="col-3">
|
||||
<div class="row text-center">
|
||||
<div class="col b-a b-grey padding-20 m-r-15 pointer bg-complete text-white" @click="getHistoryImportedInvReport()">History Imported Invoices Report</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row m-t-10 m-b-10">
|
||||
<div class="col">
|
||||
<div class="row p-t-10 p-b-10 b-b b-grey text-master-light">
|
||||
<div class="col-2">Date</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<list-component :key="step" ref="HistoryImportedInvList" section="HistoryImportedInvSection" :endpoint="route('api.accounting.history.imported')" :options="filter">
|
||||
<template slot="list" slot-scope="{data}">
|
||||
<history-imported-invoices :data="data" :section="section"></history-imported-invoices>
|
||||
</template>
|
||||
</list-component>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- report for imported Receipts -->
|
||||
<div class="row" v-if="step > 0 && report == 'importedRec'">
|
||||
<div class="col">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="justify-content-center align-items-center m-t-50 m-b-50">
|
||||
<div class="row">
|
||||
<div class="col-3">
|
||||
<validation-wrapper-component :validator="$v.parameters.startDate">
|
||||
<label class="all-caps">Start Date</label>
|
||||
<date-picker-component :parameters="parameters" v-model.lazy="parameters.startDate"></date-picker-component>
|
||||
</validation-wrapper-component>
|
||||
</div>
|
||||
<div class="col-3">
|
||||
<validation-wrapper-component :validator="$v.parameters.endDate">
|
||||
<label class="all-caps">End Date</label>
|
||||
<date-picker-component :parameters="parameters" v-model.lazy="parameters.endDate"></date-picker-component>
|
||||
</validation-wrapper-component>
|
||||
</div>
|
||||
<div class="col-3">
|
||||
<div class="row text-center">
|
||||
<div class="col b-a b-grey padding-20 m-r-15 pointer bg-complete text-white" @click="getHistoryImportedRecReport()">History Imported Receipts Report</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row m-t-10 m-b-10">
|
||||
<div class="col">
|
||||
<div class="row p-t-10 p-b-10 b-b b-grey text-master-light">
|
||||
<div class="col-2">Date</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<list-component :key="step" ref="HistoryImportedRecList" section="HistoryImportedRecSection" :endpoint="route('api.accounting.history.imported')" :options="filter">
|
||||
<template slot="list" slot-scope="{data}">
|
||||
<history-imported-receipts :data="data" :section="section"></history-imported-receipts>
|
||||
</template>
|
||||
</list-component>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { required } from "vuelidate/lib/validators";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
parameters: {
|
||||
startDate: '',
|
||||
endDate: '',
|
||||
owner_reference: '',
|
||||
invoice_reference: '',
|
||||
receipt_reference: ''
|
||||
},
|
||||
step: 0,
|
||||
filter: {},
|
||||
report: ''
|
||||
}
|
||||
},
|
||||
validations: {
|
||||
parameters: {
|
||||
startDate: {
|
||||
required
|
||||
},
|
||||
endDate: {
|
||||
required
|
||||
},
|
||||
owner_reference: {},
|
||||
invoice_reference: {},
|
||||
receipt_reference: {}
|
||||
},
|
||||
},
|
||||
created(){
|
||||
this.parameters.startDate = this.startDate();
|
||||
this.parameters.endDate = this.endDate();
|
||||
},
|
||||
methods: {
|
||||
startDate() {
|
||||
var date = new Date();
|
||||
return '01-'+(date.getMonth() + 1)+'-'+date.getFullYear();
|
||||
},
|
||||
endDate() {
|
||||
var date = new Date();
|
||||
var lastDay = new Date(date.getFullYear(), date.getMonth() + 1, 0);
|
||||
return lastDay.getDate()+'-'+(lastDay.getMonth() + 1)+'-'+lastDay.getFullYear();
|
||||
},
|
||||
getReportFilter() {
|
||||
this.filter = {min_amount: 0, is_mapped: true, statement_transaction_owner_type_in: [1, 2], statement_transaction_owner_status_in: [3], per_page: 100, order_by: {column: 'posting_date', DESC: true}};
|
||||
|
||||
this.step = 1
|
||||
this.filter = {...this.filter, ...{statement_transaction_posting_start: this.parameters.startDate}};
|
||||
this.filter = {...this.filter, ...{statement_transaction_posting_end:this.parameters.endDate}}
|
||||
|
||||
if (typeof this.parameters.owner_reference != 'undefined' && this.parameters.owner_reference != '') this.filter = {...this.filter, ...{statement_transaction_owner_reference: this.parameters.owner_reference}};
|
||||
|
||||
if (typeof this.parameters.invoice_reference != 'undefined' && this.parameters.invoice_reference != '') this.filter = {...this.filter, ...{statement_transaction_invoice_reference: this.parameters.invoice_reference}};
|
||||
|
||||
if (typeof this.parameters.receipt_reference != 'undefined' && this.parameters.receipt_reference != '') this.filter = {...this.filter, ...{statement_transaction_receipt_reference: this.parameters.receipt_reference}};
|
||||
|
||||
this.step = this.step + 1;
|
||||
this.report = 'mappedRecords';
|
||||
},
|
||||
getHistoryImportedRecReport() {
|
||||
this.filter = {
|
||||
imported_date_from: this.parameters.startDate,
|
||||
imported_date_to:this.parameters.endDate,
|
||||
group_by_imported_date:true,
|
||||
type:'receipts'
|
||||
};
|
||||
this.step = this.step + 1;
|
||||
this.report = 'importedRec';
|
||||
},
|
||||
getHistoryImportedInvReport() {
|
||||
this.filter = {
|
||||
imported_date_from: this.parameters.startDate,
|
||||
imported_date_to:this.parameters.endDate,
|
||||
group_by_imported_date:true,
|
||||
type:'invoices'
|
||||
};
|
||||
this.step = this.step + 1;
|
||||
this.report = 'importedInv';
|
||||
}
|
||||
},
|
||||
}
|
||||
|
||||
+8
-7
@@ -168,7 +168,7 @@
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<modal-component class="animate__animated animate__fast animate__fadeIn" styleType="fill-in" type="ModalImportInvoice">
|
||||
<imported-invoice-mapped-component section="importInvoiceMapping" v-if="mappedTrue" :files="files"></imported-invoice-mapped-component>
|
||||
<imported-invoice-mapped-component section="importInvoiceMapping" v-if="invMappedTrue" :files="files"></imported-invoice-mapped-component>
|
||||
</modal-component>
|
||||
</div>
|
||||
</div>
|
||||
@@ -196,7 +196,7 @@
|
||||
</file-input-component>
|
||||
</div>
|
||||
</div>
|
||||
<div class="btn btn-lg btn-primary m-t-20 requestModal" data-type="ModalImportInvoice" @click="importReceipts">Import Receipts</div>
|
||||
<div class="btn btn-lg btn-primary m-t-20 requestModal" data-type="ModalImportReceipt" @click="importReceipts">Import Receipts</div>
|
||||
<!-- todo-new: delete later --><br><div class="btn btn-lg btn-primary m-t-20" @click="exportStage++">Nest Step</div>
|
||||
<br>
|
||||
<div class="row">
|
||||
@@ -206,8 +206,8 @@
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<modal-component class="animate__animated animate__fast animate__fadeIn" styleType="fill-in" type="ModalImportInvoice">
|
||||
<imported-invoice-mapped-component section="importReceiptMapping" v-if="mappedTrue" :files="files"></imported-invoice-mapped-component>
|
||||
<modal-component class="animate__animated animate__fast animate__fadeIn" styleType="fill-in" type="ModalImportReceipt">
|
||||
<imported-receipt-mapped-component section="importReceiptMapping" v-if="recMappedTrue" :files="files"></imported-receipt-mapped-component>
|
||||
</modal-component>
|
||||
</div>
|
||||
</div>
|
||||
@@ -245,7 +245,8 @@ export default {
|
||||
files: [],
|
||||
parameters: {},
|
||||
section: 'bankTransactionSection',
|
||||
mappedTrue: false,
|
||||
invMappedTrue: false,
|
||||
recMappedTrue: false,
|
||||
selectAll: false,
|
||||
}
|
||||
},
|
||||
@@ -265,10 +266,10 @@ export default {
|
||||
},
|
||||
methods: {
|
||||
importInvoice(){
|
||||
this.mappedTrue = true;
|
||||
this.invMappedTrue = true;
|
||||
},
|
||||
importReceipts(){
|
||||
this.mappedTrue = true;
|
||||
this.recMappedTrue = true;
|
||||
},
|
||||
exportInvoiceToAutoCount(){
|
||||
const checkedStatementTransactions = this.getCheckedStatementOwners();
|
||||
|
||||
@@ -11,7 +11,7 @@
|
||||
<div class="col-5">
|
||||
<div class="row">
|
||||
<div class="col-auto p-r-10">
|
||||
<div class="font-heading all-caps fs-11">{{item.type === 2 ? item.reference : item.company_business_type === 1 ? 'Company\'s Bank Account' : 'Personal Bank Account'}}</div>
|
||||
<div class="font-heading all-caps fs-11">{{item.type === 2 ? item.reference : item.type === 4 ? 'Alipay' : item.company_business_type === 1 ? 'Company\'s Bank Account' : 'Personal Bank Account'}}</div>
|
||||
</div>
|
||||
<div class="col-auto p-l-0">
|
||||
<div class="bg-success-light fs-7 all-caps text-white b-rad-sm lh-18 p-l-10 p-r-10" v-if="item.company_business_type !== 1 && item.default">default</div>
|
||||
|
||||
@@ -0,0 +1,127 @@
|
||||
<template>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<loading-component style="height: 50px; top: 0;" key="1" color="success" v-show="$store.getters.isLoading(section)"></loading-component>
|
||||
<div class="row" v-show="!$store.getters.isLoading(section)">
|
||||
<div class="col">
|
||||
<div class="row m-b-5 animate__animated animate__fadeInUpBig animate__fast" v-if="error">
|
||||
<div class="col">
|
||||
<small class="bold fs-10 text-danger">{{error}}</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row m-b-10">
|
||||
<div class="col">
|
||||
<validation-wrapper-component :validator="$v.parameters.account_no">
|
||||
<label>ALIPAY Account No.</label>
|
||||
<input type="text" class="form-control" v-model="parameters.account_no" :disabled="disabled">
|
||||
</validation-wrapper-component>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row m-b-10">
|
||||
<div class="col">
|
||||
<validation-wrapper-component :validator="$v.parameters.holder_name">
|
||||
<label>ALIPAY Account Holder Name</label>
|
||||
<input type="text" class="form-control" v-model="parameters.holder_name" @keyup="onlyChinese($event)" :disabled="disabled">
|
||||
</validation-wrapper-component>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col" :class="[{'p-r-15': disabled}, {'p-r-5': !disabled}]">
|
||||
<div class="btn btn-sm btn-default bg-master-lightest btn-block b-rad-none" :data-dismiss="closable ? 'modal' : ''" @click="$emit('close')">{{disabled ? 'Change Recipient Account' : 'Cancel'}}</div>
|
||||
</div>
|
||||
<div class="col p-l-5" v-if="!disabled">
|
||||
<button class="btn btn-sm btn-success btn-block b-rad-none" @click="submitForm()">Add Account</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import FormHandler from '../../../general/mixins/formHandler';
|
||||
import { required, requiredIf } from "vuelidate/lib/validators";
|
||||
export default {
|
||||
props : {
|
||||
company_id: {
|
||||
type: Number,
|
||||
default: 1
|
||||
},
|
||||
type: {
|
||||
type: Number,
|
||||
default: 1
|
||||
},
|
||||
closable: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
disabled: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
country_id: {
|
||||
type: Number,
|
||||
default: 1
|
||||
},
|
||||
serviceType: {
|
||||
type: Object,
|
||||
required: false,
|
||||
default: null
|
||||
}
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
parameters: {
|
||||
company_id: this.company_id,
|
||||
account_type: 4,
|
||||
reference: '',
|
||||
bank_name: '-',
|
||||
holder_name: '',
|
||||
account_no: '',
|
||||
bank_branch: '',
|
||||
country_id: this.country_id,
|
||||
},
|
||||
englishTextWarning: false,
|
||||
confirmProceedEnglishText: false,
|
||||
}
|
||||
},
|
||||
validations: {
|
||||
parameters: {
|
||||
holder_name: {
|
||||
required
|
||||
},
|
||||
account_no: {
|
||||
required
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
submitForm(){
|
||||
this.parameters.account_type = 4;
|
||||
this.parameters.bank_name = '-';
|
||||
this.submit(route('api.bank.create'), 'post', this.section, true, false);
|
||||
},
|
||||
successHandler(response){
|
||||
this.type !== 2 ? this.closeModal() : this.$emit('createdBank', response.payload.data);
|
||||
this.formHandler();
|
||||
this.resetForm();
|
||||
},
|
||||
errorHandler(error){
|
||||
this.formHandler(error.message);
|
||||
},
|
||||
onlyChinese(event){
|
||||
let value = event.target.value,
|
||||
regex = /^[^~`!@#$%^&*()_+=[\]\{}|;':",.\/<>?a-zA-Z0-9-]+$/;
|
||||
|
||||
event.preventDefault();
|
||||
|
||||
this.englishTextWarning = false;
|
||||
if(regex.test(value) === false){
|
||||
this.englishTextWarning = true;
|
||||
}
|
||||
},
|
||||
},
|
||||
mixins: [FormHandler]
|
||||
|
||||
}
|
||||
</script>
|
||||
@@ -133,12 +133,15 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col p-r-5">
|
||||
<div class="col" :class="[{'p-r-15': disabled}, {'p-r-5': !disabled}]" v-if="!isCancelButtonHidden">
|
||||
<div class="btn btn-sm btn-default bg-master-lightest btn-block b-rad-none" :data-dismiss="closable ? 'modal' : ''" @click="$emit('close')">{{disabled ? 'Change Recipient Account' : 'Cancel'}}</div>
|
||||
</div>
|
||||
<div class="col p-l-5" v-if="!disabled">
|
||||
<div class="col p-l-5" v-if="!disabled && !isEditing">
|
||||
<div class="btn btn-sm btn-success btn-block b-rad-none" @click="submitForm()">Add Account</div>
|
||||
</div>
|
||||
<div class="col p-l-5" v-if="isEditing">
|
||||
<div class="btn btn-sm btn-success btn-block b-rad-none" @click="submitForm()">Update Details</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -179,6 +182,22 @@
|
||||
type: String,
|
||||
required: false,
|
||||
default: 'RMB'
|
||||
},
|
||||
isEditing: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
isCancelButtonHidden: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
billNo: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
transactionId: {
|
||||
type: Number,
|
||||
default: 0
|
||||
}
|
||||
},
|
||||
data(){
|
||||
@@ -194,6 +213,8 @@
|
||||
swift: '',
|
||||
snap: '',
|
||||
country_id: this.country_id,
|
||||
bill_no: this.billNo,
|
||||
transaction_id: this.transactionId,
|
||||
}
|
||||
}
|
||||
},
|
||||
@@ -224,10 +245,24 @@
|
||||
},
|
||||
methods: {
|
||||
submitForm(){
|
||||
this.submit(route('api.bank.create'), 'post', this.section, true, false);
|
||||
if(this.isEditing){
|
||||
this.parameters.company_id = this.company_id;
|
||||
this.parameters.account_type = this.type;
|
||||
this.parameters.bill_no = this.billNo;
|
||||
this.parameters.transaction_id = this.transactionId;
|
||||
this.submit(route('api.bank.update', this.parameters.id), 'put', this.section, true, false);
|
||||
}
|
||||
else{
|
||||
this.submit(route('api.bank.create'), 'post', this.section, true, false);
|
||||
}
|
||||
},
|
||||
successHandler(response){
|
||||
this.type !== 2 ? this.closeModal() : this.$emit('createdBank', response.payload.data);
|
||||
if(this.isEditing){
|
||||
this.type !== 2 ? this.closeModal() : this.$emit('updatedBankDetails', response.payload.data, this.transactionId);
|
||||
}
|
||||
else{
|
||||
this.type !== 2 ? this.closeModal() : this.$emit('createdBank', response.payload.data);
|
||||
}
|
||||
this.formHandler();
|
||||
this.resetForm();
|
||||
},
|
||||
|
||||
@@ -39,12 +39,15 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col p-r-5">
|
||||
<div class="col" :class="[{'p-r-15': disabled}, {'p-r-5': !disabled}]" v-if="!isCancelButtonHidden">
|
||||
<div class="btn btn-sm btn-default bg-master-lightest btn-block b-rad-none" :data-dismiss="closable ? 'modal' : ''" @click="$emit('close')">{{disabled ? 'Change Recipient Account' : 'Cancel'}}</div>
|
||||
</div>
|
||||
<div class="col p-l-5" v-if="!disabled">
|
||||
<div class="col p-l-5" v-if="!disabled && !isEditing">
|
||||
<button class="btn btn-sm btn-success btn-block b-rad-none" @click="submitForm()">Add Account</button>
|
||||
</div>
|
||||
<div class="col p-l-5" v-if="isEditing">
|
||||
<button class="btn btn-sm btn-success btn-block b-rad-none" @click="submitForm()">Update Details</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -80,6 +83,22 @@
|
||||
type: Object,
|
||||
required: false,
|
||||
default: null
|
||||
},
|
||||
isEditing: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
isCancelButtonHidden: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
billNo: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
transactionId: {
|
||||
type: Number,
|
||||
default: 0
|
||||
}
|
||||
},
|
||||
data(){
|
||||
@@ -93,6 +112,8 @@
|
||||
account_no: '',
|
||||
bank_branch: '',
|
||||
country_id: this.country_id,
|
||||
bill_no: this.billNo,
|
||||
transaction_id: this.transactionId,
|
||||
},
|
||||
englishTextWarning: false,
|
||||
confirmProceedEnglishText: false,
|
||||
@@ -115,10 +136,24 @@
|
||||
submitForm(){
|
||||
this.parameters.account_type = 3;
|
||||
this.parameters.bank_name = '-';
|
||||
this.submit(route('api.bank.create'), 'post', this.section, true, false);
|
||||
if(this.isEditing){
|
||||
this.parameters.company_id = this.company_id;
|
||||
this.parameters.account_type = this.type;
|
||||
this.parameters.bill_no = this.billNo;
|
||||
this.parameters.transaction_id = this.transactionId;
|
||||
this.submit(route('api.bank.update', this.parameters.id), 'put', this.section, true, false);
|
||||
}
|
||||
else{
|
||||
this.submit(route('api.bank.create'), 'post', this.section, true, false);
|
||||
}
|
||||
},
|
||||
successHandler(response){
|
||||
this.type !== 2 ? this.closeModal() : this.$emit('createdBank', response.payload.data);
|
||||
if(this.isEditing){
|
||||
this.type !== 2 ? this.closeModal() : this.$emit('updatedBankDetails', response.payload.data, this.transactionId);
|
||||
}
|
||||
else{
|
||||
this.type !== 2 ? this.closeModal() : this.$emit('createdBank', response.payload.data);
|
||||
}
|
||||
this.formHandler();
|
||||
this.resetForm();
|
||||
},
|
||||
@@ -140,4 +175,4 @@
|
||||
mixins: [FormHandler]
|
||||
|
||||
}
|
||||
</script>
|
||||
</script>
|
||||
|
||||
@@ -1,20 +1,56 @@
|
||||
<template>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="row text-left no-margin bg-white" v-if="!isLoading" v-for="item in vouchers" v-bind:key="item.id" >
|
||||
<div v-if="vouchers && vouchers.length > 0" class="row fs-10 p-b-5">List of Vouchers, click to select</div>
|
||||
<div class="row text-left no-margin bg-white p-b-10" v-if="!isLoading" v-for="item in vouchers" v-bind:key="item.id" >
|
||||
<div id="select-option" name="select-option" class="col b-b b-grey p-t-10 p-b-10 pointer p-t-10 p-b-10" @click="selectVoucher(item)">
|
||||
<div class="row parentContainer">
|
||||
<div class="col">
|
||||
<p>{{ item.voucher.code }}</p>
|
||||
<p v-if="item.voucher.type == 'AMOUNT'">RM{{ item.voucher.value/100 }} Discount</p>
|
||||
<p v-if="item.voucher.type == 'PERCENT'">{{ item.voucher.value }}% Discount</p>
|
||||
<div class="row">
|
||||
<div class="col text-left no-padding">{{ item.voucher.code }}</div>
|
||||
<div class="col text-right no-padding" v-if="item.voucher.type == 'AMOUNT'">
|
||||
RM{{ item.voucher.value/100 }} Discount
|
||||
</div>
|
||||
<div class="col" v-if="item.voucher.end_date">
|
||||
Valid till {{ item.voucher.end_date }}
|
||||
<div class="col text-right no-padding" v-if="item.voucher.type == 'PERCENT'">
|
||||
<span v-if="item.voucher.value === 1">50% Discount</span>
|
||||
</div>
|
||||
<div class="col" v-else>
|
||||
No expiry date
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-12 col-md-8 text-left no-padding">
|
||||
<span v-if="item.voucher.end_date">
|
||||
Valid till {{ item.voucher.end_date }}
|
||||
</span>
|
||||
<span v-else>
|
||||
No expiry date
|
||||
</span>
|
||||
</div>
|
||||
<div class="col-12 col-md-4 text-right no-padding">
|
||||
<a class="requestModal" :data-type="'showVoucherTnC-' + item.id">Terms</a>
|
||||
</div>
|
||||
<modal-component class="animate__animated animate__fast animate__fadeIn" styleType="fill-in" size="extra-large" :type="'showVoucherTnC-' + item.id">
|
||||
<div class="container">
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
Terms & Conditions
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<ol>
|
||||
<li>Vouchers are only valid for purchases made on <a href="https://exchange.cief-malaysia.com/" target="_blank">https://exchange.cief-malaysia.com/</a>.</li>
|
||||
<li>Each voucher is applicable for a single transaction (unless stated otherwise).</li>
|
||||
<li>Each voucher is only applicable for new orders.</li>
|
||||
<li>Voucher codes are to be entered at the checkout or cart page (unless stated otherwise).</li>
|
||||
<li>Vouchers are not valid for promotions or discounted products (unless stated otherwise).</li>
|
||||
<li>Customers should take note of the expiry dates of the voucher(s) that they wish to redeem. Any voucher(s) which have expired will be invalid.</li>
|
||||
<li>Individual vouchers are only valid during its respective promotion period. This guideline overrides any individual voucher policy (unless stated otherwise).</li>
|
||||
<li>CIEF reserves the right to cancel any order if a customer’s purchasing behavior appears to be suspicious or potentially fraudulent.</li>
|
||||
<li>CIEF vouchers are not exchangeable for cash at <a href="https://exchange.cief-malaysia.com/" target="_blank">https://exchange.cief-malaysia.com/</a>.</li>
|
||||
<li>This voucher can only be used and redeemed by a registered customer who has already logged into their account during purchase.</li>
|
||||
<li>CIEF reserves the right to amend the terms & conditions or cancel any vouchers/promotions without prior notice.</li>
|
||||
<li>Additional terms & conditions are stated on the respective promotion banners (e.g. duration, discount amounts, validity for campaigns/promotions or certain services).</li>
|
||||
</ol>
|
||||
<button type="button" class="btn btn-primary" data-dismiss="modal">OK</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</modal-component>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -59,7 +95,7 @@
|
||||
fetchVouchers(){
|
||||
this.isLoading = true;
|
||||
if(this.employee){
|
||||
this.submit(route('api.voucher.user.list') + '?filters=' + JSON.stringify( { 'has_active_reward': this.employee.id} ), 'get', this.section, false, false);
|
||||
this.submit(route('api.voucher.user.list') + '?filters=' + JSON.stringify( { 'has_vouchers_all_with_company': this.employee.id} ), 'get', this.section, false, false);
|
||||
}
|
||||
},
|
||||
successHandler(response){
|
||||
|
||||
@@ -0,0 +1,312 @@
|
||||
<template>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="row parentContainer m-b-10">
|
||||
<div class="col p-l-0">
|
||||
<div class="row m-l-15 p-t-10 b-a align-items-center pointer shadow bg-white rounded" :class="{'b-white': !(this.selectedBillGroup.id === item.id), 'b-primary': this.selectedBillGroup.id === item.id}" @click="select()">
|
||||
<div class="col-12">
|
||||
<div class="row m-b-10">
|
||||
<div class="col-auto">
|
||||
<div class="font-heading fs-12 muted all-caps">Date</div>
|
||||
<div class="font-heading fs-12">
|
||||
{{item.updated_at}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<div class="font-heading fs-12 muted all-caps">Reference</div>
|
||||
<div class="font-heading fs-12">
|
||||
{{item.reference}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto" v-if="$store.getters.isAdmin">
|
||||
<div class="font-heading fs-12 muted all-caps">Supplier</div>
|
||||
<div class="font-heading fs-12">
|
||||
{{item.issuer_name}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<div class="font-heading fs-12 muted all-caps">Amount</div>
|
||||
<div class="font-heading fs-12">
|
||||
{{ item.currency.short_code }} {{formatAmount(item.amount)}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col parentContainer position-static">
|
||||
<div class="row align-items-center justify-content-end">
|
||||
<div class="col-auto position-static no-padding requestModal" data-type="deleteBillGroup" v-if="section !== 'paidBillGroupList'">
|
||||
<div class="btn bg-grey no-border">
|
||||
<i class="fa fa-times text-danger"></i>
|
||||
</div>
|
||||
<modal-component class="animate__animated animate__fast animate__fadeIn" type="deleteBillGroup">
|
||||
<general-confirmation-form-component
|
||||
contentText="Are you sure you want to delete this Bill Group?"
|
||||
modalType="delete"
|
||||
class="text-center"
|
||||
:apiRoute="route('api.transaction.group.bill.delete', item.id)"
|
||||
apiMethod="delete"
|
||||
:section="section"
|
||||
>
|
||||
</general-confirmation-form-component>
|
||||
</modal-component>
|
||||
</div>
|
||||
<div class="col-auto position-static no-padding requestModal" data-type="cancelBillGroup" v-if="section === 'paidBillGroupList'">
|
||||
<div class="btn btn-xs btn-outline-danger">
|
||||
Cancel
|
||||
</div>
|
||||
<modal-component class="animate__animated animate__fast animate__fadeIn" type="cancelBillGroup">
|
||||
<general-confirmation-form-component
|
||||
contentText="Are you sure you want to cancel this Bill Group?"
|
||||
modalType="delete"
|
||||
class="text-center"
|
||||
:apiRoute="route('api.transaction.group.bill.cancel', item.id)"
|
||||
apiMethod="put"
|
||||
:section="section"
|
||||
>
|
||||
</general-confirmation-form-component>
|
||||
</modal-component>
|
||||
</div>
|
||||
<div class="col-auto no-padding">
|
||||
<div class="btn btn-sm btn-default b-rad-none no-border" @click="expanded = !expanded">
|
||||
<i class="fa fa-fw" :class="[{'fa-angle-up': expanded}, {'fa-angle-down': !expanded}]"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col b-t b-grey p-t-10 m-l-5 m-r-5" v-show="expanded">
|
||||
<div class="row m-b-10">
|
||||
<div class="font-heading fs-12 all-caps text-underline">Bill Refunds</div>
|
||||
</div>
|
||||
<div class="row m-b-10" v-for="refund in item.bill_refunds">
|
||||
<div class="col-3">
|
||||
<div class="font-heading fs-12 muted all-caps">Date</div>
|
||||
<div class="font-heading fs-12">
|
||||
{{refund.updated_at}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-3">
|
||||
<div class="font-heading fs-12 muted all-caps">Reference</div>
|
||||
<div class="font-heading fs-12">
|
||||
{{refund.bill_no}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-3" v-if="$store.getters.isAdmin">
|
||||
<div class="font-heading fs-12 muted all-caps">Amount</div>
|
||||
<div class="font-heading fs-12">
|
||||
{{ refund.currency.short_code }} {{ formatAmount(refund.amount) }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-3" v-if="$store.getters.isAdmin">
|
||||
<div class="font-heading fs-12 muted all-caps">Status</div>
|
||||
<div class="font-heading fs-12" :class="[{'text-danger': refund.status === 0 || refund.status === 4}, {'text-success': refund.status === 2 || refund.status === 3}, {'text-warning': refund.status === 1}]">
|
||||
{{ refund.statusText }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row m-t-20 m-b-20" v-if="item.bill_refunds.length === 0">
|
||||
<div class="col">
|
||||
<div class="font-heading fs-12 text-center all-caps">No Selected Refunds</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col b-t b-grey p-t-10 m-l-5 m-r-5" v-show="expanded">
|
||||
<div class="row m-b-10">
|
||||
<div class="font-heading fs-12 all-caps text-underline">Payment History</div>
|
||||
</div>
|
||||
<div class="row m-b-10" v-for="payment in item.payment_history">
|
||||
<div class="col-auto">
|
||||
<div class="font-heading fs-12 muted all-caps">Date</div>
|
||||
<div class="font-heading fs-12">
|
||||
{{payment.updated_at}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<div class="font-heading fs-12 muted all-caps">Reference</div>
|
||||
<div class="font-heading fs-12">
|
||||
{{payment.bill_no}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto" v-if="$store.getters.isAdmin">
|
||||
<div class="font-heading fs-12 muted all-caps">Amount</div>
|
||||
<div class="font-heading fs-12">
|
||||
{{ payment.currency.short_code }} {{ formatAmount(payment.amount) }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto" v-if="$store.getters.isAdmin">
|
||||
<div class="font-heading fs-12 muted all-caps">Status</div>
|
||||
<div class="font-heading fs-12" :class="[{'text-danger': payment.status === 0 || payment.status === 4}, {'text-success': payment.status === 2 || payment.status === 3}, {'text-warning': payment.status === 1}]">
|
||||
{{ payment.statusText }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col parentContainer position-static align-items-center">
|
||||
<div class="row align-items-center justify-content-end">
|
||||
<div v-if="!payment.documents && section === 'paymentInProgressBillGroupList'">
|
||||
<div class="btn no-border muted btn-success requestModal" data-type="paymentProofModal" @click="selectedTransactionID(payment.id)">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" width="30" height="30" viewBox="0 0 172 172" style=" fill:#000000;"><defs><linearGradient x1="86" y1="70.76994" x2="86" y2="116.46013" gradientUnits="userSpaceOnUse" id="color-1_52139_gr1"><stop offset="0" stop-color="#ffffff"></stop><stop offset="1" stop-color="#ffffff"></stop></linearGradient><linearGradient x1="61.8125" y1="34.48869" x2="61.8125" y2="144.97181" gradientUnits="userSpaceOnUse" id="color-2_52139_gr2"><stop offset="0" stop-color="#ffffff"></stop><stop offset="1" stop-color="#ffffff"></stop></linearGradient><linearGradient x1="130.34375" y1="34.48869" x2="130.34375" y2="144.97181" gradientUnits="userSpaceOnUse" id="color-3_52139_gr3"><stop offset="0" stop-color="#ffffff"></stop><stop offset="1" stop-color="#ffffff"></stop></linearGradient><linearGradient x1="86" y1="32.25" x2="86" y2="148.71013" gradientUnits="userSpaceOnUse" id="color-4_52139_gr4"><stop offset="0" stop-color="#ffffff"></stop><stop offset="1" stop-color="#ffffff"></stop></linearGradient></defs><g fill="none" fill-rule="nonzero" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-weight="none" font-size="none" text-anchor="none" style="mix-blend-mode: normal"><path d="M0,172v-172h172v172z" fill="none"></path><g><path d="M102.45825,99.43213h-5.70825c-1.4835,0 -2.6875,1.16637 -2.6875,2.65256v8.10013c0,1.48081 -1.19862,2.68481 -2.67944,2.68481h-10.76612c-1.48081,0 -2.67944,-1.204 -2.67944,-2.68481v-8.10013c0,-1.48619 -1.204,-2.65256 -2.6875,-2.65256h-5.70825c-1.93769,0 -3.04225,-2.39188 -1.88125,-4.05275l14.577,-20.855c1.8275,-2.61494 5.69481,-2.61763 7.52231,-0.00538l14.577,20.86306c1.16369,1.66088 0.05644,4.05006 -1.87856,4.05006z" fill="url(#color-1_52139_gr1)"></path><path d="M51.0625,67.1875h5.375c0,-8.0625 7.23206,-16.12231 16.125,-16.12231v-5.375c-11.85456,0 -21.5,10.74731 -21.5,21.49731z" fill="url(#color-2_52139_gr2)"></path><path d="M139.75,80.625c0,-10.75 -8.44144,-18.80981 -18.8125,-18.80981v5.375c7.40944,0 13.4375,5.37231 13.4375,13.43481z" fill="url(#color-3_52139_gr3)"></path><path d="M148.09738,92.27263c1.59369,-3.68188 2.40263,-7.59219 2.40263,-11.64494c0,-16.29969 -13.26281,-29.5625 -29.5625,-29.5625c-6.5145,0 -12.68769,2.08819 -17.78588,5.96088c-4.30269,-13.03438 -16.52006,-22.08587 -30.58912,-22.08587c-17.78319,0 -32.25,14.46681 -32.25,32.25c0,4.14681 0.16662,8.05981 1.42437,10.74731h-1.42437c-13.33806,0 -24.1875,10.84944 -24.1875,24.1875c0,11.56431 8.16194,21.24737 19.0275,23.62044c1.02394,6.39894 6.53869,11.31706 13.2225,11.31706h56.4375h16.125h5.375c6.54944,0 12.00238,-4.71388 13.18488,-10.92469c9.2235,-1.20131 16.37762,-9.08913 16.37762,-18.63513c0,-6.09256 -2.924,-11.72019 -7.77762,-15.23006zM126.3125,131.6875h-5.375h-16.125h-56.4375c-3.49912,0 -6.45538,-2.6875 -7.568,-5.375h93.0735c-1.11263,2.6875 -4.06888,5.375 -7.568,5.375zM137.0625,120.9375h-96.75c-10.37106,0 -18.8125,-8.44144 -18.8125,-18.8125c0,-10.37106 8.44144,-18.8125 18.8125,-18.8125h9.51375l-1.68506,-3.78131c-2.23063,-5.01488 -2.45369,-7.48737 -2.45369,-12.341c0,-14.81888 12.05613,-26.875 26.875,-26.875c13.01825,0 24.13106,9.29875 26.42619,22.11275l0.92719,5.17075l3.64962,-3.77325c4.60638,-4.76225 10.77687,-7.38525 17.372,-7.38525c13.33806,0 24.1875,10.84944 24.1875,24.1875c0,3.6765 -0.81431,7.21056 -2.37575,10.41944l-1.763,3.32713l2.37037,1.26044c4.40481,2.34081 7.14338,6.88806 7.14338,11.868c0,7.40944 -6.02806,13.43481 -13.4375,13.43481z" fill="url(#color-4_52139_gr4)"></path></g></g></svg>
|
||||
</div>
|
||||
<modal-component type="paymentProofModal">
|
||||
<bill-group-payment-proof-form-component v-if="selected_transaction_id === payment.id" :section="section" :data="{item}" :id="payment.id"></bill-group-payment-proof-form-component>
|
||||
</modal-component>
|
||||
</div>
|
||||
<div v-if="payment.documents">
|
||||
<document-file-viewer-component :file="payment.documents.files[0]">
|
||||
<template slot="button">
|
||||
<div class="btn no-border muted btn-success">
|
||||
<i class="fa fa-file-pdf-o"></i>
|
||||
</div>
|
||||
</template>
|
||||
</document-file-viewer-component>
|
||||
</div>
|
||||
<div v-if="section === 'paymentVerificationBillGroupList' && payment.status === 1">
|
||||
<div class="col-auto">
|
||||
<div class="row">
|
||||
<div class="col-6 col-md-auto text-right">
|
||||
<button class="btn btn-xs btn-outline-danger b-rad-none m-r-5 requestModal" data-type="rejectPayment">
|
||||
<i class="fa fa-times fa-fw"></i>
|
||||
</button>
|
||||
<button class="btn btn-xs btn-success b-rad-none requestModal" data-type="approvePayment">
|
||||
<i class="fa fa-check fa-fw"></i>
|
||||
</button>
|
||||
<modal-component small type="rejectPayment">
|
||||
<general-confirmation-form-component
|
||||
contentText="Are you sure you want to reject this payment?"
|
||||
modalType="delete"
|
||||
class="text-center"
|
||||
:apiRoute="route('api.transaction.group.bill.payment_proof.approval', payment.id, 'reject')"
|
||||
apiMethod="post"
|
||||
:section="section"
|
||||
>
|
||||
</general-confirmation-form-component>
|
||||
</modal-component>
|
||||
<modal-component small type="approvePayment">
|
||||
<general-confirmation-form-component
|
||||
contentText="Are you sure you want to approve this payment?"
|
||||
modalType="confirm"
|
||||
class="text-center"
|
||||
:apiRoute="route('api.transaction.group.bill.payment_proof.approval', payment.id, 'approve')"
|
||||
apiMethod="post"
|
||||
:section="section"
|
||||
>
|
||||
</general-confirmation-form-component>
|
||||
</modal-component>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row m-t-20 m-b-20" v-if="item.payment_history.length === 0">
|
||||
<div class="col">
|
||||
<div class="font-heading fs-12 text-center all-caps">No Payments</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col b-t b-grey p-t-10 m-l-5 m-r-5" v-show="expanded">
|
||||
<div class="row m-b-10">
|
||||
<div class="font-heading fs-12 all-caps text-underline">Currency Orders</div>
|
||||
</div>
|
||||
<div class="row m-t-10 m-b-20" v-for="group in item.groups">
|
||||
<div class="col-auto">
|
||||
<div class="font-heading fs-12 muted all-caps">Date</div>
|
||||
<div class="font-heading fs-12">
|
||||
{{group.created_at}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<div class="font-heading fs-12 muted all-caps">Currency Rate</div>
|
||||
<div class="font-heading fs-12">
|
||||
{{group.currency_rate}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<div class="font-heading fs-12 muted all-caps">Original Amount</div>
|
||||
<div class="font-heading fs-12">
|
||||
{{ group.original_currency.short_code }} {{formatAmount(group.original_amount)}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-2">
|
||||
<div class="font-heading fs-12 muted all-caps">Amount</div>
|
||||
<div class="font-heading fs-12">
|
||||
{{ group.currency.short_code }} {{formatAmount(group.amount)}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-2">
|
||||
<div class="font-heading fs-12 muted all-caps">Transfer Fee</div>
|
||||
<div class="font-heading fs-12">
|
||||
{{ group.original_currency.short_code }} {{formatAmount(group.transfer_fee)}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<div class="font-heading fs-12 muted all-caps">PO Completion</div>
|
||||
<div class="col">
|
||||
<p class="font-heading fs-12 bold text-success pointer"><span :class="[{'text-danger': group.complete_transactions.length !== group.transactions.length}]">{{group.complete_transactions.length}}</span>/{{group.transactions.length}}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col parentContainer position-static align-items-center">
|
||||
<div class="row align-items-center justify-content-end">
|
||||
<div v-if="group.documents.currency_order">
|
||||
<document-file-viewer-component :file="group.documents.currency_order.files[0]">
|
||||
<template slot="button">
|
||||
<div class="btn no-border muted btn-success">
|
||||
<i class="fa fa-file-pdf-o"></i>
|
||||
</div>
|
||||
</template>
|
||||
</document-file-viewer-component>
|
||||
</div>
|
||||
<div v-else>
|
||||
<div class="btn bg-grey no-border muted invisible">
|
||||
<i class="fa fa-file-pdf-o"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import componentHandler from '../../../general/mixins/componentHandler';
|
||||
export default {
|
||||
props: {
|
||||
selectedBillGroup: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
section: {
|
||||
type: String,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
selected_id: '',
|
||||
selected: false,
|
||||
expanded: false,
|
||||
selected_transaction_id: '',
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
selectedTransactionID(id){
|
||||
this.selected_transaction_id = id;
|
||||
},
|
||||
formatAmount(amount) {
|
||||
return (Math.round((amount + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")
|
||||
},
|
||||
select(){
|
||||
this.$emit('input', this.item)
|
||||
this.selected = this.selectedBillGroup.id === this.item.id;
|
||||
},
|
||||
},
|
||||
mixins: [componentHandler]
|
||||
}
|
||||
</script>
|
||||
+176
@@ -0,0 +1,176 @@
|
||||
<template>
|
||||
<div class="row mt-3 mt-md-0">
|
||||
<div class="col">
|
||||
<div class="row m-l-10 p-t-20 p-b-20 shadow bg-white rounded">
|
||||
<div class="col">
|
||||
<div class="row align-items-end m-b-10 text-complete">
|
||||
<div class="col">
|
||||
<div class="font-heading all-caps fs-12">Transfer Total:</div>
|
||||
</div>
|
||||
<div class="col-auto text-right" v-if="selectedBillGroup.id">
|
||||
<div class="font-heading fs-12">{{selectedBillGroup.original_currency.short_code}} {{formatAmount(selectedBillGroup.original_amount)}}</div>
|
||||
</div>
|
||||
<div class="col-auto text-right" v-else>
|
||||
<div class="font-heading fs-12">CNY 0.00</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row align-items-end m-b-10 text-complete">
|
||||
<div class="col">
|
||||
<div class="font-heading all-caps fs-12"></div>
|
||||
</div>
|
||||
<div class="col-auto text-right" v-if="selectedBillGroup.id">
|
||||
<div class="font-heading fs-12">{{selectedBillGroup.currency.short_code}} {{formatAmount((selectedBillGroup.invoice_amount))}}</div>
|
||||
</div>
|
||||
<div class="col-auto text-right" v-else>
|
||||
<div class="font-heading fs-12">MYR 0.00</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row align-items-end m-b-10 text-complete">
|
||||
<div class="col">
|
||||
<div class="font-heading all-caps fs-12">Service Charge:</div>
|
||||
</div>
|
||||
<div class="col-auto text-right" v-if="selectedBillGroup.id">
|
||||
<div class="font-heading fs-12">{{selectedBillGroup.currency.short_code}} {{formatAmount(selectedBillGroup.service_charge)}}</div>
|
||||
</div>
|
||||
<div class="col-auto text-right" v-else>
|
||||
<div class="font-heading fs-12">MYR 0.00</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row align-items-end m-b-10 text-danger">
|
||||
<div class="col">
|
||||
<div class="font-heading all-caps fs-12">Bill Refund Total:</div>
|
||||
</div>
|
||||
<div class="col-auto text-right" v-if="selectedBillGroup.id">
|
||||
<div class="font-heading fs-12">- {{selectedBillGroup.currency.short_code}} {{formatAmount(selectedBillGroup.bill_refund_amount)}}</div>
|
||||
</div>
|
||||
<div class="col-auto text-right" v-else>
|
||||
<div class="font-heading fs-12">MYR 0.00</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row align-items-end m-b-10 text-success">
|
||||
<div class="col">
|
||||
<div class="font-heading all-caps fs-12" :class="{'bold': section === 'paidBillGroupList'}">Paid Total:</div>
|
||||
</div>
|
||||
<div class="col-auto text-right" v-if="selectedBillGroup.id">
|
||||
<div class="font-heading fs-12" :class="{'bold': section === 'paidBillGroupList'}">{{selectedBillGroup.currency.short_code}} {{ formatAmount(selectedBillGroup.paid_amount) }}</div>
|
||||
</div>
|
||||
<div class="col-auto text-right" v-else>
|
||||
<div class="font-heading fs-12" :class="{'bold': section === 'paidBillGroupList'}">MYR 0.00</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="section !== 'paidBillGroupList'">
|
||||
<div class="row align-items-end m-b-10">
|
||||
<div class="col">
|
||||
<div class="font-heading all-caps fs-12">Floating Amount:</div>
|
||||
</div>
|
||||
<div class="col-auto text-right" v-if="selectedBillGroup.id">
|
||||
<div class="font-heading fs-12">{{selectedBillGroup.currency.short_code}} {{ formatAmount(selectedBillGroup.floating_amount) }}</div>
|
||||
</div>
|
||||
<div class="col-auto text-right" v-else>
|
||||
<div class="font-heading fs-12">MYR 0.00</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row align-items-end bold text-danger">
|
||||
<div class="col">
|
||||
<div class="font-heading all-caps fs-12">OutStanding Total:</div>
|
||||
</div>
|
||||
<div class="col-auto text-right" v-if="selectedBillGroup.id">
|
||||
<div class="font-heading fs-12">{{selectedBillGroup.currency.short_code}} {{ formatAmount(selectedBillGroup.outstanding_amount) }}</div>
|
||||
</div>
|
||||
<div class="col-auto text-right" v-else>
|
||||
<div class="font-heading fs-12">MYR 0.00</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="section === 'paymentInProgressBillGroupList' && selectedBillGroup.status === 0 && (selectedBillGroup.outstanding_amount > 0 || (selectedBillGroup.bill_refund_amount === (selectedBillGroup.amount + selectedBillGroup.service_charge) && !selectedBillGroup.payment_history.some((item)=> [0, 1, 2, 3].includes(item.status))))">
|
||||
<div class="row p-r-15 m-t-20 m-b-10">
|
||||
<div class="col p-r-0">
|
||||
<validation-wrapper-component :validator="$v.parameters.payAmount">
|
||||
<label>Amount</label>
|
||||
<input class="form-control" v-model.lazy="parameters.payAmount" v-money="{decimal: '.',thousands: ',', precision: 2}">
|
||||
</validation-wrapper-component>
|
||||
</div>
|
||||
<div class="col-auto b-r b-t b-b b-grey">
|
||||
<div class="row h-100 align-items-center">
|
||||
<div class="col">
|
||||
<div class="font-heading fs-10 muted">{{ selectedBillGroup.id ? selectedBillGroup.currency.short_code : "MYR" }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row m-t-20" v-if="selectedBillGroup.outstanding_amount > 0">
|
||||
<div class="col">
|
||||
<button id="payment-btn" class="btn btn-sm all-caps b-rad-none btn-success btn-block" @click="submitForm">Make Payment</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row m-t-20" v-if="(selectedBillGroup.bill_refund_amount === selectedBillGroup.amount + selectedBillGroup.service_charge)">
|
||||
<div class="col">
|
||||
<button id="payment-btn" class="btn btn-sm all-caps b-rad-none btn-success btn-block" @click="submitForm">Complete Order</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ModalComponent from "../../general/elements/ModalComponent";
|
||||
import componentHandler from '../../../general/mixins/componentHandler';
|
||||
import { required } from "vuelidate/lib/validators";
|
||||
import {VMoney} from 'v-money'
|
||||
|
||||
export default {
|
||||
props: {
|
||||
selectedBillGroup: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
refreshList: {
|
||||
type: Function,
|
||||
required: true
|
||||
},
|
||||
section:{
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
selectedBillGroup(){
|
||||
this.parameters.payAmount = (Math.round((this.selectedBillGroup.outstanding_amount + Number.EPSILON) * 100) / 100).toFixed(2)
|
||||
}
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
parameters: {
|
||||
payAmount: 0
|
||||
}
|
||||
}
|
||||
},
|
||||
validations: {
|
||||
parameters: {
|
||||
payAmount: {
|
||||
required
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
formatAmount(amount) {
|
||||
return (Math.round((amount + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")
|
||||
},
|
||||
submitForm(){
|
||||
this.submit(route('api.transaction.group.bill.pay', this.selectedBillGroup.id), 'post', this.section, true, true)
|
||||
},
|
||||
successHandler(){
|
||||
this.refreshList();
|
||||
// this.$store.dispatch('toggleSection', {name: 'paymentInProgressBillGroupList', status: !this.$store.getters.isShowing('paymentInProgressBillGroupList')});
|
||||
this.parameters = {
|
||||
payments: [],
|
||||
};
|
||||
},
|
||||
},
|
||||
mixins: [componentHandler],
|
||||
directives: {money: VMoney}
|
||||
}
|
||||
</script>
|
||||
+76
-15
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div class="row zig-zag-top">
|
||||
<div class="col bg-white padding-25">
|
||||
<div class="row" v-if="(data.serviceType.id === 4 && step != 1) || data.serviceType.id != 4">
|
||||
<div class="row" v-if="(isOneSizEightEightOrder && step != 1) || !isOneSizEightEightOrder">
|
||||
<div class="col">
|
||||
<div class="row p-b-20 b-b b-dashed m-b-20 b-grey">
|
||||
<div class="col">
|
||||
@@ -75,7 +75,7 @@
|
||||
<!--</div>-->
|
||||
<div class="row parentContainer">
|
||||
<div class="col">
|
||||
<div class="row text-center m-b-15 hide" v-if="data.serviceType.id === 4">
|
||||
<div class="row text-center m-b-15 hide" v-if="isOneSizEightEightOrder">
|
||||
<div class="col-auto p-r-0">
|
||||
<div class="b-a b-grey bg-white padding-15 pointer b-primary text-primary">
|
||||
<div class="m-b-5">
|
||||
@@ -100,12 +100,14 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" v-show="!createBank">
|
||||
<div class="row" v-show="!createBank && !existingBank">
|
||||
<div class="col-7 p-r-0">
|
||||
<div class="row" id="select-list" name="select-list">
|
||||
<div class="col">
|
||||
<div class="form-group no-margin form-group-default">
|
||||
<label>{{ data.serviceType.id === 4 ? '1688 Login Id/Email/Phone' : 'Account No.' }}</label>
|
||||
<label v-if="isOneSizEightEightOrder">1688 Login Id/Email/Phone</label>
|
||||
<label v-else-if="isAlipayOrder">ALIPAY Account No.</label>
|
||||
<label v-else>Account No.</label>
|
||||
<input type="text" class="form-control" v-model="account_no" @keyup="parameters.bankAccount = {}" @focus="dropdownStatus = true">
|
||||
</div>
|
||||
</div>
|
||||
@@ -116,7 +118,7 @@
|
||||
<div class="absolute w-100 b-l b-b b-r b-grey" :class="[{'hide': !dropdownStatus}]" style="top: 100%; right: 0; z-index: 1;">
|
||||
<div class="row text-left no-margin bg-white">
|
||||
<div class="col no-padding">
|
||||
<div class="row no-margin" v-for="bank in data.recipientBanks.filter(AccountNumber)" v-bind:key="bank.id" >
|
||||
<div class="row no-margin" v-for="bank in data.recipientBanks.filter(bank => filterBankType.includes(bank.type)).filter(AccountNumber)" v-bind:key="bank.id" >
|
||||
<div id="select-option" name="select-option" class="col b-b b-grey p-t-10 p-b-10 pointer p-t-10 p-b-10" :class="[{'bg-master-lightest': parameters.bankAccount.id === bank.id}, {'text-master': parameters.bankAccount.id === bank.id}, {'hover-primary': parameters.bankAccount.id !== bank.id}, {'pointer': parameters.bankAccount.id !== bank.id}]" @click="selectBank(bank)">
|
||||
<div class="row align-items-center justify-content-center">
|
||||
<div class="col">
|
||||
@@ -142,18 +144,43 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto p-l-0" v-show="!createBank && account_no && !Object.keys(parameters.bankAccount).length">
|
||||
<button class="btn btn-sm h-100 btn-primary b-rad-none all-caps" @click="createBank = !createBank; dropdownStatus = false">
|
||||
<button class="btn btn-sm h-100 btn-primary b-rad-none all-caps" @click="createBank = true; existingBank = false; dropdownStatus = false">
|
||||
<i class="fa fa-plus m-r-5"></i>
|
||||
Create New
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" v-show="createBank">
|
||||
<div class="row" v-show="createBank || existingBank">
|
||||
<div class="col">
|
||||
<bank-account-form-component v-if="data.serviceType.id !== 4" section="customerProfileSection" :disabled="formDisabled" :data="Object.keys(parameters.bankAccount).length ? parameters.bankAccount : {account_no: account_no, company_id: data.company.id, country_id: 2, account_type: 2}" :company_id="data.company.id" :country_id="2" :type="2" :currency="data.serviceType.selectedCurrency.short_code" v-on:createdBank="updateBank($event)" :serviceType="data.serviceType" :closable=false v-on:close="clearAccount()"></bank-account-form-component>
|
||||
<phone-account-form-component v-if="data.serviceType.id === 4" section="customerProfileSection" :disabled="formDisabled" :data="Object.keys(parameters.bankAccount).length ? parameters.bankAccount : {account_no: account_no, company_id: data.company.id, country_id: 2, account_type: 2}" :company_id="data.company.id" :country_id="2" :type="2" v-on:createdBank="updateBank($event)" :serviceType="data.serviceType" :closable=false v-on:close="clearAccount()"></phone-account-form-component>
|
||||
<bank-account-form-component v-if="!isOneSizEightEightOrder && !isAlipayOrder" section="customerProfileSection" :disabled="formDisabled" :data="Object.keys(parameters.bankAccount).length ? parameters.bankAccount : {account_no: account_no, company_id: data.company.id, country_id: 2, account_type: 2}" :company_id="data.company.id" :country_id="2" :type="2" :currency="data.serviceType.selectedCurrency.short_code" v-on:createdBank="updateBank($event)" :serviceType="data.serviceType" :closable=false v-on:close="clearAccount()"></bank-account-form-component>
|
||||
<phone-account-form-component v-if="isOneSizEightEightOrder" section="customerProfileSection" :disabled="formDisabled" :data="Object.keys(parameters.bankAccount).length ? parameters.bankAccount : {account_no: account_no, company_id: data.company.id, country_id: 2, account_type: 2}" :company_id="data.company.id" :country_id="2" :type="2" v-on:createdBank="updateBank($event)" :serviceType="data.serviceType" :closable=false v-on:close="clearAccount()"></phone-account-form-component>
|
||||
<alipay-account-form-component v-if="isAlipayOrder" section="customerProfileSection" :disabled="formDisabled" :data="Object.keys(parameters.bankAccount).length ? parameters.bankAccount : {account_no: account_no, company_id: data.company.id, country_id: 2, account_type: 2}" :company_id="data.company.id" :country_id="2" :type="2" v-on:createdBank="updateBank($event)" :serviceType="data.serviceType" :closable=false v-on:close="clearAccount()"></alipay-account-form-component>
|
||||
</div>
|
||||
</div>
|
||||
<div class="b-t b-dashed m-t-15 b-grey" v-if="isOneSizEightEightOrder">
|
||||
<div class="row p-r-15 m-t-10" v-for="(order, index) in order_reference_no">
|
||||
<div class="col p-r-0">
|
||||
<div class="form-group no-margin form-group-default">
|
||||
<label>
|
||||
Order Reference No. {{ index + 1 }}
|
||||
</label>
|
||||
<input type="text" class="form-control" v-model="order_reference_no[index]">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto bg-danger pointer" v-if="order_reference_no.length > 1" @click="order_reference_no.splice(index, 1)">
|
||||
<div class="row h-100 align-items-center">
|
||||
<div class="col">
|
||||
<i class="fa fa-times fa-fw text-white"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<button class="btn btn-xs btn-outline-primary b-rad-none m-t-10" @click="order_reference_no.push('')" :disabled="isLatestReferenceEmpty">
|
||||
<i class="fa fa-plus m-r-5"></i>
|
||||
Add Order Reference
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<!--<div class="row">-->
|
||||
@@ -291,7 +318,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<confirm-booking-component :section="section" :data="data" v-if="parameters.bankAccount"></confirm-booking-component>
|
||||
<confirm-booking-component :section="section" :data="data" :order_reference_no="order_reference_no" v-if="parameters.bankAccount"></confirm-booking-component>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" v-else>
|
||||
@@ -309,23 +336,55 @@
|
||||
|
||||
<script>
|
||||
import FormHandler from '../../../general/mixins/formHandler';
|
||||
import ConfirmBookingComponent from "../forms/confirmBookingComponent";
|
||||
import ConfirmBookingComponent from "../forms/confirmBookingComponent";
|
||||
export default {
|
||||
components: {ConfirmBookingComponent},
|
||||
data(){
|
||||
return {
|
||||
createBank: false,
|
||||
existingBank: false,
|
||||
recipientBanks: [],
|
||||
dropdownStatus: false,
|
||||
account_no: '',
|
||||
order_reference_no: [''],
|
||||
step:1,
|
||||
promoCode:""
|
||||
|
||||
promoCode:"",
|
||||
oneSixEightEightServiceIds: [4, 10],
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'data.serviceType.id': function() {
|
||||
this.clearAccount();
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
formDisabled(){
|
||||
return !!Object.keys(this.parameters.bankAccount).length;
|
||||
return this.existingBank;
|
||||
},
|
||||
isOneSizEightEightOrder() {
|
||||
return this.oneSixEightEightServiceIds.includes(this.data.serviceType.id);
|
||||
},
|
||||
isAlipayOrder() {
|
||||
return this.data.serviceType.id === 11;
|
||||
},
|
||||
filterBankType() {
|
||||
if (this.isAlipayOrder) {
|
||||
return [4];
|
||||
}
|
||||
|
||||
if (this.isOneSizEightEightOrder) {
|
||||
return [3];
|
||||
}
|
||||
|
||||
if (!this.isAlipayOrder && !this.isOneSizEightEightOrder) {
|
||||
return [1, 2];
|
||||
}
|
||||
|
||||
return [];
|
||||
},
|
||||
isLatestReferenceEmpty() {
|
||||
var latestValue = this.order_reference_no[this.order_reference_no.length - 1];
|
||||
return latestValue == '' || latestValue == undefined;
|
||||
}
|
||||
},
|
||||
created(){
|
||||
@@ -342,12 +401,14 @@
|
||||
},
|
||||
selectBank(bank){
|
||||
this.account_no = bank.account_no;
|
||||
this.createBank = true;
|
||||
this.createBank = false;
|
||||
this.existingBank = true;
|
||||
this.parameters.bankAccount = bank;
|
||||
this.dropdownStatus = false;
|
||||
},
|
||||
clearAccount(){
|
||||
this.createBank = false;
|
||||
this.existingBank = false;
|
||||
this.account_no = '';
|
||||
this.parameters.bankAccount = {};
|
||||
}
|
||||
|
||||
+177
@@ -0,0 +1,177 @@
|
||||
<template>
|
||||
<div class="row zig-zag-top">
|
||||
<div class="col bg-white padding-25">
|
||||
<div class="row p-b-20 b-b b-dashed b-grey m-b-20">
|
||||
<div class="col">
|
||||
<div class="row m-b-10" v-if="data">
|
||||
<div class="col" v-if="data.billNo && data.billNo !== ''">
|
||||
<div class="font-heading all-caps bold fs-10">Edit Recipient Bank Details ({{ data.billNo }})</div>
|
||||
</div>
|
||||
<div class="col" v-else>
|
||||
<div class="font-heading all-caps bold fs-10">Edit Recipient Bank Details (Default)</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="row m-b-10">
|
||||
<div class="col">
|
||||
<div class="row parentContainer">
|
||||
<div class="col">
|
||||
<div class="row" v-show="!createBank && !isEditing">
|
||||
<div class="col-7 p-r-0">
|
||||
<div class="row" id="select-list" name="select-list">
|
||||
<div class="col">
|
||||
<div class="form-group no-margin form-group-default">
|
||||
<label>{{ data.serviceType.id === 4 ? '1688 Login Id/Email/Phone' : 'Account No.' }}</label>
|
||||
<input type="text" class="form-control" v-model="account_no" @keyup="parameters.bankAccount = {}" @focus="dropdownStatus = true">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="relative w-100">
|
||||
<div class="absolute w-100 b-l b-b b-r b-grey" :class="[{'hide': !dropdownStatus}]" style="top: 100%; right: 0; z-index: 1;">
|
||||
<div class="row text-left no-margin bg-white">
|
||||
<div class="col no-padding">
|
||||
<div class="row no-margin" v-for="bank in data.recipientBanks.filter(getAccountNumber)" v-bind:key="bank.id" >
|
||||
<div id="select-option" name="select-option" class="col b-b b-grey p-t-10 p-b-10 pointer p-t-10 p-b-10" :class="['bg-master-lightest','text-master', 'hover-primary', 'pointer']" @click="selectBank(bank)">
|
||||
<div class="row align-items-center justify-content-center">
|
||||
<div class="col">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="font-heading bold lh-15 fs-13">{{bank.reference ? bank.reference + ' - ':''}}{{bank.holder_name}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="font-heading all-caps fs-13 muted"><b class="m-r-5 text-primary">{{bank.account_no}}</b> {{bank.bank_name}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto p-l-0" v-show="!createBank && account_no">
|
||||
<button class="btn btn-sm h-100 btn-primary b-rad-none all-caps" @click="createBank = !createBank; dropdownStatus = false">
|
||||
<i class="fa fa-plus m-r-5"></i>
|
||||
Create New
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" v-show="createBank || isEditing">
|
||||
<div class="col">
|
||||
<bank-account-form-component v-if="data.serviceType.id !== 4"
|
||||
section="bookingEditRecipientDetailSection"
|
||||
:data="Object.keys(parameters.bankAccount).length ? parameters.bankAccount : {account_no: account_no, company_id: data.company.id, country_id: 2, account_type: 2}"
|
||||
:company_id="data.company.id"
|
||||
:country_id="2"
|
||||
:type="2"
|
||||
:currency="data.serviceType.selectedCurrency.short_code"
|
||||
:billNo="data.billNo"
|
||||
:transactionId="data.transactionId"
|
||||
:serviceType="data.serviceType"
|
||||
:closable=false
|
||||
:isEditing="isEditing"
|
||||
:isCancelButtonHidden=true
|
||||
v-on:createdBank="updateBank($event)"
|
||||
v-on:updatedBankDetails="updatedBankDetails"
|
||||
v-on:close="clearAccount()">
|
||||
</bank-account-form-component>
|
||||
<phone-account-form-component v-if="data.serviceType.id === 4"
|
||||
section="bookingEditRecipientDetailSection"
|
||||
:data="Object.keys(parameters.bankAccount).length ? parameters.bankAccount : {account_no: account_no, company_id: data.company.id, country_id: 2, account_type: 2}"
|
||||
:company_id="data.company.id"
|
||||
:country_id="2" :type="2"
|
||||
:billNo="data.billNo"
|
||||
:transactionId="data.transactionId"
|
||||
:serviceType="data.serviceType"
|
||||
:closable=false
|
||||
:isEditing="isEditing"
|
||||
:isCancelButtonHidden=true
|
||||
v-on:createdBank="updateBank($event)"
|
||||
v-on:updatedBankDetails="updatedBankDetails"
|
||||
v-on:close="clearAccount()" ></phone-account-form-component>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-auto" v-show="!isLoading">
|
||||
<button id="cancel-new-booking" name="cancel-new-booking" class="btn btn-lg btn-default bg-master-lightest b-rad-none all-caps fs-12" data-dismiss="modal">Close</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import FormHandler from '../../../general/mixins/formHandler';
|
||||
// import componentHandler from '../../../general/mixins/componentHandler';
|
||||
// import UpdateBookingComponent from "../forms/UpdateBookingComponent";
|
||||
export default {
|
||||
// components: {UpdateBookingComponent},
|
||||
data(){
|
||||
return {
|
||||
createBank: false,
|
||||
isEditing: true,
|
||||
recipientBanks: [],
|
||||
dropdownStatus: false,
|
||||
account_no: '',
|
||||
}
|
||||
},
|
||||
created(){
|
||||
this.recipientBanks = this.data.recipientBanks;
|
||||
},
|
||||
methods: {
|
||||
getAccountNumber(bank){
|
||||
return bank.account_no.startsWith(this.account_no)
|
||||
},
|
||||
updateBank(bank){
|
||||
this.selectBank(bank);
|
||||
this.recipientBanks.push(bank);
|
||||
this.parameters.bankAccount = bank;
|
||||
this.parameters.bankAccountDefault = bank;
|
||||
},
|
||||
updatedBankDetails(bank, transactionId){
|
||||
this.parameters.bankAccount = bank;
|
||||
this.parameters.bankAccountDefault = bank;
|
||||
|
||||
var foundIndex = this.recipientBanks.findIndex(x => x.id == bank.id);
|
||||
this.recipientBanks[foundIndex] = bank;
|
||||
|
||||
this.$emit('updatedBankDetails', bank, transactionId);
|
||||
this.closeModal();
|
||||
},
|
||||
selectBank(bank){
|
||||
this.account_no = bank.account_no;
|
||||
this.isEditing = true;
|
||||
this.createBank = false;
|
||||
this.parameters.bankAccount = bank;
|
||||
this.dropdownStatus = false;
|
||||
},
|
||||
clearAccount(){
|
||||
this.createBank = false;
|
||||
this.isEditing = false;
|
||||
this.account_no = '';
|
||||
this.parameters.bankAccount = {};
|
||||
},
|
||||
},
|
||||
mixins: [FormHandler]
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
@@ -0,0 +1,168 @@
|
||||
<template>
|
||||
<div class="row zig-zag-top">
|
||||
<div class="col bg-white padding-25">
|
||||
<div class="row p-b-20 b-b b-dashed b-grey m-b-20">
|
||||
<div class="col">
|
||||
<div class="row m-b-10" v-if="data">
|
||||
<div class="col" v-if="data.billNo && data.billNo !== ''">
|
||||
<div class="font-heading all-caps bold fs-10">Edit Recipient Bank Details ({{ data.billNo }})</div>
|
||||
</div>
|
||||
<div class="col" v-else>
|
||||
<div class="font-heading all-caps bold fs-10">Edit Recipient Bank Details (Default)</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="row m-b-10">
|
||||
<div class="col">
|
||||
<div class="row parentContainer">
|
||||
<div class="col">
|
||||
<div class="row" v-show="!createBank && !isEditing">
|
||||
<div class="col-7 p-r-0">
|
||||
<div class="row" id="select-list" name="select-list">
|
||||
<div class="col">
|
||||
<div class="form-group no-margin form-group-default">
|
||||
<label>{{ data.serviceType.id === 4 ? '1688 Login Id/Email/Phone' : 'Account No.' }}</label>
|
||||
<input type="text" class="form-control" v-model="account_no" @keyup="parameters.bankAccount = {}" @focus="dropdownStatus = true">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="relative w-100">
|
||||
<div class="absolute w-100 b-l b-b b-r b-grey" :class="[{'hide': !dropdownStatus}]" style="top: 100%; right: 0; z-index: 1;">
|
||||
<div class="row text-left no-margin bg-white">
|
||||
<div class="col no-padding">
|
||||
<div class="row no-margin" v-for="bank in data.recipientBanks.filter(AccountNumber)" v-bind:key="bank.id" >
|
||||
<div id="select-option" name="select-option" class="col b-b b-grey p-t-10 p-b-10 pointer p-t-10 p-b-10" :class="['bg-master-lightest','text-master', 'hover-primary', 'pointer']" @click="selectBank(bank)">
|
||||
<div class="row align-items-center justify-content-center">
|
||||
<div class="col">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="font-heading bold lh-15 fs-13">{{bank.reference ? bank.reference + ' - ':''}}{{bank.holder_name}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="font-heading all-caps fs-13 muted"><b class="m-r-5 text-primary">{{bank.account_no}}</b> {{bank.bank_name}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto p-l-0" v-show="!createBank && account_no">
|
||||
<button class="btn btn-sm h-100 btn-primary b-rad-none all-caps" @click="createBank = !createBank; dropdownStatus = false">
|
||||
<i class="fa fa-plus m-r-5"></i>
|
||||
Create New
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" v-show="createBank || isEditing">
|
||||
<div class="col">
|
||||
<bank-account-form-component v-if="data.serviceType.id !== 4"
|
||||
section="bookingEditRecipientDetailSection"
|
||||
:data="Object.keys(parameters.bankAccount).length ? parameters.bankAccount : {account_no: account_no, company_id: data.company.id, country_id: 2, account_type: 2}"
|
||||
:company_id="data.company.id"
|
||||
:country_id="2" :type="2"
|
||||
:currency="data.serviceType.selectedCurrency.short_code"
|
||||
:serviceType="data.serviceType"
|
||||
:closable=false
|
||||
:isEditing="isEditing"
|
||||
v-on:createdBank="updateBank($event)"
|
||||
v-on:updatedBankDetails="updatedBankDetails"
|
||||
v-on:close="clearAccount()">
|
||||
</bank-account-form-component>
|
||||
<phone-account-form-component v-if="data.serviceType.id === 4"
|
||||
section="bookingEditRecipientDetailSection"
|
||||
:data="Object.keys(parameters.bankAccount).length ? parameters.bankAccount : {account_no: account_no, company_id: data.company.id, country_id: 2, account_type: 2}"
|
||||
:company_id="data.company.id"
|
||||
:country_id="2" :type="2"
|
||||
:serviceType="data.serviceType"
|
||||
:closable=false
|
||||
:isEditing="isEditing"
|
||||
v-on:createdBank="updateBank($event)"
|
||||
v-on:updatedBankDetails="updatedBankDetails"
|
||||
v-on:close="clearAccount()">
|
||||
</phone-account-form-component>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<update-booking-component section="bookingEditRecipientDetailSection" :data="data" v-if="parameters" v-on:updatedBooking="updatedBankDetails($event)" v-on:updateBookingCanceled="cancelUpdate()"></update-booking-component>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import FormHandler from '../../../general/mixins/formHandler';
|
||||
// import UpdateBookingComponent from "../forms/UpdateBookingComponent";
|
||||
export default {
|
||||
// components: {UpdateBookingComponent},
|
||||
data(){
|
||||
return {
|
||||
createBank: false,
|
||||
isEditing: true,
|
||||
recipientBanks: [],
|
||||
dropdownStatus: false,
|
||||
account_no: '',
|
||||
}
|
||||
},
|
||||
created(){
|
||||
this.recipientBanks = this.data.recipientBanks;
|
||||
},
|
||||
methods: {
|
||||
AccountNumber(bank){
|
||||
return bank.account_no.startsWith(this.account_no)
|
||||
},
|
||||
updateBank(bank){
|
||||
this.selectBank(bank);
|
||||
this.recipientBanks.push(bank);
|
||||
this.parameters.bankAccount = bank;
|
||||
this.parameters.bankAccountDefault = bank;
|
||||
},
|
||||
updatedBankDetails(bank, transactionId){
|
||||
this.parameters.bankAccount = bank;
|
||||
this.parameters.bankAccountDefault = bank;
|
||||
|
||||
var foundIndex = this.recipientBanks.findIndex(x => x.id == bank.id);
|
||||
this.recipientBanks[foundIndex] = bank;
|
||||
|
||||
this.$emit('updatedBankDetails', bank, transactionId);
|
||||
},
|
||||
selectBank(bank){
|
||||
this.account_no = bank.account_no;
|
||||
this.isEditing = true;
|
||||
this.createBank = false;
|
||||
this.parameters.bankAccount = bank;
|
||||
this.dropdownStatus = false;
|
||||
},
|
||||
clearAccount(){
|
||||
this.createBank = false;
|
||||
this.isEditing = false;
|
||||
this.account_no = '';
|
||||
this.parameters.bankAccount = {};
|
||||
},
|
||||
cancelUpdate(){
|
||||
this.parameters.bankAccount = this.parameters.bankAccountDefault;
|
||||
this.isEditing = true;
|
||||
this.createBank = false;
|
||||
}
|
||||
},
|
||||
mixins: [FormHandler]
|
||||
}
|
||||
</script>
|
||||
+26
-3
@@ -16,6 +16,12 @@
|
||||
<date-picker-component :parameters="parameters" v-model.lazy="parameters.endDate"></date-picker-component>
|
||||
</validation-wrapper-component>
|
||||
</div>
|
||||
<div class="col-12 col-md mb-2 mb-md-0 p-l-3 p-r-3 p-md-0">
|
||||
<validation-wrapper-component selectable :validator="$v.parameters.reportType">
|
||||
<label class="all-caps">Report Type</label>
|
||||
<select-component :options="['Payments Report', 'Wallets Report', 'White Form Report']" v-model="parameters.reportType"></select-component>
|
||||
</validation-wrapper-component>
|
||||
</div>
|
||||
<div class="col-12 col-md-auto p-l-3 p-r-3 p-md-0">
|
||||
<div class="btn btn-lg btn-primary fs-11 w-100 h-100 d-flex justify-content-center align-items-center" @click="downloadReport()">
|
||||
<span>
|
||||
@@ -46,9 +52,20 @@ export default {
|
||||
parameters: {
|
||||
startDate: '',
|
||||
endDate: '',
|
||||
reportType: '',
|
||||
},
|
||||
}
|
||||
},
|
||||
mounted(){
|
||||
switch(this.section) {
|
||||
case 'paymentsReportSection':
|
||||
this.parameters.reportType = 'Payments Report'
|
||||
break;
|
||||
case 'walletsReportSection':
|
||||
this.parameters.reportType = 'Wallets Report'
|
||||
break;
|
||||
}
|
||||
},
|
||||
validations: {
|
||||
parameters: {
|
||||
startDate: {
|
||||
@@ -57,19 +74,25 @@ export default {
|
||||
endDate: {
|
||||
required
|
||||
},
|
||||
reportType: {
|
||||
required
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
downloadReport(){
|
||||
var apiRoute = '';
|
||||
if(!this.validate()){ return; }
|
||||
switch(this.section) {
|
||||
case 'paymentsReportSection':
|
||||
switch(this.parameters.reportType) {
|
||||
case 'Payments Report':
|
||||
apiRoute = route('paymentTransactions.export');
|
||||
break;
|
||||
case 'walletsReportSection':
|
||||
case 'Wallets Report':
|
||||
apiRoute = route('walletTransactions.export');
|
||||
break;
|
||||
case 'White Form Report':
|
||||
apiRoute = route('whiteFormTransactions.export');
|
||||
break;
|
||||
}
|
||||
window.open(apiRoute + '?startDate=' + this.parameters.startDate + '&endDate=' + this.parameters.endDate, '_blank');
|
||||
},
|
||||
|
||||
+4
-4
@@ -4,25 +4,25 @@
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<div class="row m-l-0 m-r-0">
|
||||
<div class="col mb-2 mb-md-0 p-l-3 p-r-3 p-md-0">
|
||||
<div class="col-12 col-md mb-2 mb-md-0 p-l-3 p-r-3 p-md-0">
|
||||
<validation-wrapper-component selectable :validator="$v.parameters.supplier">
|
||||
<label>Supplier</label>
|
||||
<selectable-component :disableOnFetch="true" :endpoint="route('api.company.list') + '?filters=' + JSON.stringify({'business_type': 3, 'status_in': [1, 2, 0]})" section="exportSupplierFilterSection" valueColumn="id" :labelColumn="['name']" v-model="parameters.supplier"></selectable-component>
|
||||
</validation-wrapper-component>
|
||||
</div>
|
||||
<div class="col mb-2 mb-md-0 p-l-3 p-r-3 p-md-0">
|
||||
<div class="col-12 col-md mb-2 mb-md-0 p-l-3 p-r-3 p-md-0">
|
||||
<validation-wrapper-component :validator="$v.parameters.startDate">
|
||||
<label class="all-caps">Start Date</label>
|
||||
<date-picker-component :parameters="parameters" v-model.lazy="parameters.startDate"></date-picker-component>
|
||||
</validation-wrapper-component>
|
||||
</div>
|
||||
<div class="col mb-2 mb-md-0 p-l-3 p-r-3 p-md-0">
|
||||
<div class="col-12 col-md mb-2 mb-md-0 p-l-3 p-r-3 p-md-0">
|
||||
<validation-wrapper-component :validator="$v.parameters.endDate">
|
||||
<label class="all-caps">End Date</label>
|
||||
<date-picker-component :parameters="parameters" v-model.lazy="parameters.endDate"></date-picker-component>
|
||||
</validation-wrapper-component>
|
||||
</div>
|
||||
<div class="col-auto p-l-3 p-r-3 p-md-0">
|
||||
<div class="col-12 col-md-auto p-l-3 p-r-3 p-md-0">
|
||||
<div class="btn btn-lg btn-primary fs-11 w-100 h-100 d-flex justify-content-center align-items-center" @click="bulkDownloadWhiteForm()">
|
||||
<span>
|
||||
Export
|
||||
|
||||
@@ -0,0 +1,89 @@
|
||||
<template>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="row m-b-10">
|
||||
<div class="col">
|
||||
<h5 class="all-caps m-b-5 bold no-margin">Edit Transaction Group Fee</h5>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row m-b-5 animate__animated animate__fadeInUpBig animate__fast" v-if="error">
|
||||
<div class="col">
|
||||
<small class="bold fs-10 text-danger">{{error}}</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row m-b-10">
|
||||
<div class="col p-r-0">
|
||||
<validation-wrapper-component :validator="$v.parameters.group_transfer_fee">
|
||||
<label class="all-caps">Transfer Fee</label>
|
||||
<input type="text" class="form-control" v-model.lazy="parameters.group_transfer_fee" v-money="{decimal: '.',thousands: ',', precision: 2}">
|
||||
</validation-wrapper-component>
|
||||
</div>
|
||||
<div class="col-auto b-r b-t b-b b-grey">
|
||||
<div class="row h-100 align-items-center">
|
||||
<div class="col">
|
||||
<div class="font-heading fs-10 muted">CNY</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col p-r-5">
|
||||
<div class="btn btn-sm btn-default bg-master-lightest btn-block b-rad-none" data-dismiss="modal">Cancel</div>
|
||||
</div>
|
||||
<div class="col p-l-5">
|
||||
<div class="btn btn-sm btn-success btn-block b-rad-none" @click="submitForm()">Update</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { required } from "vuelidate/lib/validators";
|
||||
import ModalFormHandler from '../../../general/mixins/modalFormHandler';
|
||||
|
||||
export default {
|
||||
props: {
|
||||
transfer_fee:{
|
||||
type: Number,
|
||||
required: true
|
||||
},
|
||||
id: {
|
||||
type: Number,
|
||||
required: true
|
||||
},
|
||||
rate:{
|
||||
type: Number,
|
||||
required: true
|
||||
},
|
||||
supplier_id: {
|
||||
type: Number,
|
||||
required: true
|
||||
},
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
error: '',
|
||||
parameters: {
|
||||
supplier_id: this.supplier_id,
|
||||
rate: this.rate,
|
||||
group_transfer_fee: (Math.round((this.transfer_fee + Number.EPSILON) * 100) / 100).toFixed(2)
|
||||
},
|
||||
}
|
||||
},
|
||||
validations: {
|
||||
parameters: {
|
||||
group_transfer_fee: { },
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
submitForm() {
|
||||
this.submit(route('api.transaction.group.update', this.id), 'put', this.section, true, true);
|
||||
}
|
||||
},
|
||||
mixins: [ModalFormHandler]
|
||||
}
|
||||
</script>
|
||||
@@ -76,7 +76,7 @@
|
||||
fetchVouchers(){
|
||||
this.isLoading = true;
|
||||
if(this.employee){
|
||||
this.submit(route('api.voucher.user.list') + '?filters=' + JSON.stringify( { 'has_active_reward': this.employee.id} ), 'get', this.section, false, false);
|
||||
this.submit(route('api.voucher.user.list') + '?filters=' + JSON.stringify( { 'has_vouchers_all_with_company': this.employee.id} ), 'get', this.section, false, false);
|
||||
}
|
||||
},
|
||||
successHandler(response){
|
||||
|
||||
@@ -13,7 +13,7 @@
|
||||
<download-supplier-white-form-component section="paymentsReportSection" ></download-supplier-white-form-component>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="row m-b-20">
|
||||
<div class="col-12 col-md-6">
|
||||
<div class="row">
|
||||
<div class="col p-l-0">
|
||||
|
||||
@@ -4,12 +4,12 @@
|
||||
<div class="row" v-if="!item.transaction_bill">
|
||||
<div class="col">
|
||||
<div class="row">
|
||||
<div class="col p-t-10 p-b-10 p-r-0 pointer" @click="clickExpand()" :class="[{'bg-master-lighter': item.status === 1 && item.type !== 6}, {'bg-white': item.status !== 1 && item.status !== 4}, {'bg-warning-lighter': item.type === 6}]">
|
||||
<div class="col p-t-10 p-b-10 p-r-0 pointer" @click="clickExpand()" :class="[{'bg-master-lighter': item.status === 1 && item.type !== 6}, {'bg-white': item.status !== 1 && item.status !== 4}, {'bg-warning-lighter': item.status === 7}, {'bg-warning-lighter': item.type === 6}]">
|
||||
<div class="row m-b-5">
|
||||
<div class="col-auto">
|
||||
<div class="font-heading fs-8 muted all-caps">Status</div>
|
||||
<div class="font-heading fs-10 bold" v-if="item.type === 1" :class="[{'text-danger': item.status === 1 || item.status === 4}, {'text-success': item.status !== 1 && item.status !== 4}]">
|
||||
{{ item.status === 1 ? 'Pending Verification' : item.status === 4 ? 'Rejected' : 'Processing Payment'}}
|
||||
<div class="font-heading fs-10 bold" v-if="item.type === 1" :class="[{'text-danger': item.status === 1 || item.status === 4}, {'text-success': item.status !== 1 && item.status !== 4 && item.status !== 7}, {'text-danger': item.status === 7}]">
|
||||
{{ item.status === 7 ? 'Refunded' : (item.status === 1 ? 'Pending Verification' : item.status === 4 ? 'Rejected' : 'Payment Approved')}}
|
||||
</div>
|
||||
<div class="font-heading fs-10 bold" v-if="item.type === 6" :class="[{'text-danger': item.status === 1 || item.status === 4}, {'text-success': item.status !== 1 && item.status !== 4}]">
|
||||
{{ item.status === 1 ? 'Pending Verification' : item.status === 4 ? 'Rejected' : 'Processing Payment'}}
|
||||
@@ -18,13 +18,13 @@
|
||||
<div class="col-auto p-l-0">
|
||||
<div class="font-heading fs-8 muted all-caps">Payment Amount</div>
|
||||
<div class="font-heading fs-10 bold">
|
||||
{{item.currency.short_code}} {{(Math.round((item.amount + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}
|
||||
{{item.original_currency.short_code}} {{(Math.round((item.original_amount - item.refunded_amount + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto p-l-0" v-if="totalRefunds !== 0">
|
||||
<div class="font-heading fs-8 muted all-caps">Refunded Amount</div>
|
||||
<div class="font-heading fs-10 bold text-danger">
|
||||
{{item.original_currency.short_code}} {{(Math.round((totalRefunds + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}
|
||||
{{item.original_currency.short_code}} {{(Math.round((item.refunded_amount + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -33,13 +33,19 @@
|
||||
<div class="font-heading fs-8 all-caps" :class="[{'text-danger': item.status === 4}, {'text-primary': item.status !== 4}]">{{ item.status === 2 ? 'Received' : item.status === 4 ? 'Rejected' : 'Submitted'}} On: {{item.updated_at}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" v-if="$store.getters.isSuperAdmin">
|
||||
<div class="col">
|
||||
<div class="font-heading fs-8 all-caps">Payment Method: {{ convertPaymentMethod(item.payment_method) }}</div>
|
||||
<div class="font-heading fs-8 all-caps">Payment Date: {{ item.created_at }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" v-if="$store.getters.isAdmin && item.bill_no">
|
||||
<div class="col">
|
||||
<div class="font-heading fs-8 all-caps m-t-5">Bill Number: <b>{{ item.bill_no }}</b></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto" v-if="item.status !== 3" :class="[{'bg-master-light': item.status === 1 && item.type !== 6}, {'bg-master-lighter': item.status === 2}, {'bg-warning-light': item.type === 6}]">
|
||||
<div class="col-auto" v-if="item.status !== 3" :class="[{'bg-master-light': item.status === 1 && item.type !== 6}, {'bg-master-lighter': item.status === 2}, {'bg-warning-lighter': item.status === 7}, {'bg-warning-light': item.type === 6}]">
|
||||
<div class="row align-items-center h-100" v-if="item.status !== 1 || item.payment_method !== 5">
|
||||
<div class="col">
|
||||
<i class="fa" :class="[{'fa-cloud-download': item.status === 1 || item.status === 2}, {'fa-ban': item.status === 4}, {'muted': item.status === 1 || item.status === 2}, {'text-danger': item.status === 4}]"></i>
|
||||
@@ -61,22 +67,20 @@
|
||||
<div class="row m-b-5">
|
||||
<div class="col-auto">
|
||||
<div class="font-heading fs-8 muted all-caps">Status</div>
|
||||
<div class="font-heading fs-10 bold" :class="[{'text-danger': item.transaction_bill.status === 1 || item.transaction_bill.status === 4}, {'text-success': item.transaction_bill.status !== 1 && item.transaction_bill.status !== 4}]">
|
||||
<div class="font-heading fs-10 bold" :class="[{'text-success': item.transaction_bill.status !== 4}, {'text-success': item.transaction_bill.status !== 1 && item.transaction_bill.status !== 4}]">
|
||||
{{ item.transaction_bill.status === 1 ? 'Processing Payment' : 'Transferred'}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto p-l-0">
|
||||
<div class="font-heading fs-8 muted all-caps">Payment Amount</div>
|
||||
<div class="font-heading fs-10 bold">
|
||||
{{item.original_currency.short_code}} {{(Math.round((item.original_amount + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}
|
||||
{{item.original_currency.short_code}} {{(Math.round((item.original_amount - item.refunded_amount + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="row align-items-end m-b-10 bold text-danger" v-if="totalRefunds !== 0">
|
||||
<div class="col">
|
||||
<div class="font-heading all-caps fs-10">Refunded Amount</div>
|
||||
</div>
|
||||
<div class="col-auto text-right">
|
||||
<div class="font-heading fs-12">{{item.original_currency.short_code}} {{(Math.round((totalRefunds + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}</div>
|
||||
<div class="col-auto p-l-0 text-danger" v-if="totalRefunds !== 0">
|
||||
<div class="font-heading fs-8 muted all-caps">Refunded Amount</div>
|
||||
<div class="font-heading fs-10 bold">
|
||||
{{item.original_currency.short_code}} {{(Math.round((totalRefunds + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto" v-if="$store.getters.isAdmin">
|
||||
@@ -133,7 +137,13 @@
|
||||
<div class="font-heading all-caps fs-10">Requested Refund Amount</div>
|
||||
</div>
|
||||
<div class="col-auto text-right">
|
||||
<div class="font-heading fs-10">{{item.currency.short_code}} {{(Math.round((totalRequestedRefund + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}</div>
|
||||
<div class="font-heading fs-10">{{item.original_currency.short_code}} {{(Math.round((totalRequestedRefund + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row align-items-end m-b-10 bold text-danger" v-if="totalRequestedRefund != 0">
|
||||
<div class="col"></div>
|
||||
<div class="col-auto text-right">
|
||||
<div class="font-heading fs-10">{{item.currency.short_code}} {{(Math.round((totalRequestedConvertRefund + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row align-items-end m-b-10 bold text-danger" v-if="totalRefunds != 0">
|
||||
@@ -141,7 +151,13 @@
|
||||
<div class="font-heading all-caps fs-10">Refunded Amount</div>
|
||||
</div>
|
||||
<div class="col-auto text-right">
|
||||
<div class="font-heading fs-12">{{item.original_currency.short_code}} {{(Math.round((totalRefunds + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}</div>
|
||||
<div class="font-heading fs-10">{{item.original_currency.short_code}} {{(Math.round((totalRefunds + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row align-items-end m-b-10 bold text-danger" v-if="totalRefunds != 0">
|
||||
<div class="col"></div>
|
||||
<div class="col-auto text-right">
|
||||
<div class="font-heading fs-10">{{item.currency.short_code}} {{(Math.round((totalConvertRefunds + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row align-items-end bold m-b-10 text-primary">
|
||||
@@ -187,6 +203,14 @@
|
||||
<div class="font-heading fs-12">MYR {{(Math.round((item.amount + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row align-items-end m-b-10 bold text-success" v-if="totalRefunds != 0">
|
||||
<div class="col">
|
||||
<div class="font-heading all-caps fs-10">Your Payment After Refund</div>
|
||||
</div>
|
||||
<div class="col-auto text-right">
|
||||
<div class="font-heading fs-12">MYR {{(Math.round((item.amount - totalConvertRefunds + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="font-heading all-caps fs-10 m-b-5">Your Payment Proof</div>
|
||||
@@ -215,7 +239,7 @@
|
||||
<div class="font-heading all-caps fs-10 m-b-5">Our Payment Proof</div>
|
||||
<div class="row" v-if="item.transaction_bill">
|
||||
<div class="col">
|
||||
<div class="row" v-if="item.transaction_bill.status !== 2 && item.transaction_bill.status !== 3">
|
||||
<div class="row hide" v-if="item.transaction_bill.status !== 2 && item.transaction_bill.status !== 3">
|
||||
<div class="col">
|
||||
<p class="fs-12 muted">Payment proof will be uploaded {{ (parseFloat(item.interval.duration) + 1) <= 0 ? 'today' : (parseFloat(item.interval.duration) + 1) === 2 ? 'tomorrow' : 'in '+(parseFloat(item.interval.duration) + 1)+' days'}} at 4:00 PM</p>
|
||||
</div>
|
||||
@@ -271,14 +295,122 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row m-t-10" v-show="[2, 3].includes(item.status) && totalRequestedConvertRefund < data.booking.amount">
|
||||
<div class="col">
|
||||
<button class="btn btn-xs all-caps b-rad-none bg-master-lighter btn-block no-border requestModal hide" data-type="transferSummary">Request Refund</button>
|
||||
<div class="row m-t-10" v-show="[2, 3].includes(item.status) && (totalRequestedRefund + totalRefunds) < data.original_amount">
|
||||
<div class="col" v-if="$store.getters.isAdmin">
|
||||
<button class="btn btn-xs all-caps b-rad-none bg-master-lighter btn-block no-border requestModal" data-type="transferSummary">Request Refund</button>
|
||||
<modal-component class="animate__animated animate__fast animate__fadeIn" styleType="fill-in" type="transferSummary" size="large">
|
||||
<refund-confirmation-component :data="data" :section="section" :totalRefunds="totalRequestedRefund + totalRefunds"></refund-confirmation-component>
|
||||
</modal-component>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row m-t-10" v-if="data.transaction_refunds.length > 0">
|
||||
<div class="col">
|
||||
<button class="btn btn-xs all-caps b-rad-none bg-master-lighter btn-block no-border pointer" @click="clickExpandRefundTransactions">
|
||||
<div class="row justify-content-between">
|
||||
<div class="col-auto">
|
||||
<i class="fa" :class="[{'fa-angle-up': expandRefundTransactions}, {'fa-angle-down': !expandRefundTransactions}]"></i>
|
||||
</div>
|
||||
<div class="col">
|
||||
Show Refund Transactions
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<i class="fa" :class="[{'fa-angle-up': expandRefundTransactions}, {'fa-angle-down': !expandRefundTransactions}]"></i>
|
||||
</div>
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" v-if="data.transaction_refunds.length > 0 && expandRefundTransactions">
|
||||
<div class="col bg-white padding-15">
|
||||
<div class="b-b b-grey m-b-5" v-for="(refund, index) in data.transaction_refunds">
|
||||
<div class="row m-b-10 parentContainer">
|
||||
<div class="col-auto">
|
||||
<div class="font-heading fs-10 muted all-caps">Created At</div>
|
||||
<div class="font-heading fs-10">
|
||||
{{ refund.created_at }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<div class="font-heading fs-10 muted all-caps">Status</div>
|
||||
<div class="font-heading fs-10">
|
||||
<div class="font-heading fs-10 bold" :class="[{'text-warning': refund.status === 1}, {'text-success': refund.status === 2}, {'text-danger': refund.status === 4}]">{{ refund.status === 1 ? 'Pending Verification' : refund.status === 2 ? 'Approved' : 'Rejected'}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto" v-if="$store.getters.isAdmin">
|
||||
<span class="btn requestModal no-border" size="large" data-type="chatmodal">
|
||||
<i class="fa fa-comment-o"></i>
|
||||
</span>
|
||||
<modal-component class="animate__animated animate__fast animate__fadeIn" styleType="fill-in" type="chatmodal">
|
||||
<remark-component :section="section" :data="refund" module_type="Transaction"></remark-component>
|
||||
</modal-component>
|
||||
</div>
|
||||
<div class="col text-right">
|
||||
<div class="font-heading fs-10 muted all-caps">Amount</div>
|
||||
<div class="font-heading fs-10">
|
||||
<div class="font-heading fs-10">{{refund.currency.short_code}} {{(Math.round((refund.amount + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto text-right">
|
||||
<div class="font-heading fs-10 muted all-caps">Amount</div>
|
||||
<div class="font-heading fs-14 text-success bold">
|
||||
<div class="font-heading fs-10">{{refund.original_currency.short_code}} {{(Math.round((refund.original_amount + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row m-b-15 text-right parentContainer" v-if="$store.getters.isSuperAdmin && refund.status === 1">
|
||||
<div class="col">
|
||||
<button class="btn btn-xs btn-outline-danger b-rad-none m-r-5 requestModal" data-type="rejectRefund">
|
||||
<i class="fa fa-times fa-fw"></i>
|
||||
</button>
|
||||
<modal-component class="animate__animated animate__fast animate__fadeIn" type="rejectRefund">
|
||||
<general-confirmation-form-component
|
||||
contentText="Are you sure you want to reject this refund?"
|
||||
modalType="delete"
|
||||
class="text-center"
|
||||
:apiRoute="route('api.transaction.refund.status.update', refund.id, 4)"
|
||||
apiMethod="put"
|
||||
:section="section"
|
||||
>
|
||||
</general-confirmation-form-component>
|
||||
</modal-component>
|
||||
|
||||
<button class="btn btn-xs btn-outline-primary b-rad-none m-r-5 requestModal" data-type="approveRefund">
|
||||
<i class="fa fa-check fa-fw"></i>
|
||||
</button>
|
||||
<modal-component class="animate__animated animate__fast animate__fadeIn" type="approveRefund">
|
||||
<general-confirmation-form-component
|
||||
contentText="Are you sure you want to approve this refund?"
|
||||
modalType="confirm"
|
||||
class="text-center"
|
||||
:apiRoute="route('api.transaction.refund.status.update', refund.id, 2)"
|
||||
apiMethod="put"
|
||||
:section="section"
|
||||
>
|
||||
</general-confirmation-form-component>
|
||||
</modal-component>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row m-b-15 text-right parentContainer" v-if="$store.getters.isSuperAdmin && refund.status === 2">
|
||||
<div class="col">
|
||||
<button class="btn btn-xs btn-outline-danger b-rad-none m-r-5 requestModal" data-type="deleteRefund">
|
||||
<i class="fa fa-times fa-fw"></i>
|
||||
</button>
|
||||
<modal-component class="animate__animated animate__fast animate__fadeIn" type="deleteRefund">
|
||||
<general-confirmation-form-component
|
||||
contentText="Are you sure you want to delete this refund?"
|
||||
modalType="delete"
|
||||
class="text-center"
|
||||
:apiRoute="route('api.transaction.refund.delete', refund.id)"
|
||||
apiMethod="delete"
|
||||
:section="section"
|
||||
>
|
||||
</general-confirmation-form-component>
|
||||
</modal-component>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -291,6 +423,7 @@
|
||||
data(){
|
||||
return {
|
||||
expandPaymentDetails: false,
|
||||
expandRefundTransactions: false,
|
||||
amount: (Math.round(1000 * 100) / 100).toFixed(2),
|
||||
parameters: {
|
||||
amount: (Math.round(1000 * 100) / 100).toFixed(2),
|
||||
@@ -313,12 +446,12 @@
|
||||
let vm = this;
|
||||
var TotalRequestedRefund = 0;
|
||||
this.data.transaction_refunds.forEach(function(refunds) {
|
||||
TotalRequestedRefund += refunds.status === 1 ? refunds.original_amount : 0;
|
||||
TotalRequestedRefund += refunds.status === 1 ? refunds.amount : 0;
|
||||
});
|
||||
if (vm.data.booking.fixed_currency.id != 1 && this.data.transaction_refunds[0]) {
|
||||
TotalRequestedRefund = (TotalRequestedRefund * this.data.transaction_refunds[0].currency_rate);
|
||||
}
|
||||
return ((Math.round((TotalRequestedRefund + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ","));
|
||||
// if (vm.data.booking.fixed_currency.id != 1 && this.data.transaction_refunds[0]) {
|
||||
// TotalRequestedRefund = (TotalRequestedRefund * this.data.transaction_refunds[0].currency_rate);
|
||||
// }
|
||||
return TotalRequestedRefund;
|
||||
},
|
||||
totalRefunds() {
|
||||
var TotalRequestedRefund = 0;
|
||||
@@ -326,11 +459,35 @@
|
||||
TotalRequestedRefund += refunds.status === 2 ? refunds.original_amount : 0;
|
||||
});
|
||||
return TotalRequestedRefund;
|
||||
},
|
||||
totalConvertRefunds() {
|
||||
var TotalRequestedRefund = 0;
|
||||
this.data.transaction_refunds.forEach(function(refunds) {
|
||||
TotalRequestedRefund += refunds.status === 2 ? refunds.amount : 0;
|
||||
});
|
||||
return TotalRequestedRefund;
|
||||
},
|
||||
hasRefundInProgress() {
|
||||
var refundTransactionsStatus = this.data.transaction_refunds.length > 0 ? this.data.transaction_refunds.map(refund => refund.status) : [];
|
||||
return refundTransactionsStatus.includes(0) || refundTransactionsStatus.includes(1)
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
clickExpand(){
|
||||
this.expandPaymentDetails = !this.expandPaymentDetails;
|
||||
this.expandRefundTransactions = false;
|
||||
},
|
||||
clickExpandRefundTransactions(){
|
||||
this.expandRefundTransactions = !this.expandRefundTransactions;
|
||||
},
|
||||
convertPaymentMethod(paymentMethod){
|
||||
var paymentMethodArray = [];
|
||||
paymentMethodArray[1] = 'Cash';
|
||||
paymentMethodArray[2] = 'Cheque';
|
||||
paymentMethodArray[3] = 'ba';
|
||||
paymentMethodArray[4] = 'Wallet';
|
||||
paymentMethodArray[5] = 'Payment Gateway';
|
||||
return paymentMethodArray[paymentMethod];
|
||||
},
|
||||
},
|
||||
mixins: [componentHandler]
|
||||
|
||||
@@ -3,67 +3,61 @@
|
||||
<div class="col bg-white padding-25">
|
||||
<div class="row p-b-10">
|
||||
<div class="col">
|
||||
<div class="row m-b-5">
|
||||
<div class="col">
|
||||
<div class="font-heading all-caps bold fs-10">Request Refund</div>
|
||||
<div class="font-heading all-caps bold fs-10">Request Refund</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row m-b-10">
|
||||
<div class="col-7">
|
||||
<div class="font-heading all-caps fs-10 m-b-5">Refund Type:</div>
|
||||
<div class="row p-l-15">
|
||||
<div v-for="(method, index) in refundMethods" :key="index"
|
||||
class="col p-t-20 p-b-20 bg-master-lightest text-center b-grey pointer"
|
||||
:class="{ 'bg-complete text-white': method.name === refundMethod.name }"
|
||||
@click="updateRefundType(method)">
|
||||
{{ method.name }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="row m-r-0 m-b-10" v-if="refundMethod.name === 'Partially Refund'">
|
||||
<div class="col">
|
||||
<div class="row">
|
||||
<validation-wrapper-component :validator="$v.refundAmount">
|
||||
<label>Amount</label>
|
||||
<input class="form-control" name="amount" v-model="refundAmount"
|
||||
:disabled="refundMethod.name === 'Fully Refund'" v-money="moneyV2">
|
||||
</validation-wrapper-component>
|
||||
</div>
|
||||
<div class="col-auto b-r b-t b-b b-grey">
|
||||
<div class="row h-100 align-items-center">
|
||||
<div class="col">
|
||||
<div class="row m-b-10">
|
||||
<div class="col">
|
||||
<div class="row parentContainer">
|
||||
<div class="col">
|
||||
<div class="row" >
|
||||
<div class="col-7 p-r-0">
|
||||
<div class="row m-b-10">
|
||||
<div class="col">
|
||||
<div class="font-heading all-caps fs-10 m-b-5">Refund Type: </div>
|
||||
<div class="row p-l-15">
|
||||
<div class="col p-t-20 p-b-20 bg-master-lightest text-center b-grey pointer" :class="[{'bg-complete': refundMethod.name === 'Fully Refund'}, {'text-white': refundMethod.name === 'Fully Refund'}]" @click="updateRefundType({name: 'Fully Refund'})">
|
||||
Full Refund
|
||||
</div>
|
||||
<div class="col p-t-20 p-b-20 bg-master-lightest text-center b-grey pointer" :class="[{'bg-complete': refundMethod.name === 'Partially Refund'}, {'text-white': refundMethod.name === 'Partially Refund'}]" @click="updateRefundType({name: 'Partially Refund'})">
|
||||
Partial Refund
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row m-r-0 m-b-10" v-if="refundMethod.name === 'Partially Refund'">
|
||||
<div class="col p-r-0">
|
||||
<validation-wrapper-component :validator="$v.refundAmount">
|
||||
<label>Amount</label>
|
||||
<input class="form-control" name="amount" v-model="refundAmount" :disabled="refundMethod.name == 'Fully Refund'" v-money="moneyV2">
|
||||
</validation-wrapper-component>
|
||||
</div>
|
||||
<div class="col-auto b-r b-t b-b b-grey">
|
||||
<div class="row h-100 align-items-center">
|
||||
<div class="col">
|
||||
<div class="font-heading fs-10 muted">{{data.booking.fixed_currency.short_code}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="font-heading fs-10 muted">{{ data.booking.fixed_currency.short_code }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row m-t-5 m-b-5">
|
||||
<div class="col">
|
||||
<validation-wrapper-component :validator="$v.refundRemark">
|
||||
<label>Refund Remarks</label>
|
||||
<input class="form-control" name="amount" v-model="refundRemark" >
|
||||
</validation-wrapper-component>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row m-t-10 m-b-10">
|
||||
<div class="col">
|
||||
<div class="font-heading all-caps fs-10 m-b-5">Paid Amount: {{ paidAmount }}</div>
|
||||
<div class="font-heading all-caps fs-10 m-b-5" v-if="this.data.refunded_amount > 0">Refunded Amount: {{ (Math.round((this.data.refunded_amount + Number.EPSILON) * 100) / 100).toFixed(2) }}</div>
|
||||
<div class="font-heading all-caps fs-10 m-b-5">Refund Amount Requested: {{ refundAmount }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-auto">
|
||||
<button class="btn btn-lg btn-default bg-master-lightest b-rad-none all-caps fs-12" data-dismiss="modal">Cancel</button>
|
||||
<button class="btn btn-lg btn-default bg-master-lightest b-rad-none all-caps fs-12"
|
||||
data-dismiss="modal">Cancel</button>
|
||||
</div>
|
||||
<div class="col text-right">
|
||||
<button class="btn btn-lg btn-success b-rad-none all-caps fs-12" @click="submitForm()">Confirm & Proceed</button>
|
||||
<button class="btn btn-lg btn-success b-rad-none all-caps fs-12" @click="submitForm()">Confirm &
|
||||
Proceed</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -71,47 +65,59 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import FormHandler from '../../../general/mixins/formHandler';
|
||||
import ModalFormHandler from '../../../general/mixins/modalFormHandler';
|
||||
import { required, maxValue } from "vuelidate/lib/validators";
|
||||
export default {
|
||||
props: {
|
||||
totalRefunds:{
|
||||
type: Number,
|
||||
default: 0,
|
||||
import FormHandler from '../../../general/mixins/formHandler';
|
||||
import ModalFormHandler from '../../../general/mixins/modalFormHandler';
|
||||
import { maxValue, required } from "vuelidate/lib/validators";
|
||||
|
||||
export default {
|
||||
props: {
|
||||
totalRefunds: {
|
||||
type: Number,
|
||||
default: 0,
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
refundAmount: (Math.round((this.data.original_amount - this.data.refunded_amount + Number.EPSILON) * 100) / 100).toFixed(2),
|
||||
refundRemark: '',
|
||||
refundMethod: { name: 'Fully Refund', status: false },
|
||||
refundMethods: [
|
||||
{ name: 'Fully Refund', label: 'Full Refund' },
|
||||
{ name: 'Partially Refund', label: 'Partial Refund' }
|
||||
]
|
||||
}
|
||||
},
|
||||
validations() {
|
||||
return {
|
||||
refundAmount: {
|
||||
maxValue: maxValue(this.refundMaxValue)
|
||||
},
|
||||
refundRemark: {
|
||||
required
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
refundMaxValue() {
|
||||
return (Math.round((this.data.original_amount - this.data.refunded_amount + Number.EPSILON) * 100) / 100).toFixed(2);
|
||||
},
|
||||
paidAmount() {
|
||||
return this.data.original_amount;
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
submitForm() {
|
||||
this.parameters.amount = this.refundAmount;
|
||||
this.parameters.refundRemark = this.refundRemark;
|
||||
this.submit(this.route('api.booking.refund.create', this.data.booking.id, this.data.id), 'post', this.section, true, true)
|
||||
},
|
||||
updateRefundType(refund) {
|
||||
this.refundMethod = { ...refund, status: !this.refundMethod.status };
|
||||
if (this.refundMethod.name === 'Fully Refund') {
|
||||
this.refundAmount = this.refundMaxValue;
|
||||
}
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
refundAmount: (Math.round((this.data.booking.amount - this.totalRefunds + Number.EPSILON) * 100) / 100).toFixed(2),
|
||||
refundMethod: {
|
||||
name: 'Partially Refund',
|
||||
status: false
|
||||
},
|
||||
refundMaxValue: (Math.round((this.data.booking.amount - this.totalRefunds + Number.EPSILON) * 100) / 100).toFixed(2),
|
||||
}
|
||||
},
|
||||
validations() {
|
||||
return {
|
||||
refundAmount: {
|
||||
// required,
|
||||
maxValue: maxValue(this.refundMaxValue)
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
submitForm(){
|
||||
this.parameters.amount = this.refundAmount;
|
||||
this.submit(this.route('api.booking.refund.create', this.data.booking.id, this.data.id), 'post', this.section, true, true)
|
||||
},
|
||||
updateRefundType(refund){
|
||||
this.refundMethod = {
|
||||
name: refund.name,
|
||||
status: !this.refundMethod.status
|
||||
}
|
||||
this.refundMethod.name === 'Fully Refund' ? this.refundAmount = this.refundMaxValue : '';
|
||||
},
|
||||
},
|
||||
mixins: [FormHandler, ModalFormHandler]
|
||||
}
|
||||
</script>
|
||||
},
|
||||
mixins: [FormHandler, ModalFormHandler]
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -25,6 +25,14 @@
|
||||
<a :href="route('customer.profile', data.booking.company.reference)">{{data.booking.company.reference}}</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto" v-if="$store.getters.isAdmin">
|
||||
<span class="btn requestModal no-border" size="large" data-type="chatmodal">
|
||||
<i class="fa fa-comment-o"></i>
|
||||
</span>
|
||||
<modal-component class="animate__animated animate__fast animate__fadeIn" styleType="fill-in" type="chatmodal">
|
||||
<remark-component :section="section" :data="data" module_type="Transaction"></remark-component>
|
||||
</modal-component>
|
||||
</div>
|
||||
<div class="col text-right">
|
||||
<div class="font-heading fs-10 muted all-caps">Amount</div>
|
||||
<div class="font-heading fs-14 text-success bold">
|
||||
@@ -34,7 +42,7 @@
|
||||
</div>
|
||||
<div class="row m-b-10">
|
||||
<div class="col">
|
||||
<div class="text-right">
|
||||
<div class="text-right" v-if="$store.getters.isSuperAdmin">
|
||||
<button class="btn btn-xs btn-outline-danger b-rad-none m-r-5 requestModal" data-type="rejectRefund">
|
||||
<i class="fa fa-times fa-fw"></i>
|
||||
</button>
|
||||
@@ -115,7 +123,7 @@
|
||||
approveRefund(status){
|
||||
this.isLoading = true;
|
||||
this.parameters.status = status;
|
||||
this.submit(this.route('api.transaction.refund.status.update', this.data.id), 'put', 'listRefundTransactionSection', true, true);
|
||||
this.submit(this.route('api.transaction.refund.status.update', this.data.id, status), 'put', 'listRefundTransactionSection', true, true);
|
||||
},
|
||||
},
|
||||
mixins: [componentHandler, staticFormHandler]
|
||||
|
||||
+21
-2
@@ -56,6 +56,16 @@
|
||||
<span class="flag-icon" :class="'flag-icon-'+item.original_currency.country.short_code.toLowerCase()"></span> {{item.original_currency.short_code}}
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="col text-right" v-if="totalRefunds !== 0">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="font-heading fs-10 muted all-caps">Refunded Amount</div>
|
||||
<div class="font-heading fs-14 text-danger bold">
|
||||
{{(Math.round((totalRefunds + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-auto">
|
||||
@@ -95,7 +105,7 @@
|
||||
<div class="col text-right">
|
||||
<div class="font-heading fs-10 muted all-caps">Amount</div>
|
||||
<div class="font-heading fs-14 text-success bold">
|
||||
{{(Math.round((item.original_amount + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}
|
||||
{{(Math.round((item.original_amount - totalRefunds + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -124,11 +134,20 @@
|
||||
active: false,
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
totalRefunds() {
|
||||
var TotalRequestedRefund = 0;
|
||||
this.data.transaction_refunds.forEach(function(refunds) {
|
||||
TotalRequestedRefund += refunds.status === 2 ? refunds.original_amount : 0;
|
||||
});
|
||||
return TotalRequestedRefund;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
activate(){
|
||||
this.active = !this.active;
|
||||
this.$emit('input', this.item)
|
||||
}
|
||||
},
|
||||
},
|
||||
mixins: [componentHandler]
|
||||
}
|
||||
|
||||
@@ -0,0 +1,98 @@
|
||||
<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 align-items-center p-b-5 b-b b-grey" :class="[{'pointer': clickable}]" v-show="!isLoading" @click="clickable ? activate() : undefined">
|
||||
<div class="col-auto p-r-0">
|
||||
<div class="b-grey b-a fs-10 btn-rounded icon-thumbnail icon-25 m-r-0" :class="[{'bg-primary': active}, {'bg-transparent': !active}]" v-if="clickable">
|
||||
<i class="fa fa-check text-white fs-12 fa-fw"></i>
|
||||
</div>
|
||||
<div style="width: 25px;" v-else></div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="row m-b-10">
|
||||
<div class="col-auto">
|
||||
<div class="font-heading fs-10 muted all-caps">Date</div>
|
||||
<div class="font-heading fs-10">
|
||||
{{item.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">
|
||||
<a :href="route('booking.details', item.booking.marking)">{{item.booking.marking}}</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col text-right">
|
||||
<div class="font-heading fs-10 muted all-caps">Amount</div>
|
||||
<div class="font-heading fs-14 text-success bold">
|
||||
{{item.currency.short_code}} {{((Math.round(( item.amount + Number.EPSILON) * 100) / 100)).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import componentHandler from '../../../general/mixins/componentHandler';
|
||||
import staticFormHandler from '../../../general/mixins/staticFormHandler'
|
||||
export default {
|
||||
props: {
|
||||
section:{
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
is1688Supplier:{
|
||||
type: Boolean,
|
||||
required: true
|
||||
},
|
||||
payments:{
|
||||
type: Array,
|
||||
required: true
|
||||
},
|
||||
paymentTotal: {
|
||||
type: Number,
|
||||
required: true
|
||||
},
|
||||
inputPaymentTotal: {
|
||||
type: Number,
|
||||
required: true
|
||||
},
|
||||
refundTotal: {
|
||||
type: Number,
|
||||
required: true
|
||||
},
|
||||
supplierRefunds:{
|
||||
type: Array,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
clickable(){
|
||||
if (this.is1688Supplier) {
|
||||
return this.refundTotal < this.inputPaymentTotal || this.supplierRefunds.some((i) => this.item.id === i.id );
|
||||
} else {
|
||||
return this.refundTotal < this.paymentTotal || this.supplierRefunds.some((i) => this.item.id === i.id );
|
||||
}
|
||||
}
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
active: this.item ? this.supplierRefunds.some(supplierRefund => supplierRefund.id === this.item.id) : false,
|
||||
}
|
||||
},
|
||||
created(){
|
||||
this.active = this.supplierRefunds.some(supplierRefund => supplierRefund.id === this.item.id);
|
||||
},
|
||||
methods: {
|
||||
activate(){
|
||||
this.active = !this.active;
|
||||
this.$emit('input', this.item)
|
||||
},
|
||||
},
|
||||
mixins: [componentHandler, staticFormHandler]
|
||||
}
|
||||
</script>
|
||||
@@ -17,6 +17,28 @@
|
||||
{{item.issuer_name}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="font-heading fs-10 muted all-caps text-right">Export</div>
|
||||
<div class="row parentcontainer">
|
||||
<div class="col d-flex justify-content-end">
|
||||
<a :href="route('group.text', item.id)" target="_blank" v-tooltip:top="'Export in Text'" class="m-l-5">
|
||||
<button class="btn btn-xs b-rad-none">
|
||||
<i class="fa fa-font"></i>
|
||||
</button>
|
||||
</a>
|
||||
<a :href="route('group.excel', item.id)" target="_blank" v-tooltip:top="'Export in Excel'" class="m-l-5">
|
||||
<button class="btn btn-xs b-rad-none">
|
||||
<i class="fa fa-file-excel-o"></i>
|
||||
</button>
|
||||
</a>
|
||||
<a :href="route('group.invoice', item.id)" target="_blank" v-tooltip:top="'Export Invoice PDF'" class="m-l-5">
|
||||
<button class="btn btn-xs b-rad-none">
|
||||
<i class="fa fa-list-alt"></i>
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-auto">
|
||||
@@ -79,11 +101,6 @@
|
||||
<div class="col-auto">
|
||||
<div class="row parentContainer">
|
||||
<div class="col p-l-0">
|
||||
<a :href="route('group.text', item.id)" target="_blank">
|
||||
<button class="btn btn-xs b-rad-none">
|
||||
<i class="fa fa-align-left"></i>
|
||||
</button>
|
||||
</a>
|
||||
<button class="btn btn-xs btn-complete b-rad-none">
|
||||
<i class="fa fa-refresh" @click="updateDo()"></i>
|
||||
</button>
|
||||
|
||||
+166
@@ -0,0 +1,166 @@
|
||||
<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 align-items-center pointer p-b-5 b-b b-grey" v-show="!isLoading" @click="activate($event)">
|
||||
<div class="col-auto p-r-0">
|
||||
<div class="b-grey b-a fs-10 btn-rounded icon-thumbnail icon-25 m-r-0" :class="[{'bg-primary': active}, {'bg-transparent': !active}]">
|
||||
<i class="fa fa-check text-white fs-12 fa-fw"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="row m-b-10">
|
||||
<div class="col-auto">
|
||||
<div class="font-heading fs-10 muted all-caps">Date</div>
|
||||
<div class="font-heading fs-10">
|
||||
{{item.created_at}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<div class="font-heading fs-10 muted all-caps">Supplier</div>
|
||||
<div class="font-heading fs-10">
|
||||
{{item.issuer_name}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-auto">
|
||||
<div class="font-heading fs-10 muted all-caps">Currency Rate</div>
|
||||
<div class="font-heading fs-10">
|
||||
{{item.currency_rate}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<div class="font-heading fs-10 muted all-caps">Currency Amount</div>
|
||||
<div class="font-heading fs-10">
|
||||
{{item.original_currency.short_code}} {{(Math.round((item.original_amount + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<div class="font-heading fs-10 muted all-caps">Transfer Fee</div>
|
||||
<div class="font-heading fs-10">
|
||||
{{item.original_currency.short_code}} {{(Math.round((item.transfer_fee + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col text-right">
|
||||
<div class="font-heading fs-10 muted all-caps">Amount</div>
|
||||
<div class="font-heading fs-14 text-success bold">
|
||||
{{item.currency.short_code}} {{((Math.round(( item.amount + Number.EPSILON) * 100) / 100)).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-auto">
|
||||
<div class="font-heading fs-10 muted all-caps">reference</div>
|
||||
<document-file-viewer-component v-if="item.documents.currency_order" :file="item.documents.currency_order.files[0]">
|
||||
<template slot="button">
|
||||
<button class="btn btn-xs btn-default bg-master-lightest b-rad-none no-border">
|
||||
<i class="fa fa-eye"></i>
|
||||
</button>
|
||||
</template>
|
||||
</document-file-viewer-component>
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="font-heading fs-10 muted all-caps">PO Completion</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-auto p-r-0" v-if="item.documents.purchase_order" >
|
||||
<document-file-viewer-component :file="item.documents.purchase_order.files[0]">
|
||||
<template slot="button">
|
||||
<button class="btn btn-xs btn-default bg-master-lightest b-rad-none no-border">
|
||||
<i class="fa fa-file-pdf-o"></i>
|
||||
</button>
|
||||
</template>
|
||||
</document-file-viewer-component>
|
||||
</div>
|
||||
<div class="col">
|
||||
<p class="font-heading fs-12 bold text-success pointer" @click="expand($event)"><span :class="[{'text-danger': item.complete_transactions.length !== item.transactions.length}]">{{item.complete_transactions.length}}</span>/{{item.transactions.length}}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<div class="row parentContainer">
|
||||
<div class="col p-l-0">
|
||||
<button class="btn btn-xs btn-primary b-rad-none requestModal" data-type="editTransactionGroup">
|
||||
Edit Transfer Fee
|
||||
</button>
|
||||
<div class="do-not-activate">
|
||||
<modal-component small type="editTransactionGroup">
|
||||
<edit-transfer-fee-form-component :section="section" :transfer_fee="item.transfer_fee" :id="item.id" :supplier_id="item.issuer_id" :rate="item.currency_rate"></edit-transfer-fee-form-component>
|
||||
</modal-component>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" v-if="expanded">
|
||||
<div class="col">
|
||||
<div class="row" v-for="transaction in item.transactions">
|
||||
<div class="col">
|
||||
<a :href="route('booking.details', transaction)" target="_blank">
|
||||
<span :class="[{'text-success': item.complete_transactions.includes(transaction)}, {'text-danger': !item.complete_transactions.includes(transaction)}]">{{ transaction }}</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import componentHandler from '../../../general/mixins/componentHandler';
|
||||
import staticFormHandler from '../../../general/mixins/staticFormHandler'
|
||||
export default {
|
||||
props: {
|
||||
section:{
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
payments:{
|
||||
type: Array,
|
||||
required: true
|
||||
},
|
||||
emptyPaymentList: {
|
||||
type: Function,
|
||||
required: true
|
||||
},
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
expanded: false,
|
||||
// active: this.item ? this.payments.some(payment => payment.id === this.item.id) : false,
|
||||
}
|
||||
},
|
||||
created(){
|
||||
// this.active = this.payments.some(payment => payment.id === this.item.id);
|
||||
},
|
||||
computed: {
|
||||
active() {
|
||||
return this.payments.some(payment => payment.id === this.item.id);
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
activate(event){
|
||||
if ((event.target.tagName.toLowerCase() === 'button' && event.target.getAttribute('data-type') === 'editTransactionGroup') || Boolean(event.target.closest('.do-not-activate'))) {
|
||||
this.emptyPaymentList();
|
||||
return;
|
||||
}
|
||||
// this.active = !this.active;
|
||||
this.$emit('input', this.item)
|
||||
},
|
||||
expand(event){
|
||||
this.expanded = !this.expanded;
|
||||
event.stopPropagation();
|
||||
}
|
||||
|
||||
},
|
||||
mixins: [componentHandler, staticFormHandler]
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,80 @@
|
||||
<template>
|
||||
<div class="row" @keyup.enter="submitForm">
|
||||
<div class="col">
|
||||
<loading-component style="height: 200px; top: 0;" key="1" color="success" v-show="$store.getters.isLoading(section)"></loading-component>
|
||||
<div class="row" v-show="!$store.getters.isLoading(section)">
|
||||
<div class="col">
|
||||
<div class="row m-b-10">
|
||||
<div class="col">
|
||||
<div class="font-heading fs-16 all-caps bold m-b-15">Payment Proof</div>
|
||||
</div>
|
||||
</div>
|
||||
<error-message-component class="m-b-20" :error="error"></error-message-component>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<file-input-component :validator="$v.files" v-model="files">
|
||||
<template slot="label">
|
||||
<div class="font-heading fs-11 text-primary all-caps">Payment Proof</div>
|
||||
</template>
|
||||
</file-input-component>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row m-t-20">
|
||||
<div class="col">
|
||||
<div class="row">
|
||||
<div class="col-auto">
|
||||
<button type="button" class="btn btn-sm bg-master-lighter p-t-10 p-b-10 p-r-35 p-l-35 btn-default b-rad-none" data-dismiss="modal">Cancel</button>
|
||||
</div>
|
||||
<div class="col text-right">
|
||||
<button type="button" class="btn btn-sm p-t-10 p-b-10 p-r-35 p-l-35 btn-success b-rad-none" @click="submitForm">Save and continue</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ModalFromHandler from '../../../general/mixins/modalFormHandler'
|
||||
import { required } from "vuelidate/lib/validators";
|
||||
export default {
|
||||
props: {
|
||||
id: {
|
||||
required: true,
|
||||
type: Number
|
||||
}
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
files: [],
|
||||
parameters: {}
|
||||
}
|
||||
},
|
||||
validations: {
|
||||
files: {
|
||||
required
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
submitForm(){
|
||||
|
||||
this.parameters = {
|
||||
files: this.files
|
||||
};
|
||||
|
||||
this.submit(this.route('api.transaction.group.bill.payment_proof.create', this.id), 'post', this.section, true, true)
|
||||
},
|
||||
successHandler(){
|
||||
this.closeModal();
|
||||
this.$store.dispatch('toggleSection', {name: 'paymentInProgressBillGroupList', status: !this.$store.getters.isShowing('paymentInProgressBillGroupList')});
|
||||
this.$store.dispatch('toggleSection', {name: 'paymentVerificationBillGroupList', status: !this.$store.getters.isShowing('paymentVerificationBillGroupList')});
|
||||
this.files = []
|
||||
},
|
||||
},
|
||||
mixins: [ModalFromHandler]
|
||||
|
||||
}
|
||||
</script>
|
||||
@@ -93,8 +93,10 @@
|
||||
</div>
|
||||
<div class="row m-b-20">
|
||||
<div class="col">
|
||||
<p class="no-margin" v-if="serviceType.id === 1">Recipient will receive the transfer on the <span class="text-success bold">next working day</span>. Check out our three-day transfer option to get a better rate!</p>
|
||||
<p class="no-margin" v-if="serviceType.id === 3">Enjoy a <span class="bold text-underline">better rate</span> with this option! The recipient will receive the transfer after <span class="text-success bold">three working days</span>.</p>
|
||||
<p class="no-margin" v-if="serviceType.id === 1">The recipient can expect to receive the transfer within <span class="text-success bold">3-5 working days</span>. Explore our BANK TRANSFER (SAVER) option for a better rate!</p>
|
||||
<p class="no-margin" v-if="serviceType.id === 3">Enjoy a <span class="bold text-underline">better rate</span> with this option! The recipient will receive the transfer after <span class="text-success bold">5-7 working days.</span>.</p>
|
||||
<p class="no-margin text-danger" v-if="[1, 3].includes(serviceType.id)">Please ensure is a PERSONAL bank account details. Company bank account details only allow to use as E2E service.</p>
|
||||
<p class="no-margin text-danger" v-if="serviceType.id === 5">Cancellation of E2E service are strictly NO refund on the 2% transfer fee charge.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
|
||||
+114
@@ -0,0 +1,114 @@
|
||||
<template>
|
||||
<div class="row m-t-15">
|
||||
<div class="col">
|
||||
<div class="row align-items-end">
|
||||
<div class="col">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="font-heading fs-10 muted all-caps">Order Reference No</div>
|
||||
<p class="m-b-0 fs-12" v-if="!isUpdate">
|
||||
{{ parameters.order_reference_no.join(', ') }}
|
||||
</p>
|
||||
<div class="row p-r-15 m-t-10" v-for="(order, index) in parameters.order_reference_no" v-else>
|
||||
<div class="col p-r-0">
|
||||
<div class="form-group no-margin form-group-default">
|
||||
<label>
|
||||
Order Reference No. {{ index + 1 }}
|
||||
</label>
|
||||
<input type="text" class="form-control" v-model="parameters.order_reference_no[index]">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto bg-danger pointer" v-if="parameters.order_reference_no.length > 1" @click="parameters.order_reference_no.splice(index, 1)">
|
||||
<div class="row h-100 align-items-center">
|
||||
<div class="col">
|
||||
<i class="fa fa-times fa-fw text-white"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row m-t-5" v-if="booking_status !== 3 && !isUpdate">
|
||||
<div class="col-auto">
|
||||
<p class="text-complete text-underline m-b-0 fs-12 pointer" @click="isUpdate = true">Update Order References</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" v-show="isUpdate">
|
||||
<div class="col">
|
||||
<div class="row m-t-10">
|
||||
<div class="col">
|
||||
<button class="btn btn-xs btn-outline-primary b-rad-none" @click="parameters.order_reference_no.push('')">
|
||||
<i class="fa fa-plus m-r-5"></i>
|
||||
Add Order Reference
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row m-t-10">
|
||||
<div class="col-8 p-r-5">
|
||||
<button class="btn btn-block btn-sm btn-success b-rad-none" @click="updateOrderReferences">Update Order References</button>
|
||||
</div>
|
||||
<div class="col-4 p-l-5">
|
||||
<button class="btn btn-block btn-sm btn-default b-rad-none" @click="resetOrderReference">Cancel</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import FormHandler from '../../../general/mixins/formHandler';
|
||||
|
||||
export default {
|
||||
props: {
|
||||
order_reference_no: {
|
||||
type: Array,
|
||||
default: [],
|
||||
required: true
|
||||
},
|
||||
booking_id: {
|
||||
type: Number,
|
||||
required: true
|
||||
},
|
||||
booking_status: {
|
||||
type: Number,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
parameters: {
|
||||
order_reference_no: []
|
||||
},
|
||||
isUpdate: false
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
pendingQueue(inComplete){
|
||||
if(inComplete){
|
||||
this.fetchBillingAddress();
|
||||
}
|
||||
}
|
||||
},
|
||||
created(){
|
||||
this.parameters.order_reference_no = this.order_reference_no.map(attr => attr.value);
|
||||
},
|
||||
methods: {
|
||||
resetOrderReference() {
|
||||
this.isUpdate = false;
|
||||
this.parameters.order_reference_no = this.order_reference_no.map(attr => attr.value);
|
||||
},
|
||||
updateOrderReferences(){
|
||||
this.submit(this.route('api.booking.booking_order_reference.update', this.booking_id), 'put', this.section, true, true)
|
||||
},
|
||||
successHandler(response){
|
||||
this.isUpdate = false;
|
||||
this.updateList()
|
||||
},
|
||||
},
|
||||
mixins: [FormHandler]
|
||||
}
|
||||
</script>
|
||||
+49
-32
@@ -51,38 +51,32 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row align-items-center m-b-15 parentContainer bg-master-lighter p-t-10 p-b-10">
|
||||
<div class="col">
|
||||
<div class="row m-b-5">
|
||||
<div class="col">
|
||||
<div class="font-heading all-caps fs-10 muted">Recipient Bank Details</div>
|
||||
<recipient-bank-details-component :data="item" :section="section"></recipient-bank-details-component>
|
||||
<div class="row" style="margin-top: -20px" v-if="$store.getters.isAdmin">
|
||||
<div class="col-auto">
|
||||
<p class="text-complete text-underline m-b-0 fs-12 pointer" @click="toggleEditRecipientBankDetailsCollapsed">{{ isEditRecipientBankDetailsCollapsed ? '< Back' : 'Change recipient bank details' }}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row align-items-center">
|
||||
<div class="col-auto p-r-0">
|
||||
<img v-if="item.service.id === 4" src="/images/1688_logo.png" alt="" width="40">
|
||||
<div v-if="item.service.id !== 4" class="padding-5 bg-master-light">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
|
||||
width="30" height="30"
|
||||
viewBox="0 0 172 172"
|
||||
style=" fill:#000000;"><defs><linearGradient x1="86" y1="38.97413" x2="86" y2="57.78663" gradientUnits="userSpaceOnUse" id="color-1_77055_gr1"><stop offset="0" stop-color="#4ec9ff"></stop><stop offset="1" stop-color="#2bffe6"></stop></linearGradient><linearGradient x1="129" y1="77.49138" x2="129" y2="121.38631" gradientUnits="userSpaceOnUse" id="color-2_77055_gr2"><stop offset="0" stop-color="#4ec9ff"></stop><stop offset="1" stop-color="#2bffe6"></stop></linearGradient><linearGradient x1="43" y1="77.49138" x2="43" y2="121.38631" gradientUnits="userSpaceOnUse" id="color-3_77055_gr3"><stop offset="0" stop-color="#4ec9ff"></stop><stop offset="1" stop-color="#2bffe6"></stop></linearGradient><linearGradient x1="86" y1="64.94881" x2="86" y2="133.92888" gradientUnits="userSpaceOnUse" id="color-4_77055_gr4"><stop offset="0" stop-color="#4ec9ff"></stop><stop offset="1" stop-color="#2bffe6"></stop></linearGradient><linearGradient x1="86" y1="16.11963" x2="86" y2="155.875" gradientUnits="userSpaceOnUse" id="color-5_77055_gr5"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient></defs><g fill="none" fill-rule="nonzero" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-weight="none" font-size="none" text-anchor="none" style="mix-blend-mode: normal"><path d="M0,172v-172h172v172z" fill="none"></path><g><path d="M86,40.31787c-4.4528,0 -8.0625,3.6097 -8.0625,8.0625c0,4.4528 3.6097,8.0625 8.0625,8.0625c4.4528,0 8.0625,-3.6097 8.0625,-8.0625c0,-4.4528 -3.6097,-8.0625 -8.0625,-8.0625z" fill="url(#color-1_77055_gr1)"></path><path d="M126.3125,80.625h5.375v37.625h-5.375z" fill="url(#color-2_77055_gr2)"></path><path d="M40.3125,80.625h5.375v37.625h-5.375z" fill="url(#color-3_77055_gr3)"></path><path d="M56.4375,69.875v59.125h59.125v-59.125zM99.4375,88.6875h-21.5v8.0625h16.125c2.96431,0 5.375,2.41069 5.375,5.375v8.0625c0,2.96431 -2.41069,5.375 -5.375,5.375h-5.375v5.375h-5.375v-5.375h-10.75v-5.375h21.5v-8.0625h-16.125c-2.96431,0 -5.375,-2.41069 -5.375,-5.375v-8.0625c0,-2.96431 2.41069,-5.375 5.375,-5.375h5.375v-5.375h5.375v5.375h10.75z" fill="url(#color-4_77055_gr4)"></path><path d="M86,59.125c-5.92862,0 -10.75,-4.82138 -10.75,-10.75c0,-5.92862 4.82138,-10.75 10.75,-10.75c5.92863,0 10.75,4.82138 10.75,10.75c0,5.92862 -4.82137,10.75 -10.75,10.75zM86,43c-2.96431,0 -5.375,2.41069 -5.375,5.375c0,2.96431 2.41069,5.375 5.375,5.375c2.96431,0 5.375,-2.41069 5.375,-5.375c0,-2.96431 -2.41069,-5.375 -5.375,-5.375zM108.84375,53.75c-2.22256,0 -4.03125,-1.80869 -4.03125,-4.03125c0,-2.22256 1.80869,-4.03125 4.03125,-4.03125c2.22256,0 4.03125,1.80869 4.03125,4.03125c0,2.22256 -1.80869,4.03125 -4.03125,4.03125zM108.84375,49.71606v0.00269zM63.15625,53.75c-2.22256,0 -4.03125,-1.80869 -4.03125,-4.03125c0,-2.22256 1.80869,-4.03125 4.03125,-4.03125c2.22256,0 4.03125,1.80869 4.03125,4.03125c0,2.22256 -1.80869,4.03125 -4.03125,4.03125zM63.15625,49.71606v0.00269zM150.5,69.875c2.96431,0 5.375,-2.39456 5.375,-5.34544v-1.29806c0,-1.72269 -0.84119,-3.34862 -2.30319,-4.39138l-60.03069,-40.40925c-4.58219,-3.08256 -10.49737,-3.08256 -15.07956,0l-60.08981,40.44956c-1.40825,1.00244 -2.24675,2.62838 -2.24675,4.35106v1.29806c0,2.95088 2.41069,5.34544 5.375,5.34544h8.0625v59.13037c-4.44513,0 -8.0625,3.61738 -8.0625,8.0625v3.182c-3.12019,1.11531 -5.375,4.06888 -5.375,7.568v8.05713h139.75v-8.05712c0,-3.49913 -2.25481,-6.45269 -5.375,-7.568v-3.182c0,-4.44513 -3.61738,-8.0625 -8.0625,-8.0625v-59.13038zM150.5,147.81788v2.68212h-129v-2.68212c0,-1.4835 1.204,-2.69288 2.6875,-2.69288h123.625c1.4835,0 2.6875,1.20937 2.6875,2.69288zM145.125,137.06788v2.68212h-118.25v-2.68212c0,-1.4835 1.204,-2.69288 2.6875,-2.69288h26.875h16.125h26.875h16.125h26.875c1.4835,0 2.6875,1.20937 2.6875,2.69288zM51.0625,80.625v37.625h-16.125v-37.625zM34.9375,75.25v-5.375h16.125v5.375zM51.0625,123.625v5.375h-16.125v-5.375zM56.4375,129v-59.125h5.375h10.75h5.375h16.125h5.375h5.375h10.75v59.125h-10.75h-5.375h-5.375h-16.125h-5.375h-10.75zM137.0625,80.625v37.625h-16.125v-37.625zM120.9375,75.25v-5.375h16.125v5.375zM137.0625,123.625v5.375h-16.125v-5.375zM115.5625,64.5h-16.125h-26.875v0.0215l-16.125,0.00269v-0.02419h-26.875h-8.0625l-0.06719,-1.21475l60.03069,-40.40387c1.376,-0.92987 2.95625,-1.38944 4.5365,-1.38944c1.58025,0 3.1605,0.46494 4.5365,1.39481l59.9635,40.33938l0.00806,1.27388c0,0 -0.00269,0 -0.00806,0h-8.0625z" fill="url(#color-5_77055_gr5)"></path></g></g></svg>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" style="margin-top: -20px" v-if="!$store.getters.isAdmin && isAnyPaymentRecipientBankEdited">
|
||||
<div class="col-auto">
|
||||
<div class="row">
|
||||
<div class="col-auto p-r-10">
|
||||
<div class="font-heading fs-12">{{item.bank.holder_name}} <span class="text-complete m-l-5 bold">{{item.bank.type === 3 ? item.bank.account_no : item.bank.account_no.replace(/[^\dA-Z]/g, '').replace(/(.{4})/g, '$1 ').trim()}}</span></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" v-if="item.bank.type !== 3 ">
|
||||
<div class="col-auto p-r-10">
|
||||
<div class="font-heading fs-10 small">{{item.bank.bank_name}} <span class="m-l-5">({{item.bank.bank_branch}})</span> <span class="m-l-5">({{item.bank.swift}})</span></div>
|
||||
</div>
|
||||
</div>
|
||||
<p class="text-complete text-underline m-b-0 fs-12 pointer" @click="toggleEditRecipientBankDetailsCollapsed">{{ isEditRecipientBankDetailsCollapsed ? '< Back' : 'Show edited recipient bank details on payment' }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="collapse" :class="{ show: isEditRecipientBankDetailsCollapsed }" ref="collapseContent" v-if="$store.getters.isAdmin">
|
||||
<recipient-bank-details-component :data="item" :section="section" :isEditButtonHidden="false"></recipient-bank-details-component>
|
||||
<edit-payment-recipient-bank-details-component :data="item" :section="section" :isEditButtonHidden="false"></edit-payment-recipient-bank-details-component>
|
||||
</div>
|
||||
|
||||
<div class="collapse" :class="{ show: isEditRecipientBankDetailsCollapsed }" ref="collapseContent" v-if="!$store.getters.isAdmin && isAnyPaymentRecipientBankEdited">
|
||||
<edit-payment-recipient-bank-details-component :data="item" :section="section" :isEditButtonHidden="true"></edit-payment-recipient-bank-details-component>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col bg-white padding-15">
|
||||
<div class="row" v-if="!expandPayment">
|
||||
@@ -122,7 +116,7 @@
|
||||
<div class="font-heading fs-12">{{this.data.fixed_currency.short_code}} {{(Math.round((this.data.outstanding_amount + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row m-t-20" v-if="data.company.employee.status === 2 && data.company.status === 2 && data.outstanding_amount > 0">
|
||||
<div class="row m-t-20" v-if="data.company.employee.status === 2 && data.company.status === 2 && (Math.round((this.data.outstanding_amount + Number.EPSILON) * 100) / 100) > 0">
|
||||
<div class="col">
|
||||
<button id="payment-btn" class="btn btn-sm all-caps b-rad-none btn-success btn-block" @click="makePayment()">Make Payment</button>
|
||||
</div>
|
||||
@@ -257,16 +251,16 @@
|
||||
</modal-component> -->
|
||||
</div>
|
||||
<span class="text-primary bold text-underline m-l-5 cursor text-small fs-12" style="margin-bottom: -10px; margin-top: -5px;" @click="showApplyVoucher=!showApplyVoucher" v-show="!showApplyVoucher">Apply a voucher</span>
|
||||
<div class="row m-l-0 m-r-0" style="height: 20px">
|
||||
<div class="row m-l-0 m-r-0" v-show="showApplyVoucher" style="height: 20px">
|
||||
<i class="fa fa-spinner fa-spin m-b-5" v-if="voucherIsChecking"></i>
|
||||
<span class="text-danger" v-if="voucherCodeFailedReason">{{ voucherCodeFailedReason }}</span>
|
||||
<span class="text-success" v-if="voucherCodeFailedReason === '' && voucherValidated">Voucher applied</span>
|
||||
</div>
|
||||
<!-- <div class="row m-l-0 m-r-0">
|
||||
<div class="row m-l-0 m-r-0" v-show="showApplyVoucher">
|
||||
<div class="col">
|
||||
<available-vouchers-component :employee="data.company.employee" @selected-voucher="handleSelectedVoucher"></available-vouchers-component>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
<div class="row m-t-5">
|
||||
<div class="col">
|
||||
<div class="row p-l-15 p-r-15">
|
||||
@@ -605,6 +599,22 @@
|
||||
voucherValidated: false,
|
||||
voucherIsChecking: false,
|
||||
showApplyVoucher: false,
|
||||
recipientBanks: {
|
||||
company: this.data.company,
|
||||
serviceType: {
|
||||
status: false,
|
||||
id: this.data.service.id,
|
||||
name: this.data.service.name,
|
||||
currencies: this.data.service.configurations.currencies,
|
||||
selectedCurrency: this.data.service.configurations.currencies[0]
|
||||
},
|
||||
bankAccount: this.data.bank,
|
||||
bankAccountDefault: this.data.bank,
|
||||
recipientBanks: this.data.company.recipient_banks.accounts,
|
||||
bookingId: this.data.id
|
||||
},
|
||||
isEditRecipientBankDetailsCollapsed: false,
|
||||
isAnyPaymentRecipientBankEdited: this.data.payment_history.some(payment => payment.bank !== null),
|
||||
}
|
||||
},
|
||||
validations () {
|
||||
@@ -634,7 +644,6 @@
|
||||
id: bankCode,
|
||||
status: true,
|
||||
}
|
||||
|
||||
},
|
||||
submitForm(){
|
||||
this.parameters = {
|
||||
@@ -642,7 +651,6 @@
|
||||
voucherCode: this.voucherCode,
|
||||
amount: this.amount
|
||||
};
|
||||
|
||||
this.submit(route('api.booking.payment.quotation', this.item.id), 'post', this.section, false, false)
|
||||
this.calculation = null;
|
||||
},
|
||||
@@ -676,9 +684,9 @@
|
||||
this.calculation = null;
|
||||
this.expandPayment = false;
|
||||
},
|
||||
updatedBankDetails(bank){
|
||||
this.item.bank = bank;
|
||||
},
|
||||
// updatedBankDetails(bank){ //cief todo: 66 - this need to move to vuex, too many levels of passings between parent and child
|
||||
// this.item.bank = bank;
|
||||
// },
|
||||
removeVoucher(){
|
||||
this.voucherCodeFailedReason = '';
|
||||
this.voucherCode = '';
|
||||
@@ -697,6 +705,7 @@
|
||||
this.submit(route('api.voucher.validate'), 'post', '', false, false);
|
||||
}
|
||||
else{
|
||||
this.voucherCodeFailedReason = 'Please enter voucher code';
|
||||
this.voucherValidated = true;
|
||||
this.voucherIsChecking = false;
|
||||
}
|
||||
@@ -708,6 +717,14 @@
|
||||
},
|
||||
handleSelectedVoucher(value){
|
||||
this.voucherCode = value;
|
||||
},
|
||||
toggleEditRecipientBankDetailsCollapsed() {
|
||||
this.isEditRecipientBankDetailsCollapsed = !this.isEditRecipientBankDetailsCollapsed;
|
||||
if (this.isEditRecipientBankDetailsCollapsed) {
|
||||
$(this.$refs.collapseContent).collapse('show');
|
||||
} else {
|
||||
$(this.$refs.collapseContent).collapse('hide');
|
||||
}
|
||||
}
|
||||
},
|
||||
mixins: [componentHandler],
|
||||
|
||||
@@ -6,7 +6,7 @@
|
||||
<small class="bold fs-10 text-danger">{{error}}</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row m-b-15" v-show="calculation.date && !error">
|
||||
<div class="row m-b-15 hide" v-show="calculation.date && !error">
|
||||
<div class="col padding-15 bg-master-lightest text-center m-l-15 m-r-15">
|
||||
<div class="fs-14 muted" >The recipient will receive the transfer amount by <br><span class="bold text-success">{{ this.calculation.receive_date }}</span></div>
|
||||
</div>
|
||||
@@ -225,7 +225,7 @@
|
||||
if (!this.currentSegmentNames.includes('enable enter MYR rate')) {
|
||||
return true;
|
||||
}
|
||||
|
||||
|
||||
return false;
|
||||
},
|
||||
},
|
||||
|
||||
+205
@@ -0,0 +1,205 @@
|
||||
<template>
|
||||
<div class="row align-items-center m-b-15 parentContainer p-t-10 p-b-10">
|
||||
<div class="col">
|
||||
<div class="row" v-if="item.payment_history.length">
|
||||
<div class="col">
|
||||
<div class="row m-b-15 p-b-10 bg-master-lighter" v-for="singlePayment in item.payment_history" v-bind:key="singlePayment.id" >
|
||||
<div class="col">
|
||||
<div class="row m-b-5">
|
||||
<div class="col">
|
||||
<div class="font-heading">
|
||||
<span class="all-caps fs-10 muted">
|
||||
Recipient Bank Details
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- PRIORITY If bank exist for payment -->
|
||||
<div class="row align-items-center" v-if="singlePayment.bank">
|
||||
<div class="col-auto p-r-0">
|
||||
<img v-if="item.service.id === 4" src="/images/1688_logo.png" alt="" width="40">
|
||||
<img v-else-if="item.service.id === 11" src="/images/alipay_logo.png" alt="" width="40">
|
||||
<div v-else class="padding-5 bg-master-light">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
|
||||
width="30" height="30"
|
||||
viewBox="0 0 172 172"
|
||||
style=" fill:#000000;"><defs><linearGradient x1="86" y1="38.97413" x2="86" y2="57.78663" gradientUnits="userSpaceOnUse" id="color-1_77055_gr1"><stop offset="0" stop-color="#4ec9ff"></stop><stop offset="1" stop-color="#2bffe6"></stop></linearGradient><linearGradient x1="129" y1="77.49138" x2="129" y2="121.38631" gradientUnits="userSpaceOnUse" id="color-2_77055_gr2"><stop offset="0" stop-color="#4ec9ff"></stop><stop offset="1" stop-color="#2bffe6"></stop></linearGradient><linearGradient x1="43" y1="77.49138" x2="43" y2="121.38631" gradientUnits="userSpaceOnUse" id="color-3_77055_gr3"><stop offset="0" stop-color="#4ec9ff"></stop><stop offset="1" stop-color="#2bffe6"></stop></linearGradient><linearGradient x1="86" y1="64.94881" x2="86" y2="133.92888" gradientUnits="userSpaceOnUse" id="color-4_77055_gr4"><stop offset="0" stop-color="#4ec9ff"></stop><stop offset="1" stop-color="#2bffe6"></stop></linearGradient><linearGradient x1="86" y1="16.11963" x2="86" y2="155.875" gradientUnits="userSpaceOnUse" id="color-5_77055_gr5"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient></defs><g fill="none" fill-rule="nonzero" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-weight="none" font-size="none" text-anchor="none" style="mix-blend-mode: normal"><path d="M0,172v-172h172v172z" fill="none"></path><g><path d="M86,40.31787c-4.4528,0 -8.0625,3.6097 -8.0625,8.0625c0,4.4528 3.6097,8.0625 8.0625,8.0625c4.4528,0 8.0625,-3.6097 8.0625,-8.0625c0,-4.4528 -3.6097,-8.0625 -8.0625,-8.0625z" fill="url(#color-1_77055_gr1)"></path><path d="M126.3125,80.625h5.375v37.625h-5.375z" fill="url(#color-2_77055_gr2)"></path><path d="M40.3125,80.625h5.375v37.625h-5.375z" fill="url(#color-3_77055_gr3)"></path><path d="M56.4375,69.875v59.125h59.125v-59.125zM99.4375,88.6875h-21.5v8.0625h16.125c2.96431,0 5.375,2.41069 5.375,5.375v8.0625c0,2.96431 -2.41069,5.375 -5.375,5.375h-5.375v5.375h-5.375v-5.375h-10.75v-5.375h21.5v-8.0625h-16.125c-2.96431,0 -5.375,-2.41069 -5.375,-5.375v-8.0625c0,-2.96431 2.41069,-5.375 5.375,-5.375h5.375v-5.375h5.375v5.375h10.75z" fill="url(#color-4_77055_gr4)"></path><path d="M86,59.125c-5.92862,0 -10.75,-4.82138 -10.75,-10.75c0,-5.92862 4.82138,-10.75 10.75,-10.75c5.92863,0 10.75,4.82138 10.75,10.75c0,5.92862 -4.82137,10.75 -10.75,10.75zM86,43c-2.96431,0 -5.375,2.41069 -5.375,5.375c0,2.96431 2.41069,5.375 5.375,5.375c2.96431,0 5.375,-2.41069 5.375,-5.375c0,-2.96431 -2.41069,-5.375 -5.375,-5.375zM108.84375,53.75c-2.22256,0 -4.03125,-1.80869 -4.03125,-4.03125c0,-2.22256 1.80869,-4.03125 4.03125,-4.03125c2.22256,0 4.03125,1.80869 4.03125,4.03125c0,2.22256 -1.80869,4.03125 -4.03125,4.03125zM108.84375,49.71606v0.00269zM63.15625,53.75c-2.22256,0 -4.03125,-1.80869 -4.03125,-4.03125c0,-2.22256 1.80869,-4.03125 4.03125,-4.03125c2.22256,0 4.03125,1.80869 4.03125,4.03125c0,2.22256 -1.80869,4.03125 -4.03125,4.03125zM63.15625,49.71606v0.00269zM150.5,69.875c2.96431,0 5.375,-2.39456 5.375,-5.34544v-1.29806c0,-1.72269 -0.84119,-3.34862 -2.30319,-4.39138l-60.03069,-40.40925c-4.58219,-3.08256 -10.49737,-3.08256 -15.07956,0l-60.08981,40.44956c-1.40825,1.00244 -2.24675,2.62838 -2.24675,4.35106v1.29806c0,2.95088 2.41069,5.34544 5.375,5.34544h8.0625v59.13037c-4.44513,0 -8.0625,3.61738 -8.0625,8.0625v3.182c-3.12019,1.11531 -5.375,4.06888 -5.375,7.568v8.05713h139.75v-8.05712c0,-3.49913 -2.25481,-6.45269 -5.375,-7.568v-3.182c0,-4.44513 -3.61738,-8.0625 -8.0625,-8.0625v-59.13038zM150.5,147.81788v2.68212h-129v-2.68212c0,-1.4835 1.204,-2.69288 2.6875,-2.69288h123.625c1.4835,0 2.6875,1.20937 2.6875,2.69288zM145.125,137.06788v2.68212h-118.25v-2.68212c0,-1.4835 1.204,-2.69288 2.6875,-2.69288h26.875h16.125h26.875h16.125h26.875c1.4835,0 2.6875,1.20937 2.6875,2.69288zM51.0625,80.625v37.625h-16.125v-37.625zM34.9375,75.25v-5.375h16.125v5.375zM51.0625,123.625v5.375h-16.125v-5.375zM56.4375,129v-59.125h5.375h10.75h5.375h16.125h5.375h5.375h10.75v59.125h-10.75h-5.375h-5.375h-16.125h-5.375h-10.75zM137.0625,80.625v37.625h-16.125v-37.625zM120.9375,75.25v-5.375h16.125v5.375zM137.0625,123.625v5.375h-16.125v-5.375zM115.5625,64.5h-16.125h-26.875v0.0215l-16.125,0.00269v-0.02419h-26.875h-8.0625l-0.06719,-1.21475l60.03069,-40.40387c1.376,-0.92987 2.95625,-1.38944 4.5365,-1.38944c1.58025,0 3.1605,0.46494 4.5365,1.39481l59.9635,40.33938l0.00806,1.27388c0,0 -0.00269,0 -0.00806,0h-8.0625z" fill="url(#color-5_77055_gr5)"></path></g></g></svg>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<div class="row">
|
||||
<div class="col-auto p-r-10">
|
||||
<div class="font-heading fs-12">{{singlePayment.bank.holder_name}}
|
||||
<span class="text-complete m-l-5 bold">{{[3, 4].includes(singlePayment.bank.type) ? singlePayment.bank.account_no : singlePayment.bank.account_no.replace(/[^\dA-Z]/g, '').replace(/(.{4})/g, '$1 ').trim()}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" v-if="![3, 4].includes(singlePayment.bank.type)">
|
||||
<div class="col-auto p-r-10">
|
||||
<div class="font-heading fs-10 small">{{singlePayment.bank.bank_name}} <span class="m-l-5">({{singlePayment.bank.bank_branch}})</span> <span class="m-l-5">({{singlePayment.bank.swift}})</span></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-auto p-r-10">
|
||||
<span class="fs-10">
|
||||
{{singlePayment.bill_no }} -
|
||||
</span>
|
||||
<span class="fs-10 bold">{{singlePayment.original_currency.short_code}} {{(Math.round((singlePayment.original_amount - singlePayment.refunded_amount + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" v-if="!isEditButtonHidden">
|
||||
<div class="col-auto p-r-10">
|
||||
<span class="fs-10">
|
||||
<button class="btn btn-xs btn-outline-danger b-rad-none m-r-5 requestModal" :data-type="'updateBankMetadata-' + singlePayment.bill_no">
|
||||
<span>Reset to Default</span>
|
||||
</button>
|
||||
<modal-component class="animate__animated animate__fast animate__fadeIn" :type="'updateBankMetadata-'+ singlePayment.bill_no">
|
||||
<general-confirmation-form-component
|
||||
contentText="Are you sure you want to reset to default"
|
||||
modalType="delete"
|
||||
class="text-center"
|
||||
:params="getPayloadToResetDefault(singlePayment, item)"
|
||||
:apiRoute="route('api.bank.update.metadata', singlePayment.bank.id)"
|
||||
apiMethod="post"
|
||||
:section="section"
|
||||
>
|
||||
</general-confirmation-form-component>
|
||||
</modal-component>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Default Recipient Bank from Booking -->
|
||||
<div class="row align-items-center" v-else>
|
||||
<div class="col-auto p-r-0">
|
||||
<img v-if="item.service.id === 4" src="/images/1688_logo.png" alt="" width="40">
|
||||
<img v-else-if="item.service.id === 11" src="/images/alipay_logo.png" alt="" width="40">
|
||||
<div v-else class="padding-5 bg-master-light">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
|
||||
width="30" height="30"
|
||||
viewBox="0 0 172 172"
|
||||
style=" fill:#000000;"><defs><linearGradient x1="86" y1="38.97413" x2="86" y2="57.78663" gradientUnits="userSpaceOnUse" id="color-1_77055_gr1"><stop offset="0" stop-color="#4ec9ff"></stop><stop offset="1" stop-color="#2bffe6"></stop></linearGradient><linearGradient x1="129" y1="77.49138" x2="129" y2="121.38631" gradientUnits="userSpaceOnUse" id="color-2_77055_gr2"><stop offset="0" stop-color="#4ec9ff"></stop><stop offset="1" stop-color="#2bffe6"></stop></linearGradient><linearGradient x1="43" y1="77.49138" x2="43" y2="121.38631" gradientUnits="userSpaceOnUse" id="color-3_77055_gr3"><stop offset="0" stop-color="#4ec9ff"></stop><stop offset="1" stop-color="#2bffe6"></stop></linearGradient><linearGradient x1="86" y1="64.94881" x2="86" y2="133.92888" gradientUnits="userSpaceOnUse" id="color-4_77055_gr4"><stop offset="0" stop-color="#4ec9ff"></stop><stop offset="1" stop-color="#2bffe6"></stop></linearGradient><linearGradient x1="86" y1="16.11963" x2="86" y2="155.875" gradientUnits="userSpaceOnUse" id="color-5_77055_gr5"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient></defs><g fill="none" fill-rule="nonzero" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-weight="none" font-size="none" text-anchor="none" style="mix-blend-mode: normal"><path d="M0,172v-172h172v172z" fill="none"></path><g><path d="M86,40.31787c-4.4528,0 -8.0625,3.6097 -8.0625,8.0625c0,4.4528 3.6097,8.0625 8.0625,8.0625c4.4528,0 8.0625,-3.6097 8.0625,-8.0625c0,-4.4528 -3.6097,-8.0625 -8.0625,-8.0625z" fill="url(#color-1_77055_gr1)"></path><path d="M126.3125,80.625h5.375v37.625h-5.375z" fill="url(#color-2_77055_gr2)"></path><path d="M40.3125,80.625h5.375v37.625h-5.375z" fill="url(#color-3_77055_gr3)"></path><path d="M56.4375,69.875v59.125h59.125v-59.125zM99.4375,88.6875h-21.5v8.0625h16.125c2.96431,0 5.375,2.41069 5.375,5.375v8.0625c0,2.96431 -2.41069,5.375 -5.375,5.375h-5.375v5.375h-5.375v-5.375h-10.75v-5.375h21.5v-8.0625h-16.125c-2.96431,0 -5.375,-2.41069 -5.375,-5.375v-8.0625c0,-2.96431 2.41069,-5.375 5.375,-5.375h5.375v-5.375h5.375v5.375h10.75z" fill="url(#color-4_77055_gr4)"></path><path d="M86,59.125c-5.92862,0 -10.75,-4.82138 -10.75,-10.75c0,-5.92862 4.82138,-10.75 10.75,-10.75c5.92863,0 10.75,4.82138 10.75,10.75c0,5.92862 -4.82137,10.75 -10.75,10.75zM86,43c-2.96431,0 -5.375,2.41069 -5.375,5.375c0,2.96431 2.41069,5.375 5.375,5.375c2.96431,0 5.375,-2.41069 5.375,-5.375c0,-2.96431 -2.41069,-5.375 -5.375,-5.375zM108.84375,53.75c-2.22256,0 -4.03125,-1.80869 -4.03125,-4.03125c0,-2.22256 1.80869,-4.03125 4.03125,-4.03125c2.22256,0 4.03125,1.80869 4.03125,4.03125c0,2.22256 -1.80869,4.03125 -4.03125,4.03125zM108.84375,49.71606v0.00269zM63.15625,53.75c-2.22256,0 -4.03125,-1.80869 -4.03125,-4.03125c0,-2.22256 1.80869,-4.03125 4.03125,-4.03125c2.22256,0 4.03125,1.80869 4.03125,4.03125c0,2.22256 -1.80869,4.03125 -4.03125,4.03125zM63.15625,49.71606v0.00269zM150.5,69.875c2.96431,0 5.375,-2.39456 5.375,-5.34544v-1.29806c0,-1.72269 -0.84119,-3.34862 -2.30319,-4.39138l-60.03069,-40.40925c-4.58219,-3.08256 -10.49737,-3.08256 -15.07956,0l-60.08981,40.44956c-1.40825,1.00244 -2.24675,2.62838 -2.24675,4.35106v1.29806c0,2.95088 2.41069,5.34544 5.375,5.34544h8.0625v59.13037c-4.44513,0 -8.0625,3.61738 -8.0625,8.0625v3.182c-3.12019,1.11531 -5.375,4.06888 -5.375,7.568v8.05713h139.75v-8.05712c0,-3.49913 -2.25481,-6.45269 -5.375,-7.568v-3.182c0,-4.44513 -3.61738,-8.0625 -8.0625,-8.0625v-59.13038zM150.5,147.81788v2.68212h-129v-2.68212c0,-1.4835 1.204,-2.69288 2.6875,-2.69288h123.625c1.4835,0 2.6875,1.20937 2.6875,2.69288zM145.125,137.06788v2.68212h-118.25v-2.68212c0,-1.4835 1.204,-2.69288 2.6875,-2.69288h26.875h16.125h26.875h16.125h26.875c1.4835,0 2.6875,1.20937 2.6875,2.69288zM51.0625,80.625v37.625h-16.125v-37.625zM34.9375,75.25v-5.375h16.125v5.375zM51.0625,123.625v5.375h-16.125v-5.375zM56.4375,129v-59.125h5.375h10.75h5.375h16.125h5.375h5.375h10.75v59.125h-10.75h-5.375h-5.375h-16.125h-5.375h-10.75zM137.0625,80.625v37.625h-16.125v-37.625zM120.9375,75.25v-5.375h16.125v5.375zM137.0625,123.625v5.375h-16.125v-5.375zM115.5625,64.5h-16.125h-26.875v0.0215l-16.125,0.00269v-0.02419h-26.875h-8.0625l-0.06719,-1.21475l60.03069,-40.40387c1.376,-0.92987 2.95625,-1.38944 4.5365,-1.38944c1.58025,0 3.1605,0.46494 4.5365,1.39481l59.9635,40.33938l0.00806,1.27388c0,0 -0.00269,0 -0.00806,0h-8.0625z" fill="url(#color-5_77055_gr5)"></path></g></g></svg>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<div class="row">
|
||||
<div class="col-auto p-r-10">
|
||||
<div class="font-heading fs-12">{{item.bank.holder_name}}
|
||||
<span class="text-complete m-l-5 bold">{{[3, 4].includes(item.bank.type) ? item.bank.account_no : item.bank.account_no.replace(/[^\dA-Z]/g, '').replace(/(.{4})/g, '$1 ').trim()}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" v-if="![3, 4].includes(item.bank.type)">
|
||||
<div class="col-auto p-r-10">
|
||||
<div class="font-heading fs-10 small">{{item.bank.bank_name}} <span class="m-l-5">({{item.bank.bank_branch}})</span> <span class="m-l-5">({{item.bank.swift}})</span></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-auto p-r-10">
|
||||
<span class="fs-10">
|
||||
{{singlePayment.bill_no }} -
|
||||
</span>
|
||||
<span class="fs-10 bold">{{singlePayment.original_currency.short_code}} {{(Math.round((singlePayment.original_amount - singlePayment.refunded_amount + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-auto p-r-10">
|
||||
<span class="fs-10">
|
||||
<span class="badge badge-secondary">DEFAULT</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="row m-t-20" v-if="!isEditButtonHidden">
|
||||
<div class="col">
|
||||
<div class="btn btn-sm btn-block b-rad-none shadow-sm pointer requestModal" :data-type="'editRecipientDetailsFor-' + singlePayment.bill_no" :id="'edit-recipient-details-' + singlePayment.bill_no" :name="'edit-recipient-details-' + singlePayment.bill_no">EDIT FOR PAYMENT</div>
|
||||
</div>
|
||||
<modal-component id="select-account-modal" class="animate__animated animate__fast animate__fadeIn" styleType="fill-in" :type="'editRecipientDetailsFor-' + singlePayment.bill_no" size="large">
|
||||
<booking-payment-recipient-edit-component :data="getRecipientBanks(singlePayment)" :section="section" v-on:updatedBankDetails="updatedBankDetails"></booking-payment-recipient-edit-component>
|
||||
</modal-component>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import componentHandler from '../../../general/mixins/componentHandler';
|
||||
export default {
|
||||
props : {
|
||||
section: {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
isEditButtonHidden: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
recipientBanks: {
|
||||
company: this.data.company,
|
||||
serviceType: {
|
||||
status: false,
|
||||
id: this.data.service.id,
|
||||
name: this.data.service.name,
|
||||
currencies: this.data.service.configurations.currencies,
|
||||
selectedCurrency: this.data.service.configurations.currencies[0]
|
||||
},
|
||||
bankAccount: this.data.bank,
|
||||
bankAccountDefault: this.data.bank,
|
||||
recipientBanks: this.data.company.recipient_banks.accounts,
|
||||
bookingId: this.data.id,
|
||||
billNo: '',
|
||||
transactionId: 0,
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getRecipientBanks(payment = null) {
|
||||
const recipientBanksAmended = { ...this.recipientBanks };
|
||||
|
||||
if (payment) {
|
||||
if(payment.bank){
|
||||
const currentBank = { ... payment.bank };
|
||||
recipientBanksAmended.bankAccount = currentBank;
|
||||
}
|
||||
else {
|
||||
const currentBank = { ... this.data.bank };
|
||||
recipientBanksAmended.bankAccount = currentBank;
|
||||
}
|
||||
recipientBanksAmended.billNo = payment.bill_no;
|
||||
recipientBanksAmended.transactionId = payment.id;
|
||||
}
|
||||
|
||||
return recipientBanksAmended;
|
||||
},
|
||||
updatedBankDetails(bank, transactionId){ //cief todo: 66 - this need to move to vuex, too many levels of passings between parent and child
|
||||
const index = this.item.payment_history.findIndex(payment => payment.id === transactionId);
|
||||
if (index !== -1) {
|
||||
this.item.payment_history[index].bank = { ... bank };
|
||||
}
|
||||
},
|
||||
getPayloadToResetDefault(payment, booking){
|
||||
// const filter = {transactionId: payment.id, bookingBankId: booking.bank.id};
|
||||
const filter = {};
|
||||
filter['transactionId'] = payment.id;
|
||||
filter['bookingBankId'] = booking.bank.id;
|
||||
return filter;
|
||||
},
|
||||
},
|
||||
mixins: [componentHandler]
|
||||
}
|
||||
</script>
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="row">
|
||||
<div class="row" :class="{'bg-danger-lighter': $store.getters.isAdmin && companySegmentIds.includes(24)}">
|
||||
<div class="col">
|
||||
<div class="row no-margin">
|
||||
<div class="col p-b-15 p-l-0 p-r-0">
|
||||
@@ -12,9 +12,12 @@
|
||||
</div>
|
||||
<div class="row" v-if="!submitted">
|
||||
<div class="col-auto">
|
||||
<div class="bg-danger p-l-15 p-r-15 p-t-5 p-b-5">
|
||||
<div class="bg-danger p-l-15 p-r-15 p-t-5 p-b-5 m-b-10">
|
||||
<p class="m-b-0 text-white fs-12" >Any Purchase Orders that aren't submitted within 60 days will be closed for editing.</p>
|
||||
</div>
|
||||
<div class="bg-danger p-l-15 p-r-15 p-t-5 p-b-5" v-if="$store.getters.isAdmin && companySegmentIds.includes(24)">
|
||||
<p class="m-b-0 text-white fs-12" >Please note that this customer request to manual fill up the PO.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
@@ -173,7 +176,7 @@
|
||||
</div>
|
||||
</template>
|
||||
</document-file-viewer-component>
|
||||
<button class="btn btn-sm btn-danger b-rad-none btn-block" v-if="data.documents.proforma_invoice && data.outstanding_amount > 0" @click="submit(route('api.booking.proforma.create', data.id), 'post', section, true, true)">Regenerate Proforma Invoice</button>
|
||||
<button class="btn btn-sm btn-danger b-rad-none btn-block" v-if="data.documents.proforma_invoice" @click="submit(route('api.booking.proforma.create', data.id), 'post', section, true, true)">Regenerate Proforma Invoice</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row m-b-15" v-if="($store.getters.isAdmin && data.purchase_order.status === 1) || ($store.getters.isCustomer && data.purchase_order.status === 1 && $store.getters.getCompanyId === 199)" >
|
||||
@@ -203,6 +206,12 @@
|
||||
import { required, requiredIf } from "vuelidate/lib/validators";
|
||||
|
||||
export default {
|
||||
props:{
|
||||
companySegmentIds: {
|
||||
type: Array,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
interval:false,
|
||||
@@ -240,7 +249,12 @@
|
||||
},
|
||||
watch: {
|
||||
'data': function () {
|
||||
this.products = this.data.purchase_order.details
|
||||
if (this.data && this.data.purchase_order && this.data.purchase_order.details) {
|
||||
this.products = this.data.purchase_order.details;
|
||||
this.submitted = this.data.purchase_order ? this.data.purchase_order.status === 1 || this.data.purchase_order.status === 2: false;
|
||||
} else {
|
||||
this.products = [];
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
@@ -0,0 +1,83 @@
|
||||
<template>
|
||||
<div class="row align-items-center m-b-15 parentContainer bg-master-lighter p-t-10 p-b-10">
|
||||
<div class="col">
|
||||
<div class="row m-b-5">
|
||||
<div class="col">
|
||||
<div class="font-heading all-caps fs-10 muted">Recipient Bank Details</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row align-items-center">
|
||||
<div class="col-auto p-r-0">
|
||||
<img v-if="item.service.id === 4" src="/images/1688_logo.png" alt="" width="40">
|
||||
<img v-else-if="item.service.id === 11" src="/images/alipay_logo.png" alt="" width="40">
|
||||
<div v-else class="padding-5 bg-master-light">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
|
||||
width="30" height="30"
|
||||
viewBox="0 0 172 172"
|
||||
style=" fill:#000000;"><defs><linearGradient x1="86" y1="38.97413" x2="86" y2="57.78663" gradientUnits="userSpaceOnUse" id="color-1_77055_gr1"><stop offset="0" stop-color="#4ec9ff"></stop><stop offset="1" stop-color="#2bffe6"></stop></linearGradient><linearGradient x1="129" y1="77.49138" x2="129" y2="121.38631" gradientUnits="userSpaceOnUse" id="color-2_77055_gr2"><stop offset="0" stop-color="#4ec9ff"></stop><stop offset="1" stop-color="#2bffe6"></stop></linearGradient><linearGradient x1="43" y1="77.49138" x2="43" y2="121.38631" gradientUnits="userSpaceOnUse" id="color-3_77055_gr3"><stop offset="0" stop-color="#4ec9ff"></stop><stop offset="1" stop-color="#2bffe6"></stop></linearGradient><linearGradient x1="86" y1="64.94881" x2="86" y2="133.92888" gradientUnits="userSpaceOnUse" id="color-4_77055_gr4"><stop offset="0" stop-color="#4ec9ff"></stop><stop offset="1" stop-color="#2bffe6"></stop></linearGradient><linearGradient x1="86" y1="16.11963" x2="86" y2="155.875" gradientUnits="userSpaceOnUse" id="color-5_77055_gr5"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient></defs><g fill="none" fill-rule="nonzero" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-weight="none" font-size="none" text-anchor="none" style="mix-blend-mode: normal"><path d="M0,172v-172h172v172z" fill="none"></path><g><path d="M86,40.31787c-4.4528,0 -8.0625,3.6097 -8.0625,8.0625c0,4.4528 3.6097,8.0625 8.0625,8.0625c4.4528,0 8.0625,-3.6097 8.0625,-8.0625c0,-4.4528 -3.6097,-8.0625 -8.0625,-8.0625z" fill="url(#color-1_77055_gr1)"></path><path d="M126.3125,80.625h5.375v37.625h-5.375z" fill="url(#color-2_77055_gr2)"></path><path d="M40.3125,80.625h5.375v37.625h-5.375z" fill="url(#color-3_77055_gr3)"></path><path d="M56.4375,69.875v59.125h59.125v-59.125zM99.4375,88.6875h-21.5v8.0625h16.125c2.96431,0 5.375,2.41069 5.375,5.375v8.0625c0,2.96431 -2.41069,5.375 -5.375,5.375h-5.375v5.375h-5.375v-5.375h-10.75v-5.375h21.5v-8.0625h-16.125c-2.96431,0 -5.375,-2.41069 -5.375,-5.375v-8.0625c0,-2.96431 2.41069,-5.375 5.375,-5.375h5.375v-5.375h5.375v5.375h10.75z" fill="url(#color-4_77055_gr4)"></path><path d="M86,59.125c-5.92862,0 -10.75,-4.82138 -10.75,-10.75c0,-5.92862 4.82138,-10.75 10.75,-10.75c5.92863,0 10.75,4.82138 10.75,10.75c0,5.92862 -4.82137,10.75 -10.75,10.75zM86,43c-2.96431,0 -5.375,2.41069 -5.375,5.375c0,2.96431 2.41069,5.375 5.375,5.375c2.96431,0 5.375,-2.41069 5.375,-5.375c0,-2.96431 -2.41069,-5.375 -5.375,-5.375zM108.84375,53.75c-2.22256,0 -4.03125,-1.80869 -4.03125,-4.03125c0,-2.22256 1.80869,-4.03125 4.03125,-4.03125c2.22256,0 4.03125,1.80869 4.03125,4.03125c0,2.22256 -1.80869,4.03125 -4.03125,4.03125zM108.84375,49.71606v0.00269zM63.15625,53.75c-2.22256,0 -4.03125,-1.80869 -4.03125,-4.03125c0,-2.22256 1.80869,-4.03125 4.03125,-4.03125c2.22256,0 4.03125,1.80869 4.03125,4.03125c0,2.22256 -1.80869,4.03125 -4.03125,4.03125zM63.15625,49.71606v0.00269zM150.5,69.875c2.96431,0 5.375,-2.39456 5.375,-5.34544v-1.29806c0,-1.72269 -0.84119,-3.34862 -2.30319,-4.39138l-60.03069,-40.40925c-4.58219,-3.08256 -10.49737,-3.08256 -15.07956,0l-60.08981,40.44956c-1.40825,1.00244 -2.24675,2.62838 -2.24675,4.35106v1.29806c0,2.95088 2.41069,5.34544 5.375,5.34544h8.0625v59.13037c-4.44513,0 -8.0625,3.61738 -8.0625,8.0625v3.182c-3.12019,1.11531 -5.375,4.06888 -5.375,7.568v8.05713h139.75v-8.05712c0,-3.49913 -2.25481,-6.45269 -5.375,-7.568v-3.182c0,-4.44513 -3.61738,-8.0625 -8.0625,-8.0625v-59.13038zM150.5,147.81788v2.68212h-129v-2.68212c0,-1.4835 1.204,-2.69288 2.6875,-2.69288h123.625c1.4835,0 2.6875,1.20937 2.6875,2.69288zM145.125,137.06788v2.68212h-118.25v-2.68212c0,-1.4835 1.204,-2.69288 2.6875,-2.69288h26.875h16.125h26.875h16.125h26.875c1.4835,0 2.6875,1.20937 2.6875,2.69288zM51.0625,80.625v37.625h-16.125v-37.625zM34.9375,75.25v-5.375h16.125v5.375zM51.0625,123.625v5.375h-16.125v-5.375zM56.4375,129v-59.125h5.375h10.75h5.375h16.125h5.375h5.375h10.75v59.125h-10.75h-5.375h-5.375h-16.125h-5.375h-10.75zM137.0625,80.625v37.625h-16.125v-37.625zM120.9375,75.25v-5.375h16.125v5.375zM137.0625,123.625v5.375h-16.125v-5.375zM115.5625,64.5h-16.125h-26.875v0.0215l-16.125,0.00269v-0.02419h-26.875h-8.0625l-0.06719,-1.21475l60.03069,-40.40387c1.376,-0.92987 2.95625,-1.38944 4.5365,-1.38944c1.58025,0 3.1605,0.46494 4.5365,1.39481l59.9635,40.33938l0.00806,1.27388c0,0 -0.00269,0 -0.00806,0h-8.0625z" fill="url(#color-5_77055_gr5)"></path></g></g></svg>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<div class="row">
|
||||
<div class="col-auto p-r-10">
|
||||
<div class="font-heading fs-12">{{item.bank.holder_name}} <span class="text-complete m-l-5 bold">{{[3, 4].includes(item.bank.type) ? item.bank.account_no : item.bank.account_no.replace(/[^\dA-Z]/g, '').replace(/(.{4})/g, '$1 ').trim()}}</span></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" v-if="![3, 4].includes(item.bank.type)">
|
||||
<div class="col-auto p-r-10">
|
||||
<div class="font-heading fs-10 small">{{item.bank.bank_name}} <span class="m-l-5">({{item.bank.bank_branch}})</span> <span class="m-l-5">({{item.bank.swift}})</span></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row m-t-20" v-if="!isEditButtonHidden">
|
||||
<div class="col">
|
||||
<div class="btn btn-sm btn-block b-rad-none shadow-sm pointer requestModal" data-type="transferSummary" id="transfer-now" name="transfer-now">EDIT DEFAULT</div>
|
||||
</div>
|
||||
<modal-component id="select-account-modal" class="animate__animated animate__fast animate__fadeIn" styleType="fill-in" type="transferSummary" size="large">
|
||||
<booking-recipient-edit-component :data="recipientBanks" :section="section" v-on:updatedBankDetails="updatedBankDetails($event)"></booking-recipient-edit-component>
|
||||
</modal-component>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import componentHandler from '../../../general/mixins/componentHandler';
|
||||
export default {
|
||||
props : {
|
||||
section: {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
isEditButtonHidden: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
recipientBanks: {
|
||||
company: this.data.company,
|
||||
serviceType: {
|
||||
status: false,
|
||||
id: this.data.service.id,
|
||||
name: this.data.service.name,
|
||||
currencies: this.data.service.configurations.currencies,
|
||||
selectedCurrency: this.data.service.configurations.currencies[0]
|
||||
},
|
||||
bankAccount: this.data.bank,
|
||||
bankAccountDefault: this.data.bank,
|
||||
recipientBanks: this.data.company.recipient_banks.accounts,
|
||||
bookingId: this.data.id
|
||||
}
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
updatedBankDetails(bank){ //cief todo: 66 - this need to move to vuex, too many levels of passings between parent and child
|
||||
this.data.bank = { ... bank };
|
||||
},
|
||||
},
|
||||
mixins: [componentHandler]
|
||||
|
||||
}
|
||||
</script>
|
||||
@@ -115,7 +115,12 @@
|
||||
computed: {
|
||||
total(){
|
||||
return this.payments.reduce(function (total, currentValue) {
|
||||
return total + currentValue.original_amount;
|
||||
return total + currentValue.original_amount - currentValue.transaction_refunds.reduce(function (totalRefund, refundTransaction) {
|
||||
if (refundTransaction.status === 2) {
|
||||
return totalRefund + refundTransaction.original_amount;
|
||||
}
|
||||
return totalRefund;
|
||||
}, 0);
|
||||
}, 0);
|
||||
|
||||
},
|
||||
|
||||
+247
@@ -0,0 +1,247 @@
|
||||
<template>
|
||||
<div class="row mt-3 mt-md-0">
|
||||
<div class="col">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="row align-items-end m-b-10">
|
||||
<div class="col">
|
||||
<div class="font-heading all-caps fs-10">Supplier:</div>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<div class="font-heading fs-10">{{this.supplier.name}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row align-items-end m-b-5 text-info">
|
||||
<div class="col">
|
||||
<div class="font-heading all-caps fs-10">Order Total:</div>
|
||||
</div>
|
||||
<div class="col-auto text-right">
|
||||
<div class="font-heading fs-11">{{ this.payments.length > 0 ? this.payments[0].original_currency.short_code : "CNY"}} {{ formatNumber(this.originalTotal) }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row align-items-end m-b-5 text-info" v-if="!is1688Supplier">
|
||||
<div class="col">
|
||||
<div class="font-heading all-caps fs-10"></div>
|
||||
</div>
|
||||
<div class="col-auto text-right">
|
||||
<div class="font-heading fs-11">MYR {{ formatNumber(this.total) }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row align-items-end m-b-5 text-info" v-if="!is1688Supplier">
|
||||
<div class="col">
|
||||
<div class="font-heading all-caps fs-10">Service Charges:</div>
|
||||
</div>
|
||||
<div class="col-auto text-right">
|
||||
<div class="font-heading fs-11">MYR {{parameters.service_charges}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row align-items-end m-b-10 text-primary" v-if="is1688Supplier">
|
||||
<div class="col">
|
||||
<div class="font-heading all-caps fs-10">Currency Rate:</div>
|
||||
</div>
|
||||
<div class="col-auto text-right">
|
||||
<div class="font-heading bold">{{ billGroupCurrencyRate }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row align-items-end m-b-10 text-danger" v-if="refundTotal > 0">
|
||||
<div class="col">
|
||||
<div class="font-heading all-caps fs-10">Bill Refund Total:</div>
|
||||
</div>
|
||||
<div class="col-auto text-right" v-if="is1688Supplier">
|
||||
<div class="font-heading bold">- {{ this.supplierRefunds.length > 0 ? this.supplierRefunds[0].currency.short_code : 'MYR' }} {{ this.inputPaymentTotal > 0 ? refundTotal > this.inputPaymentTotal ? this.inputPaymentTotal : formatNumber(refundTotal) : '0.00' }}</div>
|
||||
</div>
|
||||
<div class="col-auto text-right" v-else>
|
||||
<div class="font-heading bold">- {{ this.supplierRefunds[0].currency.short_code }} {{ formatNumber(refundTotal > paymentTotal ? paymentTotal : refundTotal) }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row align-items-end m-b-10 text-success">
|
||||
<div class="col">
|
||||
<div class="font-heading all-caps fs-10">Payment Total:</div>
|
||||
</div>
|
||||
<div class="col-auto text-right" v-if="is1688Supplier">
|
||||
<div class="font-heading bold">MYR {{ formatNumber(this.inputPaymentTotal) }}</div>
|
||||
</div>
|
||||
<div class="col-auto text-right" v-else>
|
||||
<div class="font-heading bold">MYR {{ formatNumber(paymentTotal - refundTotal > 0 ? (paymentTotal - refundTotal) : 0) }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row align-items-end m-b-10 text-primary" v-if="refundTotal > 0 && is1688Supplier && this.inputPaymentTotal > 0">
|
||||
<div class="col">
|
||||
<div class="font-heading all-caps fs-10">Payment Total After Refund:</div>
|
||||
</div>
|
||||
<div class="col-auto text-right">
|
||||
<div class="font-heading bold">{{ this.supplierRefunds.length > 0 ? this.supplierRefunds[0].currency.short_code : 'MYR' }} {{ refundTotal > this.inputPaymentTotal ? '0.00' : formatNumber(this.inputPaymentTotal - refundTotal) }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" v-if="is1688Supplier">
|
||||
<div class="col p-r-0">
|
||||
<validation-wrapper-component :validator="$v.parameters.payment_total">
|
||||
<label class="all-caps">Payment Total</label>
|
||||
<input type="text" class="form-control" v-model="parameters.payment_total" v-money="productPrice">
|
||||
</validation-wrapper-component>
|
||||
</div>
|
||||
<div class="col-auto b-r b-t b-b b-grey m-r-15">
|
||||
<div class="row h-100 align-items-center">
|
||||
<div class="col">
|
||||
<div class="font-heading fs-10 muted">MYR</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" v-else>
|
||||
<div class="col">
|
||||
<validation-wrapper-component :validator="$v.parameters.service_charges">
|
||||
<label class="all-caps">Service Charges</label>
|
||||
<input type="text" class="form-control" v-model="parameters.service_charges" v-money="money">
|
||||
</validation-wrapper-component>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" v-if="paymentTotal > 0">
|
||||
<div class="col">
|
||||
<button class="btn btn-xs btn-success b-rad-none p-t-5 p-b-5 all-caps fs-10 btn-block" @click="submitForm()">Create Bill Group</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" v-if="this.supplier.id !== ''">
|
||||
<div class="col mx-3 m-t-20">
|
||||
<div class="m-b-20">
|
||||
<small class="all-caps muted fs-15">Supplier Refund</small>
|
||||
</div>
|
||||
<list-component :key="supplierRefundListKey" section="supplierRefundListSection" :options="{'per_page': 20, 'type': 15, 'currency_rate_is_not_equal': 1, ...(this.supplier.id == 4548 && { 'created_after_or_equal': '01-08-2024' }), 'status': 2, 'receiver_in': [this.supplier.id]}" :endpoint="route('api.transaction.list')">
|
||||
<template slot="list" slot-scope="{data}">
|
||||
<supplier-refund-component section="supplierRefundListSection" :data="data" :is1688Supplier="is1688Supplier" :payments="payments" :supplierRefunds="supplierRefunds" :refundTotal="refundTotal" :paymentTotal="paymentTotal" :inputPaymentTotal="inputPaymentTotal" v-on:input="refundOrder($event)"></supplier-refund-component>
|
||||
</template>
|
||||
</list-component>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import FormHandler from '../../../general/mixins/formHandler';
|
||||
import { required, minValue, requiredIf} from "vuelidate/lib/validators";
|
||||
import ModalComponent from "../../general/elements/ModalComponent";
|
||||
export default {
|
||||
components: {ModalComponent},
|
||||
props: {
|
||||
payments: {
|
||||
type: Array,
|
||||
required: true
|
||||
},
|
||||
supplier: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
refreshList: {
|
||||
type: Function,
|
||||
required: true
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
'supplier': function() {
|
||||
this.supplierRefundListKey ++;
|
||||
this.supplierRefunds = []
|
||||
},
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
supplierRefunds: [],
|
||||
supplierRefundListKey: 1,
|
||||
parameters: {
|
||||
service_charges: '0',
|
||||
payment_total: '0',
|
||||
}
|
||||
}
|
||||
},
|
||||
validations: {
|
||||
parameters: {
|
||||
service_charges: {
|
||||
required: requiredIf(function () {
|
||||
return !this.is1688Supplier;
|
||||
})
|
||||
},
|
||||
payment_total: {
|
||||
required: requiredIf(function () {
|
||||
return this.is1688Supplier;
|
||||
}),
|
||||
minValue: function(value) {
|
||||
const amount = parseFloat(value.replaceAll(',', ''))
|
||||
return this.is1688Supplier ? amount >= 1 : true;
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
inputPaymentTotal(){
|
||||
return parseFloat(this.parameters.payment_total.replaceAll(',', ''));
|
||||
},
|
||||
originalTotal(){
|
||||
return this.payments.reduce(function (total, currentValue) {
|
||||
return total + currentValue.original_amount;
|
||||
}, 0);
|
||||
|
||||
},
|
||||
total(){
|
||||
return this.payments.reduce(function (total, currentValue) {
|
||||
return total + currentValue.amount;
|
||||
}, 0);
|
||||
|
||||
},
|
||||
paymentTotal(){
|
||||
return this.total ? this.total + parseFloat(this.parameters.service_charges.replaceAll(',', '')) : 0;
|
||||
},
|
||||
refundOriginalTotal(){
|
||||
return this.supplierRefunds.reduce(function (total, currentValue) {
|
||||
return total + currentValue.original_amount;
|
||||
}, 0);
|
||||
},
|
||||
refundTotal(){
|
||||
return this.supplierRefunds.reduce(function (total, currentValue) {
|
||||
return total + currentValue.amount;
|
||||
}, 0);
|
||||
},
|
||||
billGroupCurrencyRate(){
|
||||
const paymentTotal = this.inputPaymentTotal;
|
||||
return this.originalTotal && paymentTotal > 0 ? (this.originalTotal / paymentTotal).toFixed(5) : 1;
|
||||
},
|
||||
is1688Supplier(){
|
||||
// return (this.supplier.id === 4548 || this.supplier.id === 2729)
|
||||
return false;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
submitForm(){
|
||||
this.parameters = {
|
||||
payments: this.payments,
|
||||
supplierRefunds: this.supplierRefunds.sort((a, b) => {
|
||||
return a.amount - b.amount;
|
||||
}),
|
||||
service_charges: this.is1688Supplier ? '0' : this.parameters.service_charges,
|
||||
payment_total: this.is1688Supplier ? this.parameters.payment_total : '0',
|
||||
};
|
||||
|
||||
this.submit(route('api.transaction.supplier.bill_group.create', this.supplier.id), 'post', 'transactionGroupsListPaymentSection', true, true)
|
||||
},
|
||||
successHandler(){
|
||||
this.refreshList();
|
||||
this.supplierRefunds = []
|
||||
this.supplierRefundListKey ++;
|
||||
this.$store.dispatch('toggleSection', {name: 'paymentInProgressBillGroupList', status: !this.$store.getters.isShowing('paymentInProgressBillGroupList')});
|
||||
this.parameters = {
|
||||
payments: [],
|
||||
service_charges: '0',
|
||||
payment_total: '0',
|
||||
};
|
||||
},
|
||||
refundOrder(supplierRefund){
|
||||
this.supplierRefunds.some(item => item.id === supplierRefund.id) ? this.supplierRefunds = this.supplierRefunds.filter(item => item.id !== supplierRefund.id) : this.supplierRefunds.push(supplierRefund);
|
||||
},
|
||||
formatNumber(value) {
|
||||
return (Math.round((value + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")
|
||||
}
|
||||
},
|
||||
mixins: [FormHandler]
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,41 @@
|
||||
<template>
|
||||
<div class="row">
|
||||
<div class="col-auto" v-show="!isLoading">
|
||||
<button id="cancel-new-booking" name="cancel-new-booking" class="btn btn-lg btn-default bg-master-lightest b-rad-none all-caps fs-12" data-dismiss="modal" @click="cancelUpdateBooking()">Cancel</button>
|
||||
</div>
|
||||
<div class="col text-right" v-show="!isLoading && this.data.bankAccount">
|
||||
<button id="confirm-new-booking" name="confirm-new-booking" class="btn btn-lg btn-success b-rad-none all-caps fs-12" v-if="Object.keys(data.bankAccount).length" @click="submitForm()">Update Recipient</button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ModalFormHandler from '../../../general/mixins/modalFormHandler';
|
||||
export default {
|
||||
data(){
|
||||
return {
|
||||
parameters: {},
|
||||
isLoading: false,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
submitForm(){
|
||||
this.isLoading = true;
|
||||
this.parameters = {
|
||||
transferable_bank_id: this.data.bankAccount.id,
|
||||
};
|
||||
this.submit(route('api.booking.update.recipient', this.data.bookingId), 'put', this.section, true, true);
|
||||
},
|
||||
successHandler(response){
|
||||
this.isLoading = false;
|
||||
this.$emit('updatedBooking', this.data.bankAccount);
|
||||
this.formHandler();
|
||||
this.closeModal();
|
||||
},
|
||||
cancelUpdateBooking(){
|
||||
this.$emit('updateBookingCanceled');
|
||||
}
|
||||
},
|
||||
mixins: [ModalFormHandler]
|
||||
}
|
||||
</script>
|
||||
@@ -12,6 +12,13 @@
|
||||
<script>
|
||||
import ModalFormHandler from '../../../general/mixins/modalFormHandler';
|
||||
export default {
|
||||
props:{
|
||||
order_reference_no: {
|
||||
type: Array,
|
||||
default: [],
|
||||
required: false
|
||||
}
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
parameters: {}
|
||||
@@ -28,6 +35,10 @@
|
||||
convertible_currency_id: this.data.serviceType.selectedCurrency.id,
|
||||
};
|
||||
|
||||
if ([4, 10].includes(this.data.serviceType.id)) {
|
||||
this.parameters.order_reference_no = this.order_reference_no
|
||||
}
|
||||
|
||||
this.submit(route('api.booking.create'), 'post', this.section, true, true)
|
||||
},
|
||||
successHandler(response){
|
||||
|
||||
+136
File diff suppressed because one or more lines are too long
+136
File diff suppressed because one or more lines are too long
@@ -0,0 +1,136 @@
|
||||
<template>
|
||||
<div class="row p-r-10">
|
||||
<div class="col p-r-5">
|
||||
<div class="row m-b-20">
|
||||
<div class="col-7">
|
||||
<div class="row m-b-15">
|
||||
<div class="col-12">
|
||||
<div class="row m-b-5">
|
||||
<div class="col p-r-0">
|
||||
<div class="btn btn-xs btn-outline-primary btn-block text-left b-rad-none p-t-0 p-b-0 p-l-15 p-r-15" @click="selectedSupplier.status = !selectedSupplier.status">
|
||||
<div class="row">
|
||||
<div class="col p-t-5 p-b-5 fs-9">
|
||||
{{selectedSupplier.name}} - {{selectedSupplier.reference}}
|
||||
</div>
|
||||
<div class="col-auto b-l b-success">
|
||||
<div class="row h-100 align-items-center">
|
||||
<div class="col">
|
||||
<i class="fa" :class="[{'fa-angle-down': !selectedSupplier.status}, {'fa-angle-up': selectedSupplier.status}]"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="relative w-100">
|
||||
<div class="absolute w-100 b-l b-b b-r b-primary" :class="[{'hide': !selectedSupplier.status}]" style="top: 100%; right: 0; z-index: 1;">
|
||||
<div class="row text-left no-margin bg-white">
|
||||
<div class="col no-padding">
|
||||
<div class="row no-margin" v-for="supplier in suppliers" v-bind:key="supplier.id" :data="supplier">
|
||||
<div class="col b-b b-grey p-t-10 p-b-10 pointer hover-t-10 p-b-10" :class="[{'bg-primary-light': selectedSupplier.id === supplier.id}, {'text-white': selectedSupplier.id === supplier.id}, {'hover-primary': selectedSupplier.id !== supplier.id}, {'pointer': selectedSupplier.id !== supplier.id}]" @click="updateSupplier(supplier)">
|
||||
<div class="row align-items-center justify-content-center">
|
||||
<div class="col">
|
||||
<div class="font-heading fs-10">{{supplier.name}} - {{supplier.reference}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col" v-if="section === 'paymentInProgressBillGroupList'">
|
||||
<list-component :key="key" section="paymentInProgressBillGroupListSection" :endpoint="route('api.transaction.group.bill.list')" :options="{per_page: 20, status: 0, ...this.selectedSupplier.id && {issuer_in: [this.selectedSupplier.id]}, order_by: {column: 'id', DESC: true}}">
|
||||
<template slot="list" slot-scope="{data}">
|
||||
<bill-group-component :data="data" :section="section" :selectedBillGroup="selectedBillGroup" v-on:input="selectBillGroup($event)"></bill-group-component>
|
||||
</template>
|
||||
</list-component>
|
||||
</div>
|
||||
<div class="col" v-if="section === 'paymentVerificationBillGroupList'">
|
||||
<list-component :key="key" section="paymentVerificationBillGroupListSection" :endpoint="route('api.transaction.group.bill.list')" :options="{per_page: 20, has_pending_verify_transaction: true, ...this.selectedSupplier.id && {issuer_in: [this.selectedSupplier.id]}, order_by: {column: 'id', DESC: true}}">
|
||||
<template slot="list" slot-scope="{data}">
|
||||
<bill-group-component :data="data" :section="section" :selectedBillGroup="selectedBillGroup" v-on:input="selectBillGroup($event)"></bill-group-component>
|
||||
</template>
|
||||
</list-component>
|
||||
</div>
|
||||
<div class="col" v-if="section === 'paidBillGroupList'">
|
||||
<list-component :key="key" section="paidBillGroupListSection" :endpoint="route('api.transaction.group.bill.list')" :options="{per_page: 20, status_in: [2, 3], ...this.selectedSupplier.id && {issuer_in: [this.selectedSupplier.id]}, order_by: {column: 'id', DESC: true}}">
|
||||
<template slot="list" slot-scope="{data}">
|
||||
<bill-group-component :data="data" :section="section" :selectedBillGroup="selectedBillGroup" v-on:input="selectBillGroup($event)"></bill-group-component>
|
||||
</template>
|
||||
</list-component>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 col-md">
|
||||
<bill-group-payment-summary-component :selectedBillGroup="selectedBillGroup" :refreshList="updateList" :section="section"></bill-group-payment-summary-component>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
section:{
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
suppliers: [],
|
||||
selectedSupplier: {
|
||||
id: '',
|
||||
name: '',
|
||||
status: false
|
||||
},
|
||||
selectedBillGroup: {
|
||||
id: ''
|
||||
},
|
||||
key: 1
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
pendingQueue() {
|
||||
return this.$store.getters.isShowing(this.section);
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
pendingQueue(){
|
||||
this.updateList();
|
||||
},
|
||||
},
|
||||
created(){
|
||||
this.submit(route('api.company.list') + '?filters=' + JSON.stringify({'business_type': 3, 'status_in': [1, 2, 0]}), 'get', 'transactionGroupsListPaymentSection', false, false)
|
||||
},
|
||||
methods: {
|
||||
successHandler(response){
|
||||
this.suppliers = response.payload.data;
|
||||
},
|
||||
updateSupplier(supplier){
|
||||
if(supplier !== this.selectedSupplier){
|
||||
this.selectedSupplier = supplier;
|
||||
this.updateList();
|
||||
}
|
||||
},
|
||||
updateList(){
|
||||
this.selectedSupplier.status = false;
|
||||
this.selectedBillGroup = {
|
||||
id: ''
|
||||
};
|
||||
this.key++;
|
||||
},
|
||||
selectBillGroup(billGroup){
|
||||
this.selectedBillGroup = billGroup;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
</script>
|
||||
+16
-5
@@ -211,6 +211,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<booking-order-reference-form-component v-if='oneSixEightEightServiceIds.includes(booking.service.id)' :order_reference_no="booking.order_reference_no" :booking_status="booking.status" :booking_id="booking.id" :section="section"></booking-order-reference-form-component>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -219,7 +220,7 @@
|
||||
</div>
|
||||
<div class="row no-margin">
|
||||
<div class="col bg-white padding-25">
|
||||
<div class="row align-items-center m-b-10" v-if='booking.service.id === 4'>
|
||||
<div class="row align-items-center m-b-10" v-if='oneSixEightEightServiceIds.includes(booking.service.id)'>
|
||||
<div class="col">
|
||||
<div class="row">
|
||||
<div class="col-auto p-r-0">
|
||||
@@ -261,7 +262,7 @@
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row m-t-15" v-if="$store.getters.isAdmin && booking.service.id === 4 && booking.documents.ecommerce_purchase_order">
|
||||
<div class="row m-t-15" v-if="$store.getters.isAdmin && oneSixEightEightServiceIds.includes(booking.service.id) && booking.documents.ecommerce_purchase_order">
|
||||
<div class="col-sm col-md-auto">
|
||||
<div class="btn btn-sm btn block all-caps b-rad-none btn-danger pointer requestModal" data-type="deletePo">Delete PO</div>
|
||||
</div>
|
||||
@@ -269,7 +270,7 @@
|
||||
<delete-po-form-component :data="booking" :section="section" class="text-center"></delete-po-form-component>
|
||||
</modal-component>
|
||||
</div>
|
||||
<div class="row m-b-25" v-if="$store.getters.isAdmin && booking.service.id === 4 && booking.status !== 3">
|
||||
<div class="row m-b-25" v-if="$store.getters.isAdmin && oneSixEightEightServiceIds.includes(booking.service.id) && booking.status !== 3">
|
||||
<div class="col">
|
||||
<div class="row" v-if="!booking.documents.ecommerce_purchase_order">
|
||||
<div class="col">
|
||||
@@ -278,7 +279,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<purchase-order-form-component v-if="booking.service.id !== 4 || $store.getters.isAdmin || [199, 510].includes($store.getters.getCompanyId) || companySegmentIds.includes(24)" :data="booking" :section="section"></purchase-order-form-component>
|
||||
<purchase-order-form-component v-if="!oneSixEightEightServiceIds.includes(booking.service.id) || $store.getters.isAdmin || [199, 510].includes($store.getters.getCompanyId) || companySegmentIds.includes(24) || companySegmentIds.includes(36)" :data="booking" :section="section" :companySegmentIds="companySegmentIds"></purchase-order-form-component>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row m-t-15" v-if="booking.status === 3 && $store.getters.isSuperAdmin || ($store.getters.isCustomer && $store.getters.getCompanyId === 199)">
|
||||
@@ -448,6 +449,15 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col" v-if="booking.payment_history.length">
|
||||
<div class="alert alert-danger padding-15" role="alert">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="font-heading fs-10">Please contact CIEF if the supplier hasn’t received the funds within 14 working days; otherwise, the dispute request may no longer be traceable.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row m-t-5" v-if="$store.getters.isAdmin">
|
||||
@@ -483,7 +493,8 @@
|
||||
isLoading: true,
|
||||
booking: null,
|
||||
attention: false,
|
||||
bearShowing: false
|
||||
bearShowing: false,
|
||||
oneSixEightEightServiceIds: [4, 10],
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
||||
+116
@@ -0,0 +1,116 @@
|
||||
<template>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="row">
|
||||
<div class="col p-r-5">
|
||||
<div class="row m-b-20">
|
||||
<div class="col-12 col-md-7">
|
||||
<div class="row m-b-15">
|
||||
<div class="col">
|
||||
<div class="row m-b-5">
|
||||
<div class="col p-r-0">
|
||||
<div class="btn btn-xs btn-outline-primary btn-block text-left b-rad-none p-t-0 p-b-0 p-l-15 p-r-15" @click="selectedSupplier.status = !selectedSupplier.status">
|
||||
<div class="row">
|
||||
<div class="col p-t-5 p-b-5 fs-9">
|
||||
{{selectedSupplier.name}} - {{selectedSupplier.reference}}
|
||||
</div>
|
||||
<div class="col-auto b-l b-success">
|
||||
<div class="row h-100 align-items-center">
|
||||
<div class="col">
|
||||
<i class="fa" :class="[{'fa-angle-down': !selectedSupplier.status}, {'fa-angle-up': selectedSupplier.status}]"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="relative w-100">
|
||||
<div class="absolute w-100 b-l b-b b-r b-primary" :class="[{'hide': !selectedSupplier.status}]" style="top: 100%; right: 0; z-index: 1;">
|
||||
<div class="row text-left no-margin bg-white">
|
||||
<div class="col no-padding">
|
||||
<div class="row no-margin" v-for="supplier in suppliers" v-bind:key="supplier.id" :data="supplier">
|
||||
<div class="col b-b b-grey p-t-10 p-b-10 pointer hover-t-10 p-b-10" :class="[{'bg-primary-light': selectedSupplier.id === supplier.id}, {'text-white': selectedSupplier.id === supplier.id}, {'hover-primary': selectedSupplier.id !== supplier.id}, {'pointer': selectedSupplier.id !== supplier.id}]" @click="updateSupplier(supplier)">
|
||||
<div class="row align-items-center justify-content-center">
|
||||
<div class="col">
|
||||
<div class="font-heading fs-10">{{supplier.name}} - {{supplier.reference}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" v-if="this.selectedSupplier.id !== ''">
|
||||
<div class="col">
|
||||
<list-component :key="currencyOrderKey" section="transactionGroupsListPaymentSection" :options="{'per_page': 20, 'without_bill_group': true, ...(this.selectedSupplier.id == 4548 && { 'created_after_or_equal': '01-08-2024' }), 'issuer_in': [this.selectedSupplier.id]}" :endpoint="route('api.transaction.group.list')">
|
||||
<template slot="list" slot-scope="{data}">
|
||||
<transaction-group-payment-component section="transactionGroupsListPaymentSection" :data="data" :payments="payments" v-on:input="updateOrder($event)" :emptyPaymentList="emptyPaymentList"></transaction-group-payment-component>
|
||||
</template>
|
||||
</list-component>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" v-else>
|
||||
<div class="col">
|
||||
<loading-component style="height: 200px; top: 0;" key="1" color="success"></loading-component>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 col-md">
|
||||
<supplier-white-form-place-order-form-component :payments="payments" :refreshList="updateList" :supplier="selectedSupplier" section="transactionGroupsListPaymentSection"></supplier-white-form-place-order-form-component>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data(){
|
||||
return {
|
||||
suppliers: [],
|
||||
selectedSupplier: {
|
||||
id: '',
|
||||
name: '',
|
||||
status: false
|
||||
},
|
||||
payments: [],
|
||||
currencyOrderKey: 1,
|
||||
}
|
||||
},
|
||||
created(){
|
||||
this.submit(route('api.company.list') + '?filters=' + JSON.stringify({'business_type': 3, 'status_in': [1, 2, 0]}), 'get', 'transactionGroupsListPaymentSection', false, false)
|
||||
},
|
||||
methods: {
|
||||
successHandler(response){
|
||||
this.suppliers = response.payload.data;
|
||||
this.selectedSupplier= this.suppliers[0];
|
||||
this.updateList();
|
||||
},
|
||||
updateSupplier(supplier){
|
||||
if(supplier !== this.selectedSupplier){
|
||||
this.selectedSupplier= supplier;
|
||||
this.updateList();
|
||||
}
|
||||
},
|
||||
updateList(){
|
||||
this.currencyOrderKey ++;
|
||||
this.selectedSupplier.status = false;
|
||||
this.payments = [];
|
||||
},
|
||||
emptyPaymentList() {
|
||||
this.payments = [];
|
||||
},
|
||||
updateOrder(payment){
|
||||
this.payments.some(item => item.id === payment.id) ? this.payments = this.payments.filter(item => item.id !== payment.id) : this.payments.push(payment);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
</script>
|
||||
+11
-4
@@ -117,11 +117,16 @@
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<list-component ref="pendingOrdersList" section="pendingOrdersSection" :endpoint="route('api.transaction.list')" :options="{per_page: 5, status: 2, owner_type: 'App\\Models\\Booking', type: 1, original_currency_id_in: [selectedCurrency.id], transaction_service_id: selectedService.id}">
|
||||
<list-component ref="pendingOrdersList" section="pendingOrdersSection" :endpoint="route('api.transaction.list')" :options="{per_page: 5, status: 2, owner_type: 'App\\Models\\Booking', type: 1, original_currency_id_in: [selectedCurrency.id], transaction_service_id: selectedService.id, does_not_have_refund_in_progress: true}">
|
||||
<template slot="list" slot-scope="{data}">
|
||||
<supplier-pending-order-component :data="data" v-on:input="updateOrder($event)"></supplier-pending-order-component>
|
||||
</template>
|
||||
</list-component>
|
||||
<!-- <list-polling-component ref="pendingOrdersList" section="pendingOrdersSection" :endpoint="route('api.transaction.list.job')" :options="{per_page: 5, status: 2, owner_type: 'App\\Models\\Booking', type: 1, original_currency_id_in: [selectedCurrency.id], transaction_service_id: selectedService.id}">
|
||||
<template slot="list" slot-scope="{data}">
|
||||
<supplier-pending-order-component :data="data" v-on:input="updateOrder($event)"></supplier-pending-order-component>
|
||||
</template>
|
||||
</list-polling-component> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -165,7 +170,7 @@
|
||||
}
|
||||
},
|
||||
created(){
|
||||
this.submit(route('api.company.list') + '?filters=' + JSON.stringify({'business_type': 3, 'status_in': [1, 2, 0]}), 'get', 'pendingOrdersSection', false, false)
|
||||
this.submit(route('api.company.list') + '?filters=' + JSON.stringify({'business_type': 3, 'status_in': [1, 2, 0]}), 'get', 'pendingOrdersSection', false, false); //cief todo: Uncaught (in promise) null
|
||||
},
|
||||
methods: {
|
||||
successHandler(response){
|
||||
@@ -195,7 +200,9 @@
|
||||
},
|
||||
updateList(){
|
||||
|
||||
this.$refs.pendingOrdersList.updateFilters({per_page: 10000, status: 2, type: 1, original_currency_id_in: [this.selectedCurrency.id], transaction_service_id: this.selectedService.id});
|
||||
// todo-refund: activate this for partial refund
|
||||
// this.$refs.pendingOrdersList.updateFilters({per_page: 10000, status: 2, type: 1, original_currency_id_in: [this.selectedCurrency.id], transaction_service_id: this.selectedService.id, is_not_fully_refunded: true});
|
||||
this.$refs.pendingOrdersList.updateFilters({per_page: 10000, status: 2, type: 1, original_currency_id_in: [this.selectedCurrency.id], transaction_service_id: this.selectedService.id, does_not_have_refund_in_progress: true});
|
||||
|
||||
this.selectedSupplier.status = false;
|
||||
this.currencyDropdownLaunch.status = false;
|
||||
@@ -210,4 +217,4 @@
|
||||
|
||||
|
||||
}
|
||||
</script>
|
||||
</script>
|
||||
|
||||
@@ -11,7 +11,7 @@
|
||||
<div class="col-4">
|
||||
<div class="row">
|
||||
<div class="col-auto p-r-10">
|
||||
<div class="font-heading all-caps fs-11">{{item.type === 2 ? item.reference : item.company_business_type === 1 ? 'Company\'s Bank Account' : 'Personal Bank Account'}}</div>
|
||||
<div class="font-heading all-caps fs-11">{{item.type === 2 ? item.reference : item.type === 4 ? 'Alipay' : item.company_business_type === 1 ? 'Company\'s Bank Account' : 'Personal Bank Account'}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
|
||||
File diff suppressed because one or more lines are too long
+1
-1
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="row m-b-15 align-items-end parentContainer">
|
||||
<div class="row m-b-15 align-items-end parentContainer" v-if="data">
|
||||
<div class="col">
|
||||
<!-- 1688 consent -->
|
||||
<div class="row m-l-0 m-r-0 m-b-15 animate__animated animate__tada animate__repeat-2 animate__delay-3s" v-if="!data.segments.some(item => item.id === 13 || item.id === 16)">
|
||||
|
||||
+52
-18
@@ -1,30 +1,64 @@
|
||||
<template>
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<h5 v-if="item.reward" class="card-title"> {{ item.reward.name }}</h5>
|
||||
<h5 v-else="item.voucher" class="card-title"> {{ item.voucher.name }}</h5>
|
||||
<p v-if="item.reward" class="card-text">{{ item.reward.description }}</p>
|
||||
<p v-if="item.voucher && item.voucher.is_redeemed" class="text-secondary"> {{ item.voucher.code }}</p>
|
||||
<p v-else class="text-primary"> {{ item.voucher.code }}</p>
|
||||
<p v-if="item.voucher.type == 'AMOUNT'">RM{{ item.voucher.value/100 }} Discount</p>
|
||||
<p v-if="item.voucher.type == 'PERCENT'">{{ item.voucher.value }}% Discount</p>
|
||||
<div class="row border p-3 mb-4 parentContainer">
|
||||
<div class="col-md-4">
|
||||
<p v-if="item.reward">{{ item.reward.name }}</p>
|
||||
<p v-else>{{ item.voucher.name }}</p>
|
||||
<p v-if="item.voucher.description">{{ item.voucher.description }}</p>
|
||||
<p v-if="item.reward">{{ item.reward.description }}</p>
|
||||
|
||||
<p v-if="item.voucher && item.voucher.is_redeemed">Voucher claimed</p>
|
||||
<p v-else-if="item.voucher.end_date && new Date() > new Date(item.voucher.end_date)">This voucher has expired</p>
|
||||
<p v-else-if="item.voucher && item.voucher.end_date">Valid till {{ item.voucher.end_date }}</p>
|
||||
<p v-else>Non-expired</p>
|
||||
</div>
|
||||
<div class="card-footer text-muted">
|
||||
<p v-if="item.voucher && item.voucher.is_redeemed">
|
||||
Voucher claimed
|
||||
</p>
|
||||
<p v-else-if="item.voucher && item.voucher.end_date">
|
||||
Valid till {{ item.voucher.end_date }}
|
||||
</p>
|
||||
<p v-else>
|
||||
-
|
||||
<div class="col-md-3">
|
||||
<p v-if="item.voucher && item.voucher.is_redeemed" class="text-secondary">{{ item.voucher.code }}</p>
|
||||
<p v-else class="text-primary">{{ item.voucher.code }}</p>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<p v-if="item.voucher.type == 'AMOUNT'">RM{{ item.voucher.value / 100 }} Discount</p>
|
||||
<p v-if="item.voucher.type == 'PERCENT'">
|
||||
<span v-if="item.voucher.value === 1">50% discount on service fee only</span>
|
||||
<span v-else>{{ item.voucher.value }}% Discount</span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="col-md-1">
|
||||
<a class="pointer requestModal" :data-type="'showVoucherTnC-' + item.id">Terms</a>
|
||||
<modal-component class="animate__animated animate__fast animate__fadeIn" styleType="fill-in" size="extra-large" :type="'showVoucherTnC-' + item.id">
|
||||
<div class="container">
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
Terms & Conditions
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<ol>
|
||||
<li>Vouchers are only valid for purchases made on <a href="https://exchange.cief-malaysia.com/" target="_blank">https://exchange.cief-malaysia.com/</a>.</li>
|
||||
<li>Each voucher is applicable for a single transaction (unless stated otherwise).</li>
|
||||
<li>Each voucher is only applicable for new orders.</li>
|
||||
<li>Voucher codes are to be entered at the checkout or cart page (unless stated otherwise).</li>
|
||||
<li>Vouchers are not valid for promotions or discounted products (unless stated otherwise).</li>
|
||||
<li>Customers should take note of the expiry dates of the voucher(s) that they wish to redeem. Any voucher(s) which have expired will be invalid.</li>
|
||||
<li>Individual vouchers are only valid during its respective promotion period. This guideline overrides any individual voucher policy (unless stated otherwise).</li>
|
||||
<li>CIEF reserves the right to cancel any order if a customer’s purchasing behavior appears to be suspicious or potentially fraudulent.</li>
|
||||
<li>CIEF vouchers are not exchangeable for cash at <a href="https://exchange.cief-malaysia.com/" target="_blank">https://exchange.cief-malaysia.com/</a>.</li>
|
||||
<li>This voucher can only be used and redeemed by a registered customer who has already logged into their account during purchase.</li>
|
||||
<li>CIEF reserves the right to amend the terms & conditions or cancel any vouchers/promotions without prior notice.</li>
|
||||
<li>Additional terms & conditions are stated on the respective promotion banners (e.g. duration, discount amounts, validity for campaigns/promotions or certain services).</li>
|
||||
</ol>
|
||||
<button type="button" class="btn btn-primary" data-dismiss="modal">OK</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</modal-component>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import componentHandler from '../../../general/mixins/componentHandler';
|
||||
export default {
|
||||
methods: {
|
||||
submit(){},
|
||||
},
|
||||
mixins: [componentHandler]
|
||||
}
|
||||
</script>
|
||||
|
||||
+110
@@ -0,0 +1,110 @@
|
||||
<template>
|
||||
<div class="row" v-if="$store.getters.isAdmin">
|
||||
<div class="col">
|
||||
<div class="row">
|
||||
<div class="col ml-md-3 ml-0 mt-md-0 mt-3 bg-white padding-15">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="row m-b-10">
|
||||
<div class="col">
|
||||
<div class="font-heading fs-16 all-caps bold m-b-15">Add Voucher Select</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<validation-wrapper-component selectable :validator="$v.voucherCode">
|
||||
<label>Voucher Options</label>
|
||||
<selectable-hard-coded-component section="rewardisActiveOptions" :selectable-options="options" v-model="voucherCode"></selectable-hard-coded-component >
|
||||
</validation-wrapper-component>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row m-l-0 m-r-0" style="height: 20px">
|
||||
<i class="fa fa-spinner fa-spin m-b-5" v-show="$store.getters.isLoading(section) && voucherIsChecking"></i>
|
||||
<span class="text-danger" v-if="voucherCodeFailedReason">{{ voucherCodeFailedReason }}</span>
|
||||
<span class="text-success" v-if="voucherCodeFailedReason === '' && voucherFetched">Voucher added</span>
|
||||
</div>
|
||||
<div class="row m-t-20">
|
||||
<div class="col">
|
||||
<button type="button" class="btn btn-block p-t-10 p-b-10 p-r-35 p-l-35 btn-success b-rad-none" @click="submitForm">Add Voucher</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { required } from "vuelidate/lib/validators";
|
||||
export default {
|
||||
props: {
|
||||
id: {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
section:{
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
options: {
|
||||
type: Array,
|
||||
required: true
|
||||
},
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
parameters: {
|
||||
voucherCode: '',
|
||||
},
|
||||
voucherCode: '',
|
||||
voucherCodeFailedReason: '',
|
||||
voucherFetched: false,
|
||||
voucherIsChecking: false,
|
||||
}
|
||||
},
|
||||
validations: {
|
||||
voucherCode: {
|
||||
required
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
successHandler(response){
|
||||
if(response.payload.data && response.payload.data.voucher_id !== undefined){
|
||||
this.voucherFetched = true;
|
||||
this.$store.dispatch('reloadList', {'name': "customerVouchersListSection"});
|
||||
this.voucherCode = '';
|
||||
this.$v.$reset();
|
||||
}
|
||||
else{
|
||||
this.voucherFetched = false;
|
||||
this.voucherCodeFailedReason = 'Voucher Invalid';
|
||||
if(response.payload.data && response.payload.data.reason){
|
||||
this.voucherCodeFailedReason = response.payload.data.reason;
|
||||
}
|
||||
}
|
||||
this.$store.dispatch('reloadList', {'name': "voucherCampaignsSection"});
|
||||
this.voucherIsChecking = false;
|
||||
},
|
||||
submitForm(){
|
||||
this.reset();
|
||||
this.voucherIsChecking = true;
|
||||
this.parameters = {
|
||||
voucherCode: this.voucherCode,
|
||||
userId: this.id
|
||||
};
|
||||
this.submit(this.route('api.voucher.create'), 'post', this.section, false, false);
|
||||
},
|
||||
errorHandler(error){
|
||||
this.voucherCodeFailedReason = 'Some went wrong, please report this to tech';
|
||||
this.voucherFetched = false;
|
||||
this.voucherIsChecking = false;
|
||||
},
|
||||
reset(){
|
||||
this.voucherFetched = false;
|
||||
this.voucherCodeFailedReason = "";
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -75,12 +75,10 @@
|
||||
}
|
||||
else{
|
||||
this.voucherFetched = false;
|
||||
this.voucherCodeFailedReason = 'Voucher Invalid';
|
||||
if(response.payload.data && response.payload.data.reason){
|
||||
this.voucherCodeFailedReason = response.payload.data.reason;
|
||||
}
|
||||
else{
|
||||
this.voucherCodeFailedReason = 'Voucher Invalid';
|
||||
}
|
||||
}
|
||||
this.voucherIsChecking = false;
|
||||
},
|
||||
@@ -94,6 +92,7 @@
|
||||
this.submit(this.route('api.voucher.create'), 'post', this.section, false, false);
|
||||
},
|
||||
errorHandler(error){
|
||||
this.voucherCodeFailedReason = 'Something went wrong, please report this to our customer service';
|
||||
this.voucherFetched = false;
|
||||
this.voucherIsChecking = false;
|
||||
},
|
||||
|
||||
+13
-3
@@ -1,6 +1,11 @@
|
||||
<template>
|
||||
<div class="row d-none" :class="[{'d-flex': $store.getters.isAdmin}]" v-if="$store.getters.isAdmin" >
|
||||
<div class="row d-none" :class="[{'d-flex': $store.getters.isAdmin}]" v-if="$store.getters.isAdmin">
|
||||
<div class="col-md-12 col-lg col-xl">
|
||||
<div class="row m-b-10">
|
||||
<div class="col">
|
||||
<div class="font-heading fs-16 all-caps bold m-b-15">Customer Vouchers</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="row tabsContainer">
|
||||
@@ -52,7 +57,7 @@
|
||||
<div class="col">
|
||||
<div class="row">
|
||||
<div class="col" v-if="this.$store.getters.getUserId">
|
||||
<list-component section="customerVouchersListSection" :endpoint="route('api.voucher.user.list')" :options="{ 'has_active_reward': id }">
|
||||
<list-component section="customerVouchersListSection" :endpoint="route('api.voucher.user.list')" :options="{ 'has_vouchers_all_with_user': id }">
|
||||
<template slot="list" slot-scope="{data}">
|
||||
<single-user-reward-item-component :data="data"></single-user-reward-item-component>
|
||||
</template>
|
||||
@@ -69,10 +74,15 @@
|
||||
<div class="col">
|
||||
<div class="row">
|
||||
<div class="col" v-if="this.$store.getters.getUserId">
|
||||
<list-component section="customerRewardsListSection" :endpoint="route('api.reward.list.details.admin', id)" :options="{'is_active': true, order_by:{ column:'order', DESC:false}}">
|
||||
<!-- <list-component section="customerRewardsListSection" :endpoint="route('api.reward.list.details.admin', id)" :options="{'is_active': true, order_by:{ column:'order', DESC:false}}">
|
||||
<template slot="list" slot-scope="{data}">
|
||||
<single-reward-details-item-component :data="data"></single-reward-details-item-component>
|
||||
</template>
|
||||
</list-component> -->
|
||||
<list-component section="customerRewardsListSection" :endpoint="route('api.voucher.user.list')" :options="{'has_active_reward_for_admin': id}">
|
||||
<template slot="list" slot-scope="{data}">
|
||||
<single-user-reward-item-component :data="data"></single-user-reward-item-component>
|
||||
</template>
|
||||
</list-component>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
+10
-5
@@ -19,7 +19,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col m-r-5 d-none d-md-inline">
|
||||
<!-- <div class="col m-r-5 d-none d-md-inline">
|
||||
<div class="row fs-12 text-center">
|
||||
<div class="col p-t-20 p-b-20 bg-master-lighter tabButton" tab-name="rewards">
|
||||
<div class="row">
|
||||
@@ -29,7 +29,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
<div class="col m-r-5 d-none d-md-inline">
|
||||
<div class="row fs-12 text-center">
|
||||
<div class="col p-t-20 p-b-20 bg-master-lighter tabButton" tab-name="used">
|
||||
@@ -52,7 +52,7 @@
|
||||
<div class="col">
|
||||
<div class="row">
|
||||
<div class="col" v-if="this.$store.getters.getUserId">
|
||||
<list-component section="customerVouchersListSection" :endpoint="route('api.voucher.user.list')" :options="{ 'has_active_reward': true }">
|
||||
<list-component section="customerVouchersListSection" :endpoint="route('api.voucher.user.list')" :options="{ 'has_vouchers_all_with_user': true }">
|
||||
<template slot="list" slot-scope="{data}">
|
||||
<single-user-reward-item-component :data="data"></single-user-reward-item-component>
|
||||
</template>
|
||||
@@ -69,11 +69,16 @@
|
||||
<div class="col">
|
||||
<div class="row">
|
||||
<div class="col" v-if="this.$store.getters.getUserId">
|
||||
<list-component section="customerRewardsListSection" :endpoint="route('api.reward.list.details')" :options="{'random_name': true, order_by:{ column:'order', DESC:false}}">
|
||||
<!-- <list-component section="customerRewardsListSection" :endpoint="route('api.reward.list.details')" :options="{'is_active': true, order_by:{ column:'order', DESC:false}}">
|
||||
<template slot="list" slot-scope="{data}">
|
||||
<single-reward-details-item-component :data="data"></single-reward-details-item-component>
|
||||
</template>
|
||||
</list-component>
|
||||
</list-component> -->
|
||||
<!-- <list-component section="customerRewardsListSection" :endpoint="route('api.voucher.user.list')" :options="{'has_active_reward': true}">
|
||||
<template slot="list" slot-scope="{data}">
|
||||
<single-user-reward-item-component :data="data"></single-user-reward-item-component>
|
||||
</template>
|
||||
</list-component> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -0,0 +1,162 @@
|
||||
<template>
|
||||
<transition-component group enter-class="animate__animated animate__fadeInUp animate__delay-1 animate__faster p-r-30" leave-class="animate__animated animate__fadeOutDown animate__faster p-r-30" style="min-height: 300px;width:100%">
|
||||
<loading-component style="height: 200px; top: 0;" key="1" color="success" v-show="isLoading"></loading-component>
|
||||
<div class="row" key="2" v-show="!$store.getters.isLoading(section)">
|
||||
<div class="col">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="row align-items-center justify-content-center p-t-50 p-b-50" v-show="!$store.getters.getListData(section).length && !isLoading && emptyListSection">
|
||||
<div class="col-10">
|
||||
<div class="row align-items-center justify-content-center hint-text">
|
||||
<div class="col-4 hint-text"><img src="/images/not-found-illustration.png" class="w-100 hint-text"/></div>
|
||||
</div>
|
||||
<div class="row text-center">
|
||||
<div class="col">
|
||||
<div class="row m-t-20">
|
||||
<div class="col">
|
||||
<p class="all-caps no-margin fs-11" style="letter-spacing: 2px;">Nothing To Show Here</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row m-t-5 align-items-center justify-content-center">
|
||||
<div class="col">
|
||||
<small class="fs-9 muted all-caps font-lato" style="letter-spacing: 2px">There is no results found, Try adjusting your filters to find what you are looking for.</small>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" v-show="!isLoading">
|
||||
<div class="col">
|
||||
<div class="list disable-text-selection" data-check-all="checkAll">
|
||||
<div class="row" ref="list" v-for="item in $store.getters.getListData(section)" v-bind:key="item.id" :data="item">
|
||||
<div class="col">
|
||||
<slot name="list" :data="item"></slot>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" v-show="!isLoading">
|
||||
<div class="col">
|
||||
<pagination-component :section="section" class="mb-5" ref="pagination"></pagination-component>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</transition-component>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import requestV2 from '../../../general/mixins/aws/requestV2'
|
||||
export default {
|
||||
props: {
|
||||
section:{
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
endpoint: {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
options: {
|
||||
default () {
|
||||
return {}
|
||||
}
|
||||
},
|
||||
emptyListSection: {
|
||||
type: Boolean,
|
||||
default: true,
|
||||
}
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
filters: this.options,
|
||||
isLoading: false,
|
||||
}
|
||||
},
|
||||
created(){
|
||||
this.setDecoratorDefault();
|
||||
this.$store.dispatch('updateListQueue', {'name': this.section, 'page': 1, 'filters': this.filters}); //cief todo: Uncaught (in promise) null
|
||||
},
|
||||
computed: {
|
||||
pendingList () {
|
||||
return this.$store.getters.isInCompleteQueue(this.section);
|
||||
},
|
||||
getJob() {
|
||||
return this.$store.getters.getJob(this.section);
|
||||
},
|
||||
getJobAttemptCount() {
|
||||
return this.$store.getters.getJobAttemptCount(this.section);
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
pendingList(inComplete){
|
||||
if(inComplete){
|
||||
this.fetchList();
|
||||
}
|
||||
},
|
||||
getJobAttemptCount(newValue, oldValue) {
|
||||
// console.log('Old value:', JSON.stringify(oldValue));
|
||||
// console.log('New value:', JSON.stringify(newValue));
|
||||
if(this.getJob){
|
||||
this.fetchJobResult(this.getJob.isLastAttempt);
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
fetchList(){
|
||||
let listDecorators = this.$store.getters.getListDetails(this.section);
|
||||
let url = this.endpoint + '?page=' + listDecorators.page + '&filters=' + JSON.stringify(listDecorators.filters);
|
||||
this.isLoading = true;
|
||||
this.$store.dispatch('submitJobRequest', {'url': url, 'name': this.section});
|
||||
},
|
||||
//cief todo: remove?
|
||||
// updateFilters(filters){
|
||||
// this.filters = filters;
|
||||
// this.setDecoratorDefault();
|
||||
// console.log('updateFilters');
|
||||
// this.submit(this.endpoint + '?page=1&filters=' + JSON.stringify(this.filters), 'get', this.section, false, false); //cief todo: Uncaught (in promise) null
|
||||
// },
|
||||
successHandler(response){
|
||||
let result = JSON.parse(response.payload.data.result);
|
||||
result.meta = {
|
||||
current_page: result.meta.current_page,
|
||||
first_page_url: result.meta.first_page_url,
|
||||
from: result.meta.from,
|
||||
last_page: result.meta.last_page,
|
||||
last_page_url: result.meta.last_page_url,
|
||||
next_page_url: result.meta.next_page_url,
|
||||
path: result.meta.path,
|
||||
per_page: result.meta.per_page,
|
||||
prev_page_url: result.meta.prev_page_url,
|
||||
to: result.meta.to,
|
||||
total: result.meta.total
|
||||
};
|
||||
this.$store.dispatch('completeList', {'name': this.section, 'data': result.data});
|
||||
this.$store.dispatch('stopPollingJobResultByJobId', {'jobId': this.getJob.jobId});
|
||||
this.$refs.pagination.makePagination(result.meta, result.links);
|
||||
this.isLoading = false;
|
||||
},
|
||||
errorHandler(error){
|
||||
// console.log("Error: " + JSON.stringify(error));
|
||||
this.$store.dispatch('updatePollingJobResultByJobId', {'jobId': this.getJob.jobId, 'isPolling': false, 'isFetchingResult': false });
|
||||
},
|
||||
fetchJobResult(jobId, isLastAttempt = false) {
|
||||
this.$store.dispatch('updatePollingJobResultByJobId', {'jobId': this.getJob.jobId, 'isFetchingResult': true });
|
||||
try {
|
||||
let anotherEndpoint = route('api.job.fetch', this.getJob.jobId);
|
||||
if(isLastAttempt){
|
||||
anotherEndpoint = route('api.job.fetch.last.attempt', this.getJob.jobId, isLastAttempt);
|
||||
}
|
||||
this.poll(anotherEndpoint, 'get', this.section, false, false); //cief todo: Uncaught (in promise) null
|
||||
} catch (error) {
|
||||
console.error('Error fetchJobResult', error);
|
||||
}
|
||||
}
|
||||
},
|
||||
mixins: [requestV2]
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,49 @@
|
||||
<template>
|
||||
<div class="row w-100">
|
||||
<div class="col">
|
||||
<loading-component style="height: 300px; top: 0;" key="1" color="success" v-show="isLoading" ></loading-component>
|
||||
<!-- <div class="row justify-content-center padding-30" v-show="!isLoading"> -->
|
||||
<div class="row justify-content-center flex-column bg-white rounded padding-30" v-show="!isLoading">
|
||||
<h4 class="m-b-20">Remarks</h4>
|
||||
<div class="col">
|
||||
<div class="row" v-for="remark in data.remarks">
|
||||
<div class="col">
|
||||
<remark-list-component :section="section" :data="remark"></remark-list-component>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row align-items-center justify-content-center p-t-50 p-b-50" v-if="!data.remarks.length">
|
||||
<div class="col-10">
|
||||
<div class="row align-items-center justify-content-center hint-text">
|
||||
<div class="col-4 hint-text">
|
||||
<img src="/images/not-found-illustration.png" class="w-100 hint-text" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="row text-center">
|
||||
<div class="col">
|
||||
<div class="row m-t-20">
|
||||
<div class="col">
|
||||
<p class="all-caps no-margin fs-11" style="letter-spacing: 2px;">Nothing To Show Here Yet!</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<remark-comment-form-component :section="section" :module_type="module_type" :id="data.id"></remark-comment-form-component>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import ModalFormHandler from '../../../general/mixins/modalFormHandler';
|
||||
export default {
|
||||
props: {
|
||||
module_type: {
|
||||
type: String,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
mixins: [ModalFormHandler]
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,71 @@
|
||||
<template>
|
||||
<!-- <div class="row m-b-20 parentContainer"> -->
|
||||
<div class="row m-b-20 parentContainer bg-white padding-10 rounded" style="margin: 10px">
|
||||
<div class="col">
|
||||
<div class="row justify-content-center align-items-center">
|
||||
<div class="hide col-auto btn-rounded padding-10 d-flex justify-content-center align-items-center bg-master-lighter" style="width: 30px;height: 30px; box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.14);">
|
||||
<span class="bold">{{item.commenter.name.substr(0, 1)}}</span>
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="row">
|
||||
<div class="col-auto">
|
||||
<p class="no-margin muted bold fs-14">{{item.commenter.name}}</p>
|
||||
</div>
|
||||
<div class="col-auto">
|
||||
<span class="fs-12 muted normal">{{item.long_ago}}</span>
|
||||
</div>
|
||||
<div class="col d-flex justify-content-end">
|
||||
<div class="row">
|
||||
<div class="col p-t-5 p-b-5 b-a b-grey">
|
||||
<div class="row" v-if="!isEdit && $store.getters.isAdmin">
|
||||
<div class="col">
|
||||
<i class="fa fa-edit pointer" @click="isEdit = !isEdit"></i>
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="requestModal pointer" data-type="deleteComment">
|
||||
<i class="fa fa-trash"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" v-if="isEdit">
|
||||
<div class="col">
|
||||
<i class="fa fa-times pointer" @click="isEdit = !isEdit"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<p v-if="!isEdit">{{item.content}}</p>
|
||||
<remark-comment-form-component :section="section" :data="item" :id="item.owner_id" v-on:submit="isEdit=false" v-if="isEdit" module_type="Transaction"></remark-comment-form-component>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<modal-component class="animate__animated animate__fast animate__fadeIn" styleType="fill-in" type="deleteComment">
|
||||
<delete-remark-form-component :section="section" :data="item"></delete-remark-form-component>
|
||||
</modal-component>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import componentHandler from '../../../general/mixins/componentHandler';
|
||||
|
||||
export default {
|
||||
props: {
|
||||
section: {
|
||||
type: String,
|
||||
required: true,
|
||||
}
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
isEdit: false,
|
||||
}
|
||||
},
|
||||
mixins: [componentHandler]
|
||||
}
|
||||
</script>
|
||||
@@ -8,7 +8,7 @@
|
||||
<div class="col">
|
||||
<h3>To activate the service, please take note of the following important details:</h3>
|
||||
<ol class="m-t-15">
|
||||
<li class='text-left'>The minimum amount is <strong>CNY 10,000</strong> for each transfer.</li>
|
||||
<li class='text-left'>The minimum amount is <strong>CNY 1,000</strong> for each transfer.</li>
|
||||
<li class='text-left'>The purchase order must be filled in before making payments.</li>
|
||||
<li class='text-left'>The processing time for each transaction is <strong>3-7 working days</strong>.</li>
|
||||
</ol>
|
||||
|
||||
@@ -0,0 +1,32 @@
|
||||
<template>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<loading-component style="height: 300px; top: 0;" key="1" color="success" v-show="isLoading" ></loading-component>
|
||||
<div class="row justify-content-center" v-show="!isLoading">
|
||||
<div class="col">
|
||||
<div class="row m-b-20">
|
||||
<div class="col text-center">
|
||||
<h3 class="all-caps">Are you Sure?</h3>
|
||||
<div class="fs-11">Are you sure you want to delete this remark?</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col p-r-5">
|
||||
<div class="btn btn-sm btn-success btn-block b-rad-none" data-dismiss="modal">Cancel</div>
|
||||
</div>
|
||||
<div class="col p-l-5">
|
||||
<div class="btn btn-sm btn-danger btn-block b-rad-none" @click="submit(route('api.remark.delete', item.id), 'delete', section, true, true)">Delete</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import componentHandler from '../../../general/mixins/componentHandler';
|
||||
import ModalFormHandler from '../../../general/mixins/modalFormHandler';
|
||||
export default {
|
||||
mixins: [componentHandler, ModalFormHandler]
|
||||
}
|
||||
</script>
|
||||
@@ -33,7 +33,7 @@
|
||||
required: true
|
||||
},
|
||||
params: {
|
||||
type: Array,
|
||||
type: Object,
|
||||
required: false
|
||||
},
|
||||
modalType: {
|
||||
@@ -57,7 +57,16 @@
|
||||
submitForm() {
|
||||
if (this.params) this.parameters = this.params;
|
||||
return this.submit(this.apiRoute, this.apiMethod, this.section, true, true);
|
||||
}
|
||||
},
|
||||
successHandler(){
|
||||
this.closeModal();
|
||||
this.formHandler();
|
||||
if (this.section && (this.section === 'paymentInProgressBillGroupList' || this.section === 'paymentVerificationBillGroupList' || this.section === 'paidBillGroupList')) {
|
||||
this.$store.dispatch('toggleSection', {name: 'paymentInProgressBillGroupList', status: !this.$store.getters.isShowing('paymentInProgressBillGroupList')});
|
||||
this.$store.dispatch('toggleSection', {name: 'paymentVerificationBillGroupList', status: !this.$store.getters.isShowing('paymentVerificationBillGroupList')});
|
||||
this.$store.dispatch('toggleSection', {name: 'paidBillGroupList', status: !this.$store.getters.isShowing('paidBillGroupList')});
|
||||
}
|
||||
},
|
||||
},
|
||||
mixins: [componentHandler, ModalFormHandler]
|
||||
|
||||
|
||||
@@ -0,0 +1,54 @@
|
||||
<template>
|
||||
<div class="row m-t-5" @keyup.enter="submitForm">
|
||||
<div class="col">
|
||||
<validation-wrapper-component :validator="$v.parameters.content">
|
||||
<input type="text" class="form-control fs-12" placeholder="Write your comments..." v-model.trim="parameters.content">
|
||||
</validation-wrapper-component>
|
||||
</div>
|
||||
<div class="col-auto b-a b-grey d-flex justify-content-center align-items-center rounded pointer">
|
||||
<i class="fa fa-paper-plane" @click="submitForm"></i>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import modalFormHandler from '../../../general/mixins/modalFormHandler';
|
||||
import { required } from "vuelidate/lib/validators";
|
||||
|
||||
export default {
|
||||
props: {
|
||||
id: {
|
||||
type: Number,
|
||||
required: true
|
||||
},
|
||||
module_type: {
|
||||
type: String,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
parameters: {
|
||||
// content: this.data.remarks.length > 0 ? this.data.remarks[0].content : '',
|
||||
content: '',
|
||||
model_type: this.module_type
|
||||
}
|
||||
};
|
||||
},
|
||||
validations: {
|
||||
parameters: {
|
||||
content: { required },
|
||||
}
|
||||
},
|
||||
created() {
|
||||
if (this.data) {
|
||||
this.parameters.content = this.data.content;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
submitForm() {
|
||||
this.submit(this.data ? this.route('api.remark.update', this.data.id) : this.route('api.remark.create', this.id), this.data ? 'put' : 'post', this.section, true, true);
|
||||
},
|
||||
},
|
||||
mixins: [modalFormHandler]
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,73 @@
|
||||
<template>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<loading-component style="height: 50px; top: 0;" key="1" color="success" v-show="$store.getters.isLoading(section)"></loading-component>
|
||||
<div class="row" v-show="!$store.getters.isLoading(section)">
|
||||
<div class="col">
|
||||
<div class="row m-b-20">
|
||||
<div class="col">
|
||||
<h6 class="all-caps m-b-5 bold no-margin">{{ data.remarks.length > 0 ? 'Edit' : 'Create' }} Remark</h6>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row m-b-5 animate__animated animate__fadeInUpBig animate__fast" v-if="error">
|
||||
<div class="col">
|
||||
<small class="bold fs-10 text-danger">{{error}}</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row m-b-10">
|
||||
<div class="col">
|
||||
<validation-wrapper-component :validator="$v.parameters.content">
|
||||
<label>Remark</label>
|
||||
<input type="text" class="form-control" v-model="parameters.content">
|
||||
</validation-wrapper-component>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col p-r-5">
|
||||
<div class="btn btn-sm btn-default bg-master-lightest btn-block b-rad-none" data-dismiss="modal">Cancel</div>
|
||||
</div>
|
||||
<div class="col p-l-5">
|
||||
<div class="btn btn-sm btn-primary btn-block b-rad-none" @click="submitForm()">{{ data.remarks.length > 0 ? 'Edit' : 'Create' }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { required } from "vuelidate/lib/validators";
|
||||
import ModalFormHandler from '../../../general/mixins/modalFormHandler';
|
||||
export default {
|
||||
props: {
|
||||
data:{
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
module_type: {
|
||||
type: String,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
parameters: {
|
||||
content: this.data.remarks.length > 0 ? this.data.remarks[0].content : '',
|
||||
model_type: this.module_type
|
||||
}
|
||||
}
|
||||
},
|
||||
validations: {
|
||||
parameters: {
|
||||
content: { required: required },
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
submitForm() {
|
||||
this.submit(this.data.remarks.length > 0 ? this.route('api.remark.update', this.data.remarks[0].id) : this.route('api.remark.create', this.data.id), this.data.remarks.length > 0 ? 'put' : 'post', this.section, true, true);
|
||||
}
|
||||
},
|
||||
mixins: [ModalFormHandler]
|
||||
|
||||
}
|
||||
</script>
|
||||
@@ -1,10 +1,10 @@
|
||||
<template>
|
||||
<div v-if="validator.$error" class="text-danger fs-10">
|
||||
<small class="bold" v-for="(object, param) in validator.$params">
|
||||
<span class="btn-block" v-if="object.type === 'required'">{{errorMessages[param]}}</span>
|
||||
<span class="btn-block" v-if="object.type === 'minLength'">{{errorMessages[param]}} {{object.min}} characters</span>
|
||||
<span class="btn-block" v-if="object.type === 'sameAs'">{{errorMessages[param]}} {{object.eq}} field</span>
|
||||
<span class="btn-block" v-if="object.type === 'maxValue'">{{errorMessages[param]}} {{object.max}}</span>
|
||||
<span class="btn-block" v-if="object && object.type === 'required'">{{errorMessages[param]}}</span>
|
||||
<span class="btn-block" v-if="object && object.type === 'minLength'">{{errorMessages[param]}} {{object.min}} characters</span>
|
||||
<span class="btn-block" v-if="object && object.type === 'sameAs'">{{errorMessages[param]}} {{object.eq}} field</span>
|
||||
<span class="btn-block" v-if="object && object.type === 'maxValue'">{{errorMessages[param]}} {{object.max}}</span>
|
||||
</small>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
+52
@@ -0,0 +1,52 @@
|
||||
<template>
|
||||
<div id="accordion">
|
||||
<div>
|
||||
<div class="row bg-white padding-10 m-b-10 rounded pointer" data-toggle="collapse" :data-target="'#collapse-' + data.campaign_id" aria-expanded="true" :aria-controls="'collapse-' + data.campaign_id">
|
||||
<div class="col-2 fs-12":id="'heading-' + data.campaign_id">{{data.name}}</div>
|
||||
<div class="col-1 text-success text-center">{{data.metadata && data.metadata.length > 0 ? data.metadata[0].value : 0 }}</div>
|
||||
<div class="col-1 text-success text-center">{{data.metadata && data.metadata.length > 0 ? extractMonth(data.metadata[0].key) : '' }}</div>
|
||||
<div class="col-1 text-center">{{data.limit_per_month}}</div>
|
||||
<div class="col-3 fs-12">{{data.campaign_id}}</div>
|
||||
</div>
|
||||
<div class="row bg-light collapse" :id="'collapse-' + data.campaign_id" :aria-labelledby="'heading-' + data.campaign_id" data-parent="#accordion">
|
||||
<div class="col-12">
|
||||
<p>Past months vouchers issued</p>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<ul class="list-unstyled">
|
||||
<li v-for="(item, index) in data.metadata" :key="index">
|
||||
<a class="dropdown-item" href="#">{{ extractMonth(item.key) }} - {{ item.value }}</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import componentHandler from '../../../general/mixins/componentHandler';
|
||||
export default {
|
||||
props: {
|
||||
data: {
|
||||
required: true,
|
||||
type: Object
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
extractMonth(inputString) {
|
||||
const firstUnderscoreIndex = inputString.indexOf('_');
|
||||
if (firstUnderscoreIndex === -1) return '';
|
||||
|
||||
const secondUnderscoreIndex = inputString.indexOf('_', firstUnderscoreIndex + 1);
|
||||
if (secondUnderscoreIndex === -1) return '';
|
||||
|
||||
const thirdUnderscoreIndex = inputString.indexOf('_', secondUnderscoreIndex + 1);
|
||||
if (thirdUnderscoreIndex === -1) return '';
|
||||
|
||||
return inputString.substring(secondUnderscoreIndex + 1, thirdUnderscoreIndex);
|
||||
}
|
||||
},
|
||||
mixins: [componentHandler],
|
||||
}
|
||||
</script>
|
||||
+43
@@ -0,0 +1,43 @@
|
||||
<template>
|
||||
<div class="row" v-if="$store.getters.isAdmin">
|
||||
<div class="col">
|
||||
<div class="row m-b-10">
|
||||
<div class="col">
|
||||
<div class="font-heading fs-16 all-caps bold m-b-15">Voucher Campaigns ALL CUSTOMERS</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="row padding-10">
|
||||
<div class="col-2 fs-10">Name</div>
|
||||
<div class="col-1 fs-10 text-center">Issued</div>
|
||||
<div class="col-1 fs-10 text-center">Month</div>
|
||||
<div class="col-1 fs-10 text-center">Limit Per Month</div>
|
||||
<div class="col-3 fs-10">Campaign Id</div>
|
||||
</div>
|
||||
|
||||
<list-component section="voucherCampaignsSection" :endpoint="route('api.voucher.campaigns.list')" :options="options">
|
||||
<template slot="list" slot-scope="{data}">
|
||||
<single-voucher-campaign-item-component :data="data"></single-voucher-campaign-item-component>
|
||||
</template>
|
||||
</list-component>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
options: {
|
||||
include_metadata: true,
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
},
|
||||
}
|
||||
</script>
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="row parentContainer" v-if="item.status === 2">
|
||||
<div class="row parentContainer" v-if="item && item.status === 2">
|
||||
<div class="col">
|
||||
<div class="row m-b-20 parentContainer" v-if="data.id === 9">
|
||||
<div class="col-auto">
|
||||
|
||||
@@ -0,0 +1,49 @@
|
||||
export default {
|
||||
methods: {
|
||||
poll(url, method, section, successNotification = true, errorNotification = true){
|
||||
if(!this.validate()){ return; }
|
||||
if (section) {
|
||||
this.$store.dispatch('toggleLoading', {name: section, status: true})
|
||||
}
|
||||
this.$store.dispatch('crudRequestV2', {
|
||||
endpoint: url,
|
||||
method: method,
|
||||
parameters: this.parameters
|
||||
}).then(response => {
|
||||
let statusCode = response.status,
|
||||
success = response.ok;
|
||||
|
||||
response.json().then(response => {
|
||||
|
||||
if(!success){
|
||||
this.openModal();
|
||||
errorNotification ? this.$store.dispatch('createNotification', {title: response.title, message: response.message, type: 'error'}): null;
|
||||
this.errorHandler(response, statusCode); return;
|
||||
}
|
||||
|
||||
successNotification ? this.$store.dispatch('createNotification', {title: response.title, message: response.message, type: 'success'}): null;
|
||||
this.successHandler(response)
|
||||
|
||||
|
||||
});
|
||||
}).catch((error) => {
|
||||
this.$store.dispatch('createNotification', {title: 'Unexpected Error', message: 'An unexpected error has occurred. Try again!', type: 'error'});
|
||||
}).then(() => {
|
||||
if (section) {
|
||||
this.$store.dispatch('toggleLoading', {name: section, status: false})
|
||||
}
|
||||
})
|
||||
|
||||
},
|
||||
validate() {
|
||||
if(this.$v){
|
||||
this.$v.$touch();
|
||||
return !this.$v.$invalid;
|
||||
}
|
||||
return true;
|
||||
},
|
||||
successHandler(response){},
|
||||
errorHandler(response){}
|
||||
}
|
||||
|
||||
}
|
||||
@@ -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);
|
||||
},
|
||||
},
|
||||
}
|
||||
@@ -0,0 +1,51 @@
|
||||
export default {
|
||||
actions: {
|
||||
crudRequestV2({getters, dispatch}, {endpoint, method, parameters}){
|
||||
return dispatch('ensureReCaptchaIsSet').then(function () {
|
||||
const queryDomain = endpoint.split('?')[0];
|
||||
let encodedParams = endpoint.split('?')[1];
|
||||
let decodedParams = fullyDecodeURI(encodedParams);
|
||||
const queryParams = encodeURIComponent(decodedParams);
|
||||
encodedParams = queryParams.toString();
|
||||
let filteredEncodedParams = encodedParams.replace(/%3D/g,'=');
|
||||
filteredEncodedParams = filteredEncodedParams.replace(/%26/g,'&');
|
||||
let combinedAbsoluteUrl = queryDomain;
|
||||
if(filteredEncodedParams !== undefined && filteredEncodedParams !== 'undefined'){
|
||||
combinedAbsoluteUrl = queryDomain + '?' + filteredEncodedParams;
|
||||
}
|
||||
|
||||
// return fetch(endpoint, {
|
||||
return fetch(combinedAbsoluteUrl, {
|
||||
method: method,
|
||||
responseType: 'json',
|
||||
body: parameters ? JSON.stringify(parameters):null,
|
||||
headers: {
|
||||
'content-type': 'application/json',
|
||||
'Authorization': 'Bearer '+getters.getAccessToken,
|
||||
'captcha-token': getters.getReCaptcha
|
||||
}
|
||||
}).then(response => {
|
||||
|
||||
if(response.status === 401 && window.location.href !== route('login')){
|
||||
dispatch('userAuthentication', {access_token: '', redirect_url: '/'});
|
||||
}
|
||||
|
||||
return response;
|
||||
|
||||
})
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function isEncoded(uri) {
|
||||
uri = uri || '';
|
||||
return uri !== decodeURIComponent(uri);
|
||||
}
|
||||
|
||||
function fullyDecodeURI(uri){
|
||||
while (isEncoded(uri)){
|
||||
uri = decodeURIComponent(uri);
|
||||
}
|
||||
return uri;
|
||||
}
|
||||
+134
@@ -0,0 +1,134 @@
|
||||
|
||||
const state = {
|
||||
pollingJobResults: []
|
||||
};
|
||||
|
||||
export default {
|
||||
state,
|
||||
getters: {
|
||||
getJob: (state) => (name) => {
|
||||
return state.pollingJobResults.find(item => item.name === name);;
|
||||
},
|
||||
getJobAttemptCount: (state) => (name) => {
|
||||
let job = state.pollingJobResults.find(item => item.name === name);
|
||||
return job ? job.pollingAttemptsCount : 0;
|
||||
},
|
||||
},
|
||||
mutations: {
|
||||
ADD_POLLING_JOB_RESULT(state, {jobId, name, pollingAttemptsCount, isPolling, isFetchingResult, maxAttempts, pollJobResult, interval}) {
|
||||
let intervalId = setInterval(() => {
|
||||
if (pollJobResult) {
|
||||
pollJobResult(state);
|
||||
}
|
||||
}, interval);
|
||||
state.pollingJobResults.push({ jobId, name, pollingAttemptsCount, isPolling, isFetchingResult, maxAttempts, intervalId});
|
||||
},
|
||||
UPDATE_POLLING_JOB_RESULT(state, { jobId, pollingAttemptsCount, isPolling, isFetchingResult, isLastAttempt}) {
|
||||
const index = state.pollingJobResults.findIndex(s => s.jobId === jobId);
|
||||
if (index !== -1) {
|
||||
const updatedPollingJobResults = [...state.pollingJobResults];
|
||||
updatedPollingJobResults[index] = { ...updatedPollingJobResults[index],
|
||||
jobId,
|
||||
pollingAttemptsCount: pollingAttemptsCount !== undefined ? pollingAttemptsCount : updatedPollingJobResults[index].pollingAttemptsCount,
|
||||
isPolling: isPolling !== undefined ? isPolling : updatedPollingJobResults[index].isPolling,
|
||||
isFetchingResult: isFetchingResult !== undefined ? isFetchingResult : updatedPollingJobResults[index].isFetchingResult,
|
||||
isLastAttempt: isLastAttempt !== undefined ? isLastAttempt : updatedPollingJobResults[index].isLastAttempt,
|
||||
};
|
||||
state.pollingJobResults = updatedPollingJobResults;
|
||||
}
|
||||
},
|
||||
REMOVE_POLLING_JOB_RESULT_BY_JOBID(state, jobId) {
|
||||
const index = state.pollingJobResults.findIndex(s => s.jobId === jobId);
|
||||
if (index !== -1) {
|
||||
clearInterval(state.pollingJobResults[index].intervalId);
|
||||
state.pollingJobResults.splice(index, 1);
|
||||
}
|
||||
},
|
||||
// REMOVE_POLLING_JOB_RESULT_BY_JOBID_2(state, jobId) {
|
||||
// const index = state.pollingJobResults.findIndex(s => s.jobId === jobId);
|
||||
// if (index !== -1) {
|
||||
// clearInterval(state.pollingJobResults[index].intervalId);
|
||||
// //state.pollingJobResults.splice(index, 1);
|
||||
// }
|
||||
// },
|
||||
REMOVE_POLLING_JOB_RESULT_BY_NAME(state, name) {
|
||||
const index = state.pollingJobResults.findIndex(s => s.name === name);
|
||||
if (index !== -1) {
|
||||
clearInterval(state.pollingJobResults[index].intervalId);
|
||||
state.pollingJobResults.splice(index, 1);
|
||||
}
|
||||
},
|
||||
},
|
||||
actions: {
|
||||
submitJobRequest({ dispatch }, { url, name }){
|
||||
dispatch('crudRequestV2', {
|
||||
endpoint: url,
|
||||
method: 'get',
|
||||
|
||||
}).then(response => {
|
||||
let success = response.ok;
|
||||
response.json().then(response => {
|
||||
if(!success){return;}
|
||||
let jobId = response.payload.data.job_id;
|
||||
if(jobId){
|
||||
let pollingAttemptsCount = 0;
|
||||
dispatch('startPolling', { jobId, name, pollingAttemptsCount });
|
||||
}
|
||||
});
|
||||
})
|
||||
},
|
||||
|
||||
stopPollingJobResultByJobId({ commit }, { jobId }){
|
||||
commit('REMOVE_POLLING_JOB_RESULT_BY_JOBID', jobId);
|
||||
},
|
||||
|
||||
stopPollingJobResultByName({ commit }, { name }){
|
||||
commit('REMOVE_POLLING_JOB_RESULT_BY_NAME', name);
|
||||
},
|
||||
|
||||
startPolling({ state, commit, dispatch }, { jobId, name, pollingAttemptsCount, maxAttempts = 8}) {
|
||||
let interval = 10000;
|
||||
|
||||
// console.log(`startPolling jobId: ${jobId}, pollingAttemptsCount: ${pollingAttemptsCount}, name: ${name}`);
|
||||
|
||||
const pollJobResult = (state) => {
|
||||
//console.log(`MONITOR state ${JSON.stringify(state)}`);
|
||||
const index = state.pollingJobResults.findIndex(s => s.jobId === jobId);
|
||||
if (index !== -1) {
|
||||
pollingAttemptsCount = state.pollingJobResults[index].pollingAttemptsCount;
|
||||
if (state.pollingJobResults[index].isPolling || state.pollingJobResults[index].isFetchingResult) {
|
||||
return;
|
||||
}
|
||||
}
|
||||
else{
|
||||
return;
|
||||
}
|
||||
|
||||
pollingAttemptsCount++;
|
||||
if(pollingAttemptsCount === 1){
|
||||
commit("REMOVE_POLLING_JOB_RESULT_BY_JOBID", jobId );
|
||||
commit("ADD_POLLING_JOB_RESULT", { jobId, name, pollingAttemptsCount, isPolling: false, isFetchingResult: false, maxAttempts, pollJobResult, interval: 5000});
|
||||
}
|
||||
|
||||
if (pollingAttemptsCount > maxAttempts) {
|
||||
//console.log(`Reached maximum attempts (${maxAttempts}). Polling stopped.`);
|
||||
commit("REMOVE_POLLING_JOB_RESULT_BY_JOBID", jobId );
|
||||
return;
|
||||
}
|
||||
|
||||
if(pollingAttemptsCount === maxAttempts){
|
||||
commit('UPDATE_POLLING_JOB_RESULT', { jobId, pollingAttemptsCount, isPolling: true, isFetchingResult: false, isLastAttempt: true });
|
||||
}
|
||||
else{
|
||||
commit('UPDATE_POLLING_JOB_RESULT', { jobId, pollingAttemptsCount, isPolling: true, isFetchingResult: false, isLastAttempt: false});
|
||||
}
|
||||
}
|
||||
commit("ADD_POLLING_JOB_RESULT", { jobId, name, pollingAttemptsCount, isPolling: false, isFetchingResult: false, maxAttempts, pollJobResult, interval});
|
||||
|
||||
},
|
||||
|
||||
updatePollingJobResultByJobId({ commit }, { jobId, isPolling, isFetchingResult }){
|
||||
commit('UPDATE_POLLING_JOB_RESULT', { jobId, isPolling, isFetchingResult });
|
||||
}
|
||||
}
|
||||
}
|
||||
Vendored
+6
-2
@@ -4,8 +4,10 @@ import toggleSection from './modules/toggleSection'
|
||||
import toggleLoading from './modules/toggleLoading'
|
||||
import createNotification from './modules/createNotification'
|
||||
import crudRequest from './modules/crudRequest'
|
||||
import crudRequestV2 from './modules/crudRequestV2'
|
||||
import authentication from './modules/authentication'
|
||||
import loadRequestQueue from './modules/loadRequestQueue'
|
||||
import jobPolling from './modules/jobPolling'
|
||||
|
||||
Vue.use(Vuex);
|
||||
|
||||
@@ -16,6 +18,8 @@ export default new Vuex.Store({
|
||||
loadRequestQueue,
|
||||
createNotification,
|
||||
crudRequest,
|
||||
authentication
|
||||
crudRequestV2,
|
||||
authentication,
|
||||
jobPolling
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
@@ -0,0 +1,13 @@
|
||||
@extends('emails.layout.base')
|
||||
|
||||
@section('content')
|
||||
<img style="width: 100%;" src="https://assets.izyim.com/public/images/emails/welcome50%25off2025.png"/>
|
||||
<p style="font-size: 0.9em">Hello from CIEF! Thanks for signing up with us. Thinking about using our RMB payment transfer services? Use code 【{{$voucher->code}}】 and get a 50% discount on your first order. Why not give it a try?</p>
|
||||
<p style="font-size: 0.9em">Any questions? I'm here to help. Start here: <a href="{{env('APP_URL').'/dashboard'}}">{{env('APP_URL').'/dashboard'}}</a></p>
|
||||
<p style="font-size: 0.9em">叮咚！非常感谢您在我们代付网站注册， 您是否对我们的代付服务感兴趣却还在犹豫或者在因为其他因素还没正式使用呢？ 如果是首次下单， 不妨使用我们专门为新用户准备的独家优惠， 只需在首次下单时使用代码【{{$voucher->code}}】，就能享有5折的手续费折扣呢！ 尝试了一次， 或许你会喜欢我们公司的服务，点击以下网址开始启用吧！</p>
|
||||
<p style="font-size: 0.9em"><a href="{{env('APP_URL').'/dashboard'}}">{{env('APP_URL').'/dashboard'}}</a></p>
|
||||
<p style="font-size: 0.9em">如果您有任何疑问或需要更多信息，随时联系我。我们期待着能为您提供物流以及代付服务！</span></p>
|
||||
|
||||
<p style="font-size: 0.9em">Thanks</span></p>
|
||||
<p style="font-size: 0.9em">谢谢！</span></p>
|
||||
@endsection
|
||||
@@ -21,6 +21,10 @@
|
||||
.container {
|
||||
width: 600px;
|
||||
}
|
||||
.container .header-title {
|
||||
width: 600px;
|
||||
padding: 30px 0px;
|
||||
}
|
||||
.sm-hide {
|
||||
display: block;
|
||||
}
|
||||
@@ -31,12 +35,16 @@
|
||||
.container {
|
||||
width: 100%;
|
||||
}
|
||||
.container .header-title {
|
||||
width: 100%;
|
||||
padding: 30px 0px;
|
||||
}
|
||||
.sm-hide {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
.content {
|
||||
width: 100%;
|
||||
/* width: 100%; */
|
||||
padding: 30px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
@@ -132,4 +140,4 @@
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<div class="bg-primary content">
|
||||
<div class="bg-primary header-title">
|
||||
<h2 class="no-margin font-lato lightest text-white all-caps" style="font-size: 3em; letter-spacing: 15px; line-height: 40px" >Exchange</h2>
|
||||
<div style="height: 15px;"></div>
|
||||
<small class="no-margin font-lato light text-white all-caps" style="letter-spacing: 5px;">Currency Exchange Vendor</small>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
File diff suppressed because one or more lines are too long
@@ -0,0 +1,9 @@
|
||||
@extends('layouts.base_portal')
|
||||
@section('inner_content')
|
||||
<div class="row" v-if="$store.getters.isAdmin">
|
||||
<div class="col p-t-15 p-b-15">
|
||||
<billing-component></billing-component>
|
||||
<admin-payments-billing-section-polling-component></admin-payments-billing-section-polling-component>
|
||||
</div>
|
||||
</div>
|
||||
@endsection
|
||||
@@ -3,11 +3,9 @@
|
||||
<div class="row">
|
||||
<div class="col-12 col-md-8 bg-white p-l-25 p-r-25 p-t-15 p-b-15">
|
||||
<loading-component style="height: 200px; top: 0;" key="1" color="success" v-show="$store.getters.isLoading('rewardProfileSection')"></loading-component>
|
||||
<div class="row p-b-5 m-b-20 b-b b-grey align-items-center parentContainer">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="font-heading all-caps fs-10 hint-text">
|
||||
Vouchers
|
||||
</div>
|
||||
<voucher-campaigns-section-component></voucher-campaigns-section-component>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
@@ -22,6 +20,11 @@
|
||||
<add-voucher-section-component id="{{$id}}" section="addVoucherSection"></add-voucher-section-component>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<add-voucher-options-section-component id="{{$id}}" section="addSorryVoucherSection" :options="{{ json_encode(\App\Classes\ValueObjects\Constants\Vouchers::OPTIONS_SORRY) }}" ></add-voucher-options-section-component>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@endsection
|
||||
|
||||
@@ -27,7 +27,7 @@
|
||||
</div>
|
||||
<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="refunds">
|
||||
<div class="col p-t-20 p-b-20 bg-master-lighter tabButton" tab-name="pre-refunds">
|
||||
<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"
|
||||
@@ -38,7 +38,26 @@
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="fs-12 m-t-5 all-caps">Refunds</div>
|
||||
<div class="fs-12 m-t-5 all-caps">Pre-Refunds</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<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="post-refunds">
|
||||
<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"
|
||||
width="35" height="35"
|
||||
viewBox="0 0 172 172"
|
||||
style=" fill:#000000;"><defs><linearGradient x1="86" y1="45.01563" x2="86" y2="152.92681" gradientUnits="userSpaceOnUse" id="color-1_48314_gr1"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="86" y1="45.01563" x2="86" y2="152.92681" gradientUnits="userSpaceOnUse" id="color-2_48314_gr2"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient><linearGradient x1="86" y1="16.79688" x2="86" y2="92.05225" gradientUnits="userSpaceOnUse" id="color-3_48314_gr3"><stop offset="0" stop-color="#4ec9ff"></stop><stop offset="1" stop-color="#2bffe6"></stop></linearGradient><linearGradient x1="86" y1="45.01563" x2="86" y2="152.92681" gradientUnits="userSpaceOnUse" id="color-4_48314_gr4"><stop offset="0" stop-color="#009add"></stop><stop offset="1" stop-color="#00baa4"></stop></linearGradient></defs><g fill="none" fill-rule="nonzero" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-weight="none" font-size="none" text-anchor="none" style="mix-blend-mode: normal"><path d="M0,172v-172h172v172z" fill="none"></path><g><path d="M147.8125,48.375h-32.25v5.375h32.25c1.50769,0 2.6875,1.12875 2.6875,2.56925v75.25c0,1.51844 -1.23087,2.80575 -2.6875,2.80575h-123.625c-1.45662,0 -2.6875,-1.28731 -2.6875,-2.80575v-75.25c0,-1.4405 1.17981,-2.56925 2.6875,-2.56925h32.25v-5.375h-32.25c-4.52038,0 -8.0625,3.49106 -8.0625,7.94425v75.25c0,3.55019 2.25481,6.54944 5.375,7.67819v3.07181c0,4.51231 3.61737,8.18075 8.0625,8.18075h112.875c4.44512,0 8.0625,-3.66844 8.0625,-8.18075v-3.07181c3.12019,-1.12875 5.375,-4.128 5.375,-7.67819v-75.25c0,-4.45319 -3.54212,-7.94425 -8.0625,-7.94425zM142.4375,145.125h-112.875c-1.45662,0 -2.6875,-1.28731 -2.6875,-2.80575v-2.56925h118.25v2.56925c0,1.51844 -1.23087,2.80575 -2.6875,2.80575z" fill="url(#color-1_48314_gr1)"></path><path d="M126.3125,129h-83.3125v-2.6875c0,-7.51425 -6.02806,-13.4375 -13.4375,-13.4375h-2.6875v-37.625h2.6875c6.3425,0 13.4375,-5.79156 13.4375,-13.46706v-2.70363l13.4375,0.04569v5.375l-8.2775,-0.01613c-1.26044,7.95231 -7.94425,14.61731 -15.91,15.86969v27.219c8.25869,1.18788 14.80006,7.76956 15.94762,16.05244h75.6155c1.17444,-8.30438 7.70238,-14.85112 15.93688,-16.03631v-27.262c-7.96844,-1.247 -14.65494,-7.89587 -15.91269,-15.82669h-8.27481v-5.375h13.4375v2.6875c0,6.30219 5.74587,13.4375 13.4375,13.4375h2.6875v37.50675l-2.6875,0.01613c-7.40944,0 -13.4375,6.03344 -13.4375,13.45094v2.6875z" fill="url(#color-2_48314_gr2)"></path><path d="M104.8125,53.75h-8.0625c-1.4835,0 -2.6875,1.14487 -2.6875,2.63106v29.61356c0,1.48619 -1.204,2.69288 -2.6875,2.69288h-10.75c-1.4835,0 -2.6875,-1.20669 -2.6875,-2.69288v-29.61356c0,-1.48619 -1.204,-2.63106 -2.6875,-2.63106h-8.0625c-2.2145,0 -3.47763,-2.881 -2.15,-4.87781l16.65175,-25.04481c2.05056,-3.08256 6.57094,-3.08794 8.6215,-0.00806l16.65175,25.05556c1.32762,1.99681 0.0645,4.87512 -2.15,4.87512z" fill="url(#color-3_48314_gr3)"></path><path d="M86,112.875c-10.37375,0 -18.8125,-8.0625 -18.8125,-18.8125h5.375c0,8.0625 6.02806,13.4375 13.4375,13.4375c7.40944,0 13.4375,-5.375 13.4375,-13.4375h5.375c0,10.75 -8.43875,18.8125 -18.8125,18.8125z" fill="url(#color-4_48314_gr4)"></path></g></g></svg>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="fs-12 m-t-5 all-caps">Post-Refunds</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -79,13 +98,84 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row tabsContainer hide tabContent" tab-name="refunds">
|
||||
<div class="row tabsContainer hide tabContent" tab-name="pre-refunds">
|
||||
<div class="col">
|
||||
<div class="row m-b-15 p-b-10 b-b b-grey">
|
||||
<div class="col">
|
||||
<small class="all-caps muted fs-10">Fully Refund</small>
|
||||
</div>
|
||||
<div class="col text-right">
|
||||
<a :href="route('orders.refunds') + '?type=pre-full'" target="_blank">
|
||||
<button class="btn btn-success btn-xs">Export Refunded Transactions</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<list-component key="2" section="listRefundTransactionSection" :endpoint="route('api.transaction.list')" :options="{'type': 6, status: 1}">
|
||||
<list-component key="2" section="listPreFullRefundTransactionSection" :endpoint="route('api.transaction.list')" :options="{'type': 6, status: 1, owner_does_not_have_transaction_type: 3, is_partial_refund: false}">
|
||||
<template slot="list" slot-scope="{data}">
|
||||
<refund-verification-component section="listRefundTransactionSection" :data="data"></refund-verification-component>
|
||||
<refund-verification-component section="listPreFullRefundTransactionSection" :data="data"></refund-verification-component>
|
||||
</template>
|
||||
</list-component>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row m-b-15 p-b-10 b-b b-grey">
|
||||
<div class="col">
|
||||
<small class="all-caps muted fs-10">Partial Refund</small>
|
||||
</div>
|
||||
<div class="col text-right">
|
||||
<a :href="route('orders.refunds') + '?type=pre-partial'" target="_blank">
|
||||
<button class="btn btn-success btn-xs">Export Refunded Transactions</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<list-component key="3" section="listPrePartialRefundTransactionSection" :endpoint="route('api.transaction.list')" :options="{'type': 6, status: 1, owner_does_not_have_transaction_type: 3, is_partial_refund: true}">
|
||||
<template slot="list" slot-scope="{data}">
|
||||
<refund-verification-component section="listPrePartialRefundTransactionSection" :data="data"></refund-verification-component>
|
||||
</template>
|
||||
</list-component>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row tabsContainer hide tabContent" tab-name="post-refunds">
|
||||
<div class="col">
|
||||
<div class="row m-b-15 p-b-10 b-b b-grey">
|
||||
<div class="col">
|
||||
<small class="all-caps muted fs-10">Fully Refund</small>
|
||||
</div>
|
||||
<div class="col text-right">
|
||||
<a :href="route('orders.refunds') + '?type=post-full'" target="_blank">
|
||||
<button class="btn btn-success btn-xs">Export Refunded Transactions</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<list-component key="4" section="listPostFullRefundTransactionSection" :endpoint="route('api.transaction.list')" :options="{'type': 6, status: 1, owner_has_transaction_type: 3, is_partial_refund: false}">
|
||||
<template slot="list" slot-scope="{data}">
|
||||
<refund-verification-component section="listPostFullRefundTransactionSection" :data="data"></refund-verification-component>
|
||||
</template>
|
||||
</list-component>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row m-b-15 p-b-10 b-b b-grey">
|
||||
<div class="col">
|
||||
<small class="all-caps muted fs-10">Partial Refund</small>
|
||||
</div>
|
||||
<div class="col text-right">
|
||||
<a :href="route('orders.refunds') + '?type=post-partial'" target="_blank">
|
||||
<button class="btn btn-success btn-xs">Export Refunded Transactions</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<list-component key="5" section="listPostPartialRefundTransactionSection" :endpoint="route('api.transaction.list')" :options="{'type': 6, status: 1, owner_has_transaction_type: 3, is_partial_refund: true}">
|
||||
<template slot="list" slot-scope="{data}">
|
||||
<refund-verification-component section="listPostPartialRefundTransactionSection" :data="data"></refund-verification-component>
|
||||
</template>
|
||||
</list-component>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,11 @@
|
||||
<br>
|
||||
<htmlpageheader name="page-header">
|
||||
<br><br>
|
||||
<div class="separator"><strong><i>{{ $transaction->bill_no }}</i></strong></div>
|
||||
@php
|
||||
$credit_title = \Carbon\Carbon::parse($transaction->created_at)->greaterThanOrEqualTo('2024-04-02') ? 'Refund' : 'Credit';
|
||||
$bill_no = $credit_title === 'Refund' ? str_replace('CREDIT', 'REFUND', $transaction->bill_no) : $transaction->bill_no;
|
||||
@endphp
|
||||
<div class="separator"><strong><i>{{ $bill_no }}</i></strong></div>
|
||||
</htmlpageheader>
|
||||
<table>
|
||||
<tr>
|
||||
@@ -25,7 +29,7 @@
|
||||
<td class="header-details">
|
||||
<div class="title">
|
||||
<strong>
|
||||
{{ $transaction->type == 9 ? 'Credit' : 'Debit' }} Note
|
||||
{{ $transaction->type == 9 ? $credit_title : 'Debit' }} Note
|
||||
</strong>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -36,13 +36,34 @@
|
||||
<td>Bank in Details</td>
|
||||
</tr>
|
||||
@foreach($transactions as $transaction)
|
||||
@php
|
||||
$attributes = $transaction->owner->owner->modelAttributes()->where('name', 'ORDER_REFERENCE_NO')->pluck('value')->toArray();
|
||||
$order_reference_no = implode(', ', $attributes);
|
||||
@endphp
|
||||
<tr style="margin-bottom: 10px;">
|
||||
<td>{{$transaction->owner->owner->marking}}</td>
|
||||
<td>{{$transaction->owner->owner->company->reference}}</td>
|
||||
<td>{{$transaction->currency_rate}}</td>
|
||||
<td>{{$transaction->currency->short_code}} {{number_format((float)$transaction->amount, 2, '.', '')}}</td>
|
||||
<td>Account Holder Name: {{$transaction->owner->owner->bank->holder_name}}<br>{{$transaction->owner->owner->bank->bank_name}}: {{$transaction->owner->owner->bank->account_no}}
|
||||
<br>Branch: {{$transaction->owner->owner->bank->bank_branch}}@if($transaction->original_currency->short_code === 'USD')<br>Swift Code: {{$transaction->owner->owner->bank->swift}}@endif<br>Bank in Amount: {{$transaction->original_currency->short_code}} {{$transaction->original_amount}}</td>
|
||||
<td>
|
||||
@php
|
||||
$bank = $transaction->owner->owner->bank;
|
||||
if($transaction->owner->bank){
|
||||
$bank = $transaction->owner->bank;
|
||||
}
|
||||
@endphp
|
||||
Account Holder Name: {{$bank->holder_name}}
|
||||
<br>{{$bank->bank_name}}: {{$bank->account_no}}
|
||||
<br>Branch: {{$bank->bank_branch}}
|
||||
@if($transaction->original_currency->short_code === 'USD')
|
||||
<br>Account Holder Address: {{$bank->reference}}
|
||||
<br>Swift Code: {{$bank->swift}}
|
||||
@endif
|
||||
<br>Bank in Amount: {{$transaction->original_currency->short_code}} {{$transaction->original_amount}}
|
||||
@if ($order_reference_no)
|
||||
<br>Order Reference No: {{ $order_reference_no }}
|
||||
@endif
|
||||
</td>
|
||||
</tr>
|
||||
@endforeach
|
||||
</tbody>
|
||||
@@ -59,7 +80,7 @@
|
||||
<tr>
|
||||
<td width="70%" style="text-align: right;">Transfer fee: </td>
|
||||
@php
|
||||
$transfer_fee = number_format((float)$transferFeeTransactions->sum('service_charge'), 2, '.', '');
|
||||
$transfer_fee = number_format(((float)$transferFeeTransactions->sum('service_charge') + (float)($groupTransferFeeOriginalAmount ?? 0)), 2, '.', '');
|
||||
@endphp
|
||||
<td>{{$transaction->original_currency->short_code}} {{$transfer_fee}}</td>
|
||||
</tr>
|
||||
|
||||
@@ -0,0 +1,83 @@
|
||||
|
||||
<table style="margin-bottom: 25px; border: none;">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>{{$supplier->name}}</td>
|
||||
<td>{{\Carbon\Carbon::now('Asia/Singapore')->format('d-m-Y h:s')}}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<br>
|
||||
<table style="width:100%">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Reference</td>
|
||||
<td>Marking</td>
|
||||
<td>Rate</td>
|
||||
<td>Amount</td>
|
||||
<td>Bank in Details</td>
|
||||
</tr>
|
||||
@foreach($transactions as $transaction)
|
||||
<tr style="margin-bottom: 10px;">
|
||||
@php
|
||||
$bank = $transaction->owner->owner->bank;
|
||||
if($transaction->owner->bank){
|
||||
$bank = $transaction->owner->bank;
|
||||
}
|
||||
@endphp
|
||||
<td>{{$transaction->owner->owner->marking}}</td>
|
||||
<td>{{$transaction->owner->owner->company->reference}}</td>
|
||||
<td>{{$transaction->currency_rate}}</td>
|
||||
<td>{{$transaction->currency->short_code}} {{number_format((float)$transaction->amount, 2, '.', '')}}</td>
|
||||
<td>Account Holder Name: {{$bank->holder_name}}<br>{{$bank->bank_name}}: {{$bank->account_no}}
|
||||
<br>Branch: {{$bank->bank_branch}}@if($transaction->original_currency->short_code === 'USD')<br>Swift Code: {{$bank->swift}}@endif<br>Bank in Amount: {{$transaction->original_currency->short_code}} {{$transaction->original_amount}}</td>
|
||||
</tr>
|
||||
@endforeach
|
||||
</tbody>
|
||||
</table>
|
||||
<table style="margin-bottom: 25px; border: none;">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td width="70%" style="text-align: right;" colspan="4">Sub total booking amount: </td>
|
||||
@php
|
||||
$sub_total_booking_amount = number_format((float)$transactions->sum('original_amount'), 2, '.', '');
|
||||
@endphp
|
||||
<td>{{$transaction->original_currency->short_code}} {{$sub_total_booking_amount}}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td width="70%" style="text-align: right;" colspan="4">Transfer fee: </td>
|
||||
@php
|
||||
$transfer_fee = number_format((float)$transferFeeTransactions->sum('service_charge'), 2, '.', '');
|
||||
@endphp
|
||||
<td>{{$transaction->original_currency->short_code}} {{$transfer_fee}}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td width="70%" style="text-align: right;" colspan="4">Total booking amount: </td>
|
||||
@php
|
||||
$total_booking_amount = number_format((float) ($transactions->sum('original_amount') + $transfer_fee), 2, '.', '');
|
||||
@endphp
|
||||
<td>{{$transaction->original_currency->short_code}} {{$total_booking_amount}}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td width="70%" style="text-align: right;" colspan="4">Sub total amount: </td>
|
||||
@php
|
||||
$sub_total_amount = number_format((float)$transactions->sum('amount') + ($transfer_fee * 1/$transactions[0]->currency_rate), 2, '.', '');
|
||||
@endphp
|
||||
<td>MYR {{$sub_total_amount}}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td width="70%" style="text-align: right;" colspan="4">Service charge: </td>
|
||||
@php
|
||||
$service_charge = number_format((float)$transactions->sum('service_charge'), 2, '.', '');
|
||||
@endphp
|
||||
<td>MYR {{$service_charge}}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td width="70%" style="text-align: right;" colspan="4">Total amount: </td>
|
||||
@php
|
||||
$total_amount = number_format((float)$sub_total_amount + $service_charge, 2, '.', '');
|
||||
@endphp
|
||||
<td>MYR {{$total_amount}}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
@@ -69,100 +69,15 @@
|
||||
|
||||
<br>
|
||||
<br>
|
||||
<table class="line-table" style="overflow: wrap" autosize="1">
|
||||
<thead>
|
||||
<tr>
|
||||
<th width="5%">No</th>
|
||||
<th class="stock-code" width="10%">Stock Code</th>
|
||||
<th class="description">Description</th>
|
||||
<th width="10%">Quantity</th>
|
||||
<th width="15%">Unit Price (RM)</th>
|
||||
<th width="10%">Total Amount<br>(RM)</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@php
|
||||
$subtotal = 0;
|
||||
@endphp
|
||||
|
||||
@foreach ($po_order_transaction->transactionDetails as $key => $transaction_detail)
|
||||
<tr>
|
||||
<td width="5%" class="center top">{{ $key + 1 }}</td>
|
||||
<td class="stock-code top" width="10%">{{ $transaction_detail->product_code }}</td>
|
||||
<td class="description">{{ $transaction_detail->product_name }}</td>
|
||||
<td width="10%" class="center top">{{ $transaction_detail->quantity }}</td>
|
||||
<td width="15%" class="center top">
|
||||
@if($invoice_transaction->booking()->first()->fix_currency_id !== 1)
|
||||
{{ number_format( (1/$invoice_transaction->currency_rate) * $transaction_detail->price, 2) }}
|
||||
@else
|
||||
{{ number_format($transaction_detail->price, 2) }}
|
||||
@endif
|
||||
</td>
|
||||
<td width="20%" class="right top">
|
||||
@if($invoice_transaction->booking()->first()->fix_currency_id !== 1)
|
||||
<?php
|
||||
$transaction = $invoice_transaction;
|
||||
$voucher_redemption = $voucher_redemption ?? null;
|
||||
?>
|
||||
|
||||
{{ number_format((float)number_format( (1/$invoice_transaction->currency_rate) * $transaction_detail->price, 2,'.','')*$transaction_detail->quantity,2) }}
|
||||
<!-- Invoice Table -->
|
||||
@include('pages.pdfs.purchase_order_table')
|
||||
|
||||
@php
|
||||
$subtotal += number_format((float)number_format( (1/$invoice_transaction->currency_rate) * $transaction_detail->price, 2,'.','')*$transaction_detail->quantity,2,'.','');
|
||||
@endphp
|
||||
@else
|
||||
{{ number_format((float)number_format($transaction_detail->price, 2,'.','')*$transaction_detail->quantity,2) }}
|
||||
|
||||
@php
|
||||
$subtotal += number_format((float)number_format($transaction_detail->price, 2,'.','')*$transaction_detail->quantity,2,'.','');
|
||||
@endphp
|
||||
@endif
|
||||
</td>
|
||||
</tr>
|
||||
@endforeach
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr class="subtotal">
|
||||
<td colspan="4"></td>
|
||||
<td class="right middle">Subtotal</td>
|
||||
<td class="right middle">
|
||||
{{ number_format($subtotal, 2) }}
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="billingcharges">
|
||||
<td colspan="4"></td>
|
||||
<td class="right">Service Charges</td>
|
||||
<td class="right">
|
||||
{{ number_format($invoice_transaction->service_charge, 2) }}
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="billingcharges">
|
||||
<td colspan="4"></td>
|
||||
<td class="right">Adjustment</td>
|
||||
<td class="right">
|
||||
@if($invoice_transaction->booking()->first()->fix_currency_id !== 1)
|
||||
{{ number_format((float)number_format( (1/$invoice_transaction->currency_rate) * $invoice_transaction->original_amount, 2,'.','') - (float)number_format($subtotal, 2,'.',''),2) }}
|
||||
@else
|
||||
{{ number_format((float)number_format($invoice_transaction->amount, 2,'.','') - (float)number_format($subtotal, 2,'.',''),2) }}
|
||||
@endif
|
||||
</td>
|
||||
</tr>
|
||||
@if($invoice_transaction->tax > 0)
|
||||
<tr class="billingcharges">
|
||||
<td colspan="4"></td>
|
||||
<td class="right">Tax</td>
|
||||
<td class="right">{{ number_format($invoice_transaction->tax, 2) }}</td>
|
||||
</tr>
|
||||
@endif
|
||||
<tr>
|
||||
<td colspan="4"></td>
|
||||
<td class="right middle">Total</td>
|
||||
<td class="total right middle">
|
||||
@if($invoice_transaction->booking()->first()->fix_currency_id !== 1)
|
||||
{{ number_format( ((1/$invoice_transaction->currency_rate) * $invoice_transaction->original_amount) + $invoice_transaction->service_charge + $invoice_transaction->tax, 2) }}
|
||||
@else
|
||||
{{ number_format($invoice_transaction->amount + $invoice_transaction->service_charge + $invoice_transaction->tax, 2) }}
|
||||
@endif
|
||||
</td>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<htmlpagefooter name="page-footer">
|
||||
<table width="100%">
|
||||
<tr>
|
||||
|
||||
@@ -15,11 +15,12 @@
|
||||
$subtotal = "0";
|
||||
$voucherDiscount = $voucher_redemption ? bcmul((string)$voucher_redemption->value, "-1", 2) : "0";
|
||||
$displayedSubtotal = 0;
|
||||
$currency_id = $transaction->owner->fix_currency_id;
|
||||
@endphp
|
||||
|
||||
@foreach ($po_order_transaction->transactionDetails as $key => $transaction_detail)
|
||||
@php
|
||||
$exactUnitPrice = bcdiv($transaction_detail->price, $transaction->currency_rate, 7);
|
||||
$exactUnitPrice = ($currency_id) === 1 ? $transaction_detail->price : bcdiv($transaction_detail->price, $transaction->currency_rate, 7);
|
||||
$displayUnitPrice = round($exactUnitPrice, 2);
|
||||
$itemTotal = bcmul($exactUnitPrice, $transaction_detail->quantity, 5);
|
||||
$displayedItemTotal = round(bcmul($displayUnitPrice, $transaction_detail->quantity, 7), 2);
|
||||
@@ -59,7 +60,7 @@
|
||||
<tr class="voucher">
|
||||
<td colspan="4"></td>
|
||||
<td class="right middle">Voucher ({{ $voucher_redemption->voucher->code }})</td>
|
||||
<td class="right middle">-{{ number_format($voucherDiscount, 2) }}</td>
|
||||
<td class="right middle">{{ number_format($voucherDiscount, 2) }}</td>
|
||||
</tr>
|
||||
@endif
|
||||
|
||||
|
||||
@@ -0,0 +1,85 @@
|
||||
@extends('layouts.base_pdf')
|
||||
<htmlpageheader name="page-header">
|
||||
<br>
|
||||
<table width="100%" style="border-bottom: 1px solid black;">
|
||||
<tr>
|
||||
<td style="text-align: center; color: red; text-transform: uppercase; font-weight: bold; font-size: 18px; padding-bottom: 5px;">
|
||||
{{ $supplier->name }}
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</htmlpageheader>
|
||||
<table>
|
||||
<tr>
|
||||
<td class="title">
|
||||
<strong>Invoice</strong>
|
||||
</td>
|
||||
<td class="document-detail">
|
||||
PO#: {{$group->reference}} <br>
|
||||
Ref#: {{$supplier->reference}} <br>
|
||||
Date: {{$group->created_at}}
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<br>
|
||||
|
||||
<table class="buyer-seller">
|
||||
<tr>
|
||||
<td width="50%" class="top">
|
||||
<span class="buyer-seller-title">
|
||||
Buyer
|
||||
</span>
|
||||
<br>
|
||||
<span class="buyer-company">
|
||||
CIEF Worldwide Sdn Bhd (1134596-M)
|
||||
</span>
|
||||
<div class="address">
|
||||
No. 72-3, Jalan Jalil 1,<br>
|
||||
The Earth Bukit Jalil,<br>
|
||||
57000 Kuala Lumpur
|
||||
</div>
|
||||
<div class="contact-no">
|
||||
Tel: 03-8082 1252
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<br>
|
||||
|
||||
<table class="line-table" style="overflow: wrap" autosize="1">
|
||||
<thead>
|
||||
<tr>
|
||||
<th width="5%">No</th>
|
||||
<th class="marking" width="10%">Marking</th>
|
||||
<th class="description">Description</th>
|
||||
<th width="10%">Currency Rate</th>
|
||||
<th width="15%">Unit Price (RM)</th>
|
||||
<th width="10%">Total Amount<br>(RM)</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
<tbody>
|
||||
|
||||
@foreach($transactions as $key => $transaction)
|
||||
<tr style="margin-bottom: 10px;">
|
||||
<td width="5%" class="center top">{{ $key + 1 }}</td>
|
||||
<td class="marking top" width="10%">{{$transaction->owner->owner->marking}}</td>
|
||||
<td class="description">Please refer to the appedix reference no: {{$transaction->owner->owner->marking}}</td>
|
||||
<td width="10%" class="center top">{{$transaction->currency_rate}}</td>
|
||||
<td>{{$transaction->currency->short_code}} {{number_format((float)$transaction->amount, 2, '.', '')}}</td>
|
||||
@php
|
||||
$sub_total_booking_amount = number_format((float)$transactions->sum('original_amount'), 2, '.', '');
|
||||
$transfer_fee = number_format((float)$transferFeeTransactions->sum('service_charge'), 2, '.', '');
|
||||
$total_booking_amount = number_format((float) ($transactions->sum('original_amount') + $transfer_fee), 2, '.', '');
|
||||
$sub_total_amount = number_format((float)$transactions->sum('amount') + ($transfer_fee * 1/$transactions[0]->currency_rate), 2, '.', '');
|
||||
$service_charge = number_format((float)$transactions->sum('service_charge'), 2, '.', '');
|
||||
$total_amount = number_format((float)$sub_total_amount + $service_charge, 2, '.', '');
|
||||
@endphp
|
||||
<td>MYR {{$total_amount}}</td>
|
||||
</tr>
|
||||
@endforeach
|
||||
</tbody>
|
||||
|
||||
</table>
|
||||
File diff suppressed because one or more lines are too long
@@ -38,6 +38,11 @@
|
||||
<div class="text-white all-caps fs-12">Currency Orders</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-auto p-r-20" v-if="$store.getters.isAdmin">
|
||||
<a href="{{route('supplier.payments')}}">
|
||||
<div class="text-white all-caps fs-12">Supplier Currency Orders</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-auto p-r-20" v-if="$store.getters.isAdmin">
|
||||
<a href="{{route('bookings')}}">
|
||||
<div class="text-white all-caps fs-12">Transfers</div>
|
||||
|
||||
Reference in New Issue
Block a user