list detail form template example

detail.html

{% extends "base.html" %}

{% block content %}

<a href="{% url 'produto:produto_list' %}">Voltar</a>

<h1>{{ object }}
  <span class="pull-right">
    <a href="{% url 'produto:produto_edit' object.pk %}">
      <button type="button" class="btn btn-success">
        <span class="fa fa-pencil"></span> Editar
      </button>
    </a>
  </span>
</h1>

<div class="col-sm-6">
  <table class="table table-user-information">
    <tbody>
      <tr>
        <th class="text-right">Importado</th>
        <td>
          {% if object.importado %}
            <i class="fa fa-check-circle ok"></i>
          {% else %}
            <i class="fa fa-minus-circle no"></i>
          {% endif %}
        </td>
      </tr>
      <tr>
        <th class="text-right">NCM</th>
        <td>{{ object.ncm }}</td>
      </tr>
      <tr>
        <th class="text-right">Preço</th>
        <td>R$ {{ object.preco }}</td>
      </tr>
      <tr>
        <th class="text-right">Estoque</th>
        <td>{{ object.estoque }}</td>
      </tr>
      <tr>
        <th class="text-right">Estoque minimo</th>
        <td>{{ object.estoque_minimo }}</td>
      </tr>
    </tbody>
  </table>
</div>

{% endblock content %}

form.html

{% extends 'base.html' %}

{% load widget_tweaks %}

{% block css %}

<style>
  span.required:after {
    content: "*";
    color: red;
  }
</style>

{% endblock css %}

{% block content %}

<div class="col-sm-6">
  <form method="post" novalidate>
    {% csrf_token %}
    {% for field in form.visible_fields %}
      <div class="form-group{% if field.errors %} has-error {% endif %}">
        <label for="{{ field.id_for_label }}">
          {% if field.field.required %}
            <span class="required">{{ field.label }} </span>
          {% else %}
            {{ field.label }}
          {% endif %}
        </label>
        {% render_field field class="form-control" %}
        {% for error in field.errors %}
          <span class="text-muted">{{ error }}</span>
        {% endfor %}
      </div>
    {% endfor %}
    <button type="submit" class="btn btn-success">Cadastrar</button>
  </form>
</div>

{% endblock %}

{% block js %}

<script>
  $('#id_importado').removeClass('form-control');
</script>

{% endblock js %}

list.html

{% extends "base.html" %}

{% block content %}

<h2>Lista de Produtos
  <span class="pull-right">
    <a href="{% url 'produto:produto_add' %}">
      <button type="button" class="btn btn-primary">
        <span class="fa fa-plus"></span> Adicionar
      </button>
    </a>
  </span>
</h2>

{% if object_list %}
  <table class="table table-striped">
    <thead>
      <tr>
        <th>Importado</th>
        <th>NCM</th>
        <th>Produto</th>
        <th>Preço</th>
        <th class="text-center">Estoque</th>
        <th class="text-center">Estoque minimo</th>
      </tr>
    </thead>
    <tbody>
      {% for object in object_list %}
        <tr>
          <td>
            {% if object.importado %}
              <i class="fa fa-check-circle ok"></i>
            {% else %}
              <i class="fa fa-minus-circle no"></i>
            {% endif %}
          </td>
          <td>{{ object.ncm }}</td>
          <td>
            <a href="{{ object.get_absolute_url }}">{{ object.produto }}</a>
          </td>
          <td>R$ <span class="pull-right">{{ object.preco }}</span></td>
          <td class="text-center">{{ object.estoque }}</td>
          <td class="text-center">{{ object.estoque_minimo }}</td>
        </tr>
      {% endfor %}
    </tbody>
  </table>
{% else %}
  <p class="alert alert-warning">Sem itens na lista.</p>
{% endif %}

{% endblock content %}