{{-- Extends layout --}}
@extends('layout.default')

{{-- Content --}}
@section('content')

    <div class="card card-custom">
        <div class="card-header flex-wrap border-0 pt-6 pb-0">
            <div class="card-title">
                <h3 class="card-label">Properties
                    <div class="text-muted pt-2 font-size-sm">This is a record of all properties of null house numbers.</div>
                </h3>
            </div>
         
        </div>

        <div class="card-body">

            <table class="table table-bordered table-hover display" id="propertyDatatable"  style="width:100%">
                <thead>
                    <tr>  
                        <th width="25%">Property Number</th>
                        <th width="5%"> Not Found</th>
                        <th width="25%">Address</th>
                        <th width="10%">Price</th>
                        <th width="15%">Type</th>
                        <th width="15%">Action</th>
                        <th width="5%">Comment</th>
                    </tr>
                </thead>
                <tbody>                
                </tbody>
            </table>
        </div>
    </div>

<!-- Add  comment modal  -->
<div class="modal fade" id="commentModal" tabindex="-1" role="dialog" aria-labelledby="commentModal" aria-hidden="true">
    <div class="modal-dialog modal-md" role="document">
        <form method="post" novalidate="novalidate" class="form" id="addComment" name="addComment">
            {{csrf_field()}}
            <input type="hidden" value="" name="property" id="property">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalCenterTitle">Add Comment</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">                    
                    <div class="form-group row">                           
                        <div class="col-lg-12 col-md-12 col-sm-12">
                            <textarea class="form-control" name="comment" id="comment" placeholder="Comment" ></textarea>                            
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                    <button type="submit" id="submitComment" class="btn btn-primary">Save changes</button>
                </div>
            </div>
        </form>
    </div>
</div>
<!-- comment modal  -->

<!-- Filter modal start  --> 
    <div class="modal fade" id="propertyFilterModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalSizeLg" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered modal-lg" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel">Filters</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <i aria-hidden="true" class="ki ki-close"></i>
                    </button>
                </div>
                <div class="modal-body">
                    <form>
                        <div class="card-body">
                            <div class="form-group row">
                                <div class="col-lg-6">
                                    <label>Outcode :</label>
                                 
                                    <select name="postcode" id="filter_postcode_property" class="form-control"  >
                                            <option value="0">Full Outcode</option>
                                            @foreach($outcode as $code)
                                            <option value="{{$code->id}}">{{$code->outcode}}</option>
                                            @endforeach
                                    </select>
                                </div>
                                <div class="col-lg-6">
                                    <label>Platform:</label>
                                 
                                    <select name="flag" id="filter_platform" class="form-control" >
                                            <option value="-1">Select Platform</option>
                                            <option value="0">Rightmove</option>
                                            <option value="1">Zoopla</option>
                                        </select>
                                </div>
                            </div> 
                            <div class="form-group row">
                                 <div class="col-lg-6">
                                    <label>Type:</label>
                                    <select name="property_type" id="filter_property_type_property" class="form-control"  >
                                        <option value="0">Type</option>
                                        @foreach($property as $code)
                                       
                                        <option value="{{$code->property_type}}">{{ucfirst($code->property_type)}}</option>
                                        @endforeach
                                    </select>
                                </div>
                            </div> 
                            
                          
                        </div>
                    </form>
                       
                </div>      
                    <div class="modal-footer">
                        <button type="button" class="btn btn-light-primary font-weight-bold" data-dismiss="modal">Close</button>
                        <button type="button" class="btn btn-primary font-weight-bold filterPropertyWithoutAddress">Apply Filter</button>
                        <button type="button" class="btn btn-primary font-weight-bold" id="clear_filter">Clear</button>
                    </div>
                </div>
        </div>
    </div>
<!-- Filter modal end  -->   
@endsection

{{-- Styles Section --}}
@section('styles')
    <link href="{{ asset('plugins/custom/datatables/datatables.bundle.css') }}" rel="stylesheet" type="text/css"/>
    <link rel="stylesheet" href="{{asset('css/pages/style.css')}}">
    <style>
    .swal-wide{
        width : 70% !important;
    }
    </style>
@endsection


{{-- Scripts Section --}}
@section('scripts')
    {{-- vendors --}}
    <script src="{{ asset('plugins/custom/datatables/datatables.bundle.js') }}" type="text/javascript"></script>

    {{-- page scripts --}}
    <!-- <script src="{{ asset('js/pages/crud/datatables/basic/basic.js') }}" type="text/javascript"></script> -->
	<script src="{{ asset('js/app.js') }}" type="text/javascript"></script>
	<script src="{{ asset('js/developer/property.js') }}" type="text/javascript"></script>
	<!-- <script src="{{ asset('js/developer/formValidation.js') }}" type="text/javascript"></script> -->
    <script>
    $( document ).ready(function() {
         $('.date_from').datepicker({
            format: 'dd-mm-yyyy',
            todayHighlight:true,
         });
          $('.date_to').datepicker({
            format: 'dd-mm-yyyy',
            todayHighlight:true,
         });

    
     });
  
        jQuery(document).ready((function () {
            var url = '