{% extends 'layouts/layout.html' %}

{% block page_body %}
    <!--
    { % set product = model.product %}
    { % set permutation = product.get_permutation_selected() %}
    <script>console.log("test 1");</script>
    <link rel="stylesheet" href="{{ url_for('static', filename='css/sections/store.css') }}">
    <link rel="stylesheet" href="{{ url_for('static', filename='css/pages/store/product_permutations.css') }}">
    -->
    <link rel="stylesheet" href="{{ url_for('static', filename='dist/css/store_product_permutations.bundle.css') }}">
    
    <!-- HTML content -->
    <form id="{{ model.ID_FORM_FILTERS }}" class="{{ model.FLAG_FILTER }} {{ model.FLAG_ROW }} {{ model.FLAG_CARD }}" action="{{ url_for('routes_store_product_permutation.filter_permutation') }}" method="POST"> <!-- {{ model.FLAG_CONTAINER }} -->
        {{ model.form_filters.hidden_tag() }}
        <div class="{{ model.FLAG_CONTAINER }} {{ model.FLAG_COLUMN }}">
            <div class="{{ model.FLAG_CONTAINER_INPUT }} {{ model.FLAG_ROW }} {{ model.FLAG_FILTER }}">
                {{ model.form_filters.id_category.label }}
                {{ model.form_filters.id_category() }}
                {% for error in model.form_filters.id_category.errors %}
                    <p class="error">{{ error }}</p>
                {% endfor %}
            </div>
        </div>
        <div class="{{ model.FLAG_CONTAINER }} {{ model.FLAG_COLUMN }}">
            <div class="{{ model.FLAG_CONTAINER_INPUT }} {{ model.FLAG_ROW }} {{ model.FLAG_FILTER }}">
                {{ model.form_filters.id_product.label }}
                {{ model.form_filters.id_product() }}
                {% for error in model.form_filters.id_product.errors %}
                    <p class="error">{{ error }}</p>
                {% endfor %}
            </div>
        </div>
        <div class="{{ model.FLAG_CONTAINER }} {{ model.FLAG_COLUMN }}">
            <div class="{{ model.FLAG_CONTAINER_INPUT }} {{ model.FLAG_ROW }} {{ model.FLAG_FILTER }}">
                {{ model.form_filters.is_out_of_stock.label }}
                {{ model.form_filters.is_out_of_stock() }}
                {% for error in model.form_filters.is_out_of_stock.errors %}
                    <p class="error">{{ error }}</p>
                {% endfor %}
            </div>
        </div>
        <div class="{{ model.FLAG_CONTAINER }} {{ model.FLAG_COLUMN }}">
            <div class="{{ model.FLAG_CONTAINER_INPUT }} {{ model.FLAG_ROW }} {{ model.FLAG_FILTER }}">
                {{ model.form_filters.quantity_min.label }}
                {{ model.form_filters.quantity_min() }}
                {% for error in model.form_filters.quantity_min.errors %}
                    <p class="error">{{ error }}</p>
                {% endfor %}
            </div>
        </div>
        <div class="{{ model.FLAG_CONTAINER }} {{ model.FLAG_COLUMN }}">
            <div class="{{ model.FLAG_CONTAINER_INPUT }} {{ model.FLAG_ROW }} {{ model.FLAG_FILTER }}">
                {{ model.form_filters.quantity_max.label }}
                {{ model.form_filters.quantity_max() }}
                {% for error in model.form_filters.quantity_max.errors %}
                    <p class="error">{{ error }}</p>
                {% endfor %}
            </div>
        </div>
        {#
        <div class="{{ model.FLAG_CONTAINER }} {{ model.FLAG_COLUMN }}">
            <div class="{{ model.FLAG_CONTAINER_INPUT }} {{ model.FLAG_ROW }}">
                {% set block_id = 'button_apply_filters' %}
                {% include 'components/common/buttons/_buttons_save_cancel.html' %}
            </div>
        </div>
        <div class="{{ model.FLAG_CONTAINER }} {{ model.FLAG_COLUMN }}">
            <div class="{{ model.FLAG_CONTAINER_INPUT }}">
                {% set block_id = 'button_add' %}
                {% include 'components/common/buttons/_buttons_save_cancel.html' %}
            </div>
        </div>
        <div class="{{ model.FLAG_CONTAINER }} {{ model.FLAG_COLUMN }}">
            <div class="{{ model.FLAG_CONTAINER_INPUT }}">
                {% set block_id = 'button_save' %}
                {% include 'components/common/buttons/_buttons_save_cancel.html' %}
            </div>
        </div>
        <div class="{{ model.FLAG_CONTAINER }} {{ model.FLAG_COLUMN }}">
            <div class="{{ model.FLAG_CONTAINER_INPUT }}">
                {% set block_id = 'button_cancel' %}
                {% include 'components/common/buttons/_buttons_save_cancel.html' %}
            </div>
        </div>
        <!--
        <div class="{{ model.FLAG_ROW }} {{ model.FLAG_CARD }}">
            <div class="{{ model.FLAG_CONTAINER }} {{ model.FLAG_COLUMN }}">
            </div>
        </div>
        -->
        #}
        {% set block_id = 'buttons_table_default' %}
        {% include 'components/common/buttons/_buttons_save_cancel.html' %}
    </form>
    <table id="{{ model.ID_TABLE_MAIN }}" class="{{ model.FLAG_ROW }} {{ model.FLAG_CARD }}">
        <thead>
            <tr>
                <th class="{{ model.FLAG_PRODUCT_CATEGORY }}">Category</th>
                <th class="{{ model.FLAG_PRODUCT }}">Product</th>
                <th class="{{ model.FLAG_PRODUCT_VARIATIONS }} {{ model.FLAG_COLLAPSED }}">Variations</th>
                <th class="{{ model.FLAG_DESCRIPTION }}">Description</th>
                <th class="{{ model.FLAG_QUANTITY_STOCK }}">Quantity Stock</th>
                <th class="{{ model.FLAG_QUANTITY_MIN }}">Quantity Min</th>
                <th class="{{ model.FLAG_QUANTITY_MAX }}">Quantity Max</th>
                <th class="{{ model.FLAG_COUNT_UNIT_MEASUREMENT_PER_QUANTITY_STEP }}">Quantity Step</th>
                <th class="{{ model.FLAG_UNIT_MEASUREMENT_QUANTITY }}">Unit</th>
                <th class="{{ model.FLAG_IS_SUBSCRIPTION }}">Subscription?</th>
                <th class="{{ model.FLAG_COUNT_UNIT_MEASUREMENT_INTERVAL_RECURRENCE }}">Count Recurrence Interval</th>
                <th class="{{ model.FLAG_UNIT_MEASUREMENT_INTERVAL_RECURRENCE }}">Recurrence Interval</th>
                <th class="{{ model.FLAG_ID_STRIPE_PRODUCT }}">Stripe Product ID</th>
                <th class="{{ model.FLAG_DOES_EXPIRE_FASTER_ONCE_UNSEALED }}">Expires Faster Once Unsealed?</th>
                <th class="{{ model.FLAG_COUNT_UNIT_MEASUREMENT_INTERVAL_EXPIRATION_UNSEALED }}">Count Interval Expiration Unsealed</th>
                <th class="{{ model.FLAG_UNIT_MEASUREMENT_INTERVAL_EXPIRATION_UNSEALED }}">Interval Expiration Unsealed</th>
                <th class="{{ model.FLAG_COST_LOCAL_VAT_EXCL }}">Cost Local VAT Excl.</th>
                <th class="{{ model.FLAG_COST_LOCAL_VAT_INCL }}">Cost Local VAT Incl.</th>
                <th class="{{ model.FLAG_CURRENCY_COST }}">Cost Currency</th>
                <th class="{{ model.FLAG_PROFIT_LOCAL_MIN }}">Profit Local Min</th>
                <th class="{{ model.FLAG_LATENCY_MANUFACTURE }}">Manufacturing Latency</th>
                <th class="{{ model.FLAG_ACTIVE }}">Active</th>
            </tr>
        </thead>
        <tbody>
            {% set units_measurement_dict = model.convert_list_objects_to_dict_json_by_attribute_key_default(model.units_measurement) | console_log %}
            {% set units_measurement_time_dict = model.convert_list_objects_to_dict_json_by_attribute_key_default(model.units_measurement_time) | console_log %}

            {% set is_blank_row = False %}
            {% for category in model.category_list.categories %}
                {% for product in category.products %}
                    {% for permutation in product.permutations %}
                        {% include 'components/store/_row_product_permutation.html' %}
                    {% endfor %}
                {% endfor %}
            {% endfor %}

            {% set is_blank_row = True %}
            {% include 'components/store/_row_product_permutation.html' %}
        </tbody>
    </table>
    
    {% include 'components/common/temporary/_overlay_confirm.html' %}
    {% include 'components/common/temporary/_overlay_error.html' %}

    <!-- Include JavaScript -->
    <script src="{{ url_for('routes_store.scripts_section_store') }}"></script>

    <script>
        var currencies = {{ model.convert_list_objects_to_dict_json_by_attribute_key_default(model.currencies) | tojson | safe }};
        var products = {{ model.convert_list_objects_to_dict_json_by_attribute_key_default(model.category_list.get_list_products()) | tojson | safe }};
        var productCategories = {{ model.convert_list_objects_to_dict_json_by_attribute_key_default(model.category_list_filters.categories) | tojson | safe }};
        var productVariations = {{ model.convert_list_objects_to_dict_json_by_attribute_key_default(model.variations) | tojson | safe }};
        var productVariationTypes = {{ model.convert_list_objects_to_dict_json_by_attribute_key_default(model.variation_types) | tojson | safe }};
        var unitMeasurements = {{ units_measurement_dict | tojson | safe }};
        var unitMeasurementsTime = {{ units_measurement_time_dict | tojson | safe }};
        var _rowBlankProductVariation = null;
    </script>
{% endblock %}