{% extends "base.html" %}

{% block title %}Add {{ table_name }} - DeeBase Admin{% endblock %}

{% block content %}
<div class="breadcrumb">
    <a href="/admin/">Dashboard</a>
    <span>&gt;</span>
    <a href="/admin/{{ table_name }}/">{{ table_name }}</a>
    <span>&gt;</span>
    New
</div>

<div class="page-header">
    <h1>Add {{ table_name }}</h1>
</div>

<div class="card">
    {% if error %}
    <div class="alert alert-error">
        {{ error }}
    </div>
    {% endif %}

    <form method="post" action="/admin/{{ table_name }}/new">
        {% for col in columns %}
        <div class="form-group{% if not col.nullable and not col.default %} required{% endif %}">
            <label for="{{ col.name }}">{{ col.name }}</label>

            {% if col.name in fk_columns %}
            <!-- FK dropdown -->
            <select name="{{ col.name }}" id="{{ col.name }}">
                <option value="">-- Select --</option>
                {% for opt in fk_options[col.name] %}
                <option value="{{ opt.value }}"{% if values and values.get(col.name) == opt.value %} selected{% endif %}>
                    {{ opt.label }}
                </option>
                {% endfor %}
            </select>
            {% elif 'TEXT' in col.type or 'VARCHAR' in col.type %}
            {% if 'TEXT' in col.type %}
            <textarea name="{{ col.name }}" id="{{ col.name }}" rows="4">{{ values.get(col.name, '') if values else '' }}</textarea>
            {% else %}
            <input type="text" name="{{ col.name }}" id="{{ col.name }}" value="{{ values.get(col.name, '') if values else '' }}">
            {% endif %}
            {% elif 'INT' in col.type %}
            <input type="number" name="{{ col.name }}" id="{{ col.name }}" value="{{ values.get(col.name, '') if values else '' }}">
            {% elif 'FLOAT' in col.type or 'REAL' in col.type or 'DOUBLE' in col.type %}
            <input type="number" step="any" name="{{ col.name }}" id="{{ col.name }}" value="{{ values.get(col.name, '') if values else '' }}">
            {% elif 'BOOL' in col.type %}
            <select name="{{ col.name }}" id="{{ col.name }}">
                <option value="">-- Select --</option>
                <option value="true"{% if values and values.get(col.name) == true %} selected{% endif %}>True</option>
                <option value="false"{% if values and values.get(col.name) == false %} selected{% endif %}>False</option>
            </select>
            {% elif 'DATE' in col.type and 'TIME' not in col.type %}
            <input type="date" name="{{ col.name }}" id="{{ col.name }}" value="{{ values.get(col.name, '') if values else '' }}">
            {% elif 'TIME' in col.type and 'DATE' not in col.type %}
            <input type="time" name="{{ col.name }}" id="{{ col.name }}" value="{{ values.get(col.name, '') if values else '' }}">
            {% elif 'DATETIME' in col.type or 'TIMESTAMP' in col.type %}
            <input type="datetime-local" name="{{ col.name }}" id="{{ col.name }}" value="{{ values.get(col.name, '') if values else '' }}">
            {% else %}
            <input type="text" name="{{ col.name }}" id="{{ col.name }}" value="{{ values.get(col.name, '') if values else '' }}">
            {% endif %}

            <small>
                {{ col.type }}
                {% if col.nullable %} (nullable){% endif %}
                {% if col.default %} (default: {{ col.default }}){% endif %}
            </small>
        </div>
        {% endfor %}

        <div class="form-actions">
            <button type="submit" class="btn btn-primary">Create</button>
            <a href="/admin/{{ table_name }}/" class="btn btn-secondary">Cancel</a>
        </div>
    </form>
</div>
{% endblock %}