@extends('base.layout')

@section('content')
<div class="wrapper">
	<div class="container-fluid">
		<div class="row">
			<div class="col-lg-5">
				<div class="card-box ribbon-box">
					<div class="ribbon ribbon-warning">Search by Date Range</div>
					<p class="m-b-0"></p>
					<div class="form-row">
						<div class="form-group col-lg-4">
							<input type="text" name="mulai" id="mulai" class="form-control" placeholder="Start Date" autocomplete="off">
						</div>
						<div class="form-group col-lg-4">
							<input type="text" name="akhir" id="akhir" class="form-control" placeholder="End Date" autocomplete="off">
						</div>
						<div class="form-group col-lg-2">
							<button type="button" class="btn btn-warning" id="btnviewcustom"><i class="fa fa-search"></i></button>
						</div>
					</div>
				</div>
			</div>
			<div class="col-lg-5">
				<div class="card-box ribbon-box">
					<div class="ribbon ribbon-success">Cetak</div>
					<p class="m-b-0"></p>
					<div class="form-row">
						<div class="form-group col-lg-6">
							<input type="text" name="tglreport" id="tglreport" class="form-control">
						</div>
						<div class="form-group col-lg-6">
							<button type="button" class="btn btn-success" id="btncetakreport"><i class="fa fa-print"></i></button>
						</div>
					</div>
				</div>
			</div>
			<div class="col-lg-2">
				<button type="button" class="btn btn-block btn-primary" id="timeremaining">0</button>
				<button type="button" class="btn btn-block btn-danger" id="btnhariinidoank">Refresh</button>
			</div>
		</div>
		<div class="row">
            <div class="col-lg-12">
				<div class="card-box ribbon-box">
					<div class="ribbon ribbon-primary" id="judul">Queue</div>
					<p class="m-b-0"></p>
					<table id="gridkiriman" class="table table-striped table-bordered" style="width: 100%;">
						<thead>
							<tr>
								<th>Aksi</th>
								<th>No.RM</th>
								<th>Nama</th>
								<th>No.Sample</th>
								<th>Asal Pasien</th>
								<th>Daftar</th>
								<th>Order</th>
								<th>Kode</th>
								<th>Spesimen</th>
								<th>Status</th>
								<th>Batal Aksi</th>
							</tr>
						</thead>
						<tbody></tbody>
					</table>
				</div>
            </div>
        </div>
	</div>
</div>
<input type="hidden" name="_token" id="token" value="{{ csrf_token() }}">
<input type="hidden" id="master_set01" name="master_set01" value="ThisDay">
<input type="hidden" id="master_set02" name="master_set02" value="{{ Session('previlage') }}">
<input type="hidden" id="master_set03" name="master_set03" value="">
<input type="hidden" id="master_set04" name="master_set04" value="">
<input type="hidden" name="valcari" id="valcari">
<input type="hidden" name="valjenis" id="valjenis">

<div id="modalerror" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
				<h4 class="modal-title" id="myModalLabel">Error</h4>
			</div>
			<div class="modal-body">
				<form class="form-horizontal">
					<div class="form-group m-b-25">
						<div class="col-12">
							<input type="text" class="form-control" id="err_text">							
						</div>
					</div>
				</form>
			</div>
		</div><!-- /.modal-content -->
	</div><!-- /.modal-dialog -->
</div>
<div id="modaleditor" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="modaleditorLabel" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
				<h4 class="modal-title" id="modaleditorLabel">Edit Data</h4>
			</div>
			<div class="modal-body">
				<form class="form-horizontal">
					<div class="form-group col-lg-12">
						<label for="id_jenis" class="col-form-label">Jenis Pengobatan Terduga/Pasien TBC</label>
						<select class="form-control ekspertiseseletc" id="id_jenis" name="id_jenis">
							<option value="">Pilih Salah Satu</option>
							<option value="F">Follow Up</option>
							<option value="K">Kontrol Bulan Ke (isi form dibawa)</option>
							<option value="P">Pasca Pengobatan Bulan Ke (isi form dibawa)</option>
						</select>
					</div>
					<div class="form-group col-lg-12">
						<label for="id_bulan" class="col-form-label">Bulan Ke (khusus non follow up)</label>
						<select class="form-control" id="id_bulan" name="id_bulan">
							<option value="">Pilih Salah Satu</option>
							@for ($i = 1; $i <= 24; $i++)
								<option value="{{ $i }}">Bulan Ke - {{ $i }}</option>
							@endfor
						</select>
					</div>
				</form>
			</div>
			<div class="modal-footer">
				<input type="hidden" id="id_sample_edit">
				<button type="button" class="btn btn-secondary waves-effect" data-dismiss="modal">Close</button>
				<button type="button" class="btn btn-primary waves-effect waves-light" id="btnSaveEditor">Save changes</button>
			</div>
		</div><!-- /.modal-content -->
	</div><!-- /.modal-dialog -->
</div>
@endsection
@push('script')
<script type="text/javascript">
	var start = new Date();
	CountDownTimer(start, 'timeremaining');
	function CountDownTimer(dt, id) {
		var end 	= new Date(dt.getTime() + 60000);
		var _second = 1000;
		var _minute = _second * 60;
		var _hour 	= _minute * 60;
		var _day 	= _hour * 24;
		var timer;
		function showRemaining() {
			var now = new Date();
			var distance = end - now;
			if (distance < 0) {
				clearInterval(timer);
				var start = new Date();
				CountDownTimer(start, 'timeremaining');
				//$('#gridkiriman').DataTable().ajax.reload();
				return;
			}
			var days = Math.floor(distance / _day);
			var hours = Math.floor((distance % _day) / _hour);
			var minutes = Math.floor((distance % _hour) / _minute);
			var seconds = Math.floor((distance % _minute) / _second);
			document.getElementById(id).innerHTML ='Refresh in ';
			document.getElementById(id).innerHTML += seconds + 'secs';
		}
		timer = setInterval(showRemaining, 1000);
	}
	function btnMarking(id){
		$.post('{{ route("markPeriksa") }}', { id: id,  _token: '{{ csrf_token() }}'},function(data){
			$('#gridkiriman').DataTable().ajax.reload();
		});
	}
	function btnOpenEditor(id){
		$('#id_sample_edit').val(id);
		$('#id_jenis').val('');
		$('#id_bulan').val('');
		$('#modaleditor').modal('show');
	}
	function btnBatal(id){
		swal({
			title: 'Konfirmasi',
			text: 'Apakah anda yakin  ?',
			type: 'warning',
			showCancelButton: true,
			confirmButtonColor: '#d33',
			confirmButtonText: 'Ya, kembalikan',
			cancelButtonText: 'Tidak'
		}).then(function(result) {
			var confirmed = false;
			if (typeof result === 'boolean') {
				confirmed = result;
			} else if (result) {
				confirmed = !!(result.value || result.isConfirmed);
			}
			if (!confirmed) return;
			$.post('{{ route("batalPeriksaTerima") }}', { id: id, _token: '{{ csrf_token() }}' }, function (data) {
				swal({
					title: data.status || 'Sukses',
					text: data.message || 'Status berhasil diperbarui.',
					type: 'success',
				}).then(function () {
					$('#gridkiriman').DataTable().ajax.reload();
				});
			}).fail(function (xhr) {
				var response = xhr.responseJSON || {};
				swal({
					title: response.status || 'Gagal',
					text: response.message || 'Tidak dapat memperbarui status pemeriksaan.',
					type: 'error',
				});
			}).always(function () {
			});
		});
		
	}
    $(document).ready(function () {
		$("#tglreport").datepicker({format: 'yyyy-mm-dd'});
		$("#mulai").datepicker({format: 'yyyy-mm-dd'});
		$("#akhir").datepicker({format: 'yyyy-mm-dd'});
		$("#btnviewcustom").click(function() {
			var mulai=document.getElementById('mulai').value;
			var akhir=document.getElementById('akhir').value;
			if (mulai == ''){
				$("#err_text").val('Start Date Cannot Empty'); 
				$("#modalerror").modal('show'); 
			} else if (akhir == ''){
				$("#err_text").val('End Date Cannot Empty'); 
				$("#modalerror").modal('show'); 
			} else {
				$("#master_set01").val('searchbydate');
				$("#valjenis").val('searchbydate');
				$("#valcari").val('');
				$('#gridkiriman').DataTable().ajax.reload();
				var judul='Search Result by date Between '+mulai+' and '+akhir;
				$("#judul").html(judul);
			}
		});
		$("#btnSaveEditor").click(function() {
			var jenis=document.getElementById('id_jenis').value;
			var bulan=document.getElementById('id_bulan').value;
			var sampleId=document.getElementById('id_sample_edit').value;
			if (jenis != 'F' && bulan == ''){
				$("#err_text").val('Jika Jenis Pengobatan Terduga/Pasien TBC bukan Follow Up, maka Bulan Ke harus diisi'); 
				$("#modalerror").modal('show'); 
			} else {
				$.post('{{ route("markPeriksa") }}', { id: 'ubahnomorlab', jenis: jenis, bulan: bulan, sampleId: sampleId, _token: '{{ csrf_token() }}'},function(data){
					$('#gridkiriman').DataTable().ajax.reload();
				});
			}
		});
		$("#btnpencarian").click(function() {
			var set01=document.getElementById('valcari').value;
			var set02=document.getElementById('valjenis').value;
			var set03='inisaja';
			var judul='Search Result by key: '+set01;
			$("#valjenis").val(set02);
			$("#master_set01").val(set02);
			$("#judul").html(judul);
			$('#gridkiriman').DataTable().ajax.reload();
		});
		$("#btnhariinidoank").click(function() {
			$('#gridkiriman').DataTable().ajax.reload();
		});
		$('#btncetakreport').click(function () {
			var tanggal	= document.getElementById('tglreport').value;
			if (tanggal == ''){
				swal({
					title	: 'Mohon diLengkapi',
					text	: 'Data Tanggal Wajib di Isi',
					type	: 'error',
				});
			} else {
				var url = '{{url('/')}}/reportpenerimaansample?tanggal='+tanggal;
				window.location.href = url;
			}
		});
		$.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': '{{ csrf_token() }}'
            }
        });
		$('#gridkiriman').DataTable({
			scrollX			: true,
            processing		: true,
            serverSide		: true,
			responsive		: false,
			scrollCollapse	: true,
            ajax: {
                url : '{{ route('getListDataTables') }}',
                type: 'POST',
                data: function (d) {
                    d.mulai 	= document.getElementById('mulai').value;
					d.akhir 	= document.getElementById('akhir').value;
					d.valcari 	= document.getElementById('valcari').value;
					d.jenis 	= document.getElementById('master_set01').value;
					d.previlage = document.getElementById('master_set02').value;
					d.lokasi 	= 'simrs';
					d.master 	= document.getElementById('master_set04').value;
                }
            },
            columns: [
				{ data: 'aksi', name: 'aksi', orderable: false, searchable: false },
				{ data: 'tlsnoregister', name: 'noregister' },
				{ data: 'tlsnama', name: 'nmpasien' },
				{ data: 'tlsnofoto', name: 'nofoto' },
                { data: 'asalpasien', name: 'asalpasien' },
				{ data: 'daftar', name: 'daftar' },
				{ data: 'tlsreques', name: 'reques' },
				{ data: 'kd_spesimen', name: 'kd_spesimen' },
				{ data: 'nm_spesimen', name: 'nm_spesimen' },
				{ data: 'tlsstatus', name: 'status' },
				{ data: 'batalaksi', name: 'batalaksi', orderable: false, searchable: false },
				
			],
            language: {
                lengthMenu	: "Tampilkan _MENU_ data per halaman",
                zeroRecords	: "Tidak ada data ditemukan",
                info		: "Menampilkan halaman _PAGE_ dari _PAGES_",
                infoEmpty	: "Tidak ada data tersedia",
                infoFiltered: "(difilter dari _MAX_ total data)",
                paginate	: {
                    first	: "Pertama",
                    last	: "Terakhir",
                    next	: "→",
                    previous: "←"
                }
            }
        });
    });
</script>
@endpush