|
- <link href="/assets/owl.carousel.min.css" rel="stylesheet">
- <body>
- <!-- Sidenav -->
- <% include ../partials/sidebar %>
- <!-- Main content -->
- <div class="main-content">
- <!-- Top navbar -->
- <% include ../partials/navbar %>
- <!-- Header -->
- <% include ../partials/material/header %>
- <!-- Page content -->
- <div class="container-fluid mt--7">
- <div class="col-12 mb-5">
- <div class="card card-profile shadow">
- <div class="card-header text-center border-0 pt-8 pt-md-4 pb-0 pb-md-4">
- <div class="text-center">
- <h2>
- <%= locals.Title %>
- </h3>
- <%
- var options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' };
- var date = new Date(Presented);
- %>
- <small class="font-weight-light"><strong><%= locals.Name %></strong> <%= date.toLocaleDateString("id-ID", options) %></small>
- <hr class="my-4" />
- </div>
- <p class="text-left" style="text-indent: 2em;"><%= Description %></p>
- </div>
- </div>
- </div>
-
- <div class="col-12 mb-5">
- <div class="card bg-secondary shadow">
- <div class="card-header bg-white border-0">
- <div class="row align-items-center">
- <div class="col-8">
- <h3 class="mb-0">File Materi :</h3>
- </div>
- </div>
- </div>
- <div class="card-body">
- <ul>
- <% for(var i=0; i<Attachments.data.length; i++) {%>
- <li><a target="_blank" href="<%= Attachments.data[i].attributes.url %>" download="<%= Attachments.data[i].attributes.name %>"><%= Attachments.data[i].attributes.name %></a></li>
- <% } %>
- </ul>
- </div>
- </div>
- </div>
-
- <div class="col-12 mb-5">
- <div class="card bg-secondary shadow">
- <div class="card-header bg-white border-0">
- <div class="row align-items-center">
- <div class="col-8">
- <h3 class="mb-0">Peserta : <a href="#" class="openParticipants" value="<%= locals.id %>"><small> <%= participants.data.length %> peserta</small></a></h3>
- </div>
- </div>
- </div>
- <div class="card-body">
- <div class="table-responsive">
- <table id="participantsTable" class="table align-items-center table-flush">
- <thead class="thead-light">
- <tr>
- <th scope="col">No</th>
- <th scope="col">Name</th>
- <th scope="col">Company</th>
- <th scope="col">Division</th>
- <th scope="col">Email</th>
- </tr>
- </thead>
- <tbody>
- <% for(var i=0; i<((participants.data.length>9)?9:participants.data.length); i++) {%>
- <tr>
- <th scope="row"><%= i+1 %></th>
- <td><%= participants.data[i].attributes.Name %></td>
- <td><%= participants.data[i].attributes.Company %></td>
- <td><%= participants.data[i].attributes.Division %></td>
- <td><%= participants.data[i].attributes.Email %></td>
- </tr>
- <% } %>
- </tbody>
- </table>
- </div>
- </div>
- </div>
- </div>
-
- <div class="col mb-5">
- <div class="card bg-secondary shadow">
- <div class="card-header bg-white border-0">
- <div class="row align-items-center">
- <div class="col-8">
- <h3 class="mb-0">Kegiatan : <small> <%= Images.data?Images.data.length:0 %> gambar</small></h3>
- </div>
- </div>
- </div>
- <div class="card-body">
- <div class="owl-carousel owl-theme">
- <% for(var i=0; i<(Images.data?Images.data.length:0); i++) {%>
- <div class="item">
- <img src="<%= Images.data[i].attributes.url %>">
- </div>
- <% } %>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
-
- <% include ../partials/dashboard/modal_participants %>
-
- <!-- Include scripts -->
- <% include ../partials/scripts %>
- <script src="/vendor/owl-carousel/owl.carousel.min.js"></script>
- <script>
- $('.owl-carousel').owlCarousel({
- items:1,
- margin:10,
- autoHeight:true
- })
- </script>
- </body>
|