220 lines
12 KiB
HTML
220 lines
12 KiB
HTML
{% extends 'base.html' %}
|
|
{% load static %}
|
|
{% block title %}Job: {{ job.job_ref }} - RepairsHub{% endblock %}
|
|
{% block content %}
|
|
<div class="container py-5">
|
|
<div class="d-flex justify-content-between align-items-start mb-4">
|
|
<div>
|
|
<nav aria-label="breadcrumb">
|
|
<ol class="breadcrumb">
|
|
<li class="breadcrumb-item"><a href="{% url 'job_list' %}" class="text-decoration-none">Jobs</a></li>
|
|
<li class="breadcrumb-item active">{{ job.job_ref }}</li>
|
|
</ol>
|
|
</nav>
|
|
<h1 class="h2 mb-0">{{ job.address_line_1 }}</h1>
|
|
<p class="text-muted mb-0">{% if job.uprn %}UPRN: {{ job.uprn }} | {% endif %}Ref: {{ job.job_ref }} | {{ job.postcode }}</p>
|
|
</div>
|
|
<div class="d-flex gap-2">
|
|
<a href="{% url 'job_update' job.pk %}" class="btn btn-outline-primary btn-sm">
|
|
<i class="bi bi-pencil"></i> Edit Job
|
|
</a>
|
|
<a href="{% url 'job_delete' job.pk %}" class="btn btn-outline-danger btn-sm">
|
|
<i class="bi bi-trash"></i> Delete
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
{% if messages %}
|
|
{% for message in messages %}
|
|
<div class="alert alert-{{ message.tags }} alert-dismissible fade show mb-4" role="alert">
|
|
{{ message }}
|
|
<button type="button" class="btn-close" data-bs-dismiss="alert"></button>
|
|
</div>
|
|
{% endfor %}
|
|
{% endif %}
|
|
|
|
<div class="row g-4">
|
|
<div class="col-lg-8">
|
|
<div class="card mb-4 border-0 shadow-sm">
|
|
<div class="card-body p-4">
|
|
<div class="row mb-5">
|
|
<div class="col-md-6">
|
|
<h6 class="text-uppercase text-muted smaller fw-bold mb-3">Job Status</h6>
|
|
<div class="d-inline-flex align-items-center">
|
|
<div class="px-4 py-2 rounded-3 bg-primary bg-opacity-10 text-primary fw-bold">
|
|
{{ job.status.name }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 text-md-end">
|
|
<h6 class="text-uppercase text-muted smaller fw-bold mb-3">Registration Date</h6>
|
|
<p class="mb-0 fw-medium text-dark">{{ job.created_at|date:"F d, Y H:i" }}</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mb-4">
|
|
<h6 class="text-uppercase text-muted smaller fw-bold mb-2">Description</h6>
|
|
<div class="p-3 bg-light rounded-3 text-dark">
|
|
{% if job.description %}{{ job.description|linebreaksbr }}{% else %}<span class="text-muted italic">No description provided</span>{% endif %}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mb-4">
|
|
<h6 class="text-uppercase text-muted smaller fw-bold mb-2">Action Required</h6>
|
|
<div class="p-3 bg-light rounded-3 text-dark">
|
|
{% if job.action %}{{ job.action|linebreaksbr }}{% else %}<span class="text-muted italic">No actions defined</span>{% endif %}
|
|
</div>
|
|
</div>
|
|
|
|
<div>
|
|
<h6 class="text-uppercase text-muted smaller fw-bold mb-2">Internal Notes</h6>
|
|
<div class="p-3 bg-light rounded-3 text-dark border-start border-4 border-warning">
|
|
{% if job.notes %}{{ job.notes|linebreaksbr }}{% else %}<span class="text-muted italic">No internal notes</span>{% endif %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="d-flex align-items-center justify-content-between mb-3">
|
|
<h4 class="h5 mb-0">Mandatory Documentation</h4>
|
|
<span class="badge bg-light text-dark border">{{ folder_completions.count }} Folders</span>
|
|
</div>
|
|
|
|
<div class="row g-3">
|
|
{% for completion in folder_completions %}
|
|
<div class="col-md-12">
|
|
<div class="card border-0 shadow-sm {% if completion.is_completed %}border-start border-4 border-success{% endif %} mb-3">
|
|
<div class="card-body p-4">
|
|
<div class="d-flex justify-content-between align-items-center mb-3">
|
|
<div>
|
|
<h6 class="mb-1 fw-bold fs-5">{{ completion.folder.name }}</h6>
|
|
<p class="text-muted smaller mb-0">
|
|
<i class="bi bi-file-earmark-text"></i> {{ completion.files_list.count }} Files uploaded
|
|
</p>
|
|
</div>
|
|
<div class="d-flex gap-2">
|
|
<button type="button" class="btn btn-sm btn-outline-primary rounded-pill px-3" data-bs-toggle="modal" data-bs-target="#uploadModal{{ completion.folder.id }}">
|
|
<i class="bi bi-upload me-1"></i> Upload
|
|
</button>
|
|
<form action="{% url 'toggle_folder_completion' job.pk completion.folder.id %}" method="post">
|
|
{% csrf_token %}
|
|
<button type="submit" class="btn btn-sm {% if completion.is_completed %}btn-success{% else %}btn-outline-secondary{% endif %} rounded-pill px-3">
|
|
{% if completion.is_completed %}
|
|
<i class="bi bi-check2-circle me-1"></i> Done
|
|
{% else %}
|
|
Mark Ready
|
|
{% endif %}
|
|
</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
|
|
{% if completion.files_list %}
|
|
<div class="table-responsive">
|
|
<table class="table table-hover table-sm align-middle mb-0">
|
|
<thead class="table-light">
|
|
<tr>
|
|
<th>File Name</th>
|
|
<th>Uploaded By</th>
|
|
<th>Date</th>
|
|
<th class="text-end">Actions</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for job_file in completion.files_list %}
|
|
<tr>
|
|
<td>
|
|
<a href="{{ job_file.file.url }}" target="_blank" class="text-decoration-none">
|
|
<i class="bi bi-file-earmark-arrow-down me-2"></i> {{ job_file.file.name|cut:"job_files/" }}
|
|
</a>
|
|
</td>
|
|
<td><small>{{ job_file.uploaded_by.username }}</small></td>
|
|
<td><small class="text-muted">{{ job_file.uploaded_at|date:"d/m/y H:i" }}</small></td>
|
|
<td class="text-end">
|
|
<a href="{% url 'job_delete_file' job.pk job_file.id %}" class="btn btn-link text-danger p-0" onclick="return confirm('Delete this file?')">
|
|
<i class="bi bi-trash"></i>
|
|
</a>
|
|
</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
{% else %}
|
|
<div class="text-center py-3 bg-light rounded-3">
|
|
<p class="text-muted small mb-0">No files uploaded yet.</p>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Upload Modal -->
|
|
<div class="modal fade" id="uploadModal{{ completion.folder.id }}" tabindex="-1" aria-hidden="true">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content border-0 shadow">
|
|
<div class="modal-header border-0 bg-light">
|
|
<h5 class="modal-title">Upload to {{ completion.folder.name }}</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
|
</div>
|
|
<form action="{% url 'job_upload_file' job.pk completion.folder.id %}" method="post" enctype="multipart/form-data">
|
|
{% csrf_token %}
|
|
<div class="modal-body p-4">
|
|
<div class="mb-3">
|
|
<label class="form-label fw-bold">Select File</label>
|
|
{{ file_form.file }}
|
|
<div class="form-text">Photos, PDFs, or documents are accepted.</div>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer border-0 p-4 pt-0">
|
|
<button type="button" class="btn btn-light rounded-pill px-4" data-bs-dismiss="modal">Cancel</button>
|
|
<button type="submit" class="btn btn-primary rounded-pill px-4">Upload File</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-lg-4">
|
|
<div class="card border-0 shadow-sm mb-4">
|
|
<div class="card-body p-4">
|
|
<h6 class="text-uppercase text-muted smaller fw-bold mb-4">Site Location</h6>
|
|
<div class="d-flex mb-3">
|
|
<div class="flex-shrink-0 text-primary fs-4 me-3">
|
|
<i class="bi bi-geo-alt"></i>
|
|
</div>
|
|
<div>
|
|
<p class="mb-1 fw-bold text-dark">{{ job.address_line_1 }}</p>
|
|
{% if job.address_line_2 %}<p class="mb-1">{{ job.address_line_2 }}</p>{% endif %}
|
|
{% if job.address_line_3 %}<p class="mb-1">{{ job.address_line_3 }}</p>{% endif %}
|
|
<p class="mb-0 text-dark">{{ job.postcode }}</p>
|
|
</div>
|
|
</div>
|
|
|
|
{% if job.uprn %}
|
|
<div class="mt-4 pt-4 border-top border-light">
|
|
<h6 class="text-uppercase text-muted smaller fw-bold mb-2">Unique Reference</h6>
|
|
<div class="d-flex align-items-center bg-light px-3 py-2 rounded-2">
|
|
<code class="text-primary fw-bold">{{ job.uprn }}</code>
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card border-0 shadow-sm bg-navy-dark text-white" style="background-color: #0F172A;">
|
|
<div class="card-body p-4">
|
|
<h6 class="text-uppercase text-muted smaller fw-bold mb-3 text-white-50">Quick Export</h6>
|
|
<p class="small text-white-50 mb-4">Download this job details for offline reporting.</p>
|
|
<a href="{% url 'job_export' %}" class="btn btn-primary w-100 rounded-pill">
|
|
<i class="bi bi-file-earmark-excel me-2"></i> Export to Excel
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endblock %} |