<?php defined('BASEPATH') or exit('Direct access is not allowed'); ?>
<!DOCTYPE html>
<html>
<head>
  <style>  .table thead th {
    vertical-align: center !important;
}</style>
<?php include 'app/views/common/css.php';?>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css" />

<style>
  .card-counter{
    box-shadow: 2px 2px 10px #DADADA;
    margin: 5px;
    padding: 20px 10px;
    background-color: #fff;
    height: 100px;
    border-radius: 5px;
    transition: .3s linear all;
  }

  .card-counter:hover{
    box-shadow: 4px 4px 20px #DADADA;
    transition: .3s linear all;
  }

  .card-counter.primary{
    background-color: #007bff;
    color: #FFF;
  }

  .card-counter.danger{
    background-color: #ef5350;
    color: #FFF;
  }  

  .card-counter.success{
    background-color: #66bb6a;
    color: #FFF;
  }  

  .card-counter.info{
    background-color: #26c6da;
    color: #FFF;
  }  

  .card-counter i{
    font-size: 5em;
    opacity: 0.2;
  }

  .card-counter .count-numbers{
    position: absolute;
    right: 35px;
    top: 20px;
    font-size: 32px;
    display: block;
  }

  .card-counter .count-name{
    position: absolute;
    right: 35px;
    top: 65px;
    font-style: italic;
    text-transform: capitalize;
    opacity: 0.5;
    display: block;
    font-size: 18px;
  }

</style>

</head>
<body>
<!-- **************** MAIN CONTENT START **************** -->

  <!-- =======================
  Header START -->
  <header class="navbar-light fixed-top header-static bg-mode">
    <!-- Logo Nav START -->
    <nav class="navbar navbar-expand-lg">
      <div class="container-fluid">
        <!-- Logo START -->
        <a class="navbar-brand" href="index-2.html">
          <img class="light-mode-item navbar-brand-item" src="app/views/assets/images/logo.png" alt="logo">
				  <img class="dark-mode-item navbar-brand-item" src="app/views/assets/images/logo.png" alt="logo">		
        </a>
        <!-- Logo END -->

        <button class="icon-md btn btn-light p-0 d-block d-lg-none" type="button" data-bs-toggle="offcanvas" data-bs-target="#navbarVerticaloffcanvas" aria-controls="navbarVerticaloffcanvas">
          <i class="bi bi-justify-left fs-4"></i>
        </button>

        <!-- Responsive navbar toggler -->
        <button class="navbar-toggler ms-auto icon-md btn btn-light p-0" type="button" data-bs-toggle="collapse" data-bs-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-animation">
          <span></span>
          <span></span>
          <span></span>
        </span>
      </button>

        <!-- Main navbar START -->
        <div class="collapse navbar-collapse" id="navbarCollapse">

          <!-- Nav Search START -->
          <div class="nav mt-3 mt-lg-0 flex-nowrap align-items-center px-4 px-lg-0">
            <div class="nav-item w-100">
              <form class="rounded position-relative">
                <input class="form-control ps-5 bg-light" type="search" placeholder="Search..." aria-label="Search">
                <button class="btn bg-transparent px-2 py-0 position-absolute top-50 start-0 translate-middle-y" type="submit"><i class="bi bi-search fs-5"> </i></button>
              </form>
            </div>
          </div>
          <!-- Nav Search END -->

          <ul class="navbar-nav navbar-nav-scroll mx-auto">
            <!-- Nav item 1 Demos -->
            <li class="nav-item">
              <a class="nav-link active" href="#">Overview</a>
            </li>
            <!-- Nav item 1 Demos -->
            <li class="nav-item">
              <a class="nav-link" href="#">Subscriptions</a>
            </li>
            <!-- Nav item 1 Demos -->
            <li class="nav-item">
              <a class="nav-link" href="#">Streams</a>
            </li>
            <!-- Nav item 1 Demos -->
            <li class="nav-item">
              <a class="nav-link" href="#">Results</a>
            </li>
            <!-- Nav item 2 Pages -->
          </ul>
        </div>
        <!-- Main navbar END -->

        <!-- Nav right START -->
        <ul class="nav flex-nowrap align-items-center ms-lg-3 list-unstyled">

          <!-- Notification dropdown END -->

          <li class="nav-item ms-3 dropdown">
            <a class="nav-link p-0" href="#" id="profileDropdown" role="button" data-bs-auto-close="outside" data-bs-display="static" data-bs-toggle="dropdown" aria-expanded="false">
              <div class="d-flex align-items-center position-relative">
                <!-- Avatar -->
                <div class="avatar avatar-sm me-xl-3">
                  <img class="avatar-img rounded-circle" src="<?= $profile_image_path ?>" alt="avatar">
                </div>
                <div class="d-none d-xl-block">
                  <span class="h6 stretched-link"><?= $user_name ?></span>
                  <p class="small m-0"><?= $designation ?></p>
                </div>
              </div>
            </a>
            <ul class="dropdown-menu dropdown-animation dropdown-menu-end pt-3 small me-md-n3" aria-labelledby="profileDropdown">
              <!-- Links -->
              <li><a class="dropdown-item" href="/trainingportal/Settings"><i class="bi bi-gear fa-fw me-2"></i>Settings & Privacy</a></li>
              <li> 
                <a class="dropdown-item" href="" target="_blank">
                  <i class="fa-fw bi bi-life-preserver me-2"></i>Support
                </a> 
              </li>
              <li> 
                <a class="dropdown-item" href="" target="_blank">
                  <i class="fa-fw bi bi-card-text me-2"></i>Documentation
                </a> 
              </li>
              <li class="dropdown-divider"></li>
              <li><a class="dropdown-item bg-danger-soft-hover" href="/trainingportal/Main/Logout"><i class="bi bi-power fa-fw me-2"></i>Sign Out</a></li>
              <li> <hr class="dropdown-divider"></li>
              <!-- Dark mode switch START -->
              <li>
                <div class="modeswitch-wrap" id="darkModeSwitch">
                  <div class="modeswitch-item">
                    <div class="modeswitch-icon"></div>
                  </div>
                  <span>Dark mode</span>
                </div>
              </li> 
              <!-- Dark mode switch END -->
            </ul>
          </li>
          <!-- Profile START -->
          
        </ul>
        <!-- Nav right END -->
      </div>
    </nav>
    <!-- Logo Nav END -->
  </header>
  <!-- =======================
  Header END -->
  
  <main> 

  <!-- Container START -->
  <div class="container-fluid">

    <!-- Sidenav START -->
    <div class="navbar navbar-vertical navbar-light">
      <div class="offcanvas offcanvas-start custom-scrollbar rounded pt-3" tabindex="-1" id="navbarVerticaloffcanvas">
        <div class="offcanvas-body pt-5 pt-lg-0">
          <!-- Card START -->
          
            <!-- Avatar -->
            <div class="avatar avatar-lg mb-3">
              <a href="#!"><img class="avatar-img rounded-circle border border-white border-3" src="<?= $profile_image_path ?>" alt=""></a>
            </div>
            <!-- Info -->
            <h5 class="mb-0"> <a href="#!"><?= $user_name ?>   </a> </h5>
          <small><?= $designation ?></small>
          <!-- User stat START  -->
          <div class="hstack gap-2 gap-xl-3 mt-3">
            <!-- User stat item -->
            <div>
              <h6 class="mb-0"><?= $enroll_courses ?> </h6>
              <small>Enrolled Courses</small>
            </div>
            <!-- Divider -->
            <div class="vr"></div>
            <!-- User stat item -->
            <div>
              <h6 class="mb-0"><?= $rating ?></h6>
              <small>Skill Map</small>
            </div>
            <!-- Divider -->
            <div class="vr"></div>
            <!-- User stat item -->
          </div>
            <!-- User stat END -->

            <!-- Divider -->
            <hr>

            <!-- Side Nav START -->
            <ul class="nav nav-link-secondary flex-column fw-bold gap-2">
              <li class="nav-item">
                <a class="nav-link" href="/trainingportal/Pne" > <img class="me-2 h-20px fa-fw" src="app/views/assets/images/icon/home-outline-filled.svg" alt=""><span>Training Programs</span></a>
              </li>
              <!-- <li class="nav-item">
                <a class="nav-link" href="#!"> <img class="me-2 h-20px fa-fw" src="app/views/assets/images/icon/medal-outline-filled.svg" alt=""><span>Online Training Programs</span></a>
              </li> -->
              <? if ($role_id==1): ?>
                <li class="nav-item">
                <a class="nav-link" href="/trainingportal/Applicationstatus"> <img class="me-2 h-20px fa-fw" src="app/views/assets/images/icon/star-outline-filled.svg" alt=""><span>Application Status</span></a>
              </li>
              <? endif;?>
              <li class="nav-item">
                <a class="nav-link" href="/trainingportal/Trainingschedule"> <img class="me-2 h-20px fa-fw" src="app/views/assets/images/icon/clock-outline-filled.svg" alt=""><span>Training Schedules </span></a>
              </li>            
              <li class="nav-item">
                <a class="nav-link" href="#!"> <img class="me-2 h-20px fa-fw" src="app/views/assets/images/icon/task-done-outline-filled.svg" alt=""><span>Training Monitoring </span></a>
              </li>
              <li class="nav-item">
                <a class="nav-link" href="#!"> <img class="me-2 h-20px fa-fw" src="app/views/assets/images/icon/star-outline-filled.svg" alt=""><span>Reports </span></a>
              </li>
          
              <? if ($role_id==1): ?>
                <li class="nav-item">
                <a class="nav-link" href="/trainingportal/Adddetails"> <img class="me-2 h-20px fa-fw" src="app/views/assets/images/icon/star-outline-filled.svg" alt=""><span>Add Details</span></a>
              </li>
              <? endif;?>
              <li class="nav-item">
                <a class="nav-link" href="/trainingportal/Main/Logout"> <img class="me-2 h-20px fa-fw" src="app/views/assets/images/icon/arrow-boxed-outline-filled.svg" alt=""><span>Logout </span></a>
              </li>
            
            </ul>
            <!-- Side Nav END -->
          </div>
        </div>
      </div>
      <!-- Sidenav END -->

     
      <div class="page-content"> <!-- Main content START -->
   
     
<div class="container">
    <div class="row">
    <div class="col-md-3">
      <div class="card-counter primary">
        <i class="fas fa-hand-point-up"></i>
        <span class="count-numbers">0</span>
        <span class="count-name">Applied</span>
      </div>
    </div>

    <div class="col-md-3">
      <div class="card-counter info">
        <i class="fas fa-hand-paper"></i>
        <span class="count-numbers">0</span>
        <span class="count-name">Pending</span>
      </div>
    </div>

    <div class="col-md-3">
      <div class="card-counter success">
        <i class="fas fa-thumbs-up"></i>
        <span class="count-numbers">0</span>
        <span class="count-name">Approved</span>
      </div>
    </div>

    <div class="col-md-3">
      <div class="card-counter danger">
        <i class="fas fa-thumbs-down"></i>
        <span class="count-numbers">0</span>
        <span class="count-name">Rejected</span>
      </div>
    </div>

  </div>
</div>   

     <div class="col-lg-12">
        <div class="card">
          <div class="card-body">
            <h5 class="card-title">Training Application Status</h5>

            <!-- Training Request Status. -->
            <table class="table table-striped table-bordered text-center">
              <thead>
                <tr>
                  <th scope="col" style="margin-top:-1%">Sr No</th>
                  <th scope="col">Training Program</th>
                  <th scope="col">Training Module</th>
                  <th scope="col">Segment</th>
                  <th scope="col">Application Date And Time</th>
                  <th scope="col">Self Evaluation</th>
                  <th scope="col"> Team Lead</th>
                  <th scope="col"> BU Head </th>
                  <th scope="col"> Co Segment Head </th>
                  <th scope="col">Segment Head </th>
                  <th scope="col">President <br></th>
                </tr>
              </thead>
              <tbody>
              <?php foreach ($applied_trainings as $applied_trainings_obj) {?>
              <tr>
                  <th scope="row"><?php echo $applied_trainings_obj['id']; ?></th>
                  <td><?php echo $applied_trainings_obj['training_name']; ?></td>
                  <td><?php echo $applied_trainings_obj['module_name']; ?></td>
                  <td><?php echo $applied_trainings_obj['segment_name']; ?></td>
                  <td><?php echo $applied_trainings_obj['applied_date']; ?></td>
                  <td> <button type="button" class="btn btn-primary mb-0" onclick="showModalAddModule(<?php echo $applied_trainings_obj['id']; ?>);"><i class="fas fa-book-reader"></i> </button></td>
                  <td><?php echo $applied_trainings_obj['approval_by_team_lead']; ?></td>
                  <td><?php echo $applied_trainings_obj['approval_by_bu_head']; ?></td>
                  <td><?php echo $applied_trainings_obj['approval_by_co_seg_head']; ?></td>
                  <td><?php echo $applied_trainings_obj['approval_by_seg_head']; ?></td>
                  <td><?php echo $applied_trainings_obj['approval_by_seg_leader']; ?></td>
                </tr>
              <?php }?>
              </tbody>
            </table>
            <!-- End Training Request Status. -->

          </div>
        </div>

      </div>              
      </div><!-- Main content END -->


      <!-- Container END -->
        <!-- <div class="row g-3 mb-4">
      
                      <footer class="card card-body">
                      <div class="row g-4">
                          <div class="col-md-12">
                          <?php include 'app/views/common/footer.php';?>
                          </div>
                      </footer>
          </div> -->
    </div>


</main>
<!-- **************** MAIN CONTENT END **************** -->
<script>
  function showModal() {
  $('#myModal').modal('show');
}

function showModal2() {
  $('#myModal2').modal('show');
}


function closeModalmyModal3emilab() {
  $('#myModal3emilab').modal('hide');
}

</script>
<script>

function getfeeddetails(){

const formdata = new FormData();
formdata.append("template", "offlinetraining");
$.ajax({
   type:'POST',
  // enctype: 'multipart/form-data',
   url:"<?= FOLDER_PATH . '/main/get_template'?>",
   data: formdata,
   contentType: false,
   processData: false,
   success:function(data){
     
   }
});

}


</script>
<!-- ======================= 
JS libraries, plugins and custom scripts -->
<?php include 'app/views/common/js.php';?>
</body>
</html>