@extends('admin.layout.master')
@section('content')

<div class="content-wrapper">
    <div class="content">
        <div class="card card-default">
            <div class="card-header">
                <h2>Edit Vendor</h2>
            </div>
        </div>

        <div class="card card-default">
            <div class="card-body">
                @if ($errors->any())
                <div class="alert alert-danger">
                    <ul>
                        @foreach ($errors->all() as $error)
                        <li>{{ $error }}</li>
                        @endforeach
                    </ul>
                </div>
                @endif

                <form action="{{ route('vendor.update', $vendor->id) }}" method="POST" enctype="multipart/form-data">
                    @csrf
                    @method('PUT')

                    <div class="row">
                        <div class="col-sm-4">
                            <div class="form-group">
                                <label for="vendor_type">Vendor Type*</label>
                                <select name="vendor_type" id="vendor_type" class="form-control">
                                    <option value="">Not Selected</option>
                                    <option value="wholesale" {{ $vendor->vendor_type == 'wholesale' ? 'selected' : '' }}>Wholesale Company</option>
                                    <option value="transportation" {{ $vendor->vendor_type == 'transportation' ? 'selected' : '' }}>Transportation Company</option>
                                    <option value="software" {{ $vendor->vendor_type == 'software' ? 'selected' : '' }}>Software Company</option>
                                </select>
                            </div>
                        </div>

                        <div class="col-sm-4">
                            <div class="form-group">
                                <label for="vendorname">Vendor Name*</label>
                                <input type="text" class="form-control" name="vendorname" value="{{ old('vendorname', $vendor->vendor_name) }}">
                            </div>
                        </div>

                        <div class="col-sm-4">
                            <div class="form-group">
                                <label for="email">Email*</label>
                                <input type="email" class="form-control" name="email" value="{{ old('email', $vendor->email) }}">
                            </div>
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-sm-4">
                            <div class="form-group">
                                <label for="gender">Gender*</label>
                                <select name="gender" id="gender" class="form-control">
                                    <option value="">Not Selected</option>
                                    <option value="male" {{ $vendor->gender == 'male' ? 'selected' : '' }}>Male</option>
                                    <option value="female" {{ $vendor->gender == 'female' ? 'selected' : '' }}>Female</option>
                                    <option value="others" {{ $vendor->gender == 'others' ? 'selected' : '' }}>Others</option>
                                </select>
                            </div>
                        </div>
                        <div class="col-sm-4">
                            <div class="form-group">
                                <label for="contactno">Contact No*</label>
                                <input type="text" class="form-control" name="contactno" value="{{ old('contactno', $vendor->contact_number) }}" id="contactno" placeholder="Enter Contact No" minlength="10" maxlength="10" pattern="[6-9][0-9]{9}$" oninput="validateContact(this)">
                            </div>
                        </div>
                        <div class="col-sm-4">
                            <div class="form-group">
                                <label for="alternate">Alternate contact No*</label>
                                <input type="text" class="form-control" name="alternate" id="alternate" placeholder="Enter Alternate Contact No" value="{{ old('alternate',$vendor->alternate_number) }}" minlength="10" maxlength="10" pattern="[6-9][0-9]{9}$" title="Please enter a valid 10-digit  number starting with 6, 7, 8, or 9." oninput="validateContact(this)">
                            </div>
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-sm-4">
                            <div class="form-group">
                                <label for="companyname">Company Name*</label>
                                <input type="text" class="form-control" name="companyname" value="{{ old('companyname', $vendor->company_name) }}">
                            </div>
                        </div>
                        <div class="col-sm-4">
                            <div class="form-group">
                                <label for="gstno">GST No*</label>
                                <input type="text" class="form-control" name="gstno" value="{{ old('gstno', $vendor->gst_number) }}" id="gstno" pattern="^[0-9]{2}[A-Z]{5}[0-9]{4}[A-Z]{1}[0-9A-Z]{1}[Z]{1}[0-9A-Z]{1}$" minlength="15" maxlength="15" oninput="validateGST(this)">
                            </div>
                        </div>

                        <div class="col-sm-4">
                            <div class="form-group">
                                <label for="licenceno">Licence No*</label>
                                <input type="text" class="form-control" name="licenceno" value="{{ old('licenceno', $vendor->company_licence_number) }}" id="licenceno" pattern="^[A-Za-z0-9]{6,20}$" minlength="6" maxlength="20" oninput="validateLicence(this)">
                            </div>
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-sm-3">
                            <div class="form-group">
                                <label for="companydocument">Company Document*</label>
                                <input type="file" class="form-control-file" name="companydocument[]" id="companydocument" value="{{ old('companydocument', $vendor->company_document) }}" multiple>
                            </div>
                        </div>

                        <div class=" col-sm-3">
                            <div class="form-group">
                                <label for="gstdocument">GST Document*</label>
                                <input type="file" class="form-control-file" name="gstdocument" id="gstdocument" value="{{ old('gstdocument', $vendor->gstno_document) }}">
                            </div>
                        </div>

                        <div class="col-sm-3">
                            <div class="form-group">
                                <label for="certificate">Certificate*</label>
                                <input type="file" class="form-control-file" name="certificate" id="certificate" value="{{ old('certificate', $vendor->certificate) }}">
                            </div>
                        </div>

                        <div class="col-sm-3">
                            <div class="form-group">
                                <label for="vendorimage">Vendor Image*</label>
                                <input type="file" class="form-control-file" name="vendorimage" id="vendorimage" value="{{ old('vendorimage', $vendor->vendor_image) }}">
                            </div>
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-sm-3">
                            <div class="form-group">
                                <label for="pincode">Pincode*</label>
                                <input type="text" class="form-control" id="pincode" name="pincode" placeholder="Enter Pincode" value="{{ old('pincode', $vendor->pincode) }}" oninput="validatePincode(this)" minlength="6" maxlength="6" pattern="[0-9]{6}$">
                            </div>
                        </div>
                        <div class="col-sm-3">
                            <div class="form-group">
                                <label for="state">State*</label>
                                <input type="text" class="form-control" id="state" name="state" placeholder="Enter State" value="{{ old('state', $vendor->state->state_name ) }}" readonly>
                            </div>
                        </div>
                        <div class="col-sm-3">
                            <div class="form-group">
                                <label for="district">District*</label>
                                <input type="text" class="form-control" id="district" name="district" placeholder="Enter District" value="{{ old('district', $vendor->dist->dist_name) }}" readonly>
                            </div>
                        </div>
                        <div class="col-sm-3">
                            <div class="form-group">
                                <label for="city">City*</label>
                                <input type="text" class="form-control" id="city" name="city" placeholder="Enter City" value="{{ old('city', $vendor->city->city_name) }}" readonly>
                            </div>
                        </div>
                    </div>

                    <div class="row">
                        <div class="col-sm-12">
                            <div class="form-group">
                                <label for="address">Address*</label>
                                <textarea class="form-control" name="address">{{ old('address', $vendor->address) }}</textarea>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-sm-12">
                            <div class="form-group">
                                <label for="service_name">Service Name</label>
                                <div>
                                    @foreach($services as $service)
                                    <div class="form-check">
                                        <input
                                            type="checkbox"
                                            class="form-check-input"
                                            name="service_id[]"
                                            id="service_{{ $service->id }}"
                                            value="{{ $service->id }}"
                                            {{ in_array($service->id, $selectedServices) ? 'checked' : '' }}>
                                        <label class="form-check-label" for="service_{{ $service->id }}">
                                            {{ $service->service_name }}
                                        </label>
                                    </div>
                                    @endforeach

                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="form-footer pt-5">
                        <button type="submit" class="btn btn-primary btn-pill">Update</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

<script>
    function validatePincode(input) {
        let oldValue = input.value;
        input.value = input.value.replace(/[^0-9]/g, '').slice(0, 6);

        if (oldValue !== input.value && /[^0-9]/.test(oldValue)) {
            alert("Only numbers are allowed in the pincode.");
        }
        if (input.value.length === 6 && !/^[1-9][0-9]{5}$/.test(input.value)) {
            alert("Invalid Pincode! It must be a 6-digit number starting from 1-9.");
            input.value = "";
        } else if (input.value.length === 6) {
            fetchLocation(input.value);
        }
    }

    function fetchLocation() {
        var pincode = document.getElementById("pincode").value;

        if (pincode.length !== 6) {
            return;
        }

        fetch("https://maps.googleapis.com/maps/api/geocode/json?address=" + pincode + "&key=AIzaSyDacwsbFXK1yJdSeyrvv7g4HEPa4Qmsiao")
            .then(response => response.json())
            .then(data => {
                if (data.status === "OK" && data.results.length > 0) {
                    let addressComponents = data.results[0].address_components;
                    let city = "",
                        district = "",
                        state = "";

                    addressComponents.forEach(component => {
                        if (component.types.includes("locality") || component.types.includes("postal_town")) {
                            city = component.long_name;
                        }
                        if (component.types.includes("administrative_area_level_3")) {
                            district = component.long_name;
                        }
                        if (component.types.includes("administrative_area_level_1")) {
                            state = component.long_name;
                        }
                    });

                    document.getElementById("city").value = city || "Not found";
                    document.getElementById("district").value = district || "Not found";
                    document.getElementById("state").value = state || "Not found";
                } else {
                    alert("Location details not found for this pincode.");
                }
            })
            .catch(error => console.error("Error fetching location:", error));
    }
</script>

<script>
    function validateContact(input) {
        let oldValue = input.value;
        input.value = input.value.replace(/[^0-9]/g, '').slice(0, 10);

        if (oldValue !== input.value && /[^0-9]/.test(oldValue)) {
            alert("Only numbers are allowed in the contact number.");
        }

        if (input.value.length > 0 && !/^[6-9]/.test(input.value)) {
            alert("Contact number must start with 6-9");
            input.value = '';
        }
    }

    function validateGST(input) {
        let oldValue = input.value;
        input.value = input.value.replace(/[^0-9A-Z]/g, '').toUpperCase();

        if (oldValue !== input.value && /[a-z]/.test(oldValue)) {
            alert("Only capital letters are allowed in the GST number.");
        }
    }

    function validateLicence(input) {
        let oldValue = input.value;
        input.value = input.value.replace(/[^A-Za-z0-9]/g, '');

        if (oldValue !== input.value && /^[A-Za-z0-9]{6,20}$/.test(oldValue)) {
            alert("Licence number must be 6-20 alphanumeric characters (letters and numbers only).");
        }
    }
</script>
@endsection