Added new templates for project management functionality including listing, creation, and detailed views. These templates integrate with HTMX for dynamic interactions and provide a responsive layout. **New Features** - **project_list.html**: Displays a table of projects with status badges, client associations, and deadline tracking. Includes actions for creating, editing, and deleting projects. - **project_detail.html**: Shows detailed project information including status, description, client, and deadline. Features an embedded kanban board for task management and a modal for task creation. - **project_form.html**: Provides a multi-step form wizard for creating/editing projects with validation and navigation controls. **Enhancements & Refinements** - Responsive design across all templates for consistent UX on different devices. - Dynamic status badges color-coded based on project state. - Integrated HTMX for seamless form submissions and DOM updates in project list and task management.
69 lines
3.0 KiB
HTML
69 lines
3.0 KiB
HTML
{% extends "shared/base.html" %}
|
|
{% load static %}
|
|
{% block content %}
|
|
{% include "shared/navbar.html" %}
|
|
|
|
<div class="pt-24 px-4 max-w-7xl mx-auto min-h-screen flex flex-col pb-10">
|
|
<div class="flex justify-between items-center mb-6">
|
|
<h1 class="text-3xl font-bold">Projects</h1>
|
|
<a href="{% url 'project_create' %}" class="btn btn-primary">
|
|
<span class="icon-[tabler--plus] size-5"></span>
|
|
New Project
|
|
</a>
|
|
</div>
|
|
|
|
<div class="overflow-x-auto bg-base-100 rounded-box shadow">
|
|
<table class="table">
|
|
<thead>
|
|
<tr>
|
|
<th>Name</th>
|
|
<th>Client</th>
|
|
<th>Status</th>
|
|
<th>Deadline</th>
|
|
<th>Actions</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for project in projects %}
|
|
<tr class="hover">
|
|
<td>
|
|
<a href="{% url 'project_detail' pk=project.pk %}" class="font-bold hover:text-primary">
|
|
{{ project.name }}
|
|
</a>
|
|
<div class="text-xs opacity-50">{{ project.description|truncatechars:50 }}</div>
|
|
</td>
|
|
<td>{{ project.client.name }}</td>
|
|
<td>
|
|
<div
|
|
class="badge {% if project.status == 'COMPLETED' %}badge-success{% elif project.status == 'IN_PROGRESS' %}badge-info{% elif project.status == 'ON_HOLD' %}badge-warning{% elif project.status == 'CANCELLED' %}badge-error{% else %}badge-ghost{% endif %}">
|
|
{{ project.get_status_display }}
|
|
</div>
|
|
</td>
|
|
<td>{{ project.deadline|default:"-" }}</td>
|
|
<td>
|
|
<div class="flex gap-2">
|
|
<a href="{% url 'project_edit' pk=project.pk %}" class="btn btn-sm btn-outline">
|
|
<span class="icon-[tabler--edit] size-4"></span>
|
|
Edit
|
|
</a>
|
|
<button class="btn btn-sm btn-outline btn-error"
|
|
hx-delete="{% url 'project_delete' pk=project.pk %}" hx-confirm="Are you sure?"
|
|
hx-target="closest tr" hx-swap="outerHTML">
|
|
<span class="icon-[tabler--trash] size-4"></span>
|
|
Delete
|
|
</button>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
{% empty %}
|
|
<tr>
|
|
<td colspan="5" class="text-center py-10 text-base-content/50">
|
|
No projects found. Create one to get started.
|
|
</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
{% endblock %} |