@extends('dashboard.components.main')
@section('content')
    <!-- ============================================================== -->
    <!-- Start right Content here -->
    <!-- ============================================================== -->
    <div class="main-content">
        <div class="page-content">
            <!-- start page title -->
            <div class="row">
                <div class="col-12">
                    <div class="page-title-box d-flex align-items-center justify-content-between">
                        <h4 class="page-title mb-0 font-size-18">@lang('reports.Clients_Sales_Order')</h4>

                        <div class="page-title-right">
                            <ol class="breadcrumb m-0">
                                <li class="breadcrumb-item active"> @lang('dashboard_clients.welcome_platform')</li>
                            </ol>
                        </div>
                    </div>
                </div>
            </div>
            <!-- end page title -->
            <!-- Totals Card -->
            <div class="card">
                <div class="card-body">
                    <div class="row">
                        <p class="text-uppercase font-weight-bold col-lg-4 font-size-18">
                            @lang('reports.customer_sales_order_sum')</p>
                        <p class="col-lg-2  text-center text-dark font-size-20" id="calculated_total">$1200</p>
                    </div>
                </div>
            </div>


            <!-- Filter card-->
            <form action="{{ route('dashboard.reports.client.customer_sales_order') }}">
                <div class="card">
                    <div class="card-body">
                        <h4 class="card-title mb-4">@lang('reports.filter') </h4>
                        <div class="row">


                            <div class="col-lg-3">
                                <div class="form-group">
                                    <label class="control-label">@lang('reports.date_from')</label>
                                    <div class="input-group">
                                        <input name="date_from" value="{{ request()->get('date_from') }}" type="date" class="form-control dateFrom" placeholder="mm/dd/yyyy">

                                    </div>
                                </div>
                            </div>

                            <div class="col-lg-3">
                                <div class="form-group">
                                    <label class="control-label">@lang('reports.date_to')</label>
                                    <div class="input-group">
                                        <input name="date_to" value="{{ request()->get('date_to') }}" type="date" class="form-control dateTo" placeholder="mm/dd/yyyy">

                                    </div>
                                </div>
                            </div>

                            <div class="col-lg-3">
                                <div class="form-group">
                                    <label class="control-label">@lang('dashboard_sales_expenses.customer')</label>
                                    <select class="form-control select2" name="client_id">
                                        <option value="{{ null }}">@lang('dashboard_sales_expenses.all_customers')</option>
                                        @foreach ($clients as $client)            
                                        <option value="{{ $client->id }}" @if(request()->get('client_id') == $client->id) selected @endif>{{ $client->first_name.' '.$client->middle_name .' '. $client->last_name}}</option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>

                            <div class="col-lg-12">
                                <div class="text-right">
                                    <button type="submit" class="btn btn-primary">@lang('reports.excute')</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

            </form>
            <div class="row">
                <div class="col-12">
                    <div class="card">
                        <div class="card-body">
                            <div class="d-flex flex-row justify-content-between">
                                <div class="">

                                    <h4 class="card-title">@lang('reports.Clients_Sales_Order')</h4>
                                    <p class="card-title-desc mb-2">@lang('reports.clients_sales_order')</p>

                                </div>

                            </div>

                            @if(request()->get('date_from') || request()->get('date_to'))
                            <p class="text-center font-size-16" style="width: 100%">
                                @lang('reports.from') <b class="">{{ request()->get('date_from') ?? '--' }}</b> @lang('reports.to') <b class="">{{ request()->get('date_to') ?? '--' }}</b>
                            </p>
                            @endif

                            <div class="row">
                                <div class="col-12">
                                    <div class="card">
                                        <div class="card-body">
                                            <table id="datatable-buttons" class="table table-striped table-bordered table-responsive nowrap"
                                                style="border-collapse: collapse; border-spacing: 0; width: 100%; min-height: 400px">
                                                <thead>
                                                    <tr>
                                                        <th style=" white-space: normal" data-priority="1">@lang('dashboard_sales_expenses.date')</th>
                                                        <th style=" white-space: normal" data-priority="3">@lang('dashboard_sales_expenses.movement_type')</th>
                                                        <th data-priority="1">@lang('dashboard_sales_expenses.number') </th>
                                                        <th data-priority="1">@lang('dashboard_sales_expenses.customer') </th>
                                                        {{-- <th style="; white-space: normal" data-priority="1">@lang('dashboard_sales_expenses.due_date') </th>
                                                        <th style="; white-space: normal" data-priority="1">@lang('dashboard_sales_expenses.balance') </th> --}}
                                                        <th style=" white-space: normal" data-priority="1">@lang('dashboard_sales_expenses.tax') </th>
                                                        <th style=" white-space: normal" data-priority="1">@lang('dashboard_sales_expenses.total_before_tax') </th>
                                                        <th style=" white-space: normal" data-priority="1">@lang('dashboard_sales_expenses.total_after_tax') </th>
                                                        <th style=" white-space: normal" data-priority="1">الاجمالي بدون خصم او ضريبة </th>
                                                        {{-- <th style="width: 100px; white-space: normal" data-priority="1">@lang('dashboard_sales_expenses.status') </th>
                                                        <th style="width: 200px; white-space: normal" data-priority="1">@lang('dashboard_sales_expenses.action')</th> --}}
                                                    </tr>
                                                </thead>
                                                <tbody>
                                                    @php $total = 0 @endphp
                                                    @foreach($invoices as $invoice)
                                                    @if($invoice['type'] == 'sales_order')
                                                    <tr  >
                                                        <th>{{ $invoice['date'] }}</span></th>
                                                        <td  style="width: 40px; white-space: normal">
                                                            @lang('dashboard_sales_expenses.'.$invoice['type'])
                                                        </td>
                                                        <td>{{ $invoice['number'] }}</td>
                                                        <td style="width: 100px; white-space: normal"><a href="{{ route('dashboard.clients.show',$invoice['client'])  }}">{{ $invoice['client']['name'] }}</a></td>
                                                        {{-- <td style="width: 100px; white-space: normal">{{ ($invoice['due_date']==null)?'':date('Y-m-d',strtotime($invoice['due_date'])) }}</td>
                                                        <td style="width: 50px; white-space: normal">{{ $invoice['balance_due'] }}</td> --}}
                                                        <td>{{ $invoice['taxes_total'] }}</td>
                                                        <td>{{ $invoice['balance_before_tax'] }}</td>
                                                        <td>{{ $invoice['invoice_total'] }}</td>
                                                        <td>{{ $invoice['balance_before_tax'] + $invoice['total_discount'] }}</td>
                                                        
                                                        @php $total +=  $invoice['balance_before_tax'] + $invoice['total_discount']  @endphp
                                                    </tr>
                                                    @endif
                                                    @endforeach
                                                </tbody>
                                                <input type="hidden" name="total" id="total_calculated" value="{{ $total }}">
                                            </table>
                                        </div>
                                    </div>
                                </div>
                                <!-- end col -->
                            </div>
                        </div>
                    </div>
                </div>
                <!-- end col -->
            </div>
            <!-- end row -->


            <div class="row">
                <div class="col-lg-12">
                    <div class="card">
                        <div class="card-body">
                            <div class="d-flex flex-row justify-content-center">
                                <button class="btn btn-success mx-2" onclick="printReportPage()">@lang('reports.Preview_and_Print')</button>
                                <a class="btn btn-success mx-2 popup-form" href="#sendReport">@lang('reports.Email')</a>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Send popup -->

                <div class="card mfp-hide mfp-popup-form mx-auto" style="max-width: 700px" id="sendReport">
                    <div class="card-body">
                        <h4 class="mt-0 mb-2">@lang('reports.Send_report')</h4>
                        <p class="card-title-desc">@lang('reports.Send_a_report_to_a_prefered_email')</p>

                        <form action="{{ route('dashboard.reports.client.customer_sales_order') }}" method="GET">
                            <div class="row d-flex flex-row align-items-center ml-4 my-2 justify-content-center">
                                <h5 class="control-label col-lg-2">@lang('reports.To')</h5>
                                <input required type="text" placeholder="@lang('reports.enter_email') " name="to"
                                    class="form-control col-lg-8">
                            </div>

                            <div class="row d-flex flex-row align-items-center ml-4 my-2 justify-content-center">
                                <h5 class="control-label col-lg-2">@lang('reports.CC')</h5>
                                <input type="text" placeholder="@lang('reports.enter_email') " name="cc"
                                    class="form-control col-lg-8">
                            </div>

                            <div class="row d-flex flex-row align-items-center ml-4 my-2 justify-content-center">
                                <h5 class="control-label col-lg-2">@lang('reports.Subject')</h5>
                                <input required type="text" placeholder="@lang('reports.enter_subject') " name="subject"
                                    class="form-control col-lg-8">
                            </div>

                            <div class="row d-flex flex-row align-items-center ml-4 my-2 justify-content-center">
                                <h5 class="control-label col-lg-2">@lang('reports.Body')</h5>
                                <textarea class="form-control col-lg-8" name="body" cols="30" rows="3"
                                    style="resize: none"></textarea>
                            </div>
                            <input name="date_from" hidden value="{{ request()->get('date_from') }}" type="date" class="form-control" placeholder="mm/dd/yyyy">
                            <input name="date_to" hidden  value="{{ request()->get('date_to') }}" type="date" class="form-control" placeholder="mm/dd/yyyy">
                            <input name="client_id" type="text" hidden value="{{ request()->get('client_id') }}">

                            <input type="hidden" name="total" id="total_calculated" value="{{ $total }}">


                            <div class="row">
                                <div class="col-lg-12  my-2 d-flex justify-content-end">
                                    <div class="text-right">
                                        <button type="submit" class="btn btn-success"> @lang('reports.Send')</button>
                                    </div>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>

        </div>
    @endsection


    @section('custom_script')
        <script>

$('#calculated_total').html($('#total_calculated').val());
// calculated_total

</script>
    @endsection