@extends('layouts.adminapp')

@section('content')
<style>
    .hiddenRow {
    padding: 0 !important;
}
</style>
   {{-- Subscription Payment Report --}}
   <x-app-flash />

   <h1 class="h3 mb-2 text-gray-800">{{ __('lng.SubscriptionPaymentReport') }}</h1>

   {{-- <div class="card shadow mb-4">
      <div class="container">
         <div class="row py-3">
            <div class="col-sm-6 form-group">
               <label for="txtName">{{ __('lng.SearchByAuthority/Nickname/Contact') }}</label>
               <input type="text"  class="form-control" name="searchdeatils"
                  id="txtSearchDetails" />
            </div>
         </div>
      </div>
   </div> --}}

   <!-- DataTales Example -->
   <div class="card shadow mb-4">
      <div class="card-header py-3 d-flex flex-row align-items-center justify-content-between">
         <h6 class="m-0 font-weight-bold text-primary">{{ __('lng.PaymentReport') }}</h6>
         <div class="input-group w-25  input-search">
            <input type="text" id="Author" oninput="Search(this.value)" value="{{$SerachValue}}" class="form-control bg-light border-1 small" placeholder="{{ __('lng.SearchForHose') }}"
               aria-label="Search" aria-describedby="basic-addon2" >
            <div class="input-group-append">
               <button class="btn btn-primary" type="button">
                  <i class="mdi mdi-magnify fa-sm"></i>
               </button>
            </div>
         </div>
      </div>
      <div id="result-tbl">
          @if ($SearchResult)
              @php echo $SearchResult @endphp
          @else
      <div class="card-body">
         <div class="table-responsive">
            <div class="panel panel-default">
               <div class="panel-body table-responsive">
                  <table class="table  table-bordered">
                     <thead>
                        <tr>
                           <th>{{ __('lng.Action') }}</th>
                           <th>{{ __('lng.HouseName') }}</th>
                           <th>{{ __('lng.RegisterNumber') }}</th>
                           <th>{{ __('lng.Authority') }}</th>
                           <th>{{ __('lng.Contact') }}</th>
                           <th>{{ __('lng.SubscriptionAmount') }}</th>
                        </tr>
                     </thead>
                     <tbody >
                        @php $si=0; @endphp
                        @foreach ($Houses as $House)
                        <tr  >
                           <td>
                            <button onclick="OpenOrClose('open',this.id,{{$House->id}})" data-toggle="collapse" id="Detailbtn{{$House->id}}" data-target="#PayDetail{{$House->id}}" class="accordion-toggle btn btn-info btn-icon-split" >
                              <span class="icon text-white-50" id="spanicon{{$House->id}}">
                                 <i class="mdi mdi-chevron-down"></i>
                             </span>
                             <span class="text" id="spantext{{$House->id}}">Open</span>
                            </button>
                            </td>
                           <td>{{ $House->name }}</td>
                           <td>{{ $House->registernumber }}</td>
                           @foreach ($House->members as $Member)
                              @if ($Member->member_relation_id == App\Extra\General\DBFixedValues::AUTHORITY)
                                 <td>{{ $Member->name }}</td>
                                 <td>{{ $Member->contact }}</td>
                              @endif
                           @endforeach
                           <td>@currency($House->house_subscription->subscriptionpackage->amount ?? '0')</td>
                        </tr>
                        <tr>
                           <td colspan="12" class="hiddenRow">
                              <div class="accordian-body collapse" id="PayDetail{{$House->id}}">
                                 <table class="table table-striped">
                                    <thead>
                                       <tr class="info">
                                          <th>{{ __('lng.Date') }}</th>
                                          <th>{{ __('lng.Amount') }}</th>
                                          <th>{{ __('lng.Head') }}</th>
                                       </tr>
                                    </thead>
                                    <tbody>
                                        @foreach ($House->subscriptions->where('isCancelled',0) as $PayHistory)
                                        @php $DTs =  date("F-d-Y",strtotime($PayHistory->date));@endphp
                                        <tr data-toggle="collapse" class="accordion-toggle" data-target="#demo10">
                                            <td> <a href="#">{{$DTs}}</a></td>
                                            <td>@currency($PayHistory->amount)</td>
                                            <td>{{$PayHistory->Head->title}}</td>
                                        </tr>
                                       @endforeach
                                       <tr>
                                          <td colspan="3" style="text-align: center">
                                             <form method="POST" action="{{ route('PaymentReportPrint') }}" enctype='multipart/form-data'>
                                                @csrf
                                                <input type="hidden" name="HouseID" value="{{$House->id}}">
                                                <button class=" btn btn-info btn-icon-split" type="submit" >
                                                <span class="icon text-white-50" id="spanicon{{$House->id}}">
                                                   <i class="mdi mdi-printer"></i>
                                                </span>
                                                <span class="text" id="spantext{{$House->id}}">{{ __('lng.Print') }}</span>
                                                </button>
                                             </form>
                                          </td>
                                       </tr>
                                    </tbody>
                                 </table>
                              </div>
                           </td>
                        </tr>
                        @endforeach
                     </tbody>
                  </table>
               </div>
         </div>
      </div>
   </div>
      <div class="card-footer" id="card-footer">

         <div class="table-responsive">
            {{ $Houses->links() }}
         </div>
      </div>
      @endif
  </div>

   <script>
      function Search(author) {
         document.getElementById('card-footer').style.display = "none";
         document.getElementById('Author').value = author;
         $.ajax({
            url: '{{ route('FindAuthor') }}',
            method: "get",
            data: {
               _token: '{{ csrf_token() }}',
               author: author
            },
            success: function(response) {
               document.getElementById('result-tbl').innerHTML = response;
            }
         });
      }

      function OpenOrClose(action,btnid,ID){
         if(action == 'open'){
         document.getElementById(btnid).setAttribute("class", "accordion-toggle btn btn-danger btn-icon-split");
         document.getElementById(btnid).setAttribute("onclick", "OpenOrClose('',this.id,"+ID+")");
         document.getElementById('spantext'+ID).innerHTML='Close';
         document.getElementById('spanicon'+ID).innerHTML='<i class="mdi mdi-chevron-up"></i>';
         }
         else{
         document.getElementById(btnid).setAttribute("class", "accordion-toggle btn btn-info btn-icon-split");
         document.getElementById(btnid).setAttribute("onclick", "OpenOrClose('open',this.id,"+ID+")");
         document.getElementById('spantext'+ID).innerHTML='Open';
         document.getElementById('spanicon'+ID).innerHTML='<i class="mdi mdi-chevron-down"></i>';

         }
         // $("#"+ID1).html("<span class='icon text-white-50'><i class='fas fa-plus'></i></span><span class='text'>Close</span>");
      }
   </script>

@endsection