<style type="text/css">
	table,
	th,
	tr,
	td {
		text-align: center;
	}

	.swal2-popup {
		font-family: inherit;
		font-size: 1.2rem;
	}

	.btn-group,
	.btn-group-vertical {
		position: relative;
		display: initial;
		vertical-align: middle;
	}

</style>
<?php if ($this->session->flashdata('message')) { ?>
<div class="col-lg-12 alerts">
	<div class="alert alert-dismissible alert-success">
		<button type="button" class="close" data-dismiss="alert">&times;</button>
		<h4> <i class="icon fa fa-check"></i>Berhasil</h4>
		<p><?php echo $this->session->flashdata('message'); ?></p>
	</div>
</div>
<?php } else { } ?>
<section class="content">
	<div class="row">
		<div class="col-md-12">
			<div class="box box-info">
				<div class='box-header  with-border'>
					<h3 class='box-title'>Data Siswa</h3>
					<div class="pull-right">
						<?php
						echo anchor('siswa/post', 'Tambah data', array('class' => 'btn btn-success'))
						?>
						<button class="btn btn-primary" data-toggle="modal" data-target="#importModal">Import Excel</button>
					</div>
					<!-- Tambahkan tombol "Import Excel" -->
					

					<!-- Modal Import Excel -->
					<div class="modal fade" id="importModal" tabindex="-1" role="dialog"
						aria-labelledby="importModalLabel" aria-hidden="true">
						<div class="modal-dialog" role="document">
							<div class="modal-content">
								<div class="modal-header">
									<h5 class="modal-title" id="importModalLabel">Import Data Excel</h5>
									<button type="button" class="close" data-dismiss="modal" aria-label="Close">
										<span aria-hidden="true">&times;</span>
									</button>
								</div>
								<div class="modal-body">
									<?php echo form_open_multipart('siswa/import_excel'); ?>
									<div class="form-group">
										<label for="excel_file">Pilih File Excel</label>
										<input type="file" class="form-control-file" id="excel_file" name="excel_file"
											required>
									</div>
									<div class="form-group">
										<label for="excel_file">Download Contoh File Import <a href="<?= base_url('uploads/importsiswa.xlsx') ?>">import_siswa.xlsx</a></label>
										
									</div>
								</div>
								<div class="modal-footer">
									
									<button type="button" class="btn btn-secondary" data-dismiss="modal">Tutup</button>
									<button type="submit" class="btn btn-primary">Import</button>
									<?php echo form_close(); ?>
								</div>
							</div>
						</div>
					</div>

				</div>
				<div class="box-body">
					<table id="myTable" class="table table-bordered table-hover ">
						<thead>
							<tr>
								<th>No.</th>
								<th>NIS</th>
								<th>Nama Siswa</th>
								<th>Kelas</th>
								<th>Status</th>
								<th>Aksi</th>
							</tr>
						</thead>
						<tbody>
							<?php $no = 0;
							foreach ($record as $r) { ?>
							<tr>
								<td><?php echo ++$no; ?></td>
								<td><?php echo $r->nis; ?></td>
								<td><?php echo $r->nama; ?></td>
								<td><?php echo $r->kelas; ?></td>
								<td><?php echo $r->status; ?></td>
								<td><?php
										echo anchor(site_url('siswa/edit/' . $r->nis), '<i class="fa fa-pencil-square-o fa-lg"></i>&nbsp;&nbsp;Edit', array('title' => 'edit', 'class' => 'btn btn-sm btn-warning'));
										echo '&nbsp';
										echo anchor(site_url('siswa/hapus/' . $r->nis), '<i class="fa fa-trash fa-lg"></i>&nbsp;&nbsp;Hapus', 'title="delete" class="btn btn-sm btn-danger "');
										?>
								</td>
							</tr>
							<?php } ?>
						</tbody>
					</table>
				</div>
			</div>
		</div>
	</div>
</section>
<script src="<?php echo base_url() ?>assets/app/js/alert.js"></script>
<script>
	$(document).ready(function () {
		$('#myTable').DataTable({

			"dom": '<"top row"<"col-md-4" l  ><"col-md-4" B  ><"col-md-4" and f>>rt<"bottom row"<"col-md-6" i> <"col-md-6" p>>',
			
			buttons: [{
					extend: 'csvHtml5',
					exportOptions: {
						columns: [0, 1, 2, 3, 4, ],
					},
				},
				{
					extend: 'excelHtml5',
					title: 'DATA SISWA',
					exportOptions: {
						columns: [0, 1, 2, 3, 4],
					},
				},
				{
					extend: 'copyHtml5',
					title: 'DATA SISWA',
					exportOptions: {
						columns: [0, 1, 2, 3, 4],
					},
				},
				{
					extend: 'pdfHtml5',
					oriented: 'portrait',
					pageSize: 'legal',
					title: 'DATA SISWA',
					download: 'open',
					exportOptions: {
						columns: [0, 1, 2, 3, 4],
					},
					customize: function (doc) {
						doc.content[1].table.widths = Array(doc.content[1].table.body[0].length +
							1).join('*').split('');
						doc.styles.tableBodyEven.alignment = 'center';
						doc.styles.tableBodyOdd.alignment = 'center';
					},
				},
				{
					extend: 'print',
					oriented: 'portrait',
					pageSize: 'A4',
					title: 'DATA SISWA',
					exportOptions: {
						columns: [0, 1, 2, 3, 4],
					},
				},
			],
			"fnDrawCallback": function () {
				$('.image-link').magnificPopup({
					type: 'image',
					closeOnContentClick: true,
					closeBtnInside: false,
					fixedContentPos: true,
					image: {
						verticalFit: true
					},
					zoom: {
						enabled: true,
						duration: 300 // don't foget to change the duration also in CSS
					},
				});
			}
		});
	});

</script>
