@extends('base.layout')

@section('content')
<div class="wrapper">
	<div class="container-fluid">
		<!-- end page title end breadcrumb -->
		<div id="divawal">
			<div class="row">
				<div class="col-lg-12">
					<div class="card-box ribbon-box">
					<div class="ribbon ribbon-primary" id="judul">Patient</div>
					<p class="m-b-0"></p>
						<button type="button" class="btn btn-danger" id="btnhariinidoank">This Day Only</button>
						<button type="button" class="btn btn-info" id="btnmundur2">Last 2 Days</button>
						<button type="button" class="btn btn-warning" id="btnmundur3">Last 3 Days</button>
						<div id="gridlist"></div>
					</div>
				</div>
			</div>
		</div>
		<div id="divdetail">
			<div class="row">
				<div class="col-sm-4">
				   <div class="card-box ribbon-box">
					<div class="ribbon ribbon-danger">Patient Data Edit</div>
					<p class="m-b-0"></p>
						<div class="form-row">
							<div class="form-group col-md-6">
								<label for="nofoto" class="col-form-label">No. Foto</label>
								<input type="text" id="nofoto" class="form-control" readonly>
							</div>
							<div class="form-group col-md-6">
								<label for="norm" class="col-form-label">No. RM</label>
								<input type="text" id="norm" class="form-control">
							</div>
						</div>
						<div class="form-group">
							<label for="nonama" class="col-form-label">Name</label>
							<input type="text"id="nonama" class="form-control">
						</div>
						<div class="form-row">
							<div class="form-group col-md-6">
								<label for="nokel" class="col-form-label">Gender</label>
								<select class="form-control" id="nokel" name="nokel">
									<option value="L">Laki-Laki</option>
									<option value="P">Perempuan</option>
								</select>
							</div>
							<div class="form-group col-md-6">
								<label for="tgllahir" class="col-form-label">Birth Date</label>
								<input type="text" class="form-control" id="tgllahir">
							</div>
						</div>
						<div class="form-row">
							<div class="form-group col-md-6">
								<label for="noservis" class="col-form-label">Service</label>
								<input type="text" id="noservis" class="form-control" readonly>
							</div>
							<div class="form-group col-md-6">
								<label for="nokamar" class="col-form-label">Rooms</label>
								<input type="text" class="form-control" id="nokamar" readonly>
							</div>
						</div>
						<div class="form-group">
							<label for="nostatus" class="col-form-label">Status</label>
							<select class="form-control" id="nostatus" name="status">
								<option value="">Empty</option>
								<option value="Diperiksa di Laboratorium">Diperiksa di Laboratorium</option>
							</select>
						</div>
					</div>
				</div>
				<div class="col-sm-8">
					<div class="card-box ribbon-box">
						<div class="ribbon ribbon-warning">Rooms and Doctor Data Edit</div>
						<p class="m-b-0"></p>
						<div class="form-row">
							<div class="form-group col-md-6">
								<label for="ruangan" class="col-form-label">Rooms Update</label>
								<select class="form-control select" id="ruangan" name="ruangan">
									<option>Pilih</option>
									@php
										$keys = array_keys($ruangans);
										for($i = 0; $i < count($ruangans); $i++) {
									@endphp
											<optgroup label="{{ $ruangpolis[$i] }}">
											@php
												foreach($ruangans[$keys[$i]] as $key => $value) {
											@endphp
												<option value="{{ $value['id'] }}">{{ $value['ruangan'] }}</option>
											@php
										}
											@endphp
											</optgroup>
									@php
									}
									@endphp
								</select>
							</div>
							<div class="form-group col-md-6">
								<label for="dokter" class="col-form-label">Doctor</label>
								<select class="form-control select2" id="dokter" name="dokter">
									<option>Pilih</option>
									@foreach($dokters as $dokter)
										<option value="{{ $dokter->id }}">{{ $dokter->nama }}</option>
									@endforeach
								</select>
							</div>
						</div>
						<input type="hidden" id="periksa_id" name="periksa_id">
						<button type="button" id="btnkembali" class="btn btn-custom">Back</button>
						<button type="button" id="btnUpdate" class="btn btn-custom pull-right">Submit</button>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
<div id="modalhapus" 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">Alasan Pembatalan</h4>
			</div>
			<div class="modal-body">
				<form class="form-horizontal">
					<div class="form-group m-b-25">
						<div class="col-12">
							<label>Tulis alasan pembatalan</label>
							<input type="text" class="form-control" id="id_alasan">							
						</div>
					</div>
					<div class="form-group account-btn text-center m-t-10">
						<div class="col-12">
							<input type="hidden" id="id_pemeriksaan">
							<button class="btn w-lg btn-custom waves-effect waves-light" id="btnpembatalan" type="button">Save</button>
						</div>
					</div>
				</form>
			</div>
		</div>
	</div>
</div>
<input type="hidden" id="master_set01" name="master_set01" value="ThisDay">
<input type="hidden" id="master_set02" name="master_set02" value="">
<input type="hidden" id="master_set03" name="master_set03" value="">
<input type="hidden" id="master_set04" name="master_set04" value="">
<input type="hidden" id="master_judul" name="master_judul" value="Queue">
<input type="hidden" id="master_lokasi" name="master_lokasi" value="">

<input type="hidden" name="_token" id="token" value="{{ csrf_token() }}">
@endsection

@push('script')
<script type="text/javascript">
function openedpage( jQuery ){
	var token=document.getElementById('token').value;
	var set01=document.getElementById('master_set01').value;
	var set02=document.getElementById('master_set02').value;
	var set03=document.getElementById('master_set03').value;
	var set04=document.getElementById('master_set04').value;
	var set05=document.getElementById('master_lokasi').value;
	var set06=document.getElementById('master_judul').value;
	var token=document.getElementById('token').value;
	if (set01 == 'ThisDay'){
		var judul='Patient Queue This Day on '+set06;
		$("#judul").html(judul);
	} else if (set01 == 'mundur2'){
		var judul='Patient Queue Last 2 Day on '+set06;
		$("#judul").html(judul);
	} else if (set01 == 'mundur3'){
		var judul='Patient Queue Last 3 Day on '+set06;
		$("#judul").html(judul);
	} else if (set01 == 'searchbydate'){
		if (set04 == 'inisaja'){
			var judul='Patient From '+set02+' until '+set03+' on '+set06;
		} else {
			var judul='Patient From '+set02+' until '+set03+' All Poli';
		}
		$("#judul").html(judul);
	} else {
		if (set04 == 'inisaja'){
			var judul='Search Result by key: '+set02+' on '+set06;
			$("#judul").html(judul);
		} else if (set04 == 'semua') {
			var judul='Search Result by key: '+set02+' All Poli ';
			$("#judul").html(judul);
		} else {
		//nothingtodo
		}
	}
	var sourcepasiencari = {
		datatype: "json",
		datafields: [
			{ name: 'id'},
			{ name: 'idpasien', type: 'text'},
			{ name: 'nofoto', type: 'text'},
			{ name: 'noregister', type: 'text'},
			{ name: 'nama', type: 'text'},
			{ name: 'jk', type: 'text'},
			{ name: 'usia', type: 'text'},
			{ name: 'urgensi', type: 'text'},
			{ name: 'tlsnofoto', type: 'text'},
			{ name: 'tlsnoregister', type: 'text'},
			{ name: 'tlsnama', type: 'text'},
			{ name: 'tlsjk', type: 'text'},
			{ name: 'tlsusia', type: 'text'},
			{ name: 'tlsurgensi', type: 'text'},
			{ name: 'tlsreques', type: 'text'},
			{ name: 'tlsruangan', type: 'text'},
			{ name: 'tlsdaftar', type: 'text'},
			{ name: 'tlsstatus', type: 'text'},
			{ name: 'poli', type: 'text'},
			{ name: 'ruangan', type: 'text'},
			{ name: 'daftartgl', type: 'text'},
			{ name: 'daftarjam', type: 'text'},
			{ name: 'status', type: 'text'},
			{ name: 'keterangan', type: 'text'},
			{ name: 'kesimpulan', type: 'text'},
			{ name: 'idruangan', type: 'text'},
			{ name: 'iddokter', type: 'text'},
			{ name: 'ppdssenior', type: 'text'},
			{ name: 'middleppds', type: 'text'},
			{ name: 'ppdsjunior', type: 'text'},
			{ name: 'diagnosa', type: 'text'},
			{ name: 'diagnosa2', type: 'text'},
			{ name: 'kd_spesimen', type: 'text'},
			{ name: 'nm_spesimen', type: 'text'},
			{ name: 'asalpasien', type: 'text'},
			{ name: 'klinis', type: 'text'},
			{ name: 'klinisi', type: 'text'},
			{ name: 'berat', type: 'text'},
			{ name: 'telpon', type: 'text'},
			{ name: 'dlp', type: 'text'},
			{ name: 'excutor', type: 'text'},
			{ name: 'analis', type: 'text'},
			{ name: 'nmexcutor', type: 'text'},
			{ name: 'nmanalis', type: 'text'},
			{ name: 'jumlah', type: 'text'},
			{ name: 'modality', type: 'text'},
			{ name: 'dokter', type: 'text'},
			{ name: 'ppds1', type: 'text'},
			{ name: 'ppds2', type: 'text'},
			{ name: 'timestamp1', type: 'text'},
			{ name: 'timestamp2', type: 'text'},
			{ name: 'durasi', type: 'text'},
			{ name: 'ppdsas', type: 'text'},
			{ name: 'otherppds', type: 'text'},
		],
		updaterow	: function (rowid, rowdata, commit) {commit(true);},
		type		: 'GET',
		data		: {jenis:set01, mulai:'', akhir:'', valcari:'', poli:'', master:'', _token: token},
		url			: '{{ route("getListpencarianpaged") }}',
		root		: 'data',
		totalrecords: 'total',
		cache		: false,
		filter		: function () {$("#gridlist").jqxGrid('updatebounddata', 'filter');},
		sort		: function () {$("#gridlist").jqxGrid('updatebounddata', 'sort');},
		beforeprocessing: function (data) {
			if (data != null) {
				sourcepasiencari.totalrecords = data.total;
			}
		}
	};
	var dataAdapter = new $.jqx.dataAdapter(sourcepasiencari);
	$("#gridlist").jqxGrid({
		width: '100%',
        enablebrowserselection: true,
		filterable: true,
		showfilterrow: true,
		columnsresize: true,
		pageable: true,
		sortable: true,
		autoheight: true,
		source: dataAdapter,
		theme: "energyblue",
		virtualmode		: true,
		rendergridrows	: function(obj) {
			return obj.data;
		},
		pagesizeoptions: ['10', '20', '30', '50', '100'],
		altrows: true,
		columns: [
			{ text: 'No.Pic', datafield: 'nofoto', width: '10%', align: 'center', cellsalign: 'left'},
			{ text: 'No.RM', datafield: 'tlsnoregister', width: '7%', cellsalign: 'left', align: 'center' },
			{ text: 'Name', datafield: 'tlsnama', width: '12%', cellsalign: 'left', align: 'center'  },
			{ text: 'M/W', datafield: 'tlsjk', sortable: false, filterable: false, width: '5%', cellsalign: 'center', align: 'center'  },
			{ text: 'Age', sortable: false, filterable: false, datafield: 'tlsusia', width: '11%', cellsalign: 'left', align: 'center'  },
			{ text: 'From', datafield: 'asalpasien', width: '7%', cellsalign: 'left', align: 'center'  },
			{ text: 'Service', datafield: 'tlsreques', width: '10%', cellsalign: 'left', align: 'center'  },
			{ text: 'Room', datafield: 'tlsruangan', width: '7%', cellsalign: 'left', align: 'center'  },
			{ text: 'Time', sortable: false, filterable: false, datafield: 'daftarjam', width: '5%', cellsalign: 'center', align: 'center'  },
			{ text: 'Status', sortable: false, filterable: false, datafield: 'tlsstatus', width: '14%', cellsalign: 'left', align: 'center'  },
			{ text: 'Edit', sortable: false, filterable: false, columntype: 'button', align: 'center', width: '5%', cellsrenderer: function () {
				return "Edit";
				}, buttonclick: function (row) {        
					editrowjabatan = row;   
					var offset      = $("#gridlist").offset();       
					var dataRecord  = $("#gridlist").jqxGrid('getrowdata', editrowjabatan);                      
					var goook       = dataRecord.id;
					var token       = document.getElementById('token').value;
					$.post('{{ route("listDetail") }}', { id: goook, _token: token },
					function(data){
						var datas   =   JSON.parse(data);
						$("#nofoto").val(dataRecord.nofoto);
						$("#norm").val(dataRecord.noregister);
						$("#nonama").val(dataRecord.nama);
						$("#nokel").val(dataRecord.jk);
						$("#tgllahir").val(dataRecord.tgllahir);
						$("#noservis").val(dataRecord.poli);
						$("#nokamar").val(dataRecord.ruangan);
						$("#ruangan").val(dataRecord.idruangan);
						$("#nostatus").val(dataRecord.status);
						$("#periksa_id").val(dataRecord.id);
						$('#divdetail').show();
						$('#divawal').hide();
						return false;
					});
				}
			},   
			{ text: 'Batalkan', sortable: false, filterable: false, columntype: 'button', align: 'center', width: '7%', cellsrenderer: function () {
				return "Batalkan";
				}, buttonclick: function (row) {        
					editrow         = row;   
					var offset      = $("#gridlist").offset();       
					var dataRecord  = $("#gridlist").jqxGrid('getrowdata', editrow);                      
					$("#id_pemeriksaan").val(dataRecord.id);
					$("#id_alasan").val('');
					$('#modalhapus').modal('show');               
				}
			},
		]
	});
}
$(window).on('load', function () {
	openedpage();
});
setTimeout(function() {
	openedpage();
}, 300000);

$(function() {
	//CKEDITOR.env.isCompatible = true;
	//CKEDITOR.replace( 'keterangan');
});
$(document).ready(function () {
    $('#divdetail').hide();
    $("#btnkembali").click(function() { 
        $('#divdetail').hide();
        $('#divawal').show();
        $("#gridlist").jqxGrid('updatebounddata');
    });
	$("#btnhariinidoank").click(function() {
		$("#master_set01").val('ThisDay');
		$("#master_set02").val('');
		$("#master_set03").val('');
		$("#master_set04").val('');
		var set01=document.getElementById('master_judul').value;
		var judul='Patient Queue This Day on '+set01;
		$("#judul").html(judul);
		openedpage();
    });
	$("#btnmundur2").click(function() {
		$("#master_set01").val('mundur2');
		$("#master_set02").val('');
		$("#master_set03").val('');
		$("#master_set04").val('');
		openedpage();
    });
	$("#btnmundur3").click(function() {
		$("#master_set01").val('mundur3');
		$("#master_set02").val('');
		$("#master_set03").val('');
		$("#master_set04").val('');
		openedpage();
    });
    $("#btnUpdate").click(function(){
        var noregister      =   document.getElementById('norm').value;
        var status          =   document.getElementById('nostatus').value;
        var ruangan         =   document.getElementById('ruangan').value;
        var dokter          =   document.getElementById('dokter').value;
		var tgllahir        =   document.getElementById('tgllahir').value;
		var nokel          	=   document.getElementById('nokel').value;
		var nonama          =   document.getElementById('nonama').value;
        var periksa_id      =   document.getElementById('periksa_id').value;
        var token           =   document.getElementById('token').value;
        $.post('{{ route("updateList") }}', { id: periksa_id, noregister: noregister, status: status, ruangan: ruangan, dokter: dokter, nokel: nokel, tgllahir: tgllahir, nonama: nonama, _token: token },
        function(data){
			var status  = data.status;
			var message = data.message;
            $.toast({
                heading: status,
                text: message,
                position: 'top-right',
                loaderBg: '#bf441d',
                icon: 'info',
                hideAfter: 5000,
                stack: 1
            });
            $("#gridlist").jqxGrid('updatebounddata');
            $('#divdetail').hide(); 
            $('#divawal').show();
            return false;
        });
    });
	$("#btnpembatalan").click(function(){
        var periksa_id  =   document.getElementById('id_pemeriksaan').value;
        var alasan      =   document.getElementById('id_alasan').value;       
        var token		=   document.getElementById('token').value;
		var tabel       =   'aktif';
		$.post('{{ route("deleteList") }}', { val01: periksa_id, val02: alasan, val03: tabel, _token: token },
		function(data){
			var status  = data.status;
			var message = data.message;
            $.toast({
                heading: status,
                text: message,
                position: 'top-right',
                loaderBg: '#bf441d',
                icon: 'info',
                hideAfter: 5000,
                stack: 1
            });
            $("#gridlist").jqxGrid('updatebounddata');
            $('#modalhapus').modal('hide');
            return false;
        });
    });
});
</script>
@endpush
