<?php 

include('libraryPHP/site_config.php');

include('libraryPHP/session_check_url.php');





?>


<!DOCTYPE html>

<html lang="en">



<head>

    <meta charset="utf-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0">

    <title><?php echo $appName?> | <?php echo $pageTitle?></title>


    <?php echo $appFaviconHtml?> 
    <!-- theme css start -->

    <?php include("commoncss.php"); ?>

    <!-- theme css end -->



</head>



<body>



    <!-- Main Wrapper -->

    <div class="main-wrapper">



        <!-- Header start  -->

        <?php include("header.php"); ?>

        <!-- /Header end -->



        <!-- Sidebar -->

        <?php include("sidebar.php"); ?>

        <!-- /Sidebar -->



        <!-- Page Wrapper -->

        <div class="page-wrapper">



            <div class="content container">



                <!-- Page Header -->

                <div class="page-header">

                    <div class="row">

                        <div class="col">

                            <h3 class="page-title">Manage Equipment Type</h3>

                            <ul class="breadcrumb">

                                <li class="breadcrumb-item"><a href="dashboard.php">Dashboard</a></li>

                                <li class="breadcrumb-item active">Manage Equipment Type</li>

                            </ul>

                        </div>

                    </div>

                </div>

                <!-- /Page Header -->



                <!-- start write start -->



                <div class="col-sm-12">

                   <div class="card mb-5">

                      <a href="" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#add_category_modal" style="margin-left: auto;float: right;margin-bottom: -9px;margin-right: 54px;margin-top: 13px;" onclick="btnReset()">

                         Add Equipment Type

                     </a>

                     

                     <div class="card-body">

                         <div class=" table-responsive" >

                            <table id="manage_category_table" class="table table-hover table-bordered  " style="border-collapse: collapse; border-spacing: 0; width: 100%;">

                               <thead>

                                  <tr>

                                     <th>S.No.</th>

                                     <th>Action</th>

                                     

                                     <th>Equipment Type</th>
                                     <th>Create Date & Time</th>

                                     

                                 </tr>

                             </thead>

                             
                         </table>

                     </div>

                 </div>

             </div>

         </div> <!-- end col -->

         

         <!-- start write end -->

     </div>

 </div>

 <!-- /Page Wrapper -->

 <div class="modal fade" id="add_category_modal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">

     <div class="modal-dialog">

        <div class="modal-content">

            <div class="modal-header bg-primary text-white">

               <h5 class="modal-title" id="exampleModalLabel">Add Equipment Type</h5>

               <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>

           </div>

           <div class="modal-body">

               <form action="" method="post" id="form_validation_add_category">

                  <input required="required" type="hidden" id="action" name="action"

                  value="add_manage_category">

                  <div class="modal-body">

                     <label style="margin-bottom: 10px;">Equipment Type </label>

                     <input type="text" name="cat_name" id="cat_name" placeholder="Enter Equipment Type"class="form-control"  style="width: 100%" maxlength="50">

                     <br>



                 </div>



                 <div class="modal-footer">

                     <button type="button" class="btn btn-danger " data-bs-dismiss="modal">Close</button>

                     <input type="submit" class="btn btn-primary" value="Submit">

                 </div>



             </form>

         </div>

         

     </div>

 </div>

</div>



<div class="modal fade" id="edit_category_Modal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">

 <div class="modal-dialog">

    <div class="modal-content">

        <div class="modal-header bg-primary text-white">

           <h5 class="modal-title" id="exampleModalLabel">Edit Equipment Type</h5>

           <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>

       </div>

       <div class="modal-body">

           <form action="" method="post" id="form_validation_edit_category">

              <input required="required" type="hidden" id="action" name="action"

              value="edit_manage_category">

              <input required="required" type="hidden" id="id" name="id"

              value="edit_event_category">

              <div class="modal-body">

                 



                 



                 <label style="margin-bottom: 10px;">Equipment Type </label>

                 <input type="text" name="cat_name" id="cat_name1" placeholder="Enter Equipment Type"class="form-control"  style="width: 100%" maxlength="50" >

                 <br>



             </div>



             <div class="modal-footer">

                 <button type="button" class="btn btn-danger " data-bs-dismiss="modal">Close</button>

                 <input type="submit" class="btn btn-primary" value="Update">

             </div>



         </form>

     </div>

     

 </div>

</div>

</div>

<!-- footer start -->

<?php include("footer.php"); ?>

<!-- footer end -->



</div>

<!-- /Main Wrapper -->

<?php include('commonjs.php')?>

<?php include_once('extrajs.php') ?>



<!-- sctipt start  -->

<script>

   
  function btnReset(){
   $('form#form_validation_add_category').trigger("reset");
   $('#image_holder1').attr('src'," ");
   
}  
var table = '';       
$(document).ready(function() {

   var validator1 = $("#edit_category_Modal").validate(); 
   $('#edit_category_Modal').on('hidden.bs.modal', function (){ validator1.resetForm();
    $('.form-control').removeClass('error');
});
   var validator = $("#add_category_modal").validate(); $('#add_category_modal').on('hidden.bs.modal', function (){ 
    validator.resetForm();
    $('.form-control').removeClass('error');
});

   $('#manage_category_table').DataTable();    
   getUserTable('first', 'all');
   jQuery.validator.addMethod("noSpace", function(value, element) {
     return value == '' || value.trim().length != 0;  
 }, "No space please and don't leave it empty");   
      //alert('test');  
      
      $('#form_validation_add_category').validate({
          rules:{
           
            image:{
                required: true,
            },
            cat_name:{
               required:true,
                     // minlength:3,
                     maxlength: 50,
                     noSpace:true,
                	 // remote: {
                  //       url: URLAPI+'manage_all_controller.php',
                  //       type: 'get',
                  //       data: {
                  //           'action': 'add_category_check',
                  //           'name': function() {
                  //               return $("#cat_name").val();
                  //           },
                  //       }
                  //   }
              },
          },
          messages:{
           
           image:{
            required: msgValidation.emptyImage[language],

            
        },
        cat_name:{
                    // minlength: "Please enter minimum 3 characters",
                    maxlength: " Maximum 50  characters  allowed in Equipment Type ",
                    required:"Please enter Equipment Type",
                	// remote:"Category already exists",
                },

            },
            
            submitHandler:function(form){
          // e.preventDefault();
          var link=URLAPI+'manage_all_controller.php';
          var data = new FormData($(form)[0]);
          var message = msgLoading.blankMessage[language];
          console.log('message',message);
          apiRequest.postFile(link,data,message).then(function(obj){
              if(obj.success === true){
            // var title = msgTitleOperation.StatusSend[language];
            var message = obj.msg[language];
            swal_alert(title,message,"#","success");
            $('#add_category_modal').modal('hide');
            // var message = obj.msg[language];
            
            getUserTable('first', 'all');
            
        }else{
            var title = '';
            var message = obj.msg[language];
            swal_alert(title,message,'#','error');
            return false;
        }
    },function(err){
      consoleProvider.log('err',err);
      var title    = msgTitleOperation.errorOnServer[language];
      var messsage = msgOperations.errorOnServer[language];
      swal_alert(title,message,"#","warning");
      return false;
  });
      }//end of submit handler
  });
      $('#form_validation_edit_category').validate({
          rules: {
           
             
            cat_name:{
               required:true,
               noSpace:true,
                   // minlength:3,
                   maxlength: 50,
                	 // remote: {
                  //       url: URLAPI+'manage_all_controller.php',
                  //       type: 'get',
                  //       data: {
                  //           'action': 'category_check_edit11',
                  //           'name': function() {
                  //               return $("#cat_name1").val();
                  //           },

                  //            'id': function() {
                  //               return $("#id").val();
                  //           },

                  //       }
                  //   }
              },
          },
          messages:{
           
             
              cat_name:{
                      // minlength: "Please enter minimum 3 characters",
                      maxlength: " Maximum 50  characters  allowed in Equipment Type ",
                      required:"Please enter Equipment Type",
                	// remote:"Category already exists",
                },

            },
            submitHandler: function(form) {
              var link = URLAPI+'manage_all_controller.php';
              var data = new FormData($(form)[0]);
              var messsage = msgLoading.blankMessage[language];
              console.log('messsage',messsage);
              apiRequest.postFile(link, data, messsage).then(function(obj){
                  console.log('obj',obj);
                  if(obj.success === true) {    
          // $('#edit_category_form')[0].reset();
            //------------ Operation Message --------------------
            var title ='';
            var messsage = obj.msg[language];
            //------------ Operation Message End--------------------
            swal_alert(title,messsage,"#","success");
            $("#edit_category_Modal").modal('hide');
            // console.log("obj",obj);
            // var banner_id =obj.data.banner_id;
            
            // var action =obj.data.action;
            // var image_show1 =obj.data.image_show1;
            
            // // var image_html=obj.data.image_show1
            // console.log("banner_id",banner_id);
            // console.log("action",action);
            // console.log("image_show1",image_show1);
            // $('#table_banner').dataTable().fnUpdate(obj.data.image_show1, $('tr#'+banner_id),1,false);
            
            // $('#table_banner').dataTable().fnUpdate(obj.data.action, $('tr#'+banner_id),2,false);

            getUserTable('first', 'all');
            
            return true;
        }else{
         var messsage = obj.msg[language];
            //------------ Operation Message End--------------------
            swal_alert(title,messsage,"#","error");
        }
    },function(err){
      console.log('err',err); 
      //------------ Operation Message --------------------
      var title = msgTitleOperation.errorOnServer[language];
      var messsage = msgOperations.errorOnServer[language];
      //msgSuccessErrorHtml.warning(title, messsage, msgSuccessErrorHtmlSelector);
      //------------ Operation Message End--------------------
      swal_alert(title,messsage,"#","error");
      return false;     
  });
              return false;
          }
      });
  });
function getUserTable(event, type){
    var link = URLAPI+'manage_all_controller.php';
    var data = {
        action:'get_category',
        type:type,
    }
    var messsage = msgLoading.blankMessage[language];
    console.log('messsage',messsage);
    apiRequest.get(link, data, messsage).then(function(obj){
        console.log('obj',obj);
        if(obj.success === true) {
            var user_arr =  obj.data.user_arr;
            if(user_arr.length>=0){
                $('#manage_category_table').DataTable({
                    data: user_arr,
                    "destroy": true,
                    
                    "paging": true,
                    "lengthChange": true,
                    "searching": true,
                    "ordering": true,
                    "info": true,
                    "autoWidth": false,
                    "responsive": true,
                    "aaSorting": [
                    [0, "asc"]
                    ],
                    "bJQueryUI":  "true" ,
                    "sPaginationType": "full_numbers",
                    "iDisplayLength": 15,
                            "aLengthMenu": [
                                [ 15,20, 25, 50, 100, 200, -1],
                                [15, 20, 25, 50, 100, 200, "All"]
                            ],
                    "columns": [
                    
                    { "data": "srno" },

                    { "data": "action"},
                    
                    { "data": "category_name" },
                    { "data": "createtime" },
                    
                    ],
                    "rowId": "banner_id",
                });
            }else{
                dataTable.fnClearTable();
                dataTable.fnDraw();
                dataTable.fnDestroy();
            }
        } else {
                //------------ Operation Message --------------------
                var title = msgTitleOperation.userDeleted[language];
                var messsage = obj.msg[language];
                msgSuccessErrorHtml.error(title, messsage, '#msgSuccessErrorHtml');
                //------------ Operation Message End--------------------
                return false;
            }
        },function(err){
            console.log('err',err);
            //------------ Operation Message --------------------
            var title = msgTitleOperation.errorOnServer[language];
            var messsage = msgOperations.errorOnServer[language];
            msgSuccessErrorHtml.warning(title, messsage, '#msgSuccessErrorHtml');
            //------------ Operation Message End--------------------
            return false;
        });
}
function btnUserDeleteConfirm(event){
    var cat_id = $(event).attr('data-id');
    swal({
      title: '',
      text: 'Are you sure want to delete category?',
              icon: "warning", //error, success, info
              buttons:  ["Cancel", "Ok"],
              //dangerMode: true,
          })
    .then((willDelete) => {
      if (willDelete) {
        btnUserDeleteContinue(event, cat_id);
    } else {
                //swal("Your imaginary file is safe!");
            }
        });
}
function btnUserDeleteContinue(event, cat_id){
    
    var link = URLAPI+'manage_all_controller.php';
    var data = {
        action:'delete_category',
        cat_id:cat_id,
    }
    
    var messsage = msgLoading.blankMessage[language];
    console.log('messsage',messsage);
    
    apiRequest.get(link, data, messsage).then(function(obj){
        console.log('obj',obj);
        if(obj.success === true) { 
            var title = '';
            var messsage = obj.msg[language];
            var messsage = obj.msg[language];
            swal_alert(title,messsage,"#","success");
            getUserTable('first', 'all');
            //-------------- DataTable Row Action end ---------
            return false;
            
            
        } else {
                //------------ Operation Message --------------------
                var title = msgTitleOperation.userDeleted[language];
                var messsage = obj.msg[language];
                msgSuccessErrorHtml.error(title, messsage, msgSuccessErrorHtmlSelector);
                //------------ Operation Message End--------------------
                return false;
            }
        },function(err){
            console.log('err',err); 
            //alert('Server not responde');
            
            //------------ Operation Message --------------------
            var title = msgTitleOperation.errorOnServer[language];
            var messsage = msgOperations.errorOnServer[language];
            msgSuccessErrorHtml.warning(title, messsage, msgSuccessErrorHtmlSelector);
            //------------ Operation Message End--------------------
            return false;      
        });
}
function btnEditCategory(event){
  var id     = $(event).attr('data-id');
  var image   = $(event).attr('data-image');
  var name   = $(event).attr('data-name');
  
  console.log('id',id);
  console.log('image',image);
  
  $('#priview_img11').attr('src','<?php echo $img_url_user_main;?>'+image);
  $('#id').val(id);
  $('#cat_name1').val(name);
  
  $('#edit_category_Modal').modal('show');
}
</script>
<script>
    
          //---------------------- start for validations end ---------------------
          
          
      </script>

      <script>

       


          $("#fileUpload111").on('change', function () {
        //----------------- Image Preview and validation code start here -------------------
        var countFiles = $(this)[0].files.length;
        if(countFiles==0){
            $(this)[0].value='';
            var image_holder = $("#priview_img11");
            $(image_holder).attr('src', ' ');

                // notifyMessage.warning('Warning!', 'This browser does not support FileReader');
                return false;
            }else{
                var imgPath = $(this)[0].value;
                var extn = imgPath.substring(imgPath.lastIndexOf('.') + 1).toLowerCase();
                var image_holder = $("#priview_img11");
                
                console.log('fffdfh',image_holder);
                image_holder.empty();
                console.log('123',image_holder);
                console.log('countFiles',countFiles);

                if (extn == "png" || extn == "jpg" || extn == "jpeg") {
                    if (typeof (FileReader) != "undefined") {
                        for (var i = 0; i < countFiles; i++) {
                            var reader = new FileReader();
                            reader.onload = function (e) {
                                $(image_holder).attr('src', e.target.result);

                            }
                            image_holder.show();

                            reader.readAsDataURL($(this)[0].files[i]);
                        }

                    }else {
                        $(this)[0].value='';
                        
                    // notifyMessage.warning('Warning!', 'This browser does not support FileReader');
                    return false;
                }

            }else {
                $(this)[0].value='';
                swal({
                    // title: title,
                    text: 'You can choose only("jpeg","jpg","png")file',
                    icon: "warning", //error, success, info
                    button: "Ok",
                })
                return false;
            }

        }
        
        //----------------- Image Preview and validation code end here -------------------
    });
          
        // for image validation
        $("#fileUpload1").on('change', function () {
        //----------------- Image Preview and validation code start here -------------------
        var countFiles = $(this)[0].files.length;
        if(countFiles==0){
            $(this)[0].value='';
            var image_holder = $("#image_holder1");
            $(image_holder).attr('src', ' ');

                // notifyMessage.warning('Warning!', 'This browser does not support FileReader');
                return false;
            }else{
                var imgPath = $(this)[0].value;
                var extn = imgPath.substring(imgPath.lastIndexOf('.') + 1).toLowerCase();
                var image_holder = $("#image_holder1");
                
                console.log('fffdfh',image_holder);
                image_holder.empty();
                console.log('123',image_holder);
                console.log('countFiles',countFiles);

                if (extn == "png" || extn == "jpg" || extn == "jpeg") {
                    if (typeof (FileReader) != "undefined") {
                        for (var i = 0; i < countFiles; i++) {
                            var reader = new FileReader();
                            reader.onload = function (e) {
                                $(image_holder).attr('src', e.target.result);

                            }
                            image_holder.show();

                            reader.readAsDataURL($(this)[0].files[i]);
                        }

                    }else {
                        $(this)[0].value='';
                        
                    // notifyMessage.warning('Warning!', 'This browser does not support FileReader');
                    return false;
                }

            }else {
                $(this)[0].value='';
                swal({
                    // title: title,
                    text: 'You can choose only("jpeg","jpg","png")file',
                    icon: "warning", //error, success, info
                    button: "Ok",
                })
                return false;
            }

        }
        
        //----------------- Image Preview and validation code end here -------------------
    });

</script>






</body>



</html>