sipadu_mbip/resources/views/main-dashboard/compound/completed_index.blade.php

@extends('layout.master', ['uid' => $user->_id, 'token' => $user->token_firebase])
@section('page_title', 'Kompaun')
@section('sub_page_title', '')
@section('name', $user->StaffDetail->full_name)
@section('img_profile', $user->StaffDetail->profile_img)

@section('content')
<style type="text/css">
	select.form-control, select.form-control:focus, select.form-control:hover { 
		border: 1px solid #ccc !important;
		height: auto !important;
	}

	.panel-group .panel {
	    margin-bottom: 0;
	    overflow: hidden;
	    border-radius: 4px;
	}
	.panel-default {
    	border-color: #ddd;
	}
	.panel-default>.panel-heading {
	    color: #333;
	    background-color: #f5f5f5;
	    border-color: #ddd;
	}
	.panel-title {
	    margin-top: 0;
	    margin-bottom: 0;
	    font-size: 16px;
	    color: inherit;
	}

	.panel-body .table>thead>tr>th, .panel-body .table>tbody>tr>th, .panel-body .table>tfoot>tr>th, .panel-body .table>thead>tr>td, .panel-body .table>tbody>tr>td, .panel-body .table>tfoot>tr>td , .panel-body div{
	    padding: 8px 15px;
	    line-height: 1.428571429;
	    vertical-align: top;
	    border-top: 1px solid #ddd;
	}
	.glyphicon { margin-right:10px; }
	.panel-body { padding:0px; }
	.panel-body table tr td { padding-left: 15px }
	/*.panel-body table tr td a:hover , .panel-body div a:hover{ color: #fff !important; }*/
	.panel-body .table, .panel-body div {margin-bottom: 0px; }

	.r-padd { padding-right: 5%; }
	

	th { font-weight: 600; }
	table.dataTable.nowrap th, table.dataTable.nowrap td {
	    white-space: pre-line !important;
	}
	table.nowrap th, table.nowrap td {
	    white-space: pre-line !important;
	}
</style>

<div class="inner-page">
	<div class="row">
		@include('main-dashboard.compound._part.menu_category')
		@include('main-dashboard.compound._part.filter_form')
	</div>
	<div class="row">
		<div class="col-md-12">

			<div class="card">
				<div class="card-header">
					<h5>Senarai Kompaun Yang Dijelaskan</h5>
					<!-- {  this.state.dataCompound.length > 0 ?
						<ExportCSV csvData={this.state.dataCompound} fileName="Report_saman_1" type={this.state.form.type} />
						: ''
					} -->
				</div>
				<div class="card-body">
					<div id="viewParkir">
						@include('main-dashboard.compound._part.compound_parkir')
					</div>
					<div id="viewPelbagai">
						@include('main-dashboard.compound._part.compound_pelbagai')
					</div>
				</div>
			</div>
               
		</div>
	</div>
</div>
@endsection

@section('external_js')
<script type="text/javascript">
	var SITEURL = '{{URL::to('')}}';
	var tableP, tablePl;
	var queryString1 = '', queryString2 = '';
	$('#viewParkir').hide();
	$('#viewPelbagai').hide();
</script>
<script type="text/javascript" src="{{ asset('js/dataCompleteParkir.js') }}"></script>
<script type="text/javascript" src="{{ asset('js/dataCompletePelbagai.js') }}"></script>
<script type="text/javascript" src="{{ asset('js/function_checkbox.js') }}"></script>
<script type="text/javascript">
	$('#tapis').on('click', function (e) {
		e.preventDefault();
		var form = $("#filter_form")[0]; 
		if(form.checkValidity() === false) {
	    	e.stopPropagation();
	    	var isValid = form.reportValidity();
		}else {

			$('#viewPelbagai').hide();
	    	$('#viewParkir').hide();

			if($('#check_kpd').prop("checked") == false){
				$('#kpd').val('');
			}

			if($('#check_date').prop("checked") == false){
				$('#start_date').val('');
				$('#end_date').val('');
			}

			if($('#checkPlateNo').prop("checked") == false){
				$('#plate_no').val('');
			}

			if($('#checkCompanyNo').prop("checked") == false){
				$('#company_no').val('');
			}

			if($('#checkNric').prop("checked") == false){
				$('#nric').val('');
			}

			if($('#checkLicense').prop("checked") == false){
				$('#license').val('');
			}

			if($('#checkName').prop("checked") == false){
				$('#nameP').val('');
			}

			if($('#checkCompanyName').prop("checked") == false){
				$('#company_name').val('');
			}

			// Sumbit Search
	    	var form_data = $('#filter_form').serialize();
	    	if($('#type_C').val() == 'Parkir'){

	    		queryString1 = '?'+form_data;
	    		$('#viewPelbagai').hide();
	    		$('#viewParkir').show();
	    		tableP.ajax.url(SITEURL +'/api/list/compound'+ queryString1).load();

	    	}else if($('#type_C').val() == "Pelbagai"){

	    		queryString2 = '?'+form_data;
	    		$('#viewPelbagai').show();
	    		$('#viewParkir').hide();
	    		tablePl.ajax.url(SITEURL +'/api/list/compound'+ queryString2).load();
	    	}

	    	console.log(SITEURL +'/api/list/compound'+ queryString1);
	    	console.log(SITEURL +'/api/list/compound'+ queryString2);
	    } 

	    return false;
	});
</script>
@endsection