@extends('layouts.organization_main')

@section('title','Dashoard')

@section('content')
<style>
    hr {
        margin-top: 1rem;
        width: 1rem;
        margin-bottom: 1rem;
        border: 0;
        border-top: 3px solid rgb(0 0 0);
    }
    .content-wrapper>.content {
        padding: 0 .5rem !important;
    }
</style>
<table class="table table-bordered bg-white">
    <tbody>
        <tr>
            <td>
                <div>
                    <small class="text-primary uppercase">Last Month</small>
                    <div class="row">
                        <div class="col-lg-3 cursor-pointer">
                            <div class="overdue-value-1">{{$prev['net_income']}}</div> 
                            <small class="float-left text-muted">Net Income</small>
                        </div> 
                        <div class="col-lg-3 cursor-pointer">
                            <div class="overdue-value-1">{{$prev['total_expenses']}}</div> 
                            <small class="float-left text-muted">Total Expenses</small>
                        </div> 
                        <div class="col-lg-3 cursor-pointer">
                            <div class="overdue-value-1">
                                @if($prev['top_staff_income'])
                                {{$prev['top_staff_income']}} ({{$prev['top_staff_name']}})
                                @else
                                0
                                @endif
                            </div>
                            <small class="float-left text-muted">Top Staff Income</small>
                        </div> 
                    </div>
                </div>
            </td>
        </tr>
        <tr>
            <td>
                <div>
                    <small class="text-primary uppercase">This Month</small>
                    <div class="row">
                        <div class="col-lg-3 cursor-pointer">
                            <div class="overdue-value-1">{{$current['net_income']}}</div> 
                            <small class="float-left text-muted">Net Income</small>
                        </div> 
                        <div class="col-lg-3 cursor-pointer">
                            <div class="overdue-value-1">{{$current['total_expenses']}}</div> 
                            <small class="float-left text-muted">Total Expenses</small>
                        </div> 
                        <div class="col-lg-3 cursor-pointer">
                            <div class="overdue-value-1">
                                @if($current['top_staff_income'])
                                {{$current['top_staff_income']}} ({{$current['top_staff_name']}})
                                @else
                                0
                                @endif
                            </div>
                            <small class="float-left text-muted">Top Staff Income</small>
                        </div> 
                    </div>
                </div>
            </td>
        </tr>
    </tbody>
</table>
    
<div class="card">
    <div class="card-header">
        <div class="row ml-4">
            <div class="col-md-10 row">
                <div class="col-md-3">
                    <input class="form-control form-control-sm" type="date" id="start_date" value="{{date('Y-m-d')}}">
                </div>
                <div class="col-md-1">
                    <hr>
                </div>
                <div class="col-md-3">
                    <input class="form-control form-control-sm" type="date" id="end_date" value="{{date('Y-m-d')}}">
                </div>
                <div class="col-md-3">
                    <select class="form-control form-control-sm" id="select_type">
                        <option value="DAILY" selected>DAILY</option>
                        <option value="WEEKLY">WEEKLY</option>
                        <option value="MONTHLY">MONTHLY</option>
                        <option value="YEARLY">YEARLY</option>
                    </select>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="dashboardChartsWrapper">
    <div class="r-e-i row">
        <div class="col-md-6">
            <div class="card top-border-cyan">
                <div class="card-header">
                    <h4 class="card-title">Cash Income</h4>
                </div>
                <div class="card-body" id="card_transaction_cash">
                </div>
                <div class="overlay display-none">
                    <i class="fa fa-refresh fa-spin"></i>
                </div>
            </div>
        </div>
        <div class="col-md-6">
            <div class="card top-border-cyan">
                <div class="card-header">
                    <h4 class="card-title">Transfer Income</h4>
                </div>
                <div class="card-body" id="card_transaction_transfer">
                </div>
                <div class="overlay display-none">
                    <i class="fa fa-refresh fa-spin"></i>
                </div>
            </div>
        </div>
        <div class="col-md-6">
            <div class="card top-border-cyan">
                <div class="card-header">
                    <h4 class="card-title">Expenses</h4>
                </div>
                <div class="card-body" id="card_purchase">
                </div>
                <div class="overlay display-none">
                    <i class="fa fa-refresh fa-spin"></i>
                </div>
            </div>
        </div>
        <div class="col-md-6">
            <div class="card top-border-cyan">
                <div class="card-header">
                    <h4 class="card-title">Petty Cash</h4>
                </div>
                <div class="card-body" id="card_petty">
                </div>
                <div class="overlay display-none">
                    <i class="fa fa-refresh fa-spin"></i>
                </div>
            </div>
        </div>
    </div>
</div>

<script src="{{asset('js/company_dashboard.js?v=1.3')}}"></script>
<script src="{{asset('js/setup_chart.js?v=1')}}"></script>
@endsection