@extends('layouts.app')

@section('content')
{{--*/ usort($tableGrid, "SiteHelpers::_sort") /*--}}
<div class="page-titles" style="margin-bottom: 24px;">
	<h2 style="font-family: 'Segoe UI', 'Roboto', Arial, sans-serif; font-size: 2.5rem; color: #1a237e; font-weight: 700; letter-spacing: 1px;">
		{{ $pageTitle }}
		<small style="font-size: 1.25rem; color: #3949ab; font-weight: 400; margin-left: 12px;">
			{{ $pageNote }}
		</small>
	</h2>
</div>
<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 class="table-responsive mt-4">
			{!! Form::open(['url'=>'produksitebuharianafdeling/delete/', 'class'=>'form-horizontal', 'id'=>'SximoTable']) !!}
			<div class="table-responsive" style="max-height:500px;overflow-y:auto;">
				<style>
					.table th,
					.table td {
						white-space: nowrap;
					}
					.table thead th.sticky-col,
					.table tbody td.sticky-col {
						position: sticky;
						left: 0;
						background: #fff;
						z-index: 3;
					}
					@for ($col = 1; $col <= 8; $col++)
						.table thead th.sticky-col-{{ $col }},
						.table tbody td.sticky-col-{{ $col }} {
							position: sticky;
							left: calc(var(--sticky-col-width-{{ $col }}, 0px));
							z-index: 4;
							background: #fff;
						}
					@endfor
					.table thead th {
						position: sticky;
						top: 0;
						z-index: 10;
						background: #343a40;
						color: #fff;
					}
					.table td.text-right {
						text-align: right;
					}
					/* Baris ganjil biru muda transparan, genap hijau muda transparan */
					.table tbody tr:nth-child(odd) td {
						background-color: rgba(33, 150, 243, 0.12); /* biru muda transparan */
					}
					.table tbody tr:nth-child(even) td {
						background-color: rgba(76, 175, 80, 0.12); /* hijau muda transparan */
					}
				</style>
				<script>
					document.addEventListener('DOMContentLoaded', function() {
						const table = document.querySelector('.table');
						if (!table) return;
						let left = 0;
						for (let i = 0; i < 8; i++) {
							const th = table.querySelectorAll('thead th')[i+1]; // skip No column
							if (th) {
								th.classList.add('sticky-col', 'sticky-col-' + (i+1));
								th.style.setProperty('--sticky-col-width-' + (i+1), left + 'px');
								left += th.offsetWidth;
							}
						}
						table.querySelectorAll('tbody tr').forEach(tr => {
							let left = 0;
							for (let i = 0; i < 8; i++) {
								const td = tr.querySelectorAll('td')[i+1]; // skip No column
								if (td) {
									td.classList.add('sticky-col', 'sticky-col-' + (i+1));
									td.style.setProperty('--sticky-col-width-' + (i+1), left + 'px');
									left += td.offsetWidth;
								}
							}
						});
					});
				</script>
				<table class="table table-bordered table-hover align-middle" style="position:relative;">
					<thead class="thead-dark">
					<tr>
						<th class="text-center" style="position:sticky;top:0;z-index:11;background:#343a40;color:#fff;">No</th>
						@php $colIndex = 1; @endphp
						@foreach ($tableGrid as $t)
							@if($t['view'] =='1')
								<th class="text-center {{ $colIndex <= 8 ? 'sticky-col sticky-col-'.$colIndex : '' }}" style="position:sticky;top:0;z-index:10;background:#343a40;color:#fff;">{{ $t['label'] }}</th>
								@php $colIndex++; @endphp
							@endif
						@endforeach
					</tr>
					</thead>
					<tbody>
						@foreach ($rowData as $row)
							<tr>
								@php $colIndex = 1; @endphp
								<td class="text-center sticky-col sticky-col-1">{{ ++$i }}</td>
								@foreach ($tableGrid as $field)
									@if($field['view'] =='1')
										<?php $limited = isset($field['limited']) ? $field['limited'] :''; ?>
										@if(SiteHelpers::filterColumn($limited))
											@php
												$value = $row->{$field['field']};
												$isNumber = is_numeric($value);
												$displayValue = ($isNumber && $value == 0) ? '-' : SiteHelpers::formatRows($value, $field, $row);
											@endphp
											<td class="{{ $colIndex <= 8 ? 'sticky-col sticky-col-'.$colIndex : '' }}{{ $isNumber ? ' text-right' : '' }}">
												{!! $displayValue !!}
											</td>
											@php $colIndex++; @endphp
										@endif
									@endif
								@endforeach
							</tr>
						@endforeach
					</tbody>
				</table>
				<input type="hidden" name="md" value="" />
			{!! Form::close() !!}
		</div>
		
		
		@include('footer')
	</div>  
</div>
@stop