<!DOCTYPE html>
<html lang="en">
<head>

    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
    <title>Siwes Submissions - CORASS</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/staff_sidebar/style.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="css/metisMenu.css">

    <link rel="stylesheet" href="css/style1.css" />
    <link rel="stylesheet" href="css/colors/default.css" id="colorSkinCSS">
    <!-- toastr -->
    <link href="js/toastr.css" rel="stylesheet">
</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 New Document</h5>
            <div class="row">
                <div class="col-lg-12">
                    <form method="post" enctype="multipart/form-data" id="projectUpload">
                        <div>
                        <label>SIWES <Title></Title></label>
                        <input class="form-control" type="text" required name="title" id="title"  placeholder="Siwes Title">
                      </div><br>
                      <div>
                        <label for="text">Supervisor</label><br>
                        <input class="form-control" readonly type="text" value=" <%= supervisor?.lecturer?.profile?.lastname %> <%= supervisor?.lecturer?.profile?.middlename %> <%= supervisor?.lecturer?.profile?.firstname %> " >
                      </div><br>
                    <div class="row ">
                      <div class="col-lg-12">
                        <label for="phone" class="user_id">File (pdf, doc only): </label>
                        <input type="file" name="file" required class="form-control" placeholder="upload">
                      </div>
                    </div><br>
                    <div>
                        <label for="text">Description</label><br>
                        <textarea name="description" id="description" cols="4" rows="3" class="form-control"></textarea>
                      </div>
                    <div style="display: flex;">
                        <div class="mt-3" style="margin-left: 15px;">
                            <button type="submit" class="btn" style="background-color: #068F3F;color:white;">  Submit </button>
                         </div>
                        <div class="mt-3" style="margin-left: 15px;">
                           <button onclick="closeSideNav()" type="button" class="btn btn-outline-success">Cancel</button>
                        </div>
                    </div>
                
                </form>
                </div>
            </div>
        </div>
    </div>


      <%- include('../component/student-sidebar.ejs')%>
    <section class="main_content dashboard_part large_header_bg">

        <%- include('../component/student-profile-info.ejs')%>

        <div class="main_content_iner ">
            <div class="container-fluid p-0 ">
                    
                  <div class="content-body">
        
                    <section>
                        <h5>Student Industrial Work Experience Scheme</h5>
                        <p class="mb-2">
                          Summary of uploaded SIWES document with its status and grade appears here. <br>To upload a new SIWES document, click on the action button below.
                        </p>
                <div class="card">
                    <div class="card-datatable table-responsive pt-0">
                        <div class="submit_button  mt-3" style="margin-left: 15px;">
                            <a class="btn" onclick="openSideNav()" style="background-color:  rgb(42, 127, 42); color: white;">Upload Siwes Document</a>
                        </div>
                        <table class="app-topic-table table" style="margin-top: 10px;">
                            <thead class="table" style="background-color: rgb(231, 230, 230); margin-top: 10px;">
                            <tr>
                                <th>Title</th>
                                <th>Status</th>
                                <th>Date Uploaded</th>
                                <th>Action</th>
                            </tr>
                            </thead>
                            <tbody>
                                <% if(projects && projects.length > 0){
                                    for(var project of projects){
                                  %>
                                  <tr>
                                      <td class="nowrap"><%= project.title %></td>
                                      <td>
                                        <%if(project.is_approved){%>
                                            Approved
                                        <%}else{%>
                                        Pending
                                        <%}%>
                                      </td>
                                        <td><%= new Date(project.createdAt).toLocaleDateString('en-us', { weekday:"long", year:"numeric", month:"short", day:"numeric"})  %></td>

                                      <td>
                                        <!-- <button class="btn btn-success">View</button> -->
                                        <a class="btn btn-danger" href="/siwes-delete/<%= project.id %>">Delete</a>
                                      </td>
                                  </tr>
                                  <%}}%>
                            </tbody>
                        </table>
                    </div>
                </div>
            </section>
                  </div>           
        </div>
        </div>

        <div class="footer_part">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-lg-12">
                        <footer class="footer footer-light  footer-static">
                            <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>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <div id="back-top" style="display: none;">
        <a title="Go to Top" href="#">
            <i class="ti-angle-up"></i>
        </a>
    </div>
    <script>
        function openSideNav() {
          document.getElementById("uploadSidenav").style.width = "350px";
        }
        
        function closeSideNav() {
          document.getElementById("uploadSidenav").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="js/toastr.min.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>

    <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>
        $(document).ready(function (e) {
        $("#projectUpload").on('submit',(function(e) {
          e.preventDefault();
          console.log(new FormData(this))
          $.ajax({
                url: "/siwes-upload",
          type: "POST",
          data:  new FormData(this),
          contentType: false,
                cache: false,
          processData:false,
          success: function(data)
              {
              if(data=='invalid')
              {
                toastr.error(
                    "Invalid file type",
                    "ERROR", {
                      timeOut: 9000
                    }
                  );
              }
            else
            {
              alert("Document uploaded successfully")
              location.reload();
            }
              },
            error: function(e) 
              {
                toastr.error(
                    "Invalid file type",
                    "ERROR", {
                      timeOut: 9000
                    }
                  );
              }          
            });
        }));
        });
      </script>
    <script src="js/custom.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="js/toastr-error-handler.js"></script> -->
</body>
</html>