feat: initial commit - Band Management application

This commit is contained in:
2026-01-06 03:11:46 +01:00
commit 34e12e00b3
24543 changed files with 3991790 additions and 0 deletions

View File

@@ -0,0 +1,2 @@
# Register your models here.

View File

@@ -0,0 +1,6 @@
from django.apps import AppConfig
class InvoiceConfig(AppConfig):
default_auto_field = "django.db.models.BigAutoField"
name = "apps.invoice"

View File

@@ -0,0 +1,2 @@
# Create your models here.

View File

@@ -0,0 +1,292 @@
{% extends layout_path %}
{% load static %}
{% load i18n %}
{% block title %}Add - Invoice{% endblock %}
{% block vendor_css %}
{{ block.super }}
<link rel="stylesheet" href="{% static 'vendor/libs/flatpickr/flatpickr.css' %}" />
{% endblock vendor_css %}
{% block vendor_js %}
{{ block.super }}
<script src="{% static 'vendor/libs/flatpickr/flatpickr.js' %}"></script>
<script src="{% static 'vendor/libs/cleave-zen/cleave-zen.js' %}"></script>
<script src="{% static 'vendor/libs/jquery-repeater/jquery-repeater.js' %}"></script>
{% endblock vendor_js %}
{% block page_css %}
{{ block.super }}
<link rel="stylesheet" href="{% static 'vendor/css/pages/app-invoice.css' %}" />
{% endblock page_css %}
{% block page_js %}
{{ block.super }}
<script src="{% static 'js/offcanvas-send-invoice.js' %}"></script>
<script src="{% static 'js/app-invoice-add.js' %}"></script>
{% endblock page_js %}
{% block content %}
<div class="row invoice-add">
<!-- Invoice Add-->
<div class="col-lg-9 col-12 mb-lg-0 mb-6">
<div class="card invoice-preview-card p-sm-12 p-6">
<div class="card-body invoice-preview-header rounded">
<div class="d-flex flex-wrap flex-column flex-sm-row justify-content-between text-heading">
<div class="mb-md-0 mb-6">
<div class="d-flex svg-illustration mb-6 gap-2 align-items-center">
<span class="app-brand-logo demo">{% include 'partials/logo.html' %}</span>
<span class="app-brand-text fw-bold fs-4 ms-50">{% get_theme_variables 'template_name' %}</span>
</div>
<p class="mb-2">Office 149, 450 South Brand Brooklyn</p>
<p class="mb-2">San Diego County, CA 91905, USA</p>
<p class="mb-3">+1 (123) 456 7891, +44 (876) 543 2198</p>
</div>
<div class="col-md-5 col-8 pe-0 ps-0 ps-md-2">
<dl class="row mb-0 gx-4">
<dt class="col-sm-5 mb-2 d-md-flex align-items-center justify-content-end">
<span class="h5 text-capitalize mb-0 text-nowrap">Invoice</span>
</dt>
<dd class="col-sm-7">
<input type="text" class="form-control" disabled placeholder="#3905" value="#3905" id="invoiceId" />
</dd>
<dt class="col-sm-5 mb-1 d-md-flex align-items-center justify-content-end">
<span class="fw-normal">Date Issued:</span>
</dt>
<dd class="col-sm-7">
<input type="text" class="form-control invoice-date" placeholder="MM/DD/YYYY" />
</dd>
<dt class="col-sm-5 d-md-flex align-items-center justify-content-end">
<span class="fw-normal">Due Date:</span>
</dt>
<dd class="col-sm-7 mb-0">
<input type="text" class="form-control due-date" placeholder="MM/DD/YYYY" />
</dd>
</dl>
</div>
</div>
</div>
<div class="card-body px-0">
<div class="row">
<div class="col-md-6 col-sm-5 col-12 mb-sm-0 mb-6">
<h6>Invoice To:</h6>
<select class="form-select mb-4 w-50">
<option value="Jordan Stevenson">Jordan Stevenson</option>
<option value="Wesley Burland">Wesley Burland</option>
<option value="Vladamir Koschek">Vladamir Koschek</option>
<option value="Tyne Widmore">Tyne Widmore</option>
</select>
<p class="mb-1">Shelby Company Limited</p>
<p class="mb-1">Small Heath, B10 0HF, UK</p>
<p class="mb-1">718-986-6062</p>
<p class="mb-0">peakyFBlinders@gmail.com</p>
</div>
<div class="col-md-6 col-sm-7">
<h6>Bill To:</h6>
<table>
<tbody>
<tr>
<td class="pe-4">Total Due:</td>
<td>$12,110.55</td>
</tr>
<tr>
<td class="pe-4">Bank name:</td>
<td>American Bank</td>
</tr>
<tr>
<td class="pe-4">Country:</td>
<td>United States</td>
</tr>
<tr>
<td class="pe-4">IBAN:</td>
<td>ETD95476213874685</td>
</tr>
<tr>
<td class="pe-4">SWIFT code:</td>
<td>BR91905</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<hr class="mt-0 mb-6" />
<div class="card-body pt-0 px-0">
<form class="source-item">
<div class="mb-4" data-repeater-list="group-a">
<div class="repeater-wrapper pt-0 pt-md-9" data-repeater-item>
<div class="d-flex border rounded position-relative pe-0">
<div class="row w-100 p-6 g-md-6 g-2">
<div class="col-md-6 col-12 mb-md-0 mb-4">
<p class="h6 repeater-title">Item</p>
<select class="form-select item-details mb-6">
<option value="App Design">App Design</option>
<option value="App Customization" selected>App Customization</option>
<option value="ABC Template">ABC Template</option>
<option value="App Development">App Development</option>
</select>
<textarea class="form-control" rows="2" placeholder="Customization & Bug Fixes"></textarea>
</div>
<div class="col-md-3 col-12 mb-md-0 mb-4">
<p class="h6 repeater-title">Cost</p>
<input type="text" class="form-control invoice-item-price mb-5" placeholder="24" min="12" />
<div class="text-heading">
<div class="mb-1">Discount:</div>
<span class="discount me-2">0%</span>
<span class="tax-1 me-2" data-bs-toggle="tooltip" data-bs-placement="top" title="Tax 1">0%</span>
<span class="tax-2" data-bs-toggle="tooltip" data-bs-placement="top" title="Tax 2">0%</span>
</div>
</div>
<div class="col-md-2 col-12 mb-md-0 mb-4">
<p class="h6 repeater-title">Qty</p>
<input type="text" class="form-control invoice-item-qty" placeholder="1" min="1" max="50" />
</div>
<div class="col-md-1 col-12 pe-0 mt-8">
<p class="h6 repeater-title">Price</p>
<p class="mb-0 text-heading">$24.00</p>
</div>
</div>
<div class="d-flex flex-column align-items-center justify-content-between border-start p-2">
<i class="icon-base ti tabler-x icon-lg cursor-pointer" data-repeater-delete></i>
<div class="dropdown">
<i class="icon-base ti tabler-settings icon-lg cursor-pointer more-options-dropdown" role="button" id="dropdownMenuButton" data-bs-toggle="dropdown" data-bs-auto-close="outside" aria-expanded="false"> </i>
<div class="dropdown-menu dropdown-menu-end w-px-300 p-4" aria-labelledby="dropdownMenuButton">
<div class="row g-3">
<div class="col-12">
<label for="discountInput" class="form-label">Discount(%)</label>
<input type="number" class="form-control" id="discountInput" min="0" max="100" />
</div>
<div class="col-md-6">
<label for="taxInput1" class="form-label">Tax 1</label>
<select name="tax-1-input" id="taxInput1" class="form-select tax-select">
<option value="0%" selected>0%</option>
<option value="1%">1%</option>
<option value="10%">10%</option>
<option value="18%">18%</option>
<option value="40%">40%</option>
</select>
</div>
<div class="col-md-6">
<label for="taxInput2" class="form-label">Tax 2</label>
<select name="tax-2-input" id="taxInput2" class="form-select tax-select">
<option value="0%" selected>0%</option>
<option value="1%">1%</option>
<option value="10%">10%</option>
<option value="18%">18%</option>
<option value="40%">40%</option>
</select>
</div>
</div>
<div class="dropdown-divider my-4"></div>
<button type="button" class="btn btn-label-primary btn-apply-changes">Apply</button>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-12">
<button type="button" class="btn btn-sm btn-primary" data-repeater-create><i class="icon-base ti tabler-plus icon-xs me-1_5"></i>Add Item</button>
</div>
</div>
</form>
</div>
<hr class="my-0" />
<div class="card-body px-0">
<div class="row row-gap-4">
<div class="col-md-6 mb-md-0 mb-4">
<div class="d-flex align-items-center mb-4">
<label for="salesperson" class="me-2 fw-medium text-heading">Salesperson:</label>
<input type="text" class="form-control" id="salesperson" placeholder="Edward Crowley" />
</div>
<input type="text" class="form-control" id="invoiceMsg" placeholder="Thanks for your business" />
</div>
<div class="col-md-6 d-flex justify-content-end">
<div class="invoice-calculations">
<div class="d-flex justify-content-between mb-2">
<span class="w-px-100">Subtotal:</span>
<span class="fw-medium text-heading">$1800</span>
</div>
<div class="d-flex justify-content-between mb-2">
<span class="w-px-100">Discount:</span>
<span class="fw-medium text-heading">$28</span>
</div>
<div class="d-flex justify-content-between mb-2">
<span class="w-px-100">Tax:</span>
<span class="fw-medium text-heading">21%</span>
</div>
<hr class="my-2" />
<div class="d-flex justify-content-between">
<span class="w-px-100">Total:</span>
<span class="fw-medium text-heading">$1690</span>
</div>
</div>
</div>
</div>
</div>
<hr class="my-0" />
<div class="card-body px-0 pb-0">
<div class="row">
<div class="col-12">
<div>
<label for="note" class="text-heading mb-1 fw-medium">Note:</label>
<textarea class="form-control" rows="2" id="note" placeholder="Invoice note">It was a pleasure working with you and your team. We hope you will keep us in mind for future freelance projects. Thank You!</textarea>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- /Invoice Add-->
<!-- Invoice Actions -->
<div class="col-lg-3 col-12 invoice-actions">
<div class="card mb-6">
<div class="card-body">
<button class="btn btn-primary d-grid w-100 mb-4" data-bs-toggle="offcanvas" data-bs-target="#sendInvoiceOffcanvas">
<span class="d-flex align-items-center justify-content-center text-nowrap"><i class="icon-base ti tabler-send icon-xs me-2"></i>Send Invoice</span>
</button>
<a href="{% url 'app-invoice-preview' %}" class="btn btn-label-secondary d-grid w-100 mb-4">Preview</a>
<button type="button" class="btn btn-label-secondary d-grid w-100">Save</button>
</div>
</div>
<div>
<label for="acceptPaymentsVia" class="form-label">Accept payments via</label>
<select class="form-select mb-6" id="acceptPaymentsVia">
<option value="Bank Account">Bank Account</option>
<option value="Paypal">Paypal</option>
<option value="Card">Credit/Debit Card</option>
<option value="UPI Transfer">UPI Transfer</option>
</select>
<div class="d-flex justify-content-between mb-2">
<label for="payment-terms">Payment Terms</label>
<div class="form-check form-switch me-n2">
<input type="checkbox" class="form-check-input" id="payment-terms" checked />
</div>
</div>
<div class="d-flex justify-content-between mb-2">
<label for="client-notes">Client Notes</label>
<div class="form-check form-switch me-n2">
<input type="checkbox" class="form-check-input" id="client-notes" checked />
</div>
</div>
<div class="d-flex justify-content-between">
<label for="payment-stub">Payment Stub</label>
<div class="form-check form-switch me-n2">
<input type="checkbox" class="form-check-input" id="payment-stub" checked />
</div>
</div>
</div>
</div>
<!-- /Invoice Actions -->
</div>
<!-- Offcanvas -->
{% include "partials/_offcanvas/offcanvas_send_invoice.html" %}
<!-- /Offcanvas -->
{% endblock %}

View File

@@ -0,0 +1,300 @@
{% extends layout_path %}
{% load static %}
{% load i18n %}
{% block title %}Edit - Invoice{% endblock %}
{% block vendor_css %}
{{ block.super }}
<link rel="stylesheet" href="{% static 'vendor/libs/flatpickr/flatpickr.css' %}" />
{% endblock vendor_css %}
{% block vendor_js %}
{{ block.super }}
<script src="{% static 'vendor/libs/flatpickr/flatpickr.js' %}"></script>
<script src="{% static 'vendor/libs/cleave-zen/cleave-zen.js' %}"></script>
<script src="{% static 'vendor/libs/jquery-repeater/jquery-repeater.js' %}"></script>
{% endblock vendor_js %}
{% block page_css %}
{{ block.super }}
<link rel="stylesheet" href="{% static 'vendor/css/pages/app-invoice.css' %}" />
{% endblock page_css %}
{% block page_js %}
{{ block.super }}
<script src="{% static 'js/offcanvas-add-payment.js' %}"></script>
<script src="{% static 'js/offcanvas-send-invoice.js' %}"></script>
<script src="{% static 'js/app-invoice-edit.js' %}"></script>
{% endblock page_js %}
{% block content %}
<div class="row invoice-edit">
<!-- Invoice Edit-->
<div class="col-lg-9 col-12 mb-lg-0 mb-6">
<div class="card invoice-preview-card p-sm-12 p-6">
<div class="card-body invoice-preview-header rounded">
<div class="row text-heading px-3">
<div class="col-md-7 mb-md-0 mb-6 ps-0">
<div class="d-flex svg-illustration mb-6 gap-2 align-items-center">
<span class="app-brand-logo demo">{% include 'partials/logo.html' %}</span>
<span class="app-brand-text fw-bold fs-4 ms-50">{% get_theme_variables 'template_name' %}</span>
</div>
<p class="mb-2">Office 149, 450 South Brand Brooklyn</p>
<p class="mb-2">San Diego County, CA 91905, USA</p>
<p class="mb-3">+1 (123) 456 7891, +44 (876) 543 2198</p>
</div>
<div class="col-md-5 col-8 pe-0 ps-0 ps-md-2">
<dl class="row mb-0 gx-4">
<dt class="col-sm-5 mb-2 d-md-flex align-items-center justify-content-end">
<span class="h5 text-capitalize mb-0 text-nowrap">Invoice</span>
</dt>
<dd class="col-sm-7">
<input type="text" class="form-control" disabled placeholder="#74909" value="#74909" id="invoiceId" />
</dd>
<dt class="col-sm-5 mb-1 d-md-flex align-items-center justify-content-end">
<span class="fw-normal">Date Issued:</span>
</dt>
<dd class="col-sm-7">
<input type="text" class="form-control invoice-date" placeholder="MM/DD/YYYY" />
</dd>
<dt class="col-sm-5 d-md-flex align-items-center justify-content-end">
<span class="fw-normal">Due Date:</span>
</dt>
<dd class="col-sm-7 mb-0">
<input type="text" class="form-control due-date" placeholder="MM/DD/YYYY" />
</dd>
</dl>
</div>
</div>
</div>
<div class="card-body px-0">
<div class="row">
<div class="col-md-6 col-sm-5 col-12 mb-sm-0 mb-6">
<h6>Invoice To:</h6>
<select class="form-select mb-4 w-50">
<option value="Jordan Stevenson">Jordan Stevenson</option>
<option value="Wesley Burland">Wesley Burland</option>
<option value="Vladamir Koschek">Vladamir Koschek</option>
<option value="Tyne Widmore">Tyne Widmore</option>
</select>
<p class="mb-1">Shelby Company Limited</p>
<p class="mb-1">Small Heath, B10 0HF, UK</p>
<p class="mb-1">718-986-6062</p>
<p class="mb-0">peakyFBlinders@gmail.com</p>
</div>
<div class="col-md-6 col-sm-7">
<h6>Bill To:</h6>
<table>
<tbody>
<tr>
<td class="pe-4">Total Due:</td>
<td>$12,110.55</td>
</tr>
<tr>
<td class="pe-4">Bank name:</td>
<td>American Bank</td>
</tr>
<tr>
<td class="pe-4">Country:</td>
<td>United States</td>
</tr>
<tr>
<td class="pe-4">IBAN:</td>
<td>ETD95476213874685</td>
</tr>
<tr>
<td class="pe-4">SWIFT code:</td>
<td>BR91905</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<hr class="mb-6 mt-0" />
<div class="card-body pt-0 px-0">
<form class="source-item">
<div class="mb-4" data-repeater-list="group-a">
<div class="repeater-wrapper pt-0 pt-md-9" data-repeater-item>
<div class="d-flex border rounded position-relative pe-0">
<div class="row w-100 p-6 g-md-6 g-2">
<div class="col-md-6 col-12 mb-md-0 mb-3">
<p class="h6 repeater-title">Item</p>
<select class="form-select item-details mb-6">
<option value="App Design">App Design</option>
<option value="App Customization" selected>App Customization</option>
<option value="ABC Template">ABC Template</option>
<option value="App Development">App Development</option>
</select>
<textarea class="form-control" rows="2" placeholder="Customization & Bug Fixes"></textarea>
</div>
<div class="col-md-3 col-12 mb-md-0 mb-4">
<p class="h6 repeater-title">Cost</p>
<input type="text" class="form-control invoice-item-price mb-5" value="24" placeholder="24" min="12" />
<div class="text-heading">
<div class="mb-1">Discount:</div>
<span class="discount me-2">0%</span>
<span class="tax-1 me-2" data-bs-toggle="tooltip" data-bs-placement="top" title="Tax 1">0%</span>
<span class="tax-2" data-bs-toggle="tooltip" data-bs-placement="top" title="Tax 2">0%</span>
</div>
</div>
<div class="col-md-2 col-12 mb-md-0 mb-4">
<p class="h6 repeater-title">Qty</p>
<input type="text" class="form-control invoice-item-qty" value="1" placeholder="1" min="1" max="50" />
</div>
<div class="col-md-1 col-12 pe-0 mt-8">
<p class="h6 repeater-title">Price</p>
<p class="mb-0 text-heading">$24.00</p>
</div>
</div>
<div class="d-flex flex-column align-items-center justify-content-between border-start p-2">
<i class="icon-base ti tabler-x icon-lg cursor-pointer" data-repeater-delete></i>
<div class="dropdown">
<i class="icon-base ti tabler-settings icon-lg cursor-pointer more-options-dropdown" role="button" id="dropdownMenuButton" data-bs-toggle="dropdown" data-bs-auto-close="outside" aria-expanded="false"> </i>
<div class="dropdown-menu dropdown-menu-end w-px-300 p-4" aria-labelledby="dropdownMenuButton">
<div class="row g-3">
<div class="col-12">
<label for="discountInput" class="form-label">Discount(%)</label>
<input type="number" class="form-control" id="discountInput" min="0" max="100" />
</div>
<div class="col-md-6">
<label for="taxInput1" class="form-label">Tax 1</label>
<select name="tax-1-input" id="taxInput1" class="form-select tax-select">
<option value="0%" selected>0%</option>
<option value="1%">1%</option>
<option value="10%">10%</option>
<option value="18%">18%</option>
<option value="40%">40%</option>
</select>
</div>
<div class="col-md-6">
<label for="taxInput2" class="form-label">Tax 2</label>
<select name="tax-2-input" id="taxInput2" class="form-select tax-select">
<option value="0%" selected>0%</option>
<option value="1%">1%</option>
<option value="10%">10%</option>
<option value="18%">18%</option>
<option value="40%">40%</option>
</select>
</div>
</div>
<div class="dropdown-divider my-4"></div>
<button type="button" class="btn btn-label-primary btn-apply-changes">Apply</button>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row pb-4">
<div class="col-12">
<button type="button" class="btn btn-sm btn-primary" data-repeater-create><i class="icon-base ti tabler-plus icon-xs me-1_5"></i>Add Item</button>
</div>
</div>
</form>
</div>
<hr class="my-0" />
<div class="card-body px-0">
<div class="row row-gap-4">
<div class="col-md-6 mb-md-0 mb-3">
<div class="d-flex align-items-center mb-4">
<label for="salesperson" class="me-2 fw-medium text-heading">Salesperson:</label>
<input type="text" class="form-control" id="salesperson" placeholder="Edward Crowley" value="Edward Crowley" />
</div>
<input type="text" class="form-control" id="invoiceMsg" placeholder="Thanks for your business" value="Thanks for your business" />
</div>
<div class="col-md-6 d-flex justify-content-end">
<div class="invoice-calculations">
<div class="d-flex justify-content-between mb-2">
<span class="w-px-100">Subtotal:</span>
<span class="fw-medium text-heading">$1800</span>
</div>
<div class="d-flex justify-content-between mb-2">
<span class="w-px-100">Discount:</span>
<span class="fw-medium text-heading">$28</span>
</div>
<div class="d-flex justify-content-between mb-2">
<span class="w-px-100">Tax:</span>
<span class="fw-medium text-heading">21%</span>
</div>
<hr class="my-2" />
<div class="d-flex justify-content-between">
<span class="w-px-100">Total:</span>
<span class="fw-medium text-heading">$1690</span>
</div>
</div>
</div>
</div>
</div>
<hr class="my-0" />
<div class="card-body px-0 pb-0">
<div class="row">
<div class="col-12">
<div>
<label for="note" class="fw-medium text-heading mb-1">Note:</label>
<textarea class="form-control" rows="2" id="note">It was a pleasure working with you and your team. We hope you will keep us in mind for future freelance projects. Thank You!</textarea>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- /Invoice Edit-->
<!-- Invoice Actions -->
<div class="col-lg-3 col-12 invoice-actions">
<div class="card mb-6">
<div class="card-body">
<button class="btn btn-primary d-grid w-100" data-bs-toggle="offcanvas" data-bs-target="#sendInvoiceOffcanvas">
<span class="d-flex align-items-center justify-content-center text-nowrap"><i class="icon-base ti tabler-send icon-xs me-2"></i>Send Invoice</span>
</button>
<div class="d-flex my-4">
<a href="{% url 'app-invoice-preview' %}" class="btn btn-label-secondary w-100 me-4">Preview</a>
<button type="button" class="btn btn-label-secondary w-100">Save</button>
</div>
<button class="btn btn-success d-grid w-100" data-bs-toggle="offcanvas" data-bs-target="#addPaymentOffcanvas">
<span class="d-flex align-items-center justify-content-center text-nowrap"><i class="icon-base ti tabler-currency-dollar icon-xs me-1"></i>Add Payment</span>
</button>
</div>
</div>
<div>
<label for="acceptPaymentsVia" class="form-label">Accept payments via</label>
<select class="form-select mb-6" id="acceptPaymentsVia">
<option value="Bank Account">Bank Account</option>
<option value="Paypal">Paypal</option>
<option value="Card">Credit/Debit Card</option>
<option value="UPI Transfer">UPI Transfer</option>
</select>
<div class="d-flex justify-content-between mb-2">
<label for="payment-terms">Payment Terms</label>
<div class="form-check form-switch me-n2">
<input type="checkbox" class="form-check-input" id="payment-terms" checked />
</div>
</div>
<div class="d-flex justify-content-between mb-2">
<label for="client-notes">Client Notes</label>
<div class="form-check form-switch me-n2">
<input type="checkbox" class="form-check-input" id="client-notes" checked />
</div>
</div>
<div class="d-flex justify-content-between">
<label for="payment-stub">Payment Stub</label>
<div class="form-check form-switch me-n2">
<input type="checkbox" class="form-check-input" id="payment-stub" checked />
</div>
</div>
</div>
</div>
<!-- /Invoice Actions -->
</div>
<!-- Offcanvas -->
{% include "partials/_offcanvas/offcanvas_send_invoice.html" %}
{% include "partials/_offcanvas/offcanvas_add_payment.html" %}
<!-- /Offcanvas -->
{% endblock %}

View File

@@ -0,0 +1,114 @@
{% extends layout_path %}
{% load static %}
{% load i18n %}
{% block title %}Invoice List - Pages{% endblock %}
{% block vendor_css %}
{{ block.super }}
<link rel="stylesheet" href="{% static 'vendor/libs/datatables-bs5/datatables.bootstrap5.css' %}" />
<link rel="stylesheet" href="{% static 'vendor/libs/datatables-responsive-bs5/responsive.bootstrap5.css' %}" />
<link rel="stylesheet" href="{% static 'vendor/libs/datatables-buttons-bs5/buttons.bootstrap5.css' %}" />
{% endblock vendor_css %}
{% block vendor_js %}
{{ block.super }}
<script src="{% static 'vendor/libs/moment/moment.js' %}"></script>
<script src="{% static 'vendor/libs/datatables-bs5/datatables-bootstrap5.js' %}"></script>
{% endblock vendor_js %}
{% block page_js %}
{{ block.super }}
<script src="{% static 'js/app-invoice-list.js' %}"></script>
{% endblock page_js %}
{% block content %}
<!-- Invoice List Widget -->
<div class="card mb-6">
<div class="card-widget-separator-wrapper">
<div class="card-body card-widget-separator">
<div class="row gy-4 gy-sm-1">
<div class="col-sm-6 col-lg-3">
<div class="d-flex justify-content-between align-items-center card-widget-1 border-end pb-4 pb-sm-0">
<div>
<h4 class="mb-0">24</h4>
<p class="mb-0">Clients</p>
</div>
<div class="avatar me-sm-6">
<span class="avatar-initial rounded bg-label-secondary text-heading">
<i class="icon-base ti tabler-user icon-26px"></i>
</span>
</div>
</div>
<hr class="d-none d-sm-block d-lg-none me-6" />
</div>
<div class="col-sm-6 col-lg-3">
<div class="d-flex justify-content-between align-items-center card-widget-2 border-end pb-4 pb-sm-0">
<div>
<h4 class="mb-0">165</h4>
<p class="mb-0">Invoices</p>
</div>
<div class="avatar me-lg-6">
<span class="avatar-initial rounded bg-label-secondary text-heading">
<i class="icon-base ti tabler-file-invoice icon-26px"></i>
</span>
</div>
</div>
<hr class="d-none d-sm-block d-lg-none" />
</div>
<div class="col-sm-6 col-lg-3">
<div class="d-flex justify-content-between align-items-center border-end pb-4 pb-sm-0 card-widget-3">
<div>
<h4 class="mb-0">$2.46k</h4>
<p class="mb-0">Paid</p>
</div>
<div class="avatar me-sm-6">
<span class="avatar-initial rounded bg-label-secondary text-heading">
<i class="icon-base ti tabler-checks icon-26px"></i>
</span>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-3">
<div class="d-flex justify-content-between align-items-center">
<div>
<h4 class="mb-0">$876</h4>
<p class="mb-0">Unpaid</p>
</div>
<div class="avatar">
<span class="avatar-initial rounded bg-label-secondary text-heading">
<i class="icon-base ti tabler-circle-off icon-26px"></i>
</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Invoice List Table -->
<div class="card">
<div class="card-datatable table-responsive">
<table class="invoice-list-table table border-top">
<thead>
<tr>
<th></th>
<th></th>
<th>#</th>
<th>Status</th>
<th>Client</th>
<th>Total</th>
<th class="text-truncate">Issued Date</th>
<th>Balance</th>
<th>Invoice Status</th>
<th class="cell-fit">Action</th>
</tr>
</thead>
</table>
</div>
</div>
{% endblock %}

View File

@@ -0,0 +1,211 @@
{% extends layout_path %}
{% load static %}
{% load i18n %}
{% block title %}Preview - Invoice{% endblock %}
{% block vendor_css %}
{{ block.super }}
<link rel="stylesheet" href="{% static 'vendor/libs/flatpickr/flatpickr.css' %}" />
{% endblock vendor_css %}
{% block vendor_js %}
{{ block.super }}
<script src="{% static 'vendor/libs/moment/moment.js' %}"></script>
<script src="{% static 'vendor/libs/flatpickr/flatpickr.js' %}"></script>
<script src="{% static 'vendor/libs/cleave-zen/cleave-zen.js' %}"></script>
{% endblock vendor_js %}
{% block page_css %}
{{ block.super }}
<link rel="stylesheet" href="{% static 'vendor/css/pages/app-invoice.css' %}" />
{% endblock page_css %}
{% block page_js %}
{{ block.super }}
<script src="{% static 'js/offcanvas-add-payment.js' %}"></script>
<script src="{% static 'js/offcanvas-send-invoice.js' %}"></script>
{% endblock page_js %}
{% block content %}
<div class="row invoice-preview">
<!-- Invoice -->
<div class="col-xl-9 col-md-8 col-12 mb-md-0 mb-6">
<div class="card invoice-preview-card p-sm-12 p-6">
<div class="card-body invoice-preview-header rounded">
<div class="d-flex justify-content-between flex-xl-row flex-md-column flex-sm-row flex-column align-items-xl-center align-items-md-start align-items-sm-center align-items-start">
<div class="mb-xl-0 mb-6 text-heading">
<div class="d-flex svg-illustration mb-6 gap-2 align-items-center">
<span class="app-brand-logo demo">{% include 'partials/logo.html' %}</span>
<span class="app-brand-text fw-bold fs-4 ms-50">{% get_theme_variables 'template_name' %}</span>
</div>
<p class="mb-2">Office 149, 450 South Brand Brooklyn</p>
<p class="mb-2">San Diego County, CA 91905, USA</p>
<p class="mb-0">+1 (123) 456 7891, +44 (876) 543 2198</p>
</div>
<div>
<h5 class="mb-6">Invoice #86423</h5>
<div class="mb-1 text-heading">
<span>Date Issues:</span>
<span class="fw-medium">April 25, 2021</span>
</div>
<div class="text-heading">
<span>Date Due:</span>
<span class="fw-medium">May 25, 2021</span>
</div>
</div>
</div>
</div>
<div class="card-body px-0">
<div class="row">
<div class="col-xl-6 col-md-12 col-sm-5 col-12 mb-xl-0 mb-md-6 mb-sm-0 mb-6">
<h6>Invoice To:</h6>
<p class="mb-1">Thomas shelby</p>
<p class="mb-1">Shelby Company Limited</p>
<p class="mb-1">Small Heath, B10 0HF, UK</p>
<p class="mb-1">718-986-6062</p>
<p class="mb-0">peakyFBlinders@gmail.com</p>
</div>
<div class="col-xl-6 col-md-12 col-sm-7 col-12">
<h6>Bill To:</h6>
<table>
<tbody>
<tr>
<td class="pe-4">Total Due:</td>
<td class="fw-medium">$12,110.55</td>
</tr>
<tr>
<td class="pe-4">Bank name:</td>
<td>American Bank</td>
</tr>
<tr>
<td class="pe-4">Country:</td>
<td>United States</td>
</tr>
<tr>
<td class="pe-4">IBAN:</td>
<td>ETD95476213874685</td>
</tr>
<tr>
<td class="pe-4">SWIFT code:</td>
<td>BR91905</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="table-responsive border border-bottom-0 border-top-0 rounded">
<table class="table m-0">
<thead>
<tr>
<th>Item</th>
<th>Description</th>
<th>Cost</th>
<th>Qty</th>
<th>Price</th>
</tr>
</thead>
<tbody>
<tr>
<td class="text-nowrap text-heading">Vuexy Admin Template</td>
<td class="text-nowrap">HTML Admin Template</td>
<td>$32</td>
<td>1</td>
<td>$32.00</td>
</tr>
<tr>
<td class="text-nowrap text-heading">Frest Admin Template</td>
<td class="text-nowrap">Angular Admin Template</td>
<td>$22</td>
<td>1</td>
<td>$22.00</td>
</tr>
<tr>
<td class="text-nowrap text-heading">Apex Admin Template</td>
<td class="text-nowrap">HTML Admin Template</td>
<td>$17</td>
<td>2</td>
<td>$34.00</td>
</tr>
<tr>
<td class="text-nowrap text-heading">Robust Admin Template</td>
<td class="text-nowrap">React Admin Template</td>
<td>$66</td>
<td>1</td>
<td>$66.00</td>
</tr>
</tbody>
</table>
</div>
<div class="table-responsive">
<table class="table m-0 table-borderless">
<tbody>
<tr>
<td class="align-top pe-6 ps-0 py-6 text-body">
<p class="mb-1">
<span class="me-2 h6">Salesperson:</span>
<span>Alfie Solomons</span>
</p>
<span>Thanks for your business</span>
</td>
<td class="px-0 py-6 w-px-100">
<p class="mb-2">Subtotal:</p>
<p class="mb-2">Discount:</p>
<p class="mb-2 border-bottom pb-2">Tax:</p>
<p class="mb-0">Total:</p>
</td>
<td class="text-end px-0 py-6 w-px-100 fw-medium text-heading">
<p class="fw-medium mb-2">$1800</p>
<p class="fw-medium mb-2">$28</p>
<p class="fw-medium mb-2 border-bottom pb-2">21%</p>
<p class="fw-medium mb-0">$1690</p>
</td>
</tr>
</tbody>
</table>
</div>
<hr class="mt-0 mb-6" />
<div class="card-body p-0">
<div class="row">
<div class="col-12">
<span class="fw-medium text-heading">Note:</span>
<span>It was a pleasure working with you and your team. We hope you will keep us in mind for future freelance projects. Thank You!</span>
</div>
</div>
</div>
</div>
</div>
<!-- /Invoice -->
<!-- Invoice Actions -->
<div class="col-xl-3 col-md-4 col-12 invoice-actions">
<div class="card">
<div class="card-body">
<button class="btn btn-primary d-grid w-100 mb-4" data-bs-toggle="offcanvas" data-bs-target="#sendInvoiceOffcanvas">
<span class="d-flex align-items-center justify-content-center text-nowrap"><i class="icon-base ti tabler-send icon-xs me-2"></i>Send Invoice</span>
</button>
<button class="btn btn-label-secondary d-grid w-100 mb-4">Download</button>
<div class="d-flex mb-4">
<a class="btn btn-label-secondary d-grid w-100 me-4" target="_blank" href="{% url 'app-invoice-print' %}"> Print </a>
<a href="{% url 'app-invoice-edit' %}" class="btn btn-label-secondary d-grid w-100"> Edit </a>
</div>
<button class="btn btn-success d-grid w-100" data-bs-toggle="offcanvas" data-bs-target="#addPaymentOffcanvas">
<span class="d-flex align-items-center justify-content-center text-nowrap"><i class="icon-base ti tabler-currency-dollar icon-xs me-2"></i>Add Payment</span>
</button>
</div>
</div>
</div>
<!-- /Invoice Actions -->
</div>
<!-- Offcanvas -->
{% include "partials/_offcanvas/offcanvas_send_invoice.html" %}
{% include "partials/_offcanvas/offcanvas_add_payment.html" %}
<!-- /Offcanvas -->
{% endblock %}

View File

@@ -0,0 +1,164 @@
{% extends layout_path %}
{% load static %}
{% load i18n %}
{% block title %}Invoice (Print version) - Pages{% endblock %}
{% block page_css %}
{{ block.super }}
<link rel="stylesheet" href="{% static 'vendor/css/pages/app-invoice-print.css' %}" />
{% endblock page_css %}
{% block page_js %}
{{ block.super }}
<script src="{% static 'js/app-invoice-print.js' %}"></script>
{% endblock page_js %}
{% block content %}
<div class="invoice-print p-12">
<div class="d-flex justify-content-between flex-row">
<div class="mb-6">
<div class="d-flex svg-illustration mb-6 gap-2 align-items-center">
<span class="app-brand-logo demo text-primary">{% include 'partials/logo.html' %}</span>
<span class="app-brand-text fw-bold fs-4 ms-50">{% get_theme_variables 'template_name' %}</span>
</div>
<p class="mb-1">Office 149, 450 South Brand Brooklyn</p>
<p class="mb-1">San Diego County, CA 91905, USA</p>
<p class="mb-0">+1 (123) 456 7891, +44 (876) 543 2198</p>
</div>
<div>
<h5 class="mb-6">INVOICE #86423</h5>
<div class="mb-1">
<span>Date Issues:</span>
<span>April 25, 2021</span>
</div>
<div>
<span>Date Due:</span>
<span>May 25, 2021</span>
</div>
</div>
</div>
<hr class="mb-6" />
<div class="row d-flex justify-content-between mb-6">
<div class="col-sm-6 w-50">
<h6>Invoice To:</h6>
<p class="mb-1">Thomas shelby</p>
<p class="mb-1">Shelby Company Limited</p>
<p class="mb-1">Small Heath, B10 0HF, UK</p>
<p class="mb-1">718-986-6062</p>
<p class="mb-0">peakyFBlinders@gmail.com</p>
</div>
<div class="col-sm-6 w-50">
<h6>Bill To:</h6>
<table>
<tbody>
<tr>
<td class="pe-4">Total Due:</td>
<td>$12,110.55</td>
</tr>
<tr>
<td class="pe-4">Bank name:</td>
<td>American Bank</td>
</tr>
<tr>
<td class="pe-4">Country:</td>
<td>United States</td>
</tr>
<tr>
<td class="pe-4">IBAN:</td>
<td>ETD95476213874685</td>
</tr>
<tr>
<td class="pe-4">SWIFT code:</td>
<td>BR91905</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="table-responsive border border-bottom-0 border-top-0 rounded">
<table class="table m-0">
<thead>
<tr>
<th>Item</th>
<th>Description</th>
<th>Cost</th>
<th>Qty</th>
<th>Price</th>
</tr>
</thead>
<tbody>
<tr>
<td>Vuexy Admin Template</td>
<td>HTML Admin Template</td>
<td>$32</td>
<td>1</td>
<td>$32.00</td>
</tr>
<tr>
<td>Frest Admin Template</td>
<td>Angular Admin Template</td>
<td>$22</td>
<td>1</td>
<td>$22.00</td>
</tr>
<tr>
<td>Apex Admin Template</td>
<td>HTML Admin Template</td>
<td>$17</td>
<td>2</td>
<td>$34.00</td>
</tr>
<tr>
<td>Robust Admin Template</td>
<td>React Admin Template</td>
<td>$66</td>
<td>1</td>
<td>$66.00</td>
</tr>
</tbody>
</table>
</div>
<div class="table-responsive">
<table class="table m-0 table-borderless">
<tbody>
<tr>
<td class="align-top px-0 py-6">
<p class="mb-1">
<span class="me-2 fw-medium">Salesperson:</span>
<span>Alfie Solomons</span>
</p>
<span>Thanks for your business</span>
</td>
<td class="px-0 py-12 w-px-100">
<p class="mb-2">Subtotal:</p>
<p class="mb-2">Discount:</p>
<p class="mb-2 border-bottom pb-2">Tax:</p>
<p class="mb-0 pt-2">Total:</p>
</td>
<td class="text-end px-0 py-6 w-px-100">
<p class="fw-medium mb-2">$1800</p>
<p class="fw-medium mb-2">$28</p>
<p class="fw-medium mb-2 border-bottom pb-2">21%</p>
<p class="fw-medium mb-0 pt-2">$1690</p>
</td>
</tr>
</tbody>
</table>
</div>
<hr class="mt-0 mb-6" />
<div class="row">
<div class="col-12">
<span class="fw-medium">Note:</span>
<span>It was a pleasure working with you and your team. We hope you will keep us in mind for future freelance projects. Thank You!</span>
</div>
</div>
</div>
{% endblock %}

View File

@@ -0,0 +1,32 @@
from django.urls import path
from .views import InvoiceView, InvoicePrintView
from django.contrib.auth.decorators import login_required
urlpatterns = [
path(
"app/invoice/list/",
login_required(InvoiceView.as_view(template_name="app_invoice_list.html")),
name="app-invoice-list",
),
path(
"app/invoice/preview/",
login_required(InvoiceView.as_view(template_name="app_invoice_preview.html")),
name="app-invoice-preview",
),
path(
"app/invoice/edit/",
login_required(InvoiceView.as_view(template_name="app_invoice_edit.html")),
name="app-invoice-edit",
),
path(
"app/invoice/add/",
login_required(InvoiceView.as_view(template_name="app_invoice_add.html")),
name="app-invoice-add",
),
path(
"app/invoice/print/",
login_required(InvoicePrintView.as_view(template_name="app_invoice_print.html")),
name="app-invoice-print",
),
]

View File

@@ -0,0 +1,35 @@
from django.views.generic import TemplateView
from web_project import TemplateLayout
from web_project.template_helpers.theme import TemplateHelper
"""
This file is a view controller for multiple pages as a module.
Here you can override the page view layout.
Refer to invoice/urls.py file for more pages.
"""
class InvoiceView(TemplateView):
# Predefined function
def get_context_data(self, **kwargs):
# A function to init the global layout. It is defined in web_project/__init__.py file
context = TemplateLayout.init(self, super().get_context_data(**kwargs))
return context
class InvoicePrintView(TemplateView):
# Predefined function
def get_context_data(self, **kwargs):
# A function to init the global layout. It is defined in web_project/__init__.py file
context = TemplateLayout.init(self, super().get_context_data(**kwargs))
# Update the context
context.update(
{
"layout_path": TemplateHelper.set_layout("layout_blank.html", context),
}
)
return context