changed the purchase order ui

This commit is contained in:
Faheedkhan 2025-06-11 18:01:36 +03:00
parent c166268299
commit 30e29ada16
5 changed files with 64 additions and 61 deletions

View File

@ -15,7 +15,7 @@ document.addEventListener('DOMContentLoaded', function() {
document.getElementById('POModalBody').innerHTML = ` document.getElementById('POModalBody').innerHTML = `
<div class="d-flex justify-content-center gap-3 py-3"> <div class="d-flex justify-content-center gap-3 py-3">
<a class="btn btn-primary px-4" href="${actionUrl}"> <a class="btn btn-outline-primary px-4" href="${actionUrl}">
<i class="fas fa-check-circle me-2"></i>${buttonText} <i class="fas fa-check-circle me-2"></i>${buttonText}
</a> </a>
<button class="btn btn-outline-secondary" data-bs-dismiss="modal"> <button class="btn btn-outline-secondary" data-bs-dismiss="modal">
@ -45,7 +45,7 @@ document.addEventListener('DOMContentLoaded', function() {
<div class="card-body"> <div class="card-body">
<h3 class="h4 mb-4"> <h3 class="h4 mb-4">
<span class="badge bg-{% if po_model.is_draft %}secondary{% elif po_model.is_approved %}success{% elif po_model.is_fulfilled %}primary{% else %}warning{% endif %}"> <span class="badge bg-{% if po_model.is_draft %}success{% elif po_model.is_approved %}success{% elif po_model.is_fulfilled %}primary{% else %}warning{% endif %}">
{{ po_model.get_po_status_display }} {{ po_model.get_po_status_display }}
</span> </span>
</h3> </h3>
@ -214,7 +214,7 @@ document.addEventListener('DOMContentLoaded', function() {
{% endif %} {% endif %}
{% if po_model.can_cancel %} {% if po_model.can_cancel %}
<button class="btn btn-outline-danger" <button class="btn btn-outline-secondary"
onclick="djLedger.toggleModal('{{ po_model.get_mark_as_canceled_html_id }}')"> onclick="djLedger.toggleModal('{{ po_model.get_mark_as_canceled_html_id }}')">
<i class="fas fa-window-close me-2"></i>{% trans 'Cancel' %} <i class="fas fa-window-close me-2"></i>{% trans 'Cancel' %}
</button> </button>

View File

@ -95,7 +95,7 @@
</div> </div>
</div> </div>
<div class="col-12"> <div class="col-12">
<button class="btn btn-primary">{% trans 'Save' %}</button> <button class="btn btn-outline-success">{% trans 'Save' %}</button>
</div> </div>
</div> </div>
</form> </form>

View File

@ -1,74 +1,76 @@
<!-- po_list.html --> <!-- po_list.html -->
{% extends "base.html" %} {% extends "base.html" %}
{% load i18n static %}
{% block title %} {% block title %}
Purchase Orders - {{ block.super }} Purchase Orders - {{ block.super }}
{% endblock %} {% endblock %}
{% block content %} {% block content %}
<div class="container mt-4"> <div class="row mt-4">
<h2 class="mb-4">Purchase Orders</h2> <!-- Success Message -->
{% if messages %}
<!-- Success Message --> {% for message in messages %}
{% if messages %}
{% for message in messages %}
<div class="alert alert-success">{{ message }}</div> <div class="alert alert-success">{{ message }}</div>
{% endfor %} {% endfor %}
{% endif %} {% endif %}
<!-- Add New PO Button -->
<div class="d-flex justify-content-between mb-2">
<h3 class="">
{{ _("Purchase Orders") |capfirst }}
</h2>
<a href="{% url 'purchase_order_create' %}"
class="btn btn-md btn-phoenix-primary"><i class="fa fa-plus me-2"></i>{{ _("Create New PO") }}</a>
</div>
{% include "partials/search_box.html" %}
<!-- Add New PO Button --> <div class="table-responsive px-1 scrollbar mt-3">
<div class="d-flex justify-content-between align-items-center mb-3"> <table class= "table align-items-center table-flush table-hover">
<a href="{% url 'purchase_order_create' %}" class="btn btn-primary"> <thead>
<i class="bi bi-plus-lg"></i> Create New PO <tr class="bg-body-highlight">
</a> <th class="sort white-space-nowrap align-middle" scope="col" style="width:15%">PO Number</th>
</div> <th class="sort white-space-nowrap align-middle" scope="col" style="width:40%">Description</th>
<!-- PO Table --> <th class="sort white-space-nowrap align-middle" scope="col" style="width:15%">Status</th>
<div class="table-responsive"> <th class="sort white-space-nowrap align-middle" scope="col" style="width:15%">Created At</th>
<table class="table table-striped table-hover align-middle"> <th class="sort white-space-nowrap align-middle" scope="col" style="width:15%">Actions</th>
<thead class="table-dark"> </tr>
<tr> </thead>
<th scope="col">PO Number</th> <tbody class="list">
<th scope="col">Description</th>
<th scope="col">Status</th>
<th scope="col">Created At</th>
<th scope="col">Actions</th>
</tr>
</thead>
<tbody>
{% if purchase_orders %} {% if purchase_orders %}
{% for po in purchase_orders %} {% for po in purchase_orders %}
<tr>
<td>{{ po.po_number }}</td> <tr class="hover-actions-trigger btn-reveal-trigger position-static">
<td>{{ po.po_title }}</td> <td class="align-middle product white-space-nowrap">{{ po.po_number }}</td>
<td> <td class="align-middle product white-space-nowrap">{{ po.po_title }}</td>
<td class="align-middle product white-space-nowrap">
<span class=""> <span class="">
{{ po.po_status|capfirst }} {{ po.po_status|capfirst }}
</span> </span>
</td> </td>
<td>{{ po.created|date:"M d, Y" }}</td> <td class="align-middle product white-space-nowrap">{{ po.created|date:"M d, Y" }}</td>
<td> <td class="align-middle product white-space-nowrap">
<a href="{% url 'purchase_order_detail' po.pk %}" class="btn btn-sm btn-info me-1"> <a href="{% url 'purchase_order_detail' po.pk %}"
View class="btn btn-sm btn-phoenix-success">
</a> <i class="fa-regular fa-eye me-1"></i>
{% comment %} <a href="{% url 'purchase_order_detail' po.id %}" class="btn btn-sm btn-info me-1"> {% trans "view"|capfirst %}
View
</a> </a>
<a href="{% url 'purchase_order_update' po.id %}" class="btn btn-sm btn-warning me-1">
Edit
</a>
<a href="{% url 'purchase_order_delete' po.id %}" class="btn btn-sm btn-danger">
Delete
</a> {% endcomment %}
</td> </td>
</tr> </tr>
{% endfor %} {%endfor%}
{% else %} {% else%}
<tr> <tr>
<td colspan="6" class="text-center">No purchase orders found.</td> <td colspan="6" class="text-center">No purchase orders found.</td>
</tr> </tr>
{% endif %} {% endif %}
</tbody> </tbody>
</table> </table>
</div>
<div class="d-flex justify-content-end mt-3">
<div class="d-flex">
{% if is_paginated %}
{% include 'partials/pagination.html' %}
{% endif %}
</div>
</div>
</div> </div>
</div> {% include 'modal/delete_modal.html' %}
{% endblock %} {% endblock %}

View File

@ -24,12 +24,13 @@
{% csrf_token %} {% csrf_token %}
{{ form|crispy }} {{ form|crispy }}
<button type="submit" <button type="submit"
class="btn btn-primary w-100 my-2">{% trans 'Save PO' %} class="btn btn-outline-success w-100 my-2">{% trans 'Save PO' %}
</button> </button>
<a href="{% url 'purchase_order_detail' po_model.uuid %}" <a href="{% url 'purchase_order_detail' po_model.uuid %}"
class="btn btn-dark w-100 my-2">{% trans 'Back to PO Detail' %}</a> class="btn btn-outline-secondary w-100 my-2">{% trans 'Back to PO Detail' %}</a>
<a href="{% url 'purchase_order_list' %}" <a href="{% url 'purchase_order_list' %}"
class="btn btn-info w-100 my-2">{% trans 'PO List' %}</a> class="btn btn-outline-info
info w-100 my-2">{% trans 'PO List' %}</a>
</div> </div>
</div> </div>
</form> </form>

View File

@ -4,7 +4,7 @@
<div class="table-container"> <div class="table-container">
<table class="table is-fullwidth is-striped is-narrow is-bordered"> <table class="table is-fullwidth is-striped is-narrow is-bordered">
<thead> <thead>
<tr class="has-text-centered"> <tr class="has-text-centered bg-body-highlight">
<th>{% trans 'Item' %}</th> <th>{% trans 'Item' %}</th>
<th>{% trans 'Unit Cost' %}</th> <th>{% trans 'Unit Cost' %}</th>
<th>{% trans 'PO Qty' %}</th> <th>{% trans 'PO Qty' %}</th>