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

<head>
	<meta http-equiv="X-UA-Compatible" content="IE=edge" />
	<title>Pengunjung - Peramalan</title>
	<meta content='width=device-width, initial-scale=1.0, shrink-to-fit=no' name='viewport' />
	<link rel="icon" href="<?php echo base_url() ?>assets/img/icon.ico" type="image/x-icon" />

	<!-- Fonts and icons -->
	<?php $this->load->view('_partial/css.php') ?>
</head>

<body>
	<div class="wrapper">
		<?php $this->load->view('_partial/header.php') ?>

		<!-- Sidebar -->
		<?php $this->load->view('_partial/sidebar') ?>
		<!-- End Sidebar -->

		<div class="main-panel">
			<div class="content">
				<div class="panel-header">
					<div class="page-inner py-5">
						<div class="page-header">
							<h4 class="page-title">Pengunjung</h4>
							<ul class="breadcrumbs">
								<li class="nav-home">
									<a href="<?php echo base_url('dashboard') ?>">
										<i class="flaticon-home"></i>
									</a>
								</li>
								<li class="separator">
									<i class="flaticon-right-arrow"></i>
								</li>
								<li class="nav-item">
									<a href="<?php echo base_url('Pengunjung') ?>">Pengunjung</a>
								</li>
							</ul>
						</div>
					</div>
				</div>
				<div class="page-inner mt--5">
					<div class="row mt--2">
						<div class="col-md-12">
							<div class="card">
								<div class="card-header">
									<div class="d-flex align-items-center">
										<h4 class="card-title">Data Pengunjung</h4>
										<?php if (validation_errors()) { ?>
											<div class="alert alert-warning alert-dismissible fade show" role="alert">
												<strong>Perhatian!!</strong> <?php echo validation_errors(); ?>
												<button type="button" class="close" data-dismiss="alert" aria-label="Close">
													<span aria-hidden="true">&times;</span>
												</button>
											</div>
										<?php } ?>
										<button class="btn btn-success btn-round ml-auto" id="btn-add">
											<i class="fa fa-plus"></i>
											Tambah Data
										</button>
									</div>
								</div>
								<div class="card-body">
									<?php if ($this->session->flashdata('success')) : ?>
										<div class="alert alert-success alert-dismissible fade show" role="alert">
											<?= $this->session->flashdata('success'); ?>
											<button type="button" class="close" data-dismiss="alert" aria-label="Close">
												<span aria-hidden="true">&times;</span>
											</button>
										</div>
									<?php endif; ?>
									<?php if ($this->session->flashdata('hapus')) : ?>
										<div class="alert alert-danger alert-dismissible fade show" role="alert">
											<?= $this->session->flashdata('hapus'); ?>
											<button type="button" class="close" data-dismiss="alert" aria-label="Close">
												<span aria-hidden="true">&times;</span>
											</button>
										</div>
									<?php endif; ?>

									<div class="row mt-0 mb-3">
										<div class="col-md-3">
											<div class="form-group py-0 px-0">
												<label for="bulan">Bulan</label>
												<?php
												$bln = array('JANUARI', 'FEBRUARI', 'MARET', 'APRIL', 'MEI', 'JUNI', 'JULI', 'AGUSTUS', 'SEPTEMBER', 'OKTOBER', 'NOVEMBER', 'DESEMBER');
												?>
												<select class="form-control" name="bulan" id="bulan" onchange="pageLoad()">
													<option value="">ALL</option>
													<?php foreach ($bln as $key => $value) { ?>
														<option value="<?= $key+1 ?>" <?php if (isset($_GET['bulan'])) {
																						echo ($key+1 == $_GET['bulan'] ? ' selected ' : '');
																					} ?>><?= $value ?></option>
													<?php } ?>
												</select>
											</div>
										</div>
										<div class="col-md-2">
											<div class="form-group py-0 px-0">
												<label for="id_pelayanan_filter">Tahun</label>
												<select class="form-control" id="tahun" onchange="pageLoad()">
													<option value="">All</option>
													<?php foreach ($tahun as $t) { ?>
														<option value="<?= $t->tahun ?>" <?php if (isset($_GET['tahun'])) {
																							echo ($t->tahun == $_GET['tahun']) ? ' selected' : '';
																						} ?>><?= $t->tahun ?></option>
													<?php } ?>
												</select>
											</div>
										</div>
										<div class="col-md-4">
											<div class="form-group py-0 px-0">
												<label for="id_pelayanan_filter">Pelayanan</label>
												<select class="form-control" id="id_pelayanan_filter" onchange="pageLoad()">
													<option value="">All</option>
													<?php foreach ($pelayanan as $p) { ?>
														<option value="<?= $p->id ?>" <?php if (isset($_GET['id_pelayanan'])) {
																							echo ($p->id == $_GET['id_pelayanan']) ? ' selected' : '';
																						} ?>><?= $p->nama ?></option>
													<?php } ?>
												</select>
											</div>
										</div>
									</div>

									<div class="table-responsive">
										<table id="data-table" class="display table table-striped table-hover">
											<thead>
												<tr>
													<th style="width: 5%;" class="text-center">No.</th>
													<th>Tanggal</th>
													<th>Pasien</th>
													<th>Pelayanan</th>
													<th>Keterangan</th>
													<th style="width: 15%;" class="text-center">Action</th>
												</tr>
											</thead>
											<tbody>
												<?php
												$no = 1;
												foreach ($data as $row) {
												?>
													<tr>
														<td class="text-center"><?= $no++ ?>.</td>
														<td><?= format_date($row->tanggal, "d/m/Y") ?></td>
														<td><?= $row->nama_pasien ?></td>
														<td><?= $row->nama_pelayanan ?></td>
														<td><?= $row->keterangan ?></td>
														<td class="text-center" style="padding:0px !important;">
															<a href="javascript:;" data-id="<?= $row->id ?>" data-name="<?= $row->nama_pasien ?>" title="Edit data" class="btn btn-link btn-warning btn-edit">
																<i class="fa fa-edit"></i>
															</a>
															<a href="javascript:;" data-id="<?= $row->id ?>" data-name="<?= $row->nama_pasien ?>" title="Hapus data" class="btn btn-link btn-danger btn-hapus">
																<i class="fa fa-trash"></i>
															</a>
														</td>
													</tr>
												<?php } ?>
											</tbody>
										</table>
									</div>
								</div>

								<!-- MODAL ADD/EDIT -->
								<div class="modal fade" id="form-modal" tabindex="-1" role="dialog" aria-hidden="true">
									<div class="modal-dialog" role="document">
										<div class="modal-content">
											<div class="modal-header">
												<h5 id="modal-title">
													Tambah Data
												</h5>
												<button type="button" class="close" data-dismiss="modal" aria-label="Close">
													<span aria-hidden="true">&times;</span>
												</button>
											</div>
											<form action="<?= base_url('Pelayanan/save') ?>" method="POST" id="formData">
												<div class="modal-body">
													<input type="hidden" id="id" name="id" type="text" class="form-control">
													<div class="row">
														<div class="col-sm-12">
															<div class="form-group form-group-default">
																<label>Tanggal</label>
																<input id="tanggal" 
																	name="tanggal" 
																	type="date" 
																	class="form-control" 
																	placeholder="Tanggal" 
																	onfocus="disablePastDates()"
																	required>
															</div>
															<div class="form-group form-group-default">
																<label for="id_pasien">Pasien</label>
																<select class="form-control" name="id_pasien" id="id_pasien" required>
																	<option value="">- Pilih Pasien -</option>
																	<?php foreach ($pasien as $p) { ?>
																		<option value="<?= $p->id ?>"><?= $p->nama ?></option>
																	<?php } ?>
																</select>
															</div>
															<div class="form-group form-group-default">
																<label for="id_pelayanan">Pelayanan</label>
																<select class="form-control" name="id_pelayanan" id="id_pelayanan" required>
																	<option value="">- Pilih Pelayanan -</option>
																	<?php foreach ($pelayanan as $pl) { ?>
																		<option value="<?= $pl->id ?>"><?= $pl->nama ?></option>
																	<?php } ?>
																</select>
															</div>
                              <div class="form-group form-group-default">
																<label>Umur Bulan</label>
																<input id="umur_bulan" name="umur_bulan" type="number" class="form-control" placeholder="Umur Bulan">
															</div>
															<div class="form-group form-group-default">
																<label>Keterangan</label>
																<textarea id="keterangan" name="keterangan" class="form-control" placeholder="Keterangan / Keluhan"></textarea>
															</div>
														</div>
													</div>
												</div>

												<div class="modal-footer">
													<button type="button" class="btn btn-danger" data-dismiss="modal">Batal</button>
													<button type="submit" class="btn btn-primary">Simpan</button>
												</div>
											</form>
										</div>
									</div>
								</div>

								<!-- END MODAL ADD/EDIT -->

								<!-- ============ MODAL HAPUS =============== -->
								<div class="modal fade" id="modal-hapus" tabindex="-1" role="dialog" aria-labelledby="largeModal" aria-hidden="true">
									<div class="modal-dialog">
										<div class="modal-content">
											<div class="modal-header">
												<h5 class="modal-title">Hapus Pengunjung</h5>
												<button type="button" class="close" data-dismiss="modal" aria-label="Close">
													<span aria-hidden="true">&times;</span>
												</button>
											</div>
											<form id="formDelete" class="form-horizontal" method="post" action="">
												<div class="modal-body">
													<p>Apakah Anda yakin menghapus data <b><span id="txt-msg"></span></b> ?</p>
												</div>
												<div class="modal-footer">
													<button class="btn" data-dismiss="modal" aria-hidden="true">Tutup</button>
													<button type="submit" class="btn btn-danger">Hapus</button>
												</div>
											</form>
										</div>
									</div>
								</div>
								<!-- END MODAL HAPUS -->

							</div>
						</div>
					</div>
				</div>
			</div>
			<?php $this->load->view('_partial/footer') ?>
		</div>
	</div>
	<?php $this->load->view('_partial/js') ?>

	<script type="text/javascript">
		$('#id_pasien').select2();
		$('#id_pelayanan').select2();
		$('#id_pelayanan_filter').select2();
		$('#bulan').select2();
		$('#tahun').select2();

		function disablePastDates() {
			var today = new Date();
			var dd = String(today.getDate()).padStart(2, '0');
			var mm = String(today.getMonth() + 1).padStart(2, '0'); //January is 0!
			var yyyy = today.getFullYear();

			today = yyyy + '-' + mm + '-' + dd;
			document.getElementById("tanggal").setAttribute("min", today);
		}

		function pageLoad() {
			let id_pelayanan = $("#id_pelayanan_filter").val();
			let bulan = $("#bulan").val();
			let tahun = $("#tahun").val();
			window.location.href = site_url + "Pengunjung?id_pelayanan=" + id_pelayanan + '&bulan=' + bulan + '&tahun=' + tahun
		};

		// Add Row
		$('#data-table').DataTable({
			"pageLength": 10,
		});

    $(document).on('click', '.btn-edit', function(event) {
      event.preventDefault();
			var id = $(this).attr("data-id");
			$.ajax({
				url: site_url + "/Pengunjung/edit/" + id,
				type: "GET",
				dataType: "json",
				data: {},
				beforeSend: function() {},
				success: function(result) {
					$('#formData').attr('action', site_url + "/Pengunjung/update");
					$("#modal-title").text("Edit Data");
					$("#id").val(result.data.id);
					$("#tanggal").val(result.data.tanggal);
					$("#id_pasien").val(result.data.id_pasien).change();
					$("#id_pelayanan").val(result.data.id_pelayanan).change();
					$("#keterangan").val(result.data.keterangan);
					$("#form-modal").modal("show");
				},
			});
		});

    $(document).on('click', '.btn-hapus', function(event) {
			event.preventDefault();
			var id = $(this).attr("data-id");
			$.ajax({
				url: site_url + "/Pengunjung/edit/" + id,
				type: "GET",
				dataType: "json",
				data: {},
				beforeSend: function() {},
				success: function(result) {
					$('#formDelete').attr('action', site_url + "/Pengunjung/delete/" + id);
					$("#txt-msg").text(result.data.nama_pasien);
					$("#modal-hapus").modal("show");
				},
			});
		});

		$('#btn-add').click(function(event) {
			event.preventDefault();
			$('#formData').attr('action', site_url + "/Pengunjung/save");
			$("#modal-title").text("Tambah Data");
			handleReset()
			$("#form-modal").modal("show");
		});

		function handleReset() {
			$("#id").val("");
			$("#tanggal").val("");
			$("#id_pasien").val("");
			$("#id_pelayanan").val("");
			$("#keterangan").val("");
		}
	</script>
</body>

</html>