mirror of
https://gitlab.com/CIEFWorldwideSdnBhd/portal.git
synced 2026-08-23 14:34:19 +00:00
Merge branch 'payment-and-billing-ui' of https://gitlab.com/CIEFWorldwideSdnBhd/shipping-portal into development
This commit is contained in:
edmondlang
@@ -0,0 +1,20 @@
|
||||
<?php
|
||||
|
||||
namespace App\Classes\General\Eloquent\Filters;
|
||||
|
||||
use Illuminate\Database\Eloquent\Builder;
|
||||
|
||||
class DoesNotHaveTransactionType implements Filter
|
||||
{
|
||||
/**
|
||||
* @param Builder $builder
|
||||
* @param $value
|
||||
* @return mixed
|
||||
*/
|
||||
public static function apply(Builder $builder, $value)
|
||||
{
|
||||
return $builder->whereDoesntHave('transactions', function (Builder $query) use($value) {
|
||||
$query->where('type', $value);
|
||||
});
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,20 @@
|
||||
<?php
|
||||
|
||||
namespace App\Classes\General\Eloquent\Filters;
|
||||
|
||||
use Illuminate\Database\Eloquent\Builder;
|
||||
|
||||
class HasInvoiceStatusIn implements Filter
|
||||
{
|
||||
/**
|
||||
* @param Builder $builder
|
||||
* @param $value
|
||||
* @return mixed
|
||||
*/
|
||||
public static function apply(Builder $builder, $value)
|
||||
{
|
||||
return $builder->whereHas('transactions', function (Builder $query) use($value) {
|
||||
$query->where('type', 1)->whereIn('status', $value);
|
||||
});
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,20 @@
|
||||
<?php
|
||||
|
||||
namespace App\Classes\General\Eloquent\Filters;
|
||||
|
||||
use Illuminate\Database\Eloquent\Builder;
|
||||
|
||||
class HasTransactionType implements Filter
|
||||
{
|
||||
/**
|
||||
* @param Builder $builder
|
||||
* @param $value
|
||||
* @return mixed
|
||||
*/
|
||||
public static function apply(Builder $builder, $value)
|
||||
{
|
||||
return $builder->whereHas('transactions', function (Builder $query) use($value) {
|
||||
$query->where('type', $value);
|
||||
});
|
||||
}
|
||||
}
|
||||
+2
-1
@@ -17,6 +17,7 @@ use App\Classes\Modules\Documents\Services\CreatesDocument;
|
||||
use App\Classes\Modules\Documents\DataTransferObjects\DocumentObject;
|
||||
use App\Classes\Modules\PackingLists\Services\FetchesPackingList;
|
||||
use App\Classes\Modules\Transactions\Services\UpdatesTransactionStatus;
|
||||
use App\Classes\Modules\Transactions\ControllersLogic\Document;
|
||||
|
||||
class ApproveShippingInvoiceTransactionLogic extends AbstractControllerLogic
|
||||
{
|
||||
@@ -66,7 +67,7 @@ class ApproveShippingInvoiceTransactionLogic extends AbstractControllerLogic
|
||||
*/
|
||||
public function logic(Request $request) : JsonResponse
|
||||
{
|
||||
$packing_list = $this->fetchesPackingList->execute(['id' => $request->input('packing_list_id')]);
|
||||
$packing_list = $this->fetchesPackingList->execute(['id' => $request->route('id')]);
|
||||
|
||||
$invoice_transaction = $packing_list->transactions->where('type', TransactionType::SHIPPING_INVOICE)->first();
|
||||
|
||||
|
||||
@@ -84,8 +84,11 @@ class CreatePaymentTransactionLogic extends AbstractControllerLogic
|
||||
$billPlzBill = $this->createsBillplzBill->execute(
|
||||
$company_module->name,
|
||||
$company_module->employees()->first()->email,
|
||||
'This payment is credit topup for company ref. ' . $company_module->reference, $amount, $billNumber,
|
||||
$request->input('bank_code'), true
|
||||
'This payment is for the invoice number . ' . $invoice_transaction->bill_no,
|
||||
$amount,
|
||||
$billNumber,
|
||||
$request->input('bank_code'),
|
||||
true
|
||||
);
|
||||
|
||||
$payment_reference = $billPlzBill->id;
|
||||
|
||||
+5
-7
@@ -83,9 +83,7 @@ class UpdateShippingInvoiceTransactionLogic extends AbstractControllerLogic
|
||||
|
||||
public function logic(Request $request) : JsonResponse
|
||||
{
|
||||
$packing_list = $this->fetchesPackingList->execute(['id' => $request->input('packing_list_id')]);
|
||||
|
||||
$invoice_transaction = $packing_list->transactions->where('type', TransactionType::SHIPPING_INVOICE)->first();
|
||||
$invoice_transaction = $this->fetchesTransaction->execute(['id' => $request->route('id')]);
|
||||
|
||||
$old_transaction_details = $invoice_transaction->transactionDetails->whereNotIn('reference', ['SHIPPING_FEE', 'OVER_WEIGHT_CHARGES'])->pluck('id')->toArray();
|
||||
|
||||
@@ -110,17 +108,17 @@ class UpdateShippingInvoiceTransactionLogic extends AbstractControllerLogic
|
||||
$object_detail = new TransactionDetailObject(
|
||||
'CUSTOM_CHARGES',
|
||||
isset($transaction_detail->name) ? $transaction_detail->name : TransactionDetailType::CUSTOM_CHARGES,
|
||||
1,
|
||||
$transaction_detail->quantity,
|
||||
$transaction_detail->price
|
||||
);
|
||||
|
||||
if($transaction_detail->id){
|
||||
if(isset($transaction_detail->id)){
|
||||
$new_transaction_detail = $this->updatesTransactionDetail->execute($this->fetchesTransactionDetail->execute(['id' => $transaction_detail->id]), $object_detail);
|
||||
}else{
|
||||
$new_transaction_detail = $this->createsTransactionDetail->execute($invoice_transaction, $object_detail);
|
||||
}
|
||||
|
||||
$total_cbm += $new_transaction_detail->price;
|
||||
$total_cbm += $new_transaction_detail->amount;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -139,7 +137,7 @@ class UpdateShippingInvoiceTransactionLogic extends AbstractControllerLogic
|
||||
0,
|
||||
0,
|
||||
null,
|
||||
ApprovalStatus::PENDING_SUBMISSION
|
||||
ApprovalStatus::PENDING_VERIFICATION
|
||||
);
|
||||
|
||||
/** @var Transaction $invoice_transaction */
|
||||
|
||||
@@ -16,11 +16,11 @@ class TransactionDetailResource extends JsonResource
|
||||
{
|
||||
|
||||
return [
|
||||
'stockCode' => $this->product_code,
|
||||
'description' => $this->product_name,
|
||||
'reference' => $this->reference,
|
||||
'quantity' => $this->quantity,
|
||||
'unit_price' => (double) $this->price,
|
||||
'total' => (double) $this->amount
|
||||
'price' => (double) $this->price,
|
||||
'name' => $this->name,
|
||||
'amount' => (double) $this->amount
|
||||
];
|
||||
}
|
||||
}
|
||||
|
||||
@@ -2,6 +2,9 @@
|
||||
|
||||
namespace App\Http\Resources;
|
||||
|
||||
use App\Classes\ValueObjects\Constants\ApprovalStatus;
|
||||
use App\Classes\ValueObjects\Constants\DocumentType;
|
||||
use App\Classes\ValueObjects\Constants\TransactionType;
|
||||
use Carbon\Carbon;
|
||||
use Illuminate\Http\Resources\Json\JsonResource;
|
||||
|
||||
@@ -19,18 +22,33 @@ class TransactionResource extends JsonResource
|
||||
return [
|
||||
'id' => $this->id,
|
||||
// 'booking' => new BookingResource($this->booking),
|
||||
'documents' => DocumentResource::collection($this->documents),
|
||||
'type' => (int) $this->type,
|
||||
'bill_no' => $this->bill_no,
|
||||
'amount' => (double) $this->amount,
|
||||
'outstanding' => (double) $this->amount - ($this->transactions()->where('type', TransactionType::PAYMENT)->whereIn('status', [ApprovalStatus::APPROVED, ApprovalStatus::COMPLETED])->sum('amount')),
|
||||
'service_charge' => (double) $this->service_charge,
|
||||
'tax' => (double) $this->tax,
|
||||
'original_amount' => (double) $this->original_amount,
|
||||
'currency' => new CurrencyResource($this->currency),
|
||||
'original_currency' => new CurrencyResource($this->original_currency),
|
||||
'currency_rate' => (double) $this->currency_rate,
|
||||
'status' => (int) $this->status,
|
||||
'details' => TransactionDetailResource::collection($this->transactionDetails),
|
||||
'documents' => new DocumentResource($this->documents()->first()),
|
||||
'transactions' => TransactionResource::collection($this->transactions),
|
||||
'payment_attempts' => TransactionResource::collection(
|
||||
$this->transactions()
|
||||
->payments()->where('status', ApprovalStatus::PENDING_SUBMISSION)
|
||||
->get()
|
||||
),
|
||||
'payment_history' => TransactionResource::collection(
|
||||
$this->transactions()
|
||||
->payments()
|
||||
->whereIn('status', [ApprovalStatus::APPROVED, ApprovalStatus::PENDING_VERIFICATION, ApprovalStatus::COMPLETED, ApprovalStatus::REJECTED])
|
||||
->get()
|
||||
),
|
||||
'expires_on' => Carbon::parse($this->expires_on)->format('d-m-Y h:s:i'),
|
||||
'updated_at' => Carbon::parse($this->update_at)->format('d-m-Y h:s:i')
|
||||
'updated_at' => Carbon::parse($this->update_at)->format('d-m-Y')
|
||||
];
|
||||
}
|
||||
}
|
||||
|
||||
+257
@@ -0,0 +1,257 @@
|
||||
<template>
|
||||
<div class="row m-b-15 m-l-5 m-r-10 parentContainer">
|
||||
<div class="col bg-white rounded">
|
||||
<div class="row">
|
||||
<div class="col padding-20">
|
||||
<div class="row align-items-center">
|
||||
<div class="col">
|
||||
<p class="no-margin fs-10 all-caps">Marking</p>
|
||||
<div class="no-margin">
|
||||
<div v-if="item.order">
|
||||
<a :href="route('customer.profile', item.order.company_module.marking)">{{item.order.company_module.marking}}</a>/<a :href="route('order.show', item.order.reference)">{{item.order.reference}}</a>
|
||||
<p v-if="item.receive_packing_list">{{item.receive_packing_list.transport.drop_date}}</p>
|
||||
</div>
|
||||
<div v-if="!item.order" class="text-danger">Unclaimed Packing List</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<p class="no-margin fs-10 all-caps">Invoice Date</p>
|
||||
<div v-if="!item.shippng_transaction">n/a</div>
|
||||
<div v-if="item.shippng_transaction"> {{ item.shippng_transaction.updated_at }}</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<p class="no-margin fs-10 all-caps">Status</p>
|
||||
<div class="all-caps">{{ invoice_status }}</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<p class="no-margin fs-10 all-caps">Amount</p>
|
||||
<div v-if="!item.shippng_transaction">n/a</div>
|
||||
<div v-if="item.shippng_transaction">MYR {{ item.shippng_transaction.amount.toFixed(2) }}</div>
|
||||
</div>
|
||||
<div class="col-auto p-l-0 p-r-0" v-if="['Pending Payment', 'Paid Invoice'].includes(invoice_status)">
|
||||
<div v-if="item.shippng_transaction">
|
||||
<div v-if="item.shippng_transaction.documents.length">
|
||||
<div v-for="file in item.shippng_transaction.documents[0].files" v-bind:key="file.id" class="col-auto no-padding">
|
||||
<document-file-viewer-component :file="file">
|
||||
<template slot="button">
|
||||
<div class="btn bg-grey no-border muted">
|
||||
<i class="fa fa-file-pdf-o"></i>
|
||||
</div>
|
||||
</template>
|
||||
</document-file-viewer-component>
|
||||
</div>
|
||||
</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 class="col-auto">
|
||||
<div class="btn bg-grey no-border" @click="expanded = !expanded" v-if="['Pending Approval', 'Pending Payment'].includes(invoice_status)">
|
||||
<i class="fa" :class="{'fa-angle-down': !expanded, 'fa-angle-up': expanded}" ></i>
|
||||
</div>
|
||||
<div v-if="!item.shippng_transaction">
|
||||
<div class="btn btn-outline-primary btn-lg pointer" @click="generateInvoice()">Generate Invoice</div>
|
||||
</div>
|
||||
<div class="btn bg-grey no-border muted requestModal" v-if="item.shippng_transaction && invoice_status == 'Pending Approval'" data-type="confirmInvoice">
|
||||
<i class="fa fa-check fs-12"></i>
|
||||
</div>
|
||||
<modal-component class="animate__animated animate__fast animate__fadeIn" styleType="fill-in" type="confirmInvoice">
|
||||
<approve-shipping-invoice-form-component :section="section" :data="data"></approve-shipping-invoice-form-component>
|
||||
</modal-component>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row b-t b-grey p-t-10 m-l-5 m-r-5" v-show="expanded" v-if="item.shippng_transaction && invoice_status == 'Pending Approval'">
|
||||
<div class="col p-b-10">
|
||||
<div class="row">
|
||||
<div class="col p-l-20 p-r-20 p-t-10 p-b-10">
|
||||
<div class="row align-items-center">
|
||||
<div class="col">
|
||||
<p class="no-margin fs-10 all-caps">Container Reference</p>
|
||||
<div>{{ item.packages.length ? item.packages[0].container.container_reference : 'n/a' }}</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<p class="no-margin fs-10 all-caps">Due Date</p>
|
||||
<div v-if="item.packages.length">
|
||||
<div v-if="item.packages[0].container.transport">{{ item.packages[0].container.transport.drop_date == null ? item.packages[0].container.transport.current_schedule.etd : item.packages[0].container.transport.drop_date }}</div>
|
||||
<div v-else>n/a</div>
|
||||
</div>
|
||||
<div v-else>n/a</div>
|
||||
</div>
|
||||
<!-- <div class="col">
|
||||
<p class="no-margin fs-10 all-caps">Paid Date</p>
|
||||
<div>n/a</div>
|
||||
</div> -->
|
||||
<div class="col">
|
||||
<p class="no-margin fs-10 all-caps">Total CBM</p>
|
||||
<div>{{ (parseFloat(cbm) + parseFloat(overweight)).toFixed(3) }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h5 class="text-underline text-center">Invoice Details</h5>
|
||||
<invoice-items-form-component :data="item.shippng_transaction" :section="section"></invoice-items-form-component>
|
||||
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<p class="no-margin fs-10 all-caps">Subtotal</p>
|
||||
<div>{{ item.shippng_transaction.amount - item.shippng_transaction.service_charge - item.shippng_transaction.tax }}</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<p class="no-margin fs-10 all-caps">Service Charges</p>
|
||||
<div>{{ item.shippng_transaction.service_charge }}</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<p class="no-margin fs-10 all-caps">Tax</p>
|
||||
<div>{{ item.shippng_transaction.tax }}</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<p class="no-margin fs-10 all-caps">Total</p>
|
||||
<div>{{ item.shippng_transaction.amount }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row b-t b-grey p-t-10 m-l-5 m-r-5" v-show="expanded" v-if="item.shippng_transaction && invoice_status == 'Pending Payment'">
|
||||
<div class="col-12 col-md-7 padding-20">
|
||||
<div class="row bg-master-lightest h-100">
|
||||
<div class="col">
|
||||
<div class="row bg-master-lightest" v-if="item.shippng_transaction.payment_attempts.length">
|
||||
<div class="col">
|
||||
<div class="row m-t-10 m-b-10">
|
||||
<div class="col">
|
||||
<div class="font-head fs-10 all-caps">Payment Attempt</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<shipping-transaction-component v-for="item in item.shippng_transaction.payment_attempts" v-bind:key="item.id" :data="item" ></shipping-transaction-component>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row bg-master-lightest" v-if="item.shippng_transaction.payment_history.length">
|
||||
<div class="col">
|
||||
<div class="row m-t-10 m-b-10">
|
||||
<div class="col">
|
||||
<div class="font-head fs-10 all-caps">Payment History</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<payment-history-component v-for="item in item.shippng_transaction.payment_history" v-bind:key="item.id" :data="item" ></payment-history-component>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 col-md-5 padding-20 parentContainer">
|
||||
<div class="row bg-master-lightest h-100">
|
||||
<div class="col">
|
||||
<div class="row padding-10">
|
||||
<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">Total Amount:</div>
|
||||
</div>
|
||||
<div class="col-auto text-right">
|
||||
<div class="font-heading fs-12">MYR {{(Math.round((item.shippng_transaction.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 text-success">
|
||||
<div class="col">
|
||||
<div class="font-heading all-caps fs-12">Paid Total:</div>
|
||||
</div>
|
||||
<div class="col-auto text-right">
|
||||
<!-- <div class="font-heading fs-12">MYR {{(Math.round((item.shippng_transaction.paid_amount + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}</div> -->
|
||||
<div class="font-heading fs-12">Paid Total</div>
|
||||
</div>
|
||||
</div>
|
||||
<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">
|
||||
<!-- <div class="font-heading fs-12">MYR {{(Math.round((item.shippng_transaction.floating_amount + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}</div> -->
|
||||
<div class="font-heading fs-12">Floating Amount</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">
|
||||
<div class="font-heading fs-12">MYR {{(Math.round((item.shippng_transaction.outstanding + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="row m-t-20" v-if="item.shippng_transaction.outstanding > 0"> -->
|
||||
<div class="row m-t-20">
|
||||
<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 class="btn btn-sm all-caps b-rad-none btn-success btn-block requestModal" data-type="makePayment">Make Payment</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<modal-component type="makePayment">
|
||||
<payment-form-component :data="item.shippng_transaction" :section="section"></payment-form-component>
|
||||
</modal-component>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import componentHandler from '../../../general/mixins/componentHandler';
|
||||
export default {
|
||||
props: {
|
||||
invoice_status: {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
section:{
|
||||
type: String,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
parameters: {
|
||||
packing_list_id: null,
|
||||
transaction_details: [],
|
||||
},
|
||||
expanded: false,
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
cbm () {
|
||||
return (Math.ceil((this.item.packages.reduce((total, obj) => (obj.type === 2 ? 0 : obj.cbm) + total, 0)) * 1000) / 1000).toFixed(3)
|
||||
},
|
||||
overweight(){
|
||||
return (Math.ceil((this.item.packages.reduce((total, obj) => (obj.type === 2 ? obj.cbm : 0) + total, 0)) * 1000) / 1000).toFixed(3)
|
||||
}
|
||||
},
|
||||
created(){
|
||||
this.parameters.packing_list_id = this.data.id;
|
||||
},
|
||||
methods: {
|
||||
generateInvoice() {
|
||||
this.submit(this.route('api.transaction.invoice.create'), 'post', this.section, true, true);
|
||||
},
|
||||
successHandler(response){
|
||||
this.item = response.payload.data;
|
||||
// this.$forceUpdate();
|
||||
}
|
||||
},
|
||||
mixins: [componentHandler]
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,137 @@
|
||||
<template>
|
||||
<div class="row m-l-0 m-b-10 m-r-0 parentContainer" :class="[{'b-a': item.status === 4}, {'b-danger': item.status === 4}, {'b-a': item.status === 5}, {'b-danger': item.status === 5}]" >
|
||||
<div class="col">
|
||||
<div class="row" v-if="!item.transaction_bill">
|
||||
<div class="col">
|
||||
<div class="row bg-white ">
|
||||
<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="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.status === 1 || item.status === 4}, {'text-success': item.status !== 1 && item.status !== 4}]">
|
||||
{{ item.status === 1 ? 'Pending Verification' : item.status === ( 4 || 5) ? 'Rejected' : 'Processing Payment'}}
|
||||
</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.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">
|
||||
<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>
|
||||
<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="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>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row align-items-center h-100" v-if="item.payment_method === 5 && item.status === 1">
|
||||
<div class="col">
|
||||
<a :href="route('billplz.bill', item.payment_reference)"><i class="fa fa-repeat text-success"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row b-t b-grey" v-if="expandPaymentDetails">
|
||||
<div class="col bg-white padding-15">
|
||||
<!-- <div class="row align-items-end m-b-10 text-success bold">
|
||||
<div class="col">
|
||||
<div class="font-heading all-caps fs-10">Recipient Gets</div>
|
||||
</div>
|
||||
<div class="col-auto text-right">
|
||||
<div class="font-heading fs-10">{{item.original_currency.short_code}} {{(item.original_amount).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row align-items-end bold m-b-10 text-primary">
|
||||
<div class="col">
|
||||
<div class="font-heading all-caps fs-10">Rate</div>
|
||||
</div>
|
||||
<div class="col-auto text-right">
|
||||
<div class="font-heading fs-10 ">{{(Math.round((item.currency_rate + Number.EPSILON) * 100000) / 100000).toFixed(5) }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row align-items-end m-b-10 hint-text">
|
||||
<div class="col">
|
||||
<div class="font-heading all-caps fs-10">Transfer Charges</div>
|
||||
</div>
|
||||
<div class="col-auto text-right">
|
||||
<div class="font-heading fs-10">MYR {{(Math.round((item.service_charge + Number.EPSILON) * 100) / 100).toFixed(2)}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row align-items-end m-b-5 hint-text">
|
||||
<div class="col">
|
||||
<div class="font-heading all-caps fs-10">Tax</div>
|
||||
</div>
|
||||
<div class="col-auto text-right">
|
||||
<div class="font-heading fs-10">MYR {{(Math.round((item.tax + Number.EPSILON) * 100) / 100).toFixed(2)}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row align-items-end m-b-10 bold text-success">
|
||||
<div class="col">
|
||||
<div class="font-heading all-caps fs-10">Your Payment</div>
|
||||
</div>
|
||||
<div class="col-auto text-right">
|
||||
<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">
|
||||
<div class="col">
|
||||
<div class="font-heading all-caps fs-10 m-b-5">Your Payment Proof</div>
|
||||
<div class="row no-margin" v-if="item.payment_method !== 5">
|
||||
<div v-if="item.documents.length">
|
||||
<div v-for="file in item.documents[0].files" v-bind:key="file.id" class="col-auto no-padding m-r-5">
|
||||
<document-file-viewer-component :file="file">
|
||||
<template slot="button">
|
||||
<div class="icon-thumbnail fs-11 text-white icon-25 bg-primary btn-rounded float-left m-r-5">
|
||||
<i class="fa fa-file-image-o fs-10"></i>
|
||||
</div>
|
||||
</template>
|
||||
</document-file-viewer-component>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row no-margin" v-if="item.payment_method === 5 && (item.status === 2 || item.status === 3)">
|
||||
<a :href="route('billplz.bill', item.payment_reference)" target="_blank">
|
||||
<div class="icon-thumbnail fs-11 text-white icon-25 bg-primary btn-rounded float-left m-r-5">
|
||||
<i class="fa fa-file-image-o fs-10"></i>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import componentHandler from '../../../general/mixins/componentHandler';
|
||||
export default {
|
||||
data(){
|
||||
return {
|
||||
expandPaymentDetails: false,
|
||||
amount: (Math.round(1000 * 100) / 100).toFixed(2),
|
||||
parameters: {
|
||||
amount: (Math.round(1000 * 100) / 100).toFixed(2),
|
||||
bank_id: 1
|
||||
},
|
||||
section: 'bookingDetailSection',
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
clickExpand(){
|
||||
this.expandPaymentDetails = !this.expandPaymentDetails;
|
||||
},
|
||||
},
|
||||
mixins: [componentHandler]
|
||||
}
|
||||
</script>
|
||||
+159
@@ -0,0 +1,159 @@
|
||||
<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 p-b-5 b-b b-grey" v-show="!isLoading">
|
||||
<div class="col">
|
||||
<div class="row">
|
||||
<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.updated_at }}
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="col-auto">
|
||||
<div class="font-heading fs-10 muted all-caps">Order No</div>
|
||||
<div class="font-heading fs-10">
|
||||
</div>
|
||||
</div> -->
|
||||
<!-- <div class="col-auto">
|
||||
<div class="font-heading fs-10 muted all-caps">Marking</div>
|
||||
<div class="font-heading fs-10">
|
||||
<a :href="route('customer.profile', item.booking.company.reference)">{{item.booking.company.reference}}</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">
|
||||
{{(Math.round((item.amount + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row m-b-10">
|
||||
<div class="col">
|
||||
<div class="font-heading fs-10 muted all-caps">Payment Proof</div>
|
||||
<div class="row no-margin" v-if="item.payment_method !==5 && item.payment_method !==4">
|
||||
<div v-for="file in item.documents[0].files" v-bind:key="file.id" class="col-auto no-padding">
|
||||
<document-file-viewer-component :file="file">
|
||||
<template slot="button">
|
||||
<div class="icon-thumbnail fs-11 text-white icon-25 bg-primary btn-rounded float-left m-r-5">
|
||||
<i class="fa fa-file-image-o fs-10"></i>
|
||||
</div>
|
||||
</template>
|
||||
</document-file-viewer-component>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row no-margin" v-if="item.payment_method ===5">
|
||||
<div class="col no-padding">
|
||||
<a :href="route('billplz.bill', item.payment_reference)" target="_blank">
|
||||
<div class="icon-thumbnail fs-11 text-white icon-25 bg-complete btn-rounded float-left m-r-5">
|
||||
Bz
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row no-margin" v-if="item.payment_method ===4">
|
||||
<div class="col no-padding">
|
||||
<div class="font-heading fs-10">{{item.payment_reference}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="col-auto">
|
||||
<div class="font-heading fs-10 muted all-caps">Service</div>
|
||||
<div class="font-heading fs-10">
|
||||
{{item.booking.service.name}}
|
||||
</div>
|
||||
</div> -->
|
||||
<!-- <div class="col">
|
||||
<div class="font-heading fs-10 muted all-caps">Booking</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="row">
|
||||
<div v-if="!no_action" 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">
|
||||
<div class="row">
|
||||
<div class="col text-center">
|
||||
<div class="row">
|
||||
<div class="col text-center">
|
||||
<div class="row m-b-20">
|
||||
<div class="col">
|
||||
<h5 class="all-caps">Reject Document</h5>
|
||||
<div class="fs-11">Are you sure you want to reject this payment?</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col p-r-5">
|
||||
<div data-dismiss="modal" class="btn btn-sm btn-default bg-master-lighter btn-block b-rad-none">Cancel</div>
|
||||
</div>
|
||||
<div class="col p-l-5">
|
||||
<div data-dismiss="modal" class="btn btn-sm btn-danger btn-block b-rad-none" @click="approvePayment('reject')">Reject</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</modal-component>
|
||||
<modal-component small type="approvePayment">
|
||||
<div class="row">
|
||||
<div class="col text-center">
|
||||
<div class="row">
|
||||
<div class="col text-center">
|
||||
<div class="row m-b-20">
|
||||
<div class="col">
|
||||
<h5 class="all-caps">Approve Payment</h5>
|
||||
<div class="fs-11">Are you sure you want to approve this payment?</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col p-r-5">
|
||||
<div data-dismiss="modal" class="btn btn-sm btn-default bg-master-lighter btn-block b-rad-none">Cancel</div>
|
||||
</div>
|
||||
<div class="col p-l-5">
|
||||
<div data-dismiss="modal" class="btn btn-sm btn-success btn-block b-rad-none" @click="approvePayment('approve')">Approve</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</modal-component>
|
||||
</div>
|
||||
</div>
|
||||
</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: {
|
||||
no_action: Boolean
|
||||
},
|
||||
methods: {
|
||||
approvePayment(status){
|
||||
this.isLoading = true;
|
||||
this.submit(this.route('api.transaction.payment.approval', this.item.id, status), 'put', 'identificationVerificationSection', true, true);
|
||||
},
|
||||
},
|
||||
mixins: [componentHandler, staticFormHandler]
|
||||
}
|
||||
</script>
|
||||
+70
@@ -0,0 +1,70 @@
|
||||
<template>
|
||||
<div class="row m-l-0 m-b-10 m-r-0 parentContainer">
|
||||
<div class="col-auto bg-master-lighter requestModal pointer" data-type="deleteAttempt">
|
||||
<div class="row align-items-center h-100">
|
||||
<div class="col">
|
||||
<i class="fa fa-times muted"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col bg-white p-t-10 p-b-10 p-r-0">
|
||||
<div class="row m-b-5">
|
||||
<div class="col-auto">
|
||||
<div class="font-heading fs-8 muted all-caps">Payment Amount</div>
|
||||
<div class="font-heading fs-10 bold">
|
||||
MYR {{(Math.round((item.original_amount + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto p-l-5 p-r-5 bg-success pointer" v-if="item.payment_method === 5">
|
||||
<a :href="route('billplz.bill', item.payment_reference)">
|
||||
<div class="row align-items-center h-100">
|
||||
<div class="col">
|
||||
<i class="fa fa-repeat fs-20 text-white p-l-10 p-r-10"></i>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-auto p-l-5 p-r-5 bg-success requestModal pointer" v-if="item.payment_method !== 5" data-type="paymentProofModal">
|
||||
<div @click="selectedID(item.id)" class="row align-items-center h-100">
|
||||
<div class="col">
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
<modal-component class="animate__animated animate__fast animate__fadeIn" styleType="fill-in" type="deleteAttempt">
|
||||
<delete-payment-attempt-form-component :data="item" :section="section" class="text-center"></delete-payment-attempt-form-component>
|
||||
</modal-component>
|
||||
<modal-component type="paymentProofModal">
|
||||
<payment-verification-form-component v-if="selected_id == item.id" :section="section" :data="item"></payment-verification-form-component>
|
||||
</modal-component>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import componentHandler from '../../../general/mixins/componentHandler';
|
||||
export default {
|
||||
data(){
|
||||
return {
|
||||
expandPaymentDetails: false,
|
||||
amount: (Math.round(1000 * 100) / 100).toFixed(2),
|
||||
selected_id: '',
|
||||
parameters: {
|
||||
amount: (Math.round(1000 * 100) / 100).toFixed(2),
|
||||
bank_id: 1
|
||||
},
|
||||
section: 'bookingDetailSection',
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
clickExpand(){
|
||||
this.expandPaymentDetails = !this.expandPaymentDetails;
|
||||
},
|
||||
selectedID(id){
|
||||
this.selected_id = id;
|
||||
}
|
||||
},
|
||||
mixins: [componentHandler]
|
||||
}
|
||||
</script>
|
||||
+31
@@ -0,0 +1,31 @@
|
||||
<template>
|
||||
<div class="row" @keyup.enter="submitForm">
|
||||
<div class="col bg-white padding-40 b-rad-lg">
|
||||
<div class="row">
|
||||
<div class="col text-center">
|
||||
<div class="row m-b-20">
|
||||
<div class="col">
|
||||
<h5 class="all-caps">Approve Invoice</h5>
|
||||
<div class="fs-11">Are you sure you want to approve this invoice?</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col p-r-5">
|
||||
<div data-dismiss="modal" class="btn btn-sm btn-default bg-master-lighter btn-block b-rad-none">Cancel</div>
|
||||
</div>
|
||||
<div class="col p-l-5">
|
||||
<div class="btn btn-success w-100 btn-sm" @click="submit(route('api.transaction.invoice.approve', data.id), 'put', section, true, true)">Confirm</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import modalFormHandler from '../../../general/mixins/modalFormHandler';
|
||||
export default {
|
||||
mixins: [modalFormHandler]
|
||||
}
|
||||
|
||||
</script>
|
||||
+33
@@ -0,0 +1,33 @@
|
||||
<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">
|
||||
<h3 class="all-caps">Are you Sure?</h3>
|
||||
<div class="fs-11">Are you sure you want to delete payment booking? you will not be able to recover your booking after confirming your action.</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.transaction.suspend', 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>
|
||||
@@ -0,0 +1,171 @@
|
||||
<template>
|
||||
<div class="row align-items-center">
|
||||
<div class="col">
|
||||
<div class="row bg-white b-a b-grey rounded padding-10" v-if="!isEdit">
|
||||
<div class="col">
|
||||
<div class="row align-items-center">
|
||||
<div class="col-auto"><div class="icon-thumbnail icon-35 mr-0 bg-master-lightest light">{{index + 1}}</div></div>
|
||||
<div class="col">
|
||||
<p class="m-b-0 small muted">Name</p>
|
||||
<p class="m-b-0 bold">{{product.name}}</p>
|
||||
</div>
|
||||
<div class="col">
|
||||
<p class="m-b-0 small muted">Unit Price</p>
|
||||
<p class="m-b-0 bold">{{product.price}}</p>
|
||||
</div>
|
||||
<div class="col">
|
||||
<p class="m-b-0 small muted">Quantity</p>
|
||||
<p class="m-b-0 bold">{{product.quantity}}</p>
|
||||
</div>
|
||||
<div class="col">
|
||||
<p class="m-b-0 small muted">Total</p>
|
||||
<p class="m-b-0 bold text-success">{{currency}} {{(Math.round((productTotal + Number.EPSILON) * 100) / 100).toFixed(2)}}</p>
|
||||
</div>
|
||||
<div class="col-auto" :class="{ 'invisible': ['SHIPPING_FEE', 'OVER_WEIGHT_CHARGES'].includes(product.reference) }">
|
||||
<div @click="isEdit = !isEdit" class="pointer">
|
||||
<i class="fa fa-pencil" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto" :class="{ 'invisible': ['SHIPPING_FEE', 'OVER_WEIGHT_CHARGES'].includes(product.reference) }">
|
||||
<div @click="$emit('remove')" class="pointer">
|
||||
<i class="fa fa-close" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" v-if="isEdit">
|
||||
<div class="col padding-25 bg-master-lightest">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<validation-wrapper-component :validator="$v.product.name">
|
||||
<label>Name</label>
|
||||
<input class="form-control" v-model="product.name">
|
||||
</validation-wrapper-component>
|
||||
</div>
|
||||
<div class="col">
|
||||
<validation-wrapper-component :validator="$v.product.price">
|
||||
<label>Unit Price</label>
|
||||
<input class="form-control" v-model="product.price">
|
||||
<!-- <input class="form-control" v-model="product.price" v-money="{decimal: '.',thousands: '', precision: 2}"> -->
|
||||
</validation-wrapper-component>
|
||||
</div>
|
||||
<div class="col">
|
||||
<validation-wrapper-component :validator="$v.product.quantity">
|
||||
<label>Quantity</label>
|
||||
<!-- <input class="form-control" v-model="product.quantity" v-money="{decimal: '.',thousands: '', precision: 2}"> -->
|
||||
<input class="form-control" v-model="product.quantity" >
|
||||
</validation-wrapper-component>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p>{{ data }}</p>
|
||||
|
||||
<div class="row m-t-15">
|
||||
<div class="col">
|
||||
<p class="m-b-0 small">Total</p>
|
||||
<h6 class="no-margin bold text-complete">{{currency}} {{productTotal.toFixed(3)}}</h6>
|
||||
</div>
|
||||
<div class="col text-right">
|
||||
<button class="btn btn-lg btn-secondary b-rad-none" @click="cancelUpdate()">Cancel</button>
|
||||
<button class="btn btn-lg btn-outline-success b-rad-none" @click="updateProduct()">Save Changes</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import formHandler from '../../../general/mixins/formHandler';
|
||||
import { required } from "vuelidate/lib/validators";
|
||||
|
||||
export default {
|
||||
props: {
|
||||
editable: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
currency:{
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
index:{
|
||||
type: Number,
|
||||
// required: true
|
||||
default: 0
|
||||
},
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
isEdit: false,
|
||||
product: {
|
||||
name: '',
|
||||
quantity: 0,
|
||||
price: 0,
|
||||
amount: 0,
|
||||
},
|
||||
products: []
|
||||
}
|
||||
},
|
||||
validations: {
|
||||
product: {
|
||||
name: { required },
|
||||
quantity: { required },
|
||||
price: { required },
|
||||
}
|
||||
},
|
||||
created() {
|
||||
if (this.data) {
|
||||
this.product = this.data;
|
||||
} else {
|
||||
this.isEdit = true;
|
||||
}
|
||||
this.product.amount = (Math.round((this.product.amount+ Number.EPSILON) * 1000) / 1000).toFixed(3);
|
||||
},
|
||||
computed: {
|
||||
productTotal(){
|
||||
return this.product.quantity * parseFloat((this.product.price).toString().replace(',', ''));
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
clearInterval(){
|
||||
clearInterval(this.interval);
|
||||
this.interval = false;
|
||||
},
|
||||
updateProduct(){
|
||||
if (!this.data) {
|
||||
this.$emit('add', {
|
||||
name: this.product.name,
|
||||
quantity: this.product.quantity,
|
||||
reference: 'CUSTOM_CHARGES',
|
||||
price: parseFloat((this.product.price).toString().replace(',', '')),
|
||||
amount: this.productTotal
|
||||
});
|
||||
|
||||
} else {
|
||||
this.isEdit = !this.isEdit;
|
||||
|
||||
console.log(this.data.reference);
|
||||
|
||||
this.$emit('change', {
|
||||
name: this.product.name,
|
||||
quantity: this.product.quantity,
|
||||
reference: this.data.reference,
|
||||
price: parseFloat((this.product.price).toString().replace(',', '')),
|
||||
amount: this.productTotal
|
||||
}, this.index);
|
||||
}
|
||||
},
|
||||
cancelUpdate() {
|
||||
if (!this.data) {
|
||||
this.$emit('change', 'cancelAddProduct', true);
|
||||
} else {
|
||||
this.isEdit = !this.isEdit;
|
||||
this.product = this.data;
|
||||
}
|
||||
}
|
||||
},
|
||||
mixins: [formHandler]
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,79 @@
|
||||
<template>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="row no-margin">
|
||||
<div class="col p-b-15 p-l-0 p-r-0">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="row" v-for="(detail, index) in details">
|
||||
<div class="col p-b-10 p-t-10 " :class="[{'b-grey' : index !== Object.keys(details).length - 1}, {'b-b' : index !== Object.keys(details).length - 1}]">
|
||||
<invoice-item-form-component :data="detail" :index="index" currency="MYR" :editable="!submitted" :section="section" @change="updateProduct($event, index)" v-on:remove="removeProduct(index)"></invoice-item-form-component>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row" v-if="addCharges">
|
||||
<div class="col">
|
||||
<invoice-item-form-component currency="MYR" :editable="!submitted" :section="section" @change="addCharges = !addCharges" @add="addProduct($event)" v-on:remove="removeProduct(index)"></invoice-item-form-component>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row d-flex justify-content-center allign-items-between align-items-center m-b-15">
|
||||
<div class="col-auto">
|
||||
<div class="btn btn-outline-primary btn-md" @click="addCharges = !addCharges">{{ addCharges? 'Cancel' : 'Add Charges' }}</div>
|
||||
<div class="btn btn-outline-primary btn-md" @click="submitForm()">Save Change</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import formHandler from '../../../general/mixins/formHandler';
|
||||
export default {
|
||||
data(){
|
||||
return {
|
||||
interval:false,
|
||||
addCharges:false,
|
||||
canSubmitChanges:false,
|
||||
submitted: false,
|
||||
details: this.data.details,
|
||||
canSaveChange: false,
|
||||
parameters: {
|
||||
transaction_details: []
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
updateProduct(product, index) {
|
||||
this.details[index] = {
|
||||
name: product.name,
|
||||
quantity: product.quantity,
|
||||
reference: product.reference,
|
||||
price: parseFloat((product.price).toString().replace(',', '')),
|
||||
amount: parseFloat((product.amount).toString().replace(',', '')),
|
||||
};
|
||||
},
|
||||
removeProduct(index) {
|
||||
this.canSubmitChanges = !this.canSubmitChanges;
|
||||
this.data.details.splice(index, 1);
|
||||
},
|
||||
addProduct(newProduct) {
|
||||
this.canSubmitChanges = !this.canSubmitChanges;
|
||||
this.addCharges = !this.addCharges;
|
||||
this.details.push(newProduct);
|
||||
},
|
||||
submitForm() {
|
||||
this.canSubmitChanges = !this.canSubmitChanges;
|
||||
this.parameters.transaction_details = this.details;
|
||||
|
||||
console.log(this.parameters.transaction_details);
|
||||
|
||||
this.submit(this.route('api.transaction.invoice.update', this.data.id), 'put', this.section, true, true);
|
||||
}
|
||||
},
|
||||
mixins: [formHandler]
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,49 @@
|
||||
<template>
|
||||
<div class="row" @keyup.enter="submitForm">
|
||||
<div class="col">
|
||||
<div class="row bg-master-lightest padding-20 m-b-15">
|
||||
<div class="col">
|
||||
<p>Outstanding: MYR {{ data.outstanding.toFixed(2) }}</p>
|
||||
|
||||
<validation-wrapper-component :validator="$v.parameters.amount">
|
||||
<label>Amount</label>
|
||||
<input class="form-control" v-model="parameters.amount" v-money="{decimal: '.',thousands: '', precision: 2}">
|
||||
</validation-wrapper-component>
|
||||
|
||||
<div class="row m-t-15 w-100 text-center">
|
||||
<div class="col">
|
||||
<button class="btn btn-lg btn-primary" @click="submitForm()">Make Payment</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import formHandler from '../../../general/mixins/formHandler';
|
||||
import { required } from "vuelidate/lib/validators";
|
||||
|
||||
export default {
|
||||
data(){
|
||||
return {
|
||||
parameters : {
|
||||
amount: this.data.outstanding.toFixed(2),
|
||||
transaction_id: this.data.id
|
||||
}
|
||||
}
|
||||
},
|
||||
validations: {
|
||||
parameters : {
|
||||
amount: { required },
|
||||
},
|
||||
},
|
||||
methods:{
|
||||
submitForm(){
|
||||
this.submit(this.route('api.transaction.payment.create'), 'post', this.section, true, true);
|
||||
}
|
||||
},
|
||||
mixins: [formHandler]
|
||||
}
|
||||
|
||||
</script>
|
||||
+84
@@ -0,0 +1,84 @@
|
||||
<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 Verification</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row m-b-10">
|
||||
<div class="col">
|
||||
<div class="row align-items-top">
|
||||
<div class="col">
|
||||
<div class="font-heading fs-10 muted all-caps">You are Paying</div>
|
||||
<div class="font-heading fs-16 bold text-success">
|
||||
{{data.currency.short_code}} {{(Math.round((data.amount + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}
|
||||
</div>
|
||||
</div>
|
||||
</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.payment.verification.create', this.data.id), 'post', this.section, true, true)
|
||||
}
|
||||
},
|
||||
mixins: [ModalFromHandler]
|
||||
|
||||
}
|
||||
</script>
|
||||
+149
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
+12
-11
@@ -5,18 +5,19 @@ use Illuminate\Support\Facades\Route;
|
||||
Route::group(['prefix' => 'transactions', 'namespace' => 'Transactions', 'as' => 'transaction.'], function () {
|
||||
|
||||
Route::get('/list', 'ListTransactionsController@list')->name('list');
|
||||
// Route::delete('/suspend/{id}', 'SuspendTransactionController@suspend')->name('suspend');
|
||||
Route::delete('/suspend/{id}', 'SuspendTransactionController@suspend')->name('suspend');
|
||||
|
||||
Route::post('/payment/create', 'CreatePaymentTransactionController@create')->name('payment.create');
|
||||
Route::post('/payment/upload-verification-document/{transaction_id}', 'UploadPaymentVerificationDocumentController@upload')->name('verification.create');
|
||||
Route::put('/payment/approve/{transaction_id}/{status}', 'ApprovePaymentTransactionController@approve')->where('status', 'approve|reject')->name('approval');
|
||||
|
||||
|
||||
route::post('/shipping-invoice/create', 'CreateShippingInvoiceTransactionController@create')->name('supplier.create');
|
||||
|
||||
route::put('/shipping-invoice/update', 'UpdateShippingInvoiceTransactionController@update')->name('supplier.update');
|
||||
|
||||
route::put('/shipping-invoice/approve', 'ApproveShippingInvoiceTransactionController@approve')->name('supplier.approve');
|
||||
Route::group(['prefix' => 'payment', 'as' => 'payment.'], function () {
|
||||
Route::post('/create', 'CreatePaymentTransactionController@create')->name('create');
|
||||
Route::post('/upload-verification-document/{transaction_id}', 'UploadPaymentVerificationDocumentController@upload')->name('verification.create');
|
||||
Route::put('/approve/{transaction_id}/{status}', 'ApprovePaymentTransactionController@approve')->where('status', 'approve|reject')->name('approval');
|
||||
});
|
||||
|
||||
Route::group(['prefix' => 'invoice', 'as' => 'invoice.'], function () {
|
||||
route::post('/shipping-invoice/create', 'CreateShippingInvoiceTransactionController@create')->name('create');
|
||||
route::put('/shipping-invoice/{id}/update', 'UpdateShippingInvoiceTransactionController@update')->name('update');
|
||||
route::put('/shipping-invoice/{id}/approve', 'ApproveShippingInvoiceTransactionController@approve')->name('approve');
|
||||
});
|
||||
|
||||
route::post('/shipping-invoice/calculator', 'ShippingEstimationCalculatorController@calculate')->name('shipping.estimation.calculator');
|
||||
|
||||
|
||||
@@ -412,4 +412,11 @@ Route::get('/customers/active/{active_start}/{active_end}/{inactive_start?}/{ina
|
||||
|
||||
Route::get('/online_payment/redirect', 'Billplz\CallbackBillplzController@callback')->name('online_payment.redirect');
|
||||
|
||||
Route::get('/order/{id}', function ($id) {
|
||||
return view('pages.orders.profile', ['id' => $id]);
|
||||
})->name('order.details');
|
||||
|
||||
Route::get('/payment-and-billing', function () {
|
||||
return view('pages.paymentAndBilling');
|
||||
})->name('admin.payment-and-billing');
|
||||
Route::get('/notifications/list', 'Notifications\ListNotificationsController@list')->name('notifications.list');
|
||||
|
||||
Reference in New Issue
Block a user