Viewing file:  dashboard.blade.php (33.57 KB) -rw-r--r--
Select action/file-type:
 (+) |  (+) |  (+) | Code (+) | Session (+) |  (+) | SDB (+) |  (+) |  (+) |  (+) |  (+) |  (+) |
@extends('layouts.admin')
@section('title') Dashboard @endsection
@section('content')
<!-- Content Header (Page header) -->
<div class="content-header">
</div>
<!-- /.content-header -->
<!-- Main content -->
<div class="content">
<div class="container-fluid">
<div class="row">
{{-- <div class="col-lg-3 col-6">
<!-- small box -->
<div class="small-box">
<div class="inner d-flex align-items-center justify-content-between ">
<div class="user-icon">
<i class="fas fa-users"></i>
</div>
<div class="line-height">
<h4 class="numeric-title">{{$totalUsers}}</h4>
<span class="numeric-value">Total users</span>
</div>
</div>
</div>
</div>
<div class="col-lg-3 col-6">
<!-- small box -->
<div class="small-box">
<div class="inner d-flex align-items-center justify-content-between">
<div class="user-icon">
<i class="fas fa-money-bill"></i>
</div>
<div class="line-height">
<h4 class="numeric-title">{{formatNumberWithCurrSymbol($totalUsersBalance)}}</h4>
<span class="numeric-value">Total Users Balance</span>
</div>
</div>
</div>
</div>
<div class="col-lg-3 col-6">
<!-- small box -->
<div class="small-box">
<div class="inner d-flex align-items-center justify-content-between">
<div class="user-icon-scale-balance">
<i class="fas fa-dollar-sign"></i>
</div>
<div class="line-height">
@php
$refund = isset($transactionType['refund'])?$transactionType['refund']:0;
$credit = isset($transactionType['credit'])?$transactionType['credit']:0;
$debit = isset($transactionType['debit'])?$transactionType['debit']: 0;
$spent = ($debit - $credit) - $refund;
@endphp
<h4 class="numeric-title">{{formatNumberWithCurrSymbol($spent)}}</h4>
<span class="numeric-value">Total Spent Amount</span>
</div>
</div>
</div>
</div>
<!-- ./col -->
<div class="col-lg-3 col-6">
<!-- small box -->
<div class="small-box">
<div class="inner d-flex align-items-center justify-content-between">
<div class="user-icon-total-order-and-profit">
<i class="fas fa-cart-plus"></i>
</div>
<div class="line-height">
<h4 class="numeric-title">
{{formatNumberWithCurrSymbol(isset($transactionType['refund'])?$transactionType['refund']:
0)}}</h4>
<span class="numeric-value">Total Refunds Amount</span>
</div>
</div>
</div>
</div>
<div class="col-lg-3 col-6">
<!-- small box -->
<div class="small-box">
<div class="inner d-flex align-items-center justify-content-between">
<div class="user-icon-total-order-and-profit">
<i class="fas fa-calculator"></i>
</div>
<div class="line-height">
<h4 class="numeric-title">{{formatNumberWithCurrSymbol($todayProfit)}}</h4>
<span class="numeric-value">Total Profit</span>
</div>
</div>
</div>
</div>
<div class="col-lg-3 col-6">
<!-- small box -->
<div class="small-box">
<div class="inner d-flex align-items-center justify-content-between">
<div class="user-icon-ticket-and-profit">
<i class="fas fa-calculator"></i>
</div>
<div class="line-height">
<h4 class="numeric-title">
{{formatNumberWithCurrSymbol(isset($transactionType['deposit'])?$transactionType['deposit']:
0)}}</h4>
<span class="numeric-title">Total Deposit</span>
</div>
</div>
</div>
</div>
<div class="col-lg-3 col-6">
<!-- small box -->
<div class="small-box">
<div class="inner d-flex align-items-center justify-content-between">
<div class="user-icon-scale-balance">
<i class="fas fa-balance-scale"></i>
</div>
<div class="line-height">
<h4 class="numeric-title">
{{formatNumberWithCurrSymbol(isset($transactionType['add'])?$transactionType['add']:
0)}}</h4>
<span class="numeric-value">Total Add Balance</span>
</div>
</div>
</div>
</div>
<div class="col-lg-3 col-6">
<!-- small box -->
<div class="small-box">
<div class="inner d-flex align-items-center justify-content-between">
<div class="user-icon-ticket-and-profit">
<i class="fas fa-ticket-alt"></i>
</div>
<div class="line-height">
<h4 class="numeric-title">
{{formatNumberWithCurrSymbol(isset($transactionType['subtract'])?$transactionType['subtract']:
0)}}</h4>
<span class="numeric-value">Total Subtract Balance</span>
</div>
</div>
</div>
</div> --}}
<div class="col-lg-3 col-md-3 col-sm-6 col-6">
<div class="card small-widget">
<div class="card-body small-box">
<span class="card-title-small-box">@lang('Total users')</span>
<div class="total-sms">
<div class="count-sms">
{{$totalUsers}}
</div>
<div class="sms-img">
<i class="fas fa-users icon" aria-hidden="true"></i>
</div>
<ul class="bubbles">
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
</ul>
</div>
</div>
</div>
</div>
<div class="col-lg-3 col-md-3 col-sm-6 col-6">
<div class="card small-widget">
<div class="card-body small-box sms-received">
<span class="card-title-small-box">@lang('Total Users Balance')</span>
<div class="total-sms">
<div class="count-sms">
{{formatNumberWithCurrSymbol($totalUsersBalance)}}
</div>
<div class="sms-img">
<i class="fas fa-money-bill icon" aria-hidden="true"></i>
</div>
<ul class="bubbles">
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
</ul>
</div>
</div>
</div>
</div>
<div class="col-lg-3 col-md-3 col-sm-6 col-6">
<div class="card small-widget">
<div class="card-body small-box">
<span class="card-title-small-box">@lang('Total Spent Amount')</span>
<div class="total-sms">
@php
$refund = isset($transactionType['refund'])?$transactionType['refund']:0;
$credit = isset($transactionType['credit'])?$transactionType['credit']:0;
$debit = isset($transactionType['debit'])?$transactionType['debit']: 0;
$spent = ($debit - $credit) - $refund;
@endphp
<div class="count-sms">
{{formatNumberWithCurrSymbol($spent)}}
</div>
<div class="sms-img">
<i class="fas fa-dollar-sign icon" aria-hidden="true"></i>
</div>
<ul class="bubbles">
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
</ul>
</div>
</div>
</div>
</div>
<div class="col-lg-3 col-md-3 col-sm-6 col-6">
<div class="card small-widget">
<div class="card-body small-box sms-received">
<span class="card-title-small-box">@lang('Total Refunds Amount')</span>
<div class="total-sms">
<div class="count-sms">
{{formatNumberWithCurrSymbol(isset($transactionType['refund'])?$transactionType['refund']:0)}}
</div>
<div class="sms-img">
<i class="fas fa-cart-plus icon" aria-hidden="true"></i>
</div>
<ul class="bubbles">
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
</ul>
</div>
</div>
</div>
</div>
<div class="col-lg-3 col-md-3 col-sm-6 col-6">
<div class="card small-widget">
<div class="card-body small-box">
<span class="card-title-small-box">@lang('Total Profit')</span>
<div class="total-sms">
<div class="count-sms">
{{formatNumberWithCurrSymbol($todayProfit)}}
</div>
<div class="sms-img">
<i class="fas fa-calculator icon" aria-hidden="true"></i>
</div>
<ul class="bubbles">
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
</ul>
</div>
</div>
</div>
</div>
<div class="col-lg-3 col-md-3 col-sm-6 col-6">
<div class="card small-widget">
<div class="card-body small-box sms-received">
<span class="card-title-small-box">@lang('Total Deposit')</span>
<div class="total-sms">
<div class="count-sms">
{{formatNumberWithCurrSymbol(isset($transactionType['deposit'])?$transactionType['deposit']:
0)}}
</div>
<div class="sms-img">
<i class="fa fa-envelope icon" aria-hidden="true"></i>
</div>
<ul class="bubbles">
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
</ul>
</div>
</div>
</div>
</div>
<div class="col-lg-3 col-md-3 col-sm-6 col-6">
<div class="card small-widget">
<div class="card-body small-box">
<span class="card-title-small-box">@lang('Total Add Balance')</span>
<div class="total-sms">
<div class="count-sms">
{{formatNumberWithCurrSymbol(isset($transactionType['add'])?$transactionType['add']:
0)}} </div>
<div class="sms-img">
<i class="fas fa-balance-scale icon" aria-hidden="true"></i>
</div>
<ul class="bubbles">
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
</ul>
</div>
</div>
</div>
</div>
<div class="col-lg-3 col-md-3 col-sm-6 col-6">
<div class="card small-widget">
<div class="card-body small-box">
<span class="card-title-small-box">@lang('Total Subtract Balance')</span>
<div class="total-sms">
<div class="count-sms">
{{formatNumberWithCurrSymbol(isset($transactionType['subtract'])?$transactionType['subtract']:0)}}
</div>
<div class="sms-img">
<i class="fas fa-ticket-alt icon" aria-hidden="true"></i>
</div>
<ul class="bubbles">
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
</ul>
</div>
</div>
</div>
</div>
{{-- <div class="col-lg-3 col-md-3 col-sm-6 col-6">
<div class="card small-widget">
<div class="card-body small-box sms-received">
<span class="card-title-small-box">@lang('Total Subtract Balance')</span>
<div class="total-sms">
<div class="count-sms">
{{formatNumberWithCurrSymbol(isset($transactionType['subtract'])?$transactionType['subtract']:0)}}
<div class="sms-img">
<i class="fa fa-envelope icon" aria-hidden="true"></i>
</div>
<ul class="bubbles">
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
<li class="bubble"></li>
</ul>
</div>
</div>
</div>
</div>
</div> --}}
</div>
<div class="row">
<div class="col-sm-6">
<div class="card">
<div class="card-header border-0">
<h3 class="card-title xs-title">
<i class="fas fa-th mr-1"></i>
@lang('admin.orders')
</h3>
<div class="card-tools">
<button type="button" class="btn bg-color btn-sm collapse-btn" data-card-widget="collapse">
<i class="fas fa-minus"></i>
</button>
<button type="button" class="btn bg-color btn-sm collapse-btn" data-card-widget="remove">
<i class="fas fa-times"></i>
</button>
</div>
</div>
<div class="card-body">
<canvas class="chart admin-dashboard-canvas" id="order-chart"></canvas>
</div>
<!-- /.card-body -->
<!-- /.card-footer -->
</div>
<!-- /.card -->
</div>
<div class="col-sm-6">
<div class="card">
<div class="card-header border-0">
<h3 class="card-title xs-title">
<i class="fas fa-th mr-1"></i>
@lang('admin.deposits')
</h3>
<div class="card-tools">
<button type="button" class="btn bg-color btn-sm remove-btn" data-card-widget="collapse">
<i class="fas fa-minus"></i>
</button>
<button type="button" class="btn bg-color btn-sm remove-btn" data-card-widget="remove">
<i class="fas fa-times"></i>
</button>
</div>
</div>
<div class="card-body">
<canvas class="chart admin-dashboard-canvas" id="deposits-chart"></canvas>
</div>
<!-- /.card-body -->
<!-- /.card-footer -->
</div>
<!-- /.card -->
</div>
</div>
<div class="row">
<div class="col-lg-3 col-6">
<!-- small box -->
<div class="small-box bg-light">
<div class="inner d-flex align-items-center justify-content-between ">
<div class="user-icon">
<i class="fa fa-bars"></i>
</div>
<div class="line-height">
<h4 class="numeric-title">{{$totalOrders}}</h4>
<span class="numeric-value">Total Orders</span>
</div>
</div>
</div>
</div>
<!-- ./col -->
<div class="col-lg-3 col-6">
<!-- small box -->
<div class="small-box small-box-two bg-light">
<div class="inner d-flex align-items-center justify-content-between">
<div class="user-icon-two">
<i class="fa fa-check"></i>
</div>
<div class="line-height">
<h4 class="numeric-title">{{isset($orderStatus['completed'])?: 0}}</h4>
<span class="numeric-value"> Completed Orders</span>
</div>
</div>
</div>
</div>
<!-- ./col -->
<div class="col-lg-3 col-6">
<!-- small box -->
<div class="small-box bg-light">
<div class="inner d-flex align-items-center justify-content-between">
<div class="user-icon">
<i class="fas fa-plus-circle"></i>
</div>
<div class="line-height">
<h4 class="numeric-title">{{isset($orderStatus['processing'])?$orderStatus['processing']:0}}</h4>
<span class="numeric-value">Processing Orders</span>
</div>
</div>
</div>
</div>
<div class="col-lg-3 col-6">
<!-- small box -->
<div class="small-box small-box-two bg-light">
<div class="inner d-flex align-items-center justify-content-between">
<div class="user-icon-two">
<i class="fa fa-spinner"></i>
</div>
<div class="line-height">
<h4 class="numeric-title">{{isset($orderStatus['inprogress'])?$orderStatus['inprogress']:
0}}</h4>
<span class="numeric-value">In Progress Orders</span>
</div>
</div>
</div>
</div>
<div class="col-lg-3 col-6">
<!-- small box -->
<div class="small-box bg-light">
<div class="inner d-flex align-items-center justify-content-between">
<div class="user-icon">
<i class="far fa-clock"></i>
</div>
<div class="line-height">
<h4 class="numeric-title">{{isset($orderStatus['pending'])?$orderStatus['pending']: 0}}</h4>
<span class="numeric-value">Pending Orders</span>
</div>
</div>
</div>
</div>
<div class="col-lg-3 col-6">
<!-- small box -->
<div class="small-box small-box-two bg-light">
<div class="inner d-flex align-items-center justify-content-between">
<div class="user-icon-two">
<i class="fas fa-hourglass-end"></i>
</div>
<div class="line-height">
<h4 class="numeric-title">{{isset($orderStatus['partial'])?$orderStatus['partial']:0}}</h4>
<span class="numeric-value">Partial Orders</span>
</div>
</div>
</div>
</div>
<div class="col-lg-3 col-6">
<!-- small box -->
<div class="small-box bg-light">
<div class="inner d-flex align-items-center justify-content-between">
<div class="user-icon">
<i class='fas fa-times-circle'></i>
</div>
<div class="line-height">
<h4 class="numeric-title">{{isset($orderStatus['cancelled'])?$orderStatus['cancelled']: 0}}
</h4>
<span class="numeric-value">Canceled Orders</span>
</div>
</div>
</div>
</div>
<div class="col-lg-3 col-6">
<!-- small box -->
<div class="small-box small-box-two bg-light">
<div class="inner d-flex align-items-center justify-content-between">
<div class="user-icon-two">
<i class="fa fa-arrow-left" aria-hidden="true"></i>
</div>
<div class="line-height">
<h4 class="numeric-title">{{isset($orderStatus['rejected'])?$orderStatus['rejected']: 0}}
</h4>
<span class="numeric-value">Rejected Orders</span>
</div>
</div>
</div>
</div>
<!-- ./col -->
</div>
<div class="row">
<div class="col-12">
<div class="card">
<div class="card-header bg-primary">
<h3 class="card-title">Top Customers</h3>
</div>
<div class="card-body table-responsive p-0">
<table class="table table-hover text-nowrap">
<thead>
<tr>
<th>Customer Profile</th>
<th>Balance</th>
<th>Total Order</th>
<th>Created</th>
<th>Status</th>
</tr>
</thead>
<tbody>
@if($topCustomers)
@foreach($topCustomers as $customer)
<tr>
<td class="last-newest-user">
<div>
<p class="last-newest-user-name">{{$customer->customer->full_name}}</p>
<span>{{$customer->customer->email}}</span>
</div>
</td>
<td>{{formatNumberWithCurrSymbol($customer->customer->wallet->amount)}}</td>
<td>{{$customer->customer->orders->count()}}</td>
<td>{{$customer->customer->created_at}}</td>
@if($customer->customer->status == 'Active')
<td><span class="badge bg-success">Active</span></td>
@else
<td><span class="badge bg-danger">Inactive</span></td>
@endif
</tr>
@endforeach
@else
<tr>
<td colspan="5">no data available</td>
</tr>
@endif
</tbody>
</table>
</div>
</div>
</div>
</div>
<!-- /.row -->
</div><!-- /.container-fluid -->
</div>
<!-- /.content -->
@endsection
@section('extra-scripts')
<script src="{{asset('plugins/chart.js/Chart.min.js')}}"></script>
<script>
"use strict";
// Sales graph chart
var salesGraphChartCanvas = $('#order-chart').get(0).getContext('2d');
var sentCanvas = $('#deposits-chart').get(0).getContext('2d');
//$('#revenue-chart').get(0).getContext('2d');
var salesGraphChartData = {
labels: @json($months),
datasets: [
{
label: 'Orders',
fill: false,
borderWidth: 2,
lineTension: 0,
spanGaps: true,
borderColor: '#868a93',
pointRadius: 3,
pointHoverRadius: 7,
pointColor: '#868a93',
pointBackgroundColor: '#868a93',
data: @json($monthlyOrders)
}
]
}
var sentGraphChartData = {
labels: @json($months),
datasets: [
{
label: 'Deposits',
fill: false,
borderWidth: 2,
lineTension: 0,
spanGaps: true,
borderColor: '#868a93',
pointRadius: 3,
pointHoverRadius: 7,
pointColor: '#868a93',
pointBackgroundColor: '#868a93',
data: @json($monthlyDeposits)
}
]
}
var salesGraphChartOptions = {
maintainAspectRatio: false,
responsive: true,
legend: {
display: false,
},
scales: {
xAxes: [{
ticks: {
fontColor: '#868a93',
},
gridLines: {
display: false,
color: '#868a93',
drawBorder: false,
}
}],
yAxes: [{
ticks: {
stepSize: 5000,
fontColor: '#868a93',
},
gridLines: {
display: true,
color: '#868a93',
drawBorder: false,
}
}]
}
}
var sentGraphChartOptions = {
maintainAspectRatio: false,
responsive: true,
legend: {
display: false,
},
scales: {
xAxes: [{
ticks: {
fontColor: '#868a93',
},
gridLines: {
display: false,
color: 'black',
drawBorder: false,
}
}],
yAxes: [{
ticks: {
stepSize: 5000,
fontColor: '#868a93',
},
gridLines: {
display: true,
color: '#868a93',
drawBorder: false,
}
}]
}
};
var salesGraphChart = new Chart(salesGraphChartCanvas, {
type: 'line',
data: salesGraphChartData,
options: salesGraphChartOptions
}
);
var sentGraphChart = new Chart(sentCanvas, {
type: 'line',
data: sentGraphChartData,
options: sentGraphChartOptions
}
);
</script>
@endsection
|