<?php 
include '../../connection.php';
?>

<div class="card">
	<div class="card-header">
		<button class="btn btn-primary btn-md" data-toggle="modal" data-target="#add-assignments"><i class="fa fa-plus-circle"></i> Add Record</button>
	</div>
	<div class="card-body">
		<div class="table-responsive">
		<div id="assign_table"></div>
		</div>
	</div>
</div>


<div class="modal fade" id="add-assignments" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">Add Assigned Task <i class="fa fa-calendar"></i></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="mb-3">
      		<label>Choose Transactions</label> <span class="text-danger">*</span>
      		<select class="js-example-basic-single" name="state" id="transactions" style="width: 100%;">
  <option value="">--select--</option>
   <?php
		   $query = "SELECT 
    tbl_transaction.UniqueID,
    tbl_transaction.resident_id,
    tbl_transaction.complaint_type_id,
    tbl_transaction.description,
    tbl_transaction.status,
    tbl_transaction.date_created,
    tbl_resident.first_name,
    tbl_resident.middle_name,
    tbl_resident.last_name,
    tbl_complaint_types.complain_name
FROM tbl_transaction
LEFT JOIN tbl_resident ON tbl_transaction.resident_id = tbl_resident.resident_id
LEFT JOIN tbl_complaint_types ON tbl_transaction.complaint_type_id = tbl_complaint_types.complaint_type_id
WHERE tbl_transaction.status IN ('Pending', 'Accept')";
		   $query_result = $conn->query($query);

		   foreach ($query_result as $key => $row) {
		   	$complainer = $row['last_name'].', '.$row['first_name'].''.$row['middle_name'].' -('.$row['
		   	complain_name'].') '.$row['description'];

		   echo '<option value="'.$row['UniqueID'].'">'.$complainer.'</option>';
		   }
		    ?>
    
</select>
      		 
		  
      	</div>
        <div class="mb-3">
        	<label>Assigned Staff</label> <span class="text-danger">*</span>
        	<select class="js-example-basic-single form-control" name="state" id="person_assigned" style="width: 100%;">
		  <option value="">--select--</option>
		   <?php
		   $query = "select * from tbl_user where role_type != 'admin'";
		   $query_result = $conn->query($query);

		   foreach ($query_result as $key => $row) {
		   	$fullname = $row['last_name'].','.$row['first_name'].' '.$row['middle_name'];
		   echo '<option value="'.$row['user_id'].'">'.$fullname.'</option>';
		   }
		    ?>
		  
		</select>
        </div>

        <div class="mb-3">
        	<label>Assigned Department</label> <span class="text-danger">*</span>
        	<select class="js-example-basic-single form-control" name="state" id="department_assigned" style="width: 100%;">
		  <option value="">--select--</option>
		   <?php
		   $query = "select * from tbl_department";
		   $query_result = $conn->query($query);

		   foreach ($query_result as $key => $row) {
		   echo '<option value="'.$row['department_id'].'">'.$row['department_name'].'</option>';
		   }
		    ?>
		  
		</select>
        </div>
        <div class="mb-3">
        	<label>Deadline</label>
        	<input type="date" class="form-control" id="date_deadline">
        </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary" onclick="add_assignmemts()">Save <i class="fa fa-save"></i></button>
      </div>
    </div>
  </div>
</div>



<!-- Modal -->
<div class="modal fade" id="update-assigment" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">Update Status <i class="fa fa-edit" aria-hidden="true"></i></h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <label for="">Status</label>
        <input type="hidden" id="assign_id">
        <select class="form-control" name="state" id="u_status" style="width: 100%;">
			  <option value="Pending">Pending</option>
			  <option value="Ongoing">Ongoing</option>
			  <option value="Completed">Completed</option>
			</select>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary" onclick="update_assignment()">Save changes</button>
      </div>
    </div>
  </div>
</div>
<script>
	$(document).on('click', '.delete-btn',  function(){
		let id = $(this).data("id");
		swal({
  title: "Are you sure?",
  text: "Once deleted, you will not be able to recover this data file!",
  icon: "warning",
  buttons: true,
  dangerMode: true,
})
.then((willDelete) => {
  if (willDelete) {
  	$.ajax({
			method: 'post',
			url: 'query/assignment_query.php',
			data:{
				"deleting_assignment": 1,
				"id": id
			},
			success: function(res){
				// alert(res)
				load_assignment();

			}
		});
    swal("Poof! Your data file has been deleted!", {
      icon: "success",
    });
  } else {
    swal("Your data file is safe!");
  }
});
		

	});
	function update_assignment(){
		let assign_id = $('#assign_id').val();
		let u_status = $('#u_status').val();

		$.ajax({
			method: 'post',
			url: 'query/assignment_query.php',
			data:{
				"updating_assignment": 1,
				"assign_id": assign_id,
				"u_status": u_status
			},
			success: function(res){
				// alert(res)
				load_assignment();
				$('#update-assigment').modal('hide');
			}
		});
	}

	function edit_assignment(assignment_id, status){
		 $('#assign_id').val(assignment_id);
		$('#u_status').val(status);
		$('#update-assigment').modal('show');
	}


	function add_assignmemts() {
		let transactions = $('#transactions').val();
		let person_assigned = $('#person_assigned').val();
		let department_assigned = $('#department_assigned').val();
		let date_deadline = $('#date_deadline').val();

		$.ajax({
			method: 'post',
			url: 'query/assignment_query.php',
			data:{
				"adding_assignements": 1,
				"transactions": transactions,
				"person_assigned": person_assigned,
				"department_assigned": department_assigned,
				"date_deadline": date_deadline
			},
			success: function(res){
				load_assignment();
				$('#add-assignments').modal('hide');
			}
		})
		// body...
	}

	// In your Javascript (external .js resource or <script> tag)
$(document).ready(function() {
    $('.js-example-basic-single').select2({
    	theme: 'classic',
    	dropdownParent: $('#add-assignments'),
    });
});
	load_assignment();
	function load_assignment(){
		$.ajax({
			method: 'post',
			url: 'query/assignment_query.php',
			data:{
				"loading_assignments": 1
			},
			success: function(res){
				$('#assign_table').html(res);
				$('#mytable').DataTable({
					columnControl: [{
				        extend: 'order',
				        statusOnly: true
				    }],
				    ordering: {
				        indicators: false
				    }
				});
			}
		})
	}
</script>