@extends('layouts.app')
@section('title', 'Invoices')
@section('content')
    <div class="container-fluid mt-1 pt-1">
        <x-invoicetabs/>
        <div class="col-lg-12 col-md-12 col-xl-12 col-sm-12">
            <div class="card">
                <div class="card-body pt-0">
                    <table id="datatable" class="table table-bordered mb-0">
                        <thead>
                            <tr>
                                <th class="td_bgcolor">Sl.No</th>
                                <th class="td_bgcolor">Lender</th>
                                <th class="td_bgcolor">State</th>
                                <th class="td_bgcolor">Loan Type</th>
                                <th class="td_bgcolor">Service Type</th>
                                <th class="td_bgcolor">Cost</th>
                                <th class="td_bgcolor">Allowed No of Parcels</th>
                                <th class="td_bgcolor">Additional Parcel Cost</th>
                                <th class="td_bgcolor">Allowed Loan Amount</th>
                                <th class="td_bgcolor">Additional Loan Increase Amount</th>
                                <th class="td_bgcolor">Additional Loan Increase Cost</th>
                                <th class="td_bgcolor">Action</th>
                            </tr>
                        </thead>
                        <tbody>
                                                    </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
    <div id="myModal_pricing" class="modal fade" role="dialog">
        <div class="modal-dialog modal-xl">
            <div class="modal-content">
                <div class="modal-header">
                    <h6 class="modal-title">Add Pricing</h6>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <form method="POST" role="form" name="add_invoice_form" id="add_invoice_form"
                        data-parsley-validate="">
                        @csrf
                        <div class="row">
                            <div class="col-md-3" id="lender_access_data">
                                <div class="form-group">
                                    <label for="example-firstname-input" class="col-form-label"
                                        style="font-size:14px;">Lender <span class="text-danger"> * </span></label>
                                    <select required class="form-control" name="lender_id" id="lender_id">
                                        <option value=""> Select Lender </option>
                                        @if (isset($ztpLenders))
                                            @foreach ($ztpLenders as $ztplenders_data)
                                                <option value="{{ $ztplenders_data->id }}">
                                                    {{ $ztplenders_data->lender_name }}</option>
                                            @endforeach
                                        @endif
                                    </select>
                                </div>
                            </div>
                            <div class="col-md-3" id="lender_access_data">
                                <div class="form-group">
                                    <label for="example-firstname-input" class="col-form-label"
                                        style="font-size:14px;">State <span class="text-danger"> * </span></label>
                                    <select required class="form-control" name="state_id" id="state_id">
                                        <option value=""> Select State </option>
                                        <option value="All"> All States </option>
                                        <option value="39">NY</option>
                                        <option value="46">PA</option>
                                        <option value="51">TX</option>
                                    </select>
                                </div>
                            </div>
                            <div class="col-md-3" id="lender_access_data">
                                <div class="form-group">
                                    <label for="example-firstname-input" class="col-form-label" style="font-size:14px;">Loan
                                        Type <span class="text-danger"> * </span></label>
                                    <select required class="form-control" name="loan_type" id="loan_type">
                                        <option value=""> Select Loan Type </option>
                                        @if (isset($ztploantypes))
                                            @foreach ($ztploantypes as $ztploantype)
                                                <option value="{{ $ztploantype->id }}">
                                                    {{ $ztploantype->portfolio_type_name }}</option>
                                            @endforeach
                                        @endif
                                    </select>
                                </div>
                            </div>
                            <div class="col-md-3" id="lender_access_data">
                                <div class="form-group">
                                    <label for="example-firstname-input" class="col-form-label"
                                        style="font-size:14px;">Service Type</label>
                                    <select class="form-control" name="service_type" id="service_type">
                                        <option value=""> Select Service Type </option>
                                        @if (isset($ztpservicetypes))
                                            @foreach ($ztpservicetypes as $ztpservicetype)
                                                <option value="{{ $ztpservicetype->id }}">
                                                    {{ $ztpservicetype->service_type_name }}</option>
                                            @endforeach
                                        @endif
                                    </select>
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label for="example-firstname-input" class="col-form-label" style="font-size:14px;">Cost
                                        <span class="text-danger"> * </span></label>
                                    <input required type="text" name="cost" id="cost" class="form-control"
                                        value="" autocomplete="off" placeholder="Enter Cost">
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label for="example-firstname-input" class="col-form-label"
                                        style="font-size:14px;">Allowed Number of Parcels <span class="text-danger"> *
                                        </span></label>
                                    <input required type="text" name="allowed_no_of_parcels" id="allowed_no_of_parcels"
                                        class="form-control" value="" autocomplete="off"
                                        placeholder="Enter Allowed Number of Parcels" data-parsley-type="digits">
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label for="example-firstname-input" class="col-form-label"
                                        style="font-size:14px;">Additional Parcel Cost <span class="text-danger"> *
                                        </span></label>
                                    <input required type="text" name="additional_parcelcost"
                                        id="additional_parcelcost" class="form-control" value=""
                                        autocomplete="off" placeholder="Enter Additional Parcel Cost">
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label for="example-firstname-input" class="col-form-label"
                                        style="font-size:14px;">Allowed Loan Amount <span class="text-danger"> *
                                        </span></label>
                                    <input required type="text" name="allowed_loanamount" id="allowed_loanamount"
                                        class="form-control" value="" autocomplete="off"
                                        placeholder="Enter Allowed Loan Amount">
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label for="example-firstname-input" class="col-form-label"
                                        style="font-size:14px;">Additional Loan Increase Amount <span class="text-danger"> *
                                        </span></label>
                                    <input required type="text" name="additional_loan_increaseamount"
                                        id="additional_loan_increaseamount" class="form-control" value=""
                                        autocomplete="off" placeholder="Enter Additional Loan Increase Amount">
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label for="example-firstname-input" class="col-form-label"
                                        style="font-size:14px;">Additional Loan Increase Cost <span class="text-danger"> *
                                        </span></label>
                                    <input required type="text" name="additional_loan_increasecost"
                                        id="additional_loan_increasecost" class="form-control" value=""
                                        autocomplete="off" placeholder="Enter Additional Loan Increase Cost">
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="submit" class="btn btn-primary"
                    form="add_invoice_form">
                    Submit </button>
                    <button type="button" class="btn btn-danger" data-dismiss="modal">Cancel</button>
                </div>
            </div>
        </div>
    </div>

    <!-- Modal - Update User Details -->
    <div id="myModal_pricing_update" class="modal fade" role="dialog">
        <div class="modal-dialog modal-xl">
            <div class="modal-content">
                <div class="modal-header">
                    <h6 class="modal-title">Update Pricing</h6>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">X</span>
                    </button>
                </div>
                <div class="modal-body">
                    <form method="POST" role="form" name="pricing_update_form" id="pricing_update_form"
                        data-parsley-validate="">
                        @csrf
                        <input type="hidden" name="pricing_id" id="pricing_id" />
                        <div class="row">
                            <div class="col-md-3" id="lender_access_data">
                                <div class="form-group">
                                    <label for="example-firstname-input" class="col-form-label"
                                        style="font-size:14px;">Lender <span class="text-danger"> * </span></label>
                                    <select required class="form-control" name="lender_id" id="lender_id1">
                                        <option value=""> Select Lender </option>
                                        @if (isset($ztpLenders))
                                            @foreach ($ztpLenders as $ztplenders_data)
                                                <option value="{{ $ztplenders_data->id }}">
                                                    {{ $ztplenders_data->lender_name }}</option>
                                            @endforeach
                                        @endif
                                    </select>
                                </div>
                            </div>
                            <div class="col-md-3" id="lender_access_data">
                                <div class="form-group">
                                    <label for="example-firstname-input" class="col-form-label"
                                        style="font-size:14px;">State <span class="text-danger"> * </span></label>
                                    <select required class="form-control" name="state_id" id="state_id1">
                                        <option value=""> Select State </option>
                                        <option value="All"> All States </option>
                                        <option value="39">NY</option>
                                        <option value="46">PA</option>
                                        <option value="51">TX</option>
                                    </select>
                                </div>
                            </div>
                            <div class="col-md-3" id="lender_access_data">
                                <div class="form-group">
                                    <label for="example-firstname-input" class="col-form-label"
                                        style="font-size:14px;">Loan
                                        Type <span class="text-danger"> * </span></label>
                                    <select required class="form-control" name="loan_type" id="loan_type1">
                                        <option value=""> Select Loan Type </option>
                                        @if (isset($ztploantypes))
                                            @foreach ($ztploantypes as $ztploantype)
                                                <option value="{{ $ztploantype->id }}">
                                                    {{ $ztploantype->portfolio_type_name }}</option>
                                            @endforeach
                                        @endif
                                    </select>
                                </div>
                            </div>
                            <div class="col-md-3" id="lender_access_data">
                                <div class="form-group">
                                    <label for="example-firstname-input" class="col-form-label"
                                        style="font-size:14px;">Service Type <span class="text-danger"> * </span></label>
                                    <select required class="form-control" name="service_type" id="service_type1">
                                        <option value=""> Select Service Type </option>
                                        @if (isset($ztpservicetypes))
                                            @foreach ($ztpservicetypes as $ztpservicetype)
                                                <option value="{{ $ztpservicetype->id }}">
                                                    {{ $ztpservicetype->service_type_name }}</option>
                                            @endforeach
                                        @endif
                                    </select>
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label for="example-firstname-input" class="col-form-label"
                                        style="font-size:14px;">Cost
                                        <span class="text-danger"> * </span></label>
                                    <input required type="text" name="cost" id="cost1" class="form-control"
                                        value="" autocomplete="off" placeholder="Enter Cost">
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label for="example-firstname-input" class="col-form-label"
                                        style="font-size:14px;">Allowed Number of Parcels <span class="text-danger"> *
                                        </span></label>
                                    <input required type="text" name="allowed_no_of_parcels"
                                        id="allowed_no_of_parcels1" class="form-control" value=""
                                        autocomplete="off" placeholder="Enter Allowed Number of Parcels"
                                        data-parsley-type="digits">
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label for="example-firstname-input" class="col-form-label"
                                        style="font-size:14px;">Additional Parcel Cost <span class="text-danger"> *
                                        </span></label>
                                    <input required type="text" name="additional_parcelcost"
                                        id="additional_parcelcost1" class="form-control" value=""
                                        autocomplete="off" placeholder="Enter Additional Parcel Cost">
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label for="example-firstname-input" class="col-form-label"
                                        style="font-size:14px;">Allowed Loan Amount <span class="text-danger"> *
                                        </span></label>
                                    <input required type="text" name="allowed_loanamount" id="allowed_loanamount1"
                                        class="form-control" value="" autocomplete="off"
                                        placeholder="Enter Allowed Loan Amount">
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label for="example-firstname-input" class="col-form-label"
                                        style="font-size:14px;">Additional Loan Increase Amount <span class="text-danger"> *
                                        </span></label>
                                    <input required type="text" name="additional_loan_increaseamount"
                                        id="additional_loan_increaseamount1" class="form-control" value=""
                                        autocomplete="off" placeholder="Enter Additional Loan Increase Amount">
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label for="example-firstname-input" class="col-form-label"
                                        style="font-size:14px;">Additional Loan Increase Cost <span class="text-danger"> *
                                        </span></label>
                                    <input required type="text" name="additional_loan_increasecost"
                                        id="additional_loan_increasecost1" class="form-control" value=""
                                        autocomplete="off" placeholder="Enter Additional Loan Increase Cost">
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="submit" class="btn btn-primary"
                    form="pricing_update_form"> Update </button>
                    <button type="button" class="btn btn-danger" data-dismiss="modal">Cancel</button>

                </div>
            </div>
        </div>
    </div>

@endsection

@section('script')
<script type="text/javascript">
         var table = $('#datatable').DataTable({
		responsive: true,
		dom: 'l<"toolbar">Bfrtip',
        buttons: [
            'excel'
        ],
		initComplete: function(){
		    $("div.toolbar").html('<button id="addLender" type="button" class="ml-2 tble_btn btn btn-primary" data-toggle="modal" data-target="#myModal_pricing"><img class="menuicon" src="{{asset("app-assets/assets/images/add.svg")}}">&nbsp;Add Lender Pricing </button><br />');
		},
	   'columnDefs': [ {
			'targets': [4],
			'orderable': false,
		}]
    });
        $(document).ready(function() {
            $('#cost').change(function() {
                var value = parseFloat($('#cost').val()).toFixed(2);
                var parts = value.toString().split(".");
                parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ",");
                $('#cost').val(parts.join("."));
            });

            $('#additional_parcelcost').change(function() {
                var value = parseFloat($('#additional_parcelcost').val()).toFixed(2);
                var parts = value.toString().split(".");
                parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ",");
                $('#additional_parcelcost').val(parts.join("."));
            });

            $('#allowed_loanamount').change(function() {
                var value = parseFloat($('#allowed_loanamount').val()).toFixed(2);
                var parts = value.toString().split(".");
                parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ",");
                $('#allowed_loanamount').val(parts.join("."));
            });
            $('#additional_loan_increaseamount').change(function() {
                var value = parseFloat($('#additional_loan_increaseamount').val()).toFixed(2);
                var parts = value.toString().split(".");
                parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ",");
                $('#additional_loan_increaseamount').val(parts.join("."));
            });
            $('#additional_loan_increasecost').change(function() {
                var value = parseFloat($('#additional_loan_increasecost').val()).toFixed(2);
                var parts = value.toString().split(".");
                parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ",");
                $('#additional_loan_increasecost').val(parts.join("."));
            });

            //update form
            $('#cost1').change(function() {
                var value = parseFloat($('#cost1').val()).toFixed(2);
                var parts = value.toString().split(".");
                parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ",");
                $('#cost1').val(parts.join("."));
            });

            $('#additional_parcelcost1').change(function() {
                var value = parseFloat($('#additional_parcelcost1').val()).toFixed(2);
                var parts = value.toString().split(".");
                parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ",");
                $('#additional_parcelcost1').val(parts.join("."));
            });

            $('#allowed_loanamount1').change(function() {
                var value = parseFloat($('#allowed_loanamount1').val()).toFixed(2);
                var parts = value.toString().split(".");
                parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ",");
                $('#allowed_loanamount1').val(parts.join("."));
            });
            $('#additional_loan_increaseamount1').change(function() {
                var value = parseFloat($('#additional_loan_increaseamount1').val()).toFixed(2);
                var parts = value.toString().split(".");
                parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ",");
                $('#additional_loan_increaseamount1').val(parts.join("."));
            });
            $('#additional_loan_increasecost1').change(function() {
                var value = parseFloat($('#additional_loan_increasecost1').val()).toFixed(2);
                var parts = value.toString().split(".");
                parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ",");
                $('#additional_loan_increasecost1').val(parts.join("."));
            });
        });

        $(function() {
            $('#users_table').DataTable({
                scrollX: true,
                dom: '<"mt-2"<"row"<"col-md-6"l><"col-md-6"<B><"float-end"f>>><"mb-1"<t>><"row"<"col"i><"col"p>>>',
                buttons: [{
                    text: '<strong>Add Pricing</strong>',
                    className: 'btn btn-sm ml-2',
                    action: function(e, node, config) {
                        openUsers_modal();
                    }
                }],
            });

            $('#add_invoice_form').submit(function(e) {
                e.preventDefault()
                if ($("#add_invoice_form").parsley()) {
                    if ($("#add_invoice_form").parsley().validate()) {
                        if ($("#add_invoice_form").parsley().isValid()) {
                            $.ajax({
                                url: "{{ route('addPricing') }}",
                                type: "POST",
                                data: new FormData($("#add_invoice_form")[0]),
                                dataType: 'html',
                                processData: false,
                                contentType: false,
                                success: function(response) {
                                    if (response) {
                                        var result = response.split('@#!');
                                        if (result[1] != 'error')
                                        {
                                            $("#myModal_pricing").modal('hide');
                                            Swal.fire({
                                                position: 'middle',
                                                icon: result[1],
                                                title: result[2],
                                                showConfirmButton: false
                                            });
                                            setTimeout(function() {
                                                location.href = location.href;
                                            }, 500);
                                        } else
                                        {
                                            Swal.fire({
                                                position: 'middle',
                                                icon: result[1],
                                                title: result[2],
                                                showConfirmButton: false
                                            });
                                        }
                                    }
                                }
                            });
                        }
                    }
                }
            });

            $('#pricing_update_form').submit(function(e) {
                e.preventDefault()
                if ($("#pricing_update_form").parsley()) {
                    if ($("#pricing_update_form").parsley().validate()) {
                        if ($("#pricing_update_form").parsley().isValid()) {
                            $.ajax({
                                url: "{{ route('updatePricing') }}",
                                type: "POST",
                                data: new FormData($("#pricing_update_form")[0]),
                                dataType: 'html',
                                processData: false,
                                contentType: false,
                                success: function(response) {
                                    if (response) {
                                        var result = response.split('@#!');
                                        if (result[1] != 'error') {
                                            $("#myModal_pricing_update").modal('hide');
                                            Swal.fire({
                                                position: 'middle',
                                                icon: result[1],
                                                title: result[2],
                                                showConfirmButton: false,
                                                timer: 500
                                            });
                                            setTimeout(function() {
                                                location.href = location.href;
                                            }, 1000);
                                        } else {
                                            Swal.fire({
                                                position: 'middle',
                                                icon: result[1],
                                                title: result[2],
                                                showConfirmButton: false,
                                                timer: 500
                                            });
                                        }
                                    }
                                }
                            });
                        }
                    }
                }
            });
        });

        function openUsers_modal() {
            $('#add_invoice_form').parsley().reset();
            document.getElementById("add_invoice_form").reset();
            var addUserModal = new bootstrap.Modal(document.getElementById('myModal_pricing'), {
                backdrop: 'static',
                keyboard: false
            });
            $("#myModal_pricing").appendTo("body").modal('show');
        }

        function edit_user(priceId) {
            $('#pricing_update_form').parsley().reset();
            document.getElementById("pricing_update_form").reset();
            var updateUserModal = new bootstrap.Modal(document.getElementById('myModal_pricing_update'), {
                backdrop: 'static',
                keyboard: false
            });
            $("#myModal_pricing_update").appendTo("body").modal('show');
            $.ajax({
                url: "/editPricing/" + priceId,
                dataType: "json",
                success: function(data)
                {
                    $('#pricing_id').val(data.result.id);
                    $('#lender_id1').val(data.result.lender_id);
                    $('#loan_type1').val(data.result.loan_type);
                    $('#service_type1').val(data.result.service_type);
                    $('#cost1').val(data.result.cost);
                    $('#allowed_no_of_parcels1').val(data.result.allowed_no_of_parcels);
                    $('#additional_parcelcost1').val(data.result.additional_parcelcost);
                    $('#allowed_loanamount1').val(data.result.allowed_loanamount);
                    $('#additional_loan_increaseamount1').val(data.result.additionloanincrease_amount);
                    $('#additional_loan_increasecost1').val(data.result.additional_loan_increasecost);
                    $('#state_id1').val(data.result.state_id);
                }
            })
        }
        $(document).ready(function() {
		$(".odtabs").not("#tab1").addClass('btn-outline-secondary');
		$("#tab1").addClass('btn-secondary');
	});
    </script>
@endsection