@extends('layout.index')
@section('title', 'Download Route Map')

<!-- Dashboard Ecommerce start -->
@section('content')

    <div class="content-body">
        <!-- Bordered table start -->
        <div class="row" id="table-bordered">
            <div class="col-12">
                <div class="card mb-1">
                    <div class="card-header w-100">
                        <div class="content-header-left">
                            <div class="row breadcrumbs-top">
                                <div class="col-sm-12">
                                    <h2 class="content-header-title float-left mb-0">Download Route Map</h2>
                                </div>
                            </div>
                        </div>
                        <div class="d-flex justify-content-end breadcrumb-wrapper">
                            <nav aria-label="breadcrumb">
                                <ol class="breadcrumb mr-1">
                                    <li class="breadcrumb-item"><a href="javascript:void(0)">Home</a></li>
                                    <li class="breadcrumb-item active" aria-current="page">Download Route Map</li>
                                </ol>
                            </nav>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- Bordered table end -->
    </div>

        <div class="row justify-content-center">
                      
                      <div class="col-md-6 col-lg-4">
                          <div class="card">
                                <form method="post" id="search_frm" action="{{ route('route_map.search') }}">
                                @csrf
                                <input type="hidden" name="download" value="1">
                                    <div class="card-body text-center">
                                      <h4 class="mb-2"><i class="fa fa-cloud-download" aria-hidden="true"></i> Download Map </h4>
                                      <img src={{ asset('assets/img/map.png') }} alt="" style="width: 100%;">
                                       
                                          <div class="form-group"> <br> <br>
                                              <input type="text" class="form-control flatpickr-basic flatpickr-input bg-transparent border-1 mx-25" id="date" name="date" value="" placeholder="DD-MM-YYYY"/>

                                          </div>                          
                                          <button type="submit" class="btn btn-primary waves-effect" onClick="return validation()"><i class="fa fa-download" aria-hidden="true" download ></i><span> Download</span></button>

                                            <a title="Clear" href="{{ url('route_map/clear_search') }}"
                                            class="btn btn-outline-primary" data-column="3"><i data-feather="rotate-ccw" class="me-25"></i><span> Clear</span></a>
                                    </div>   
                                </form>
                          </div>
                      </div>
                      
                  </div>
        <!-- Bordered table end -->
    @endsection

<script type="text/javascript">
	function validation() {

      if ($('#date').val() == ""){
          alert('Please Select Date');
          $('#date').focus();
        return false;
      }

    }
</script>