{% load form_helpers %}
<div class="modal fade" tabindex="-1" id="{{ table_name }}_config">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">Table Configuration</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <form class="form-horizontal userconfigform" data-config-root="tables.{{ table_config_form.table_name }}">
                <div class="modal-body">
                    {% render_field table_config_form.available_columns %}
                    <div class="row my-3">
                        <div class="col col-md-9 offset-md-3">
                            <a class="btn btn-success btn-sm" id="add_columns"><i class="mdi mdi-arrow-down-bold"></i> Add Columns</a>
                            <a class="btn btn-danger btn-sm" id="remove_columns"><i class="mdi mdi-arrow-up-bold"></i> Remove Columns</a>
                        </div>
                    </div>
                    {% render_field table_config_form.columns %}
                    <div class="row my-3">
                        <div class="col col-md-9 offset-md-3">
                            <a class="btn btn-primary btn-sm" id="move-option-up" data-target="id_columns">
                                <i class="mdi mdi-arrow-up-bold"></i> Move Up
                            </a>
                            <a class="btn btn-primary btn-sm" id="move-option-down" data-target="id_columns">
                                <i class="mdi mdi-arrow-down-bold"></i> Move Down
                            </a>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="submit" class="btn btn-outline-danger" id="reset_tableconfig" value="Reset">Reset</button>
                    <button type="submit" class="btn btn-primary" id="save_tableconfig" value="Save">Save</button>
                </div>
            </form>
        </div>
    </div>
</div>
