{% include 'vendor/include/header.html' %}
{% include 'vendor/include/topbar.html' %}
 {% include 'vendor/include/sidebar.html' %}
<!-- Content Wrapper. Contains page content -->
<style>
 .checkbox{
     width:10px;
 }
</style>
<div class="content-wrapper">
 <!-- Content Header (Page header) -->
 <section class="content-header">
     <div class="container-fluid">

         <div class="row mb-2">
             <div class="col-sm-6">
                 <h1> Update  Inspection</h1>
             </div>
             <div class="col-sm-6">
                 <ol class="breadcrumb float-sm-right">
                     <li class="breadcrumb-item"><a href="/vendor/dashboard/">Dashboard</a></li>
                     <li class="breadcrumb-item">Inspection</li>
                     <li class="breadcrumb-item active"></li>
                 </ol>
             </div>
         </div>
     </div><!-- /.container-fluid -->
 </section>

 <!-- Main content -->
 <section class="content">

     <!-- Default box -->
     <div class="card">
         <div class="card-header">
             <h3 class="card-title">Create Inspection</h3>
             <div class="card-tools">
                 <a href="/vendor/c_inspection/" class="btn btn-sm btn-primary"><i class="fas fa-long-arrow-alt-left"></i> Go Back</a>
             </div>
         </div>
         <div class="card-body">

             <div class="row">
                 <div class="col-md-12">
                     <form method="post"  autocomplete="off">
                         {% csrf_token %}
                        <input type="hidden" name="ci" id="ci" value="{{compins.id}}" />
                         <div class="form-row">
                             <div class="form-group col-md-4">
                                 <label for="staff" class="" disable> Select Client</label>
                                 <select class="form-control" name="client" id="client">
                                     <option value="{{compins.clientid.id}}">{{compins.clientid.company}}</option>
                                 </select>
                             </div>
                             <div class="form-group col-md-4">
                                 <label for="staff" class="" disable>Select Employee</label>
                                 <select class="form-control" name="employee" id="employee">
                                     <option value="{{compins.assignemp.id}}">{{compins.assignemp.first_name}} {{compins.assignemp.last_name}}</option>
                                 </select>
                             </div>
                             
                             <div class="form-group col-md-4">
                                 <label for="inspection_date" class="" disable>Inspection Date</label>
                                 <input type="date" name="inspection_date" id="inspection_date" class="form-control" value="{{compins.inspection_date|date:"Y-m-d"}}" disabled>
                             </div>

                             <div class="form-group col-md-4">
                                <label for="status" class="">Select Status</label>
                                <select class="form-control" onchange="Resheduldate(this)" name="status" id="status">
                                    <option value="Approve" {% if compins.status == 'Approve' %}selected{% endif %}>Approve</option>
                                    <option value="Pendding" {% if compins.status == 'Pendding' %}selected{% endif %}>Pendding</option>
                                    <option value="Reschedule" {% if compins.status == 'Reschedule' %}selected{% endif %}>Reschedule</option>
                                </select>
                            </div>

                            <div class="form-group col-md-4" {% if compins.reshedul_date %}style="display: none;"{% endif %} id="reshedul_date">
                                <label for="reshedul_date">Inspection Reshedul Date</label>
                                <input type="date" name="reshedul_date" id="reshedul_date" class="form-control" value="{{compins.reshedul_date|date:"Y-m-d"}}" required>
                            </div>

                            <div class="form-group col-md-4">
                                <label for="message" class="" disable>Message</label>
                                <p>{{compins.message}}</p>
                            </div>
                        </div>

                         <button type="button" id="tickebutton" class="btn btn-primary" onclick="companyinspection()">Update</button>
                         <p id="msg"></p>
                     </form>
                 </div>
             </div>
         <span id="msg" class="pl-5 text-bold"></span>
         </div>
         <!-- /.card-body title="Please use a 10 digit telephone number with no dashes or dots" pattern="[0-9]{10}"-->
     </div>
     <!-- /.card -->

 </section>
 <!-- /.content -->
</div>
<!-- /.content-wrapper -->

<script>
function Resheduldate(){
    var status = document.getElementById("status").value;
    if(status == 'Reschedule'){
        document.getElementById("reshedul_date").style.display = 'block';  
    }else{
        document.getElementById("reshedul_date").style.display = 'none';  
    }
}

window.load = Resheduldate()

function companyinspection(){
 var client = document.getElementById("client").value;
 var employee = document.getElementById("employee").value;
 var reshedul_date = document.getElementById("reshedul_date").value;
 var status = document.getElementById("status").value;
 var ci = document.getElementById("ci").value;
 
 if(client==''){
     document.getElementById("msg").innerText  = 'Please Select Client';
     document.getElementById("msg").style.color  = 'red';
 }else if(employee==''){
     document.getElementById("msg").innerText  = 'Please Select Employee';
     document.getElementById("msg").style.color  = 'red';
 }else{
     document.getElementById("msg").innerText  = 'Please Wait';
     jQuery('#tickebutton').attr('disabled', true);
     $.ajax({
             url: "/vendor/update_inspection/",
             headers: {'X-CSRFToken': '{{ csrf_token }}'},
             method:'POST',
             data: {
               'status':status,
               'ci' : ci,
               'reshedul_date': reshedul_date,
             },
             success: function (data) {
                 if(data.status == 200){
                       document.getElementById("msg").innerText  = 'Company Inspection Updated Success. Please wait Redirecting Page';
                       document.getElementById("msg").style.color  = 'green';
                       document.getElementById("tickebutton").disabled = true;
                       window.setTimeout(function(){window.location.href = "/vendor/c_inspection/";}, 5000);
                 }
             }
          });
    }
}

</script>
{% include 'vendor/include/footer.html' %}