{# env配置：Tab 分类 + 双列表单，顶部统一保存 #}
<div class="env-config-page">
    <div class="env-config-head card">
        <div class="env-config-head-row">
            <div>
                <h2>env 配置</h2>
                <p class="settings-env-hint env-config-head-hint">按分类修改，改完点保存。含「需重启」的项请用「保存并重启」。</p>
            </div>
            <div class="env-config-toolbar">
                <button type="button" class="btn-primary btn-sm" id="env-config-save">保存</button>
                <button type="button" class="btn-secondary btn-sm" id="env-config-save-restart">保存并重启</button>
                <button type="button" class="btn-secondary btn-sm" id="env-config-reload">重新加载</button>
            </div>
        </div>
        <span class="settings-status-line" id="env-config-status"></span>
    </div>

    {% if env_config_groups %}
    <div class="env-config-body card" data-env-ssr="1" id="env-config-body">
        <div class="env-config-tabs" role="tablist" aria-label="配置分类">
            {% for group in env_config_groups %}
            <button type="button" class="env-tab-btn{% if loop.first %} is-active{% endif %}" role="tab" data-env-tab="{{ loop.index0 }}" aria-selected="{{ 'true' if loop.first else 'false' }}">{{ group.title }}</button>
            {% endfor %}
        </div>
        <div class="env-config-panels" id="env-config-grid">
            {% for group in env_config_groups %}
            <section class="env-panel{% if loop.first %} is-active{% endif %}" role="tabpanel" data-env-panel="{{ loop.index0 }}"{% if not loop.first %} hidden{% endif %}>
                {% if group.has_restart %}
                <p class="env-panel-hint">本组含需重启项，修改后请点「保存并重启」。</p>
                {% endif %}
                <div class="env-form-grid">
                    {% for field in group.fields %}
                    <div class="env-field-row{% if field.restart_required %} env-field-row--restart{% endif %}">
                        <label class="env-field-label" for="env-f-{{ field.key }}">
                            {{ field.label or field.key }}
                            {% if field.restart_required %}<span class="env-restart-mark" title="需重启">*</span>{% endif %}
                        </label>
                        {% if field.note %}
                        <div class="env-field-note muted">{{ field.note }}</div>
                        {% endif %}
                        {% if field.type == 'bool' %}
                        <select class="env-field-input" id="env-f-{{ field.key }}" data-env-key="{{ field.key }}">
                            {% set cur = (field.current or field.default or 'false')|lower %}
                            <option value="true"{% if cur in ('true', '1', 'yes', 'on') %} selected{% endif %}>开启</option>
                            <option value="false"{% if cur not in ('true', '1', 'yes', 'on') %} selected{% endif %}>关闭</option>
                        </select>
                        {% else %}
                        <input
                            class="env-field-input"
                            id="env-f-{{ field.key }}"
                            type="{% if field.sensitive %}password{% else %}text{% endif %}"
                            data-env-key="{{ field.key }}"
                            {% if field.sensitive and field.has_value %}
                            placeholder="{{ field.masked or '留空不修改' }}"
                            {% else %}
                            value="{{ field.current or field.default or '' }}"
                            {% endif %}
                        >
                        {% endif %}
                    </div>
                    {% endfor %}
                </div>
            </section>
            {% endfor %}
        </div>
    </div>
    {% else %}
    <div id="env-config-grid" class="env-config-loading-wrap card">
        <div class="env-config-loading muted">加载配置中…</div>
    </div>
    {% endif %}
</div>