cief/exchange-2.0
1
0
Fork 0
mirror of https://gitlab.com/CIEFWorldwideSdnBhd/exchange-2.0.git synced 2026-08-19 04:23:55 +00:00
Code Issues Packages Projects Releases Wiki Activity

create API and update wallet component statistics

Browse Source
This commit is contained in:
edmondlang
2022-03-20 23:50:54 +08:00
parent f9d246b9f6
commit ce60f96eb6
3 changed files with 161 additions and 91 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/Http/Controllers/Wallets/WalletReportController.php
+29
View File
@@ -0,0 +1,29 @@
<?php
namespace App\Http\Controllers\Wallets;
use App\Classes\ValueObjects\Response\ApiResponseObject;
use App\Classes\ValueObjects\Constants\HttpStatus;
use App\Classes\ValueObjects\Constants\TransactionType;
use App\Models\Transaction;
use App\Models\Wallet;
use Illuminate\Http\JsonResponse;
use Illuminate\Http\Request;
class WalletReportController
{
public function walletsReport(Request $request): JsonResponse
{
return (new ApiResponseObject(
'fetch service report Successful',
'',
HttpStatus::OK_WITH_MESSAGE,
['data' => [
'walletSum' => (float) Wallet::all()->sum('amount'),
'outgoingSum' => (float) Transaction::where('type', TransactionType::PAYMENT)->where('owner_type', Wallet::class)->sum('amount'),
'incomingSum' => (float) Transaction::whereIn('type', [TransactionType::TOP_UP, TransactionType::CREDIT_NOTE])->where('owner_type', Wallet::class)->sum('amount'),
]]
))->handler();
}
}
resources/assets/vue/components/wallets/elements/WalletsComponent.vue
+130 -91
View File
@@ -1,122 +1,127 @@
<template> <template>
<div class="row"> <div class="row">
<div class="col"> <div class="col">
<div class="row"> <loading-component v-if="isLoading"></loading-component>
<div class="col-12 p-0" style="width: 500px; height:350px"> <div class="row" v-if="!isLoading">
<canvas id="wallets-chart"></canvas>
</div>
</div>
<div class="row">
<div class="col"> <div class="col">
<div class="card no-border bg-success text-white widget-loader-bar m-b-10"> <div class="row">
<div class="container-xs-height full-height"> <div class="col-12 p-0" style="width: 500px; height:350px">
<div class="row-xs-height"> <canvas id="wallets-chart"></canvas>
<div class="col-xs-height col-top"> </div>
<div class="card-header top-left top-right"> </div>
<div class="card-title"> <div class="row">
<span class="font-montserrat fs-11 all-caps">Total Amount</span> <div class="col">
<div class="card no-border bg-success text-white widget-loader-bar m-b-10">
<div class="container-xs-height full-height">
<div class="row-xs-height">
<div class="col-xs-height col-top">
<div class="card-header top-left top-right">
<div class="card-title">
<span class="font-montserrat fs-11 all-caps">Total Amount</span>
</div>
</div>
</div> </div>
</div> </div>
</div> <div class="row-xs-height">
</div> <div class="col-xs-height col-top">
<div class="row-xs-height"> <div class="p-l-20 p-t-50 p-b-40 p-r-20">
<div class="col-xs-height col-top"> <h3 class="no-margin p-b-5 text-white">MYR {{(Math.round((report.walletSum + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}</h3>
<div class="p-l-20 p-t-50 p-b-40 p-r-20"> </div>
<h3 class="no-margin p-b-5 text-white">MYR 500,123</h3> </div>
</div> </div>
</div> <div class="row-xs-height">
</div> <div class="col-xs-height col-bottom">
<div class="row-xs-height"> <div class="progress progress-small m-b-0">
<div class="col-xs-height col-bottom"> <div class="progress-bar progress-bar-success" style="width: 0"></div>
<div class="progress progress-small m-b-0"> </div>
<div class="progress-bar progress-bar-success" style="width: 0"></div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> <div class="col">
</div> <div class="card no-border bg-success-light text-white widget-loader-bar m-b-10">
<div class="col"> <div class="container-xs-height full-height">
<div class="card no-border bg-success-light text-white widget-loader-bar m-b-10"> <div class="row-xs-height">
<div class="container-xs-height full-height"> <div class="col-xs-height col-top">
<div class="row-xs-height"> <div class="card-header top-left top-right">
<div class="col-xs-height col-top"> <div class="card-title">
<div class="card-header top-left top-right"> <span class="font-montserrat fs-11 all-caps">Total Incoming Amount</span>
<div class="card-title"> </div>
<span class="font-montserrat fs-11 all-caps">Total Incoming Amount</span> </div>
</div> </div>
</div> </div>
</div> <div class="row-xs-height">
</div> <div class="col-xs-height col-top">
<div class="row-xs-height"> <div class="p-l-20 p-t-50 p-b-40 p-r-20">
<div class="col-xs-height col-top"> <h3 class="no-margin p-b-5 text-white">MYR {{(Math.round((report.incomingSum + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}</h3>
<div class="p-l-20 p-t-50 p-b-40 p-r-20"> </div>
<h3 class="no-margin p-b-5 text-white">MYR 500,123</h3> </div>
</div> </div>
</div> <div class="row-xs-height">
</div> <div class="col-xs-height col-bottom">
<div class="row-xs-height"> <div class="progress progress-small m-b-0">
<div class="col-xs-height col-bottom"> <div class="progress-bar progress-bar-success" style="width: 0"></div>
<div class="progress progress-small m-b-0"> </div>
<div class="progress-bar progress-bar-success" style="width: 0"></div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> <div class="col">
</div> <div class="card no-border bg-warning widget-loader-bar m-b-10">
<div class="col"> <div class="container-xs-height full-height">
<div class="card no-border bg-warning widget-loader-bar m-b-10"> <div class="row-xs-height">
<div class="container-xs-height full-height"> <div class="col-xs-height col-top">
<div class="row-xs-height"> <div class="card-header top-left top-right">
<div class="col-xs-height col-top"> <div class="card-title">
<div class="card-header top-left top-right"> <span class="font-montserrat fs-11 all-caps">Total Outgoing Amount</span>
<div class="card-title"> </div>
<span class="font-montserrat fs-11 all-caps">Total Outgoing Amount</span> </div>
</div> </div>
</div> </div>
</div> <div class="row-xs-height">
</div> <div class="col-xs-height col-top">
<div class="row-xs-height"> <div class="p-l-20 p-t-50 p-b-40 p-r-20">
<div class="col-xs-height col-top"> <h3 class="no-margin p-b-5 text-white">MYR {{(Math.round((report.outgoingSum + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}</h3>
<div class="p-l-20 p-t-50 p-b-40 p-r-20"> </div>
<h3 class="no-margin p-b-5">MYR 500,123</h3> </div>
</div> </div>
</div> <div class="row-xs-height">
</div> <div class="col-xs-height col-bottom">
<div class="row-xs-height"> <div class="progress progress-small m-b-0">
<div class="col-xs-height col-bottom"> <div class="progress-bar progress-bar-primary" style="width: 0"></div>
<div class="progress progress-small m-b-0"> </div>
<div class="progress-bar progress-bar-primary" style="width: 0"></div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> <div class="col d-none">
</div> <div class="card no-border bg-danger text-white widget-loader-bar m-b-10">
<div class="col"> <div class="container-xs-height full-height">
<div class="card no-border bg-danger text-white widget-loader-bar m-b-10"> <div class="row-xs-height">
<div class="container-xs-height full-height"> <div class="col-xs-height col-top">
<div class="row-xs-height"> <div class="card-header top-left top-right">
<div class="col-xs-height col-top"> <div class="card-title">
<div class="card-header top-left top-right"> <span class="font-montserrat fs-11 all-caps">Total Floating Amount</span>
<div class="card-title"> </div>
<span class="font-montserrat fs-11 all-caps">Total Floating Amount</span> </div>
</div> </div>
</div> </div>
</div> <div class="row-xs-height">
</div> <div class="col-xs-height col-top">
<div class="row-xs-height"> <div class="p-l-20 p-t-50 p-b-40 p-r-20">
<div class="col-xs-height col-top"> <h3 class="no-margin p-b-5 text-white">MYR 500,123</h3>
<div class="p-l-20 p-t-50 p-b-40 p-r-20"> </div>
<h3 class="no-margin p-b-5 text-white">MYR 500,123</h3> </div>
</div> </div>
</div> <div class="row-xs-height">
</div> <div class="col-xs-height col-bottom">
<div class="row-xs-height"> <div class="progress progress-small m-b-0">
<div class="col-xs-height col-bottom"> <div class="progress-bar progress-bar-primary" style="width: 0"></div>
<div class="progress progress-small m-b-0"> </div>
<div class="progress-bar progress-bar-primary" style="width: 0"></div> </div>
</div> </div>
</div> </div>
</div> </div>
@@ -133,7 +138,28 @@
import Chart from 'chart.js'; import Chart from 'chart.js';
export default { export default {
data(){
return {
section: 'walletStatsSection',
isLoading: false,
report: {
incomingSum: 0,
outgoingSum: 0,
walletSum: 0
}
}
},
computed: {
pendingQueue () {
return this.$store.getters.isInCompleteQueue(this.section);
},
},
watch: { watch: {
pendingQueue(inComplete){
if(inComplete){
this.fetchReport();
}
},
wallet_details: function() { wallet_details: function() {
const ctx = document.getElementById('wallets-chart'); const ctx = document.getElementById('wallets-chart');
var xValues = [100,200,300,400,500,600,700,800,900,1000]; var xValues = [100,200,300,400,500,600,700,800,900,1000];
@@ -172,6 +198,19 @@
}); });
} }
}, },
created(){
this.$store.dispatch('updateListQueue', {'name': this.section});
},
methods: {
fetchReport(){
this.isLoading = true;
this.submit(route('api.wallet.reports'), 'get', this.section, false, false)
},
successHandler(response){
this.isLoading = false;
this.report = response.payload.data;
}
},
mixins: [componentHandler] mixins: [componentHandler]
} }
routes/wallet.php
+2
View File
@@ -10,4 +10,6 @@ Route::group(['prefix' => 'wallets', 'namespace' => 'Wallets', 'as' => 'wallet.'
Route::post('/credit', 'CreditWalletController@credit')->name('credit'); // admin + Route::post('/credit', 'CreditWalletController@credit')->name('credit'); // admin +
Route::put('/{transaction_id}/update-status/{status}', 'UpdateStatusWalletController@updateStatus')->where('status', 'approve|reject')->name('approval'); Route::put('/{transaction_id}/update-status/{status}', 'UpdateStatusWalletController@updateStatus')->where('status', 'approve|reject')->name('approval');
Route::get('/reports', 'WalletReportController@walletsReport')->name('reports');
}); });