@extends('layouts.master')

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

@section('content')
    <div class="col-12">
        <div class="card">
            <div id="accordion">
                
                <div class="border-bottom card-header" style="background-color: white; cursor: pointer;" data-toggle="collapse" data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
                    <h4 class="mb-0 header-title">
                        Filter
                    </h4>
                </div>
                

            <div id="collapseOne" class="collapse show mt-3" aria-labelledby="headingOne" data-parent="#accordion">
            <div class="card-body">
         
                <div class="col-md-4">
                    <div class="form-group">
                        <label class="required" style="font-weight: bold" for="activate_code">Location Name</label>
                        <select class="form-control select2" id="id" name="id">
                            <option value="">All</option>
                            @foreach ($business_locations as $business_location)
                                <option value="{{ $business_location->id }}">{{ $business_location->name }}
                                </option>
                            @endforeach
                        </select>
                    </div>
                </div>
            </div>
        </div>
            </div>
        </div>
        <div class="col-14">
            <div class="card">
                <div class="card-body">
                    <button class="btn btn-primary px-4 float-right mt-0 mb-3" data-toggle="modal" data-animation="bounce"
                        data-target=".bs-example-modal-sm-city"><i class="mdi mdi-plus-circle-outline mr-2"></i>Add
                    </button>
                    <h4 class="header-title mt-0">Business Locations Details</h4>
                    <div class="table-responsive dash-social">
                        <table id="laravel_datatable" class="table table-hover">
                            <thead class="thead-dark">
                                <tr>
                                    <th>Action</th>
                                    <th>Status</th>
                                    <th>Name</th>
                                    <th>Location Code</th>
                                    <th>Mobile Number</th>
                                    <th>Landmark</th>
                                    <th>City</th>
                                    <th>Zip Code</th>
                                    <th>State</th>
                                    <th>Country</th>
                                </tr>
                                <!--end tr-->
                            </thead>
                            <tbody>
                            </tbody>
                        </table>
                    </div>
                </div>
                <!--end card-body-->
            </div>
            <!--end card-->
        </div>
        <div class="modal fade bs-example-modal-sm-city" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel"
            aria-hidden="true">
            <div class="modal-dialog modal-m">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title mt-0"></h5>
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
                    </div>
                    <form action="{{ route('business-location-activate') }}" method="post">
                        @csrf
                        <div class="modal-body">
                            <div class="col-md-12">
                                <div class="head-activate">
                                    <h4> ENTER YOUR SERVICE ACTIVATION CODE
                                        HERE FOR ADD A NEW BUSINESS LOCATION </h4><br>
                                    <div class="col-md-12">
                                        <input type="password" class="form-control" name="activate_code" id="activate_code"
                                            placeholder="Activation Code">
                                    </div><br>
                                    <h4>Please contact the “CLICKY” for get your
                                        Business location service activation code</h4><br>
                                    <h4>076 - 630 3495 – (Mr. Chathura)</h4>
                                    <h4>074 - 289 0901 – (Ms. Nethmini)</h4>
                                </div>
                            </div>
                        </div>
                        <input type="hidden" name="id" id="id" value="">
                        <div class="modal-footer">
                            <button type="submit" class="btn btn-primary  btn-sm" id="">Activate </button>
                            <button type="button" class="btn btn-danger  btn-sm " data-dismiss="modal">Close</button>
                        </div>
                    </form>
                </div><!-- /.modal-content -->
            </div><!-- /.modal-dialog -->
        </div>
        <div id="business-location-edit" class="modal fade"></div>
        <div id="business-location-actvate-deactivate" class="modal fade"></div>
    @endsection
    @section('scripts')
        <script>
            $(document).ready(function() {
                var table = $('#laravel_datatable').DataTable({
                    dom: 'Blfrtip',
                    buttons: [

                        {
                            extend: 'copy',
                            exportOptions: {
                                columns: [1, 2, 3, 4, 5, 6, 7, 8, 9]
                            }
                        },
                        {
                            extend: 'excel',
                            exportOptions: {
                                columns: [1, 2, 3, 4, 5, 6, 7, 8, 9]
                            }
                        },
                        {
                            extend: 'pdf',
                            exportOptions: {
                                columns: [1, 2, 3, 4, 5, 6, 7, 8, 9]
                            }
                        },
                        {
                            extend: 'print',
                            exportOptions: {
                                columns: [1, 2, 3, 4, 5, 6, 7, 8, 9]
                            }
                        },
                    ],
                    processing: false,
                    serverSide: true,
                    ajax: {
                        url: "{{ url('/business/location/all') }}",

                        data: function(d) {
                            d.id = $('#id').val();
                        }
                    },
                    columnDefs: [{
                        "targets": [5],
                        "orderable": false,
                        "searchable": false,

                    }],

                    columns: [{
                            data: 'action',
                            name: 'action'
                        },
                        {
                            data: 'is_active',
                            name: 'is_active'
                        },
                        {
                            data: 'name',
                            name: 'name'
                        },
                        {
                            data: 'location_id',
                            name: 'location_id'
                        },
                        {
                            data: 'mobile',
                            name: 'mobile'
                        },
                        {
                            data: 'landmark',
                            name: 'landmark'
                        },
                        {
                            data: 'city',
                            name: 'city'
                        },
                        {
                            data: 'zip_code',
                            name: 'zip_code'
                        },
                        {
                            data: 'state',
                            name: 'state'
                        },
                        {
                            data: 'country',
                            name: 'country'
                        },
                    ]
                });
                //toast
                $('[data-toggle="tooltip"]').tooltip()

                function tableReload() {
                    table.ajax.reload();
                }
                $(document).on('change',
                    '#id',
                    function() {
                        table.ajax.reload();
                    });

                $(document).on('click', '.delete-location', function(e) {
                    e.preventDefault();
                    var url = $(this).attr('href');
                    Swal.fire({
                        title: 'Are you sure?',
                        text: "You won't be able to revert this!",
                        icon: 'warning',
                        showCancelButton: true,
                        confirmButtonColor: '#3085d6',
                        cancelButtonColor: '#d33',
                        confirmButtonText: 'Yes, delete it!'
                    }).then((result) => {
                        if (result.value) {
                            $.ajax({
                                type: "GET",
                                url: url,
                                data: {
                                    _token: "{{ csrf_token() }}"
                                },
                                success: function(response) {
                                    if (response.success == true) {
                                        $.toast({
                                            heading: 'Success',
                                            text: response.msg,
                                            position: 'top-right',
                                            bgColor: '#1ecab8',
                                            icon: 'success',
                                            showHideTransition: 'fade',
                                            loaderBg: '#ecf0f1'
                                        })
                                        table.ajax.reload();
                                    } else {
                                        $.toast({
                                            heading: 'Error',
                                            text: response.msg,
                                            position: 'top-right',
                                            bgColor: '#f1646c',
                                            icon: 'error',
                                            showHideTransition: 'fade',
                                            loaderBg: '#ecf0f1'
                                        })
                                    }
                                }
                            });
                        }
                    })
                });
                $(document).on('click', '#business_location_update', function() {
                    let formData = new FormData();

                    formData.append("_token", "{{ csrf_token() }}");
                    formData.append("name", $('#name').val());
                    formData.append("location_ids", $('#location_ids').val());
                    formData.append("ids", $('#ids').val());
                    formData.append("landmark", $('#landmark').val());
                    formData.append("zip_code", $('#zip_code').val());
                    formData.append("city", $('#city').val());
                    formData.append("state", $('#state').val());
                    formData.append("country", $('#country').val());
                    formData.append("mobile", $('#mobile').val());
                    formData.append("alternate_number", $('#alternate_number').val());
                    formData.append("email", $('#email').val());
                    formData.append("waybill_print_type", $('#waybill_print_type').val());
                    formData.append("website", $('#website').val());
                    formData.append("custom_field1", $('#custom_field1').val());
                    formData.append("custom_field2", $('#custom_field2').val());
                    formData.append("custom_field3", $('#custom_field3').val());

                    //save the image
                    let imageFile = $('#image')[0].files[0];
                    if (imageFile) {
                        formData.append("image", imageFile);
                    }

                    let url = "{{ route('business-location.update') }}";
                    $.ajax({
                        method: 'POST',
                        url: url,
                        data: formData,
                        processData: false,
                        contentType: false,
                        success: function(response) {
                            if (response.success == true) {
                                $.toast({
                                    heading: 'Success',
                                    text: response.msg,
                                    position: 'top-right',
                                    bgColor: '#1ecab8',
                                    icon: 'success',
                                    showHideTransition: 'fade',
                                    loaderBg: '#ecf0f1',
                                })
                                $('#business-location-edit').modal('hide');
                                table.ajax.reload();
                            } else {
                                $.toast({
                                    heading: 'Error',
                                    text: response.msg,
                                    position: 'top-right',
                                    bgColor: '#f1646c',
                                    icon: 'error',
                                    showHideTransition: 'fade',
                                    loaderBg: '#ecf0f1',
                                })
                            }
                        }
                    });
                });
                $(document).on('click', '#update_status', function() {
                    let actvate = $('#actvate').val();
                    let location_id = $('#location_id').val();
                    let url = "{{ route('location-activate.update') }}";
                    $.ajax({
                        method: 'POST',
                        url: url,
                        data: {
                            "_token": "{{ csrf_token() }}",
                            'actvate': actvate,
                            'location_id': location_id,
                        },
                        success: function(response) {
                            if (response.success == true) {
                                $.toast({
                                    heading: 'Success',
                                    text: response.msg,
                                    position: 'top-right',
                                    bgColor: '#1ecab8',
                                    icon: 'success',
                                    showHideTransition: 'fade',
                                    loaderBg: '#ecf0f1',
                                })
                                $('#business-location-actvate-deactivate').modal('hide');
                                table.ajax.reload();
                            } else {
                                $.toast({
                                    heading: 'Error',
                                    text: response.msg,
                                    position: 'top-right',
                                    bgColor: '#f1646c',
                                    icon: 'error',
                                    showHideTransition: 'fade',
                                    loaderBg: '#ecf0f1',
                                })
                            }
                        }
                    });
                });
            });
            $(document).on('click', '.edit-location', function() {
                $('#business-location-edit').load($(this).data('href'), function() {
                    $('#mdate3').bootstrapMaterialDatePicker({
                        weekStart: 0,
                        time: false
                    });
                    $('#mdate3').val(moment(new Date()).format("YYYY-MM-DD"));
                    $('#business-location-edit').modal('show');
                    $('.dropify').dropify();
                })
            });
            $(document).on('click', '.activate-deactivate', function() {
                $('#business-location-actvate-deactivate').load($(this).data('href'), function() {
                    $('#mdate3').bootstrapMaterialDatePicker({
                        weekStart: 0,
                        time: false
                    });
                    $('#mdate3').val(moment(new Date()).format("YYYY-MM-DD"));
                    $('#business-location-actvate-deactivate').modal('show');
                })
            });
        </script>
    @endsection