<!DOCTYPE html>
<html lang="zxx">
  <head>
    <meta charset="utf-8" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1, shrink-to-fit=no"
    />
    <title>Corass - Student Management</title>
    <link rel="icon" href="img/kp.png" type="image/png" />

    <link rel="stylesheet" href="css/bootstrap1.min.css" />

    <link rel="stylesheet" href="vendors/themefy_icon/themify-icons.css" />

    <link rel="stylesheet" href="vendors/niceselect/css/nice-select.css" />

    <link rel="stylesheet" href="vendors/owl_carousel/css/owl.carousel.css" />

    <link rel="stylesheet" href="vendors/gijgo/gijgo.min.css" />

    <link rel="stylesheet" href="vendors/font_awesome/css/all.min.css" />
    <link rel="stylesheet" href="vendors/tagsinput/tagsinput.css" />

    <link rel="stylesheet" href="vendors/datepicker/date-picker.css" />

    <link rel="stylesheet" href="vendors/scroll/scrollable.css" />

    <link
      rel="stylesheet"
      href="vendors/datatable/css/jquery.dataTables.min.css"
    />
    <link
      rel="stylesheet"
      href="vendors/datatable/css/responsive.dataTables.min.css"
    />
    <link
      rel="stylesheet"
      href="vendors/datatable/css/buttons.dataTables.min.css"
    />

    <link rel="stylesheet" href="vendors/text_editor/summernote-bs4.css" />

    <link rel="stylesheet" href="vendors/morris/morris.css" />

    <link rel="stylesheet" href="vendors/material_icon/material-icons.css" />
    <link rel="stylesheet" href="vendors/staff_sidebar/style.css" />

    <link rel="stylesheet" href="css/metisMenu.css" />

    <link rel="stylesheet" href="css/style1.css" />
    <link rel="stylesheet" href="css/colors/default.css" id="colorSkinCSS" />
  </head>
  <body class="crm_body_bg">
  
  <div id="uploadSidenav" class="sidenav" style="background-color: white;">
    <a href="javascript:void(0)" class="closebtn" onclick="closeSideNav()">&times;</a>
    <div class="container">
      <h5>Upload Student</h5>
        <div class="row">
            <div class="col-lg-12">
                <form action="student/upload" method="POST"  enctype="multipart/form-data">
                    <div>
                      <label>Department</label>
                      <select name="department_id" id="" class="form-select shadow-none">
                        <option>Select Department</option>
                        <% if(departments){
                            %>
                              <option selected value="<%= department.id %> "><%= department.name %> - <%= department.code %> </option>
                            <%}%>
                      </select>
                    </div><br>
                    <div>
                      <label>Level </label>
                      <select name="level_id" id="" class="form-select shadow-none">
                        <option selected>Select level</option>
                        <option value="1">ND </option>
                        <option value="2">HND</option>
                      </select>
                    </div><br>
                    <div>
                      <label>Study Mode</label>
                      <select name="study_mode_id" id="" class="form-select shadow-none">
                        <option selected>Select Study Mode</option>
                        <option value="1">FULL TIME </option>
                        <option value="2">PART TIME</option>
                      </select>
                    </div><br>
                    
                    <br>
                    <div>
                    
                      <!-- <label>Lecturer?</label>
                      <select name="" id="" class="form-select shadow-none">
                        <option selected>Select Lecturer</option>
                      </select> -->
                      <input type="file" name="file" class="form-control" placeholder="upload">
                    </div><br>
                    <button type="submit" class="btn" style="background-color: #068F3F;color:white;">  Upload </button>
                </form>
            </div>
        </div>
    </div>
</div>
<div id="uploadSidenavSingle" class="sidenav" style="background-color: white;">
    <a href="javascript:void(0)" class="closebtn" onclick="closeSideNavSingle()">&times;</a>
    <div class="container">
      <h5>Upload Student</h5>
        <div class="row">
            <div class="col-lg-12">
                <form action="student/single-upload" method="POST"  >
                    <div>
                      <label>Department</label>
                      <select name="department_id" id="" required class="form-select shadow-none">
                        <% if(departments){
                      %>
                        <option selected value="<%= department.id %> "><%= department.name %> - A<%= department.code %> </option>
                      <%}%>
                      </select>
                    </div><br>
                    <div>
                        <label>Supervisor </label>
                        <select name="supervisor" required id="supervisor" class="form-select shadow-none">
                          <option value="" selected>Select Supervisor</option>
                          <% if(supervisors && supervisors.length > 0){
                            for(var supervisor of supervisors){
                          %>
                          <option value="<%= supervisor.user_id %>"><%= supervisor.firstname %> <%= supervisor.middlename %> <%= supervisor.lastname %></option>

                          <%}}%>
                        </select>
                      </div><br>
                    <div>
                      <label>Level </label>
                      <select  value=""  name="level_id" id="" required class="form-select shadow-none">
                        <option selected>Select level</option>
                        <option value="1">ND </option>
                        <option value="2">HND</option>
                      </select>
                    </div><br>
                    <div>
                      <label>Study Mode</label>
                      <select name="study_mode_id" id="" required class="form-select shadow-none">
                        <option value=""  selected>Select Study Mode</option>
                        <option value="1">FULL TIME </option>
                        <option value="2">PART TIME</option>
                      </select>
                    </div><br>

                    <div>
                      <div>
                          <label>Student Surname name</label>
                          <input type="text" name="lastname" required class="form-control shadow-none">
                        </div>
                  </div><br>
                    <div>
                        <div>
                            <label>Student First name</label>
                            <input type="text" name="firstname" required class="form-control shadow-none">
                          </div>
                    </div><br>

                    <div>
                      <div>
                          <label>Student Middle name</label>
                          <input type="text" name="middlename" required class="form-control shadow-none">
                        </div>
                  </div><br>
                    <div>
                        <div>
                            <label>Student Matric Number</label>
                            <input type="text" name="username" required class="form-control shadow-none">
                          </div>
                    </div><br>
                    <button type="submit" class="btn" style="background-color: #068F3F;color:white;">  Upload </button>
                </form>
            </div>
        </div>
    </div>
</div>
<%- include('../component/staff-sidebar.ejs')%>
    <section class="main_content dashboard_part large_header_bg">
      <%- include('../component/staff-profile-info.ejs')%>

      <div class="main_content_iner">
        <div class="container-fluid p-0">
          <div class="col-lg-6">
            <div class="row">
              <div class="col-lg-4">
                <button type="button" class="btn" onclick="openSideNavSingle()" style="background-color: #068F3F;color:white;">Add  Student </button>
              </div><br>
              <div class="col-lg-4">
                <button type="button" class="btn" onclick="openSideNav()" style="background-color: #068F3F;color:white;">Upload Bulk Student </button>
              <br>
              </div><br>
              <div class="col-lg-4">
                <a href="/assets/template.xlsx" download="Student Template" class="btn"  style="background-color: #1f2220;color:white;">Download Template</a>
              </div>
            </div>
          </div><br>
            <% if(success == true){ %>
                <div class="alert alert-success" role="alert">
                Student(s) successfully Uploaded!
                </div>
            <%}%>
            <%if(err){%>
                <div class="alert alert-danger" role="alert">
                Error occured: <%=err%>
                </div>
            <%}%>
          <div class="row">
            <div class="col-lg-12">
              <div class="white_card card_height_ mb_30">
                <div class="white_card_header">
                  <div class="box_header m-0">
                    <div class="main-title">
                      <div class="col-lg-12 mb-3">  <h3 class="m-0">All Student </h3></div>
                    </div>
                    </div>
                    <div class="row">
                      <div class="col-lg-3 mt-3">
                       <div class="d-flex justify-content-space-between">
                        <div class="bg-col mx-3 ">
                          <img src="img/icon/open-book-svgrepo-com.svg" alt="" height="30px" width="30px">
                        </div>
                        <div>
                          <h3><%= students.length%></h3>
                          <p>All</p>
                        </div>
                       </div>
                      </div>
                      <div class="col-lg-3 mt-3"> 
                         <div class="d-flex justify-content-space-between">
                        <div class="bg-col mx-3 ">
                          <img src="img/icon/open-book-svgrepo-com.svg" alt="" height="30px" width="30px">
                        </div>
                        <div>
                          <h3><%= totalFT %> </h3>
                          <p>Total FT Student</p>
                        </div>
                       </div></div>
                      <div class="col-lg-3 mt-3">  <div class="d-flex justify-content-space-between">
                        <div class="bg-col mx-3 ">
                          <img src="img/icon/open-book-svgrepo-com.svg" alt="" height="30px" width="30px">
                        </div>
                        <div>
                          <h3><%= totalPT%> </h3>
                          <p>Total PT Student</p>
                        </div>
                       </div></div>
                      <div class="col-lg-3 mt-3">  <div class="d-flex justify-content-space-between">
                        <div class="bg-col mx-3 ">
                          <img src="img/icon/open-book-svgrepo-com.svg" alt="" height="30px" width="30px">
                        </div>
                        <div>
                          <h3><%= totalHND %> / <%= totalND %></h3>
                          <p>HND/ND</p>
                        </div>
                       </div></div>
                    </div>
                    </div>
              </div>
            </div>
            <div class="col-lg-12">
              <div class="white_card card_height_100 mb_30">
                <div class="white_card_header">
                  <div class="box_header m-0">
                    <div class="main-title">
                      <h3 class="m-0">Student</h3>
                    </div>
                  </div>
                </div>
                <div class="white_card_body">
                  <div class="QA_section">
                    <div class="row">
                      <div class="col-lg-4 col-sm-3 col-md-3">
                        <label>Student Level(HND/ND)</label>
                        <select name="" id="" class="form-select studentRecordFilter shadow-none">
                          <option selected>Select Level</option>
                          <option value="1 level">National Diploma(ND)</option>
                          <option value="2 level">Higher National Diploma(HND)</option>
                        </select>
                      </div>
                      <div class="col-lg-4"> 
                        <label>Study Mode(FT/PT)</label>
                        <select name="" id="" class="form-select studentRecordFilter shadow-none">
                          <option selected>Select Mode</option>
                          <option value="1 study_mode">FULL TIME(FT)</option>
                          <option value="2 study_mode">PART TIME(PT)</option>
                        </select>
                      </div>

                      <div class="col-lg-4 m-0">
                        <label>Export Table</label>
                        <select name="" id="" class="form-select shadow-none">
                          <option selected>Export</option>
                          <option value="completed">Csv</option>
                        </select>
                      </div>
                    </div><br>
                    <div class="white_box_tittle list_header">
                      <div class="box_right d-flex lms_block">
                        <div class="serach_field_2">
                          <div class="search_inner">
                              <div class="search_field">
                                <input
                                  type="text"
                                  placeholder="Search content here..."
                                  id="studentSearchFilter"
                                />
                              </div>
                              <button type="submit">
                                <i class="ti-search"></i>
                              </button>
                          </div>
                        </div>
                      </div>
                    </div>
                    <div class="QA_table mb_30">
                      <table class="table lms_table_active">
                        <thead>
                          <tr>
                            <th scope="col">Student</th>
                            <th scope="col">Matric Number</th>
                            <th scope="col">Level</th>
                            <th scope="col">Study Mode</th>
                            <th scope="col">Contact</th>
                            <th scope="col">Actions</th>
                          </tr>
                        </thead>
                        <tbody id="studentList">
                          <% if(students && students.length > 0){
                            for(var student of students){
                          %>
                          <tr>
                            <td>
                            <div class="container">
                              <div class="row">
                                <!-- <div class="col-lg-6"> <div class="profile_info">
                                   <img src="img/client_img.png" alt="#" />
                                 </div></div> -->
                                <div class="col-lg-12"><%= student?.firstname %> <%= student?.middlename%> <%= student?.lastname%></div>
                              </div>
                            </div>
                            </td>
                            <td><%= student?.user?.username %> </td>
                            <td><%= student?.level?.name %> </td>
                            <td><%= student?.study_mode?.name %> </td>
                            <td><%= student?.user?.email  %> <br/> <%= student?.user?.phone  %></td>
                            <td><a href="student-account?user_id=<%=student?.user?.id%>&type=student" target="_blank" rel="noopener noreferrer"><i class="ti-eye"></i></a></td>

                          </tr>
                          <%}}else{%>
                            <p>No record found</p>
                          <%}%>
                          
                        </tbody>
                      </table>
                    </div>
                  </div>
                </div>
              </div>
            </div>
                
            </div>
            <footer class="footer footer-light  footer-static  footer1">
              <p class="clearfix mb-0">
                <span class="float-md-start d-block d-md-inline-block mt-25 text-center">COPYRIGHT &copy;
                  <script>document.write(new Date().getFullYear())</script><a class="ms-25" href="">CORASS</a>,
                  <span class="d-inline-block">All rights Reserved</span>
                </span>
                <span class="float-md-end d-block text-center">Centralized Online Research Assessment and Submission System<i data-feather="file-text"></i></span>
              </p>
            </footer>
           
            
           
            <script>
              function openSideNav() {
                document.getElementById("uploadSidenav").style.width = "350px";
              }
              
              function closeSideNav() {
                document.getElementById("uploadSidenav").style.width = "0";
              }

              function openSideNavSingle() {
                document.getElementById("uploadSidenavSingle").style.width = "350px";
              }
              
              function closeSideNavSingle() {
                document.getElementById("uploadSidenavSingle").style.width = "0";
              }
              </script>
    <script src="js/jquery1-3.4.1.min.js"></script>

    <script src="js/popper1.min.js"></script>

    <script src="js/bootstrap1.min.js"></script>

    <script src="js/metisMenu.js"></script>

    <script src="vendors/count_up/jquery.waypoints.min.js"></script>

    <script src="vendors/chartlist/Chart.min.js"></script>

    <script src="vendors/count_up/jquery.counterup.min.js"></script>

    <script src="vendors/niceselect/js/jquery.nice-select.min.js"></script>

    <script src="vendors/owl_carousel/js/owl.carousel.min.js"></script>

    <script src="vendors/datatable/js/jquery.dataTables.min.js"></script>
    <script src="vendors/datatable/js/dataTables.responsive.min.js"></script>
    <script src="vendors/datatable/js/dataTables.buttons.min.js"></script>
    <script src="vendors/datatable/js/buttons.flash.min.js"></script>
    <script src="vendors/datatable/js/jszip.min.js"></script>
    <script src="vendors/datatable/js/pdfmake.min.js"></script>
    <script src="vendors/datatable/js/vfs_fonts.js"></script>
    <script src="vendors/datatable/js/buttons.html5.min.js"></script>
    <script src="vendors/datatable/js/buttons.print.min.js"></script>
    <script src="js/chart.min.js"></script>

    <script src="vendors/progressbar/jquery.barfiller.js"></script>

    <script src="vendors/tagsinput/tagsinput.js"></script>
<!--Start of Tawk.to Script-->
<script type="text/javascript">
  var Tawk_API=Tawk_API||{}, Tawk_LoadStart=new Date();
  (function(){
  var s1=document.createElement("script"),s0=document.getElementsByTagName("script")[0];
  s1.async=true;
  s1.src='https://embed.tawk.to/61c33018c82c976b71c2a947/1fnh77ocr';
  s1.charset='UTF-8';
  s1.setAttribute('crossorigin','*');
  s0.parentNode.insertBefore(s1,s0);
  })();
</script>
<!--End of Tawk.to Script-->
<!-- END: Page JS-->
    <script src="vendors/text_editor/summernote-bs4.js"></script>
    <script src="vendors/am_chart/amcharts.js"></script>

    <script src="vendors/scroll/perfect-scrollbar.min.js"></script>
    <script src="vendors/scroll/scrollable-custom.js"></script>
    <script src="vendors/chart_am/core.js"></script>
    <script src="vendors/chart_am/charts.js"></script>
    <script src="vendors/chart_am/animated.js"></script>
    <script src="vendors/chart_am/kelly.js"></script>
    <script src="vendors/chart_am/chart-custom.js"></script>
    
<script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>
    <script src="js/custom.js"></script>
    <script src="js/corass.js"></script>
  </body>
</html>
