@extends('layouts.app')

@section('content')
{{--*/ usort($tableGrid, "SiteHelpers::_sort") /*--}}
<div class="page-titles mb-4 d-flex align-items-center justify-content-between">
	<div>
		<h2 class="mb-1 font-weight-bold">{{ $pageTitle }}</h2>
		<p class="text-muted mb-0">{{ $pageNote }}</p>
	</div>
	<div>
		<!-- Optional: Add a modern icon or action button here -->
		<i class="fa fa-chart-bar fa-2x text-primary"></i>
	</div>
</div>

<!-- Loading Animation -->
<div id="loading-overlay" style="display:none; position:fixed; top:0; left:0; width:100vw; height:100vh; background:rgba(255,255,255,0.7); z-index:9999; align-items:center; justify-content:center;">
	<div class="spinner-border text-success" role="status" style="width: 4rem; height: 4rem;">
		<span class="sr-only">Loading...</span>
	</div>
</div>

@push('scripts')
<script>
	document.addEventListener('DOMContentLoaded', function() {
		const form = document.getElementById('SximoTable');
		const overlay = document.getElementById('loading-overlay');
		if(form && overlay) {
			form.addEventListener('submit', function() {
				overlay.style.display = 'flex';
			});
		}
	});
</script>
@endpush
<div  class="card">
	<div class="card-body">
		<div class="toolbar-nav">
			<div class="row">
				<div class="col-md-6">
					<div class="btn-group">
						<button type="button" class="btn dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="fa fa-bars"></i> Bulk Action </button>
				        <ul class="dropdown-menu">
				         @if($access['is_excel'] ==1)
							<li class="nav-item"><a href="{{ url( $pageModule .'/export?do=excel&return='.$return) }}" class="nav-link"> Export CSV </a></li>	
						@endif
				        </ul>
				    </div>	
				</div>    
			</div>
		<div >

		 {!! Form::open(array('url'=>'realproduksikemasakan/delete/', 'class'=>'form-horizontal' ,'id' =>'SximoTable' )) !!}
		 <div class="table-responsive" style="min-height:300px; max-height:500px; overflow-y:auto;">
		<table class="table table-hover table-striped" id="freeze-header-table">
			<thead class="thead-light" style="position: sticky; top: 0; z-index: 2; background: #fff;">
				<tr>
					<th class="number"> No </th>			
					@foreach ($tableGrid as $t)
						@if($t['view'] =='1')
							<th>{{ $t['label'] }}</th>
						@endif
					@endforeach
				  </tr>
			</thead>

			<tbody>
							
				@foreach ($rowData as $row)
					<tr @if ($loop->first) class="first-row" @endif>
						<td width="30"> {{ ++$i }} </td>	
					@foreach ($tableGrid as $field)
						 @if($field['view'] =='1')
							<?php $limited = isset($field['limited']) ? $field['limited'] :''; ?>
							@if(SiteHelpers::filterColumn($limited ))
							 <td @if ($loop->parent->first) class="first-row-cell" @endif>					 
								{!! SiteHelpers::formatRows($row->{$field['field']},$field ,$row ) !!}						 
							 </td>
							@endif	
						 @endif					 
					 @endforeach				 
					
					</tr>
					
				@endforeach
				  
			</tbody>
		  
		</table>
		<input type="hidden" name="md" value="" />
		</div>
		{!! Form::close() !!}

		@push('styles')
		<style>
			#freeze-header-table thead th {
				position: sticky;
				top: 0;
				background: #fff;
				z-index: 2;
			}
			#freeze-header-table tbody tr.first-row td,
			#freeze-header-table tbody tr.first-row {
				font-weight: bold;
				background-color: rgba(40, 167, 69, 0.2) !important; /* Bootstrap green with transparency */
			}
		</style>
		@endpush
		
		
		@include('footer')
	</div>  
</div>
@stop