@extends('layouts.app')

@section('content')
<div>
    <button class="btn btn-primary" type="button" data-toggle="collapse" data-target="#filter-collapse" aria-expanded="false" aria-controls="collapseExample">
        Filters
    </button>
</div>
<div class="filter collapse" id="filter-collapse">
    <form method="GET" action="{{ url('search') }}">
        <div class="row">
            <div class="form-group col-6">
                <label for="exampleInputPassword1">ระหว่างวันที่</label>
                <input type="date" name="from_date" class="form-control">
            </div>
            <div class="form-group col-6">
                <label for="exampleInputPassword1">ถึง</label>
                <input type="date" name="to_date" class="form-control">
            </div>
        </div>
        <div class="row">
            <div class="form-group col">
                <label for="exampleInputEmail1">สถานที่</label>
                <select id="location" name="location" class="custom-select form-control">
                    <option></option>
                    @foreach($provinces as $province)
                    <option value="{{ $province->name_th }}">{{ $province->name_th }}</option>
                    @endforeach
                </select>
            </div>
        </div>
                <div class="row">
            <div class="form-group col">
                <label for="exampleInputPassword1">ประเภท</label>
                <select name="type" class="custom-select form-control">
                    @foreach($types as $type)
                    <option value="{{ $type }}">{{ $type }}</option>
                    @endforeach
                </select>
            </div>
        </div>
                <div class="row">
            <div class="form-group col">
                <label for="exampleInputPassword1">ระดับ</label>
                <select name="level" class="custom-select orm-control">
                    @foreach($levels as $level)
                    <option value="{{ $level }}">{{ $level }}</option>
                    @endforeach
                </select>
            </div>
        </div>

        <div class="row">
            <div class="col">
                <button type="submit" class="btn btn-primary">Search</button>
                <a class="btn btn-danger" href="{{ url('list') }}">Reset</a>
            </div>
        </div>
    </form>
</div>
<div class="table-wrapper">
    <div style="text-align: right;">
        <a class="btn btn-success" href="{{ url('add') }}">Add</a>
    </div>
    <table class="table table-striped">
        <thead>
        <tr>
            <th scope="col">วันที่</th>
            <th scope="col">เวลา</th>
            <th scope="col">สถานที่</th>
            <th scope="col">ระดับ</th>
            <th scope="col">ประเภท</th>
            <!-- <th scope="col">สถานะ</th> -->
            <th scope="col"></th>
        </tr>
        </thead>
        <tbody>
            @foreach ($disasters as $disaster)
            <tr>
                <td>{{ $disaster->date }}</td>
                <td>{{ $disaster->time }}</td>
                <td>{{ $disaster->location }}</td>
                <td>{{ $disaster->level }}</td>
                <td>{{ $disaster->type }}</td>
                <!-- <td>{{ $disaster->status }}</td> -->
                <td>
                    <a class="btn btn-info btn-sm" href="{{ url('edit/'.$disaster->id) }}">edit</a>
                    <a class="btn btn-danger btn-sm" href="{{ url('delete/'.$disaster->id) }}">delete</a>
                </td>
            </tr>
            @endforeach
        </tbody>
    </table>
</div>
@endsection