@extends('layouts.app')
@section('title')Property Check @endsection
@section('content')

<link rel="stylesheet" href="{{asset('css/toggle.css')}}">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/bxslider/4.2.12/jquery.bxslider.css">
<script src="https://cdn.jsdelivr.net/bxslider/4.2.12/jquery.bxslider.min.js"></script>

<style href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"></style>
<style href="https://cdn.datatables.net/1.10.20/css/jquery.dataTables.min.css"></style>
<style href="https://cdn.datatables.net/buttons/1.6.1/css/buttons.dataTables.min.css"></style>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/pretty-checkbox@3.0/dist/pretty-checkbox.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/axios/0.19.2/axios.js"></script>
<link href="https://fonts.googleapis.com/css2?family=MuseoModerno:wght@500&display=swap" rel="stylesheet">

<link id="link-font" rel="stylesheet"
  integrity="sha384-xxzQGERXS00kBmZW/6qxqJPyxW3UR0BPsL4c8ILaIWXva5kFi7TxkIIaMiKtqV1Q" crossorigin="anonymous">

<style>
  /* HIDE RADIO */
  [type=radio] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
  }

  /* IMAGE STYLES */
  [type=radio]+span {
    cursor: pointer;
  }

  /* CHECKED STYLES */
  [type=radio]:checked+span {
    outline: 2px solid #f00;
  }

  .custom-modal-setting {
    display: flex;
  }

  /* Changes from here */
</style>      




<section class="content-header">
      <h1>
        Property Check 
      </h1>
      <ol class="breadcrumb">
        <li><a href="{{route('home')}}"><i class="fa fa-dashboard"></i> Home</a></li>
        <li class="active">Property Check</li>
      </ol>
</section>
<!----------------change by zunain------------------->
<section class="content" style= "min-height: 100px!important;">
	
    <div class="row">
	   <div class="col-md-6">
			<div class="box box-info">
				<div class="box-header with-border">
				   <h3 class="box-title">Enter Address</h3>
				</div>
				<div class="box-body">
					<div class="row">
						<div class="col-md-12">
						   @if (\Session::has('success'))
						   <div class="alert alert-success">
							  <a href="#" class="close" data-dismiss="alert" aria-label="close">×</a>
							  <ul>
								 <li>{!! \Session::get('success') !!}</li>
							  </ul>
						   </div>
						   @endif
						   <form class="form-inline" style="" action="{{route('property_check_by')}}" method="get">
							  <div id="search_data" style="" class="col-md-10">
								 <!--<label style="font-size: 16px; font-weight: 500;">Start Date </label>-->
								 <input type="text"
									value="" name="search_data" 
									style=" padding: 5px;
									width: 100%;" required/>
							  </div>
							  <div id="btn_p_ret"  class="col-md-2">
								 <input type="submit" id="retrieve_btn" name="submit" class="btn btn-primary"   value="Search">
							  </div>
						   </form>
						</div>
					</div>
				</div>
			</div>
		</div>
	   <div class="col-md-6">
		  <div class="box box-info">
			 <div class="box-header with-border">
				<h3 class="box-title">Enter Postcode</h3>
			 </div>
			 <div class="box-body">
				<div class="row">
				   <div class="col-md-12">
					  <form class="form-inline" style="" action="{{route('property_check_by_postal_code')}}" method="get">
						 <div id="search_data_zip" style="" class="col-md-6">
							<!--<label style="font-size: 16px; font-weight: 500;">Start Date </label>-->
							<input type="text"
							   value="" name="search_data_zip" 
							   style=" padding: 5px;
							   width: 100%;" required/>
						 </div>
						 <div id="btn_p_ret"  class="col-md-2">
							<input type="submit" id="retrieve_btn" name="submit_1" class="btn btn-primary"   value="Search">
						 </div>
					  </form>
				   </div>
				</div>
			 </div>
		  </div>
	   </div>
	</div>
</section>

<section class="content">
	<div class="box box-info">
				<div class="box-header with-border">
				  <h3 class="box-title">Search Results</h3>
				</div>
				<div class="box-body">
			<div class="box-body">
					<div class="row">
						<div class="col-md-12">
					<div class="box-body table-responsive no-padding">
				@if (\Session::has('success'))
				<div class="alert alert-success">
				  <a href="#" class="close" data-dismiss="alert" aria-label="close">×</a>
				  <ul>
					<li>{!! \Session::get('success') !!}</li>
				  </ul>
				</div>
				@endif

				  <table id="example1" class="table table-bordered table-striped display nowrap" style="width:100%">
					<thead>
					  <tr>
						@if(isset($tag))
						<th>#</th>
						<!-- <th><input type="checkbox" id="check_all" ></th> -->
						@endif
						<th>Id</th>
						<th>Name</th>
						<th>Address</th>
						<th>POST CODE</th>
						@if(Auth::id()<=3) <th>Sales By</th>
						  @endif
						  @if(session('Update_Jobs')!=NULL)
						  <th>Status</th>
						  @endif
						  <th>Details</th>
						  
					  </tr>
					</thead>
					<tbody>
					
					  @foreach($jobs as $job)
					  {{-- @if($job->hmo_id==0 || $job->hmo_id==null) --}}
					  <tr>
						@if(isset($tag))
						<th><input onclick="show_multi_btn()" type="checkbox" name="job_ids" id="job{{$job->id}}"
							value="{{$job->id}}"></th>
						@endif
						 </td>
						 
						<td>LCL00000</td>
						<td>{{$job->fore_name}}
						  {{$job->last_name}}</td>
						<td>{{$job->address}}</td>
						<td>{{$job->postal_code}}</td>
						@if(Auth::id()<=3) <td>{{$job->sales_by }}</td>
						  @endif
						  <!-- data-toggle="modal" data-target="#myModal" -->
						  @if(session('Update_Jobs')!=NULL)
						  <td>
							  @if($job->job_status=="surveyed")
							  Surveyed
							  @elseif($job->job_status=="booked")
							  Booked
							  @elseif($job->job_status=="insulated")
							  Insulated
							  @elseif($job->job_status=="submitted")
							  Submitted
							  @elseif($job->job_status=="canceled")
							  Canceled
							  @endif</td>
						  @endif
						  <td>
							<button class="btn btn-primary" onclick="ChooseContact({{$job->id}})"><i
								class="fa fa-info"></i></button>
							</td>
						 
					  </tr>
					  {{-- @endif --}}
					  @endforeach
					
					</tbody>
					<tfoot>
					  <tr>
						
					<th>Id</th>
						<th>Name</th>
						<th>Address</th>
						<th>POST CODE</th>
						@if(Auth::id()<=3) <th>Sales By</th>
						  @endif
						  @if(session('Update_Jobs')!=NULL)
						  <th>Status</th>
						  @endif
						  <th>Details</th>

						   
					  </tr>
					</tfoot>
				  </table>
		</div>
		</div>
		</div>
		</div>
	</div>
</section>

<!-- The Modal -->
<div id="myModal" class="modal fade" role="dialog">
  <div class="modal-dialog modal-dialog-centered" role="document">

    <!-- Modal content -->
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h4 class="modal-title">Job Details</h4>

      </div>
      <div class="modal-body demo">



        <div class="main-div">


          <div class="customer-div">
            <h5>CUSTOMER DETAILS</h5>
            <div class="main-content">

              <div class="content-div">
                <p>Title</p>
                <input id="title1" class="input-customer1  input-customer1-1" type="text" readonly>
              </div>
              <div class="content-div">
                <p>First Name</p>
                <input id="firstName1" class="input-customer2 input-customer1-2" value="" type="text" readonly>
              </div>
              <div class="content-div">
                <p>Last Name</p>
                <input id="lastName1" class="input-customer3 input-customer1-3" type="text" readonly>
              </div>



            </div>

            <div class="main-content main-content2">

              <div class="content-div customer-content-div">
                <p>DOB</p>
                <input id="dob1" class="input-customer1 input-customer-1" type="text" readonly>
              </div>
              <div class="content-div customer-content-div">
                <p class="p-contact contact-12">Contact No</p>
                <input id="contactNo1" class="input-customer2  input-customer-2" type="text" readonly>
              </div>
              <div class="content-div customer-content-div">
                <p>Postal Code</p>
                <input id="postalCode1" class="input-customer3  input-customer-3" type="text" readonly>
              </div>



            </div>
            <div class="main-content main-content-edit">

              <div class="content-div">
                <p>Email</p>
                <input id="email1" class="input-customer1 input-customer-email" type="text" readonly>
              </div>
              <div class="content-div">
                <p>Address</p>
                <input id="address1" class="input-customer2 input-customer-address" type="text" readonly>
              </div>




            </div>


          </div>
          <!--------------------------RENTAL DEtAILS---------------------------->




          <div class="rental-main">
            <h5>RENTAL DETAILS</h5>
            <div>

              <p>Rental Status</p>

              <input id="rentalStatus1" type="text" readonly>
              <i id="font-tick" class="far fa-check-circle"></i>
              <i id="font-cancel" class="far fa-window-close"></i>


            </div>

            <div class="main-content main-2232" style="padding-top: 10px ;display:none">

              <div class="content-div">
                <p class="p223">Landloard</p>
                <input id="landloard" class="input-customer1  input-customer1-1" type="text" readonly>
              </div>
              <div class="content-div">
                <p class="p223">Contact Name</p>
                <input id="contactName" class="input-customer2 input-customer1-2" value="" type="text" readonly>
              </div>
              <div class="content-div">
                <p class="p223">Phone no</p>
                <input id="phoneNumber1" class="input-customer3 input-customer1-3" type="text" readonly>
              </div>



            </div>

            <div class="main-content main-2121" style="padding-top: 10px;display:none">

              <div class="content-div">
                <p>Email</p>
                <input id="email12" class="input-customer1  input-customer1-1" type="text" readonly>
              </div>
              <div id="div-notes12" class="content-div">
                <p>Notes</p>
                {{-- <input id="notes12" class="input-customer2 input-customer1-2" value="" type="text" readonly> --}}
                <textarea id="notes12" class="input-customer2 input-customer1-2" rows="3" readonly></textarea>

              </div>




            </div>




          </div>

          <!--------------------Property Detail---------------------------------->


          <div class="customer-div property-div">
            <h5>PROPERTY DETAILS</h5>
            <div class="main-content">

              <div class="content-div ">
                <p>Heating Type</p>
                <input id="heatingType1" class="input-customer1  input-property-1" type="text" readonly>
              </div>
              <div class="content-div number-of-beds">
                <p>No of Beds</p>
                <input id="noOfBeds1" class="input-customer2 input-property-1" type="text" readonly>
              </div>
              <div class="content-div">
                <p>Property type</p>
                <input id="propertyType1" class="input-customer3 input-property-1" type="text" readonly>
              </div>



            </div>

            <div class="main-content main-content2">

              <div class="content-div content-property2">
                <p>Externals Walls</p>
                <input id="externalWalls1" class="input-customer1 input-customer-1 input-property2-1" type="text"
                  readonly>
              </div>
              <div class="content-div content-property2">
                <p>Booking Dates</p>
                <input id="bookingDates1" class="input-customer2 input-property2-1" type="text" readonly>
              </div>
              <div class="content-div content-property2">
                <p>Booking Time</p>
                <input id="bookingTime1" class="input-customer3  input-customer-3 input-property2-1" type="text"
                  readonly>
              </div>



            </div>
            <div class="main-content main-content-edit">

              <div class="content-div">
                <p>Survey Date</p>
                <input id="surveyDate1" class="input-customer1 input-customer-email" type="text" readonly>
              </div>
              <div class="content-div">
                <p>Notes</p>
                {{-- <input id="notes1" class="input-customer2 input-customer-address" type="text" readonly> --}}
                <textarea id="notes1" rows="3" class="input-customer2 input-customer-address"></textarea>

              </div>
				
            </div>
			
			<div class="main-content main-content2">

              
              <div class="content-div content-property2">
                <p>Insulated Date</p>
                <input id="insulatedDate1" class="input-customer2 input-property2-1" type="text" readonly style="width: 86px;">
              </div>
              <div class="content-div content-property2">
                <p>Submitted Date</p>
                <input id="submitDate1" class="input-customer3  input-customer-3 input-property2-1" type="text" readonly style="width: 86px;">
              </div>

             </div>
				

            <div style="display:flex;justify-content:start;flex-wrap:wrap">

              <label style="margin-top:10px; padding-left:5px;padding-right: 10px" id="funder-label"
                for="">Funder</label>
              <p style="margin-top:10px;" id="funder"></p>

            </div>


          </div>





        </div>
        <a id="download12" href=""> <button class="btn btn-primary" style="float: right;margin-right: 16px;
          margin-bottom: 10px;">Download Images</button></a>
      </div>
      <div class="modal-footer">
        <!----------------------cursol---------------------------->

        <div id="myCarousel" class="carousel slide col-md-12" data-ride="carousel">

          <!-- Wrapper for slides -->
          <div class='carousel-inner' style="" id="carousel_inner">

          </div>

          <!-- Left and right controls -->
          <a class="left carousel-control" href="#myCarousel" data-slide="prev">
            <span class="glyphicon glyphicon-chevron-left"></span>
            <span class="sr-only">Previous</span>
          </a>
          <a class="right carousel-control" href="#myCarousel" data-slide="next">
            <span class="glyphicon glyphicon-chevron-right"></span>
            <span class="sr-only">Next</span>
          </a>
        </div>



        <!------------------------------->

      </div>
    </div>

  </div>
</div>

<!-- The Status Modal -->
<div id="statusmodal" class="modal fade" role="dialog">
  <div class="modal-dialog modal-dialog-centered" role="document">

    <!-- Modal content -->
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h4 class="modal-title">Update Job Status</h4>

        <form id="statusform" action="{{route('update_job_status')}}">
          <select class="form-control" name="is_hmo_status" id="is_hmo_status">
            <option value="0">All</option>
            <option value="1">Individual</option>
          </select>
      </div>
      <div class="modal-body">
        <input type="hidden" id="statusid" name="id">
        <!-- radio -->
        <div class="form-group text-center  custom-modal-setting">
          <label>
            <div class="pretty p-switch" style="right:6%"> <input type="checkbox" name="job_status" id="surveyed"
                value="surveyed">
              <div class="state">
                <label></label>
              </div>





            </div> <span class="info-box-icon bg-gray"><i class="ion ion-clipboard"></i></span>
          </label>
          &nbsp
          <label>
            <div class="pretty p-switch" style="right:6%"><input type="checkbox" name="job_status" id="booked"
                value="booked">
              <div class="state">
                <label></label>
              </div>

            </div><span class="info-box-icon bg-orange"><i class="fa fa-bookmark"></i></span>

          </label>
          &nbsp
          <label>
            <div class="pretty p-switch" style="right:6%"><input type="checkbox" name="job_status" id="canceled"
                value="canceled">
              <div class="state">
                <label></label>
              </div>
            </div><span class="info-box-icon bg-red"><i class="fa fa-close"></i></span>

          </label>
          &nbsp
          <label>
            <div class="pretty p-switch" style="right:6%"> <input type="checkbox" name="job_status" id="insulated"
                value="insulated">
              <div class="state">
                <label></label>
              </div>


            </div> <span class="info-box-icon bg-green"><i class="ion ion-thermometer"></i></span>

          </label>
          &nbsp
          <label id="submitted2">
            <div class="pretty p-switch" style="right:6%"> <input type="checkbox" name="job_status" id="submitted"
                value="submitted">
              <div class="state">
                <label></label>
              </div>

            </div><span class="info-box-icon bg-blue"><i class="ion ion-checkmark"></i></span>

          </label>
        </div>
        <div class="form-group">
          <div class="input-group">
            <div class="input-group-addon">
              <i class="fa fa-calendar"></i>
            </div>
            <input type="date" class="form-control" name="date" required id="date">
          </div>
        </div>
        <div class="input-group">
          <div class="input-group-addon">
            <i class="fa fa-calendar"></i>
          </div>
          <input type="time" class="form-control" name="time" required id="time">
        </div>
      </div>
      <div class="modal-footer">
        <button class="btn btn-success" onclick="('#statusform').submit()">Update</button>
      </div>

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




<!-- The Status Modal -->
<div id="multistatusmodal" class="modal fade" role="dialog">
  <div class="modal-dialog modal-dialog-centered" role="document">

    <!-- Modal content -->
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h4 class="modal-title">Update Job Status</h4>
      </div>
      <form id="statusform" action="{{route('update_multi_job_status')}}">
        <div class="modal-body">
          <input type="hidden" id="jobids" name="job_ids[]">
          <!-- radio -->
          <div class="form-group text-center">
            <label>
              <div> <input type="checkbox" name="job_status" id="surveyed1" value="surveyed"> </div> <span
                class="info-box-icon bg-gray"><i class="ion ion-clipboard"></i></span>
            </label>
            &nbsp
            <label>
              <div><input type="checkbox" name="job_status" id="booked1" value="booked"> </div><span
                class="info-box-icon bg-orange"><i class="fa fa-bookmark"></i></span>

            </label>
            &nbsp
            <label>
              <div><input type="checkbox" name="job_status" id="canceled1" value="canceled"> </div><span
                class="info-box-icon bg-red"><i class="fa fa-close"></i></span>

            </label>
            &nbsp
            <label>
              <div> <input type="checkbox" name="job_status" id="insulated1" value="insulated"></div> <span
                class="info-box-icon bg-green"><i class="ion ion-thermometer"></i></span>

            </label>
            &nbsp
            <label>
              <div> <input type="checkbox" name="job_status" id="submitted1" value="submitted"></div><span
                class="info-box-icon bg-blue"><i class="ion ion-checkmark"></i></span>

            </label>
          </div>
          <div class="form-group">
            <div class="input-group">
              <div class="input-group-addon">
                <i class="fa fa-calendar"></i>
              </div>
              <input type="date" class="form-control" name="date" required id="date">
            </div>
          </div>
          <div class="input-group">
            <div class="input-group-addon">
              <i class="fa fa-calendar"></i>
            </div>
            <input type="time" class="form-control" name="time" required id="time">
          </div>
        </div>
        <div class="modal-footer">
          <button class="btn btn-success" onclick="('#statusform').submit()">Update</button>
        </div>
      </form>
    </div>
  </div>
</div>






<!-- <script src="https://code.jquery.com/jquery-3.3.1.js"></script>
<script src="https://cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.6.1/js/dataTables.buttons.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.6.1/js/buttons.flash.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/pdfmake.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/vfs_fonts.js"></script>
<script src="https://cdn.datatables.net/buttons/1.6.1/js/buttons.html5.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.6.1/js/buttons.print.min.js"></script>
<script src="https://cdn.datatables.net/1.10.20/js/dataTables.bootstrap.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.6.1/js/buttons.colVis.min.js"></script> -->
<!-- page script -->
<!-- Start code bt Qaisar -->
<script type="text/javascript">
  $(function(e){
  $('.selectall').click(function(){
    $('.selectbox').prop('checked',$(this).prop('checked'));

 
  });
 $('#deleteselected').click(function(e) {
   e.preventDefault();
   var allids=[];
   $(".selectbox:checked").each(function () {
     allids.push($(this).val());
     // console.log("jjd", allids);
   });
   // console.log("allids", allids);
   $.ajax({
     url:"{{route('delete_marked')}}",
     type:"get",
      dataType:"json",
     data:{
       ids:allids,
       _token:'{{csrf_token()}}',
     },
     success:function(data){
      //('#example1').DataTable().ajax.reload();
    location.reload();
     }

   });
 });

});

//--End code bt Qaisar -->

</script>

<script type="text/javascript">
  $("#is_hmo_status").css('display','none');
  window.onload=function(){


        $(".dataTables_scrollBody").hide();
       
        $(".dataTables_scrollHead").after("<div id='loading123' style='display:flex;justify-content: center'><img  src='{{asset('loading.gif')}}'  ></div>");
        //$("#loading123").css("display","block");

      setInterval(function(){

        $(".dataTables_scrollBody").show();
         $("#loading123").hide();

      },2000);

};






  var job_ids;
$("#multi_status_btn").css({"visibility":"hidden"});
function show_multi_btn()
{
$("#multi_status_btn").css({"visibility":"visible"});
}
function multi_status()
{
  job_ids=[];
  $("input:checkbox[name=job_ids]:checked").each(function(){
    job_ids.push($(this).val());
});
$status=0;
console.log($status)
var selected="";
$("#jobids").val(job_ids);
if($status==1)
{
  selected="#surveyed1";
}
else if($status==2)
{
  selected="#booked1";
}
else if($status==3)
{
  selected="#insulated1";
}
else if($status==4)
{
  selected="#submitted1";
}
else
{
  selected="#canceled1";
}
console.log(selected)
          $("#surveyed1").prop("disabled", false);
           $("#booked1").prop("disabled", false);
           $("#insulated1").prop("disabled", false);
           $("#submitted1").prop("disabled", false);
          $("#canceled1").prop("disabled", false);
          $("#surveyed1").prop("checked", false);
          $("#canceled1").prop("checked", false);
          $("#booked1").prop("checked", false);
          $("#insulated1").prop("checked", false);
          $("#submitted1").prop("checked", false);
          $(selected).prop("checked", true);
           $('#multistatusmodal').modal('toggle');
          $('#multistatusmodal').modal('show');
          if($("#insulated1").prop("checked")==true){
       $("#surveyed1").attr('disabled','disabled');
        $("#booked1").attr('disabled','disabled');
          $("#canceled1").attr("disabled", "disabled");
        $("#surveyed1").prop("checked", true);
          $("#booked1").prop("checked", true);
    }
    else if($("#submitted1").prop("checked")==true)
    {
      $("#insulated1").attr('disabled','disabled');
          $("#canceled1").attr("disabled", "disabled");
      $("#surveyed1").attr('disabled','disabled');
        $("#booked1").attr('disabled','disabled');
        $("#surveyed1").prop("checked", true);
          $("#booked1").prop("checked", true);
          $("#insulated1").prop("checked", true);
    }
    else if($("#booked1").prop("checked")==true)
    {
$("#surveyed1").attr('disabled','disabled');
$("#surveyed1").prop("checked", true);
    }
    else if($("#canceled1").prop("checked")==true)
    {
      $("#insulated1").attr('disabled','disabled');
      $("#surveyed1").attr('disabled','disabled');
        $("#booked1").attr('disabled','disabled');
        $("#submitted1").attr('disabled','disabled');
        $("#canceled1").attr('disabled','disabled');
        $("#surveyed1").prop("checked", true);
        $("#canceled1").prop("checked", true);
        $("#booked1").prop("checked", true);
    }
    else{
      $("#surveyed1").attr('disabled','disabled');
    $("#surveyed1").prop("checked", true);
    }
}

  function StatusModal(data,selected) {
    $("#is_hmo_status").css('display','none');
var jobs = ;
var submit,insulate,book,survey;
var is_hmo=0;
jobs.forEach(function myFunction2(item, index) {
  if(item['id']==data){
    if(item['job_status']==4){
   submit=(item['submit_date']); }
  else if(item['job_status']==3){
 insulate=(item['insulation_date']);
  }
  else if(item['job_status']==2){
     book=(item['booking_date']);
  }
  else{
     survey=(item['survey_date']);
  }

  if(item['property_type']=='HMO')
  {
    is_hmo=1;
  }
}
});

          if(is_hmo==1)
          {
              $("#is_hmo_status").css('display','block');
          }

           $("#surveyed").prop("disabled", false);
           $("#booked").prop("disabled", false);
           $("#insulated").prop("disabled", false);
           $("#submitted").prop("disabled", false);
          $("#canceled").prop("disabled", false);
          $("#surveyed").prop("checked", false);
          $("#canceled").prop("checked", false);
          $("#booked").prop("checked", false);
          $("#insulated").prop("checked", false);
          $("#submitted").prop("checked", false);
          $('#statusid').val(data);
          $(selected).prop("checked", true);
           $('#statusmodal').modal('toggle');
          $('#statusmodal').modal('show');
          if($("#insulated").prop("checked")==true){
       $("#surveyed").attr('disabled','disabled');
        $("#booked").attr('disabled','disabled');
          $("#canceled").attr("disabled", "disabled");
        $("#surveyed").prop("checked", true);
          $("#booked").prop("checked", true);
             var dateEntered = new Date(insulate);
    var month = dateEntered.getMonth() + 1;
    var day = dateEntered.getDate();
    var year=dateEntered.getFullYear();
     if(month < 10)
        month = '0' + month.toString();
      if(day < 10)
          day = '0' + day.toString();
        var minDate= year + '-' + month + '-' + day;
         $('#date').attr('min', minDate);

    }
    else if($("#submitted").prop("checked")==true)
    {
      $("#insulated").attr('disabled','disabled');
          $("#canceled").attr("disabled", "disabled");
      $("#surveyed").attr('disabled','disabled');
        $("#booked").attr('disabled','disabled');
        $("#surveyed").prop("checked", true);
          $("#booked").prop("checked", true);
          $("#insulated").prop("checked", true);
          var dateEntered = new Date(submit);
    var month = dateEntered.getMonth() + 1;
    var day = dateEntered.getDate();
    var year=dateEntered.getFullYear();
     if(month < 10)
        month = '0' + month.toString();
      if(day < 10)
          day = '0' + day.toString();
        var minDate= year + '-' + month + '-' + day;
         $('#date').attr('min', minDate);
    }
    else if($("#booked").prop("checked")==true)
    {
$("#surveyed").attr('disabled','disabled');
$("#surveyed").prop("checked", true);
var dateEntered = new Date(book);
    var month = dateEntered.getMonth() + 1;
    var day = dateEntered.getDate();
    var year=dateEntered.getFullYear();
     if(month < 10)
        month = '0' + month.toString();
      if(day < 10)
          day = '0' + day.toString();
        var minDate= year + '-' + month + '-' + day;
         $('#date').attr('min', minDate);
    }
    else if($("#canceled").prop("checked")==true)
    {
      $("#insulated").attr('disabled','disabled');
      $("#surveyed").attr('disabled','disabled');
        $("#booked").attr('disabled','disabled');
        $("#submitted").attr('disabled','disabled');
        $("#canceled").attr('disabled','disabled');
        $("#surveyed").prop("checked", true);
        $("#canceled").prop("checked", true);
        $("#booked").prop("checked", true);
    }
    else{
      $("#surveyed").attr('disabled','disabled');
$("#surveyed").prop("checked", true);
var dateEntered = new Date(survey);
    var month = dateEntered.getMonth() + 1;
    var day = dateEntered.getDate();
    var year=dateEntered.getFullYear();
     if(month < 10)
        month = '0' + month.toString();
      if(day < 10)
          day = '0' + day.toString();
        var minDate= year + '-' + month + '-' + day;
         $('#date').attr('min', minDate);
    }
  }

  function ChooseContact(data) {
    var selected_jobs = ;
    selected_id=data;
    selected_jobs.forEach(myfunction);

}

function myfunction(item,index)
{

    if(item.id == selected_id)
        {
          /* $forname="<p>Fore Name :<b>".concat(item.fore_name,"</b></p>");
          $lastname="<p>Last Name :<b>".concat(item.last_name,"</b></p>");
          $address="<p>Address :<b>".concat(item.address,"</b></p>","<p>POST CODE :<b>",item.postal_code,"</b></p>","<p>Email :<b>",item.email,"</b></p>");
          $contact="<p>Contact Number :<b>".concat(item.contact_no,"</b></p>","<p>Additional Number :<b>",item.additional_no,"</b></p>","<p>Date of Birth :<b>",item.date_of_birth,"</b></p>");
          if(item.is_rented=='no')
          $isrented="<h3>Rental Details</h3><p>Is Rented :<b>".concat(item.is_rented,"</b></p>");
          else
          {
            $landloard="<p>Landlord :<b>".concat(item.landloard,"</b></p>","<p>Contact Name :<b>",item.contact_name,"</b></p>","<p>Contact Number :<b>",item.phone_number,"</b></p>");
          $isrented="<h3>Rental Details</h3><p>Is Rented :<b>".concat(item.is_rented,"</b></p>",$landloard,"<p>Email :<b>",item.email_address,"</b></p>","<p>Notes :<b>",item.notes,"</b></p>");
          }
          $heatingtype="<h3>Property Details </h3><p>Heating Type :<b>".concat(item.heating_type,"</b></p>");
          $no_of_beds="<p>No of Beds :<b>".concat(item.no_of_beds,"</b></p>");
          $propertytype="<p>Property Type :<b>".concat(item.property_type,"</b></p>");
          $external_walls="<p>External Walls :<b>".concat(item.external_walls,"</b></p>");
          $t_date="<p>Booking Date :<b>".concat(item.booking_date,"</b></p><p>Booking time :<b>",item.booking_time,"</b></p><p>Survey Date :<b>",item.survey_date,"</b></p>");
          $final_notes="<p>Notes :<b>".concat(item.final_notes,"</b></p>");
          $a="".concat( "<h3>Customer Details</h3><p>Title :<b>",item.title,"</b></p>",$forname,$lastname,$address,$contact,$isrented,$heatingtype,$no_of_beds,$propertytype,$external_walls,$t_date,$final_notes);
          $('#myModal').modal('toggle');
          $('#myModal').modal('show');
          $("div.demo").html( $a ); */

          const title=document.getElementById("title1");
          const first=document.getElementById("firstName1");
          const last=document.getElementById("lastName1");
          const dob=document.getElementById("dob1");
          const contact=document.getElementById("contactNo1");
          const postal=document.getElementById("postalCode1");
          const email=document.getElementById("email1");
          const address=document.getElementById("address1");
          const rental=document.getElementById("rentalStatus1");
          const heating=document.getElementById("heatingType1");
          const beds=document.getElementById("noOfBeds1");
          const property=document.getElementById("propertyType1");
          const external=document.getElementById("externalWalls1");
          
          const bookingDate=document.getElementById("bookingDates1");
          const booking=document.getElementById("bookingTime1");
          const survey=document.getElementById("surveyDate1");
		  const submitD=document.getElementById("submitDate1");
		  const insulatedD=document.getElementById("insulatedDate1");
          const notes=document.getElementById("notes1");

          if(item.date_of_birth != null)
          {
          const date=new Date(item.date_of_birth);
          const dayy=date.getDate();
          const monthh=date.getMonth()+1;
          const yearr=date.getFullYear();

          const dateString=`${dayy}/${monthh}/${yearr}`;
          console.log(dayy,monthh,yearr);
          dob.value=dateString;
          }
          
          title.value=item.title;
          first.value=item.fore_name;
          last.value=item.last_name;
          contact.value=item.contact_no;
          postal.value=item.postal_code;
          email.value=item.email;
          address.value=item.address;
          rental.value=item.is_rented;
          heating.value=item.heating_type;
          beds.value=item.no_of_beds;
          property.value=item.property_type;
          external.value=item.external_walls;
         bookingDate.value=item.booking_date;
         booking.value=item.booking_time;
         survey.value=item.survey_date;
		 //alert(item.submit_date);
         submitD.value=item.submit_date;
		 //alert(submitD.value);
         insulatedD.value=item.insulation_date;
		 //alert(insulatedD.value);
         notes.value=item.final_notes;          

         if(item.funder==0){
          $("#funder").hide();
          }
          else if(item.funder==1){
            $funderName="E-ON";  
            $("#funder").show();
            $("#funder").text($funderName);
          }
          else if(item.funder==2){
            $funderName="BRITISH GAS";  
            $("#funder").show();
            $("#funder").text($funderName);
          }
          else if(item.funder==1){
            $funderName="NPOWER";  
            $("#funder").show();
            $("#funder").text($funderName);
          }
          
           if(rental.value=="yes"){
            $("#link-font").attr("href","https://use.fontawesome.com/releases/v5.13.1/css/all.css")
            $("#font-cancel").css("display","none");

            $("#landloard").val(item.landloard);           
            $("#contactName").val(item.contact_name);           
            $("#phoneNumber1").val(item.phone_number);           
            $("#email12").val(item.email_address);           
            $("#notes12").val(item.notes);           

            $(".main-2232").css("display","flex");
            $(".main-2121").css("display","flex");
            
          
          } else{
            $("#link-font").attr("href","https://use.fontawesome.com/releases/v5.13.1/css/all.css")
              $("#font-tick").css("display","none");
              $("#font-cancel").css("display","flex");

              $(".main-2232").css("display","none");
            $(".main-2121").css("display","none");

          }
          

          const slider=$("#carousel_inner");
         const path=window.location.pathname.substr(0, window.location.pathname.lastIndexOf('/'))+"/images/"+item.id;
        
         axios.get(path).then(res=>{
          if(res.data!==null){
            slider.html("");
            
            var images_array=res.data;
            var html_data="";
            var counter=0;
            images_array.forEach(function(item,index){
              if(counter==0)
              {
                html_data="<div  class='item active'><img style='width:100%;height:250px' src='"+item+"' alt='image missing'/></div>"
              }
              else
              {
              html_data=html_data+"<div  class='item'><img style='width:100%;height:250px' src='"+item+"' alt='image missing'/></div>"
              }
              counter++;
            })
            html_data=html_data+"";
            console.log(html_data)
            slider.html(html_data);

            
          }
          else{
          
            slider.html("");

          }


         });

         


      $("#download12").attr("href","{{url('/download/image')}}/"+item.id);          
         



          $('#myModal').modal('toggle');
          $('#myModal').modal('show');
          








        }

}







$("document").ready(function(){

     const sur=$("#surveyed12");
     const boo=$("#booked12");
     const ins=$("#insulated12");
     const sub=$("#submitted12");
     const can=$("#canceled12");

      const data=[sur,boo,ins,sub,can];
    
      
  
    
    function dataChangeForMonth($month=1){
        
    $auth="{{Auth::id()}}";
    
    $.ajax({

        url:`{{url("/monthly/jobs/ ")}}+${$month}`,
        
          data:{"authNew":$auth},        
          success:function(res){
            let i=0;
              res.forEach(e=>{
                
                
                data[i].text(e);

                i++;
              });




          }


    });
    
    }

    dataChangeForMonth();


    $('#arrowLeft').on("click",function(){

console.log("left");

dataChangeForMonth(0);
     $(this).hide();
     $("#arrowRight").show(); 
     $("#jobs12").text("Previous Month");
});  



$('#arrowRight').on("click",function(){

  console.log("right");
  dataChangeForMonth(1);
  $(this).hide();
  $("#arrowLeft").show();
  $("#jobs12").text("Current Month");
});      




});



$("#arrowRight").hide(); 
$(document).ready(function(){

$("#submitted").on("click",function(){

    

    if($(this).is(":checked") == true){

    $("#time").hide().removeAttr("required");


      }else{

        $("#time").show().attr("required",true);


      }



});

});


  


  
/* function usersList(){

    const value="{{ empty($jobs_List2)?'':$jobs_List2 }}";

    $.ajax({
      
      url:"{{url('/exportList')}}",
      data:{list12:value},
      
      success:function(res){
          console.log(res);
      }


    });  



} 
 */






function delete_button_allow()
{
console.log(1)
$(".dlt_btn").css('visibility','unset')
}

function delete_button_hide()
{
console.log(1)
$(".dlt_btn").css('visibility','hidden')
}

$(document).ready(function() {
var table;
if(0)
{
table = $('#example1').DataTable( {
order: [[1, 'desc']],
"scrollX": true,
// "autoWidth" : true,
// "columnDefs" : [{"width" : '30%', "targets" : 2}]
// dom: 'Bfrtip',
// // buttons: [
// // 'excel'
// // ]
// dom: 'Bfrtip',
// buttons: [
// 'copy', 'csv', 'excel', 'pdf', 'print'
} );
}
else
{
table = $('#example1').DataTable( {
order: [[0, 'desc']],
"scrollX": true,
// "autoWidth" : true,
// "columnDefs" : [{"width" : '30%', "targets" : 2}]
// dom: 'Bfrtip',
// // buttons: [
// // 'excel'
// // ]
// dom: 'Bfrtip',
// buttons: [
// 'copy', 'csv', 'excel', 'pdf', 'print'
} ); }

// table.buttons().container().appendTo( '#example_wrapper .col-sm-6:eq(0)' );
} );
</script>
@endsection