@extends('layouts.app')

@section('content')

<div class="page-header">
    <div>
        <h1>Beneficiaries <small>List & Management</small></h1>
        <ol class="breadcrumb">
            <li class="breadcrumb-item"><a href="#">Home</a></li>
            <li class="breadcrumb-item"><a href="#">Dashboard</a></li>
            <li class="breadcrumb-item active" aria-current="page">Beneficiaries List</li>
        </ol>
    </div>

    <div class="float-end">
        <a class="btn btn-primary" id="createNewProduct"><i class="fa fa-plus"></i> Add New Benficiary</a>
    </div>

</div>

<div class="content mt-3">
    <div class="card shadow mb-4">
        <div class="card-body">
            <div class="table-responsive">
                <div class="table-responsive">
                    <table class="table table-bordered data-table" id="dataTable" width="100%" cellspacing="0">
                    <thead>
                        <tr>
                            <th>S.No.</th>
                            <th>GSTIN</th>
                            <th>Business Type</th>
                            <th>Name</th>
                            <th>Billing Address</th>
                            <th>Shipping Address</th>
                            <th>Contact Person Name</th>
                            <th>Contact Person Phone</th>
                            <th>Action</th>
                        </tr>
                    </thead>
                    <tbody>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>

@include('view-modals/beneficiaries_addedit')

@stop

@section('scripting')
<script type="text/javascript">
    $(document).ready(function() {
        var lead_id = "{{ $lead_id ?? '' }}";
        $(".standardSelect").selectpicker();

        $('.standardSelect').on('change', function() {
            $(this).valid();
            $('.standardSelect').selectpicker('refresh');
        });

        $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
        });

        var table = $('.data-table').DataTable({
            processing: true,
            serverSide: true,
            scrollX:true,
            ajax: {
                url: "{{ url('getLeadBeneficiariesData') }}/{{$lead_id}}",
                type: "GET",
                data: {
                    _token: "{{ csrf_token() }}",
                }
            },
            columns: [{
                    data: 'DT_RowIndex',
                    name: 'DT_RowIndex'
                },
                {
                    data: 'gstin',
                    name: 'gstin'
                },
                {
                    data: 'business_type',
                    name: 'business_type'
                },
                {
                    data: 'name',
                    name: 'name'
                },
                {
                    data: 'billing_address',
                    name: 'billing_address'
                },
                {
                    data: 'shipping_address',
                    name: 'shipping_address'
                },
                {
                    data: 'contact_person_name',
                    name: 'contact_person_name'
                },
                {
                    data: 'contact_person_phone',
                    name: 'contact_person_phone'
                },
                {
                    data: 'action',
                    name: 'action',
                    orderable: false,
                    searchable: false
                },
            ],
            language: {
                search: "_INPUT_",
                searchPlaceholder: "Search Beneficiary records",
            }
        });

        $('#createNewProduct').click(function() {
            reset_modal();
            $('#saveBtn').val("Create");
            $('#status').val('').trigger("chosen:updated");
            $('#dataForm').trigger("reset");
            $('#modelHeading').html("Create New Beneficiary");
            $('#ajaxModel').modal('show');
        });

        $('body').on('click', '.editLeadBeneficiary', function() {
            var beneficiarie_id = $(this).data('id');
            reset_modal();
            $.get("{{ url('lead/beneficiaries/edit') }}/" + beneficiarie_id, function(data) {
                $('#modelHeading').html("Edit Beneficiary");
                $('#saveBtn').val("Save Changes");
                $('#ajaxModel').modal('show');
                $('#id').val(data.id);
                $('#gstin').val(data.gstin);
                $('#business_type').val(data.business_type);
                $('#name').val(data.name);
                $('#address').val(data.address);
                $('#billing_address').val(data.billing_address);
                $('#shipping_address').val(data.shipping_address);
                $('#contact_person_name').val(data.contact_person_name);
                $('#contact_person_email').val(data.contact_person_email);
                $('#contact_person_phone').val(data.contact_person_phone);
                $('#status').val(data.status);
                $('.standardSelect').selectpicker('refresh');
            });
        });

        $('#saveBtn').click(function(e) {
            e.preventDefault();
            $(this).html('Saving..');

            $.ajax({
                data: $('#dataForm').serialize(),
                url: "{{ url('lead/beneficiaries/store') }}/" + lead_id,
                type: "POST",
                dataType: 'json',

                success: function(data) {
                    $('#dataForm').trigger("reset");
                    $('#ajaxModel').modal('hide');
                    table.draw();
                    swal({
                        title: "Success!",
                        text: data.msg,
                        icon: "success",
                    });
                },
                error: function(data) {
                    if (data.status == 422) {
                        var errors = data.responseJSON.errors;
                        $.each(errors, function(index, value) {
                            $("#" + index).addClass("is-invalid");
                            $("#" + index + "-error").html(value[0]);
                        });
                    }
                    $('#saveBtn').html('Save Changes');
                }
            });
        });

        $('body').on('click', '.deleteLeadBeneficiary', function() {
            var beneficiarie_id = $(this).data("id");

            swal({
                title: "Are you sure?",
                text: "Once deleted, you cannot recover this Beneficiary!",
                icon: "warning",
                buttons: true,
                dangerMode: true,
            }).then((willDelete) => {
                if (willDelete) {
                    $.ajax({
                        url: "/lead/beneficiaries/delete/" + beneficiarie_id,
                        type: "POST", // Always POST
                        data: {
                            _method: 'DELETE', // Spoofing DELETE
                            _token: $('meta[name="csrf-token"]').attr('content') // CSRF Token
                        },
                        success: function(data) {
                            table.draw(); // Assuming DataTable
                            swal("Beneficiary has been deleted!", {
                                icon: "success"
                            });
                        },
                        error: function(xhr, status, error) {
                            console.log(xhr.responseText);
                            swal("Something went wrong!", {
                                icon: "error"
                            });
                        }
                    });
                } else {
                    swal("Beneficiary deletion canceled!");
                }
            });
        });



        $('.standardSelect').selectpicker('refresh');
    });

    function reset_modal() {
    $("#id").val("");
    $("#gstin").val("");
    $("#business_type").val("");
    $("#name").val("");
    $("#address").val("");
    $("#billing_address").val("");
    $("#shipping_address").val("");
    $("#contact_name").val("");
    $("#contact_email").val("");
    $("#contact_phone").val("");
    $('#status').val("");

    // Refresh selectpicker if you're using bootstrap-select
    $('.standardSelect').selectpicker('refresh');

    // Remove 'is-invalid' classes
    $(".form-control").removeClass("is-invalid");

    // Clear each error message span
    $("#gstin-error").html("");
    $("#business_type-error").html("");
    $("#name-error").html("");
    $("#address-error").html("");
    $("#billing_address-error").html("");
    $("#shipping_address-error").html("");
    $("#contact_person_name-error").html("");
    $("#contact_person_email-error").html("");
    $("#contact_person_phone-error").html("");
    $("#status-error").html("");

    // Reset button text
    $('#saveBtn').html('Save Changes');
}

</script>


@endsection