{% extends 'adminlte/base.html' %}
{% load static %}
{% block title %}
  Cadastrar Aluno
{% endblock %}

{% block content %}
  <div class="container-fluid">
    <!-- Cabeçalho -->
    <div class="row mb-4">
      <div class="col">
        <h1 class="h3">Cadastrar Aluno</h1>
      </div>
      <div class="col text-end">
        <a href="{% url 'listar_alunos' %}" class="btn btn-secondary"><i class="bi bi-arrow-left"></i> Voltar</a>
      </div>
    </div>

    <!-- Formulário -->
    <div class="card shadow">
      <div class="card-body">
        <form method="POST" id="alunoForm">
          {% csrf_token %}

          <!-- Nome do Aluno -->
          <div class="mb-3">
            <label for="nome" class="form-label">Nome do Aluno</label>
            <input type="text" class="form-control" id="nome" name="nome" required />
          </div>

          <!-- Seleção de Curso -->
          <div class="mb-3">
            <label for="curso_id" class="form-label">Curso</label>
            <select class="form-select" id="curso_id" name="curso_id" required>
              <option value="">Selecione um curso</option>
              {% for curso in cursos %}
                <option value="{{ curso.id }}">{{ curso.nome }}</option>
              {% empty %}
                <option value="" disabled>Nenhum curso cadastrado</option>
              {% endfor %}
            </select>
          </div>

          <!-- Seleção de Turma (dinâmica) -->
          <div class="mb-3">
            <label for="turma_id" class="form-label">Turma</label>
            <select class="form-select" id="turma_id" name="turma_id" required disabled>
              <option value="">Primeiro selecione um curso</option>
            </select>
          </div>

          <!-- Botão de Submit -->
          <div class="text-end">
            <button type="submit" class="btn btn-success"><i class="bi bi-save"></i> Salvar Aluno</button>
          </div>
        </form>
      </div>
    </div>
  </div>
{% endblock %}

{% block scripts %}
  <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
  <script src="{% static 'js/aluno.js' %}"></script>
{% endblock %}