@extends('layouts.app')

@section('content')
@include('flash::message')

<div class="container">
  <h3 class="m-4">تفاصيل الشقة ( {{$tblPropertyApartment->title}})</h3>
  <br>
  <!-- Nav tabs -->
  <ul class="nav nav-tabs">
    <li class="nav-item">
      <a class="nav-link active" data-toggle="tab" href="#apartment">معلومات الشقة</a>
    </li>
    <li class="nav-item">
      <a class="nav-link" data-toggle="tab" href="#pictures">  صور الشقة</a>
    </li>
    <li class="nav-item">
      <a class="nav-link" data-toggle="tab" href="#internalFacility">  المرافق الداخلية </a>
    </li>
    <li class="nav-item">
      <a class="nav-link" data-toggle="tab" href="#externalFacility">  المرافق الخارجية </a>
    </li>
    <li class=" nav-item">
            <a class="nav-link " href="#conditions" data-toggle="tab">شروط الإقامة </a>
        </li>
    <li class=" nav-item">
        <a class="nav-link " href="#rules" data-toggle="tab">القوانين</a>
    </li>
    <li class=" nav-item">
        <a class="nav-link " href="#policies" data-toggle="tab">السياسات</a>
    </li>
  </ul>




<div class="tab-content mt-4">
    <div id="apartment" class="container tab-pane  active">

    <table class="table table-striped">
        <tbody>
        <tr>
        <th scope="row">اسم الشقة</th>
        <td scope="row">{{ $tblPropertyApartment->title }}</td>

        </tr>
        <tr>
        <th scope="row">الرمز الخاص</th>
        <td scope="row">{{  $tblPropertyApartment->unique_code }} </td>
        </tr>
        <tr>
        <th scope="row"> السعر باليوم</th>
        <td scope="row"> {{ $tblPropertyApartment->priceperday }} د.ل </td>
        </tr>
        <tr>
        <th scope="row">الوصف</th>
        <td scope="row"> {{ $tblPropertyApartment->description }} </td>
        </tr>
        <tr>
        <th scope="row"> عدد الضيوف</th>
        <td scope="row"> {{ $tblPropertyApartment->no_of_guest }}</td>
        </tr>
        <tr>
        <th scope="row"> إضافة من قِبل المستخدم </th>
        <td scope="row"><a href="{{ route('tblUsers.show',$tblPropertyApartment->createdBy->id) }}" ><span class='badge badge-primary'><i class='fa fa-user'></i> {{ $tblPropertyApartment->createdBy->full_name}} </span> <span class='badge badge-light'><i class='fa fa-phone'></i> {{ $tblPropertyApartment->createdBy->contact_no}} - {{ $tblPropertyApartment->createdBy->country_code}}</a></td>

        </tr>
        <tr>
        <th scope="row">رقم الشقة</th>
        <td scope="row">
        {{ $tblPropertyApartment->no_of_apartment }}
            </td>

        </tr>
        <tr>
        <th scope="row">الحالة </th>
        <td scope="row">
        @if($tblPropertyApartment->state_id == 1)
            <span class='badge badge-success'>Active</span>
        @elseif($tblPropertyApartment->state_id == 0)
            <span class='badge badge-danger'>Inactive</span>
        @endif
        </td>

        </tr>
        <tr>
        <th scope="row">وقت الدخول </th>
        <td scope="row"> {{ $tblPropertyApartment->check_in_time }}</td>
        </tr>
        <tr>
        <th scope="row"> وقت الخروج</th>
        <td scope="row">  {{ $tblPropertyApartment->check_out_time }}</td>
        </tr>
        <tr>
        <th scope="row"> وقت الإضافة</th>
        <td scope="row"> {{ $tblPropertyApartment->created_on }}</td>
        </tr>
        <tr>
        <th scope="row"> قيمة العربون</th>
        <td scope="row"> {{ $tblPropertyApartment->deposit_price }}</td>
        </tr>

        </tbody>
        </table>
    </div>
    <div id="pictures" class="tab-pane fade">
    <form id="bulk-delete-form" method="POST" action="{{ route('pictures.bulkDelete') }}">
    @csrf
    @method('DELETE')
    <a href="{{ route('tblPropertyPictures.addApartmentPicture',$tblPropertyApartment->id) }}" class="btn btn-primary ">إضافة صور + </a>
    <button type="submit" class="border border-none bg-none float-left" onclick="return confirm('هل أنت متأكد من الحذف؟')"><i class="fa fa-trash text-danger" title="delete image"></i> </button>
    <div class="row mt-4">
        @foreach($pictures as $picture)
        <div class="col-lg-2 col-md-4 col-xs-6 thumb ml-4 mt-4">
            <input type="checkbox" name="pictures[]" value="{{ $picture->id }}" class="form-check-input">
            <a href="{{ asset('storage/' . $picture->image_path) }}" target="_blank">
                <img src="{{ asset('storage/' . $picture->image_path) }}" style="width: 100%; height: 100px; object-fit: cover;" class="zoom img-fluid" alt="{{ $picture->alt_text }}">
            </a>
            @if($picture->is_publish == 1)
            <a href="{{ route('tblPropertyPictures.publication', $picture->id) }}" class='badge badge-success' >Published</a>
            @elseif($picture->is_publish == 0)
            <a href="{{ route('tblPropertyPictures.publication', $picture->id) }}" class='badge badge-danger'>Unpublished</a>

            @endif
        </div>
        @endforeach
    </div>
</form>
    </div>
    <div id="internalFacility" class="container tab-pane fade"><br>
    <form id="bulk-delete-form" method="POST" action="{{ route('ApartmentInternalFacility.bulkDelete') }}">
    @csrf
    @method('DELETE')
    <a href="{{ route('tblPropertyApartments.AddInternalFacility', $tblPropertyApartment->id) }}">
        <span><i class="fa fa-plus pb-4" aria-hidden="true"></i></span>
    </a>
    <button type="submit" class="border border-none bg-none float-left" onclick="return confirm('هل أنت متأكد من الحذف؟')">
        <i class="fa fa-trash text-danger" title="delete image"></i>
    </button>
    <ul class="list-group">
        @foreach($InternalFacilities as $internal)

        <li class="list-group-item">
            <input type="checkbox" name="internal[]" value="{{ $internal['id'] }}" class="form-check-input">
            <input  type="hidden"   name="id" value="{{$tblPropertyApartment->id}}">
            <h6 class="mr-4"> {{$internal['name']}}</h6>
        </li>

        @endforeach
        <ul>
</form>
 </div>
 <div class="tab-pane" id="externalFacility">
    <form id="bulk-delete-form" method="POST" action="{{ route('ApartmentExternalFacility.bulkDelete') }}">
    @csrf
    @method('DELETE')
    <a href="{{ route('tblPropertyApartments.AddExternalFacility', $tblPropertyApartment->id) }}">
        <span><i class="fa fa-plus pb-4" aria-hidden="true"></i></span>
    </a>
    <button type="submit" class="border border-none bg-none float-left" onclick="return confirm('هل أنت متأكد من الحذف؟')">
        <i class="fa fa-trash text-danger" title="delete image"></i>
    </button>
    <ul class="list-group">
        @foreach($ExternalFacilities as $external)
        <li class="list-group-item">
            <input type="checkbox" name="external[]" value="{{ $external['id'] }}" class="form-check-input">
            <input  type="hidden"   name="id" value="{{$tblPropertyApartment->id}}">
            <h6 class="mr-4"> {{$external['name']}}</h6>
        </li>
        @endforeach
        <ul>
</form>
    </div>
    <div class="tab-pane" id="conditions">
 <p class="font-italic text-black text-right">إضافة شرط للإقامة     </p>
  <form action="{{ route('ApartmentCondition.store') }}" method="POST" enctype="multipart/form-data">
    @csrf
    <div class="input-group mb-3 px-2 py-2 rounded-pill  shadow-sm ">
                <input  type="hidden"   name="id" value="{{$tblPropertyApartment->id}}">
                <input id="upload" type="text"  class="form-control border-0" name="title" placeholder=" إضافة شرط للإقامة   " >
    </div>
       <div class="row m-4">
       <button type="submit" class="col-12 btn btn-primary">حفــظ</button>
      </div>
  </form>
<br>
<form id="bulk-delete-form" method="POST" action="{{ route('ResidenceCondition.bulkDelete') }}">
    @csrf
    @method('DELETE')
    <div>
    <button type="submit" class="border border-none bg-none float-left" onclick="return confirm('هل أنت متأكد من الحذف؟')"><i class="fa fa-trash text-danger" title="delete image"></i> </button>
    </div>
    <br><br>
    <ul class="list-group">
    @foreach($ResidenceCondition as $condition)
        <li class="list-group-item">
            <input type="checkbox" name="title[]" value="{{ $condition['id'] }}" class="form-check-input">
           <span class="mr-4"> {{ $condition['title'] }}</span>
        </li>
        @endforeach
    </ul>
</form>
</div>

    <div class="tab-pane pb-3" id="rules">
        <p class="font-italic text-black text-right">إضافة قانون</p>
        <form action="{{ route('tblPropertyApartment.storeRule') }}" method="POST">
            @csrf
            <div class="input-group mb-3 px-2 py-2 rounded-pill  shadow-sm ">
                <input  type="hidden" name="id" value="{{$tblPropertyApartment->id}}">
                <input id="title" type="text" class="form-control border-0" name="title" placeholder=" إضافة قانون" >
            </div>
            <div class="row m-4">
                <button type="submit" class="col-12 btn btn-primary">حفــظ</button>
            </div>
        </form>
        <br>
        @if (count($activeRules) > 0)
            <form id="bulk-delete-form" method="POST" action="{{ route('ApartmentRule.bulkDelete') }}">
                @csrf
                @method('DELETE')
                <div class="d-flex justify-content-between">
                    <p class="font-italic text-black text-right">القوانين الفعالة</p>

                    <button type="submit" class="border border-none bg-none float-left" onclick="return confirm('هل أنت متأكد من الحذف؟')"><i class="fa fa-trash text-danger" title="delete image"></i> </button>
                </div>
                <br>
                <ul class="list-group">
                    @foreach($activeRules as $rule)
                        <li class="list-group-item">
                            <input type="checkbox" name="rules[]" value="{{ $rule['id'] }}" class="form-check-input" >
                        <span class="mr-4"> {{ $rule['title'] }}</span>
                        </li>
                    @endforeach
                </ul>
            </form>
        @endif

        @if (count($deletedRules) > 0)
            <form class="mt-5" id="deleted-rule-bulk-delete-form" method="POST" action="{{ route('ApartmentRule.bulkRestore') }}">
                @csrf
                <div class="d-flex justify-content-between">
                    <p class="font-italic text-black text-right">أرشيف القوانين</p>

                    <button type="submit" class="border border-none bg-none float-left" onclick="return confirm('هل أنت متأكد من الاسترجاع')"><i class="fas fa-trash-restore-alt text-success" title="delete image"></i> </button>
                </div>
                    <br>
                    <ul class="list-group">
                        @foreach($deletedRules as $rule)
                            <li class="list-group-item">
                                <input type="checkbox" name="rules[]" value="{{ $rule['id'] }}" class="form-check-input">
                                <span class="mr-4"> {{ $rule['title'] }}</span>
                            </li>
                        @endforeach
                    </ul>
            </form>
        @endif
    </div>

    <div class="tab-pane pb-3" id="policies">
        <p class="font-italic text-black text-right">إضافة سياسة</p>
        <form action="{{ route('tblPropertyApartment.storePolicy') }}" method="POST">
            @csrf
            <div class="input-group mb-3 px-2 py-2 rounded-pill  shadow-sm ">
                <input  type="hidden" name="id" value="{{$tblPropertyApartment->id}}">
                <input id="title" type="text" class="form-control border-0" name="title" placeholder=" إضافة سياسة جديدة" >
            </div>
            <div class="row m-4">
                <button type="submit" class="col-12 btn btn-primary">حفــظ</button>
            </div>
        </form>
        <br>
        @if (count($activePolicies) > 0)
            <form id="bulk-delete-form" method="POST" action="{{ route('ApartmentPolicy.bulkDelete') }}">
                @csrf
                @method('DELETE')
                <div class="d-flex justify-content-between">
                    <p class="font-italic text-black text-right">السياسات الفعالة</p>

                    <button type="submit" class="border border-none bg-none float-left" onclick="return confirm('هل أنت متأكد من الحذف؟')"><i class="fa fa-trash text-danger" title="delete image"></i> </button>
                </div>
                <br>
                <ul class="list-group">
                    @foreach($activePolicies as $policy)
                        <li class="list-group-item">
                            <input type="checkbox" name="policies[]" value="{{ $policy['id'] }}" class="form-check-input" >
                        <span class="mr-4"> {{ $policy['title'] }}</span>
                        </li>
                    @endforeach
                </ul>
            </form>
        @endif

        @if (count($deletedPolicies) > 0)
            <form class="mt-5" id="deleted-policy-bulk-delete-form" method="POST" action="{{ route('ApartmentPolicy.bulkRestore') }}">
                @csrf
                <div class="d-flex justify-content-between">
                    <p class="font-italic text-black text-right">أرشيف السياسات</p>

                    <button type="submit" class="border border-none bg-none float-left" onclick="return confirm('هل أنت متأكد من الاسترجاع')"><i class="fas fa-trash-restore-alt text-success" title="delete image"></i> </button>
                </div>
                    <br>
                    <ul class="list-group">
                        @foreach($deletedPolicies as $policy)
                            <li class="list-group-item">
                                <input type="checkbox" name="policies[]" value="{{ $policy['id'] }}" class="form-check-input">
                                <span class="mr-4"> {{ $policy['title'] }}</span>
                            </li>
                        @endforeach
                    </ul>
            </form>
        @endif
    </div>

</div>

<script>
$(document).ready(function(){
  $(".nav-tabs a").click(function(){
    $(this).tab('show');
  });
});
</script>
<script src="https://cdn.jsdelivr.net/npm/jquery@3.7.1/dist/jquery.slim.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.bundle.min.js"></script>


  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
    @endsection