@extends('layouts.admin')

@section('content-header', 'Dashboard')

@section('content')
    <div class="container-fluid">
        @if($display)
            <label>All Branch</label>
            <div class="row">
                <div class="col-lg-3 col-6">
                    <!-- small box -->
                    <div class="small-box bg-gradient-primary">
                        <div class="inner">
                            <h3>{{$grand_orders_count}}</h3>
                            <p>Orders Count</p>
                        </div>
                        <div class="icon">
                            <i class="ion ion-bag"></i>
                        </div>
                        <a href="{{route('branch_reports.index')}}" class="small-box-footer">More info <i class="ion-android-arrow-dropright-circle"></i></a>
                    </div>
                </div>
                <!-- ./col -->
                <div class="col-lg-3 col-6">
                    <!-- small box -->
                    <div class="small-box bg-gradient-primary">
                        <div class="inner">
                            <h3>{{ config('settings.currency_symbol') }} {{number_format($grand_total_weekly_sales, 2)}}</h3>
                            <p>Total Weekly Sales</p>
                        </div>
                        <div class="icon">
                            <i class="ion ion-stats-bars"></i>
                        </div>
                        <a href="{{ route('reports.index') }}" class="small-box-footer">More info <i class="ion-android-arrow-dropright-circle"></i></a>
                    </div>
                </div>
                <!-- ./col -->
                <div class="col-lg-3 col-6">
                    <!-- small box -->
                    <div class="small-box bg-gradient-primary">
                        <div class="inner">
                            <h3>{{ config('settings.currency_symbol') }} {{number_format($grand_total_daily_sales, 2)}}</h3>
                            <p>Total Daily Sales</p>
                        </div>
                        <div class="icon">
                            <i class="ion ion-pie-graph"></i>
                        </div>
                        <a href="{{ route('reports.live_transaction_report') }}" class="small-box-footer">More info <i class="ion-android-arrow-dropright-circle"></i></a>
                    </div>
                </div>
                <!-- ./col -->
            </div>

            <hr>

            <div class="row">
                <div class="col-lg-3 col-6">
                    <div class="form-group">
                        <label for="branch">Branch</label>
                        <select name="branch" class="form-control @error('branch') is-invalid @enderror" id="branch" onchange="set_dashboard_branch()">
                            @foreach ($branches as $key => $value)
                                @if (strtoupper($BID) == $value)
                                    <option value="{{ $value }}" selected>{{ $value }}</option>
                                @else
                                    <option value="{{ $value }}">{{ $value }}</option>
                                @endif
                            @endforeach
                        </select>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-3 col-6">
                    <!-- small box -->
                    <div class="small-box bg-info">
                        <div class="inner">
                            <h3>{{$orders_count}}</h3>
                            <p>Orders Count</p>
                        </div>
                        <div class="icon">
                            <i class="ion ion-bag"></i>
                        </div>
                        <a href="{{route('branch_reports.index')}}" class="small-box-footer">More info <i class="ion-android-arrow-dropright-circle"></i></a>
                    </div>
                </div>
                <!-- ./col -->
                <div class="col-lg-3 col-6">
                    <!-- small box -->
                    <div class="small-box bg-success">
                        <div class="inner">
                            <h3>{{config('settings.currency_symbol')}} {{number_format($total_weekly_sales, 2)}}</h3>
                            <p>Total Weekly Sales</p>
                        </div>
                        <div class="icon">
                            <i class="ion ion-stats-bars"></i>
                        </div>
                        <a href="{{route('reports.index')}}" class="small-box-footer">More info <i class="ion-android-arrow-dropright-circle"></i></a>
                    </div>
                </div>
                <!-- ./col -->
                <div class="col-lg-3 col-6">
                    <!-- small box -->
                    <div class="small-box bg-danger">
                        <div class="inner">
                            <h3>{{config('settings.currency_symbol')}} {{number_format($total_daily_sales, 2)}}</h3>
                            <p>Total Daily Sales</p>
                        </div>
                        <div class="icon">
                            <i class="ion ion-pie-graph"></i>
                        </div>
                        <a href="{{route('reports.live_transaction_report')}}" class="small-box-footer">More info <i class="ion-android-arrow-dropright-circle"></i></a>
                    </div>
                </div>
                <!-- ./col -->
            </div>

            <div class="row">
                <div class="col-lg-6 col-6">
                    <div class="card">
                        <div class="card-header ui-sortable-handle">
                            <h3 class="card-title">Journal Info</h3>
                            <div class="card-tools">
                                <button type="button" class="btn btn-tool" data-card-widget="remove">
                                    <i class="fa-solid fa-times"></i>
                                </button>
                            </div>
                        </div>
                        <div class="card-body">
                            <table class="table">
                                <thead>
                                <tr>
                                    <th>Type</th>
                                    <th>Total</th>
                                </tr>
                                </thead>
                                <tbody>
                                    @foreach ($info_dailies as $info_daily)
                                    <tr>
                                        <td>Error</td>
                                        <td>{{ $info_daily->cnt_error }}</td>
                                    </tr>
                                    <tr>
                                        <td>Price Override</td>
                                        <td>{{ $info_daily->cnt_po }}</td>
                                    </tr>
                                    <tr>
                                        <td>Return</td>
                                        <td>{{ $info_daily->cnt_rtn }}</td>
                                    </tr>
                                    <tr>
                                        <td>Void</td>
                                        <td>{{ $info_daily->cnt_void }}</td>
                                    </tr>
                                    @endforeach
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        @endif
    </div>
@endsection

@section('js')
<script>

    $.ajaxSetup({
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }
    });

    function set_dashboard_branch(){

        const branch = $('#branch').val();
        console.log(branch);

        $.ajax({
            url: "{{ route('home.set_dashboard_branch') }}",
            type:"POST",
            data:{
                branch:branch,
            },
            success:function(response){
                console.log(response);
                window.location.reload();
            },
            error: function(error) {
                console.log(error);
            }
        });
    }

</script>
@endsection