@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('dashboard_sales_expenses.show_suppliers')</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 -->


            <!-- Client name and balance -->
            <div class="row">

                <div class="col-xl-12">
                    <div class="card">
                        <div class="card-body">


                            <div class="form-group row mb-0">
                                <div class="col-sm-8 d-flex justify-content-center flex-column">

                                    <h2 class="text-dark text-center"><b> {{$supplier->first_name.' '.$supplier->last_name}}</b></h2>
                                    <form action="{{route('dashboard.suppliers.savenotes')}}" method="POST">
                                        @csrf
                                        <input type="hidden" name="id" value="{{$supplier->id}}">
                                    <textarea class="form-control mx-auto my-2 text-center" name="notes"
                                        style="resize: none; max-width:  80%; height: 70%" placeholder="Notes">{{$supplier->notes}}</textarea>
                                        <div class="d-flex flex-row justify-content-center align-items-center mt-2">
                                            <button class="btn btn-primary" type="submit">@lang('dashboard_sales_expenses.save_notes')</button>
                                        </div>
                                    </form>
                                </div>
                                <div class="col-sm-4" style="height: 100%">
                                    <p class="font-size-18 text-primary mb-3"><b>@lang('dashboard_sales_expenses.total_balance')</b></p>
                                    <div class="card-body" style="padding: 0 0 0 10px !important;">
                                        <h2 class="mt-1">{{$supplier->balance}}</h2>
                                        <div class="media">
                                            <div class="media-body">
                                                <div class="font-size-18 text-success"><b>@lang('dashboard_sales_expenses.open')</b></div>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="card-body mt-3" style="padding: 0 0 0 10px !important;">
                                        <h2 class="mt-1">{{$overDue}}$</h2>
                                        <div class="media">
                                            <div class="media-body">
                                                <div class="font-size-18 text-danger"><b>@lang('dashboard_sales_expenses.paid')</b></div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>

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

            <!-- Client Sales records -->

            <div class="row">
                <div class="col-12">
                    <div class="card">
                        <div class="card-body">


                            <h4 class="card-title">@lang('dashboard_sales_expenses.transactions') </h4>
                            <p class="card-title-desc">@lang('dashboard_sales_expenses.manage_transactions_for') {{$supplier->first_name.' '.$supplier->last_name}}</p>
                            <table id="datatable-buttons" class="table table-striped table-bordered dt-responsive nowrap"
                                style="border-collapse: collapse; border-spacing: 0; width: 100%;">
                                <thead>
                                    <tr>
                                        <th style=" width: 40px; white-space: normal" data-priority="1">
                                    @lang('dashboard_sales_expenses.date')</th>
                                    <th style="width: 40px; 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.account') </th>
                                    <th style="width: 40px; white-space: normal" data-priority="1">
                                        @lang('dashboard_sales_expenses.due_date') </th>
                                    <th style="width: 40px; white-space: normal" data-priority="1">
                                        @lang('dashboard_sales_expenses.balance') </th>
                                    <th style="width: 10px; white-space: normal" data-priority="1">
                                        @lang('dashboard_sales_expenses.tax') </th>
                                    <th style="width: 100px; white-space: normal" data-priority="1">
                                        @lang('dashboard_sales_expenses.total_before_tax') </th>
                                    <th style="width: 100px; white-space: normal" data-priority="1">
                                        @lang('dashboard_sales_expenses.total_after_tax')</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>
                                    @foreach ($trans as $tran)
                                    {{-- {{ dd($trans) }} --}}
                                    <tr>
                                        <th>{{$tran['date']}}</span></th>
                                        <td>@lang('dashboard_sales_expenses.'.$tran['type'])</td>
                                        <td>
                                            @if ($tran['type'] == 'expensed' || $tran['type'] == 'cheque' || $tran['type'] == 'transfer' || $tran['type'] == 'deposit'|| $tran['type'] == 'daily_journal'|| $tran['type'] == 'split')
                                            {{$tran['number']}}
                                            @else
                                        <a href="{{ route('dashboard.suppliers.invoices.show.products',['id'=>$tran['id'],'type'=>$tran['type']]) }}">{{$tran['number']}}</a>
                                            @endif
                                            </td>
                                            <td> - </td>
                                        <td>{{$tran['due_date']}}</td>
                                        <td>{{$tran['balance']}}</td>
                                        <td>{{$tran['tax']}}</td>
                                        <td>{{$tran['total_before_tax']}}</td>
                                        <td>{{$tran['total_after_tax']}}</td>
                                        <td class="bg-info text-white">
                                            {{@$tran['status']}}
                                        </td>
                                        <td>
                                           
                                            <div class="btn-group dropdown" role="group">
                                                <button id="btnGroupVerticalDrop1" type="button"
                                                    class="btn btn-primary dropdown-toggle" data-toggle="dropdown"
                                                    aria-haspopup="true" aria-expanded="false">
                                                    @lang('dashboard_sales_expenses.action') <i class="mdi mdi-chevron-down"></i>
                                                </button>
                                                <!-- BANK MOVE -->
                                                  @if ($tran['type'] == 'expensed' || $tran['type'] == 'cheque' || $tran['type'] == 'transfer' || $tran['type'] == 'deposit' || $tran['type'] == 'daily_journal'|| $tran['type'] == 'split')
                                                   <div class="dropdown-menu" aria-labelledby="btnGroupVerticalDrop1">
                                                    @if($tran['file'])  
                                                     <a class="dropdown-item"
                                                     href="{{ route('dashboard.banks.download.file',$tran['id']) }}">@lang('buttons.download')</a>
                                                    @endif
                                                    <a class="dropdown-item"
                                                    href="{{ route('dashboard.banks.print', $tran['id'])}}">@lang('dashboard_sales_expenses.print') </a>
                                                    <a class="dropdown-item"
                                                    href="{{ route('dashboard.banks.send.mail', $tran['id'])}}">@lang('dashboard_sales_expenses.send')</a> 
                                         
                                                   </div>
                                                   @else
                                                   
                                                <!-- END BANK MOVE -->

                                                <div class="dropdown-menu" aria-labelledby="btnGroupVerticalDrop1">

                                                    @if($tran['type'] != 'notice_debt' && $tran['type'] != 'pay_purchase_invoice' && $tran['type'] != 'supplier_advance_payment')
                                                    <a class="dropdown-item"
                                                    href="{{ route('dashboard.suppliers.invoices.show.products',['id'=>$tran['id'],'type'=>$tran['type']]) }}">@lang('dashboard_sales_expenses.show_products') </a>
                                                    @endif

                                                    @if($tran['file'])  
                                                     <a class="dropdown-item"
                                                      href="{{ route('dashboard.suppliers.download.file',['id'=>$tran['id'],'type'=>$tran['type']]) }}">@lang('buttons.download')</a>
                                                    @endif

                                                    <a class="dropdown-item"
                                                        href="{{ route('dashboard.suppliers.print', [$tran['id'],$tran['type']])}}">@lang('dashboard_sales_expenses.print')
                                                    </a>
                                                    <a class="dropdown-item"
                                                        href="{{ route('dashboard.suppliers.send.mail', [$tran['id'],$tran['type']])}}">@lang('dashboard_sales_expenses.send')
                                                    </a>
                                                    @if($tran['type'] == 'purchase_invoice')

                                                    @if($tran['status_id'] != 2 && $tran['status_id'] != 4)
                                                     <a class="dropdown-item"
                                                     href="{{route('dashboard.suppliers.refundsupplier',$tran['id'] )}}">@lang('dashboard_sales_expenses.refund')
                                                     </a>
                                                    @endif

                                                    @if ($tran['deposit'] == 0 && !$tran['is_refunded'])
                                                     <a class="dropdown-item"
                                                     href="{{route('dashboard.suppliers.invoices.edit',$tran['id'])}}">@lang('dashboard_clients.edit_invoice') </a> 
                                                    @endif

                                                  @endif

                                                  @if($tran['type'] == 'purchase_invoice' && $tran['status_id'] != 4)
                                                  <a class="dropdown-item"
                                                  href="{{route('dashboard.suppliers.invoices.pay',$tran['id'] )}}">@lang('dashboard_sales_expenses.pay_invoice')
                                                  </a>
                                                 @endif
                                                    @if (!$tran['is_refunded'])
                                                     @if ($tran['type'] == 'supplier_advance_payment' && ( $tran['total_after_tax'] != $tran['balance']))
                                         
                                                      @else 
                                                      <a class="dropdown-item"
                                                        href="{{ route('dashboard.suppliers.invoices.delete', ['id' => $tran['id'], 'type' => $tran['type']]) }}">@lang('buttons.delete')</a>
                                                     @endif
                                                    @else 
                                                     <a class="dropdown-item" onclick="alertRfundedInvoice()">@lang('buttons.delete')</a>
                                                    @endif
                                                    
                                                    @if ($tran['type'] == 'buy_order' && !$tran['converted'])
                                                    <a class="dropdown-item"
                                                        href="{{ route('dashboard.suppliers.invoices.convert', ['id' => $tran['id'], 'type' => $tran['type']]) }}">@lang('dashboard_sales_expenses.convert_to_invoice')</a>
                                                    @endif

                                                    @if ($tran['type'] == 'supplier_advance_payment')
                                                        @if ($tran['is_paid'])

                                                            <a class="dropdown-item popup-form"
                                                                href="#convertToInvoice{{ $tran['id'] }}">@lang('dashboard_sales_expenses.convert_to_invoice')</a>

                                                            <div class="card mfp-hide mfp-popup-form mx-auto"
                                                                style="max-width: 500px"
                                                                id="convertToInvoice{{ $tran['id'] }}">
                                                                <div class="card-body">
                                                                    <h4 class="mt-0 mb-2">
                                                                        @lang('dashboard_sales_expenses.convert_to_invoice')
                                                                    </h4>
                                                                    <p class="card-title-desc">
                                                                        @lang('dashboard_sales_expenses.convert_to_invoice')
                                                                    </p>

                                                                    <form
                                                                    action="{{ route('dashboard.suppliers.advance.payment.convert') }}"
                                                                    method="POST">
                                                                    @csrf
                                                                    <input type="hidden" name="invoice_id"
                                                                        value="{{ $tran['id'] }}">
                                                                    <div
                                                                        class="row d-flex flex-row align-items-center my-2 justify-content-start">
                                                                        <p class="control-label col-lg-4">
                                                                            @lang('dashboard_sales_expenses.invoice_number')
                                                                        </p>
                                                                        <select required
                                                                            class="form-control select2 col-lg-4"
                                                                            name="number"
                                                                            onchange="supplierInvoiceToBePaidChanged(this, {{  $all_invoices }})"
                                                                            style="width: 200px">
                                                                            <option disabled selected
                                                                                value="{{ null }}">
                                                                                @lang('dashboard_invoices.choose_invoice_number')
                                                                            </option>
                                                                            @foreach ($all_invoices as $invoice)
                                                                                @if ($invoice['movement_type'] == 'purchase_invoice')
                                                                                    <option
                                                                                        value="{{ $invoice['number'] }}">
                                                                                        {{ $invoice['number'] }}
                                                                                    </option>
                                                                                @endif
                                                                            @endforeach
                                                                        </select>
                                                                    </div>
                                                                    <div class="my-3">
                                                                        <p class="control-label col-lg-4 mb-1 px-0">@lang('dashboard_sales_expenses.amount_due')</p>
                                                                        <p class="col-lg-4 mb-1 px-0 text-dark font-weight-bold font-size-18 invoiceTotal">0</p>                         
                                                                        
                                                                    </div>
                                                                    
                                                                    <div class="row my-2">
                                                                        <p class="control-label col-lg-4">
                                                                            @lang('dashboard_sales_expenses.amount')
                                                                        </p>
                                                                        <input type="number" required
                                                                            min="0" max="99999999"
                                                                            step="any" class="form-control"
                                                                            value=""
                                                                            name="paid" style="width: 200px"
                                                                            placeholder="@lang('dashboard_sales_expenses.amount')">
                                                                    </div>
                                                                    <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-primary">@lang('dashboard_accountants_tree.Save')</button>

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

                                                        @else

                                                            <a class="dropdown-item popup-form" 
                                                            href="#payAdvancePayment{{ $tran['id'] }}"
                                                            >@lang('dashboard_sales_expenses.pay_advance_payment')</a>
                                                            <!-- Pay an advance payment -->
                                                            <div class="card mfp-hide mfp-popup-form mx-auto"
                                                                style="max-width: 500px"
                                                                id="payAdvancePayment{{ $tran['id'] }}">
                                                                
                                                        
                                                                <form action="{{ route('dashboard.suppliers.advance.payment.pay') }}"
                                                                    method="POST">
                                                                    @csrf
                                                                            <div class="card-body">
                                                                        <h4 class="mt-0 mb-2">
                                                                            @lang('dashboard_sales_expenses.pay_advance_payment')
                                                                        </h4>
                                                                        <p class="card-title-desc">
                                                                            @lang('dashboard_sales_expenses.pay_advance_payment')
                                                                        </p>


                                                                        <input type="hidden" name="invoice_id"
                                                                            value="{{ $tran['id'] }}">
                                                                        <div
                                                                            class="row d-flex flex-row align-items-center ml-4 my-2 justify-content-start">
                                                                            <p class="control-label col-lg-4">
                                                                                @lang('dashboard_sales_expenses.paid_from')
                                                                            </p>
                                                                            <select required
                                                                                class="form-control select2"
                                                                                style="width: 200px"
                                                                                name="account_id">
                                                                                <option selected value=""
                                                                                    disabled>
                                                                                    @lang('dashboard_accountants_tree.Select_account_type')
                                                                                </option>
                                                                                @foreach ($accounts as $account)
                                                                                    <option
                                                                                        value="{{ $account->id }}">
                                                                                        {{ $account->name }}
                                                                                    </option>
                                                                                @endforeach
                                                                            </select>
                                                                        </div>

                                                                        <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-primary">@lang('dashboard_accountants_tree.Save')</button>
                                                                                </div>
                                                                            </div>
                                                                        </div>

                                                                    </div>
                                                                </form>
                                                            </div>
                                                        @endif
                                                    @endif
                                                </div>
                                            @endif

                                        </td>

                                    </tr>
                                    @endforeach
                                </tbody>
                            </table>

                            <!-- Record Transaction Modal -->
                            <div class="card mfp-hide mfp-popup-form mx-auto" id="edittrans">
                                <div class="card-body">
                                    <h4 class="mt-0 mb-4">@lang('dashboard_clients.Action_on_transaction')</h4>
                                    <form>
                                        <div class="row">
                                            <div class="col-lg-6">
                                                <div class="form-group">
                                                    <label class="control-label">@lang('dashboard_clients.type')</label>
                                                    <select class="form-control select2">
                                                        <option>@lang('dashboard_clients.account_type')</option>
                                                        <optgroup label="Alaskan/Hawaiian Time Zone">
                                                            <option value="AK">credit card</option>
                                                            <option value="HI">@lang('dashboard_clients.else')
                                                            <option>
                                                        </optgroup>
                                                    </select>
                                                </div>
                                            </div>
                                            <div class="col-lg-6">
                                                <div class="form-group">
                                                    <label
                                                        class="control-label">@lang('dashboard_clients.department')</label>
                                                    <select class="form-control select2">
                                                        <option>@lang('dashboard_clients.choose_department')</option>
                                                        <optgroup label="Alaskan/Hawaiian Time Zone">
                                                            <option value="AK">@lang('dashboard_clients.department_1')
                                                            </option>
                                                            <option value="HI">@lang('dashboard_clients.department_2')
                                                            </option>
                                                        </optgroup>
                                                    </select>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="row">
                                            <div class="col-lg-12">
                                                <div class="form-group">
                                                    <label for="subject">@lang('dashboard_clients.tax_code')</label>
                                                    <select class="form-control select2">
                                                        <option>@lang('dashboard_clients.c_tax_code')</option>
                                                        <optgroup label="Alaskan/Hawaiian Time Zone">
                                                            <option value="AK">@lang('dashboard_clients.department_1')
                                                            </option>
                                                            <option value="HI">@lang('dashboard_clients.department_2')
                                                            </option>
                                                        </optgroup>
                                                    </select>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="row">
                                            <div class="col-lg-12">
                                                <div class="form-group">
                                                    <label for="subject">@lang('dashboard_clients.comparison') ( class )
                                                    </label>
                                                    <select class="form-control select2">
                                                        <option>@lang('dashboard_clients.choose_comparison')</option>
                                                        <optgroup label="Alaskan/Hawaiian Time Zone">
                                                            <option value="AK">@lang('dashboard_clients.department_1')
                                                            </option>
                                                            <option value="HI">@lang('dashboard_clients.department_2')
                                                            </option>
                                                        </optgroup>
                                                    </select>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="row">
                                            <div class="col-lg-12">
                                                <div class="form-group">
                                                    <label for="subject">@lang('dashboard_clients.add_location') </label>
                                                    <select class="form-control select2">
                                                        <option>@lang('dashboard_clients.add_location') </option>
                                                        <optgroup label="Alaskan/Hawaiian Time Zone">
                                                            <option value="AK">@lang('dashboard_clients.saudi')</option>
                                                            <option value="HI">@lang('dashboard_clients.egypt')</option>
                                                        </optgroup>
                                                    </select>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="row">
                                            <div class="col-lg-12">
                                                <div class="form-group">
                                                    <label
                                                        for="subject">@lang('dashboard_clients.explanatory_points')</label>
                                                    <textarea class="form-control" id="subject" rows="3"></textarea>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-lg-6">
                                            <div class="form-group">
                                                <label class="control-label">@lang('dashboard_clients.upload_file')</label>
                                                <div class="custom-file">
                                                    <input type="file" class="custom-file-input" id="customFile">
                                                    <label class="custom-file-label"
                                                        for="customFile">@lang('dashboard_clients.choose_file')</label>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="row">
                                            <div class="col-lg-12">
                                                <div class="text-right">
                                                    <button type="submit"
                                                        class="btn btn-primary">@lang('dashboard_clients.execution')</button>
                                                </div>
                                            </div>
                                        </div>
                                    </form>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- end col -->
            </div>

            <div class="card py-3">

            <div class="d-flex justify-content-center my-2">
                <a type="button" class="btn btn-success popup-form" href="#createStatement">@lang('dashboard_sales_expenses.create_statement')</a>
            </div>
        </div>

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

                <form action="{{ route('dashboard.suppliers.createstatement') }}" method="POST">
                  @csrf
                  <input type="hidden" name="id" value="{{$supplier->id}}">
                    <div class="row d-flex flex-row align-items-center ml-4 my-2 justify-content-center">
                        <h5 class="control-label col-lg-4">@lang('dashboard_sales_expenses.statement_date')</h5>
                        <input type="date" name="statement_date" class="form-control col-lg-6">
                    </div>

                    <div class="row d-flex flex-row align-items-center ml-4 my-2 justify-content-center">
                        <h5 class="control-label col-lg-4">@lang('dashboard_sales_expenses.start_date')</h5>
                        <input type="date" name="start_date" class="form-control col-lg-6">
                    </div>

                    <div class="row d-flex flex-row align-items-center ml-4 my-2 justify-content-center">
                        <h5 class="control-label col-lg-4">@lang('dashboard_sales_expenses.end_date')</h5>
                        <input type="date" name="end_date" class="form-control col-lg-6">
                    </div>

                    <!-- Table -->
                    <table class="table table-striped table-bordered mx-auto text-center my-4">
                        <thead>
                            <tr>
                                <th scope="col" class="text-dark"><b>@lang('dashboard_sales_expenses.client_name')</b></th>
                                <th scope="col" class="text-dark"><b>@lang('dashboard_sales_expenses.client_email')</b></th>
                                <th scope="col" class="text-dark"><b>@lang('dashboard_sales_expenses.balance')</b></th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td  class="text-dark"><b>{{$supplier->first_name.' '.$supplier->last_name}}</b></td>
                                <td  class="text-dark"><input type="email" name="email" class="form-control" placeholder="@lang('dashboard_sales_expenses.client_email')"></td>
                                <td  class="text-dark"><b>{{$supplier->balance}}</b></td>
                            </tr>
                        </tbody>
                    </table>
                    <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-primary">@lang('reports.excute')</button>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
        </div>


        <!-- End Page-content -->
    @endsection

    @section('custom_script')
    <script>
     
    function alertRfundedInvoice(){
        alert('This is a refunded invoice, please delete all refunds of this invoice first')
    }
    function supplierInvoiceToBePaidChanged(invoicesDropdown, allInvoices){
        console.log(allInvoices);
        let selectedInvoiceNumber = $(invoicesDropdown).val()
            let selectedInvoice = allInvoices.find(x=>x.number == selectedInvoiceNumber)
            $(invoicesDropdown).parent().parent().find('.invoiceTotal').text(selectedInvoice.balance_due)

    }

    </script>
@endsection