Redesign env config UI: tabs, 2-col form, remove per-field badges
Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
dekun
@@ -1,55 +1,72 @@
|
||||
{# env配置：白名单分组，仅中文标签 #}
|
||||
{# env配置：Tab 分类 + 双列表单，顶部统一保存 #}
|
||||
<div class="env-config-page">
|
||||
<div class="env-config-head card">
|
||||
<h2>env 配置</h2>
|
||||
<p class="settings-env-hint">仅展示运营相关配置。标注「保存即生效」的项会立即应用；标注「需重启」的项保存后请点「保存并重启」。完整说明见项目文档 <code>docs/env配置说明.md</code>。</p>
|
||||
<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>
|
||||
<span class="settings-status-line" id="env-config-status"></span>
|
||||
</div>
|
||||
</div>
|
||||
<div id="env-config-grid" class="env-config-grid"{% if env_config_groups %} data-env-ssr="1"{% endif %}>
|
||||
{% if env_config_groups %}
|
||||
{% for group in env_config_groups %}
|
||||
<div class="card env-group-card">
|
||||
<h3 class="env-group-title">{{ group.title or '其他' }}</h3>
|
||||
<div class="env-group-fields">
|
||||
{% for field in group.fields %}
|
||||
<div class="env-field-card">
|
||||
<label class="env-field-label">{{ field.label or field.key }}</label>
|
||||
{% if field.note %}
|
||||
<div class="env-field-note muted">{{ field.note }}</div>
|
||||
{% endif %}
|
||||
{% if field.type == 'bool' %}
|
||||
<select class="env-field-input" 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"
|
||||
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 %}
|
||||
<span class="env-field-badge {% if field.restart_required %}env-badge-restart{% else %}env-badge-hot{% endif %}">
|
||||
{% if field.restart_required %}需重启{% else %}保存即生效{% endif %}
|
||||
</span>
|
||||
</div>
|
||||
{% endfor %}
|
||||
<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>
|
||||
{% endfor %}
|
||||
{% else %}
|
||||
<div class="env-config-loading muted">加载配置中…</div>
|
||||
{% endif %}
|
||||
<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>
|
||||
|
||||
Reference in New Issue
Block a user