@extends('layouts.master')

@section('page_title', 'Add Business Location Details')
@section('title', 'Add Business Location Details')
@section('main_item', 'Add Business Locations')
@section('sub_item', 'Add Business Locations Details')

@section('content')

    <div class="col-md-12">
        <div class="card">
            <div class="card-body">
                <form id="businessLocationForm" method="POST">
                    @csrf
                    <div class="row">
                        <div class="col-md-4">
                            <div class="form-group">
                                <label class="required" for="branch_name" style="font-weight: bold">Name:*</label>
                                <input class="form-control " type="text" name="name" id="name" value="">
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label class="required" for="branch_name" style="font-weight: bold">Location ID:</label>
                                <input class="form-control " type="text" name="location_id" id="location_id"
                                    value="">
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label class="required" for="branch_name" style="font-weight: bold">Landmark:</label>
                                <input class="form-control " type="text" name="landmark" id="landmark" value="">
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label class="required" for="branch_name" style="font-weight: bold">Zip Code:</label>
                                <input class="form-control " type="text" name="zip_code" id="zip_code" value="">
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label class="required" for="branch_name" style="font-weight: bold">City:*</label>
                                <input class="form-control " type="text" name="city" id="city" value=""
                                    required>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label class="required" for="branch_name" style="font-weight: bold">State:*</label>
                                <input class="form-control " type="text" name="state" id="state" value=""
                                    required>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label style="font-weight: bold">Country *</label>
                                <select class="form-control" id="country" name="country" required>
                                    <option value="">Select</option>
                                    @foreach ($countries as $country)
                                        <option value="{{ $country->id }}"
                                            {{ (old('country_id') ? old('country_id') : $country->nicename ?? '') == 'Sri Lanka' ? 'selected' : '' }}>
                                            {{ $country->nicename }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label class="required" for="branch_name" style="font-weight: bold">Mobile:*</label>
                                <input class="form-control " type="text" name="mobile" id="mobile" value=""
                                    required>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label class="required" for="branch_name" style="font-weight: bold">Alternate contact
                                    number:</label>
                                <input class="form-control " type="text" name="alternate_number" id="alternate_number"
                                    value="">
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label class="required" for="branch_name" style="font-weight: bold">Email:</label>
                                <input class="form-control " type="text" name="email" id="email"
                                    value="">
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label class="required" for="branch_name" style="font-weight: bold">Website:</label>
                                <input class="form-control " type="text" name="website" id="website"
                                    value="">
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label style="font-weight: bold"> Dispatch Note Print Type</label>
                                <select class="form-control" id="waybill_print_type" name="waybill_print_type" required>
                                    <option value="normal" @if ($setting->dispatch_note_print_type == 'normal') selected @endif>Normal
                                    </option>
                                    <option value="barcode" @if ($setting->dispatch_note_print_type == 'barcode') selected @endif>Barcode
                                    </option>
                                    <option value="defult_barcode" @if ($setting->dispatch_note_print_type == 'defult_barcode') selected @endif>Defult
                                        Barcode
                                    </option>
                                    <option value="unikglobal_wabill" @if ($setting->dispatch_note_print_type == 'unikglobal_wabill') selected @endif
                                        @if ($setting->unikglobale_waybill_print != '1') style="display: none" @endif>Unikglobal Waybill
                                    </option>
                                    <option value="store_87" @if ($setting->dispatch_note_print_type == 'store_87') selected @endif
                                        @if ($setting->store_87_barcode_print != '1') style="display: none" @endif>Store 87
                                    </option>

                                </select>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label class="required" for="branch_name" style="font-weight: bold">Custom Field
                                    1:</label>
                                <input class="form-control " type="text" name="custom_field1" id="custom_field1"
                                    value="">
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label class="required" for="branch_name" style="font-weight: bold">Custom Field
                                    2:</label>
                                <input class="form-control " type="text" name="custom_field2" id="custom_field2"
                                    value="">
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                <label class="required" for="branch_name" style="font-weight: bold">Custom Field
                                    3:</label>
                                <input class="form-control " type="text" name="custom_field3" id="custom_field3"
                                    value="">
                            </div>
                        </div>
                    </div>
                    <select type="hidden" class="form-control" id="is_active" name="is_active" required hidden>
                        <option value="1">Activate</option>
                    </select>
                    <div class="col-sm-12 text-right">
                        <button type="button" id="business_location_submit" class="btn btn-primary">
                            Save
                        </button>
                </form>
            </div>
        </div>
    </div>

@endsection
@section('scripts')
    <script>
        $('#location_id').change(function() {
            let input = $('#location_id').val();
            let url = "{{ route('business-location.validate-location_id') }}";
            $.ajax({
                method: 'POST',
                url: url,
                data: {
                    "_token": "{{ csrf_token() }}",
                    location_id: input
                },
                success: function(response) {
                    if (response.is_have == 'yes') {
                        $('#location_id').val('');
                        Swal.fire(
                            'Error',
                            'This Location Id already used',
                            'warning'
                        )
                    }
                }
            })
        });

        $(document).on('click', '#business_location_submit', function() {
            let formData = new FormData(document.getElementById('businessLocationForm'));
            let url = "{{ route('business-location.store') }}";

            $.ajax({
                method: 'POST',
                url: url,
                data: formData,
                contentType: false,
                processData: false,
                success: function(response) {
                    if (response.success) {
                        $.toast({
                            heading: 'Success',
                            text: response.msg,
                            position: 'top-right',
                            bgColor: '#1ecab8',
                            icon: 'success',
                            showHideTransition: 'fade',
                            loaderBg: '#ecf0f1',
                        });
                        window.location.href = response.redirect;
                    } else {
                        $.toast({
                            heading: 'Error',
                            text: response.msg,
                            position: 'top-right',
                            bgColor: '#f1646c',
                            icon: 'error',
                            showHideTransition: 'fade',
                            loaderBg: '#ecf0f1',
                        });
                    }
                },
                error: function(xhr) {
                    let message = 'An unexpected error occurred.';
                    if (xhr.responseJSON && xhr.responseJSON.msg) {
                        message = xhr.responseJSON.msg; // Use server message if available
                    }
                    $.toast({
                        heading: 'Error',
                        text: message,
                        position: 'top-right',
                        bgColor: '#f1646c',
                        icon: 'error',
                        showHideTransition: 'fade',
                        loaderBg: '#ecf0f1',
                        });
                    }
                });
        });
    </script>
@endsection