<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
        
        <!-- Main content -->
        <section class="content">
                 
              <div class="row">
                    <div class="col-md-12">
                      <!-- Widget: user widget style 1 -->
                      <div class="box box-widget widget-user">
                        <!-- Add the bg color to the header using any of the bg-* classes -->
                        <div class="widget-user-header bg-aqua-active">
                          <h3 class="widget-user-username"><?php echo $user['name']; ?></h3>
                          <h5 class="widget-user-desc"><?php echo $employeeType['type'] ?></h5>
                        </div>
                        <div class="widget-user-image">
                          <img class="img-circle show_profile_image" data-toggle="modal" data-target="#profile-img-modal"  src="<?php echo UPLOAD_LINK.$user['photo'] ?>" alt="User Avatar">
                        </div>
                        <div class="box-footer">
                          <div class="row">
                            <div class="col-sm-4 border-right">
                              <div class="description-block">
                                <h5 class="description-header"><?php echo $user['id'] ?></h5>
                                <span class="description-text">User Id</span>
                              </div>
                              <!-- /.description-block -->
                            </div>
                            <!-- /.col -->
                            <div class="col-sm-4 border-right">
                              <div class="description-block">
                                <h5 class="description-header"><?php echo date("Y-m-d H:i:s A",$user['created']); ?></h5>
                                <span class="description-text">Created At</span>
                              </div>
                              <!-- /.description-block -->
                            </div>
                            <!-- /.col -->
                            <div class="col-sm-4">
                              <div class="description-block">
                                <h5 class="description-header"><?php echo $user['date']; ?></h5>
                                <span class="description-text">Last Update</span>
                              </div>
                              <!-- /.description-block -->
                            </div>
                            <!-- /.col -->
                          </div>
                          <!-- /.row -->
                        </div>
                      </div>
                      <!-- /.widget-user -->
                    </div>
                    <!-- /.col -->
                    <div>
                        
                    </div>
                  </div>
                  <!-- /.row -->
            <div class="row">
        <div class="col-md-3 col-sm-6 col-xs-12">
          <div class="info-box">
            <span class="info-box-icon bg-aqua icons_edit_top"><i class="fa fa-dollar"></i></span>

            <div class="info-box-content">
              <span class="info-box-text">Salary</span>
              <span class="info-box-number"><?php echo $employee['fixed_salary'] ?> L.E</span>
            </div>
            <!-- /.info-box-content -->
          </div>
          <!-- /.info-box -->
        </div>
        <!-- /.col -->
        <div class="col-md-3 col-sm-6 col-xs-12">
          <div class="info-box">
            <span class="info-box-icon bg-green icons_edit_top"><i class="fa fa-money"></i></span>

            <div class="info-box-content">
              <span class="info-box-text">Commission</span>
              <span class="info-box-number"><?php echo $employee['fixed_commision'] ?> L.E</span>
            </div>
            <!-- /.info-box-content -->
          </div>
          <!-- /.info-box -->
        </div>
        <!-- /.col -->
        <div class="col-md-3 col-sm-6 col-xs-12">
          <div class="info-box">
            <span class="info-box-icon bg-yellow icons_edit_top"><i class="fa fa-flag-o"></i></span>

            <div class="info-box-content">
              <span class="info-box-text">Type</span>
              <span class="info-box-number"><?php echo $employeeType['type'] ?></span>
            </div>
            <!-- /.info-box-content -->
          </div>
          <!-- /.info-box -->
        </div>
        <!-- /.col -->
        <div class="col-md-3 col-sm-6 col-xs-12">
          <div class="info-box">
            <span class="info-box-icon bg-red icons_edit_top"><i class="fa fa-star-o"></i></span>

            <div class="info-box-content">
              <span class="info-box-text">Gender</span>
              <span class="info-box-number">
              <?php
                if($user['gender'] == 1){
                    echo "Male";
                }else{
                    echo "Female";
                }
              ?>  
              </span>
            </div>
            <!-- /.info-box-content -->
          </div>
          <!-- /.info-box -->
        </div>
        <!-- /.col -->
      </div>
      <!-- /.row -->

<!-- start row for shortcuts -->
              <div class="row">
                <div class="col-md-12">
                  <div class="box box-primary">
                    <div class="box-header with-border">
                      <i class="fa fa-user"></i>

                      <h3 class="box-title">Employee Information</h3>

                      <div class="box-tools pull-right">
                        <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i>
                        </button>
                        <button type="button" class="btn btn-box-tool" data-widget="remove"><i class="fa fa-times"></i></button>
                      </div>
                    </div>
                    <div class="box-body">

                       <div class="row">
                    <form method="post">
                            <table class="table table-bordered dt-responsive tablefordata">
                                
                               <tr>
                                    <td><strong>User Mail</strong></td>
                                    <td><strong><?php echo $user['mail'] ?></strong></td>
                                </tr>
                                <tr>
                                    <td><strong>User Phone</strong></td>
                                    <td><strong><?php echo $user['phone'] ?></strong></td>
                                </tr>
                              <tr>
                                    <td><strong>User Address</strong></td>
                                    <td><strong><?php echo $user['address'] ?></strong></td>
                                </tr>
                              
                              <tr>
                                    <td><strong>Birth Date</strong></td>
                                    <td><strong><?php echo $employee['birth_date'] ?></strong></td>
                                </tr>

                              <tr>
                                    <td><strong>Ssn</strong></td>
                                    <td><strong><?php echo $employee['ssn'] ?></strong></td>
                                </tr>
                              <tr>
                                    <td><strong>User Ssn Image</strong></td>
                                    <td><img src="<?php echo UPLOAD_LINK.$employee['ssn_image'] ?>" data-toggle="modal" data-target="#ssn-img-modal" class="img-rounded img-responsive img-edit center-block show_ssn_image"/></td>
                                </tr>
                              <tr>
                                    <td><strong>Snapshot</strong></td>
                                    <td><strong><?php echo $employee['snapshot'] ?></strong></td>
                                </tr>


                              <tr>
                                    <td><strong>User Status</strong></td>
                                    <td>
                                        <strong>
                                            <?php
                                                if($user['status'] == 1)
                                                {
                                                    echo '<span data-id="'.$user['id'].'" title="update Status" data-target="on" class="status on update'.$user['id'].'">on</span>';
                                                }else{
                                                    echo '<span data-id="'.$user['id'].'" title="update Status" data-target="off" class="status off update'.$user['id'].'">off</span>';
                                                }
                                            ?>
                                        </strong>
                                    </td>
                                </tr>
                              <tr>
                                    <td><strong>User Created By</strong></td>
                                    <td><strong><?php echo $createdBy['name'] ; ?></strong></td>
                                </tr>
                              
                              <tr>
                                    <td><strong>Last Update By</strong></td>
                                    <td><strong><?php echo $LastUpdatedBy['name']; ?></strong></td>
                                </tr>
                              <tr>
                                <td colspan="2">
                                    <a href="<?php echo BASE_URL."employee/edit_selected/".$user['id']; ?>" class="btn btn-app">
                                        <i class="fa fa-edit"></i> Edit Employee
                                      </a>
                                       
                                </td>
                              </tr>

                          </table>
                    </form>
                </div>
                    </div>
                    <!-- /.box-body-->
                  </div>
                  <!-- /.box -->
                </div>

              </div>
              <!-- /.row -->
            <!-- end row for shortcuts -->








            
  
      </section><!-- /.content -->
</div><!-- /.content-wrapper -->
<!-- Start show profile Image Modal -->
<div class="modal fade" id="profile-img-modal" role="dialog">
   <div class="modal-dialog modal-md">
      <!-- Modal content-->
      <div class="modal-content">
         <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal">&times;</button>
            <h4 class="modal-title">Show Profile Image</h4>
         </div>
         <div class="modal-body">
            <div class="row">
               <div class="col-lg-12">
                  <img src="" alt="" title="Profile Image" class="img-responsive profileImage" />
               </div>

            </div>
         </div>
         <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
         </div>
      </div>
   </div>
</div>
<!--End show profile Image Modal-->
<!-- Start show ssn Image Modal -->
<div class="modal fade" id="ssn-img-modal" role="dialog">
   <div class="modal-dialog modal-md">
      <!-- Modal content-->
      <div class="modal-content">
         <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal">&times;</button>
            <h4 class="modal-title">Show Ssn Image</h4>
         </div>
         <div class="modal-body">
            <div class="row">
               <div class="col-lg-12">
                  <img src="" alt="" title="Ssn Image" class="img-responsive ssnImage" />
               </div>

            </div>
         </div>
         <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
         </div>
      </div>
   </div>
</div>
<!--End show ssn Image Modal-->
<script>
$(document).ready(function(){
	   // start show profile image
           $(".show_profile_image").click(function(){
             // get image
             var image = $(this).attr("src");
             // set image into model
             $(".profileImage").attr("src",image);
           });
         // end show profile image
        // start show ssn image
           $(".show_ssn_image").click(function(){
             // get image
             var image = $(this).attr("src");
             // set image into model
             $(".ssnImage").attr("src",image);
           });
         // end show ssn image
    	//start update  status
        $(".tablefordata").on( 'click', '.status', function () {
             var myId = $(this).attr("data-id");
             var myaction = "updateStatus";
             var mystatus = $(this).attr("data-target");
             var allData = {"action":myaction,"id":myId,"status":mystatus};
            $.ajax({
                    url: "<?php echo BASE_URL.'employee/updateStatus' ?>",
                    type:"POST",
                    data: allData,
                    beforeSend:function(){
                    },
                    statusCode: {
                     404: function() {
                       alert( "page not found" );
                        },
                    },
                    success:function(valdata) {
                        var da = JSON.parse(valdata);
                        if(da['status'] == "success")
                        {
                          if(mystatus == "on")
                          {
                             $(".update"+myId).removeClass("on") ;
                             $(".update"+myId).html("off");
                             $(".update"+myId).addClass("off");
                             $(".update"+myId).attr("data-target","off");
                          }else{
                              $(".update"+myId).removeClass("off") ;
                              $(".update"+myId).html("on");
                             $(".update"+myId).addClass("on");
                              $(".update"+myId).attr("data-target","on");
                          }
                        }else{
                            alert("faild");
                        }
                    }
                });
                return false;
        });
        
        //end update status
});
</script>