{% extends "layout.html" %}

{% block title %}{{ title }}{% endblock %}

{% block content %}

<form method="POST" action="{{ url_for('main.settings') }}">
    {{ breadcrumbs.breadcrumb_header(
    title=title,
    submit_button=True
    ) }}

    <div class="container">
        <div class="card mb-3">
            <div class="card-body">
                <h5 class="card-title">
                    Inventory Settings
                </h5>
                <div class="row">
                    <div class="col">
                        {{ combos.render_combobox(
                            id='brand',
                            options=brands,
                            label='Brands',
                            placeholder='Add a new brand'
                        ) }}
                    </div>
                    <div class="col">
                        {{ combos.render_combobox(
                            id='type',
                            options=types,
                            label='Inventory Types',
                            placeholder='Add a new type'
                        ) }}
                    </div>
                </div>
            </div>
        </div>
        <div class="card">
            <div class="card-body">
                <h5 class="card-title">Location Settings</h5>
                <div class="row">
                    <div class="col">
                        {{ combos.render_combobox(
                            id='section',
                            options=sections,
                            label='Sections',
                            placeholder='Add a new section'
                        ) }}
                    </div>
                    <div class="col">
                        {{ combos.render_combobox(
                            id='function',
                            options=functions,
                            label='Functions',
                            placeholder='Add a new function'
                        ) }}
                    </div>
                </div>
                <div class="row">
                    <div class="col">
                        {{ combos.render_combobox(
                            id='room',
                            options=rooms,
                            label='Rooms',
                            placeholder='Add a new room'
                        ) }}
                    </div>
                </div>
            </div>
        </div>
    </div>
</form>
{% endblock %}

{% block script %}
    const icons = {
        add: `{{ icons.render_icon('plus', 16)|safe }}`,
        edit: `{{ icons.render_icon('pencil', 16)|safe }}`,
    };
{% endblock %}