@extends('layouts.master')
@php
    $PayType = config('custom.PayType');
    $states = config('custom.states');
    $driverType = config('custom.driverType');
    $bad_zone = config('custom.bad_zone');
    asort($bad_zone);
@endphp
@section('content')
    <div class="content d-flex flex-column flex-column-fluid" id="kt_content">
        <div id="kt_content_container" class="container-xxl">
            <div class="d-flex flex-wrap flex-stack pb-7">
                <div class="d-flex flex-wrap align-items-center my-1">
                    <h3 class="fw-bold me-5 my-1">Vendor <span class="text-muted">Edit</span>
                    </h3>
                    <h3 class="fw-bold me-5 my-1"></h3>
                </div>
            </div>
            <div class="card card-flush">
                <div class="card-body">
                    <div class=" pb-lg-11 pb-7">
                        <div class="container">
                        <form action="{{ route('assets.vendors.update') }}" method="POST">
                                @csrf
                                <div class="modal-body">
                                    <div class="row">
                                        <div class="col-sm-6">
                                            <div class="mb-3">
                                                <label for="max_weg" class="col-lg-6 col-form-label fw-semibold fs-6"><span class="required">Name</span> </label>
                                                <input type="text" name="NAME" id="NAME" value="{{ old('NAME',$vendor->NAME)}}" class="form-control" >
                                                <input type="hidden" name="VENDOR_ID" id="NAME" value="{{ old('NAME',$vendor->VENDOR_ID)}}" class="form-control" >
                                                @error('NAME')
                                                    <p class="text-danger">{{ $message }}</p>
                                                @enderror
                                            </div>
                                        </div>
                                        <div class="col-md-6">                                                           
                                                                <label
                                                                    class="col-lg-6 col-form-label fw-semibold fs-6">Address</label>
                                                                <div class="col-lg-12 fv-row fv-plugins-icon-container">
                                                                    <input type="text" class="form-control"
                                                                        id="ADDRESS_1" name="ADDRESS_1"
                                                                        value="{{ old('ADDRESS_1', $vendor->ADDRESS_1) }}">
                                                                    @error('ADDRESS_1')
                                                                        <p class="text-danger">{{ $message }}</p>
                                                                    @enderror
                                                                    <div
                                                                        class="fv-plugins-message-container fv-plugins-message-container--enabled invalid-feedback">
                                                                    </div>
                                                                </div>                                                           
                                                        </div>
                                                        <div class="col-md-6">                                                            
                                                                <label
                                                                    class="col-lg-6 col-form-label fw-semibold fs-6">City</label>
                                                                <div class="col-lg-12 fv-row fv-plugins-icon-container">
                                                                    <input type="text" class="form-control"
                                                                        id="CITY" name="CITY"
                                                                        value="{{ old('CITY', $vendor->CITY) }}">
                                                                    @error('CITY')
                                                                        <p class="text-danger">{{ $message }}</p>
                                                                    @enderror
                                                                    <div
                                                                        class="fv-plugins-message-container fv-plugins-message-container--enabled invalid-feedback">
                                                                    </div>                                                                
                                                            </div>
                                                        </div>
                                                        <div class="col-md-6">                                                          
                                                                <label
                                                                    class="col-lg-6 col-form-label fw-semibold fs-6">Address2</label>
                                                                <div class="col-lg-12 fv-row fv-plugins-icon-container">
                                                                    <input type="text" class="form-control"
                                                                        id="ADDRESS_2" name="ADDRESS_2"
                                                                        value="{{ old('ADDRESS_2', $vendor->ADDRESS_2) }}">
                                                                    @error('ADDRESS_2')
                                                                        <p class="text-danger">{{ $message }}</p>
                                                                    @enderror
                                                                    <div
                                                                        class="fv-plugins-message-container fv-plugins-message-container--enabled invalid-feedback">
                                                                    </div>
                                                                </div>                                                           
                                                        </div>
                                                        <div class="col-md-6">                                                         
                                                                <label
                                                                    class="col-lg-6 col-form-label fw-semibold fs-6">State</label>
                                                                <div class="col-lg-12 fv-row fv-plugins-icon-container">
                                                                    <select class="form-select" data-control="select2"
                                                                        data-hide-search="true"
                                                                        data-placeholder="Select a State" id="PROVINCE"
                                                                        name="PROVINCE">
                                                                        <option value="">Please select
                                                                        </option>
                                                                        @foreach ($states as $state)
                                                                            <option value="{{ $state }}"
                                                                                {{ old('PROVINCE', $vendor->PROVINCE) == $state ? 'selected' : '' }}>
                                                                                {{ $state }}</option>
                                                                        @endforeach
                                                                    </select>
                                                                    @error('PROVINCE')
                                                                        <p class="text-danger">{{ $message }}</p>
                                                                    @enderror
                                                                    <div
                                                                        class="fv-plugins-message-container fv-plugins-message-container--enabled invalid-feedback">
                                                                    </div>
                                                                </div>                                                            
                                                        </div>
                                                        <div class="col-md-6">                                                            
                                                                <label
                                                                    class="col-lg-6 col-form-label fw-semibold fs-6">Zip</label>
                                                                <div class="col-lg-12 fv-row fv-plugins-icon-container">
                                                                    <input type="text" class="form-control "
                                                                        id="POSTAL_CODE" name="POSTAL_CODE"
                                                                        value="{{ old('POSTAL_CODE', $vendor->POSTAL_CODE) }}">
                                                                    @error('POSTAL_CODE')
                                                                        <p class="text-danger">{{ $message }}</p>
                                                                    @enderror
                                                                    <div
                                                                        class="fv-plugins-message-container fv-plugins-message-container--enabled invalid-feedback">
                                                                    </div>
                                                                </div>                                                          
                                                        </div>
                                    </div>
                                </div>
                                <div class="mt-10">
                                    <a href="{{ route('assets.vendors.index') }}" class="btn btn-secondary me-2">Close</a>
                                    <button type="submit" class="btn btn-primary">Update</button>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection()
@section('script')

<script
        src="https://maps.googleapis.com/maps/api/js?key=AIzaSyD5BQa0hFcyKzBa_dA2cbKt3QvdiWhxOvY&libraries&callback=initAutocomplete&libraries=places&v=weekly"
        defer></script>
  

    <script>
        $('.datetimepicker').daterangepicker({
            timePicker: false ,
            singleDatePicker: true,
            locale: {
                format: 'MM/DD/YYYY'
            }
        });

        let autocomplete;
        let address1Field;
        let address2Field;
        let postalField;

   

function initAutocomplete() {
    var input = document.getElementById('ADDRESS_1');
    autocomplete = new google.maps.places.Autocomplete(input);

    google.maps.event.addListener(autocomplete, 'place_changed', function() {
        var place = autocomplete.getPlace();
        if (!place.geometry) {
            return;
        }

        $('#ADDRESS_1').val(place.formatted_address);

        let province = '';
        let city = '';
        let postalCode = '';

        for (let component of place.address_components) {
            let componentType = component.types[0];
            switch (componentType) {
                case 'administrative_area_level_1':
                    province = component.short_name;
                    break;
                case 'locality':
                    city = component.long_name;
                    break;
                case 'postal_code':
                    postalCode = component.long_name;
                    break;
            }
        }

        $('#PROVINCE').val(province).trigger('change');
        $('#CITY').val(city);
        $('#POSTAL_CODE').val(postalCode);
    });

    var input2 = document.getElementById('ADDRESS_2');
    autocomplete2 = new google.maps.places.Autocomplete(input2);
    google.maps.event.addListener(autocomplete2, 'place_changed', function() {
        var place2 = autocomplete2.getPlace();
        if (!place2.geometry) {
            return;
        }
        $('#ADDRESS_2').val(place2.formatted_address);
    });
}
    </script>
@endsection