This commit is contained in:
Flatlogic Bot 2026-01-23 10:39:06 +00:00
parent 8054fdf3a0
commit 9a495913c0
3 changed files with 214 additions and 17 deletions

View File

@ -61,7 +61,6 @@
<th>{% trans "Owner" %}</th> <th>{% trans "Owner" %}</th>
<th>{% trans "Truck Details" %}</th> <th>{% trans "Truck Details" %}</th>
<th>{% trans "Plate No" %}</th> <th>{% trans "Plate No" %}</th>
<th>{% trans "Documents" %}</th>
<th class="text-end">{% trans "Actions" %}</th> <th class="text-end">{% trans "Actions" %}</th>
</tr> </tr>
</thead> </thead>
@ -74,20 +73,22 @@
<small>{{ truck.model }} ({{ truck.year }}) - {{ truck.color }}</small> <small>{{ truck.model }} ({{ truck.year }}) - {{ truck.color }}</small>
</td> </td>
<td>{{ truck.plate_no }}</td> <td>{{ truck.plate_no }}</td>
<td>
<div class="btn-group btn-group-sm">
{% if truck.truck_picture %}
<a href="{{ truck.truck_picture.url }}" target="_blank" class="btn btn-outline-secondary">{% trans "Photo" %}</a>
{% endif %}
{% if truck.registration_front %}
<a href="{{ truck.registration_front.url }}" target="_blank" class="btn btn-outline-secondary">{% trans "Reg. Front" %}</a>
{% endif %}
{% if truck.registration_back %}
<a href="{{ truck.registration_back.url }}" target="_blank" class="btn btn-outline-secondary">{% trans "Reg. Back" %}</a>
{% endif %}
</div>
</td>
<td class="text-end"> <td class="text-end">
<button type="button" class="btn btn-outline-info btn-sm me-2 view-truck-btn"
data-bs-toggle="modal" data-bs-target="#truckDetailsModal"
data-truck-type="{{ truck.truck_type }}"
data-truck-model="{{ truck.model }}"
data-truck-year="{{ truck.year }}"
data-truck-plate="{{ truck.plate_no }}"
data-truck-capacity="{{ truck.load_capacity }}"
data-truck-color="{{ truck.color }}"
data-truck-owner="{{ truck.owner.username }}"
data-truck-picture="{% if truck.truck_picture %}{{ truck.truck_picture.url }}{% endif %}"
data-reg-front="{% if truck.registration_front %}{{ truck.registration_front.url }}{% endif %}"
data-reg-back="{% if truck.registration_back %}{{ truck.registration_back.url }}{% endif %}"
data-license="{% if truck.driver_license %}{{ truck.driver_license.url }}{% endif %}">
<i class="fa-solid fa-eye me-1"></i> {% trans "View" %}
</button>
<a href="{% url 'approve_truck' truck.id %}" class="btn btn-success btn-sm"> <a href="{% url 'approve_truck' truck.id %}" class="btn btn-success btn-sm">
<i class="fa-solid fa-check me-1"></i> {% trans "Approve" %} <i class="fa-solid fa-check me-1"></i> {% trans "Approve" %}
</a> </a>
@ -95,7 +96,7 @@
</tr> </tr>
{% empty %} {% empty %}
<tr> <tr>
<td colspan="5" class="text-center py-4 text-muted">{% trans "No trucks awaiting approval." %}</td> <td colspan="4" class="text-center py-4 text-muted">{% trans "No trucks awaiting approval." %}</td>
</tr> </tr>
{% endfor %} {% endfor %}
</tbody> </tbody>
@ -130,6 +131,21 @@
</td> </td>
<td>{{ truck.plate_no }}</td> <td>{{ truck.plate_no }}</td>
<td class="text-end"> <td class="text-end">
<button type="button" class="btn btn-outline-info btn-sm me-2 view-truck-btn"
data-bs-toggle="modal" data-bs-target="#truckDetailsModal"
data-truck-type="{{ truck.truck_type }}"
data-truck-model="{{ truck.model }}"
data-truck-year="{{ truck.year }}"
data-truck-plate="{{ truck.plate_no }}"
data-truck-capacity="{{ truck.load_capacity }}"
data-truck-color="{{ truck.color }}"
data-truck-owner="{{ truck.owner.username }}"
data-truck-picture="{% if truck.truck_picture %}{{ truck.truck_picture.url }}{% endif %}"
data-reg-front="{% if truck.registration_front %}{{ truck.registration_front.url }}{% endif %}"
data-reg-back="{% if truck.registration_back %}{{ truck.registration_back.url }}{% endif %}"
data-license="{% if truck.driver_license %}{{ truck.driver_license.url }}{% endif %}">
<i class="fa-solid fa-eye me-1"></i> {% trans "View" %}
</button>
<a href="{% url 'suspend_truck' truck.id %}" class="btn btn-outline-danger btn-sm"> <a href="{% url 'suspend_truck' truck.id %}" class="btn btn-outline-danger btn-sm">
<i class="fa-solid fa-ban me-1"></i> {% trans "Suspend" %} <i class="fa-solid fa-ban me-1"></i> {% trans "Suspend" %}
</a> </a>
@ -146,6 +162,96 @@
</div> </div>
</div> </div>
<!-- Truck Details Modal -->
<div class="modal fade" id="truckDetailsModal" tabindex="-1" aria-labelledby="truckDetailsModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content border-0 shadow">
<div class="modal-header bg-primary text-white">
<h5 class="modal-title fw-bold" id="truckDetailsModalLabel">{% trans "Truck Details" %}</h5>
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="row g-4">
<div class="col-md-6">
<h6 class="fw-bold text-primary mb-3">{% trans "General Information" %}</h6>
<table class="table table-sm table-borderless">
<tr>
<td class="text-muted" style="width: 40%;">{% trans "Type" %}:</td>
<td class="fw-bold" id="modal-truck-type"></td>
</tr>
<tr>
<td class="text-muted">{% trans "Model" %}:</td>
<td class="fw-bold" id="modal-truck-model"></td>
</tr>
<tr>
<td class="text-muted">{% trans "Year" %}:</td>
<td class="fw-bold" id="modal-truck-year"></td>
</tr>
<tr>
<td class="text-muted">{% trans "Plate No" %}:</td>
<td class="fw-bold" id="modal-truck-plate"></td>
</tr>
<tr>
<td class="text-muted">{% trans "Capacity" %}:</td>
<td class="fw-bold" id="modal-truck-capacity"></td>
</tr>
<tr>
<td class="text-muted">{% trans "Color" %}:</td>
<td class="fw-bold" id="modal-truck-color"></td>
</tr>
<tr>
<td class="text-muted">{% trans "Owner" %}:</td>
<td class="fw-bold" id="modal-truck-owner"></td>
</tr>
</table>
</div>
<div class="col-md-6">
<h6 class="fw-bold text-primary mb-3">{% trans "Truck Image" %}</h6>
<div class="text-center bg-light rounded p-2 mb-3">
<img id="modal-truck-img" src="" alt="Truck" class="img-fluid rounded shadow-sm" style="max-height: 200px; display: none;">
<p id="no-truck-img" class="text-muted py-5 mb-0" style="display: none;">{% trans "No image provided" %}</p>
</div>
</div>
</div>
<hr class="my-4">
<h6 class="fw-bold text-primary mb-3">{% trans "Documents & Registration" %}</h6>
<div class="row g-3">
<div class="col-md-4">
<p class="small text-muted mb-1">{% trans "Registration Front" %}</p>
<div class="bg-light rounded text-center p-2">
<a id="modal-reg-front-link" href="#" target="_blank">
<img id="modal-reg-front-img" src="" alt="Reg Front" class="img-fluid rounded" style="max-height: 120px; display: none;">
</a>
<p id="no-reg-front" class="text-muted py-3 mb-0" style="display: none;">{% trans "Not available" %}</p>
</div>
</div>
<div class="col-md-4">
<p class="small text-muted mb-1">{% trans "Registration Back" %}</p>
<div class="bg-light rounded text-center p-2">
<a id="modal-reg-back-link" href="#" target="_blank">
<img id="modal-reg-back-img" src="" alt="Reg Back" class="img-fluid rounded" style="max-height: 120px; display: none;">
</a>
<p id="no-reg-back" class="text-muted py-3 mb-0" style="display: none;">{% trans "Not available" %}</p>
</div>
</div>
<div class="col-md-4">
<p class="small text-muted mb-1">{% trans "Driver License" %}</p>
<div class="bg-light rounded text-center p-2">
<a id="modal-license-link" href="#" target="_blank">
<img id="modal-license-img" src="" alt="License" class="img-fluid rounded" style="max-height: 120px; display: none;">
</a>
<p id="no-license" class="text-muted py-3 mb-0" style="display: none;">{% trans "Not available" %}</p>
</div>
</div>
</div>
</div>
<div class="modal-footer border-0">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">{% trans "Close" %}</button>
</div>
</div>
</div>
</div>
<div class="mt-5"> <div class="mt-5">
<h4 class="fw-bold mb-4">{% trans "Quick Actions" %}</h4> <h4 class="fw-bold mb-4">{% trans "Quick Actions" %}</h4>
<div class="row g-3"> <div class="row g-3">
@ -192,11 +298,65 @@
</div> </div>
</div> </div>
<script>
document.addEventListener('DOMContentLoaded', function() {
const viewBtns = document.querySelectorAll('.view-truck-btn');
viewBtns.forEach(btn => {
btn.addEventListener('click', function() {
const data = this.dataset;
// Populate text fields
document.getElementById('modal-truck-type').textContent = data.truckType;
document.getElementById('modal-truck-model').textContent = data.truckModel;
document.getElementById('modal-truck-year').textContent = data.truckYear;
document.getElementById('modal-truck-plate').textContent = data.truckPlate;
document.getElementById('modal-truck-capacity').textContent = data.truckCapacity;
document.getElementById('modal-truck-color').textContent = data.truckColor;
document.getElementById('modal-truck-owner').textContent = data.truckOwner;
// Populate images
const imgFields = [
{ id: 'modal-truck-img', noId: 'no-truck-img', src: data.truckPicture },
{ id: 'modal-reg-front-img', noId: 'no-reg-front', src: data.regFront, linkId: 'modal-reg-front-link' },
{ id: 'modal-reg-back-img', noId: 'no-reg-back', src: data.regBack, linkId: 'modal-reg-back-link' },
{ id: 'modal-license-img', noId: 'no-license', src: data.license, linkId: 'modal-license-link' }
];
imgFields.forEach(field => {
const img = document.getElementById(field.id);
const noTxt = document.getElementById(field.noId);
if (field.src && field.src !== '') {
img.src = field.src;
img.style.display = 'inline-block';
noTxt.style.display = 'none';
if (field.linkId) {
document.getElementById(field.linkId).href = field.src;
}
} else {
img.style.display = 'none';
noTxt.style.display = 'block';
}
});
});
});
});
</script>
<style> <style>
.hover-card:hover { .hover-card:hover {
background-color: #f1f8ff !important; background-color: #f1f8ff !important;
transform: translateY(-5px); transform: translateY(-5px);
transition: all 0.3s ease; transition: all 0.3s ease;
} }
.modal-content {
border-radius: 1rem;
overflow: hidden;
}
.modal-header {
border-bottom: none;
}
</style> </style>
{% endblock %} {% endblock %}

Binary file not shown.

View File

@ -318,6 +318,43 @@ msgstr "إدارة المستخدمين"
msgid "Review registered profiles" msgid "Review registered profiles"
msgstr "مراجعة الملفات الشخصية المسجلة" msgstr "مراجعة الملفات الشخصية المسجلة"
#: core/templates/core/admin_dashboard.html:195
#: core/templates/core/shipper_dashboard.html:45
msgid "View"
msgstr "عرض"
#: core/templates/core/admin_dashboard.html:200
msgid "General Information"
msgstr "معلومات عامة"
#: core/templates/core/admin_dashboard.html:205
msgid "Truck Image"
msgstr "صورة الشاحنة"
#: core/templates/core/admin_dashboard.html:210
msgid "Documents & Registration"
msgstr "المستندات والتسجيل"
#: core/templates/core/admin_dashboard.html:215
msgid "Not available"
msgstr "غير متوفر"
#: core/templates/core/admin_dashboard.html:220
msgid "No image provided"
msgstr "لم يتم توفير صورة"
#: core/templates/core/admin_dashboard.html:225
msgid "Type"
msgstr "النوع"
#: core/templates/core/admin_dashboard.html:230
msgid "Capacity"
msgstr "الحمولة"
#: core/templates/core/admin_dashboard.html:235
msgid "Close"
msgstr "إغلاق"
#: core/templates/core/index.html:11 #: core/templates/core/index.html:11
msgid "Smart Cargo Solutions" msgid "Smart Cargo Solutions"
msgstr "حلول شحن ذكية" msgstr "حلول شحن ذكية"
@ -331,7 +368,7 @@ msgid ""
"The most reliable platform connecting shippers with truck owners across the " "The most reliable platform connecting shippers with truck owners across the "
"region. Transparent, fast, and secure." "region. Transparent, fast, and secure."
msgstr "" msgstr ""
"المنصة الأكثر موثوقية لربط الشاحنين مع أصحاب الشاحنات في جميع أنحاء المنطقة. " "المنصة الأكثر موثوقية لربط الشاحنين مع أسطول الشاحنات في جميع أنحاء المنطقة. "
"شفافة، سريعة، وآمنة." "شفافة، سريعة، وآمنة."
#: core/templates/core/index.html:18 #: core/templates/core/index.html:18
@ -771,4 +808,4 @@ msgstr "خطأ في تقديم العرض. يرجى التحقق من النمو
#: core/views.py:195 #: core/views.py:195
msgid "Bid accepted! Shipment is now in progress." msgid "Bid accepted! Shipment is now in progress."
msgstr "تم قبول العرض! الشحنة قيد التنفيذ الآن." msgstr "تم قبول العرض! الشحنة قيد التنفيذ الآن."