@extends('layouts.index')

@push('css')
<link rel="stylesheet" href="{{asset('assets/vendor/datatables.net-bs4/css/dataTables.bootstrap4.min.css')}} ">
<link rel="stylesheet" href="{{asset('assets/vendor/datatables.net-buttons-bs4/css/buttons.bootstrap4.min.css')}} ">
<link rel="stylesheet" href="{{asset('assets/vendor/datatables.net-select-bs4/css/select.bootstrap4.min.css')}} ">

<style>
	.break-word{
		max-width: 300px !important;
		word-wrap: break-word !important;
		white-space: inherit !important;
	}
</style>
@endpush

@section('header')
<div class="header bg-primary pb-6">
	<div class="container-fluid">
		<div class="header-body">
			<div class="row align-items-center py-4">
				<div class="col-lg-6 col-7">
					<h6 class="h2 text-white d-inline-block mb-0">{{$title}}</h6>
					<nav aria-label="breadcrumb" class="d-none d-md-inline-block ml-md-4">
						<ol class="breadcrumb breadcrumb-links breadcrumb-dark">
							<li class="breadcrumb-item"><a href="{{route('home')}}"><i class="fas fa-home"></i></a></li>
							<li class="breadcrumb-item"><a>{{$menu}}</a></li>
							<li class="breadcrumb-item active" aria-current="page">{{$title}}</li>
						</ol>
					</nav>
				</div>
			</div>
		</div>
	</div>
</div>
@endsection

@section('content')

@include('layouts.include.filter')

<div class="row">
	<div class="col">
		<div class="card">
			<!-- Card header -->
			<div class="card-header border-0">
				<div class="row">
					<div class="col-6">
						<h3 class="mb-0"> Laporan {{$title}}</h3>
					</div>
					<div class="col-6 text-right">
					</div>
				</div>
			</div>
			<div class="table-responsive py-4">
				<table class="table table-flush">
					<thead class="thead-light">
						<tr>
							<th>No</th>
							<th>Kode</th>
							<th class="break-word">Sub Kegiatan</th>
							<th class="break-word">Perangkat Daerah</th>
							<th class="break-word">Urusan</th>
							<th class="break-word">Lokasi</th>
							<th>status</th>
							<th>Jumlah (Rp)</th>
						</tr>
					</thead>
					<tbody>
						@foreach ($datas as $data)
							<tr>
								<td> {{ $loop->iteration }} </td>

								<td> {{ $data->kegiatan->program->bidangUrusan->urusan->perangkatDaerah->kode }}  -  
								{{ $data->kegiatan->program->bidangUrusan->urusan->masterUrusan->kd_urusan }}  - 
								{{ $data->kegiatan->program->bidangUrusan->masterBidangUrusan->kd_bidang_urusan }} -  
								{{ $data->kegiatan->program->kd_program }}  - 
								{{ $data->kegiatan->kd_kegiatan }} -  
								{{ $data->kd_sub_kegiatan }} </td>
								
								<td class="break-word"> {{ $data->nama_sub_kegiatan }} </td>
								<td class="break-word"> {{ $data->kegiatan->program->bidangUrusan->urusan->perangkatDaerah->nama_perangkat_daerah }} </td>
								<td class="break-word"> {{ $data->kegiatan->program->bidangUrusan->urusan->masterUrusan->nama_urusan }} </td>

								<td class="break-word"> {{ $data->lokasi }} </td>
								<td> Rp. {{ number_format(@$data->apbd + @$data->banprov + @$data->dak) }} </td>
								<td> {{ $data->status }} </td>


							</tr>
						@endforeach
					</tbody>
				</table>
			</div>
		</div>
	</div>
</div>
@endsection

@push('js')
<!-- Optional JS -->
<script src=" {{asset('assets/vendor/datatables.net/js/jquery.dataTables.min.js')}} "></script>
<script src=" {{asset('assets/vendor/datatables.net-bs4/js/dataTables.bootstrap4.min.js')}} "></script>
<script src=" {{asset('assets/vendor/datatables.net-buttons/js/dataTables.buttons.min.js')}} "></script>
<script src=" {{asset('assets/vendor/datatables.net-buttons-bs4/js/buttons.bootstrap4.min.js')}} "></script>
<script src=" {{asset('assets/vendor/datatables.net-buttons/js/buttons.html5.min.js')}} "></script>
<script src=" {{asset('assets/vendor/datatables.net-buttons/js/buttons.flash.min.js')}} "></script>
<script src=" {{asset('assets/vendor/datatables.net-buttons/js/buttons.print.min.js')}} "></script>
<script src=" {{asset('assets/vendor/datatables.net-select/js/dataTables.select.min.js')}} "></script>
@endpush