<?php
  $user_data = $this->session->userdata['user'];
?>

<div class="content-wrapper">
  <section class="content-header">
    <h1>
       <?= $pTitle ?>
        <small><?= $pDescription ?></small>
    </h1>
    <ol class="breadcrumb">
     <li><a href="<?= base_url() ?>"><i class="fa fa-star-o" aria-hidden="true"></i>Home</a></li>
     <li><?= $menu ?></li>
     <li class="active"><?= $smenu ?></li>
    </ol>
  </section>
  <section class="content">
    <div class="row">
      <div class="col-md-12">
        <?php 
         if($this->session->flashdata('message')) { 
          $flashdata = $this->session->flashdata('message'); ?>
          <div class="alert alert-<?= $flashdata['class'] ?>">
           <button class="close" data-dismiss="alert" type="button">×</button>
           <?= $flashdata['message'] ?>
         </div>
       <?php } ?>
      </div>
      <div class="col-md-12">
        <div class="box box-warning">
          <div class="box-body">
            <form role="form" action="<?=base_url('User/updateUser')?>" method="post" class="validate" data-parsley-validate="" enctype="multipart/form-data">
              <!-- Basic Details -->
              <div class="col-md-12">  
                <div class="box-header with-border padUnset">
                  <h3 class="box-title">Basic Details</h3>
                </div><br>
              </div>
              <div class="col-md-6">
                <div class="form-group">
                  <label>Display Name</label>
                  <input type="text" class="form-control required" data-parsley-trigger="change"
                  data-parsley-minlength="2" name="display_name" required=""
                  value="<?= $user_data->display_name ?>" placeholder="Enter Display Name">
                  <span class="glyphicon form-control-feedback"></span>
                </div>
                
                <div class="form-group">
                  <label>User Name</label>
                  <input type="text" class="form-control required" data-parsley-trigger="change"
                  data-parsley-minlength="2" name="username" required=""
                  data-parsley-pattern="^[a-zA-Z0-9\ . _ @  \/]+$" 
                  value="<?= $user_data->username ?>" placeholder="Enter User Name">
                  <span class="glyphicon  form-control-feedback"></span>
                </div>  
              </div>
              <div class="col-md-6">
                <div class="form-group">
                  <label>Profile Picture</label>
                  <div class="col-md-12" style="padding-bottom:10px;">
                    <div class="col-md-3">
                      <img id="image_id" src="<?= base_url($user_data->profile_image) ?>" onerror="this.src='<?=base_url("assets/images/user_avatar.jpg")?>';" height="75" width="75" />
                    </div>
                    <div class="col-md-9" style="padding-top: 25px;">
                      <input name="profile_image" type="file" accept="image/*" onchange="setImg(this,'image_id');" />
                    </div>
                  </div>
                </div>
              </div>
            <?php 
              $user_type = $this->session->userdata('user_type');
              if(($user_type == 2 && !empty($provider)) || ($user_type == 3 && !empty($customer))){ ?>
              <!-- Mechanic Data -->
                <div class="col-md-12">  
                  <div class="box-header with-border padUnset">
                    <h3 class="box-title">Personal Details</h3>
                  </div><br>
                </div>

                <?php if(!empty($provider)){ ?>
                  <div class="col-md-6">
                    <div class="form-group">
                      <label>Name</label>
                      <input type="text" class="form-control required" data-parsley-trigger="change"
                      data-parsley-minlength="2" data-parsley-pattern="^[a-zA-Z0-9\ . _ - ' \/]+$" 
                      name="name" required="" value="<?= $provider->name ?>" 
                      placeholder="Enter First Name">
                      <span class="glyphicon form-control-feedback"></span>
                    </div>  
                    <div class="form-group">
                      <label>Email</label>
                      <input type="email" class="form-control required" data-parsley-trigger="change"  
                      data-parsley-minlength="2" required="" name="email" placeholder="Enter email ID" 
                      value="<?= $provider->email ?>" >
                      <span class="glyphicon form-control-feedback"></span>
                    </div>
                  </div>
                  <div class="col-md-6">
                    <div class="form-group">
                      <label>Phone</label>
                      <input type="text" class="form-control required" data-parsley-trigger="change" 
                      data-parsley-minlength="2"  data-parsley-pattern="^[0-9\ , - + \/]+$" required="" name="phone" placeholder="Enter Phone Number" value="<?= $provider->phone ?>" >
                      <span class="glyphicon  form-control-feedback"></span>
                    </div>
                  </div>
                <?php } if(!empty($customer)){ ?>
                  <div class="col-md-6">
                    <div class="form-group">
                      <label>Name</label>
                      <input type="text" class="form-control required" data-parsley-trigger="change"
                      data-parsley-minlength="2" data-parsley-pattern="^[a-zA-Z0-9\ . _ - ' \/]+$" 
                      name="name" required="" value="<?= $customer->name ?>" 
                      placeholder="Enter First Name">
                      <span class="glyphicon form-control-feedback"></span>
                    </div>  
                    <div class="form-group">
                      <label>Email</label>
                      <input type="email" class="form-control required" data-parsley-trigger="change"  
                      data-parsley-minlength="2" required="" name="email" placeholder="Enter email ID" 
                      value="<?= $customer->email ?>" >
                      <span class="glyphicon form-control-feedback"></span>
                    </div>
                  </div>
                  <div class="col-md-6">
                    <div class="form-group">
                      <label>Phone</label>
                      <input type="text" class="form-control required" data-parsley-trigger="change" 
                      data-parsley-minlength="2"  data-parsley-pattern="^[0-9\ , - + \/]+$" required="" name="phone" placeholder="Enter Phone Number" value="<?= $customer->phone ?>" >
                      <span class="glyphicon  form-control-feedback"></span>
                    </div>
                  </div>
                <?php } } ?>

              <!-- Change Password -->
              <div class="col-md-12">  
                <div class="box-header with-border padUnset">
                  <h3 class="box-title">Change Password</h3>
                </div><br>
              </div>
              <div class="col-md-6">
                <div class="form-group">
                  <label>New Password</label>
                  <input type="password" class="form-control" name="password" placeholder="New Password" 
                         autocomplete="off">
                  <span class="glyphicon form-control-feedback"></span>
                </div>  
              </div>
              <div class="col-md-6">
                <div class="form-group">
                  <label>Confirm Password</label>
                  <input type="password" class="form-control" name="cPassword" placeholder="Confirm Password" 
                         autocomplete="off">
                  <span class="glyphicon form-control-feedback"></span>
                </div>
              </div>   
              <div class="col-md-12">      
                <div class="box-footer" style="padding-left:46%;">
                  <button type="submit" class="btn btn-primary">Submit</button>
                </div>        
              </div>        
            </form>
          </div>
        </div>
      </div>
    </div>
  </section>
</div>