New changes.
parent
f50f18acee
commit
ea84da3a92
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
@ -0,0 +1,85 @@
|
|||||||
|
{% extends "add-edit-main.html" %}
|
||||||
|
{%load static%}
|
||||||
|
{% block content %}
|
||||||
|
|
||||||
|
<!-- TO ENABLE THE SEARCH FUNCTIONALITY IN THE SELECT TAG -->
|
||||||
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/selectize.js/0.15.2/css/selectize.min.css" />
|
||||||
|
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
|
||||||
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/selectize.js/0.15.2/js/selectize.min.js"></script>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="w-full px-5 s:px-9 mb-5">
|
||||||
|
<div class="w-full h-full shadow-md rounded-md py-5 px-3 bg-white">
|
||||||
|
<h1 class="text-3xl text-secondosiblue text-center font-semibold">
|
||||||
|
Add Order
|
||||||
|
</h1>
|
||||||
|
|
||||||
|
<form method="POST" action="" enctype="multipart/form-data">
|
||||||
|
{% csrf_token %}
|
||||||
|
<div class="w-full flex flex-col gap-5">
|
||||||
|
<div class="w-full">
|
||||||
|
<label class="text-gray-500">Customer:</label>
|
||||||
|
<select name="type" id="customersSelectTag"
|
||||||
|
class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md text-gray-500 mt-1"
|
||||||
|
required>
|
||||||
|
<option selected disabled>Customers</option>
|
||||||
|
{% for customer in customers %}
|
||||||
|
<option value="{{customer.id}}">{{customer.user.first_name}} {{customer.user.last_name}}
|
||||||
|
</option>
|
||||||
|
{% endfor %}
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="w-full">
|
||||||
|
<label class="text-gray-500">Items:</label>
|
||||||
|
<select name="type" id=""
|
||||||
|
class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md text-gray-500 mt-1"
|
||||||
|
required>
|
||||||
|
<option value="">Type 1</option>
|
||||||
|
<option value="">Type 2</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="w-full">
|
||||||
|
<label class="text-gray-500">Status:</label>
|
||||||
|
<select name="type" id=""
|
||||||
|
class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md text-gray-500 mt-1"
|
||||||
|
required>
|
||||||
|
<option value="">Completed</option>
|
||||||
|
<option value="">Failed</option>
|
||||||
|
<option value="">Cancelled</option>
|
||||||
|
<option value="">None</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="w-full">
|
||||||
|
<label class="text-gray-500">Due Date:</label>
|
||||||
|
<input name="" type="date"
|
||||||
|
class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md mt-1" required>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="w-full">
|
||||||
|
<label class="text-gray-500">Items:</label>
|
||||||
|
<select name="items" id="itemsSelectTag"
|
||||||
|
class="border border-gray-300 p-3 rounded-md outline-none w-full text-gray-500 mt-1" multiple
|
||||||
|
required>
|
||||||
|
<option disabled>Items</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="w-full flex justify-center items-center mt-3">
|
||||||
|
<button type="submit"
|
||||||
|
class="w-fit py-1 px-5 bg-osiblue rounded-md outline-none text-white border border-osiblue text-xl cursor-pointer hover:bg-white hover:text-osiblue duration-300">Save</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!---------------------- JS SCRIPTS -------------------->
|
||||||
|
<script src="{% static 'js/billing/add-order.js' %}"></script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
{% endblock %}
|
||||||
@ -0,0 +1,72 @@
|
|||||||
|
{% extends "add-edit-main.html" %}
|
||||||
|
{%load static%}
|
||||||
|
{% block content %}
|
||||||
|
|
||||||
|
<div class="w-full px-5 s:px-9 mb-5">
|
||||||
|
<div class="w-full h-full shadow-md rounded-md py-5 px-3 bg-white">
|
||||||
|
<h1 class="text-3xl text-secondosiblue text-center font-semibold">
|
||||||
|
Add Product
|
||||||
|
</h1>
|
||||||
|
|
||||||
|
<form method="POST" action="" enctype="multipart/form-data">
|
||||||
|
{% csrf_token %}
|
||||||
|
<div class="w-full flex flex-col gap-5">
|
||||||
|
<div class="w-full">
|
||||||
|
<label class="text-gray-500">Title:</label>
|
||||||
|
<input name="" type="text"
|
||||||
|
class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md mt-1" required>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="w-full">
|
||||||
|
<label class="text-gray-500">Description:</label>
|
||||||
|
<textarea name="" type="text"
|
||||||
|
class="w-full py-1 px-3 border border-gray-300 outline-none rounded-md mt-1 resize-none"
|
||||||
|
rows="8" required></textarea>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="w-full">
|
||||||
|
<label class="text-gray-500">Customer:</label>
|
||||||
|
<select name="type" id=""
|
||||||
|
class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md text-gray-500 mt-1">
|
||||||
|
<option value="">Customer 1</option>
|
||||||
|
<option value="">Customer 2</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="w-full">
|
||||||
|
<label class="text-gray-500">Project Type:</label>
|
||||||
|
<select name="type" id=""
|
||||||
|
class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md text-gray-500 mt-1" required>
|
||||||
|
<option value="">Type 1</option>
|
||||||
|
<option value="">Type 2</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="w-full">
|
||||||
|
<label class="text-gray-500">Amount:</label>
|
||||||
|
<input name="" type="decimal"
|
||||||
|
class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md mt-1" required>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="w-full">
|
||||||
|
<label class="text-gray-500">Recurring:</label>
|
||||||
|
<select name="" id=""
|
||||||
|
class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md text-gray-500 mt-1" required>
|
||||||
|
<option value="">True</option>
|
||||||
|
<option value="">False</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="w-full flex justify-center items-center mt-3">
|
||||||
|
<button type="submit"
|
||||||
|
class="w-fit py-1 px-5 bg-osiblue rounded-md outline-none text-white border border-osiblue text-xl cursor-pointer hover:bg-white hover:text-osiblue duration-300">Save</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{% endblock %}
|
||||||
@ -0,0 +1,72 @@
|
|||||||
|
{% extends "add-edit-main.html" %}
|
||||||
|
{%load static%}
|
||||||
|
{% block content %}
|
||||||
|
|
||||||
|
<div class="w-full px-5 s:px-9 mb-5">
|
||||||
|
<div class="w-full h-full shadow-md rounded-md py-5 px-3 bg-white">
|
||||||
|
<h1 class="text-3xl text-secondosiblue text-center font-semibold">
|
||||||
|
Add Service
|
||||||
|
</h1>
|
||||||
|
|
||||||
|
<form method="POST" action="" enctype="multipart/form-data">
|
||||||
|
{% csrf_token %}
|
||||||
|
<div class="w-full flex flex-col gap-5">
|
||||||
|
<div class="w-full">
|
||||||
|
<label class="text-gray-500">Title:</label>
|
||||||
|
<input name="" type="text"
|
||||||
|
class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md mt-1" required>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="w-full">
|
||||||
|
<label class="text-gray-500">Description:</label>
|
||||||
|
<textarea name="" type="text"
|
||||||
|
class="w-full py-1 px-3 border border-gray-300 outline-none rounded-md mt-1 resize-none"
|
||||||
|
rows="8" required></textarea>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="w-full">
|
||||||
|
<label class="text-gray-500">Customer:</label>
|
||||||
|
<select name="type" id=""
|
||||||
|
class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md text-gray-500 mt-1">
|
||||||
|
<option value="">Customer 1</option>
|
||||||
|
<option value="">Customer 2</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="w-full">
|
||||||
|
<label class="text-gray-500">Project Type:</label>
|
||||||
|
<select name="type" id=""
|
||||||
|
class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md text-gray-500 mt-1" required>
|
||||||
|
<option value="">Type 1</option>
|
||||||
|
<option value="">Type 2</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="w-full">
|
||||||
|
<label class="text-gray-500">Amount:</label>
|
||||||
|
<input name="" type="decimal"
|
||||||
|
class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md mt-1" required>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="w-full">
|
||||||
|
<label class="text-gray-500">Recurring:</label>
|
||||||
|
<select name="" id=""
|
||||||
|
class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md text-gray-500 mt-1" required>
|
||||||
|
<option value="">True</option>
|
||||||
|
<option value="">False</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="w-full flex justify-center items-center mt-3">
|
||||||
|
<button type="submit"
|
||||||
|
class="w-fit py-1 px-5 bg-osiblue rounded-md outline-none text-white border border-osiblue text-xl cursor-pointer hover:bg-white hover:text-osiblue duration-300">Save</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{% endblock %}
|
||||||
@ -0,0 +1,30 @@
|
|||||||
|
{% load static %}
|
||||||
|
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<link rel="stylesheet" type="text/css" href='{% static "dist/output.css" %}'>
|
||||||
|
<title>Invoice Details</title>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
|
||||||
|
<body class="flex justify-center items-center" id="invoice-details-content">
|
||||||
|
<div class="w-[50%] flex flex-col items-center gap-5">
|
||||||
|
<img src="{% static 'images/ositcom_logos/full-logo.jpg' %}" class="w-[150px] h-[150px]">
|
||||||
|
|
||||||
|
<div class="w-full flex flex-col gap-3 p-5">
|
||||||
|
<p class="text-gray-500">Bill To: <span class="text-secondosiblue">Winabig</span></p>
|
||||||
|
<p class="text-gray-500">Customer Details: <span class="text-secondosiblue">036466464</span></p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="w-full bg-osiblue h-[50px]">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
@ -0,0 +1,97 @@
|
|||||||
|
{% extends "main.html" %}
|
||||||
|
{%load static%}
|
||||||
|
{% block content %}
|
||||||
|
|
||||||
|
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="w-full xxlg1:w-[75%]">
|
||||||
|
<div class="w-full h-fit bg-white rounded-md shadow-md p-5">
|
||||||
|
<h1 class="text-secondosiblue text-[30px] font-semibold">Invoices</h1>
|
||||||
|
|
||||||
|
<div
|
||||||
|
class="w-full py-4 px-3 bg-gray-200 rounded-md shadow-md mt-4 flex flex-col s:flex-row justify-between gap-3 items-center">
|
||||||
|
<div class="w-full s:w-fit flex justify-start items-center gap-5">
|
||||||
|
<div class="relative h-fit w-full s:w-fit flex items-center">
|
||||||
|
<input type="text" placeholder="Enter Invoice Number"
|
||||||
|
class="py-2 px-3 border border-gray-300 rounded-md outline-none w-full s:w-[300px] h-[40px] relative">
|
||||||
|
<button
|
||||||
|
class="text-gray-500 text-xl outline-none border-none cursor-pointer absolute right-2 bg-white">
|
||||||
|
<i class="fa fa-search"></i>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="w-full s:w-fit">
|
||||||
|
<a href="">
|
||||||
|
<button
|
||||||
|
class="w-full s:w-fit text-base px-3 py-2 bg-osiblue text-white outline-none border border-osiblue rounded-md cursor-pointer hover:bg-white hover:text-osiblue duration-300">Add
|
||||||
|
Invoice</button>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="overflow-x-auto border border-gray-300 rounded-md mt-4">
|
||||||
|
<table class="min-w-full divide-y">
|
||||||
|
<!-- TABLE HEADER -->
|
||||||
|
<thead class="bg-gray-50">
|
||||||
|
<tr>
|
||||||
|
<th scope="col"
|
||||||
|
class="px-6 py-3 text-sm font-medium text-gray-500 uppercase border-r border-gray-300 whitespace-nowrap">
|
||||||
|
Invoice Number
|
||||||
|
</th>
|
||||||
|
<th scope="col"
|
||||||
|
class="px-6 py-3 text-sm font-medium text-gray-500 uppercase border-r border-gray-300 whitespace-nowrap">
|
||||||
|
Customer
|
||||||
|
</th>
|
||||||
|
<th scope="col"
|
||||||
|
class="px-6 py-3 text-sm font-medium text-gray-500 uppercase border-r border-gray-300 whitespace-nowrap">
|
||||||
|
Order
|
||||||
|
</th>
|
||||||
|
<th scope="col"
|
||||||
|
class="px-6 py-3 text-sm font-medium text-gray-500 uppercase border-r border-gray-300 whitespace-nowrap">
|
||||||
|
Date Created
|
||||||
|
</th>
|
||||||
|
<th scope="col" class="px-6 py-3 text-sm font-medium text-gray-500 uppercase whitespace-nowrap">
|
||||||
|
Actions
|
||||||
|
</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
|
||||||
|
<!-- TABLE BODY -->
|
||||||
|
<tbody class="bg-white divide-y divide-gray-200">
|
||||||
|
{% for invoice in invoices %}
|
||||||
|
<tr>
|
||||||
|
<td class="px-6 py-4 text-center text-sm border-r border-gray-300">
|
||||||
|
<p class="text-slate-800">{{invoice.invoice_number}}</p>
|
||||||
|
</td>
|
||||||
|
|
||||||
|
<td class="px-6 py-4 text-center text-sm border-r border-gray-300">
|
||||||
|
<p class="text-slate-800">{{invoice.order.customer}}</p>
|
||||||
|
</td>
|
||||||
|
|
||||||
|
<td class="px-6 py-4 text-center text-sm border-r border-gray-300">
|
||||||
|
<p class="text-slate-800">{{invoice.order.id}}</p>
|
||||||
|
</td>
|
||||||
|
|
||||||
|
<td class="px-6 py-4 text-center text-sm border-r border-gray-300">
|
||||||
|
<p class="text-slate-800">{{invoice.date_created}}</p>
|
||||||
|
</td>
|
||||||
|
|
||||||
|
<td class="px-6 py-4">
|
||||||
|
<div class="w-full flex justify-center items-center">
|
||||||
|
<button
|
||||||
|
class="flex justify-center items-center gap-2 px-3 py-1 rounded-md bg-osiblue text-white border border-osiblue cursor-pointer hover:bg-white hover:text-osiblue duration-300 generateInvoice" data-invoice-id="{{ invoice.id }}">
|
||||||
|
Generate Invoice
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
{% endfor %}
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
{% endblock %}
|
||||||
@ -0,0 +1,183 @@
|
|||||||
|
{% extends "main.html" %}
|
||||||
|
{%load static%}
|
||||||
|
{% block content %}
|
||||||
|
|
||||||
|
|
||||||
|
<div class="w-full xxlg1:w-[75%]">
|
||||||
|
<div class="w-full h-fit bg-white rounded-md shadow-md p-5">
|
||||||
|
<div
|
||||||
|
class="w-full bg-secondosiblue shadow-md rounded-md px-3 s:px-5 py-3 s:py-5 flex flex-col s:flex-row justify-between items-center gap-5 text-fifthosiblue">
|
||||||
|
|
||||||
|
<div class="flex items-center gap-8">
|
||||||
|
<p class="selectedItemType cursor-pointer" id="products">Products</p>
|
||||||
|
<p class="cursor-pointer" id="services">Services</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="w-full s:w-fit">
|
||||||
|
<a href="{% url 'addproduct' %}" class="w-full s:w-fit">
|
||||||
|
<button
|
||||||
|
class="w-full s:w-fit px-5 py-2 bg-white text-secondosiblue border border-white rounded-md cursor-pointer hover:bg-secondosiblue hover:text-white duration-300"
|
||||||
|
id="addProductButton">Add
|
||||||
|
Product</button>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a href="{% url 'addservice' %}" class="w-full s:w-fit">
|
||||||
|
<button
|
||||||
|
class="w-full s:w-fit px-5 py-2 bg-white text-secondosiblue border border-white rounded-md cursor-pointer hover:bg-secondosiblue hover:text-white duration-300 hidden"
|
||||||
|
id="addServiceButton">Add
|
||||||
|
Service</button>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- PRODUCTS -->
|
||||||
|
<div class="overflow-x-auto border border-gray-300 rounded-md mt-5" id="productsContainer">
|
||||||
|
<table class="min-w-full divide-y">
|
||||||
|
<!-- TABLE HEADER -->
|
||||||
|
<thead class="bg-gray-50">
|
||||||
|
<tr>
|
||||||
|
<th scope="col"
|
||||||
|
class="px-6 py-3 text-sm font-medium text-gray-500 uppercase border-r border-gray-300 whitespace-nowrap">
|
||||||
|
Title
|
||||||
|
</th>
|
||||||
|
<th scope="col"
|
||||||
|
class="px-6 py-3 text-sm font-medium text-gray-500 uppercase border-r border-gray-300 whitespace-nowrap">
|
||||||
|
Customer
|
||||||
|
</th>
|
||||||
|
<th scope="col"
|
||||||
|
class="px-6 py-3 text-sm font-medium text-gray-500 uppercase border-r border-gray-300 whitespace-nowrap">
|
||||||
|
Type
|
||||||
|
</th>
|
||||||
|
<th scope="col"
|
||||||
|
class="px-6 py-3 text-sm font-medium text-gray-500 uppercase border-r border-gray-300 whitespace-nowrap">
|
||||||
|
Amount
|
||||||
|
</th>
|
||||||
|
<th scope="col" class="px-6 py-3 text-sm font-medium text-gray-500 uppercase whitespace-nowrap">
|
||||||
|
Actions
|
||||||
|
</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
|
||||||
|
<!-- TABLE BODY -->
|
||||||
|
<tbody class="bg-white divide-y divide-gray-200">
|
||||||
|
<tr>
|
||||||
|
<td class="px-6 py-4 text-center text-sm border-r border-gray-300">
|
||||||
|
<p class="text-slate-800">Item 1</p>
|
||||||
|
</td>
|
||||||
|
|
||||||
|
<td class="px-6 py-4 text-center text-sm border-r border-gray-300">
|
||||||
|
<p class="text-slate-800">Nataly</p>
|
||||||
|
</td>
|
||||||
|
|
||||||
|
<td class="px-6 py-4 text-center text-sm border-r border-gray-300">
|
||||||
|
<p class="text-slate-800">Type</p>
|
||||||
|
</td>
|
||||||
|
|
||||||
|
<td class="px-6 py-4 text-center text-sm border-r border-gray-300">
|
||||||
|
<p class="text-slate-800">222</p>
|
||||||
|
</td>
|
||||||
|
|
||||||
|
|
||||||
|
<td class="px-6 py-4">
|
||||||
|
<div class="flex justify-center items-center gap-3">
|
||||||
|
<a href="">
|
||||||
|
<div class="text-[15px] text-blue-500 cursor-pointer">
|
||||||
|
<i class="fa fa-eye"></i>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<a href="">
|
||||||
|
<div class="text-[15px] text-blue-500 cursor-pointer">
|
||||||
|
<i class="fa fa-edit"></i>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<div class="text-[15px] text-red-500 cursor-pointer" data-modal-url="">
|
||||||
|
<i class="fa fa-trash"></i>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- SERVICES -->
|
||||||
|
<div class="overflow-x-auto border border-gray-300 rounded-md mt-5 hidden" id="servicesContainer">
|
||||||
|
<table class="min-w-full divide-y">
|
||||||
|
<!-- TABLE HEADER -->
|
||||||
|
<thead class="bg-gray-50">
|
||||||
|
<tr>
|
||||||
|
<th scope="col"
|
||||||
|
class="px-6 py-3 text-sm font-medium text-gray-500 uppercase border-r border-gray-300 whitespace-nowrap">
|
||||||
|
Title
|
||||||
|
</th>
|
||||||
|
<th scope="col"
|
||||||
|
class="px-6 py-3 text-sm font-medium text-gray-500 uppercase border-r border-gray-300 whitespace-nowrap">
|
||||||
|
Customer
|
||||||
|
</th>
|
||||||
|
<th scope="col"
|
||||||
|
class="px-6 py-3 text-sm font-medium text-gray-500 uppercase border-r border-gray-300 whitespace-nowrap">
|
||||||
|
Type
|
||||||
|
</th>
|
||||||
|
<th scope="col"
|
||||||
|
class="px-6 py-3 text-sm font-medium text-gray-500 uppercase border-r border-gray-300 whitespace-nowrap">
|
||||||
|
Amount
|
||||||
|
</th>
|
||||||
|
<th scope="col" class="px-6 py-3 text-sm font-medium text-gray-500 uppercase whitespace-nowrap">
|
||||||
|
Actions
|
||||||
|
</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
|
||||||
|
<!-- TABLE BODY -->
|
||||||
|
<tbody class="bg-white divide-y divide-gray-200">
|
||||||
|
<tr>
|
||||||
|
<td class="px-6 py-4 text-center text-sm border-r border-gray-300">
|
||||||
|
<p class="text-slate-800">Item 2</p>
|
||||||
|
</td>
|
||||||
|
|
||||||
|
<td class="px-6 py-4 text-center text-sm border-r border-gray-300">
|
||||||
|
<p class="text-slate-800">Salim</p>
|
||||||
|
</td>
|
||||||
|
|
||||||
|
<td class="px-6 py-4 text-center text-sm border-r border-gray-300">
|
||||||
|
<p class="text-slate-800">Type</p>
|
||||||
|
</td>
|
||||||
|
|
||||||
|
<td class="px-6 py-4 text-center text-sm border-r border-gray-300">
|
||||||
|
<p class="text-slate-800">222</p>
|
||||||
|
</td>
|
||||||
|
|
||||||
|
|
||||||
|
<td class="px-6 py-4">
|
||||||
|
<div class="flex justify-center items-center gap-3">
|
||||||
|
<a href="">
|
||||||
|
<div class="text-[15px] text-blue-500 cursor-pointer">
|
||||||
|
<i class="fa fa-eye"></i>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<a href="">
|
||||||
|
<div class="text-[15px] text-blue-500 cursor-pointer">
|
||||||
|
<i class="fa fa-edit"></i>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<div class="text-[15px] text-red-500 cursor-pointer" data-modal-url="">
|
||||||
|
<i class="fa fa-trash"></i>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<!---------------------- JS SCRIPTS -------------------->
|
||||||
|
<script src="{% static 'js/billing/items.js' %}"></script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
{% endblock %}
|
||||||
@ -0,0 +1,100 @@
|
|||||||
|
|
||||||
|
{% extends "main.html" %}
|
||||||
|
{%load static%}
|
||||||
|
{% block content %}
|
||||||
|
|
||||||
|
<div class="w-full xxlg1:w-[75%]">
|
||||||
|
<div class="w-full h-fit bg-white rounded-md shadow-md p-5">
|
||||||
|
<h1 class="text-secondosiblue text-[30px] font-semibold">Orders</h1>
|
||||||
|
<div
|
||||||
|
class="w-full py-4 px-3 bg-gray-200 rounded-md shadow-md mt-4 flex flex-col s:flex-row justify-between gap-3 items-center">
|
||||||
|
<div class="w-full s:w-fit flex justify-start items-center gap-5">
|
||||||
|
<div class="relative h-fit w-full s:w-fit flex items-center">
|
||||||
|
<input type="text" placeholder="Enter Order"
|
||||||
|
class="py-2 px-3 border border-gray-300 rounded-md outline-none w-full s:w-[300px] h-[40px] relative">
|
||||||
|
<button
|
||||||
|
class="text-gray-500 text-xl outline-none border-none cursor-pointer absolute right-2 bg-white">
|
||||||
|
<i class="fa fa-search"></i>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="w-full s:w-fit">
|
||||||
|
<a href="{% url 'addorder' %}">
|
||||||
|
<button
|
||||||
|
class="w-full s:w-fit text-base px-3 py-2 bg-osiblue text-white outline-none border border-osiblue rounded-md cursor-pointer hover:bg-white hover:text-osiblue duration-300">Add
|
||||||
|
Order</button>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="overflow-x-auto border border-gray-300 rounded-md mt-4">
|
||||||
|
<table class="min-w-full divide-y">
|
||||||
|
<!-- TABLE HEADER -->
|
||||||
|
<thead class="bg-gray-50">
|
||||||
|
<tr>
|
||||||
|
<th scope="col"
|
||||||
|
class="px-6 py-3 text-sm font-medium text-gray-500 uppercase border-r border-gray-300 whitespace-nowrap">
|
||||||
|
Order ID
|
||||||
|
</th>
|
||||||
|
<th scope="col"
|
||||||
|
class="px-6 py-3 text-sm font-medium text-gray-500 uppercase border-r border-gray-300 whitespace-nowrap">
|
||||||
|
Customer
|
||||||
|
</th>
|
||||||
|
<th scope="col"
|
||||||
|
class="px-6 py-3 text-sm font-medium text-gray-500 uppercase border-r border-gray-300 whitespace-nowrap">
|
||||||
|
Due Date
|
||||||
|
</th>
|
||||||
|
<th scope="col"
|
||||||
|
class="px-6 py-3 text-sm font-medium text-gray-500 uppercase border-r border-gray-300 whitespace-nowrap">
|
||||||
|
Status
|
||||||
|
</th>
|
||||||
|
<th scope="col" class="px-6 py-3 text-sm font-medium text-gray-500 uppercase whitespace-nowrap">
|
||||||
|
Actions
|
||||||
|
</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
|
||||||
|
<!-- TABLE BODY -->
|
||||||
|
<tbody class="bg-white divide-y divide-gray-200">
|
||||||
|
<tr>
|
||||||
|
<td class="px-6 py-4 text-center text-sm border-r border-gray-300">
|
||||||
|
<p class="text-slate-800">1</p>
|
||||||
|
</td>
|
||||||
|
|
||||||
|
<td class="px-6 py-4 text-center text-sm border-r border-gray-300">
|
||||||
|
<p class="text-slate-800">Nataly</p>
|
||||||
|
</td>
|
||||||
|
|
||||||
|
<td class="px-6 py-4 text-center text-sm border-r border-gray-300">
|
||||||
|
<p class="text-slate-800">10-2-2014</p>
|
||||||
|
</td>
|
||||||
|
|
||||||
|
<td class="px-6 py-4 text-center text-sm border-r border-gray-300 bg-green-700">
|
||||||
|
<p class="text-white">Paid</p>
|
||||||
|
</td>
|
||||||
|
|
||||||
|
<td class="px-6 py-4">
|
||||||
|
<div class="w-full flex justify-center items-center gap-3">
|
||||||
|
<button class="flex justify-center items-center gap-2 px-3 py-1 rounded-md bg-osiblue text-white border border-osiblue cursor-pointer hover:bg-white hover:text-osiblue duration-300">
|
||||||
|
Generate Invoice
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<a href="">
|
||||||
|
<div class="text-[15px] text-blue-500 cursor-pointer">
|
||||||
|
<i class="fa fa-edit"></i>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<div class="text-[15px] text-red-500 cursor-pointer" data-modal-url="">
|
||||||
|
<i class="fa fa-trash"></i>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
{% endblock %}
|
||||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue