{% extends "base.html" %}
{% load static %}
{% block title %}Projects{% endblock %}
{% block head %}
    <link rel="stylesheet" href="{% static "projects.css" %}">
    <script src="{% static "projects.js" %}"></script>
{% endblock %}
{% block footer %}{% endblock %}
{% block main %}
    {% csrf_token %}
    <table class="projects">
        <thead>
            <tr>
                <th>Project</th>
                <th>Parent</th>
                <th>Actions</th>
            </tr>
        </thead>
        <tbody>
            {% for project in projects %}
                <tr data-id="{{ project.id }}">
                    <td>{{ project.name }}</td>
                    <td>
                        <select class="parent-sel">
                            <option value=""></option>
                            {% for parent in parents %}
                                <option value="{{ parent.id }}" {% if project.parent.id == parent.id %}selected{% endif %}>{{ parent.name }}</option>
                            {% endfor %}
                        </select>
                    </td>
                    <td>
                        <button class="edit">Edit</button>
                        <button class="delete">Delete</button>
                    </td>
                </tr>
            {% endfor %}
        </tbody>
    </table>
{% endblock %}