accounting workflows
This commit is contained in:
Thanakorn S
+27
-35
@@ -72,11 +72,11 @@
|
||||
<div class="col-lg-3 col-sm-6 col-12">
|
||||
<div class="card p-4">
|
||||
<div class="d-flex align-items-center gap-3">
|
||||
<div class="icon-shape icon-md bg-success bg-opacity-10 text-success rounded-2">
|
||||
<i class="ti ti-circle-check fs-4"></i>
|
||||
<div class="icon-shape icon-md bg-secondary bg-opacity-10 text-secondary rounded-2">
|
||||
<i class="ti ti-x fs-4"></i>
|
||||
</div>
|
||||
<div>
|
||||
<p class="mb-0 text-muted small">Completed</p>
|
||||
<p class="mb-0 text-muted small">Cancelled</p>
|
||||
<h3 class="fw-bold mb-0" id="stat_completed">—</h3>
|
||||
</div>
|
||||
</div>
|
||||
@@ -92,32 +92,27 @@
|
||||
<div class="card">
|
||||
<div class="card-body p-4">
|
||||
<div class="row g-3 align-items-end">
|
||||
<div class="col-lg-5">
|
||||
<div class="col-lg-4">
|
||||
<div class="position-relative">
|
||||
<input type="text" id="search_input" class="form-control ps-9"
|
||||
placeholder="Search order number, contact, or tracking...">
|
||||
placeholder="Search order number, source, contact, or tracking...">
|
||||
<span class="position-absolute top-25 ms-4">
|
||||
<i class="ti ti-search text-muted"></i>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-3">
|
||||
<div class="col-lg-2">
|
||||
<select id="filter_status" class="form-select">
|
||||
<option value="">All Status</option>
|
||||
<option value="-2">Pending</option>
|
||||
<option value="-1">Cancelled</option>
|
||||
<option value="0">Draft</option>
|
||||
<option value="1">Confirmed</option>
|
||||
<option value="2">Processing</option>
|
||||
<option value="3">Completed</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-lg-2">
|
||||
<select id="filter_payment" class="form-select">
|
||||
<option value="">All Payment</option>
|
||||
<option value="0">Unpaid</option>
|
||||
<option value="1">Paid</option>
|
||||
<option value="2">Partial</option>
|
||||
<select id="filter_dept" class="form-select">
|
||||
<option value="">All Departments</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-lg-2">
|
||||
@@ -139,14 +134,15 @@
|
||||
<thead class="table-primary border-light">
|
||||
<tr>
|
||||
<th class="py-3">Order #</th>
|
||||
<th class="py-3">Source</th>
|
||||
<th class="py-3">Date</th>
|
||||
<th class="py-3">Contact</th>
|
||||
<th class="py-3">Department</th>
|
||||
<th class="py-3">Items</th>
|
||||
<th class="py-3">Grand Total</th>
|
||||
<th class="py-3">Status</th>
|
||||
<th class="py-3">Fulfillment</th>
|
||||
<th class="py-3">Tracking #</th>
|
||||
<th class="py-3">Payment</th>
|
||||
<th class="py-3">Action</th>
|
||||
</tr>
|
||||
</thead>
|
||||
@@ -170,26 +166,14 @@
|
||||
function order_status_badge(status) {
|
||||
status = parseInt(status);
|
||||
const map = {
|
||||
'-2': '<span class="badge bg-danger">Pending</span>',
|
||||
'-2': '<span class="badge bg-danger">Pending Warehouse</span>',
|
||||
'-1': '<span class="badge bg-secondary">Cancelled</span>',
|
||||
'0': '<span class="badge bg-warning text-dark">Draft</span>',
|
||||
'1': '<span class="badge bg-info text-white">Confirmed</span>',
|
||||
'2': '<span class="badge bg-primary">Processing</span>',
|
||||
'3': '<span class="badge bg-success">Completed</span>',
|
||||
};
|
||||
return map[String(status)] ?? '<span class="badge bg-light text-dark">—</span>';
|
||||
}
|
||||
|
||||
function payment_status_badge(status) {
|
||||
status = parseInt(status);
|
||||
const map = {
|
||||
'0': '<span class="badge bg-warning text-dark">Unpaid</span>',
|
||||
'1': '<span class="badge bg-success">Paid</span>',
|
||||
'2': '<span class="badge bg-info text-white">Partial</span>',
|
||||
};
|
||||
return map[status] ?? '<span class="badge bg-light text-dark">—</span>';
|
||||
}
|
||||
|
||||
function fulfillment_status_badge(status) {
|
||||
const map = {
|
||||
'1': '<span class="badge bg-warning text-dark"><i class="ti ti-list-check me-1"></i>Picking</span>',
|
||||
@@ -214,23 +198,24 @@
|
||||
// Client-side filter
|
||||
var keyword = $('#search_input').val().toLowerCase();
|
||||
var fil_status = $('#filter_status').val();
|
||||
var fil_payment = $('#filter_payment').val();
|
||||
var fil_dept = $('#filter_dept').val();
|
||||
|
||||
var data = all.filter(function(o) {
|
||||
var match_kw = !keyword ||
|
||||
(o.order_number || '').toLowerCase().includes(keyword) ||
|
||||
(o.source || 'direct').toLowerCase().includes(keyword) ||
|
||||
(o.contact_name || '').toLowerCase().includes(keyword) ||
|
||||
(o.shipping_tracking_number || '').toLowerCase().includes(keyword);
|
||||
var match_st = fil_status === '' || String(o.status) === fil_status;
|
||||
var match_pm = fil_payment === '' || String(o.payment_status) === fil_payment;
|
||||
return match_kw && match_st && match_pm;
|
||||
var match_st = fil_status === '' || String(o.status) === fil_status;
|
||||
var match_dept = !fil_dept || String(o.department_id) === fil_dept;
|
||||
return match_kw && match_st && match_dept;
|
||||
});
|
||||
|
||||
// Stat cards
|
||||
$('#stat_total').text(format_number(all.length));
|
||||
$('#stat_draft').text(format_number(all.filter(o => parseInt(o.status) === 0).length));
|
||||
$('#stat_confirmed').text(format_number(all.filter(o => parseInt(o.status) === 1).length));
|
||||
$('#stat_completed').text(format_number(all.filter(o => parseInt(o.status) === 3).length));
|
||||
$('#stat_completed').text(format_number(all.filter(o => parseInt(o.status) === -1).length));
|
||||
|
||||
// Pagination via alasql
|
||||
alasql('CREATE TABLE IF NOT EXISTS order_list');
|
||||
@@ -261,18 +246,23 @@
|
||||
|
||||
body += `<tr>
|
||||
<td class="py-3 fw-semibold">${o.order_number}</td>
|
||||
<td class="py-3">${o.source ? escape_html(o.source) : 'direct'}</td>
|
||||
<td class="py-3">${format_date(o.order_date)}</td>
|
||||
<td class="py-3">${o.contact_name || '<span class="text-muted">—</span>'}</td>
|
||||
<td class="py-3">${get_dept_label(o.department_id)}</td>
|
||||
<td class="py-3">${item_count} item${item_count !== 1 ? 's' : ''}</td>
|
||||
<td class="py-3 fw-semibold">${format_number(o.grand_total, 2)}</td>
|
||||
<td class="py-3">${order_status_badge(o.status)}</td>
|
||||
<td class="py-3">${fulfillment_status_badge(o.fulfillment_status)}</td>
|
||||
<td class="py-3">${o.shipping_tracking_number || '<span class="text-muted">—</span>'}</td>
|
||||
<td class="py-3">${payment_status_badge(o.payment_status)}</td>
|
||||
<td class="py-3">
|
||||
<a href="<?php echo $server_url?>order/manage_order.php?id=${o.id}" title="View">
|
||||
<i class="ti ti-eye fs-5"></i>
|
||||
</a>
|
||||
<a href="javascript:void(0);" class="ms-2 text-secondary" title="Stock"
|
||||
onclick="show_stock_rows('order', ${o.id}, '${escape_html(o.order_number || '')}')">
|
||||
<i class="ti ti-packages fs-5"></i>
|
||||
</a>
|
||||
${can_cancel ? `
|
||||
<a href="javascript:void(0);" class="link-danger ms-2" title="Cancel"
|
||||
onclick="cancel_order(${o.id})">
|
||||
@@ -312,12 +302,14 @@
|
||||
|
||||
|
||||
// ── Boot ─────────────────────────────────────────────────────────────────
|
||||
$(function() {
|
||||
$(async function() {
|
||||
await load_dept_cache();
|
||||
populate_dept_filter('filter_dept');
|
||||
retrieve_orders();
|
||||
|
||||
$('#search_input').on('keyup', function(e) {
|
||||
if (e.key === 'Enter') retrieve_orders();
|
||||
});
|
||||
$('#filter_status, #filter_dept').on('change', retrieve_orders);
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user