@extends('layout.master')
@section('title', 'Report New Covid-19 Case')
@section('stat', 'active')
@section('newCase', 'active')
@section('levelCSS')
    <link rel="stylesheet" href="{{asset('vendors/select2/select2.min.css')}}">
    <link rel="stylesheet" href="{{asset('vendors/select2-bootstrap-theme/select2-bootstrap.min.css')}}">
    <link rel="stylesheet" href="{{asset('vendors/bootstrap-datepicker/bootstrap-datepicker.min.css')}}">
@endsection

@section('body')

    <div class="col-md-12">
        <div class="tab-content tab-transparent-content pb-0">
            <div class="tab-pane fade show active" id="overview" role="tabpanel" aria-labelledby="overview-tab">

                <form action="{{route('/submit_case')}}" method="post" id="caseForm">

                    <div class="row">
                        <div class="col-sm-8 offset-sm-1">
                            <div class="card">
                                <div class="card-body">

                                    @include('partials.state_lga')

                                    <div class="form-group">
                                        <div class="col-sm-12">
                                            <label for="">Date of Confirmation</label>
                                            <div id="datepicker-popup" class="input-group date datepicker">
                                                <input type="text" name="date_of_confirmation" id="date_of_confirmation" required class="form-control">
                                                <span class="input-group-addon input-group-append border-left">
                                            <span class="mdi mdi-calendar input-group-text"></span>
                                        </span>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="form-group">
                                        <div class="col-sm-12">
                                            <label for=""><strong>Number of Cases</strong></label>
                                            <input type="number" name="number_of_case" id="number_of_case" required class="form-control">
                                        </div>
                                    </div>
                                    {{ csrf_field() }}
                                    <input type="hidden" name="reported_by" value="{{currentUser()->id}}">

                                    <div class="form-group">
                                        <button class="btn btn-md btn-primary" id="caseBtn">SUBMIT CASE</button>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-sm-2">
                            <br>
                            <p id="state_cases"></p>
                            <br>
                            <p id="lga_cases"></p>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>

@endsection

@section('levelJS')
    <script src="{{asset('vendors/select2/select2.min.js')}}"></script>
    <script src="{{asset('vendors/bootstrap-datepicker/bootstrap-datepicker.min.js')}}"></script>
    @include('statistics.partial_js')
@endsection