@extends('layouts.default')

@section('content')
    <div class="container">
        <h4>FAMEWS data reports</h4>
        <div class="row justify-content-center">
            <div class="col-md-12">
                <div class="card">
                    <div class="card-header font-weight-bold">
                        <div class="d-flex justify-content-end mb-2">
                            {{--                            <a href="/famewsreport/import" class="btn btn-primary">Data Import</a>--}}
                        </div>
                    </div>
                    <div class="card-body">
                        @if (session('status'))
                            <div class="alert alert-success" role="alert">
                                {{ session('status') }}
                            </div>
                        @endif

                        <form action="{{route('famewsreport.search')}}" method="GET">
                            @csrf
                            <div class="row">
                                <div class="col-md-3">
                                    <label for="station">From: <br>
                                        <input type="date" name="from" class="form-control"></label>
                                </div>
                                <div class="col-md-3">
                                    <label for="station">To: <br>
                                        <input type="date" class="form-control" name="to" placeholder="to"></label>
                                </div>
                                <div class="col-md-2">
                                    <label for="station">Crop: <br>
                                        <select class="form-control" name="crop">
                                            <option value="">--- Select Crop --- </option>
                                            @foreach ($crops as $crop)
                                                <option value="{{$crop}}">
                                                    {{$crop}}
                                                </option>
                                            @endforeach
                                        </select></label>
                                </div>

                                <div class="col-md-2">
                                    <label for="station">Region: <br>
                                        <select class="form-control" name="crop">
                                            <option value="">--- Select Region --- </option>
                                            @foreach ($regions as $region)
                                                <option value="{{$region}}">
                                                    {{$region}}
                                                </option>
                                            @endforeach
                                        </select></label>
                                </div>

<!--
                                <div class="col-md-2">
                                    <input type="checkbox" id="vehicle1" name="vehicle1" value="Bike">
                                    <label for="vehicle1">date</label><br>
                                    <input type="checkbox" id="vehicle2" name="vehicle2" value="Car">
                                    <label for="vehicle2">locationname</label><br>
                                    <input type="checkbox" id="vehicle3" name="vehicle3" value="Boat">
                                    <label for="vehicle3">latitude</label><br><br>
                                </div>
-->
                                <div class="col-md-2">
                                    <button type="submit" class="btn btn-primary m-2 ">View</button>
                                </div>
                            </div>
                        </form>
                    </div>


                    <hr>


                    <table class="table">
                        <thead class="table-dark">
                        <th>Date</th>
                        <th>Region</th>
                        <th>Main Crop</th>
                        <th>Crop Stage</th>
                        <th>Crop Health</th>
                        <th>FAW Prevalence (%)</th>
                        <th>Action</th>
                        <th></th>
                        </thead>
                        <tbody>
                        @foreach ($data as $famewsreport)
                            <tr>
                                <td>
                                    {{substr($famewsreport->date,0,10)}}
                                </td>
                                <td>
                                    {{$famewsreport->region}}
                                </td>
                                <td>
                                    {{$famewsreport->cropMain}}
                                </td>
                                <td>
                                    {{$famewsreport->cropStage}}
                                </td>
                                <td>
                                    {{$famewsreport->cropHealth}}
                                </td>
                                <td>
                                    {{number_format((float)($famewsreport->prevalence_calculated) * 100,2, '.', '')}}
                                </td>
                                <td>
<form action="{{ route('famewsreportdetail', ['id' => $famewsreport->id])}}" method="get">
    <button type="submit" class="btn btn-primary">Details</button>
</form>
                                </td>  
                            </tr>
                        @endforeach
                        </tbody>
                    </table>

                    {{--                    {{$data->link()}}--}}
                    <div class="card-footer">
                        <div class="d-flex justify-content-center">
                            {{ $data->links() }}
                        </div>

                    </div>

                </div>
            </div>
        </div>
    </div>
@endsection