<!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>Staff Dashboard</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">
  
 
<%- 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="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">My Assigned Projects</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><%= projects.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><%= projectInprogress[0].projectInprogress%> </h3>
                          <p>Inprogress</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><%= projectCompleted[0].projectInprogress || 0%> </h3>
                          <p>Completed</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><%= projectRejected[0].projectInprogress || 0%> </h3>
                          <p>Rejected</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">Projects</h3>
                    </div>
                  </div>
                </div>
                <div class="white_card_body">
                  <div class="QA_section">
                    <div class="row">
                      <div class="col-lg-3 col-sm-3 col-md-3">
                        <label> Level(HND/ND)</label>
                        <select name="" id="" class="form-select dashboardFilter 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-3"> 
                        <label>Study Mode(FT/PT)</label>
                        <select name="" id="" class="form-select dashboardFilter 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-3"><label>Project Type</label>
                        <select name="" id="" class="form-select dashboardFilter shadow-none">
                          <option selected>Select Project Type</option>
                          <option value="1 projectTye">Final Year Research Report</option>
                          <option value="4 projectTye">SIWES</option>
                         
                        </select></div>
                      <div class="col-lg-3"><label>Status</label>
                        <select name=""id="" class="form-select  dashboardFilter shadow-none">
                          <option selected>Select Status</option>
                          <option value="false status">InProgress</option>
                          <option value="true status">Completed </option>
                          <option value="false status">Rejected </option>
                        </select></div>
                    </div><br>
                    <div class="white_box_tittle list_header">
                      <h4>Table</h4>
                      <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="studentSearch"
                                />
                              </div>
                              <button type="submit">
                                <i class="ti-search"></i>
                              </button>
                          </div>
                        </div>
                        <div class="col-lg-3 m-0">
                          <select name="" id="" class="form-select shadow-none">
                            <option selected>Export</option>
                            <option value="inprogress">Print</option>
                            <option value="completed">Csv</option>
                            <option value="rejected">Pdf</option>
                            <option value="rejected">Copy</option>
                          </select>
                        </div>
                      </div>
                    </div>
                    <div class="QA_table mb_30">
                      <table id="studentList" class="table lms_table_active">
                        <thead>
                          <tr>
                            <th scope="col">Topic</th>
                            <th scope="col">Document Category</th>
                            <th scope="col">Student</th>
                            <th scope="col">Student Matric</th>
                            <th scope="col">Status</th>
                            <th scope="col">Date Submitted</th>
                            <th scope="col">Actions</th>
                          </tr>
                        </thead>
                        <tbody id="projectList">
                          <% if(projects && projects.length > 0){
                            for(var project of projects){
                          %>
                          <tr>
                            <th scope="row">
                              <a href="#" class="question_content">
                                <%= project.project_topic?.topic %>
                              </a>
                            </th>
                            <td>
                              <%= project.document_category?.name %>
                            </td>
                            <td>
                                <div class="col-lg-12"> <%= project.project_topic?.student?.profile?.firstname %> <%= project.project_topic?.student?.profile?.middlename%> <%= project.project_topic?.student?.profile?.lastname%></div>

                            </td>
                            <td><%= project.project_topic?.student?.username %> </td>
                            <% if (project.active == false){%>
                              <td class=""><span class="badge bg-danger">Rejected</span></td>
                            <%}else if(project.is_approved == false){%>
                              <td class=""><span class="badge bg-warning">Unapproved</span></td>
                            <%}else if(project.is_approved == true){%>
                              <td class=""><span class="badge bg-success">Approved</span></td>
                            <%}%>%>
                            <td><%= new Date(project.createdAt).toLocaleDateString('en-us', { weekday:"long", year:"numeric", month:"short", day:"numeric"})  %></td>
                            <td><a  target="_blank"  href="/view-project/<%= project.id %>"><i class="ti-eye"></i></a></td>
                          </tr>
                          <%}}%>
                          
                        </tbody>
                      </table>
                    </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>
                </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 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>
<!--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/progressbar/jquery.barfiller.js"></script>

    <script src="vendors/tagsinput/tagsinput.js"></script>

    <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>
