{% extends "support.html" %}


{% block head %}
    {{ block.super }}
    <script>
    {% if showAddEdit == 'Y' %}
        {% if not add_mode %}
            var num_tag_test_rows = {{ tag_test_list|length }};
        {% else %}
            var num_tag_test_rows = 1;
        {% endif %}
    {% else %}
        var num_tag_test_rows = 1;
    {% endif %}

        function get_lookup_id(field, field_name) {
            var lookupid = field.attr("id");
            lookupid = lookupid.replace(field_name, "");
            return lookupid;
        }

        function update_selected_data_tag_list(id) {
            retval = "";

            $("." + id + "-data-tag-chk:checkbox:checked").each(function() {
                if (retval.length > 0) {
                    retval += ", ";
                }
                retval += $(this).next('label').text();
            });

            return retval;
        }

        $(function () {
            $(document).tooltip();

            $("input[id$='-active']").click(function () {
                $.post("{% url 'support:support-update-pms-fill-action-lookup-active' %}",
                        {'csrfmiddlewaretoken': '{{csrf_token}}',
                            lookup_id: get_lookup_id($(this), "-active"),
                            field_val: $(this).prop("checked")});
            });

            $("#edit-pms-fill-action-lookup").dialog({
                {% if showAddEdit == 'Y' %}
                    autoOpen: true,
                {% else %}
                    autoOpen: false,
                {% endif %}
                closeOnEscape: false,
                modal: true,
                draggable: false,
                width: 1000,
                buttons: [
                    {
                        text: "Close",
                        "class": 'modal-dialog-button-right',
                        click: function () {
                            $(this).dialog("close");
                            window.location.href = "{% url 'support:support-manage-pms-fill-action-lookup' pms.id %}?sort={{ current_sort }}";
                        }
                    },
                    {
                        text: "Save",
                        "class": 'modal-dialog-button-left',
                        click: function () {
                            $("#editFillActionLookupForm").validate();
                            if ($("#editFillActionLookupForm").valid()) {
                                document.editFillActionLookupForm.submit();
                                $(this).dialog("close");
                            }
                        }
                    }
                ]
            });

            $("#btn-add-fill-action-lookup").click(function () {
                window.location.href = "{% url 'support:support-add-pms-fill-action-lookup' pms.id %}";
            });

            {% if showAddEdit == 'Y' %}
                $("#editFillActionLookupForm").validate({
                    onkeyup: false,
                    errorContainer: $("#edit-fill-action-lookup-validation-alert"),
                    errorLabelContainer: $("ul", $("#edit-fill-action-lookup-validation-alert")),
                    wrapper: 'li'
                });

                 $("#id_search_order").rules('add', {
                    required: true,
                    digits: true,
                    messages: {
                        required: "Fill Action lookup search order cannot be blank.",
                        digits: "Fill Action lookup search order must be numeric."
                    }
                });

                 $("#id_action").rules('add', {
                    required: true,
                    messages: {
                        required: "Fill Action lookup action cannot be blank."
                    }
                });


                $("#editFillActionLookupForm").on("click", "input[id$='-data-tag-chk']", function () {
                    var id = $(this).attr("id").replace("-data-tag-chk", "");
                    var dash_idx = id.indexOf("-");
                    id = id.substring(0, dash_idx);
                    $("#" + id + "-sel-data-tag-list").html(update_selected_data_tag_list(id));
                });

                $("input[id$='-data-tag-chk']").each(function () {
                    var id = $(this).attr("id").replace("-data-tag-chk", "");
                    var dash_idx = id.indexOf("-");
                    id = id.substring(0, dash_idx);
                    $("#" + id + "-sel-data-tag-list").html(update_selected_data_tag_list(id));
                });

                $("#editFillActionLookupForm").on("click", "button[id$='-del-tag-test-row']", function () {
                   $(this).closest('tr').remove();
                });

                $("#add-tag-test-row").click(function() {
                    num_tag_test_rows++;
                    var newrow = $("#data-tag-test-table tr:last").clone().find("input").each(function() {
                        $(this).attr({
                            'id': function(_, id) { return num_tag_test_rows + "-" + id.substring(id.indexOf("-") + 1) },
                            'name': function(_, name) { return num_tag_test_rows + "-" + name.substring(name.indexOf("-") + 1) }
                        });
                        if ($(this).attr('type').toLowerCase() == "checkbox") {
                            $(this).prop('checked', false);
                            $(this).attr({
                                'class': function(_, cls) { return num_tag_test_rows + "-" + cls.substring(cls.indexOf("-") + 1) }
                            });
                        } else {
                            $(this).val('');
                        }
                    }).end();
                    newrow.find("span").attr({
                        'id': function(_, id) { return num_tag_test_rows + "-" + id.substring(id.indexOf("-") + 1) }
                    });
                    newrow.find("span").html('');
                    newrow.find("button").show();
                    newrow.appendTo("#data-tag-test-table");
                });

            {% endif %}

        });
    </script>
{% endblock %}

{% block pagehead %}
    {% include 'pagehead.html' %}
{% endblock %}

{% block content %}
    <p><a href="{% url 'support:support-manage-interface' %}">Back To Manage PMIS Interface</a></p>
    <form id="pmsFillActionLookupForm" name="pmsFillActionLookupForm" method="POST">
    {% csrf_token %}
    <div>
        <table class="table table-bordered table-striped">
            <thead>
            <tr class="dosis-report-header">
                {% include 'report-table-header.html' %}
                <th><i class="icon-list"></i></th>
            </tr>
            </thead>
            <tbody>
            {% for lookup in lookup_list %}
                <tr>
                    <td style="padding-bottom: 2px;">{{ lookup.lookup_type }}</td>
                    <td style="padding-bottom: 2px;">{% if lookup.data_tag_id %}{% for list in lookup.data_tag_id %}{% if not forloop.first %}], [{% else %}[{% endif %}{% for tag in list %}
                        {% if tag %}{% if not forloop.first %}, {% endif %}
                        {% for data in data_tag_list %}{% if data.id == tag %}{{ data.tag }}{% endif %}{% endfor %}{% endif %}{% endfor %}
                    {% if forloop.last %}]{% endif %}{% endfor %}{% endif %}</td>
                    <td style="padding-bottom: 2px;">{% if lookup.test_value %}{% for val in lookup.test_value %}{% if not forloop.first %}, {% endif %}{{ val }}{% endfor %}{% endif %}</td>
                    <td style="padding-bottom: 2px;">{{ lookup.order_req_type }}</td>
                    <td style="padding-bottom: 2px;">{{ lookup.search_order }}</td>
                    <td style="padding-bottom: 2px;">{{ lookup.action }}</td>
                    <td style="padding-bottom: 2px;"><input type="checkbox" id="{{ lookup.id }}-active" name="{{ lookup.id }}-active" {% if lookup.active %}checked{% endif %}/></td>
                    <td nowrap><a href="{% url 'support:support-edit-pms-fill-action-lookup' pms.id lookup.id %}?sort={{ current_sort }}">
                        <i title="Edit Fill Action Lookup" class="icon-pencil"></i></a>&nbsp;&nbsp;&nbsp;
                    <a href="{% url 'support:support-copy-pms-fill-action-lookup' pms.id lookup.id %}?sort={{ current_sort }}">
                        <i title="Copy Fill Action Lookup" class="icon-plus"></i></a></td>
                </tr>
            {% endfor %}
            </tbody>
        </table>
    </div>
    <div>
            <span><button style="float: left;" type="button" name="btn-add-fill-action-lookup"
                          id="btn-add-fill-action-lookup" class="btn">Add
                Fill Action Lookup
            </button>
            </span>
    </div>
    </form>
    <div id="edit-pms-fill-action-lookup" title="{% if do_copy %}Copy{% else %}Edit{% endif %} PMIS Fill Action Lookup"
         style="margin-left: 2px;{% if do_copy %} background-color: yellow;{% endif %}">
        <form id="editFillActionLookupForm" name="editFillActionLookupForm" method="POST">
            {% csrf_token %}
            <div class="alert alert-error" id="edit-fill-action-lookup-validation-alert" style="display: none;">
                <button type="button" class="close" data-dismiss="alert">&times;</button>
                <ul id="edit-fill-action-lookup-validation-error-list">
                </ul>
            </div>
            <table style="width: 90%;">
                <tr>
                    <td class="site-drug-edit-td">{{ edit_form.interface }}{{ edit_form.lookup_type }}
                        <table id="data-tag-test-table" class="table table-striped table-condensed">
                            <thead>
                                <tr>
                                    <th>Data Tag List</th>
                                    <th style="width: 100%;">Selected Data Tags</th>
                                    <th>Test Value</th>
                                    <th><button id="add-tag-test-row" name="add-tag-test-row" type="button"><i class="icon-plus-sign-alt"></i>
                                </button></th>
                                </tr>
                            </thead>
                            <tbody>
                            {% if not add_mode %}
                                {% for tag_test in tag_test_list %}
                                <tr>
                                    <td>
                                        <div class="multi-select-fill-action-data-tag-container">
                                        {% for itm in data_tag_list %}
                                            <input class="{{ tag_test.id }}-data-tag-chk" type="checkbox" id="{{ tag_test.id }}-{{ itm.id }}-data-tag-chk"
                                                   name="{{ tag_test.id }}-{{ itm.id }}-data-tag-chk" value="{{ itm.id }}"
                                            {% if itm.id in tag_test.data_tags %}checked{% endif %}/>
                                            <label style="display: inline;">{{ itm.tag }}</label>
                                            <br/>{% endfor %}
                                        </div>
                                    </td>
                                    <td><span id="{{ tag_test.id }}-sel-data-tag-list"></span></td>
                                    <td><input type="text" id="{{ tag_test.id }}-test-value-input"
                                                   name="{{ tag_test.id }}-test-value-input" value="{% if tag_test.test_val %}{{ tag_test.test_val }}{% endif %}"/></td>
                                    <td><button type="button" id="{{ tag_test.id }}-del-tag-test-row"
                                            name="{{ tag_test.id }}-del-tag-test-row"
                                                {% if forloop.counter == 1 %}style="display: none;"{% endif %}><i class="icon-minus-sign"></i></button></td>
                                </tr>
                                {% endfor %}
                            {% else %}
                                <tr>
                                    <td>
                                        <div class="multi-select-fill-action-data-tag-container">
                                        {% for itm in data_tag_list %}
                                            <input class="1-data-tag-chk" type="checkbox" id="1-{{ itm.id }}-data-tag-chk"
                                                   name="1-{{ itm.id }}-data-tag-chk" value="{{ itm.id }}"/>
                                            <label style="display: inline;">{{ itm.tag }}</label>
                                            <br/>{% endfor %}
                                        </div>
                                    </td>
                                    <td><span id="1-sel-data-tag-list"></span></td>
                                    <td><input type="text" id="1-test-value-input"
                                                   name="1-test-value-input" value=""/></td>
                                    <td><button type="button" id="1-del-tag-test-row"
                                            name="1-del-tag-test-row" style="display: none;"><i class="icon-minus-sign"></i></button></td>
                                </tr>
                            {% endif %}
                            </tbody>
                        </table>
                    </td>
                </tr>
                <tr><td>&nbsp;</td></tr>
                <tr>
                    <td class="site-drug-edit-td">Order Request Type: {{ edit_form.order_req_type }}</td>
                </tr>
                <tr>
                    <td class="site-drug-edit-td">Search Order: {{ edit_form.search_order }}&nbsp;&nbsp;&nbsp;
                    {{ edit_form.active }} Active?</td>
                </tr>
                <tr>
                    <td class="site-drug-edit-td">Action: {{ edit_form.action }}</td>
                </tr>
            </table>
        </form>
    </div>
{% endblock %}