{% extends 'base.html' %}
{% block content %}
<h1>{% if chart %}{{ t('charts.edit') }}{% else %}{{ t('charts.create') }}{% endif %}</h1>
{% if chart and chart.is_system %}<p class="notice">{{ t('charts.system_help') }}</p>{% endif %}
<form method="post" action="{% if chart %}/charts/{{ chart.id }}/edit{% else %}/charts/new{% endif %}">
  <label>{{ t('common.name') }}<input name="name" value="{{ chart.name if chart else '' }}" required></label>
  <label>{{ t('common.description') }}<textarea name="description">{{ chart.description or '' if chart else '' }}</textarea></label>
  <div class="form-grid">
    <label>{{ t('charts.type') }}<select name="chart_type">{% for value,label in chart_types.items() %}<option value="{{ value }}" {% if chart and chart.chart_type==value %}selected{% endif %}>{{ label }}</option>{% endfor %}</select></label>
    <label>{{ t('charts.group_by') }}<select name="group_field">{% for value,label in chart_fields.items() %}<option value="{{ value }}" {% if chart and chart.group_field==value %}selected{% endif %}>{{ label }}</option>{% endfor %}</select></label>
    <label>{{ t('charts.stack_field') }}<select name="stack_field"><option value="">– {{ t('common.none', 'none') }} –</option>{% for value,label in chart_fields.items() %}<option value="{{ value }}" {% if chart and chart.stack_field==value %}selected{% endif %}>{{ label }}</option>{% endfor %}</select></label>
    <label>{{ t('charts.sorting') }}<select name="sort_mode"><option value="count_desc" {% if not chart or chart.sort_mode=='count_desc' %}selected{% endif %}>{{ t('charts.count_desc') }}</option><option value="alpha" {% if chart and chart.sort_mode=='alpha' %}selected{% endif %}>{{ t('charts.alphabetical') }}</option></select></label>
    <label>{{ t('charts.max_items') }}<input type="number" name="max_items" min="1" max="50" value="{{ chart.max_items if chart else 12 }}"></label>
    <label>{{ t('charts.value_display') }}<select name="value_mode"><option value="raw" {% if not chart or chart.value_mode=='raw' %}selected{% endif %}>{{ t('charts.raw_values') }}</option><option value="automatic" {% if chart and chart.value_mode=='automatic' %}selected{% endif %}>{{ t('charts.auto_group') }}</option><option value="custom" {% if chart and chart.value_mode=='custom' %}selected{% endif %}>{{ t('charts.custom_mappings') }}</option></select></label>
  </div>
  <label><input type="checkbox" name="dashboard_visible" {% if chart and chart.dashboard_visible %}checked{% endif %}> {{ t('charts.show_dashboard') }}</label>
  <label><input type="checkbox" name="show_empty" {% if chart and chart.show_empty %}checked{% endif %}> {{ t('charts.include_empty') }}</label>

  <fieldset>
    <legend>{{ t('charts.status_filter') }}</legend>
    <p class="help-text">{{ t('charts.status_filter_help') }}</p>
    <div class="checkbox-grid">
      {% for option in status_options %}
      <label class="checkbox-option"><input type="checkbox" name="excluded_statuses" value="{{ option.name }}" {% if option.name in excluded_statuses %}checked{% endif %}> {{ option.name }}</label>
      {% else %}<p>{{ t('charts.no_status_values') }}</p>{% endfor %}
    </div>
  </fieldset>

  <label>{{ t('charts.custom_value_mappings') }}
    <textarea name="value_mappings_text" rows="8" placeholder="Microsoft Windows 11 => Windows 11">{{ value_mappings_text }}</textarea>
    <small>{{ t('charts.mapping_help') }}</small>
  </label>
  <div class="form-actions"><button class="button button-save" type="submit">💾 {{ t('common.save') }}</button><a class="button" href="/charts/manage">{{ t('common.cancel') }}</a></div>
</form>
{% endblock %}