{% extends "./template.html" %}
{% block content %}
    <div class="card mt-4">
        <div class="card-header">
            <h2>New Templates</h2>
        </div>

        <form action={% url 'search_templates' %} method="post" class="search_templates" id="search_templates_form">
            {% csrf_token %}
            <table>
                <tr>
                    <td width="80%">{{ search_templates_form.search_templates }}</td>
                    <td width="20%"><input hidden type="submit" value="Search Templates"></td>
                </tr>
            </table>
        </form>

        <div class="card-body">
            <div class="form-row">
                <select id="select_new_template" class="form-control w-75">
                    <option value="">------</option>
                    <option value="Quote">Quote</option>
                </select>
                <input type="submit" value="New Template" id="new_template_submit" class="form-control w-25 btn btn-primary">
            </div>
        </div>
    </div>

    <div class="card mt-4">
        <div class="card-header">
            <h2>Quote Templates</h2>
        </div>
        <div class="card-body">
            {% if quote_template_results %}
                <table class="table table-hover table-striped">
                    <thead>
                        <tr>
                            <td>Description</td>
                        </tr>
                    </thead>
                    {% for row in quote_template_results %}
                        <tr>
                            <td><a href="{% url 'quote_template_information' row.quote_template_id %}">{{ row.quote_template_description }}</a></td>
                        </tr>
                    {% endfor  %}
                </table>
            {% else %}
                <label>Sorry, there are no templates yet. Please create them above.</label>
            {% endif %}
        </div>
    </div>




    <script>
        $("#new_template_submit").on('click', function(e) {
            var selected_value = $("#select_new_template").val();

            if (selected_value == "Quote") {
                $.ajax({
                    url: '/new_quote_template/',
                    data: $("#search_templates_form").serialize(),
                    type: 'POST',
                    dataType: 'JSON',
                    success: function(data) {
                        window.location.href = '/quote_template_information/' + data["quote_template_id"] + '/';
                    },
                    error: function() {
                        new_error("Sorry, could not create a new quote template");
                    }
                });
            }
        });
    </script>
{% endblock %}