Skip to content

Commit

Permalink
Portal dashboard added date filter
Browse files Browse the repository at this point in the history
  • Loading branch information
cuneytsenturk committed Jun 4, 2021
1 parent a42429b commit 9432009
Show file tree
Hide file tree
Showing 3 changed files with 132 additions and 8 deletions.
29 changes: 24 additions & 5 deletions app/Http/Controllers/Portal/Dashboard.php
Original file line number Diff line number Diff line change
Expand Up @@ -4,12 +4,13 @@

use App\Models\Document\Document;
use App\Traits\Charts;
use App\Traits\DateTime;
use App\Utilities\Chartjs;
use Date;

class Dashboard
{
use Charts;
use Charts, DateTime;

/**
* Display a listing of the resource.
Expand All @@ -20,14 +21,25 @@ public function index()
{
$contact = user()->contact;

$invoices = Document::invoice()->accrued()->where('contact_id', $contact->id)->get();
$financial_start = $this->getFinancialStart()->format('Y-m-d');

$start = Date::parse(request('start', Date::today()->startOfYear()->format('Y-m-d')));
$end = Date::parse(request('end', Date::today()->endOfYear()->format('Y-m-d')));
// check and assign year start
if (($year_start = Date::today()->startOfYear()->format('Y-m-d')) !== $financial_start) {
$year_start = $financial_start;
}

$start = Date::parse(request('start_date', $year_start));
$end = Date::parse(request('end_date', Date::parse($year_start)->addYear(1)->subDays(1)->format('Y-m-d')));

//$invoices = Document::invoice()->accrued()->where('contact_id', $contact->id)->get();
$invoices = Document::invoice()->accrued()->whereBetween('due_at', [$start, $end])->where('contact_id', $contact->id)->get();

$start_month = $start->month;
$end_month = $end->month;

// look cashFlow widget
$end_month = $end->diffInMonths($start);
$start_month = 0;
// Monthly
$labels = [];

Expand Down Expand Up @@ -89,7 +101,14 @@ public function index()
])
->fill(false);

return view('portal.dashboard.index', compact('contact', 'invoices', 'totals', 'progress', 'chart'));
$date_picker_shortcuts = $this->getDatePickerShortcuts();

if (!request()->has('start_date')) {
request()->merge(['start_date' => $date_picker_shortcuts[trans('reports.this_year')]['start']]);
request()->merge(['end_date' => $date_picker_shortcuts[trans('reports.this_year')]['end']]);
}

return view('portal.dashboard.index', compact('contact', 'invoices', 'totals', 'progress', 'chart', 'date_picker_shortcuts'));
}

private function calculateAmounts($invoices, $start, $end)
Expand Down
37 changes: 34 additions & 3 deletions resources/assets/js/views/portal/dashboard.js
Original file line number Diff line number Diff line change
Expand Up @@ -12,20 +12,51 @@ import Vue from 'vue';
import DashboardPlugin from './../../plugins/dashboard-plugin';

import Global from './../../mixins/global';
import {getQueryVariable} from './../../plugins/functions';
import {DatePicker, Tooltip} from 'element-ui';

import {Tooltip} from 'element-ui';
Vue.use(DatePicker, Tooltip);

// plugin setup
Vue.use(DashboardPlugin, Tooltip);
Vue.use(DashboardPlugin, DatePicker, Tooltip);

const app = new Vue({
el: '#app',
el: '#main-body',

components: {
[DatePicker.name]: DatePicker,
[Tooltip.name]: Tooltip,
},

mixins: [
Global
],

data: function () {
return {
filter_date: [],
};
},

mounted() {
let start_date = getQueryVariable('start_date');

if (start_date) {
let end_date = getQueryVariable('end_date');

this.filter_date.push(start_date);
this.filter_date.push(end_date);
}
},

methods: {
// Global filter change date column
onChangeFilterDate() {
if (this.filter_date) {
window.location.href = url + '/portal?start_date=' + this.filter_date[0] + '&end_date=' + this.filter_date[1];
} else {
window.location.href = url + '/portal';
}
},
}
});
74 changes: 74 additions & 0 deletions resources/views/portal/dashboard/index.blade.php
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,71 @@

@section('title', trans_choice('general.dashboards', 1))

@section('new_button')
<!--Dashboard General Filter-->
<el-date-picker
v-model="filter_date"
type="daterange"
align="right"
unlink-panels
:format="'yyyy-MM-dd'"
value-format="yyyy-MM-dd"
@change="onChangeFilterDate"
range-separator=">>"
start-placeholder="{{ $date_picker_shortcuts[trans("reports.this_year")]["start"] }}"
end-placeholder="{{ $date_picker_shortcuts[trans("reports.this_year")]["end"] }}"
:picker-options="{
shortcuts: [
{
text: '{{ trans("reports.this_year") }}',
onClick(picker) {
const start = new Date('{{ $date_picker_shortcuts[trans("reports.this_year")]["start"] }}');
const end = new Date('{{ $date_picker_shortcuts[trans("reports.this_year")]["end"] }}');
picker.$emit('pick', [start, end]);
}
},
{
text: '{{ trans("reports.previous_year") }}',
onClick(picker) {
const start = new Date('{{ $date_picker_shortcuts[trans("reports.previous_year")]["start"] }}');
const end = new Date('{{ $date_picker_shortcuts[trans("reports.previous_year")]["end"] }}');
picker.$emit('pick', [start, end]);
}
},
{
text: '{{ trans("reports.this_quarter") }}',
onClick(picker) {
const start = new Date('{{ $date_picker_shortcuts[trans("reports.this_quarter")]["start"] }}');
const end = new Date('{{ $date_picker_shortcuts[trans("reports.this_quarter")]["end"] }}');
picker.$emit('pick', [start, end]);
}
},
{
text: '{{ trans("reports.previous_quarter") }}',
onClick(picker) {
const start = new Date('{{ $date_picker_shortcuts[trans("reports.previous_quarter")]["start"] }}');
const end = new Date('{{ $date_picker_shortcuts[trans("reports.previous_quarter")]["end"] }}');
picker.$emit('pick', [start, end]);
}
},
{
text: '{{ trans("reports.last_12_months") }}',
onClick(picker) {
const start = new Date('{{ $date_picker_shortcuts[trans("reports.last_12_months")]["start"] }}');
const end = new Date('{{ $date_picker_shortcuts[trans("reports.last_12_months")]["end"] }}');
picker.$emit('pick', [start, end]);
}
}
]
}">
</el-date-picker>
@endsection

@section('content')
<div class="row">
<div class="col-md-4">
Expand All @@ -12,20 +77,23 @@
<h5 class="text-uppercase text-white mb-0">{{ trans('general.paid') }}</h5>
<span class="font-weight-bold text-white mb-0">{{ $totals['paid'] }}</span>
</div>

<div class="col-auto">
<div class="icon icon-shape bg-white text-success rounded-circle shadow">
<i class="fa fa-money-bill"></i>
</div>
</div>
</div>
</div>

<div class="card-footer">
<div class="progress progress-xs mb-0">
<div class="progress-bar bg-success" role="progressbar" aria-valuenow="{{ $progress['paid'] }}" aria-valuemin="0" aria-valuemax="100" style="width: {{ $progress['paid'] }}%"></div>
</div>
</div>
</div>
</div>

<div class="col-md-4">
<div class="card bg-gradient-warning card-stats">
<div class="card-body">
Expand All @@ -34,20 +102,23 @@
<h5 class="text-uppercase text-white mb-0">{{ trans('general.unpaid') }}</h5>
<span class="font-weight-bold text-white mb-0">{{ $totals['unpaid'] }}</span>
</div>

<div class="col-auto">
<div class="icon icon-shape bg-white text-warning rounded-circle shadow">
<i class="fa fa-money-bill"></i>
</div>
</div>
</div>
</div>

<div class="card-footer">
<div class="progress progress-xs mb-0">
<div class="progress-bar bg-warning" role="progressbar" aria-valuenow="{{ $progress['unpaid'] }}" aria-valuemin="0" aria-valuemax="100" style="width: {{ $progress['unpaid'] }}%"></div>
</div>
</div>
</div>
</div>

<div class="col-md-4">
<div class="card bg-gradient-danger card-stats">
<div class="card-body">
Expand All @@ -56,20 +127,23 @@
<h5 class="text-uppercase text-white mb-0">{{ trans('general.overdue') }}</h5>
<span class="font-weight-bold text-white mb-0">{{ $totals['overdue'] }}</span>
</div>

<div class="col-auto">
<div class="icon icon-shape bg-white text-danger rounded-circle shadow">
<i class="fa fa-money-bill"></i>
</div>
</div>
</div>
</div>

<div class="card-footer">
<div class="progress progress-xs mb-0">
<div class="progress-bar bg-danger" role="progressbar" aria-valuenow="{{ $progress['overdue'] }}" aria-valuemin="0" aria-valuemax="100" style="width: {{ $progress['overdue'] }}%"></div>
</div>
</div>
</div>
</div>

<div class="col-md-12">
<div class="card">
<div class="card-header">
Expand Down

0 comments on commit 9432009

Please sign in to comment.