@extends('layouts.app_report')
@section('title', __('home.home'))

@section('content')

    <div class=" ">
        <div class="tw-px-5 tw-pt-3">
            {{-- <div class="sm:tw-flex sm:tw-items-center sm:tw-justify-between sm:tw-gap-12">
                <h1 class="tw-text-2xl tw-font-medium tw-tracking-tight tw-text-white">
                    {{ __('home.welcome_message', ['name' => Session::get('user.first_name')]) }}
                </h1>
            </div> --}}
                    <div class="sm:tw-flex sm:tw-items-center sm:tw-justify-between sm:tw-gap-12">


                        @if (auth()->user()->can('dashboard.data'))

                                <div class="tw-mt-2 sm:tw-w-1/3 md:tw-w-1/4  ">
                                    @if (count($all_locations) > 1)
                                        {!! Form::select('dashboard_location', $all_locations, null, [
                                            'class' => 'form-control select2',
                                            'placeholder' => __('lang_v1.select_location'),
                                            'id' => 'dashboard_location',
                                        ]) !!}
                                    @endif
                                </div>

                                <div class="tw-mt-2 sm:tw-w-1/3 md:tw-w-1/4 tw-text-right">

                                  <button type="button" id="dashboard_date_filter"
                                            class="tw-inline-flex tw-items-center tw-justify-center tw-w-full tw-gap-1 tw-px-3 tw-py-2 tw-text-sm tw-font-medium tw-text-gray-900 tw-transition-all tw-duration-200 tw-bg-white tw-rounded-lg sm:tw-w-auto hover:tw-bg-primary-50">
                                            <svg aria-hidden="true" class="tw-size-5" xmlns="http://www.w3.org/2000/svg"
                                                viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none"
                                                stroke-linecap="round" stroke-linejoin="round">
                                                <path stroke="none" d="M0 0h24v24H0z" fill="none" />
                                                <path
                                                    d="M4 7a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2v-12z" />
                                                <path d="M16 3v4" />
                                                <path d="M8 3v4" />
                                                <path d="M4 11h16" />
                                                <path d="M7 14h.013" />
                                                <path d="M10.01 14h.005" />
                                                <path d="M13.01 14h.005" />
                                                <path d="M16.015 14h.005" />
                                                <path d="M13.015 17h.005" />
                                                <path d="M7.01 17h.005" />
                                                <path d="M10.01 17h.005" />
                                            </svg>
                                            <span>
                                                {{ __('messages.filter_by_date') }}
                                            </span>
                                            <svg aria-hidden="true" class="tw-size-4" xmlns="http://www.w3.org/2000/svg"
                                                viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none"
                                                stroke-linecap="round" stroke-linejoin="round">
                                                <path stroke="none" d="M0 0h24v24H0z" fill="none" />
                                                <path d="M6 9l6 6l6 -6" />
                                            </svg>
                                        </button>

                                </div>

                        @endif
                    </div>
                  <div class="sm:tw-flex sm:tw-items-center sm:tw-justify-between sm:tw-gap-12">
                      <div class="col-sm-12 mt-5">
                          <div class="card h-100">
                              <div class="card-header">

                                  <div class="d-flex align-items-center card-subtitle">
                                      <div class="me-2">Total 42.5k Sales</div>
                                      <div class="d-flex align-items-center text-success">
                                          <p class="mb-0 fw-medium">+18%</p>
                                          <i class="ri-arrow-up-s-line ri-20px"></i>
                                      </div>
                                  </div>
                              </div>
                              <div class="card-body d-flex justify-content-between flex-wrap gap-4">
                                  <div class="d-flex align-items-center gap-3">
                                      <div class="avatar">
                                          <div class="avatar-initial bg-label-primary rounded">
                                              <i class="ri-money-dollar-box-line ri-24px"></i>
                                          </div>
                                      </div>
                                      <div class="card-info">
                                          <h5 class="mb-0 total_sell"></h5>
                                          <p class="mb-0">{{ __('home.total_sell') }}</p>
                                      </div>
                                  </div>
                                  <div class="d-flex align-items-center gap-3">
                                      <div class="avatar">
                                          <div class="avatar-initial bg-label-success rounded">
                                              <i class="ri-money-cny-box-fill ri-24px"></i>
                                          </div>
                                      </div>
                                      <div class="card-info">
                                          <h5 class="mb-0 net"></h5>
                                          <p class="mb-0">{{ __('lang_v1.total_paying') }}</p>
                                      </div>
                                  </div>
                                  <div class="d-flex align-items-center gap-3">
                                      <div class="avatar">
                                          <div class="avatar-initial bg-label-danger rounded">
                                              <i class="ri-close-circle-line ri-24px"></i>
                                          </div>
                                      </div>
                                      <div class="card-info">
                                          <h5 class="mb-0 invoice_due"> </h5>
                                          <p class="mb-0">   {{ __('home.invoice_due') }}</p>
                                      </div>
                                  </div>
                                  <div class="d-flex align-items-center gap-3">
                                      <div class="avatar">
                                          <div class="avatar-initial bg-label-info rounded">
                                              <i class="ri-arrow-left-right-line ri-24px"></i>
                                          </div>
                                      </div>
                                      <div class="card-info">
                                          <h5 class="mb-0 total_sell_return"></h5>

                                          <p class="mb-0">{{ __('lang_v1.total_sell_return') }}</p>
                                      </div>
                                  </div>
                              </div>
                              <div class="card-body d-flex justify-content-between flex-wrap gap-4">
                                  <div class="d-flex align-items-center gap-3">
                                      <div class="avatar">
                                          <div class="avatar-initial bg-label-primary rounded">
                                              <i class="ri-shopping-cart-2-fill ri-24px"></i>
                                          </div>
                                      </div>
                                      <div class="card-info">
                                          <h5 class="mb-0 total_purchase"></h5>
                                          <p class="mb-0">{{ __('home.total_purchase') }}</p>
                                      </div>
                                  </div>
                                  <div class="d-flex align-items-center gap-3">
                                      <div class="avatar">
                                          <div class="avatar-initial bg-label-danger rounded">
                                              <i class="ri-pie-chart-2-line ri-24px"></i>
                                          </div>
                                      </div>
                                      <div class="card-info">
                                          <h5 class="mb-0 purchase_due"></h5>
                                          <p class="mb-0">{{ __('home.purchase_due') }}</p>
                                      </div>
                                  </div>
                                  <div class="d-flex align-items-center gap-3">
                                      <div class="avatar">
                                          <div class="avatar-initial bg-label-info rounded">
                                              <i class="ri-arrow-left-right-line ri-24px"></i>
                                          </div>
                                      </div>
                                      <div class="card-info">
                                          <h5 class="mb-0 total_purchase_return"> </h5>
                                          <p class="mb-0">   {{ __('lang_v1.total_purchase_return') }}</p>
                                      </div>
                                  </div>
                                  <div class="d-flex align-items-center gap-3">
                                      <div class="avatar">
                                          <div class="avatar-initial bg-label-warning rounded">
                                              <i class="ri-exchange-box-fill ri-24px"></i>
                                          </div>
                                      </div>
                                      <div class="card-info">
                                          <h5 class="mb-0 total_expense"></h5>

                                          <p class="mb-0">{{ __('lang_v1.expense') }}</p>
                                      </div>
                                  </div>
                              </div>
                          </div>
                      </div>
                    </div>

        </div>
     </div>
    @if (auth()->user()->can('dashboard.data'))
        <div class="card mt-5">

                @if (auth()->user()->can('sell.view') || auth()->user()->can('direct_sell.view'))
                    @if (!empty($all_locations))
                        <div
                            class="card-title mb-0 pl-0 pl-sm-2 p-2">
                            <div class="tw-p-4 sm:tw-p-5">
                                <div class="tw-flex tw-items-center tw-gap-2.5">


                                    <h3 class="tw-font-bold tw-text-base lg:tw-text-xl">
                                        {{ __('home.sells_last_30_days') }}
                                    </h3>
                                </div>
                                <div class="tw-mt-5">
                                    <div
                                        class="tw-grid tw-w-full tw-h-100 tw-border tw-border-gray-200 tw-border-dashed tw-rounded-xl tw--50 ">
                                        <p class="tw-text-sm tw-italic tw-font-normal tw-text-gray-400">
                                            {!! $sells_chart_1->container() !!}
                                        </p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    @endif

                    {{-- @if (!empty($widgets['after_sales_last_30_days']))
                        @foreach ($widgets['after_sales_last_30_days'] as $widget)
                            {!! $widget !!}
                        @endforeach
                    @endif --}}
                    @if (!empty($all_locations))
                        <div
                            class="card-title mb-0 pl-0 pl-sm-2 p-2">
                            <div class="tw-p-4 sm:tw-p-5">
                                <div class="tw-flex tw-items-center tw-gap-2.5">

                                    <h3 class="tw-font-bold tw-text-base lg:tw-text-xl">
                                        {{ __('home.sells_current_fy') }}
                                    </h3>
                                </div>
                                <div class="tw-mt-5">
                                    <div
                                        class="card-body ">
                                        <p class="tw-text-sm tw-italic tw-font-normal tw-text-gray-400">
                                            {!! $sells_chart_2->container() !!}
                                        </p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    @endif
                @endif
                {{-- @if (!empty($widgets['after_sales_current_fy']))
                    @foreach ($widgets['after_sales_current_fy'] as $widget)
                        {!! $widget !!}
                    @endforeach
                @endif --}}


                {{-- @if (!empty($widgets['after_dashboard_reports']))
                    @foreach ($widgets['after_dashboard_reports'] as $widget)
                        {!! $widget !!}
                    @endforeach
                @endif --}}
         </div>
    @endif

@endsection


<div class="modal fade payment_modal" tabindex="-1" role="dialog" aria-labelledby="gridSystemModalLabel">
</div>
<div class="modal fade edit_pso_status_modal" tabindex="-1" role="dialog"></div>
<div class="modal fade edit_payment_modal" tabindex="-1" role="dialog" aria-labelledby="gridSystemModalLabel">
</div>

@section('css')
    <style>
        .select2-container {
            width: 100% !important;
        }
    </style>
@endsection

@section('javascript')
    <script src="{{ asset('js/home.js?v=' . $asset_v) }}"></script>
    <script src="{{ asset('js/payment.js?v=' . $asset_v) }}"></script>
    @includeIf('sales_order.common_js')
    @includeIf('purchase_order.common_js')
    @if (!empty($all_locations))
        {!! $sells_chart_1->script() !!}
        {!! $sells_chart_2->script() !!}
    @endif
    <script type="text/javascript">

    </script>

@endsection