@extends('layouts.app')
@section('style_files')
    <link rel="stylesheet" href="{{ asset('css/jquery.typeahead.min.css') }}">
@endsection
@section('content')
<div class="container">
    <div class="row justify-content-center">
        <div class="col-md-12">
            <div class="card">
                <div class="card-header">Search Customer</div>

                <div class="card-body">
                    <div class="alert alert-success" role="alert" id="success-alert-message" style="display: none;">
                    </div>
                    <div class="alert alert-danger" id="file_upload_error" style="display:none">
                      Something went wrong
                      <ul></ul>
                    </div>
                    <form method="post" action="search_customers/get" enctype="multipart/form-data" id="upload_form">
                      @csrf
                        <div class="form-row">
                            <div class="form-group col-md-5">
                                <label for="db_table">{{ __('Dealer') }}</label>
                                <select class="form-control need-validation-inputs" id="db_table" name="db_table" required="">
                                    <option value="">Select</option>
                                    @include('inputs.select_options', ['options' => $dealers, 'value_selected' => ''])
                                </select>
                            </div>
                            <div class="form-group col-md-2">
                                <label for="vin_column">{{ __('VIN Column') }}</label>
                                <input type="text" id="vin_column" name="vin_column" class="form-control need-validation-inputs" placeholder="VIN column" required value="G" maxlength="5">
                            </div>
                            <div class="form-group col-md-5">
                                <label for="vin_column">{{ __('Select a file:') }}</label>
                                <div class="input-group">
                                    <input type="file" name="upload_file" id="upload_file" class="form-control @error('user_name') is-invalid @enderror" required />
                                    @error('upload_file')
                                        <span class="invalid-feedback" role="alert">
                                            <strong>{{ $message }}</strong>
                                        </span>
                                    @enderror
                                    <div class="input-group-append">
                                        <button type="submit" name="upload" class="btn btn-success"><i class="fas fa-file-upload"></i></button>
                                    </div>
                                </div>
                            </div>
                        </div> 
                        <div class="form-group row">
                          <div class="col-md-12">
                            <div class="progress" style="width: 50%;margin: auto;height: 30px">
                              <div class="progress-bar progress-bar-striped progress-bar-animated" role="progressbar" aria-valuenow="" aria-valuemin="0" aria-valuemax="100" style="width: 0%">0%</div>
                            </div>
                          </div>
                        </div>
                        <div class="form-group row">
                          <div class="col-md-12 text-center">
                            <div id="success">
                            </div>
                          </div>
                        </div>
                        <input type="hidden" value="1" id="search_customer_form" name="search_customer_form">
                    </form>
                    <br />
                    

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


@section('scripts_extra')
    
@endsection