{% extends "../template.html" %}
{% block content %}
{% load static %}
    <script type="text/javascript" src="{% static 'NearBeach/javascript/csrf_finder.js' %}"></script>
    <body onload="load_list_of_taxes_list()">
        <div class="card mt-4">
            <div class="card-header">
                <h2>List of Taxes</h2>
            </div>
            <div class="card-body" id="list_of_taxes_list">
                Loading...
            </div>
        </div>

        <div class="modal" tabindex="-1" role="dialog" id="new_tax_modal">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title">New Tax</h5>
                        <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" class="new_tax" id="new_tax" style=""></form>
                    </div>
                    <div class="modal-footer">
                        <a href="javascript:void(0)" onclick="create_new_tax()" class="btn btn-primary">Create new Tax</a>
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                    </div>
                </div>
            </div>
        </div>

        <div class="modal" tabindex="-1" role="dialog" id="edit_tax_modal">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title">Edit Tax</h5>
                        <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" class="edit_tax" id="edit_tax" style=""></form>
                    </div>
                    <div class="modal-footer">
                        <a href="javascript:void(0)" onclick="edit_tax()" class="btn btn-primary">Update Tax</a>
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                    </div>
                </div>
            </div>
        </div>


        <script>
            $("#edit_tax").on('submit', function(e) {
                e.preventDefault();
                edit_tax();
            });


            $("#new_tax").on('submit', function(e) {
                e.preventDefault();
                create_new_tax();
            });


            function create_new_tax() {
                /*
                Check to make sure that both fields are filled out. Otherwise send back error
                 */
                if (($("#id_tax_amount").val() == "") || ($("#id_tax_description").val() == "")) {
                    //Ok - need to send back an error and return with -1
                    $("#new_tax").html("<div class='alert-danger'>Please fill out all fields!</div>" + $("#new_tax").html());
                    return -1;
                }

                $.ajax({
                    type: 'POST',
                    url: '/list_of_taxes_new/',
                    data: $("#new_tax").serialize(),
                    success: function() {
                        //Blank form - it can interfer with other processes
                        $("#new_tax").html("");

                        //Close Modal
                        $("#new_tax_modal").modal("hide");

                        //Reload tax list
                        load_list_of_taxes_list();
                    },
                    error: function() {
                        new_error("Sorry, document tree create folder did not save. Please try again.");
                    }
                })
            }


            function edit_tax() {
                /*
                Check to make sure that both fields are filled out. Otherwise send back error
                 */
                if (($("#id_tax_amount").val() == "") || ($("#id_tax_description").val() == "")) {
                    //Ok - need to send back an error and return with -1
                    $("#edit_tax").html("<div class='alert-danger'>Please fill out all fields!</div>" + $("#edit_tax").html());
                    return -1;
                }

                $.ajaxSetup({
                    beforeSend: function (xhr, settings) {
                        if (!csrfSafeMethod(settings.type) && !this.crossDomain) {
                            xhr.setRequestHeader("X-CSRFToken", csrftoken);
                        }
                    }
                });


                var tax_id = $("#hidden_tax_id").val();
                $.ajax({
                    type: 'POST',
                    url: '/list_of_taxes_edit/' + tax_id + '/',
                    data: $("#edit_tax").serialize(),
                    success: function() {
                        //Black form - it can interfer with other sections
                        $("#edit_tax").html("");

                        //Close Modal
                        $("#edit_tax_modal").modal("hide");

                        //Update tax list
                        load_list_of_taxes_list();
                    },
                    error: function() {
                        new_error("Sorry, document tree create folder did not save. Please try again.");
                    }
                });
            }


            function list_of_taxes_deactivate(tax_id) {
                $.ajaxSetup({
                    beforeSend: function (xhr, settings) {
                        if (!csrfSafeMethod(settings.type) && !this.crossDomain) {
                            xhr.setRequestHeader("X-CSRFToken", csrftoken);
                        }
                    }
                });
                $.ajax({
                    url: '/list_of_taxes_deactivate/' + tax_id + '/',
                    data: {},
                    type: "POST",
                    success: function(e) {
                        load_list_of_taxes_list()
                    },
                    error: function() {
                        new_error("Sorry, but we were not able to deactivate the tax for you.")
                    }
                });
            }

            function load_list_of_taxes_edit(tax_id) {
                //Show modal
                $("#edit_tax_modal").modal("show");

                //Get data for modal
                $.ajax({
                    url: '/list_of_taxes_edit/' + tax_id + '/',
                    data: {},
                    type: 'GET',
                    success: function(e) {
                        $("#edit_tax").html(e);
                        $("#new_tax").html("");
                    },
                    error: function() {
                        new_error("Sorry, but we could not get this function's data")
                    }
                });
            }

            function load_list_of_taxes_list() {
                $.ajax({
                    url: '/list_of_taxes_list/',
                    data: {},
                    type: 'GET',
                    success: function(e) {
                        $("#list_of_taxes_list").html(e);
                    },
                    error: function() {
                        new_error("Sorry, but we could not get list of taxes")
                    }
                });
            }


            function load_list_of_taxes_new() {
                //Show the modal
                $("#new_tax_modal").modal("show");

                //Get the data for the form
                $.ajax({
                    url: '/list_of_taxes_new/',
                    data: {},
                    type: 'GET',
                    success: function(e) {
                        $("#new_tax").html(e);
                        $("#edit_tax").html("");
                    },
                    error: function() {
                        new_error("Sorry, but we could not get the new tax")
                    }
                });
            }


        </script>
    </body>
{% endblock %}