@php
    $subscribe = isSubscribe(auth()->user()->id);
    $imageCount = auth()->user()->image_count;
@endphp
@extends($activeTemplate . 'layouts.master')
@section('content')
    <!-- Start Dashboard -->
    <div class="body-wrapper">

        <div class="table-content">
            <div class="row g-4">
                <div class="col-xl-3 col-lg-4 col-md-6 col-12">
                    <div class="dash-card">
                        <a href="#" class="d-flex justify-content-between">
                            <div>
                                <div class="title">
                                    <p>@lang('Balance')</p>
                                </div>
                                <div class="content">
                                    <span class="text-uppercase">{{ $general->cur_sym }}{{ showAmount($mainBalance) }}</span>
                                </div>

                            </div>
                            <div class="icon1">
                                <i class="fas fa-wallet"></i>
                            </div>
                        </a>
                    </div>
                </div>

                <div class="col-xl-3 col-lg-4 col-md-6 col-12">
                    <div class="dash-card">
                        <a href="#" class="d-flex justify-content-between">
                            <div>
                                <div class="title">
                                    <p>@lang('Deposits')</p>
                                </div>
                                <div class="content">
                                    <span
                                        class="text-uppercase">{{ $general->cur_sym }}{{ showAmount($totalDeposits) }}</span>
                                </div>

                            </div>
                            <div class="icon1">
                                <i class="fas fa-money-bill"></i>
                            </div>
                        </a>
                    </div>
                </div>

                <div class="col-xl-3 col-lg-4 col-md-6 col-12">
                    <div class="dash-card">
                        <a href="#" class="d-flex justify-content-between">
                            <div>
                                <div class="title">
                                    <p>@lang('Withdrawals')</p>
                                </div>
                                <div class="content">
                                    <span
                                        class="text-uppercase">{{ $general->cur_sym }}{{ showAmount($totalWithdrawals) }}</span>
                                </div>

                            </div>
                            <div class="icon1">
                                <i class="fas fa-dollar-sign"></i>
                            </div>
                        </a>
                    </div>
                </div>
                <div class="col-xl-3 col-lg-4 col-md-6 col-12">
                    <div class="dash-card">
                        <a href="#" class="d-flex justify-content-between">
                            <div>
                                <div class="title">
                                    <p>@lang('Pending Deposits Count')</p>
                                </div>
                                <div class="content">
                                    <span class="text-uppercase">{{ $pendingDepositsCount }}</span>
                                </div>

                            </div>
                            <div class="icon1">
                                <i class="fas fa-pause-circle"></i>
                            </div>
                        </a>
                    </div>
                </div>

                <div class="col-xl-3 col-lg-4 col-md-6 col-12">
                    <div class="dash-card">
                        <a href="#" class="d-flex justify-content-between">
                            <div>
                                <div class="title">
                                    <p>@lang('Pending Withdrawals Count')</p>
                                </div>
                                <div class="content">
                                    <span class="text-uppercase">{{ $pendingWithdrawalsCount }}</span>
                                </div>

                            </div>
                            <div class="icon1">
                                <i class="far fa-pause-circle"></i>
                            </div>
                        </a>
                    </div>
                </div>

                <div class="col-xl-3 col-lg-4 col-md-6 col-12">
                    <div class="dash-card">
                        <a href="#" class="d-flex justify-content-between">
                            <div>
                                <div class="title">
                                    <p>@lang('Total Files')</p>
                                </div>
                                <div class="content">
                                    <span class="text-uppercase">{{ $totalFiles }}</span>
                                </div>

                            </div>
                            <div class="icon1">
                                <i class="fab fa-microsoft"></i>
                            </div>
                        </a>
                    </div>
                </div>

                <div class="col-xl-3 col-lg-4 col-md-6 col-12">
                    <div class="dash-card">
                        <a href="#" class="d-flex justify-content-between">
                            <div>
                                <div class="title">
                                    <p>@lang('Pending Files')</p>
                                </div>
                                <div class="content">
                                    <span class="text-uppercase">{{ $pendingFiles }}6</span>
                                </div>

                            </div>
                            <div class="icon1">
                                <i class="fab fa-unsplash"></i>
                            </div>
                        </a>
                    </div>
                </div>
                <div class="col-xl-3 col-lg-4 col-md-6 col-12">
                    <div class="dash-card">
                        <a href="#" class="d-flex justify-content-between">
                            <div>
                                <div class="title">
                                    <p>@lang('On Reviewing Files')</p>
                                </div>
                                <div class="content">
                                    <span class="text-uppercase">{{ $onReviewingFiles }}</span>
                                </div>

                            </div>
                            <div class="icon1">
                                <i class="fas fa-history"></i>
                            </div>
                        </a>
                    </div>
                </div>
                <div class="col-xl-3 col-lg-4 col-md-6 col-12">
                    <div class="dash-card">
                        <a href="#" class="d-flex justify-content-between">
                            <div>
                                <div class="title">
                                    <p>@lang('Published Files')</p>
                                </div>
                                <div class="content">
                                    <span class="text-uppercase">{{ $publishedFiles }}</span>
                                </div>

                            </div>
                            <div class="icon1">
                                <i class="fas fa-download"></i>
                            </div>
                        </a>
                    </div>
                </div>
                <div class="col-xl-3 col-lg-4 col-md-6 col-12">
                    <div class="dash-card">
                        <a href="#" class="d-flex justify-content-between">
                            <div>
                                <div class="title">
                                    <p>@lang('Rejected Files')</p>
                                </div>
                                <div class="content">
                                    <span class="text-uppercase">{{ $rejectedFiles }}</span>
                                </div>

                            </div>
                            <div class="icon1">
                                <i class="fas fa-times-circle"></i>
                            </div>
                        </a>
                    </div>
                </div>
                <div class="col-xl-3 col-lg-4 col-md-6 col-12">
                    <div class="dash-card">
                        <a href="#" class="d-flex justify-content-between">
                            <div>
                                <div class="title">
                                    <p>@lang('Photo Count')</p>
                                </div>
                                <div class="content">
                                    @if (isset($imageCount))
                                        <span class="text-uppercase">{{ $imageCount }}</span>
                                    @else
                                        <span class="text-uppercase">0</span>
                                    @endif
                                </div>

                            </div>
                            <div class="icon1">
                                <i class="fas fa-calculator"></i>
                            </div>
                        </a>
                    </div>
                </div>
                <div class="col-xl-3 col-lg-4 col-md-6 col-12">
                    <div class="dash-card">
                        <a href="#" class="d-flex justify-content-between">
                            <div>
                                <div class="title">
                                    <p>@lang('Plan Activation Status')</p>
                                </div>
                                <div class="content">
                                    @if (isset($subscribe))
                                        <p class="text--base">@lang('Activated')</p>
                                    @else
                                        <p class="text--danger">@lang('Deactivated')</p>
                                    @endif
                                </div>

                            </div>
                            <div class="icon1">
                                <i class="fas fa-check-circle"></i>
                            </div>
                        </a>
                    </div>
                </div>

            </div>

            <div class="row pe-0">
                <div class="col-12">
                    <div class="chart">
                        <div class="chart-bg">
                            <h5 class="card-title">@lang('Monthly Deposit & Withdraw Report') (@lang('This year'))</h5>
                            <div id="account-chart"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- End Dashboard -->
@endsection

@push('script-lib')
    <!-- apexcharts js -->
    <script src="{{ asset($activeTemplateTrue . 'js/apexcharts.min.js') }}"></script>
    <!-- wow js -->
    <script src="{{ asset($activeTemplateTrue . 'js/wow.min.js') }}"></script>
@endpush

@push('script')
    <script src="{{ asset('assets/admin/js/apexcharts.min.js') }}"></script>

    <script>
        "use strict";
        // [ account-chart ] start
        (function() {
            var options = {
                chart: {
                    type: 'area',
                    stacked: false,
                    height: '310px'
                },
                stroke: {
                    width: [0, 3],
                    curve: 'smooth'
                },
                plotOptions: {
                    bar: {
                        columnWidth: '50%'
                    }
                },
                colors: ['#{{ $color }}', '#{{ $color }}'],
                series: [{
                    name: '@lang('Withdrawals')',
                    type: 'column',
                    data: @json($withdrawalsChart['values'])
                }, {
                    name: '@lang('Deposits')',
                    type: 'area',
                    data: @json($depositsChart['values'])
                }],
                fill: {
                    opacity: [0.85, 1],
                },
                labels: @json($depositsChart['labels']),
                markers: {
                    size: 0
                },
                xaxis: {
                    type: 'text'
                },
                yaxis: {
                    min: 0
                },
                tooltip: {
                    shared: true,
                    intersect: false,
                    y: {
                        formatter: function(y) {
                            if (typeof y !== "undefined") {
                                return "$ " + y.toFixed(0);
                            }
                            return y;

                        }
                    }
                },
                legend: {
                    labels: {
                        useSeriesColors: true
                    },
                    markers: {
                        customHTML: [
                            function() {
                                return ''
                            },
                            function() {
                                return ''
                            }
                        ]
                    }
                }
            }
            var chart = new ApexCharts(
                document.querySelector("#account-chart"),
                options
            );
            chart.render();
        })();
    </script>
@endpush
