@extends('client.layouts.content')
	@section('content')
		<div class="row mb-4">
			<div class="col-md-8 pr-2">
				<div class="card">
					<div class="card-header bg-white">
						<h6 class="card-title mb-0"><small class="font-weight-bold text-uppercase">{{ $type->name }} ({{ count($bulletins) }})</small></h6>
					</div>
					<div class="card-body">
	                    <form action="{{ route('View Bulletin', ['id' => $id]) }}" class="form-inline" method="GET" autocomplete="off">
	                    	<div class="input-group input-group-sm">
                                <div class="input-group-prepend">
                                    <span class="input-group-text rounded-0">Year</span>
                                </div>
                                <select name="year" class="form-control form-control-sm rounded-0">
                                    @foreach($years as $y)
                                        <option value="{!! $y !!}" {{ $year == $y ? 'selected' : (old('year') == $y ? 'selected' : '') }}>{!! $y !!}</option>
                                    @endforeach
                                </select>
                            </div>
                            <div class="input-group input-group-sm ml-2">
                                <div class="input-group input-group-sm">
                                    <div class="input-group-prepend">
                                        <span class="input-group-text rounded-0">Month</span>
                                    </div>
                                    <select name="month" class="form-control form-control-sm rounded-0">
                                        @foreach($months as $key => $m)
                                            <option value="{!! $key !!}" {{ $month == $key ? 'selected' : (old('month') == $key ? 'selected' : '') }}>{!! $m !!}</option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>
                            <div class="input-group input-group-sm ml-2">
                                <input type="Submit" class="btn btn-primary btn-sm rounded-0">
                            </div>
	                    </form>
					</div>
					<div class="table-responsive fixed-height">
						<table class="table table-hover mb-0">
							@forelse($bulletins as $bulletin)
								<tr>
									<td class="py-3 px-4"><small>{!! nl2br($bulletin->message) !!}</small></td>
								</tr>
							@empty
							@endforelse
						</table>
					</div>
				</div>
			</div>
			<div class="col-md-4">
				<div class="card border-0 h-100 card-background">
					@include('client.components.weather')
					@include('client.components.earthquake')
					@include('client.components.cyclone')
				</div>
			</div>
		</div>
	@endsection