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

<head>
	<meta http-equiv="X-UA-Compatible" content="IE=edge" />
	<title>Kategori Pasien - 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">Kategori Pasien</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('KategoriPasien') ?>">Kategori Pasien</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 kategori Pasien</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="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>Nama</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><?= $row->nama ?></td>
														<td class="text-center"  style="padding:0px !important;">
															<a href="javascript:;" data-id="<?= $row->id ?>" data-name="<?= $row->nama ?>" 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 ?>" 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('JenisPelayanan/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>Nama</label>
																<input id="nama" name="nama" type="text" class="form-control" placeholder="Nama kategori pasien" required>
															</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 Kategori Pasien</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">
		// 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 + "/KategoriPasien/edit/" + id,
				type: "GET",
				dataType: "json",
				data: {},
				beforeSend: function() {},
				success: function(result) {
					$('#formData').attr('action', site_url + "/KategoriPasien/update");
					$("#modal-title").text("Edit Data");
					$("#id").val(result.data.id);
					$("#nama").val(result.data.nama);
					$("#form-modal").modal("show");
				},
			});
		});

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

		$('#btn-add').click(function(event) {
			event.preventDefault();
			$('#formData').attr('action', site_url + "/KategoriPasien/save");
			$("#modal-title").text("Tambah Data");
			$("#id").val("");
			$("#nama").val("");
			$("#form-modal").modal("show");
		});
	</script>
</body>

</html>