<?php
  
  if (isset($_REQUEST['eid']) && !empty($_REQUEST['eid']) && $_REQUEST['eid']!=0){
    $select_update     = "SELECT * FROM phone_book WHERE id='".$_REQUEST['eid']."'";
    $select_update_res = mysqli_query($conn,$select_update);
    $update_row        = mysqli_fetch_array($select_update_res,MYSQLI_BOTH);
    $name              = $update_row['name'];
    $category_id       = $update_row['category_id'];
    $phone             = $update_row['phone'];
    $mobile            = $update_row['mobile'];
    $mobile2           = $update_row['mobile2'];
    $fax               = $update_row['fax'];
    $email             = $update_row['email'];
    $id                = $_GET['eid'];
  }
?>
<link rel="stylesheet" href="assets/plugins/toaster/jquery.toast.css">
<link rel="stylesheet" href="assets/plugins/toaster/jquery.toast.min.css">
<script src="assets/plugins/toaster/jquery.toast.js"></script>
<section class="content-header">
  <div class="row">
    <div class="col-xs-12 col-sm-6 col-md-6 col-lg-6 bottom20">
      <h3 class="capital font15 padding5 bold"><?php echo ($id == 0) ? 'ADD NEW CONTACT' : 'UPDATE CONTACT'; ?></h3>
    </div>
    <div class="col-xs-12 col-sm-6 col-md-6 col-lg-6 text-right bottom20">
        <h3>
          <?php 
          if($id != 0){ ?>
            <a href="index.php?page=phone_book/add.php" class="btn btn-danger capital bottom10 custome-btn">ADD NEW CONTACT</a>
          <?php } ?>
        </h3>
      </div>
  </div>
</section>
<hr class="bottom35"> 
<section class="hitz-top-header">
   <div class="row bottom40">
      <div class="col-xs-4">
        <div class="box box-success">
          <div class="box-body">
            <form action="phone_book/insert.php" method="post" enctype="multipart/form-data" class="common-frm-validation" id="signupForm">
              <div class="row">
                <div class="col-lg-12">
                  <div class="col-md-12">
                    <div class="form-group">
                      <label class="capital">name</label><span style="color: red">*</span>
                      <input type="text" size="35" id="name" name="name" class="form-control required" placeholder="ENTER NAME" autocomplete="off" autofocus="" value="<?php echo $name;?>" />
                    </div>
                  </div>
                  <div class="col-md-12">
                    <div class="form-group">
                      <label class="capital">CATEGORY</label>
                      <select id="category_id" name="category_id" class="form-control select2" style="width: 100%;">
                        <option></option>
                        <?php 
                        foreach ($pbc as $pbc_id => $pbc_data) {
                          echo '<option value="'. $pbc_data['id'] .'" '. ($category_id == $pbc_data['id'] ? 'selected' : '') .'>' . $pbc_data['title'] . '</option>';
                        }?>
                      </select>
                    </div>
                  </div>
                  <div class="col-md-12">
                    <div class="form-group">
                      <label class="capital">Phone</label>
                      <input type="text" size="35" id="phone" name="phone" class="form-control number" placeholder="ENTER PHONE" autocomplete="off" autofocus="" value="<?php echo $phone;?>" onchange="CheckPhone(this);"/>
                    </div>
                  </div>
                  <div class="col-md-12">
                    <div class="form-group">
                      <label class="capital">mobile</label><span style="color: red">*</span>
                      <input type="text" size="35" id="mobile" name="mobile" class="form-control required number" placeholder="ENTER MOBILE" autocomplete="off" autofocus="" value="<?php echo $mobile;?>" onchange="CheckMobile(this);"/>
                    </div>
                  </div>
                  <div class="col-md-12">
                    <div class="form-group">
                      <label class="capital">SECOND MOBILE</label>
                      <input type="text" size="35" id="mobile2" name="mobile2" class="form-control number" placeholder="ENTER SECOND MOBILE" autocomplete="off" autofocus="" value="<?php echo $mobile2;?>"/>
                    </div>
                  </div>
                  <div class="col-md-12">
                    <div class="form-group">
                      <label class="capital">fax</label>
                      <input type="text" size="35" id="fax" name="fax" class="form-control" placeholder="ENTER FAX" autocomplete="off" autofocus="" value="<?php echo $fax;?>"/>
                    </div>
                  </div>
                  <div class="col-md-12">
                    <div class="form-group">
                      <label class="capital">Email</label>
                      <input type="email" size="35" id="email" name="email" class="form-control" placeholder="ENTER EMAIL" autocomplete="off" autofocus="" value="<?php echo $email;?>"/>
                    </div>
                  </div>
                </div>
              </div>
              <input type="hidden" value="<?php echo $id;?>" name="id" id="id">
              <hr>
              <div class="row" align="center">
                <button id="btn" class="btn btn-primary ajax-submit capital" type="submit"> <?php echo ($id == 0) ? 'save' : 'Update'; ?></button>
              </div>
            </form>
          </div>
        </div>
      </div>
      <div class="col-xs-8">
        <div class="box box-success">
          <div class="box-body">
            <section class="hitz-top-header">
              <div class="card">
                <div class="card-body table-responsive">
                  <div class="col-md-12">
                    <div class="form-group">
                      <label>CATEGORY</label>
                      <select class="form-control filter select2" id="type">
                        <option value="null">All</option>
                        <?php foreach ($pbc as $pbc_id => $pbc_datas) { ?>
                        <option value="<?php echo $pbc_datas['id'];?>"><?php echo $pbc_datas['title'];?></option>
                        <?php } ?>          
                      </select>
                    </div>
                  </div>
                  <table id="example1" class="table table-bordered table-striped list_data">
                    <thead>
                      <tr>
                        <th>NAME</th>
                        <th width="70">PHONE</th>
                        <th width="70">MOBILE</th>
                        <th width="70">MOBILE2</th>
                        <th width="70">FAX</th>
                        <th width="100">EMAIL</th>
                        <th width="70">Actions</th>
                      </tr>
                    </thead>
                    <tbody>
                      <tr>
                        <td colspan="7"><?php echo "NO RECORD FOUND"; ?></td>
                      </tr>
                    </tbody>
                  </table>
                </div>
              </div>
            </section>
          </div>
        </div>
      </div>

   </div>
</section>
<script type="text/javascript">
jQuery(document).ready(function() {
  loadDataTable();
  $('#category_id').select2();
  $('#type').select2();
  jQuery('.filter').change(function(){
    loadDataTable();
  });
  
});

function loadDataTable(){
    if(typeof dTable!='undefined'){dTable.fnDestroy();}

    dTable=jQuery('.list_data').dataTable({
        "bProcessing"       : true,
        "order"             : [ [0, 'asc'] ],
        "aLengthMenu"       : [ [5, 10, 15, 20, 25, 50, 100], [5, 10, 15, 20, 25, 50, 100] ],
        'iDisplayLength'    : 10,
        "aoColumns"         : [
            {"sClass": "text-center"}, {"sClass": "text-center"}, {"sClass": "text-center"}, {"sClass": "text-center"}, {"sClass": "text-center"}, {"sClass": "text-center"}, {"sClass": "text-center"}
        ],
        "bServerSide"       : true,
        "sAjaxSource"       : 'phone_book/fetch.php?type=' + jQuery('#type').val(),
    });
}

function confirmDelete(e) {
  var $i = $(e).attr("id");
  console.log($i);
  swal({
      title: "Are you sure?",
      text: "You will not be able to recover this imaginary file!",
      type: "warning",
      showCancelButton: true,
      confirmButtonColor: "#DD6B55",
      confirmButtonText: "Yes, delete it!",
      closeOnConfirm: false
  }, function (isConfirm) {
      if (!isConfirm) return;
      $.ajax({
        url: "phone_book/delete.php",
        type: "POST",
        data: 'delete='+$i,
        dataType: "json",
        success: function () {
          swal({title: "Deleted!", text: "Data successfully Deleted!", type: "success"},
            function(){ 
              location.reload();
            }
          );
        },

        error: function (xhr, ajaxOptions, thrownError) {
            swal("Error deleting!", "Please try again", "error");
        }
      });
  });
}

function CheckPhone() {
  var phone = $("#phone").val();
  $.ajax({
    'type': 'POST',
    'url': 'phone_book/check_phone.php',
    'data': {
      'phone': phone
    },
    dataType: 'JSON',
      success: function (result) {
        if(result.status == 1) {
          $.toast({
            heading: 'OPPS....',
            text: 'ALREADY EXIST...!!!',
            icon: 'error',
            position: 'top-right',
            stack: false
          })
          $('#phone').val('').trigger('focus');
        }else{
          jQuery('.ajax-submit').attr('enable', true);
        }
      }
  });
}

function CheckMobile() {
  var mobile = $("#mobile").val();
  $.ajax({
    'type': 'POST',
    'url': 'phone_book/check_mobile.php',
    'data': {
      'mobile': mobile
    },
    dataType: 'JSON',
      success: function (result) {
        if(result.status == 1) {
          $.toast({
            heading: 'OPPS....',
            text: 'ALREADY EXIST...!!!',
            icon: 'error',
            position: 'top-right',
            stack: false
          })
          $('#mobile').val('').trigger('focus');
        }else{
          jQuery('.ajax-submit').attr('enable', true);
        }
      }
  });
}  
</script>