362 lines
16 KiB
PHP
362 lines
16 KiB
PHP
<?php
|
|
session_start();
|
|
require '../config.php';
|
|
require '../include_header.php';
|
|
?>
|
|
|
|
<body>
|
|
<?php require '../include_topbar.php'; ?>
|
|
<?php require '../include_sidebar.php'; ?>
|
|
|
|
<main id="content" class="content py-15">
|
|
<div class="container-fluid">
|
|
|
|
<div class="row mb-6">
|
|
<div class="col-12">
|
|
<div class="d-flex justify-content-between align-items-center">
|
|
<div>
|
|
<h1 class="fs-3 mb-1">Purchase Invoices</h1>
|
|
<p class="mb-0 text-muted">Supplier invoices and supplier credit notes</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row g-5 mb-5">
|
|
<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-primary bg-opacity-10 text-primary rounded-2">
|
|
<i class="ti ti-file-invoice fs-4"></i>
|
|
</div>
|
|
<div>
|
|
<p class="mb-0 text-muted small">Total</p>
|
|
<h3 class="fw-bold mb-0" id="stat_total">—</h3>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<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-warning bg-opacity-10 text-warning rounded-2">
|
|
<i class="ti ti-pencil fs-4"></i>
|
|
</div>
|
|
<div>
|
|
<p class="mb-0 text-muted small">Draft</p>
|
|
<h3 class="fw-bold mb-0" id="stat_draft">—</h3>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<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-info bg-opacity-10 text-info rounded-2">
|
|
<i class="ti ti-send fs-4"></i>
|
|
</div>
|
|
<div>
|
|
<p class="mb-0 text-muted small">Issued</p>
|
|
<h3 class="fw-bold mb-0" id="stat_issued">—</h3>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<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-danger bg-opacity-10 text-danger rounded-2">
|
|
<i class="ti ti-clock fs-4"></i>
|
|
</div>
|
|
<div>
|
|
<p class="mb-0 text-muted small">Overdue</p>
|
|
<h3 class="fw-bold mb-0" id="stat_overdue">—</h3>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row g-5">
|
|
<div class="col-12">
|
|
<div class="card">
|
|
<div class="card-body p-4">
|
|
<div class="row g-3 align-items-end">
|
|
<div class="col-lg-4">
|
|
<div class="position-relative">
|
|
<input type="text" id="search_input" class="form-control ps-9"
|
|
placeholder="Search invoice number, PO, or supplier...">
|
|
<span class="position-absolute top-25 ms-4">
|
|
<i class="ti ti-search text-muted"></i>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-2">
|
|
<select id="filter_type" class="form-select">
|
|
<option value="">All Types</option>
|
|
<option value="purchase_invoice">Purchase Invoice</option>
|
|
<option value="supplier_credit_note">Supplier Credit Note</option>
|
|
</select>
|
|
</div>
|
|
<div class="col-lg-2">
|
|
<select id="filter_status" class="form-select">
|
|
<option value="">All Status</option>
|
|
<option value="0">Draft</option>
|
|
<option value="1">Issued</option>
|
|
<option value="2">Paid</option>
|
|
<option value="4">Void</option>
|
|
</select>
|
|
</div>
|
|
<div class="col-lg-2">
|
|
<select id="filter_dept" class="form-select">
|
|
<option value="">All Departments</option>
|
|
</select>
|
|
</div>
|
|
<div class="col-lg-2">
|
|
<button class="btn btn-secondary w-100" onclick="retrieve_invoices()">
|
|
<i class="ti ti-search me-1"></i>Search
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-12">
|
|
<div class="card">
|
|
<div class="card-body p-5">
|
|
<div class="table-responsive">
|
|
<table class="table table-hover mb-0 table-centered" id="invoice_list">
|
|
<thead class="table-primary border-light">
|
|
<tr>
|
|
<th>Invoice #</th>
|
|
<th>Type</th>
|
|
<th>Source</th>
|
|
<th>Date</th>
|
|
<th>Supplier</th>
|
|
<th>Department</th>
|
|
<th>Grand Total</th>
|
|
<th>Due Date</th>
|
|
<th>Status</th>
|
|
<th>Action</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody></tbody>
|
|
<tfoot></tfoot>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</main>
|
|
|
|
<?php require '../include_ending.php'; ?>
|
|
|
|
<script>
|
|
|
|
const can_delete = ['admin', 'owner'].includes(user_role);
|
|
|
|
function doc_type_badge(doc_type) {
|
|
const map = {
|
|
'purchase_invoice': '<span class="badge bg-primary">Purchase Invoice</span>',
|
|
'supplier_credit_note': '<span class="badge bg-info text-white">Supplier Credit Note</span>',
|
|
};
|
|
return map[doc_type] ?? '—';
|
|
}
|
|
|
|
function invoice_status_badge(status, due_date) {
|
|
if (String(status) === '1' && due_date) {
|
|
var today = new Date().toISOString().slice(0, 10);
|
|
if (due_date < today) return '<span class="badge bg-danger">Overdue</span>';
|
|
}
|
|
const map = {
|
|
'0': '<span class="badge bg-secondary">Draft</span>',
|
|
'1': '<span class="badge bg-info text-white">Issued</span>',
|
|
'2': '<span class="badge bg-success">Paid</span>',
|
|
'4': '<span class="badge bg-light text-dark">Void</span>',
|
|
};
|
|
return map[String(status)] ?? '—';
|
|
}
|
|
|
|
function retrieve_invoices() {
|
|
return ajax_request({
|
|
url: '<?php echo $server_url?>order/api/engine/retrieve_invoice.php',
|
|
autoPrepare: true,
|
|
checkRequired: 0,
|
|
action: 'read',
|
|
data: { doc_type_group: 'purchase' },
|
|
onSuccess: function(res) {
|
|
var all = (res.output || []).filter(function(inv) {
|
|
return inv.doc_type === 'purchase_invoice' || inv.doc_type === 'supplier_credit_note';
|
|
});
|
|
|
|
var keyword = $('#search_input').val().toLowerCase();
|
|
var fil_type = $('#filter_type').val();
|
|
var fil_status = $('#filter_status').val();
|
|
var fil_dept = $('#filter_dept').val();
|
|
var today = new Date().toISOString().slice(0, 10);
|
|
|
|
var data = all.filter(function(inv) {
|
|
var match_kw = !keyword ||
|
|
(inv.invoice_number || '').toLowerCase().includes(keyword) ||
|
|
(inv.contact_name || '').toLowerCase().includes(keyword);
|
|
var match_type = !fil_type || inv.doc_type === fil_type;
|
|
var match_st = !fil_status || String(inv.status) === fil_status;
|
|
var match_dept = !fil_dept || String(inv.department_id) === fil_dept;
|
|
return match_kw && match_type && match_st && match_dept;
|
|
});
|
|
|
|
$('#stat_total').text(format_number(all.length));
|
|
$('#stat_draft').text(format_number(all.filter(i => String(i.status) === '0').length));
|
|
$('#stat_issued').text(format_number(all.filter(i => String(i.status) === '1').length));
|
|
$('#stat_overdue').text(format_number(all.filter(i =>
|
|
String(i.status) === '1' && i.due_date && i.due_date < today
|
|
).length));
|
|
|
|
alasql('CREATE TABLE IF NOT EXISTS invoice_list');
|
|
alasql.tables.invoice_list.data = data;
|
|
$('table#invoice_list tfoot').html(generate_pagination('invoice_list', data.length));
|
|
change_page_invoice_list(1);
|
|
}
|
|
});
|
|
}
|
|
|
|
function change_page_invoice_list(page_num) {
|
|
var offset = (page_num - 1) * prop_limit;
|
|
var rows = alasql(`SELECT * FROM invoice_list LIMIT ${prop_limit} OFFSET ${offset}`);
|
|
var body = '';
|
|
|
|
if (!rows.length) {
|
|
$('table#invoice_list tbody').html(
|
|
'<tr><td colspan="9" class="text-center py-5 text-muted">No purchase invoices found.</td></tr>'
|
|
);
|
|
return;
|
|
}
|
|
|
|
$.each(rows, function(i, inv) {
|
|
var source_label = '';
|
|
if (inv.source === 'po' && inv.source_id) {
|
|
source_label = `<a href="<?php echo $server_url?>po/manage_po.php?id=${inv.source_id}">PO #${inv.source_id}</a>`;
|
|
} else if (inv.source === 'supplier_return' && inv.source_id) {
|
|
source_label = `<a href="<?php echo $server_url?>po/manage_supplier_return.php?id=${inv.source_id}">SRN #${inv.source_id}</a>`;
|
|
} else {
|
|
source_label = '<span class="text-muted">—</span>';
|
|
}
|
|
|
|
body += `<tr>
|
|
<td class="py-3 fw-semibold">${escape_html(inv.invoice_number || '')}</td>
|
|
<td class="py-3">${doc_type_badge(inv.doc_type)}</td>
|
|
<td class="py-3">${source_label}</td>
|
|
<td class="py-3">${format_date(inv.issued_date)}</td>
|
|
<td class="py-3">${escape_html(inv.contact_name || '—')}</td>
|
|
<td class="py-3">${get_dept_label(inv.department_id)}</td>
|
|
<td class="py-3 fw-semibold">${format_number(inv.grand_total, 2)}</td>
|
|
<td class="py-3">${inv.due_date ? format_date(inv.due_date) : '<span class="text-muted">—</span>'}</td>
|
|
<td class="py-3">${invoice_status_badge(inv.status, inv.due_date)}</td>
|
|
<td class="py-3 text-nowrap">
|
|
<a href="<?php echo $server_url?>po/manage_purchase_invoice.php?id=${inv.id}" title="View" class="me-2">
|
|
<i class="ti ti-eye fs-5"></i>
|
|
</a>
|
|
<a href="javascript:;" title="View GL Entry" class="me-2" onclick="show_gl_modal('${inv.doc_type}',${inv.id})">
|
|
<i class="ti ti-book fs-5 text-secondary"></i>
|
|
</a>
|
|
${can_delete ? `<a href="javascript:void(0);" class="link-danger" title="Delete" onclick="delete_invoice(${inv.id})"><i class="ti ti-trash fs-5"></i></a>` : ''}
|
|
</td>
|
|
</tr>`;
|
|
});
|
|
|
|
$('table#invoice_list tbody').html(body);
|
|
}
|
|
|
|
function delete_invoice(id) {
|
|
bootbox.confirm({
|
|
message: 'Delete this document? Any GL entry will be removed.',
|
|
buttons: { confirm: { label: 'Delete', className: 'btn-danger' }, cancel: { label: 'Back', className: 'btn-secondary' } },
|
|
callback: function(result) {
|
|
if (!result) return;
|
|
ajax_request({
|
|
url: '<?php echo $server_url?>order/api/engine/delete_invoice.php',
|
|
autoPrepare: false,
|
|
checkRequired: 0,
|
|
action: 'delete',
|
|
data: { id: id },
|
|
onSuccess: function() { retrieve_invoices(); }
|
|
});
|
|
}
|
|
});
|
|
}
|
|
|
|
var _GL_SOURCE_LABELS = { invoice:'Invoice', credit_note:'Credit Note', purchase_invoice:'Purchase Invoice', supplier_credit_note:'Supplier Credit Note', receipt:'Receipt', payment:'Payment', manual:'Manual', reversal:'Reversal' };
|
|
var _GL_SOURCE_BADGE = { invoice:'bg-success-subtle text-success', credit_note:'bg-warning-subtle text-warning', purchase_invoice:'bg-primary-subtle text-primary', supplier_credit_note:'bg-secondary-subtle text-secondary', receipt:'bg-info-subtle text-info', payment:'bg-danger-subtle text-danger', manual:'bg-dark-subtle text-dark', reversal:'bg-danger-subtle text-danger' };
|
|
function _gl_source_badge(t) { return '<span class="badge ' + (_GL_SOURCE_BADGE[t]||'bg-light text-dark') + '">' + (_GL_SOURCE_LABELS[t]||t) + '</span>'; }
|
|
|
|
function show_gl_modal(doc_type, source_id) {
|
|
$('#gl-modal-body').html('<div class="text-center text-muted py-4"><i class="ti ti-loader ti-spin me-1"></i>Loading…</div>');
|
|
$('#glModal').modal('show');
|
|
ajax_request({
|
|
url: server_url + 'accounting/api/engine/get_gl_by_source.php',
|
|
autoPrepare: true, checkRequired: 0, noLoading: true, action: 'read',
|
|
data: { doc_type: doc_type, source_id: source_id },
|
|
onSuccess: function(res) {
|
|
if (!res.output) { $('#gl-modal-body').html('<p class="text-muted text-center py-4">No GL entry posted for this document.</p>'); return; }
|
|
var h = res.output.header, lines = res.output.lines || [];
|
|
var total_debit = 0, total_credit = 0, lines_html = '';
|
|
$.each(lines, function(i, l) {
|
|
total_debit += parseFloat(l.debit) || 0;
|
|
total_credit += parseFloat(l.credit) || 0;
|
|
var dept = l.dept_code ? escape_html(l.dept_code + (l.dept_name ? ' - ' + l.dept_name : '')) : '<span class="text-muted">—</span>';
|
|
lines_html += '<tr><td class="fw-semibold">' + escape_html(l.account_code) + '</td><td>' + escape_html(l.account_name) + '</td><td>' + dept + '</td>' +
|
|
'<td class="text-end">' + (parseFloat(l.debit) ? format_number(l.debit, 2) : '<span class="text-muted">—</span>') + '</td>' +
|
|
'<td class="text-end">' + (parseFloat(l.credit) ? format_number(l.credit, 2) : '<span class="text-muted">—</span>') + '</td>' +
|
|
'<td class="text-muted small">' + escape_html(l.description || '—') + '</td></tr>';
|
|
});
|
|
lines_html += '<tr class="table-light fw-semibold"><td colspan="3">Total</td><td class="text-end">' + format_number(total_debit, 2) + '</td><td class="text-end">' + format_number(total_credit, 2) + '</td><td></td></tr>';
|
|
var balanced = Math.abs(total_debit - total_credit) < 0.01;
|
|
var bal_badge = balanced ? '<span class="badge bg-success-subtle text-success ms-2">Balanced</span>' : '<span class="badge bg-danger-subtle text-danger ms-2">Unbalanced</span>';
|
|
$('#gl-modal-body').html(
|
|
'<div class="row g-3 mb-4 text-sm">' +
|
|
'<div class="col-sm-4"><div class="text-muted small">Source</div><div>' + _gl_source_badge(h.source_type) + '</div></div>' +
|
|
'<div class="col-sm-4"><div class="text-muted small">Period</div><div class="fw-semibold">' + escape_html(h.period) + '</div></div>' +
|
|
'<div class="col-sm-4"><div class="text-muted small">Formula</div><div>' + escape_html(h.formula_name || '—') + '</div></div>' +
|
|
'<div class="col-sm-4"><div class="text-muted small">Posted At</div><div class="text-muted small">' + escape_html(h.posted_at) + '</div></div>' +
|
|
'<div class="col-sm-4"><div class="text-muted small">Updated At</div><div class="text-muted small">' + escape_html(h.updated_at_fmt) + '</div></div>' +
|
|
'</div><div class="d-flex align-items-center mb-2"><span class="fw-semibold">Journal Lines</span>' + bal_badge + '</div>' +
|
|
'<table class="table table-sm table-hover mb-0 table-centered"><thead class="table-light"><tr><th>Account Code</th><th>Account Name</th><th>Department</th><th class="text-end">Debit</th><th class="text-end">Credit</th><th>Description</th></tr></thead><tbody>' + lines_html + '</tbody></table>'
|
|
);
|
|
}
|
|
});
|
|
}
|
|
|
|
$(async function() {
|
|
await load_dept_cache();
|
|
populate_dept_filter('filter_dept');
|
|
retrieve_invoices();
|
|
$('#search_input').on('keyup', function(e) {
|
|
if (e.key === 'Enter') retrieve_invoices();
|
|
});
|
|
$('#filter_type, #filter_status, #filter_dept').on('change', retrieve_invoices);
|
|
});
|
|
</script>
|
|
|
|
<!-- GL Entry Modal -->
|
|
<div class="modal fade" id="glModal" tabindex="-1">
|
|
<div class="modal-dialog modal-lg modal-dialog-scrollable">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title"><i class="ti ti-book me-2"></i>GL Entry</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
|
</div>
|
|
<div class="modal-body" id="gl-modal-body"></div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-secondary btn-sm" data-bs-dismiss="modal">Close</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</body>
|
|
</html>
|