5075 lines
343 KiB
HTML
5075 lines
343 KiB
HTML
<!doctype html>
|
|
<html lang="ar" dir="rtl">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
<title>المحاسبة - Admin Panel</title>
|
|
<meta name="description" content="Bilingual Accounting System: Streamline Sales, Purchases, and HR with a Robust Admin Panel for Single Companies." />
|
|
<link rel="icon" href="uploads/favicon.png?v=1773772535">
|
|
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.rtl.min.css" rel="stylesheet">
|
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.0/font/bootstrap-icons.css">
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
|
|
<link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
|
|
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
|
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
|
|
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
|
|
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
|
|
<script src="https://cdn.jsdelivr.net/npm/jsbarcode@3.11.5/dist/JsBarcode.all.min.js"></script>
|
|
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
|
|
<script src="assets/js/main.js?v=1773772535"></script>
|
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap" rel="stylesheet">
|
|
<link rel="stylesheet" href="assets/css/custom.css?v=1773772535">
|
|
<style>
|
|
/* Force RTL Sidebar Position */
|
|
[dir="rtl"] .sidebar {
|
|
right: 0 !important;
|
|
left: auto !important;
|
|
}
|
|
[dir="rtl"] .main-content {
|
|
margin-left: 0 !important;
|
|
margin-right: 210px !important;
|
|
}
|
|
@media (max-width: 1199.98px) {
|
|
[dir="rtl"] .sidebar {
|
|
right: -210px !important;
|
|
left: auto !important;
|
|
}
|
|
[dir="rtl"] .sidebar.show {
|
|
right: 0 !important;
|
|
left: auto !important;
|
|
}
|
|
[dir="rtl"] .main-content {
|
|
margin-right: 0 !important;
|
|
margin-left: 0 !important;
|
|
}
|
|
.pos-container {
|
|
flex-direction: column !important;
|
|
height: auto !important;
|
|
}
|
|
.pos-cart {
|
|
width: 100% !important;
|
|
height: auto !important;
|
|
position: sticky;
|
|
bottom: 0;
|
|
z-index: 1001;
|
|
}
|
|
.pos-products {
|
|
height: auto !important;
|
|
max-height: 500px;
|
|
}
|
|
}
|
|
|
|
/* General Responsive Helpers */
|
|
@media (max-width: 767.98px) {
|
|
.table:not(.table-borderless):not(.table-sm) {
|
|
display: block;
|
|
width: 100%;
|
|
overflow-x: auto;
|
|
-webkit-overflow-scrolling: touch;
|
|
}
|
|
.card {
|
|
padding: 1rem !important;
|
|
}
|
|
.topbar {
|
|
padding: 0.75rem 1rem !important;
|
|
margin: -1rem -1rem 1rem -1rem !important;
|
|
}
|
|
.main-content {
|
|
padding: 1rem !important;
|
|
}
|
|
.h4, h4 {
|
|
font-size: 1.1rem;
|
|
}
|
|
.btn-sm-square {
|
|
width: 32px;
|
|
height: 32px;
|
|
padding: 0;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
.topbar {
|
|
flex-wrap: wrap;
|
|
gap: 10px;
|
|
position: sticky;
|
|
top: 0;
|
|
z-index: 990;
|
|
}
|
|
.topbar h4 {
|
|
width: 100%;
|
|
order: 2;
|
|
font-size: 1.1rem;
|
|
margin-top: 5px !important;
|
|
}
|
|
.topbar > div:first-child {
|
|
order: 1;
|
|
}
|
|
.topbar > div:last-child {
|
|
order: 3;
|
|
width: 100%;
|
|
justify-content: space-between;
|
|
border-top: 1px solid var(--border);
|
|
padding-top: 5px;
|
|
}
|
|
.topbar .btn span {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
@media print {
|
|
.sidebar, .topbar, .d-print-none, .no-print, .btn-group, .btn, .badge i { display: none !important; }
|
|
.main-content { margin: 0 !important; padding: 0 !important; background: white !important; width: 100% !important; }
|
|
.card { border: none !important; box-shadow: none !important; padding: 0 !important; margin: 0 !important; }
|
|
.table { border-collapse: collapse !important; width: 100% !important; margin-top: 20px !important; }
|
|
.table th, .table td { border: 1px solid #000 !important; padding: 8px !important; font-size: 11px !important; color: #000 !important; }
|
|
.table thead th { background-color: #eee !important; color: #000 !important; font-weight: bold !important; text-transform: uppercase; }
|
|
.print-only { display: block !important; }
|
|
.text-success, .text-danger, .text-primary, .text-warning { color: #000 !important; }
|
|
.badge { border: none !important; padding: 0 !important; color: #000 !important; background: transparent !important; font-weight: normal !important; }
|
|
body { font-size: 12px !important; color: #000 !important; background: #fff !important; }
|
|
@page { margin: 1cm; }
|
|
}
|
|
.print-only { display: none; }
|
|
[dir="rtl"] { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; }
|
|
</style>
|
|
</head>
|
|
<body class="theme-default">
|
|
|
|
|
|
<div class="sidebar">
|
|
<div class="sidebar-header">
|
|
<div class="text-primary fw-bold">Accounting</div>
|
|
<div class="text-muted small" style="font-size: 0.7rem;">System v1.2.5</div>
|
|
</div>
|
|
<nav class="mt-4">
|
|
<!-- General Section -->
|
|
<a href="index.php?page=dashboard" class="nav-link ">
|
|
<i class="fas fa-chart-pie"></i> <span>لوحة القيادة</span>
|
|
</a>
|
|
|
|
<!-- POS Section -->
|
|
<a href="index.php?page=pos" class="nav-link ">
|
|
<i class="fas fa-cash-register"></i> <span>نقطة البيع</span>
|
|
</a>
|
|
|
|
<!-- Inventory Section -->
|
|
<div class="nav-section-title px-4 mt-3 mb-1 text-uppercase text-muted collapsed" data-bs-toggle="collapse" data-bs-target="#stock-collapse">
|
|
<span><i class="fas fa-boxes-stacked group-icon"></i><span>المخزون</span></span>
|
|
<i class="fas fa-chevron-down chevron"></i>
|
|
</div>
|
|
<div class="collapse " id="stock-collapse">
|
|
<a href="index.php?page=items" class="nav-link ">
|
|
<i class="fas fa-box"></i> <span>الأصناف</span>
|
|
</a>
|
|
<a href="index.php?page=categories" class="nav-link ">
|
|
<i class="fas fa-tags"></i> <span>الفئات</span>
|
|
</a>
|
|
<a href="index.php?page=units" class="nav-link ">
|
|
<i class="fas fa-ruler-combined"></i> <span>الوحدات</span>
|
|
</a>
|
|
</div>
|
|
|
|
<!-- Customers Section -->
|
|
<div class="nav-section-title px-4 mt-3 mb-1 text-uppercase text-muted collapsed" data-bs-toggle="collapse" data-bs-target="#customers-collapse">
|
|
<span><i class="fas fa-users group-icon"></i><span>العملاء</span></span>
|
|
<i class="fas fa-chevron-down chevron"></i>
|
|
</div>
|
|
<div class="collapse " id="customers-collapse">
|
|
<a href="index.php?page=customers" class="nav-link ">
|
|
<i class="fas fa-users"></i> <span>العملاء</span>
|
|
</a>
|
|
</div>
|
|
|
|
<!-- Suppliers Section -->
|
|
<div class="nav-section-title px-4 mt-3 mb-1 text-uppercase text-muted collapsed" data-bs-toggle="collapse" data-bs-target="#suppliers-collapse">
|
|
<span><i class="fas fa-truck-field group-icon"></i><span>الموردين</span></span>
|
|
<i class="fas fa-chevron-down chevron"></i>
|
|
</div>
|
|
<div class="collapse " id="suppliers-collapse">
|
|
<a href="index.php?page=suppliers" class="nav-link ">
|
|
<i class="fas fa-truck-field"></i> <span>الموردين</span>
|
|
</a>
|
|
</div>
|
|
|
|
<!-- Sales Section -->
|
|
<div class="nav-section-title px-4 mt-3 mb-1 text-uppercase text-muted collapsed" data-bs-toggle="collapse" data-bs-target="#sales-collapse">
|
|
<span><i class="fas fa-file-invoice-dollar group-icon"></i><span>المبيعات</span></span>
|
|
<i class="fas fa-chevron-down chevron"></i>
|
|
</div>
|
|
<div class="collapse " id="sales-collapse">
|
|
<a href="index.php?page=sales" class="nav-link ">
|
|
<i class="fas fa-file-invoice-dollar"></i> <span>المبيعات</span>
|
|
</a>
|
|
<a href="index.php?page=sales_returns" class="nav-link ">
|
|
<i class="fas fa-reply"></i> <span>مرتجعات المبيعات</span>
|
|
</a>
|
|
<a href="index.php?page=quotations" class="nav-link ">
|
|
<i class="fas fa-file-lines"></i> <span>عروض الأسعار</span>
|
|
</a>
|
|
</div>
|
|
|
|
<!-- Purchases Section -->
|
|
<div class="nav-section-title px-4 mt-3 mb-1 text-uppercase text-muted collapsed" data-bs-toggle="collapse" data-bs-target="#purchases-collapse">
|
|
<span><i class="fas fa-cart-shopping group-icon"></i><span>المشتريات</span></span>
|
|
<i class="fas fa-chevron-down chevron"></i>
|
|
</div>
|
|
<div class="collapse " id="purchases-collapse">
|
|
<a href="index.php?page=purchases" class="nav-link ">
|
|
<i class="fas fa-cart-shopping"></i> <span>المشتريات</span>
|
|
</a>
|
|
<a href="index.php?page=lpos" class="nav-link ">
|
|
<i class="fas fa-file-contract"></i> <span>أوامر الشراء المحلية (LPO)</span>
|
|
</a>
|
|
<a href="index.php?page=purchase_returns" class="nav-link ">
|
|
<i class="fas fa-share"></i> <span>مرتجعات المشتريات</span>
|
|
</a>
|
|
</div>
|
|
|
|
<!-- Expenses Section -->
|
|
<div class="nav-section-title px-4 mt-3 mb-1 text-uppercase text-muted collapsed" data-bs-toggle="collapse" data-bs-target="#expenses-collapse">
|
|
<span><i class="fas fa-wallet group-icon"></i><span>المصاريف</span></span>
|
|
<i class="fas fa-chevron-down chevron"></i>
|
|
</div>
|
|
<div class="collapse " id="expenses-collapse">
|
|
<a href="index.php?page=expense_categories" class="nav-link ">
|
|
<i class="fas fa-layer-group"></i> <span>فئات المصاريف</span>
|
|
</a>
|
|
<a href="index.php?page=expenses" class="nav-link ">
|
|
<i class="fas fa-file-invoice"></i> <span>المصاريف</span>
|
|
</a>
|
|
</div>
|
|
|
|
<!-- Accounting Section -->
|
|
<div class="nav-section-title px-4 mt-3 mb-1 text-uppercase text-muted collapsed" data-bs-toggle="collapse" data-bs-target="#accounting-collapse">
|
|
<span><i class="fas fa-calculator group-icon"></i><span>المحاسبة</span></span>
|
|
<i class="fas fa-chevron-down chevron"></i>
|
|
</div>
|
|
<div class="collapse " id="accounting-collapse">
|
|
<a href="index.php?page=accounting" class="nav-link active">
|
|
<i class="fas fa-book-open"></i> <span>المحاسبة</span>
|
|
</a>
|
|
<a href="index.php?page=accounting&view=trial_balance" class="nav-link ">
|
|
<i class="fas fa-scale-balanced"></i> <span>ميزان المراجعة</span>
|
|
</a>
|
|
<a href="index.php?page=accounting&view=profit_loss" class="nav-link ">
|
|
<i class="fas fa-chart-column"></i> <span>الأرباح والخسائر</span>
|
|
</a>
|
|
<a href="index.php?page=accounting&view=balance_sheet" class="nav-link ">
|
|
<i class="fas fa-file-contract"></i> <span>الميزانية العمومية</span>
|
|
</a>
|
|
<a href="index.php?page=accounting&view=vat_report" class="nav-link ">
|
|
<i class="fas fa-receipt"></i> <span>تقرير ضريبة القيمة المضافة</span>
|
|
</a>
|
|
</div>
|
|
|
|
<!-- HR Section -->
|
|
<div class="nav-section-title px-4 mt-3 mb-1 text-uppercase text-muted collapsed" data-bs-toggle="collapse" data-bs-target="#hr-collapse">
|
|
<span><i class="fas fa-user-tie group-icon"></i><span>الموارد البشرية</span></span>
|
|
<i class="fas fa-chevron-down chevron"></i>
|
|
</div>
|
|
<div class="collapse " id="hr-collapse">
|
|
<a href="index.php?page=hr_departments" class="nav-link ">
|
|
<i class="fas fa-building-user"></i> <span>الأقسام</span>
|
|
</a>
|
|
<a href="index.php?page=hr_employees" class="nav-link ">
|
|
<i class="fas fa-user-badge"></i> <span>الموظفين</span>
|
|
</a>
|
|
<a href="index.php?page=hr_attendance" class="nav-link ">
|
|
<i class="fas fa-user-check"></i> <span>الحضور</span>
|
|
</a>
|
|
<a href="index.php?page=hr_payroll" class="nav-link ">
|
|
<i class="fas fa-sack-dollar"></i> <span>الرواتب</span>
|
|
</a>
|
|
</div>
|
|
|
|
<!-- Reports Section -->
|
|
<div class="nav-section-title px-4 mt-3 mb-1 text-uppercase text-muted collapsed" data-bs-toggle="collapse" data-bs-target="#reports-collapse">
|
|
<span><i class="fas fa-chart-line group-icon"></i><span>التقارير</span></span>
|
|
</div>
|
|
<div class="collapse " id="reports-collapse">
|
|
<a href="index.php?page=expense_report" class="nav-link ">
|
|
<i class="fas fa-file-invoice-dollar"></i> <span>تقرير المصاريف</span>
|
|
</a>
|
|
<a href="index.php?page=customer_statement" class="nav-link ">
|
|
<i class="fas fa-file-invoice"></i> <span>كشف حساب عميل</span>
|
|
</a>
|
|
<a href="index.php?page=supplier_statement" class="nav-link ">
|
|
<i class="fas fa-file-lines"></i> <span>كشف حساب مورد</span>
|
|
</a>
|
|
<a href="index.php?page=cashflow_report" class="nav-link ">
|
|
<i class="fas fa-money-bill-transfer"></i> <span>تقرير التدفق النقدي</span>
|
|
</a>
|
|
<a href="index.php?page=expiry_report" class="nav-link ">
|
|
<i class="fas fa-calendar-xmark"></i> <span>تقرير الصلاحية</span>
|
|
</a>
|
|
<a href="index.php?page=low_stock_report" class="nav-link ">
|
|
<i class="fas fa-arrow-trend-down"></i> <span>تقرير انخفاض المخزون</span>
|
|
</a>
|
|
<a href="index.php?page=loyalty_history" class="nav-link ">
|
|
<i class="fas fa-award"></i> <span>سجل الولاء</span>
|
|
</a>
|
|
</div>
|
|
|
|
<!-- Configurations Section -->
|
|
<div class="nav-section-title px-4 mt-3 mb-1 text-uppercase text-muted collapsed" data-bs-toggle="collapse" data-bs-target="#config-collapse">
|
|
<span><i class="fas fa-sliders group-icon"></i><span>الإعدادات</span></span>
|
|
<i class="fas fa-chevron-down chevron"></i>
|
|
</div>
|
|
<div class="collapse " id="config-collapse">
|
|
<a href="index.php?page=payment_methods" class="nav-link ">
|
|
<i class="fas fa-credit-card"></i> <span>طرق الدفع</span>
|
|
</a>
|
|
<a href="index.php?page=devices" class="nav-link ">
|
|
<i class="fas fa-id-card"></i> <span>الأجهزة</span>
|
|
</a>
|
|
<a href="index.php?page=settings" class="nav-link ">
|
|
<i class="fas fa-building-gear"></i> <span>الإعدادات</span>
|
|
</a>
|
|
</div>
|
|
|
|
<!-- Administrations Section -->
|
|
<div class="nav-section-title px-4 mt-3 mb-1 text-uppercase text-muted collapsed" data-bs-toggle="collapse" data-bs-target="#admin-collapse">
|
|
<span><i class="fas fa-user-gear group-icon"></i><span>الإدارة العامة</span></span>
|
|
<i class="fas fa-chevron-down chevron"></i>
|
|
</div>
|
|
<div class="collapse " id="admin-collapse">
|
|
<a href="index.php?page=role_groups" class="nav-link ">
|
|
<i class="fas fa-user-shield"></i> <span>مجموعات الأدوار</span>
|
|
</a>
|
|
<a href="index.php?page=users" class="nav-link ">
|
|
<i class="fas fa-users-gear"></i> <span>المستخدمين</span>
|
|
</a>
|
|
<a href="index.php?page=cash_registers" class="nav-link ">
|
|
<i class="fas fa-cash-register"></i> <span>صناديق الكاشير</span>
|
|
</a>
|
|
<a href="index.php?page=register_sessions" class="nav-link ">
|
|
<i class="fas fa-clock-rotate-left"></i> <span>جلسات الكاشير</span>
|
|
</a>
|
|
<a href="index.php?page=scale_devices" class="nav-link ">
|
|
<i class="fas fa-microchip"></i> <span>أجهزة الميزان</span>
|
|
</a>
|
|
<a href="index.php?page=customer_display_settings" class="nav-link ">
|
|
<i class="fas fa-desktop"></i> <span>شاشة العميل</span>
|
|
</a>
|
|
<a href="index.php?page=backups" class="nav-link ">
|
|
<i class="fas fa-database"></i> <span>النسخ الاحتياطي</span>
|
|
</a>
|
|
</div>
|
|
|
|
<!-- Version & Logs -->
|
|
<div class="mt-5 px-4 pb-4 border-top pt-4 sidebar-footer">
|
|
<div class="text-muted small fw-bold mb-1">Accounting System</div>
|
|
<div class="d-flex align-items-center justify-content-between text-muted small mb-2">
|
|
<span><i class="bi bi-info-circle me-1"></i> v1.2.5</span>
|
|
<span class="badge bg-success-subtle text-success border border-success-subtle rounded-pill">Stable</span>
|
|
</div>
|
|
<a href="?page=logs" class="text-decoration-none text-muted small d-block">
|
|
<i class="bi bi-journal-text me-1"></i> <span>System Logs</span>
|
|
</a>
|
|
</div>
|
|
</nav>
|
|
</div>
|
|
|
|
<div class="main-content">
|
|
<header class="topbar">
|
|
<!-- DEBUG: page=1 can_access=yes is_activated=yes trial_days=15 -->
|
|
|
|
<div class="d-flex align-items-center">
|
|
<button id="sidebarToggle" class="btn btn-link text-dark p-0 me-3 d-xl-none">
|
|
<i class="bi bi-list fs-3"></i>
|
|
</button>
|
|
<h4 class="m-0">1</h4>
|
|
</div>
|
|
<div class="d-flex align-items-center">
|
|
<div class="dropdown me-3">
|
|
<button class="btn btn-outline-secondary btn-sm dropdown-toggle" type="button" data-bs-toggle="dropdown">
|
|
<i class="bi bi-palette"></i> <span>المظهر</span>
|
|
</button>
|
|
<ul class="dropdown-menu shadow-sm border-0">
|
|
<li><a class="dropdown-item d-flex align-items-center theme-select" href="#" data-theme="default"><span class="rounded-circle me-2" style="width:12px; height:12px; background:#0f172a;"></span> الافتراضي</a></li>
|
|
<li><a class="dropdown-item d-flex align-items-center theme-select" href="#" data-theme="dark"><span class="rounded-circle me-2" style="width:12px; height:12px; background:#1e293b;"></span> ليلي</a></li>
|
|
<li><a class="dropdown-item d-flex align-items-center theme-select" href="#" data-theme="ocean"><span class="rounded-circle me-2" style="width:12px; height:12px; background:#083344;"></span> محيط</a></li>
|
|
<li><a class="dropdown-item d-flex align-items-center theme-select" href="#" data-theme="forest"><span class="rounded-circle me-2" style="width:12px; height:12px; background:#064e3b;"></span> غابة</a></li>
|
|
<li><a class="dropdown-item d-flex align-items-center theme-select" href="#" data-theme="sunset"><span class="rounded-circle me-2" style="width:12px; height:12px; background:#451a03;"></span> غروب</a></li>
|
|
<li><a class="dropdown-item d-flex align-items-center theme-select" href="#" data-theme="nord"><span class="rounded-circle me-2" style="width:12px; height:12px; background:#88c0d0;"></span> نورد</a></li>
|
|
<li><a class="dropdown-item d-flex align-items-center theme-select" href="#" data-theme="dracula"><span class="rounded-circle me-2" style="width:12px; height:12px; background:#bd93f9;"></span> دراكولا</a></li>
|
|
<li><a class="dropdown-item d-flex align-items-center theme-select" href="#" data-theme="citrus"><span class="rounded-circle me-2" style="width:12px; height:12px; background:#84cc16;"></span> حمضيات</a></li>
|
|
</ul>
|
|
</div>
|
|
<a href="?lang=en" class="btn btn-outline-secondary btn-sm me-3">
|
|
<i class="bi bi-translate"></i> <span>English</span>
|
|
</a>
|
|
<div class="me-3 d-none d-md-block text-end">
|
|
<div class="fw-bold small">
|
|
<a href="index.php?page=my_profile" class="text-dark text-decoration-none">
|
|
User </a>
|
|
</div>
|
|
<div class="text-muted" style="font-size: 0.7rem;">Administrator</div>
|
|
</div>
|
|
<div class="dropdown">
|
|
<a href="index.php?page=my_profile" class="btn btn-light rounded-circle p-0 overflow-hidden shadow-sm d-inline-block position-relative" style="width: 40px; height: 40px;" title="تعديل">
|
|
<i class="bi bi-person fs-5" style="line-height: 40px;"></i>
|
|
<span class="position-absolute bottom-0 end-0 bg-primary rounded-circle text-white d-flex align-items-center justify-content-center" style="width: 15px; height: 15px; font-size: 0.6rem;">
|
|
<i class="bi bi-pencil-fill"></i>
|
|
</span>
|
|
</a>
|
|
<button class="btn btn-link text-dark p-0 ms-1" type="button" data-bs-toggle="dropdown">
|
|
<i class="bi bi-chevron-down small"></i>
|
|
</button>
|
|
<ul class="dropdown-menu dropdown-menu-end border-0 shadow-sm rounded-3 mt-2">
|
|
<li><a class="dropdown-item py-2" href="index.php?page=my_profile"><i class="bi bi-person-badge me-2"></i> ملفي الشخصي</a></li>
|
|
<li><a class="dropdown-item py-2" href="index.php?page=settings"><i class="bi bi-gear me-2"></i> إعدادات الشركة</a></li>
|
|
<li><hr class="dropdown-divider"></li>
|
|
<li><a class="dropdown-item py-2 text-danger" href="index.php?action=logout"><i class="bi bi-box-arrow-right me-2"></i> تسجيل الخروج</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
<script>
|
|
const companySettings = {"allow_zero_stock_sell":"1","bank_name":"","company_address":"AL Hamra\r\nOman","company_email":"aalabry@gmail.com","company_iban":"","company_logo":"uploads\/logo.png","company_name":"Bahjet Al-Safa Trading","company_phone":"99359472","company_website":"","cr_number":"","default_vat_rate":"5","favicon":"uploads\/favicon.png","invoice_footer":"","loyalty_enabled":"0","loyalty_points_per_unit":"1","loyalty_redeem_points_per_unit":"100","manager_name":"","registration_no":"","vat_enabled":"1","vat_number":"OM25418"};
|
|
</script>
|
|
|
|
</div>
|
|
|
|
<!-- Add HR Department Modal -->
|
|
<div class="modal fade" id="addHrDepartmentModal" tabindex="-1">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content border-0 shadow">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title" data-en="Add HR Department" data-ar="إضافة قسم">Add HR Department</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
|
</div>
|
|
<form method="POST">
|
|
<div class="modal-body">
|
|
<div class="mb-3">
|
|
<label class="form-label" data-en="Department Name" data-ar="اسم القسم">Department Name</label>
|
|
<input type="text" name="name" class="form-control" required>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-light" data-bs-dismiss="modal" data-en="Cancel" data-ar="إلغاء">Cancel</button>
|
|
<button type="submit" name="add_hr_department" class="btn btn-primary" data-en="Save" data-ar="حفظ">Save</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Add HR Employee Modal -->
|
|
<div class="modal fade" id="addHrEmployeeModal" tabindex="-1">
|
|
<div class="modal-dialog modal-lg">
|
|
<div class="modal-content border-0 shadow">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title" data-en="Add HR Employee" data-ar="إضافة موظف">Add HR Employee</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
|
</div>
|
|
<form method="POST">
|
|
<div class="modal-body">
|
|
<div class="row g-3">
|
|
<div class="col-md-6">
|
|
<label class="form-label" data-en="Full Name" data-ar="الاسم الكامل">Full Name</label>
|
|
<input type="text" name="name" class="form-control" required>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<label class="form-label" data-en="Department" data-ar="القسم">Department</label>
|
|
<select name="department_id" class="form-select">
|
|
<option value="">--- Select ---</option>
|
|
</select>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<label class="form-label" data-en="Email" data-ar="البريد">Email</label>
|
|
<input type="email" name="email" class="form-control">
|
|
</div>
|
|
<div class="col-md-6">
|
|
<label class="form-label" data-en="Phone" data-ar="الهاتف">Phone</label>
|
|
<input type="text" name="phone" class="form-control">
|
|
</div>
|
|
<div class="col-md-4">
|
|
<label class="form-label" data-en="Position" data-ar="المنصب">Position</label>
|
|
<input type="text" name="position" class="form-control">
|
|
</div>
|
|
<div class="col-md-4">
|
|
<label class="form-label" data-en="Basic Salary" data-ar="الراتب الأساسي">Basic Salary</label>
|
|
<input type="number" step="0.001" name="salary" class="form-control" value="0.000">
|
|
</div>
|
|
<div class="col-md-4">
|
|
<label class="form-label" data-en="Biometric ID" data-ar="معرف البصمة">Biometric ID</label>
|
|
<input type="text" name="biometric_id" class="form-control">
|
|
</div>
|
|
<div class="col-md-4">
|
|
<label class="form-label" data-en="Joining Date" data-ar="تاريخ الانضمام">Joining Date</label>
|
|
<input type="date" name="joining_date" class="form-control" value="2026-03-17">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-light" data-bs-dismiss="modal" data-en="Cancel" data-ar="إلغاء">Cancel</button>
|
|
<button type="submit" name="add_hr_employee" class="btn btn-primary" data-en="Save" data-ar="حفظ">Save</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Add Role Group Modal -->
|
|
<div class="modal fade" id="addRoleGroupModal" tabindex="-1">
|
|
<div class="modal-dialog modal-lg">
|
|
<div class="modal-content border-0 shadow">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title" data-en="Add Role Group" data-ar="إضافة مجموعة أدوار">Add Role Group</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
|
</div>
|
|
<form method="POST">
|
|
<div class="modal-body">
|
|
<div class="mb-3">
|
|
<label class="form-label" data-en="Group Name" data-ar="اسم المجموعة">Group Name</label>
|
|
<input type="text" name="name" class="form-control" required>
|
|
</div>
|
|
<div class="mb-3">
|
|
<div class="d-flex justify-content-between align-items-center mb-2">
|
|
<label class="form-label fw-semibold mb-0" data-en="Permissions" data-ar="الصلاحيات">Permissions</label>
|
|
<div class="d-flex gap-2">
|
|
<button type="button" class="btn btn-xs btn-outline-primary py-0 px-2 small select-all-btn" data-modal="#addRoleGroupModal">Select All</button>
|
|
<button type="button" class="btn btn-xs btn-outline-secondary py-0 px-2 small deselect-all-btn" data-modal="#addRoleGroupModal">Deselect All</button>
|
|
</div>
|
|
</div>
|
|
<div class="mb-3 p-2 bg-light rounded d-flex justify-content-between align-items-center flex-wrap gap-2">
|
|
<span class="small fw-bold me-2">Global Actions:</span>
|
|
<div class="d-flex gap-3">
|
|
<div class="form-check">
|
|
<input class="form-check-input select-all-action" type="checkbox" data-action="view" id="addSelectAllView">
|
|
<label class="form-check-label small" for="addSelectAllView" data-en="View" data-ar="عرض">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input select-all-action" type="checkbox" data-action="add" id="addSelectAllAdd">
|
|
<label class="form-check-label small" for="addSelectAllAdd" data-en="Add" data-ar="إضافة">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input select-all-action" type="checkbox" data-action="edit" id="addSelectAllEdit">
|
|
<label class="form-check-label small" for="addSelectAllEdit" data-en="Edit" data-ar="تعديل" data-en="Edit" data-ar="تعديل">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input select-all-action" type="checkbox" data-action="delete" id="addSelectAllDelete">
|
|
<label class="form-check-label small" for="addSelectAllDelete" data-en="Delete" data-ar="حذف" data-en="Delete" data-ar="حذف">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row overflow-auto pe-2" style="max-height: 500px;">
|
|
<div class="permission-group-container col-12 mb-4">
|
|
<div class="mt-3 mb-2 bg-secondary bg-opacity-10 p-2 d-flex justify-content-between align-items-center rounded border-start border-primary border-3">
|
|
<span class="fw-bold text-uppercase small text-primary">General</span>
|
|
<div class="form-check mb-0">
|
|
<input class="form-check-input select-all-group" type="checkbox" id="add_group_general">
|
|
<label class="form-check-label small fw-bold" for="add_group_general">Group All</label>
|
|
</div>
|
|
</div>
|
|
<div class="row g-3">
|
|
<div class="col-md-6 mb-2 border-bottom pb-2">
|
|
<div class="small fw-bold mb-2 text-dark border-start border-2 ps-2 border-info">لوحة القيادة</div>
|
|
<div class="d-flex gap-3 flex-wrap ps-2">
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="dashboard_view" data-action="view" id="add_perm_dashboard_view">
|
|
<label class="form-check-label small" for="add_perm_dashboard_view">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="dashboard_add" data-action="add" id="add_perm_dashboard_add">
|
|
<label class="form-check-label small" for="add_perm_dashboard_add">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="dashboard_edit" data-action="edit" id="add_perm_dashboard_edit">
|
|
<label class="form-check-label small" for="add_perm_dashboard_edit">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="dashboard_delete" data-action="delete" id="add_perm_dashboard_delete">
|
|
<label class="form-check-label small" for="add_perm_dashboard_delete">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="permission-group-container col-12 mb-4">
|
|
<div class="mt-3 mb-2 bg-secondary bg-opacity-10 p-2 d-flex justify-content-between align-items-center rounded border-start border-primary border-3">
|
|
<span class="fw-bold text-uppercase small text-primary">Inventory</span>
|
|
<div class="form-check mb-0">
|
|
<input class="form-check-input select-all-group" type="checkbox" id="add_group_inventory">
|
|
<label class="form-check-label small fw-bold" for="add_group_inventory">Group All</label>
|
|
</div>
|
|
</div>
|
|
<div class="row g-3">
|
|
<div class="col-md-6 mb-2 border-bottom pb-2">
|
|
<div class="small fw-bold mb-2 text-dark border-start border-2 ps-2 border-info">الأصناف</div>
|
|
<div class="d-flex gap-3 flex-wrap ps-2">
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="items_view" data-action="view" id="add_perm_items_view">
|
|
<label class="form-check-label small" for="add_perm_items_view">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="items_add" data-action="add" id="add_perm_items_add">
|
|
<label class="form-check-label small" for="add_perm_items_add">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="items_edit" data-action="edit" id="add_perm_items_edit">
|
|
<label class="form-check-label small" for="add_perm_items_edit">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="items_delete" data-action="delete" id="add_perm_items_delete">
|
|
<label class="form-check-label small" for="add_perm_items_delete">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 mb-2 border-bottom pb-2">
|
|
<div class="small fw-bold mb-2 text-dark border-start border-2 ps-2 border-info">الفئات</div>
|
|
<div class="d-flex gap-3 flex-wrap ps-2">
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="categories_view" data-action="view" id="add_perm_categories_view">
|
|
<label class="form-check-label small" for="add_perm_categories_view">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="categories_add" data-action="add" id="add_perm_categories_add">
|
|
<label class="form-check-label small" for="add_perm_categories_add">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="categories_edit" data-action="edit" id="add_perm_categories_edit">
|
|
<label class="form-check-label small" for="add_perm_categories_edit">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="categories_delete" data-action="delete" id="add_perm_categories_delete">
|
|
<label class="form-check-label small" for="add_perm_categories_delete">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 mb-2 border-bottom pb-2">
|
|
<div class="small fw-bold mb-2 text-dark border-start border-2 ps-2 border-info">الوحدات</div>
|
|
<div class="d-flex gap-3 flex-wrap ps-2">
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="units_view" data-action="view" id="add_perm_units_view">
|
|
<label class="form-check-label small" for="add_perm_units_view">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="units_add" data-action="add" id="add_perm_units_add">
|
|
<label class="form-check-label small" for="add_perm_units_add">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="units_edit" data-action="edit" id="add_perm_units_edit">
|
|
<label class="form-check-label small" for="add_perm_units_edit">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="units_delete" data-action="delete" id="add_perm_units_delete">
|
|
<label class="form-check-label small" for="add_perm_units_delete">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="permission-group-container col-12 mb-4">
|
|
<div class="mt-3 mb-2 bg-secondary bg-opacity-10 p-2 d-flex justify-content-between align-items-center rounded border-start border-primary border-3">
|
|
<span class="fw-bold text-uppercase small text-primary">Customers</span>
|
|
<div class="form-check mb-0">
|
|
<input class="form-check-input select-all-group" type="checkbox" id="add_group_customers">
|
|
<label class="form-check-label small fw-bold" for="add_group_customers">Group All</label>
|
|
</div>
|
|
</div>
|
|
<div class="row g-3">
|
|
<div class="col-md-6 mb-2 border-bottom pb-2">
|
|
<div class="small fw-bold mb-2 text-dark border-start border-2 ps-2 border-info">العملاء</div>
|
|
<div class="d-flex gap-3 flex-wrap ps-2">
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="customers_view" data-action="view" id="add_perm_customers_view">
|
|
<label class="form-check-label small" for="add_perm_customers_view">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="customers_add" data-action="add" id="add_perm_customers_add">
|
|
<label class="form-check-label small" for="add_perm_customers_add">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="customers_edit" data-action="edit" id="add_perm_customers_edit">
|
|
<label class="form-check-label small" for="add_perm_customers_edit">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="customers_delete" data-action="delete" id="add_perm_customers_delete">
|
|
<label class="form-check-label small" for="add_perm_customers_delete">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="permission-group-container col-12 mb-4">
|
|
<div class="mt-3 mb-2 bg-secondary bg-opacity-10 p-2 d-flex justify-content-between align-items-center rounded border-start border-primary border-3">
|
|
<span class="fw-bold text-uppercase small text-primary">Suppliers</span>
|
|
<div class="form-check mb-0">
|
|
<input class="form-check-input select-all-group" type="checkbox" id="add_group_suppliers">
|
|
<label class="form-check-label small fw-bold" for="add_group_suppliers">Group All</label>
|
|
</div>
|
|
</div>
|
|
<div class="row g-3">
|
|
<div class="col-md-6 mb-2 border-bottom pb-2">
|
|
<div class="small fw-bold mb-2 text-dark border-start border-2 ps-2 border-info">الموردين</div>
|
|
<div class="d-flex gap-3 flex-wrap ps-2">
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="suppliers_view" data-action="view" id="add_perm_suppliers_view">
|
|
<label class="form-check-label small" for="add_perm_suppliers_view">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="suppliers_add" data-action="add" id="add_perm_suppliers_add">
|
|
<label class="form-check-label small" for="add_perm_suppliers_add">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="suppliers_edit" data-action="edit" id="add_perm_suppliers_edit">
|
|
<label class="form-check-label small" for="add_perm_suppliers_edit">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="suppliers_delete" data-action="delete" id="add_perm_suppliers_delete">
|
|
<label class="form-check-label small" for="add_perm_suppliers_delete">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="permission-group-container col-12 mb-4">
|
|
<div class="mt-3 mb-2 bg-secondary bg-opacity-10 p-2 d-flex justify-content-between align-items-center rounded border-start border-primary border-3">
|
|
<span class="fw-bold text-uppercase small text-primary">POS</span>
|
|
<div class="form-check mb-0">
|
|
<input class="form-check-input select-all-group" type="checkbox" id="add_group_pos">
|
|
<label class="form-check-label small fw-bold" for="add_group_pos">Group All</label>
|
|
</div>
|
|
</div>
|
|
<div class="row g-3">
|
|
<div class="col-md-6 mb-2 border-bottom pb-2">
|
|
<div class="small fw-bold mb-2 text-dark border-start border-2 ps-2 border-info">نقطة البيع</div>
|
|
<div class="d-flex gap-3 flex-wrap ps-2">
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="pos_view" data-action="view" id="add_perm_pos_view">
|
|
<label class="form-check-label small" for="add_perm_pos_view">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="pos_add" data-action="add" id="add_perm_pos_add">
|
|
<label class="form-check-label small" for="add_perm_pos_add">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="pos_edit" data-action="edit" id="add_perm_pos_edit">
|
|
<label class="form-check-label small" for="add_perm_pos_edit">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="pos_delete" data-action="delete" id="add_perm_pos_delete">
|
|
<label class="form-check-label small" for="add_perm_pos_delete">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="permission-group-container col-12 mb-4">
|
|
<div class="mt-3 mb-2 bg-secondary bg-opacity-10 p-2 d-flex justify-content-between align-items-center rounded border-start border-primary border-3">
|
|
<span class="fw-bold text-uppercase small text-primary">Sales</span>
|
|
<div class="form-check mb-0">
|
|
<input class="form-check-input select-all-group" type="checkbox" id="add_group_sales">
|
|
<label class="form-check-label small fw-bold" for="add_group_sales">Group All</label>
|
|
</div>
|
|
</div>
|
|
<div class="row g-3">
|
|
<div class="col-md-6 mb-2 border-bottom pb-2">
|
|
<div class="small fw-bold mb-2 text-dark border-start border-2 ps-2 border-info">المبيعات</div>
|
|
<div class="d-flex gap-3 flex-wrap ps-2">
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="sales_view" data-action="view" id="add_perm_sales_view">
|
|
<label class="form-check-label small" for="add_perm_sales_view">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="sales_add" data-action="add" id="add_perm_sales_add">
|
|
<label class="form-check-label small" for="add_perm_sales_add">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="sales_edit" data-action="edit" id="add_perm_sales_edit">
|
|
<label class="form-check-label small" for="add_perm_sales_edit">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="sales_delete" data-action="delete" id="add_perm_sales_delete">
|
|
<label class="form-check-label small" for="add_perm_sales_delete">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 mb-2 border-bottom pb-2">
|
|
<div class="small fw-bold mb-2 text-dark border-start border-2 ps-2 border-info">مرتجعات المبيعات</div>
|
|
<div class="d-flex gap-3 flex-wrap ps-2">
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="sales_returns_view" data-action="view" id="add_perm_sales_returns_view">
|
|
<label class="form-check-label small" for="add_perm_sales_returns_view">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="sales_returns_add" data-action="add" id="add_perm_sales_returns_add">
|
|
<label class="form-check-label small" for="add_perm_sales_returns_add">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="sales_returns_edit" data-action="edit" id="add_perm_sales_returns_edit">
|
|
<label class="form-check-label small" for="add_perm_sales_returns_edit">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="sales_returns_delete" data-action="delete" id="add_perm_sales_returns_delete">
|
|
<label class="form-check-label small" for="add_perm_sales_returns_delete">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 mb-2 border-bottom pb-2">
|
|
<div class="small fw-bold mb-2 text-dark border-start border-2 ps-2 border-info">عروض الأسعار</div>
|
|
<div class="d-flex gap-3 flex-wrap ps-2">
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="quotations_view" data-action="view" id="add_perm_quotations_view">
|
|
<label class="form-check-label small" for="add_perm_quotations_view">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="quotations_add" data-action="add" id="add_perm_quotations_add">
|
|
<label class="form-check-label small" for="add_perm_quotations_add">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="quotations_edit" data-action="edit" id="add_perm_quotations_edit">
|
|
<label class="form-check-label small" for="add_perm_quotations_edit">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="quotations_delete" data-action="delete" id="add_perm_quotations_delete">
|
|
<label class="form-check-label small" for="add_perm_quotations_delete">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="permission-group-container col-12 mb-4">
|
|
<div class="mt-3 mb-2 bg-secondary bg-opacity-10 p-2 d-flex justify-content-between align-items-center rounded border-start border-primary border-3">
|
|
<span class="fw-bold text-uppercase small text-primary">Purchases</span>
|
|
<div class="form-check mb-0">
|
|
<input class="form-check-input select-all-group" type="checkbox" id="add_group_purchases">
|
|
<label class="form-check-label small fw-bold" for="add_group_purchases">Group All</label>
|
|
</div>
|
|
</div>
|
|
<div class="row g-3">
|
|
<div class="col-md-6 mb-2 border-bottom pb-2">
|
|
<div class="small fw-bold mb-2 text-dark border-start border-2 ps-2 border-info">المشتريات</div>
|
|
<div class="d-flex gap-3 flex-wrap ps-2">
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="purchases_view" data-action="view" id="add_perm_purchases_view">
|
|
<label class="form-check-label small" for="add_perm_purchases_view">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="purchases_add" data-action="add" id="add_perm_purchases_add">
|
|
<label class="form-check-label small" for="add_perm_purchases_add">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="purchases_edit" data-action="edit" id="add_perm_purchases_edit">
|
|
<label class="form-check-label small" for="add_perm_purchases_edit">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="purchases_delete" data-action="delete" id="add_perm_purchases_delete">
|
|
<label class="form-check-label small" for="add_perm_purchases_delete">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 mb-2 border-bottom pb-2">
|
|
<div class="small fw-bold mb-2 text-dark border-start border-2 ps-2 border-info">أوامر الشراء المحلية (LPO)</div>
|
|
<div class="d-flex gap-3 flex-wrap ps-2">
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="lpos_view" data-action="view" id="add_perm_lpos_view">
|
|
<label class="form-check-label small" for="add_perm_lpos_view">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="lpos_add" data-action="add" id="add_perm_lpos_add">
|
|
<label class="form-check-label small" for="add_perm_lpos_add">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="lpos_edit" data-action="edit" id="add_perm_lpos_edit">
|
|
<label class="form-check-label small" for="add_perm_lpos_edit">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="lpos_delete" data-action="delete" id="add_perm_lpos_delete">
|
|
<label class="form-check-label small" for="add_perm_lpos_delete">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 mb-2 border-bottom pb-2">
|
|
<div class="small fw-bold mb-2 text-dark border-start border-2 ps-2 border-info">مرتجعات المشتريات</div>
|
|
<div class="d-flex gap-3 flex-wrap ps-2">
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="purchase_returns_view" data-action="view" id="add_perm_purchase_returns_view">
|
|
<label class="form-check-label small" for="add_perm_purchase_returns_view">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="purchase_returns_add" data-action="add" id="add_perm_purchase_returns_add">
|
|
<label class="form-check-label small" for="add_perm_purchase_returns_add">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="purchase_returns_edit" data-action="edit" id="add_perm_purchase_returns_edit">
|
|
<label class="form-check-label small" for="add_perm_purchase_returns_edit">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="purchase_returns_delete" data-action="delete" id="add_perm_purchase_returns_delete">
|
|
<label class="form-check-label small" for="add_perm_purchase_returns_delete">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="permission-group-container col-12 mb-4">
|
|
<div class="mt-3 mb-2 bg-secondary bg-opacity-10 p-2 d-flex justify-content-between align-items-center rounded border-start border-primary border-3">
|
|
<span class="fw-bold text-uppercase small text-primary">Expenses</span>
|
|
<div class="form-check mb-0">
|
|
<input class="form-check-input select-all-group" type="checkbox" id="add_group_expenses">
|
|
<label class="form-check-label small fw-bold" for="add_group_expenses">Group All</label>
|
|
</div>
|
|
</div>
|
|
<div class="row g-3">
|
|
<div class="col-md-6 mb-2 border-bottom pb-2">
|
|
<div class="small fw-bold mb-2 text-dark border-start border-2 ps-2 border-info">فئات المصاريف</div>
|
|
<div class="d-flex gap-3 flex-wrap ps-2">
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="expense_categories_view" data-action="view" id="add_perm_expense_categories_view">
|
|
<label class="form-check-label small" for="add_perm_expense_categories_view">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="expense_categories_add" data-action="add" id="add_perm_expense_categories_add">
|
|
<label class="form-check-label small" for="add_perm_expense_categories_add">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="expense_categories_edit" data-action="edit" id="add_perm_expense_categories_edit">
|
|
<label class="form-check-label small" for="add_perm_expense_categories_edit">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="expense_categories_delete" data-action="delete" id="add_perm_expense_categories_delete">
|
|
<label class="form-check-label small" for="add_perm_expense_categories_delete">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 mb-2 border-bottom pb-2">
|
|
<div class="small fw-bold mb-2 text-dark border-start border-2 ps-2 border-info">المصاريف</div>
|
|
<div class="d-flex gap-3 flex-wrap ps-2">
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="expenses_view" data-action="view" id="add_perm_expenses_view">
|
|
<label class="form-check-label small" for="add_perm_expenses_view">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="expenses_add" data-action="add" id="add_perm_expenses_add">
|
|
<label class="form-check-label small" for="add_perm_expenses_add">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="expenses_edit" data-action="edit" id="add_perm_expenses_edit">
|
|
<label class="form-check-label small" for="add_perm_expenses_edit">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="expenses_delete" data-action="delete" id="add_perm_expenses_delete">
|
|
<label class="form-check-label small" for="add_perm_expenses_delete">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="permission-group-container col-12 mb-4">
|
|
<div class="mt-3 mb-2 bg-secondary bg-opacity-10 p-2 d-flex justify-content-between align-items-center rounded border-start border-primary border-3">
|
|
<span class="fw-bold text-uppercase small text-primary">Accounting</span>
|
|
<div class="form-check mb-0">
|
|
<input class="form-check-input select-all-group" type="checkbox" id="add_group_accounting">
|
|
<label class="form-check-label small fw-bold" for="add_group_accounting">Group All</label>
|
|
</div>
|
|
</div>
|
|
<div class="row g-3">
|
|
<div class="col-md-6 mb-2 border-bottom pb-2">
|
|
<div class="small fw-bold mb-2 text-dark border-start border-2 ps-2 border-info">المحاسبة</div>
|
|
<div class="d-flex gap-3 flex-wrap ps-2">
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="accounting_view" data-action="view" id="add_perm_accounting_view">
|
|
<label class="form-check-label small" for="add_perm_accounting_view">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="accounting_add" data-action="add" id="add_perm_accounting_add">
|
|
<label class="form-check-label small" for="add_perm_accounting_add">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="accounting_edit" data-action="edit" id="add_perm_accounting_edit">
|
|
<label class="form-check-label small" for="add_perm_accounting_edit">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="accounting_delete" data-action="delete" id="add_perm_accounting_delete">
|
|
<label class="form-check-label small" for="add_perm_accounting_delete">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 mb-2 border-bottom pb-2">
|
|
<div class="small fw-bold mb-2 text-dark border-start border-2 ps-2 border-info">ميزان المراجعة</div>
|
|
<div class="d-flex gap-3 flex-wrap ps-2">
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="trial_balance_view" data-action="view" id="add_perm_trial_balance_view">
|
|
<label class="form-check-label small" for="add_perm_trial_balance_view">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="trial_balance_add" data-action="add" id="add_perm_trial_balance_add">
|
|
<label class="form-check-label small" for="add_perm_trial_balance_add">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="trial_balance_edit" data-action="edit" id="add_perm_trial_balance_edit">
|
|
<label class="form-check-label small" for="add_perm_trial_balance_edit">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="trial_balance_delete" data-action="delete" id="add_perm_trial_balance_delete">
|
|
<label class="form-check-label small" for="add_perm_trial_balance_delete">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 mb-2 border-bottom pb-2">
|
|
<div class="small fw-bold mb-2 text-dark border-start border-2 ps-2 border-info">الأرباح والخسائر</div>
|
|
<div class="d-flex gap-3 flex-wrap ps-2">
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="profit_loss_view" data-action="view" id="add_perm_profit_loss_view">
|
|
<label class="form-check-label small" for="add_perm_profit_loss_view">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="profit_loss_add" data-action="add" id="add_perm_profit_loss_add">
|
|
<label class="form-check-label small" for="add_perm_profit_loss_add">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="profit_loss_edit" data-action="edit" id="add_perm_profit_loss_edit">
|
|
<label class="form-check-label small" for="add_perm_profit_loss_edit">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="profit_loss_delete" data-action="delete" id="add_perm_profit_loss_delete">
|
|
<label class="form-check-label small" for="add_perm_profit_loss_delete">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 mb-2 border-bottom pb-2">
|
|
<div class="small fw-bold mb-2 text-dark border-start border-2 ps-2 border-info">الميزانية العمومية</div>
|
|
<div class="d-flex gap-3 flex-wrap ps-2">
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="balance_sheet_view" data-action="view" id="add_perm_balance_sheet_view">
|
|
<label class="form-check-label small" for="add_perm_balance_sheet_view">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="balance_sheet_add" data-action="add" id="add_perm_balance_sheet_add">
|
|
<label class="form-check-label small" for="add_perm_balance_sheet_add">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="balance_sheet_edit" data-action="edit" id="add_perm_balance_sheet_edit">
|
|
<label class="form-check-label small" for="add_perm_balance_sheet_edit">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="balance_sheet_delete" data-action="delete" id="add_perm_balance_sheet_delete">
|
|
<label class="form-check-label small" for="add_perm_balance_sheet_delete">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 mb-2 border-bottom pb-2">
|
|
<div class="small fw-bold mb-2 text-dark border-start border-2 ps-2 border-info">تقرير ضريبة القيمة المضافة</div>
|
|
<div class="d-flex gap-3 flex-wrap ps-2">
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="vat_report_view" data-action="view" id="add_perm_vat_report_view">
|
|
<label class="form-check-label small" for="add_perm_vat_report_view">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="vat_report_add" data-action="add" id="add_perm_vat_report_add">
|
|
<label class="form-check-label small" for="add_perm_vat_report_add">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="vat_report_edit" data-action="edit" id="add_perm_vat_report_edit">
|
|
<label class="form-check-label small" for="add_perm_vat_report_edit">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="vat_report_delete" data-action="delete" id="add_perm_vat_report_delete">
|
|
<label class="form-check-label small" for="add_perm_vat_report_delete">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="permission-group-container col-12 mb-4">
|
|
<div class="mt-3 mb-2 bg-secondary bg-opacity-10 p-2 d-flex justify-content-between align-items-center rounded border-start border-primary border-3">
|
|
<span class="fw-bold text-uppercase small text-primary">HR</span>
|
|
<div class="form-check mb-0">
|
|
<input class="form-check-input select-all-group" type="checkbox" id="add_group_hr">
|
|
<label class="form-check-label small fw-bold" for="add_group_hr">Group All</label>
|
|
</div>
|
|
</div>
|
|
<div class="row g-3">
|
|
<div class="col-md-6 mb-2 border-bottom pb-2">
|
|
<div class="small fw-bold mb-2 text-dark border-start border-2 ps-2 border-info">الأقسام</div>
|
|
<div class="d-flex gap-3 flex-wrap ps-2">
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="hr_departments_view" data-action="view" id="add_perm_hr_departments_view">
|
|
<label class="form-check-label small" for="add_perm_hr_departments_view">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="hr_departments_add" data-action="add" id="add_perm_hr_departments_add">
|
|
<label class="form-check-label small" for="add_perm_hr_departments_add">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="hr_departments_edit" data-action="edit" id="add_perm_hr_departments_edit">
|
|
<label class="form-check-label small" for="add_perm_hr_departments_edit">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="hr_departments_delete" data-action="delete" id="add_perm_hr_departments_delete">
|
|
<label class="form-check-label small" for="add_perm_hr_departments_delete">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 mb-2 border-bottom pb-2">
|
|
<div class="small fw-bold mb-2 text-dark border-start border-2 ps-2 border-info">الموظفين</div>
|
|
<div class="d-flex gap-3 flex-wrap ps-2">
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="hr_employees_view" data-action="view" id="add_perm_hr_employees_view">
|
|
<label class="form-check-label small" for="add_perm_hr_employees_view">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="hr_employees_add" data-action="add" id="add_perm_hr_employees_add">
|
|
<label class="form-check-label small" for="add_perm_hr_employees_add">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="hr_employees_edit" data-action="edit" id="add_perm_hr_employees_edit">
|
|
<label class="form-check-label small" for="add_perm_hr_employees_edit">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="hr_employees_delete" data-action="delete" id="add_perm_hr_employees_delete">
|
|
<label class="form-check-label small" for="add_perm_hr_employees_delete">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 mb-2 border-bottom pb-2">
|
|
<div class="small fw-bold mb-2 text-dark border-start border-2 ps-2 border-info">الحضور</div>
|
|
<div class="d-flex gap-3 flex-wrap ps-2">
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="hr_attendance_view" data-action="view" id="add_perm_hr_attendance_view">
|
|
<label class="form-check-label small" for="add_perm_hr_attendance_view">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="hr_attendance_add" data-action="add" id="add_perm_hr_attendance_add">
|
|
<label class="form-check-label small" for="add_perm_hr_attendance_add">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="hr_attendance_edit" data-action="edit" id="add_perm_hr_attendance_edit">
|
|
<label class="form-check-label small" for="add_perm_hr_attendance_edit">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="hr_attendance_delete" data-action="delete" id="add_perm_hr_attendance_delete">
|
|
<label class="form-check-label small" for="add_perm_hr_attendance_delete">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 mb-2 border-bottom pb-2">
|
|
<div class="small fw-bold mb-2 text-dark border-start border-2 ps-2 border-info">الرواتب</div>
|
|
<div class="d-flex gap-3 flex-wrap ps-2">
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="hr_payroll_view" data-action="view" id="add_perm_hr_payroll_view">
|
|
<label class="form-check-label small" for="add_perm_hr_payroll_view">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="hr_payroll_add" data-action="add" id="add_perm_hr_payroll_add">
|
|
<label class="form-check-label small" for="add_perm_hr_payroll_add">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="hr_payroll_edit" data-action="edit" id="add_perm_hr_payroll_edit">
|
|
<label class="form-check-label small" for="add_perm_hr_payroll_edit">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="hr_payroll_delete" data-action="delete" id="add_perm_hr_payroll_delete">
|
|
<label class="form-check-label small" for="add_perm_hr_payroll_delete">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="permission-group-container col-12 mb-4">
|
|
<div class="mt-3 mb-2 bg-secondary bg-opacity-10 p-2 d-flex justify-content-between align-items-center rounded border-start border-primary border-3">
|
|
<span class="fw-bold text-uppercase small text-primary">Reports</span>
|
|
<div class="form-check mb-0">
|
|
<input class="form-check-input select-all-group" type="checkbox" id="add_group_reports">
|
|
<label class="form-check-label small fw-bold" for="add_group_reports">Group All</label>
|
|
</div>
|
|
</div>
|
|
<div class="row g-3">
|
|
<div class="col-md-6 mb-2 border-bottom pb-2">
|
|
<div class="small fw-bold mb-2 text-dark border-start border-2 ps-2 border-info">كشف حساب عميل</div>
|
|
<div class="d-flex gap-3 flex-wrap ps-2">
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="customer_statement_view" data-action="view" id="add_perm_customer_statement_view">
|
|
<label class="form-check-label small" for="add_perm_customer_statement_view">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="customer_statement_add" data-action="add" id="add_perm_customer_statement_add">
|
|
<label class="form-check-label small" for="add_perm_customer_statement_add">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="customer_statement_edit" data-action="edit" id="add_perm_customer_statement_edit">
|
|
<label class="form-check-label small" for="add_perm_customer_statement_edit">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="customer_statement_delete" data-action="delete" id="add_perm_customer_statement_delete">
|
|
<label class="form-check-label small" for="add_perm_customer_statement_delete">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 mb-2 border-bottom pb-2">
|
|
<div class="small fw-bold mb-2 text-dark border-start border-2 ps-2 border-info">كشف حساب مورد</div>
|
|
<div class="d-flex gap-3 flex-wrap ps-2">
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="supplier_statement_view" data-action="view" id="add_perm_supplier_statement_view">
|
|
<label class="form-check-label small" for="add_perm_supplier_statement_view">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="supplier_statement_add" data-action="add" id="add_perm_supplier_statement_add">
|
|
<label class="form-check-label small" for="add_perm_supplier_statement_add">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="supplier_statement_edit" data-action="edit" id="add_perm_supplier_statement_edit">
|
|
<label class="form-check-label small" for="add_perm_supplier_statement_edit">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="supplier_statement_delete" data-action="delete" id="add_perm_supplier_statement_delete">
|
|
<label class="form-check-label small" for="add_perm_supplier_statement_delete">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 mb-2 border-bottom pb-2">
|
|
<div class="small fw-bold mb-2 text-dark border-start border-2 ps-2 border-info">تقرير المصاريف</div>
|
|
<div class="d-flex gap-3 flex-wrap ps-2">
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="expense_report_view" data-action="view" id="add_perm_expense_report_view">
|
|
<label class="form-check-label small" for="add_perm_expense_report_view">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="expense_report_add" data-action="add" id="add_perm_expense_report_add">
|
|
<label class="form-check-label small" for="add_perm_expense_report_add">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="expense_report_edit" data-action="edit" id="add_perm_expense_report_edit">
|
|
<label class="form-check-label small" for="add_perm_expense_report_edit">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="expense_report_delete" data-action="delete" id="add_perm_expense_report_delete">
|
|
<label class="form-check-label small" for="add_perm_expense_report_delete">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 mb-2 border-bottom pb-2">
|
|
<div class="small fw-bold mb-2 text-dark border-start border-2 ps-2 border-info">تقرير التدفق النقدي</div>
|
|
<div class="d-flex gap-3 flex-wrap ps-2">
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="cashflow_report_view" data-action="view" id="add_perm_cashflow_report_view">
|
|
<label class="form-check-label small" for="add_perm_cashflow_report_view">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="cashflow_report_add" data-action="add" id="add_perm_cashflow_report_add">
|
|
<label class="form-check-label small" for="add_perm_cashflow_report_add">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="cashflow_report_edit" data-action="edit" id="add_perm_cashflow_report_edit">
|
|
<label class="form-check-label small" for="add_perm_cashflow_report_edit">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="cashflow_report_delete" data-action="delete" id="add_perm_cashflow_report_delete">
|
|
<label class="form-check-label small" for="add_perm_cashflow_report_delete">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 mb-2 border-bottom pb-2">
|
|
<div class="small fw-bold mb-2 text-dark border-start border-2 ps-2 border-info">تقرير الصلاحية</div>
|
|
<div class="d-flex gap-3 flex-wrap ps-2">
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="expiry_report_view" data-action="view" id="add_perm_expiry_report_view">
|
|
<label class="form-check-label small" for="add_perm_expiry_report_view">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="expiry_report_add" data-action="add" id="add_perm_expiry_report_add">
|
|
<label class="form-check-label small" for="add_perm_expiry_report_add">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="expiry_report_edit" data-action="edit" id="add_perm_expiry_report_edit">
|
|
<label class="form-check-label small" for="add_perm_expiry_report_edit">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="expiry_report_delete" data-action="delete" id="add_perm_expiry_report_delete">
|
|
<label class="form-check-label small" for="add_perm_expiry_report_delete">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 mb-2 border-bottom pb-2">
|
|
<div class="small fw-bold mb-2 text-dark border-start border-2 ps-2 border-info">تقرير انخفاض المخزون</div>
|
|
<div class="d-flex gap-3 flex-wrap ps-2">
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="low_stock_report_view" data-action="view" id="add_perm_low_stock_report_view">
|
|
<label class="form-check-label small" for="add_perm_low_stock_report_view">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="low_stock_report_add" data-action="add" id="add_perm_low_stock_report_add">
|
|
<label class="form-check-label small" for="add_perm_low_stock_report_add">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="low_stock_report_edit" data-action="edit" id="add_perm_low_stock_report_edit">
|
|
<label class="form-check-label small" for="add_perm_low_stock_report_edit">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="low_stock_report_delete" data-action="delete" id="add_perm_low_stock_report_delete">
|
|
<label class="form-check-label small" for="add_perm_low_stock_report_delete">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 mb-2 border-bottom pb-2">
|
|
<div class="small fw-bold mb-2 text-dark border-start border-2 ps-2 border-info">سجل الولاء</div>
|
|
<div class="d-flex gap-3 flex-wrap ps-2">
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="loyalty_history_view" data-action="view" id="add_perm_loyalty_history_view">
|
|
<label class="form-check-label small" for="add_perm_loyalty_history_view">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="loyalty_history_add" data-action="add" id="add_perm_loyalty_history_add">
|
|
<label class="form-check-label small" for="add_perm_loyalty_history_add">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="loyalty_history_edit" data-action="edit" id="add_perm_loyalty_history_edit">
|
|
<label class="form-check-label small" for="add_perm_loyalty_history_edit">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="loyalty_history_delete" data-action="delete" id="add_perm_loyalty_history_delete">
|
|
<label class="form-check-label small" for="add_perm_loyalty_history_delete">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="permission-group-container col-12 mb-4">
|
|
<div class="mt-3 mb-2 bg-secondary bg-opacity-10 p-2 d-flex justify-content-between align-items-center rounded border-start border-primary border-3">
|
|
<span class="fw-bold text-uppercase small text-primary">Settings</span>
|
|
<div class="form-check mb-0">
|
|
<input class="form-check-input select-all-group" type="checkbox" id="add_group_settings">
|
|
<label class="form-check-label small fw-bold" for="add_group_settings">Group All</label>
|
|
</div>
|
|
</div>
|
|
<div class="row g-3">
|
|
<div class="col-md-6 mb-2 border-bottom pb-2">
|
|
<div class="small fw-bold mb-2 text-dark border-start border-2 ps-2 border-info">طرق الدفع</div>
|
|
<div class="d-flex gap-3 flex-wrap ps-2">
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="payment_methods_view" data-action="view" id="add_perm_payment_methods_view">
|
|
<label class="form-check-label small" for="add_perm_payment_methods_view">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="payment_methods_add" data-action="add" id="add_perm_payment_methods_add">
|
|
<label class="form-check-label small" for="add_perm_payment_methods_add">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="payment_methods_edit" data-action="edit" id="add_perm_payment_methods_edit">
|
|
<label class="form-check-label small" for="add_perm_payment_methods_edit">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="payment_methods_delete" data-action="delete" id="add_perm_payment_methods_delete">
|
|
<label class="form-check-label small" for="add_perm_payment_methods_delete">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 mb-2 border-bottom pb-2">
|
|
<div class="small fw-bold mb-2 text-dark border-start border-2 ps-2 border-info">الأجهزة</div>
|
|
<div class="d-flex gap-3 flex-wrap ps-2">
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="devices_view" data-action="view" id="add_perm_devices_view">
|
|
<label class="form-check-label small" for="add_perm_devices_view">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="devices_add" data-action="add" id="add_perm_devices_add">
|
|
<label class="form-check-label small" for="add_perm_devices_add">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="devices_edit" data-action="edit" id="add_perm_devices_edit">
|
|
<label class="form-check-label small" for="add_perm_devices_edit">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="devices_delete" data-action="delete" id="add_perm_devices_delete">
|
|
<label class="form-check-label small" for="add_perm_devices_delete">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 mb-2 border-bottom pb-2">
|
|
<div class="small fw-bold mb-2 text-dark border-start border-2 ps-2 border-info">الإعدادات</div>
|
|
<div class="d-flex gap-3 flex-wrap ps-2">
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="settings_view" data-action="view" id="add_perm_settings_view">
|
|
<label class="form-check-label small" for="add_perm_settings_view">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="settings_add" data-action="add" id="add_perm_settings_add">
|
|
<label class="form-check-label small" for="add_perm_settings_add">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="settings_edit" data-action="edit" id="add_perm_settings_edit">
|
|
<label class="form-check-label small" for="add_perm_settings_edit">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="settings_delete" data-action="delete" id="add_perm_settings_delete">
|
|
<label class="form-check-label small" for="add_perm_settings_delete">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="permission-group-container col-12 mb-4">
|
|
<div class="mt-3 mb-2 bg-secondary bg-opacity-10 p-2 d-flex justify-content-between align-items-center rounded border-start border-primary border-3">
|
|
<span class="fw-bold text-uppercase small text-primary">Administration</span>
|
|
<div class="form-check mb-0">
|
|
<input class="form-check-input select-all-group" type="checkbox" id="add_group_administration">
|
|
<label class="form-check-label small fw-bold" for="add_group_administration">Group All</label>
|
|
</div>
|
|
</div>
|
|
<div class="row g-3">
|
|
<div class="col-md-6 mb-2 border-bottom pb-2">
|
|
<div class="small fw-bold mb-2 text-dark border-start border-2 ps-2 border-info">مجموعات الأدوار</div>
|
|
<div class="d-flex gap-3 flex-wrap ps-2">
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="role_groups_view" data-action="view" id="add_perm_role_groups_view">
|
|
<label class="form-check-label small" for="add_perm_role_groups_view">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="role_groups_add" data-action="add" id="add_perm_role_groups_add">
|
|
<label class="form-check-label small" for="add_perm_role_groups_add">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="role_groups_edit" data-action="edit" id="add_perm_role_groups_edit">
|
|
<label class="form-check-label small" for="add_perm_role_groups_edit">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="role_groups_delete" data-action="delete" id="add_perm_role_groups_delete">
|
|
<label class="form-check-label small" for="add_perm_role_groups_delete">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 mb-2 border-bottom pb-2">
|
|
<div class="small fw-bold mb-2 text-dark border-start border-2 ps-2 border-info">المستخدمين</div>
|
|
<div class="d-flex gap-3 flex-wrap ps-2">
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="users_view" data-action="view" id="add_perm_users_view">
|
|
<label class="form-check-label small" for="add_perm_users_view">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="users_add" data-action="add" id="add_perm_users_add">
|
|
<label class="form-check-label small" for="add_perm_users_add">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="users_edit" data-action="edit" id="add_perm_users_edit">
|
|
<label class="form-check-label small" for="add_perm_users_edit">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="users_delete" data-action="delete" id="add_perm_users_delete">
|
|
<label class="form-check-label small" for="add_perm_users_delete">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 mb-2 border-bottom pb-2">
|
|
<div class="small fw-bold mb-2 text-dark border-start border-2 ps-2 border-info">صناديق الكاشير</div>
|
|
<div class="d-flex gap-3 flex-wrap ps-2">
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="cash_registers_view" data-action="view" id="add_perm_cash_registers_view">
|
|
<label class="form-check-label small" for="add_perm_cash_registers_view">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="cash_registers_add" data-action="add" id="add_perm_cash_registers_add">
|
|
<label class="form-check-label small" for="add_perm_cash_registers_add">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="cash_registers_edit" data-action="edit" id="add_perm_cash_registers_edit">
|
|
<label class="form-check-label small" for="add_perm_cash_registers_edit">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="cash_registers_delete" data-action="delete" id="add_perm_cash_registers_delete">
|
|
<label class="form-check-label small" for="add_perm_cash_registers_delete">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 mb-2 border-bottom pb-2">
|
|
<div class="small fw-bold mb-2 text-dark border-start border-2 ps-2 border-info">جلسات الكاشير</div>
|
|
<div class="d-flex gap-3 flex-wrap ps-2">
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="register_sessions_view" data-action="view" id="add_perm_register_sessions_view">
|
|
<label class="form-check-label small" for="add_perm_register_sessions_view">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="register_sessions_add" data-action="add" id="add_perm_register_sessions_add">
|
|
<label class="form-check-label small" for="add_perm_register_sessions_add">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="register_sessions_edit" data-action="edit" id="add_perm_register_sessions_edit">
|
|
<label class="form-check-label small" for="add_perm_register_sessions_edit">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="register_sessions_delete" data-action="delete" id="add_perm_register_sessions_delete">
|
|
<label class="form-check-label small" for="add_perm_register_sessions_delete">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 mb-2 border-bottom pb-2">
|
|
<div class="small fw-bold mb-2 text-dark border-start border-2 ps-2 border-info">System Logs</div>
|
|
<div class="d-flex gap-3 flex-wrap ps-2">
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="logs_view" data-action="view" id="add_perm_logs_view">
|
|
<label class="form-check-label small" for="add_perm_logs_view">View</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="logs_add" data-action="add" id="add_perm_logs_add">
|
|
<label class="form-check-label small" for="add_perm_logs_add">Add</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="logs_edit" data-action="edit" id="add_perm_logs_edit">
|
|
<label class="form-check-label small" for="add_perm_logs_edit">Edit</label>
|
|
</div>
|
|
<div class="form-check">
|
|
<input class="form-check-input perm-check" type="checkbox" name="permissions[]" value="logs_delete" data-action="delete" id="add_perm_logs_delete">
|
|
<label class="form-check-label small" for="add_perm_logs_delete">Delete</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-light" data-bs-dismiss="modal" data-en="Cancel" data-ar="إلغاء">Cancel</button>
|
|
<button type="submit" name="add_role_group" class="btn btn-primary" data-en="Save" data-ar="حفظ">Save</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Add User Modal -->
|
|
<div class="modal fade" id="addUserModal" tabindex="-1">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content border-0 shadow">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title" data-en="Add New User" data-ar="إضافة مستخدم جديد">Add New User</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
|
</div>
|
|
<form method="POST">
|
|
<div class="modal-body">
|
|
<div class="mb-3">
|
|
<label class="form-label" data-en="Username" data-ar="اسم المستخدم">Username</label>
|
|
<input type="text" name="username" class="form-control" required autocomplete="username">
|
|
</div>
|
|
<div class="mb-3">
|
|
<label class="form-label" data-en="Email" data-ar="البريد الإلكتروني">Email</label>
|
|
<input type="email" name="email" class="form-control" autocomplete="email">
|
|
</div>
|
|
<div class="mb-3">
|
|
<label class="form-label" data-en="Phone" data-ar="الهاتف">Phone</label>
|
|
<input type="text" name="phone" class="form-control" autocomplete="tel">
|
|
</div>
|
|
<div class="mb-3">
|
|
<label class="form-label" data-en="Password" data-ar="كلمة المرور">Password</label>
|
|
<input type="password" name="password" class="form-control" required autocomplete="new-password">
|
|
</div>
|
|
<div class="mb-3">
|
|
<label class="form-label" data-en="Role Group" data-ar="مجموعة الأدوار">Role Group</label>
|
|
<select name="group_id" class="form-select">
|
|
<option value="">--- Select Group ---</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-light" data-bs-dismiss="modal" data-en="Cancel" data-ar="إلغاء">Cancel</button>
|
|
<button type="submit" name="add_user" class="btn btn-primary" data-en="Save" data-ar="حفظ">Save</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Add Customer Modal -->
|
|
<div class="modal fade" id="addCustomerModal" tabindex="-1">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content border-0 shadow">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title">
|
|
<span data-en="Add New Customer" data-ar="إضافة عميل جديد">Add New Customer</span>
|
|
</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
|
</div>
|
|
<form method="POST">
|
|
<input type="hidden" name="type" value="customer">
|
|
<div class="modal-body">
|
|
<div class="mb-3">
|
|
<label class="form-label" data-en="Name" data-ar="الاسم">Name</label>
|
|
<input type="text" name="name" class="form-control" required>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label class="form-label" data-en="Email" data-ar="البريد الإلكتروني">Email</label>
|
|
<input type="email" name="email" class="form-control">
|
|
</div>
|
|
<div class="mb-3">
|
|
<label class="form-label" data-en="Phone" data-ar="الهاتف">Phone</label>
|
|
<input type="text" name="phone" class="form-control">
|
|
</div>
|
|
<div class="mb-3">
|
|
<label class="form-label" data-en="Tax ID / VAT No" data-ar="الرقم الضريبي">Tax ID / VAT No</label>
|
|
<input type="text" name="tax_id" class="form-control">
|
|
</div>
|
|
<div class="mb-3">
|
|
<label class="form-label" data-en="Initial Balance" data-ar="الرصيد الافتتاحي">Initial Balance</label>
|
|
<input type="number" step="0.001" name="balance" class="form-control" value="0.000">
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-light" data-bs-dismiss="modal" data-en="Cancel" data-ar="إلغاء">Cancel</button>
|
|
<button type="submit" name="add_customer" class="btn btn-primary" data-en="Save" data-ar="حفظ">Save</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Add Item Modal -->
|
|
<div class="modal fade" id="addItemModal" tabindex="-1">
|
|
<div class="modal-dialog modal-lg">
|
|
<div class="modal-content border-0 shadow">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title" data-en="Add New Item" data-ar="إضافة صنف جديد">Add New Item</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
|
</div>
|
|
<form method="POST" enctype="multipart/form-data">
|
|
<div class="modal-body">
|
|
<div class="row g-3">
|
|
<div class="col-md-6">
|
|
<label class="form-label" data-en="Name (EN)" data-ar="الاسم (إنجليزي)">Name (EN)</label>
|
|
<div class="input-group">
|
|
<input type="text" name="name_en" id="addItemNameEn" class="form-control" required>
|
|
<button class="btn btn-outline-secondary btn-translate" type="button" data-source="addItemNameAr" data-target="addItemNameEn" data-to="en">
|
|
<i class="bi bi-translate"></i> EN
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<label class="form-label" data-en="Name (AR)" data-ar="الاسم (عربي)">Name (AR)</label>
|
|
<div class="input-group">
|
|
<input type="text" name="name_ar" id="addItemNameAr" class="form-control" required>
|
|
<button class="btn btn-outline-secondary btn-translate" type="button" data-source="addItemNameEn" data-target="addItemNameAr" data-to="ar">
|
|
<i class="bi bi-translate"></i> AR
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<label class="form-label" data-en="Category" data-ar="الفئة">Category</label>
|
|
<select name="category_id" class="form-select">
|
|
<option value="">---</option>
|
|
<option value="3">Food Stuff / مواد غذائية</option>
|
|
</select>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<label class="form-label" data-en="Unit" data-ar="الوحدة">Unit</label>
|
|
<select name="unit_id" class="form-select">
|
|
<option value="">---</option>
|
|
<option value="5">Kg / كجم</option>
|
|
<option value="4">pcs / حبة</option>
|
|
</select>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<label class="form-label" data-en="Supplier" data-ar="المورد">Supplier</label>
|
|
<select name="supplier_id" class="form-select">
|
|
<option value="">---</option>
|
|
</select>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<label class="form-label" data-en="SKU / Barcode" data-ar="الباركود">SKU / Barcode</label>
|
|
<div class="input-group">
|
|
<input type="text" name="sku" id="skuInput" class="form-control">
|
|
<button class="btn btn-outline-secondary" type="button" id="suggestSkuBtn" data-en="Suggest" data-ar="اقتراح">Suggest</button>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-3">
|
|
<label class="form-label" data-en="Sale Price" data-ar="سعر البيع">Sale Price</label>
|
|
<input type="number" step="0.001" name="sale_price" class="form-control" value="0.000">
|
|
</div>
|
|
<div class="col-md-3">
|
|
<label class="form-label" data-en="Purchase Price" data-ar="سعر الشراء">Purchase Price</label>
|
|
<input type="number" step="0.001" name="purchase_price" class="form-control" value="0.000">
|
|
</div>
|
|
<div class="col-md-4">
|
|
<label class="form-label" data-en="Initial Stock" data-ar="المخزون الحالي">Initial Stock</label>
|
|
<input type="number" step="0.001" name="stock_quantity" class="form-control" value="0.000">
|
|
</div>
|
|
<div class="col-md-4">
|
|
<label class="form-label" data-en="Min Stock Level" data-ar="الحد الأدنى للمخزون">Min Stock Level</label>
|
|
<input type="number" step="0.001" name="min_stock_level" class="form-control" value="0.000">
|
|
</div>
|
|
<div class="col-md-4">
|
|
<label class="form-label" data-en="Item Picture" data-ar="صورة الصنف">Item Picture</label>
|
|
<input type="file" name="image" class="form-control" accept="image/*">
|
|
</div>
|
|
<div class="col-md-4">
|
|
<label class="form-label" data-en="VAT Rate (%)" data-ar="ضريبة القيمة المضافة (%)">VAT Rate (%)</label>
|
|
<input type="number" step="0.01" name="vat_rate" class="form-control" value="0">
|
|
</div>
|
|
<div class="col-md-8">
|
|
<div class="form-check form-switch mt-4">
|
|
<input class="form-check-input" type="checkbox" id="hasExpiryToggle">
|
|
<label class="form-check-label" for="hasExpiryToggle" data-en="Has Expiry Date?" data-ar="هل له تاريخ انتهاء؟">Has Expiry Date?</label>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6" id="expiryDateContainer" style="display: none;">
|
|
<label class="form-label" data-en="Expiry Date" data-ar="تاريخ الانتهاء">Expiry Date</label>
|
|
<input type="date" name="expiry_date" class="form-control">
|
|
</div>
|
|
<div class="col-12 mt-3">
|
|
<hr>
|
|
<h6 data-en="Promotion Details" data-ar="تفاصيل العرض">Promotion Details</h6>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<div class="form-check form-switch mt-4">
|
|
<input class="form-check-input" type="checkbox" name="is_promotion" id="isPromotionToggle">
|
|
<label class="form-check-label" for="isPromotionToggle" data-en="On Promotion?" data-ar="في العرض؟">On Promotion?</label>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-8">
|
|
<div class="row g-3" id="promotionFieldsContainer" style="display: none;">
|
|
<div class="col-md-4">
|
|
<label class="form-label" data-en="Start Date" data-ar="تاريخ البدء">Start Date</label>
|
|
<input type="date" name="promotion_start" class="form-control">
|
|
</div>
|
|
<div class="col-md-4">
|
|
<label class="form-label" data-en="End Date" data-ar="تاريخ الانتهاء">End Date</label>
|
|
<input type="date" name="promotion_end" class="form-control">
|
|
</div>
|
|
<div class="col-md-4">
|
|
<label class="form-label" data-en="Percent (%)" data-ar="النسبة (%)">Percent (%)</label>
|
|
<input type="number" step="0.01" name="promotion_percent" class="form-control" value="0.00">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-light" data-bs-dismiss="modal" data-en="Cancel" data-ar="إلغاء">Cancel</button>
|
|
<button type="submit" name="add_item" class="btn btn-primary" data-en="Save Item" data-ar="حفظ الصنف">Save Item</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Import Items Modal -->
|
|
<div class="modal fade" id="importItemsModal" tabindex="-1">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content border-0 shadow text-start">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title" data-en="Import Items from Excel (CSV)" data-ar="استيراد الأصناف من اكسل (CSV)">Import Items from Excel (CSV)</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
|
</div>
|
|
<form method="POST" enctype="multipart/form-data">
|
|
<div class="modal-body">
|
|
<div class="alert alert-info py-2">
|
|
<div class="mb-2">
|
|
<small data-en="Please upload a CSV file with the following columns: SKU, English Name, Arabic Name, Sale Price, Cost Price." data-ar="يرجى رفع ملف CSV بالأعمدة التالية: الباركود، الاسم الإنجليزي، الاسم العربي، سعر البيع، سعر التكلفة.">
|
|
Please upload a CSV file with the following columns: SKU, English Name, Arabic Name, Sale Price, Cost Price.
|
|
</small>
|
|
</div>
|
|
<a href="index.php?action=download_items_template" class="btn btn-sm btn-primary">
|
|
<i class="bi bi-download"></i> <span data-en="Download Template" data-ar="تحميل القالب">Download Template</span>
|
|
</a>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label class="form-label" data-en="Choose CSV File" data-ar="اختر ملف CSV">Choose CSV File</label>
|
|
<input type="file" name="excel_file" class="form-control" accept=".csv" required>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-light" data-bs-dismiss="modal" data-en="Cancel" data-ar="إلغاء">Cancel</button>
|
|
<button type="submit" name="import_items" class="btn btn-success" data-en="Import Now" data-ar="استيراد الآن">Import Now</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Import Customers Modal -->
|
|
<div class="modal fade" id="importCustomersModal" tabindex="-1">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content border-0 shadow text-start">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title" data-en="Import Customers from Excel (CSV)" data-ar="استيراد العملاء من اكسل (CSV)">Import Customers from Excel (CSV)</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
|
</div>
|
|
<form method="POST" enctype="multipart/form-data">
|
|
<div class="modal-body">
|
|
<div class="alert alert-info py-2">
|
|
<small data-en="Please upload a CSV file with the following columns: Name, Email, Phone, Tax ID, Balance." data-ar="يرجى رفع ملف CSV بالأعمدة التالية: الاسم، البريد الإلكتروني، الهاتف، الرقم الضريبي، الرصيد.">
|
|
Please upload a CSV file with the following columns: Name, Email, Phone, Tax ID, Balance.
|
|
</small>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label class="form-label" data-en="Choose CSV File" data-ar="اختر ملف CSV">Choose CSV File</label>
|
|
<input type="file" name="excel_file" class="form-control" accept=".csv" required>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-light" data-bs-dismiss="modal" data-en="Cancel" data-ar="إلغاء">Cancel</button>
|
|
<button type="submit" name="import_customers" class="btn btn-success" data-en="Import Now" data-ar="استيراد الآن">Import Now</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Import Suppliers Modal -->
|
|
<div class="modal fade" id="importSuppliersModal" tabindex="-1">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content border-0 shadow text-start">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title" data-en="Import Suppliers from Excel (CSV)" data-ar="استيراد الموردين من اكسل (CSV)">Import Suppliers from Excel (CSV)</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
|
</div>
|
|
<form method="POST" enctype="multipart/form-data">
|
|
<div class="modal-body">
|
|
<div class="alert alert-info py-2">
|
|
<small data-en="Please upload a CSV file with the following columns: Name, Email, Phone, Tax ID, Balance." data-ar="يرجى رفع ملف CSV بالأعمدة التالية: الاسم، البريد الإلكتروني، الهاتف، الرقم الضريبي، الرصيد.">
|
|
Please upload a CSV file with the following columns: Name, Email, Phone, Tax ID, Balance.
|
|
</small>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label class="form-label" data-en="Choose CSV File" data-ar="اختر ملف CSV">Choose CSV File</label>
|
|
<input type="file" name="excel_file" class="form-control" accept=".csv" required>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-light" data-bs-dismiss="modal" data-en="Cancel" data-ar="إلغاء">Cancel</button>
|
|
<button type="submit" name="import_suppliers" class="btn btn-success" data-en="Import Now" data-ar="استيراد الآن">Import Now</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Import Categories Modal -->
|
|
<div class="modal fade" id="importCategoriesModal" tabindex="-1">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content border-0 shadow text-start">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title" data-en="Import Categories from Excel (CSV)" data-ar="استيراد الفئات من اكسل (CSV)">Import Categories from Excel (CSV)</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
|
</div>
|
|
<form method="POST" enctype="multipart/form-data">
|
|
<div class="modal-body">
|
|
<div class="alert alert-info py-2">
|
|
<small data-en="Please upload a CSV file with the following columns: Name (EN), Name (AR)." data-ar="يرجى رفع ملف CSV بالأعمدة التالية: الاسم (إنجليزي)، الاسم (عربي).">
|
|
Please upload a CSV file with the following columns: Name (EN), Name (AR).
|
|
</small>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label class="form-label" data-en="Choose CSV File" data-ar="اختر ملف CSV">Choose CSV File</label>
|
|
<input type="file" name="excel_file" class="form-control" accept=".csv" required>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-light" data-bs-dismiss="modal" data-en="Cancel" data-ar="إلغاء">Cancel</button>
|
|
<button type="submit" name="import_categories" class="btn btn-success" data-en="Import Now" data-ar="استيراد الآن">Import Now</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Import Units Modal -->
|
|
<div class="modal fade" id="importUnitsModal" tabindex="-1">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content border-0 shadow text-start">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title" data-en="Import Units from Excel (CSV)" data-ar="استيراد الوحدات من اكسل (CSV)">Import Units from Excel (CSV)</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
|
</div>
|
|
<form method="POST" enctype="multipart/form-data">
|
|
<div class="modal-body">
|
|
<div class="alert alert-info py-2">
|
|
<small data-en="Please upload a CSV file with the following columns: Name (EN), Name (AR), Short (EN), Short (AR)." data-ar="يرجى رفع ملف CSV بالأعمدة التالية: الاسم (إنجليزي)، الاسم (عربي)، الاختصار (إنجليزي)، الاختصار (عربي).">
|
|
Please upload a CSV file with the following columns: Name (EN), Name (AR), Short (EN), Short (AR).
|
|
</small>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label class="form-label" data-en="Choose CSV File" data-ar="اختر ملف CSV">Choose CSV File</label>
|
|
<input type="file" name="excel_file" class="form-control" accept=".csv" required>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-light" data-bs-dismiss="modal" data-en="Cancel" data-ar="إلغاء">Cancel</button>
|
|
<button type="submit" name="import_units" class="btn btn-success" data-en="Import Now" data-ar="استيراد الآن">Import Now</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Add Category Modal -->
|
|
<div class="modal fade" id="addCategoryModal" tabindex="-1">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content border-0 shadow">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title" data-en="Add Category" data-ar="إضافة فئة">Add Category</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
|
</div>
|
|
<form method="POST">
|
|
<div class="modal-body">
|
|
<div class="mb-3">
|
|
<label class="form-label" data-en="Name (EN)" data-ar="الاسم (إنجليزي)">Name (EN)</label>
|
|
<div class="input-group">
|
|
<input type="text" name="name_en" id="addCatNameEn" class="form-control" required>
|
|
<button class="btn btn-outline-secondary btn-translate" type="button" data-source="addCatNameAr" data-target="addCatNameEn" data-to="en">
|
|
<i class="bi bi-translate"></i>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label class="form-label" data-en="Name (AR)" data-ar="الاسم (عربي)">Name (AR)</label>
|
|
<div class="input-group">
|
|
<input type="text" name="name_ar" id="addCatNameAr" class="form-control" required>
|
|
<button class="btn btn-outline-secondary btn-translate" type="button" data-source="addCatNameEn" data-target="addCatNameAr" data-to="ar">
|
|
<i class="bi bi-translate"></i>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-light" data-bs-dismiss="modal" data-en="Cancel" data-ar="إلغاء">Cancel</button>
|
|
<button type="submit" name="add_category" class="btn btn-primary" data-en="Save" data-ar="حفظ">Save</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Add Unit Modal -->
|
|
<div class="modal fade" id="addUnitModal" tabindex="-1">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content border-0 shadow">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title" data-en="Add Unit" data-ar="إضافة وحدة">Add Unit</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
|
</div>
|
|
<form method="POST">
|
|
<div class="modal-body">
|
|
<div class="row g-3">
|
|
<div class="col-md-6">
|
|
<label class="form-label" data-en="Name (EN)" data-ar="الاسم (إنجليزي)">Name (EN)</label>
|
|
<div class="input-group">
|
|
<input type="text" name="name_en" id="addUnitNameEn" class="form-control" required>
|
|
<button class="btn btn-outline-secondary btn-translate" type="button" data-source="addUnitNameAr" data-target="addUnitNameEn" data-to="en">
|
|
<i class="bi bi-translate"></i>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<label class="form-label" data-en="Short Name (EN)" data-ar="الاختصار (إنجليزي)">Short (EN)</label>
|
|
<input type="text" name="short_en" class="form-control" required placeholder="e.g. Kg">
|
|
</div>
|
|
<div class="col-md-6">
|
|
<label class="form-label" data-en="Name (AR)" data-ar="الاسم (عربي)">Name (AR)</label>
|
|
<div class="input-group">
|
|
<input type="text" name="name_ar" id="addUnitNameAr" class="form-control" required>
|
|
<button class="btn btn-outline-secondary btn-translate" type="button" data-source="addUnitNameEn" data-target="addUnitNameAr" data-to="ar">
|
|
<i class="bi bi-translate"></i>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<label class="form-label" data-en="Short Name (AR)" data-ar="الاختصار (عربي)">Short (AR)</label>
|
|
<input type="text" name="short_ar" class="form-control" required placeholder="مثلاً: كجم">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-light" data-bs-dismiss="modal" data-en="Cancel" data-ar="إلغاء">Cancel</button>
|
|
<button type="submit" name="add_unit" class="btn btn-primary" data-en="Save" data-ar="حفظ">Save</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
console.log("DOM Content Loaded - Accounting System");
|
|
try {
|
|
// Initialize Select2 for all searchable dropdowns
|
|
$('.select2').each(function() {
|
|
$(this).select2({
|
|
width: '100%',
|
|
dropdownParent: $(this).closest('.modal').length ? $(this).closest('.modal') : $(document.body)
|
|
});
|
|
});
|
|
|
|
const hasExpiryToggle = document.getElementById('hasExpiryToggle');
|
|
const expiryDateContainer = document.getElementById('expiryDateContainer');
|
|
const suggestSkuBtn = document.getElementById('suggestSkuBtn');
|
|
const skuInput = document.getElementById('skuInput');
|
|
|
|
if (suggestSkuBtn && skuInput) {
|
|
suggestSkuBtn.addEventListener('click', function() {
|
|
const sku = Math.floor(100000000000 + Math.random() * 900000000000).toString();
|
|
skuInput.value = sku;
|
|
});
|
|
|
|
skuInput.addEventListener('keydown', function(e) {
|
|
if (e.key === 'Enter') {
|
|
e.preventDefault();
|
|
console.log("Barcode scan detected in SKU field, preventing form submission");
|
|
}
|
|
});
|
|
}
|
|
|
|
// Toggle Expiry Date visibility
|
|
if (hasExpiryToggle && expiryDateContainer) {
|
|
hasExpiryToggle.addEventListener('change', function() {
|
|
expiryDateContainer.style.display = this.checked ? 'block' : 'none';
|
|
});
|
|
}
|
|
|
|
const isPromotionToggle = document.getElementById('isPromotionToggle');
|
|
const promotionFieldsContainer = document.getElementById('promotionFieldsContainer');
|
|
if (isPromotionToggle && promotionFieldsContainer) {
|
|
isPromotionToggle.addEventListener('change', function() {
|
|
promotionFieldsContainer.style.display = this.checked ? 'flex' : 'none';
|
|
});
|
|
}
|
|
|
|
// Translation Logic
|
|
document.querySelectorAll('.btn-translate').forEach(btn => {
|
|
btn.addEventListener('click', function() {
|
|
const sourceId = this.getAttribute('data-source');
|
|
const targetId = this.getAttribute('data-target');
|
|
const targetLang = this.getAttribute('data-to');
|
|
const sourceText = document.getElementById(sourceId).value;
|
|
|
|
if (!sourceText) {
|
|
alert(targetLang === 'ar' ? 'يرجى إدخال النص أولاً' : 'Please enter text first');
|
|
return;
|
|
}
|
|
|
|
const originalHtml = this.innerHTML;
|
|
this.disabled = true;
|
|
this.innerHTML = '<span class="spinner-border spinner-border-sm"></span>';
|
|
|
|
const formData = new FormData();
|
|
formData.append('action', 'translate');
|
|
formData.append('text', sourceText);
|
|
formData.append('target', targetLang);
|
|
|
|
fetch('index.php', {
|
|
method: 'POST',
|
|
body: formData
|
|
})
|
|
.then(res => res.json())
|
|
.then(data => {
|
|
if (data.success) {
|
|
document.getElementById(targetId).value = data.translated;
|
|
} else {
|
|
alert('Translation error: ' + (data.error || 'Unknown error'));
|
|
}
|
|
})
|
|
.catch(err => {
|
|
console.error(err);
|
|
alert('Connection error');
|
|
})
|
|
.finally(() => {
|
|
this.disabled = false;
|
|
this.innerHTML = originalHtml;
|
|
});
|
|
});
|
|
});
|
|
|
|
document.querySelectorAll('.isPromotionToggleEdit').forEach(toggle => {
|
|
toggle.addEventListener('change', function() {
|
|
const id = this.getAttribute('data-id');
|
|
const container = document.getElementById('promotionFieldsContainerEdit' + id);
|
|
if (container) {
|
|
container.style.display = this.checked ? 'flex' : 'none';
|
|
}
|
|
});
|
|
});
|
|
|
|
// Status change logic for Paid Amount field
|
|
const togglePaidAmount = (statusId, containerId) => {
|
|
const statusEl = document.getElementById(statusId);
|
|
const containerEl = document.getElementById(containerId);
|
|
if (statusEl && containerEl) {
|
|
statusEl.addEventListener('change', function() {
|
|
if (this.value === 'partially_paid') {
|
|
containerEl.style.display = 'block';
|
|
} else {
|
|
containerEl.style.display = 'none';
|
|
}
|
|
});
|
|
}
|
|
};
|
|
togglePaidAmount('add_status', 'addPaidAmountContainer');
|
|
togglePaidAmount('edit_status', 'editPaidAmountContainer');
|
|
|
|
// Pay Invoice Logic
|
|
document.querySelectorAll('.pay-invoice-btn').forEach(btn => {
|
|
btn.addEventListener('click', function() {
|
|
const id = this.getAttribute('data-id');
|
|
const total = parseFloat(this.getAttribute('data-total'));
|
|
const paid = parseFloat(this.getAttribute('data-paid') || 0);
|
|
const remaining = total - paid;
|
|
|
|
document.getElementById('pay_invoice_id').value = id;
|
|
document.getElementById('pay_invoice_total').value = total.toFixed(3);
|
|
document.getElementById('pay_remaining_amount').value = remaining.toFixed(3);
|
|
document.getElementById('pay_amount').value = remaining.toFixed(3);
|
|
document.getElementById('pay_amount').max = remaining.toFixed(3);
|
|
});
|
|
});
|
|
|
|
// Show receipt modal if needed
|
|
|
|
function showReceipt(paymentId) {
|
|
fetch(`index.php?action=get_payment_details&payment_id=${paymentId}`)
|
|
.then(res => res.json())
|
|
.then(data => {
|
|
if (!data) return;
|
|
document.getElementById('receiptNo').textContent = 'RCP-' + data.id.toString().padStart(5, '0');
|
|
document.getElementById('receiptDate').textContent = data.payment_date;
|
|
document.getElementById('receiptCustomer').textContent = data.customer_name || '---';
|
|
document.getElementById('receiptInvNo').textContent = (data.inv_type === 'purchase' ? 'PUR-' : 'INV-') + data.inv_id.toString().padStart(5, '0');
|
|
document.getElementById('receiptMethod').textContent = data.payment_method;
|
|
document.getElementById('receiptAmount').textContent = parseFloat(data.amount).toFixed(3);
|
|
document.getElementById('receiptAmountWords').textContent = data.amount_words;
|
|
|
|
// Update labels for Purchase vs Sale
|
|
const partyLabel = document.getElementById('receiptPartyLabel');
|
|
const againstLabel = document.getElementById('receiptAgainstLabel');
|
|
const receiptTitle = document.querySelector('#receiptModal .modal-title');
|
|
const receiptH4 = document.querySelector('.receipt-container h4.letter-spacing-2');
|
|
|
|
if (data.inv_type === 'purchase') {
|
|
partyLabel.textContent = 'Paid To';
|
|
partyLabel.setAttribute('data-en', 'Paid To');
|
|
partyLabel.setAttribute('data-ar', 'صرف إلى');
|
|
|
|
againstLabel.textContent = 'Against Purchase';
|
|
againstLabel.setAttribute('data-en', 'Against Purchase');
|
|
againstLabel.setAttribute('data-ar', 'مقابل شراء');
|
|
|
|
receiptTitle.textContent = 'Payment Voucher';
|
|
receiptTitle.setAttribute('data-en', 'Payment Voucher');
|
|
receiptTitle.setAttribute('data-ar', 'سند صرف');
|
|
|
|
receiptH4.textContent = 'PAYMENT VOUCHER';
|
|
receiptH4.setAttribute('data-en', 'PAYMENT VOUCHER');
|
|
receiptH4.setAttribute('data-ar', 'سند صرف');
|
|
} else {
|
|
partyLabel.textContent = 'Received From';
|
|
partyLabel.setAttribute('data-en', 'Received From');
|
|
partyLabel.setAttribute('data-ar', 'وصلنا من');
|
|
|
|
againstLabel.textContent = 'Against Invoice';
|
|
againstLabel.setAttribute('data-en', 'Against Invoice');
|
|
againstLabel.setAttribute('data-ar', 'مقابل فاتورة');
|
|
|
|
receiptTitle.textContent = 'Payment Receipt';
|
|
receiptTitle.setAttribute('data-en', 'Payment Receipt');
|
|
receiptTitle.setAttribute('data-ar', 'سند قبض');
|
|
|
|
receiptH4.textContent = 'PAYMENT RECEIPT';
|
|
receiptH4.setAttribute('data-en', 'PAYMENT RECEIPT');
|
|
receiptH4.setAttribute('data-ar', 'سند قبض');
|
|
}
|
|
|
|
const notesContainer = document.getElementById('receiptNotesContainer');
|
|
if (data.notes) {
|
|
document.getElementById('receiptNotes').textContent = data.notes;
|
|
notesContainer.style.display = 'block';
|
|
} else {
|
|
notesContainer.style.display = 'none';
|
|
}
|
|
|
|
const receiptModal = new bootstrap.Modal(document.getElementById('receiptModal'));
|
|
receiptModal.show();
|
|
});
|
|
};
|
|
|
|
document.querySelectorAll('.view-payments-btn').forEach(btn => {
|
|
btn.addEventListener('click', function() {
|
|
const invoiceId = this.getAttribute('data-id');
|
|
const tbody = document.getElementById('paymentsTableBody');
|
|
tbody.innerHTML = '<tr><td colspan="5" class="text-center" data-en="Loading..." data-ar="جاري التحميل...">Loading...</td></tr>';
|
|
|
|
fetch(`index.php?action=get_payments&invoice_id=${invoiceId}`)
|
|
.then(res => res.json())
|
|
.then(data => {
|
|
tbody.innerHTML = '';
|
|
if (data.length === 0) {
|
|
tbody.innerHTML = '<tr><td colspan="5" class="text-center" data-en="No payments found." data-ar="لا توجد مدفوعات.">No payments found.</td></tr>';
|
|
return;
|
|
}
|
|
data.forEach(p => {
|
|
const tr = document.createElement('tr');
|
|
tr.innerHTML = `
|
|
<td>RCP-${p.id.toString().padStart(5, '0')}</td>
|
|
<td>${p.payment_date}</td>
|
|
<td>${p.payment_method}</td>
|
|
<td class="text-end fw-bold">OMR ${parseFloat(p.amount).toFixed(3)}</td>
|
|
<td class="text-end">
|
|
<button class="btn btn-sm btn-outline-primary" onclick="showReceipt(${p.id})">
|
|
<i class="bi bi-printer"></i>
|
|
</button>
|
|
</td>
|
|
`;
|
|
tbody.appendChild(tr);
|
|
});
|
|
});
|
|
});
|
|
});
|
|
|
|
window.printReceipt = function() {
|
|
const content = document.getElementById('printableReceipt').innerHTML;
|
|
const originalContent = document.body.innerHTML;
|
|
document.body.innerHTML = content;
|
|
window.print();
|
|
document.body.innerHTML = originalContent;
|
|
window.location.reload();
|
|
};
|
|
|
|
// Handle Expiry toggle in Edit Modals
|
|
document.querySelectorAll('.hasExpiryToggleEdit').forEach(toggle => {
|
|
toggle.addEventListener('change', function() {
|
|
const container = this.closest('.row').querySelector('.expiryDateContainerEdit');
|
|
if (container) {
|
|
container.style.display = this.checked ? 'block' : 'none';
|
|
if (!this.checked) {
|
|
container.querySelector('input').value = '';
|
|
}
|
|
}
|
|
});
|
|
});
|
|
|
|
// Invoice Form Logic
|
|
const initInvoiceForm = (searchInputId, suggestionsId, tableBodyId, grandTotalId, subtotalId, totalVatId) => {
|
|
const searchInput = document.getElementById(searchInputId);
|
|
const suggestions = document.getElementById(suggestionsId);
|
|
const tableBody = document.getElementById(tableBodyId);
|
|
const grandTotalEl = document.getElementById(grandTotalId);
|
|
const subtotalEl = document.getElementById(subtotalId);
|
|
const totalVatEl = document.getElementById(totalVatId);
|
|
|
|
if (!searchInput || !tableBody) return;
|
|
|
|
let timeout = null;
|
|
searchInput.addEventListener('input', function() {
|
|
clearTimeout(timeout);
|
|
const q = this.value.trim();
|
|
if (q.length < 2) {
|
|
suggestions.style.display = 'none';
|
|
return;
|
|
}
|
|
|
|
timeout = setTimeout(() => {
|
|
fetch(`index.php?action=search_items&q=${encodeURIComponent(q)}`)
|
|
.then(res => res.ok ? res.json() : [])
|
|
.then(data => {
|
|
suggestions.innerHTML = '';
|
|
if (data.length > 0) {
|
|
data.forEach(item => {
|
|
const btn = document.createElement('button');
|
|
btn.type = 'button';
|
|
btn.className = 'list-group-item list-group-item-action';
|
|
btn.innerHTML = `
|
|
<div class="d-flex justify-content-between">
|
|
<span><strong>${item.sku}</strong> - ${item.name_en} / ${item.name_ar}</span>
|
|
<span class="text-muted small">Stock: ${item.stock_quantity}</span>
|
|
</div>
|
|
`;
|
|
btn.onclick = () => addItemToTable(item, tableBody, searchInput, suggestions, grandTotalEl, subtotalEl, totalVatEl);
|
|
suggestions.appendChild(btn);
|
|
});
|
|
suggestions.style.display = 'block';
|
|
} else {
|
|
suggestions.style.display = 'none';
|
|
}
|
|
});
|
|
}, 300);
|
|
});
|
|
|
|
// Close suggestions when clicking outside
|
|
document.addEventListener('click', function(e) {
|
|
if (!searchInput.contains(e.target) && !suggestions.contains(e.target)) {
|
|
suggestions.style.display = 'none';
|
|
}
|
|
});
|
|
};
|
|
|
|
function addItemToTable(item, tableBody, searchInput, suggestions, grandTotalEl, subtotalEl, totalVatEl, customData = null) {
|
|
if (suggestions) suggestions.style.display = 'none';
|
|
if (searchInput) searchInput.value = '';
|
|
|
|
const allowZeroStock = (typeof companySettings !== 'undefined' && String(companySettings.allow_zero_stock_sell) === '1');
|
|
const currentStock = parseFloat(item.stock_quantity) || 0;
|
|
|
|
if (invoiceType === 'sale' && !allowZeroStock && !customData) {
|
|
const existingInTable = Array.from(tableBody.querySelectorAll('.item-row')).find(row => row.querySelector('.item-id-input').value == item.id);
|
|
let currentQtyInTable = 0;
|
|
if (existingInTable) {
|
|
currentQtyInTable = parseFloat(existingInTable.querySelector('.item-qty').value) || 0;
|
|
}
|
|
|
|
if (currentQtyInTable + 1 > currentStock) {
|
|
alert('Insufficient stock! Available: ' + currentStock);
|
|
return;
|
|
}
|
|
}
|
|
|
|
const existingRow = Array.from(tableBody.querySelectorAll('.item-id-input')).find(input => input.value == item.id);
|
|
if (existingRow && !customData) {
|
|
const row = existingRow.closest('tr');
|
|
const qtyInput = row.querySelector('.item-qty');
|
|
qtyInput.value = parseFloat(qtyInput.value) + 1;
|
|
recalculate(tableBody, grandTotalEl, subtotalEl, totalVatEl);
|
|
return;
|
|
}
|
|
|
|
const row = document.createElement('tr');
|
|
row.className = 'item-row';
|
|
const price = customData ? customData.unit_price : (invoiceType === 'sale' ? item.sale_price : item.purchase_price);
|
|
const qty = customData ? customData.quantity : 1;
|
|
const vatRate = item.vat_rate || 0;
|
|
|
|
row.innerHTML = `
|
|
<td>
|
|
<input type="hidden" name="item_ids[]" class="item-id-input" value="${item.id}">
|
|
<input type="hidden" class="item-row-stock" value="${item.stock_quantity}">
|
|
<input type="hidden" class="item-vat-rate" value="${vatRate}">
|
|
<div><strong>${item.name_en}</strong></div>
|
|
<div class="small text-muted">${item.name_ar} (${item.sku})</div>
|
|
</td>
|
|
<td><input type="number" step="0.001" name="quantities[]" class="form-control item-qty" value="${qty}" required></td>
|
|
<td><input type="number" step="0.001" name="prices[]" class="form-control item-price" value="${price}" required></td>
|
|
<td><input type="text" class="form-control bg-light" value="${parseFloat(vatRate || 0).toFixed(2)}%" readonly></td>
|
|
<td><input type="number" step="0.001" class="form-control item-total" value="${(qty * price).toFixed(3)}" readonly></td>
|
|
<td><button type="button" class="btn btn-outline-danger btn-sm remove-row"><i class="bi bi-trash"></i></button></td>
|
|
`;
|
|
|
|
tableBody.appendChild(row);
|
|
attachRowListeners(row, tableBody, grandTotalEl, subtotalEl, totalVatEl);
|
|
recalculate(tableBody, grandTotalEl, subtotalEl, totalVatEl);
|
|
}
|
|
|
|
function recalculate(tableBody, grandTotalEl, subtotalEl, totalVatEl) {
|
|
let subtotal = 0;
|
|
let totalVat = 0;
|
|
tableBody.querySelectorAll('.item-row').forEach(row => {
|
|
const qty = parseFloat(row.querySelector('.item-qty').value) || 0;
|
|
const price = parseFloat(row.querySelector('.item-price').value) || 0;
|
|
const vatRate = parseFloat(row.querySelector('.item-vat-rate').value) || 0;
|
|
|
|
const total = qty * price;
|
|
const vatAmount = total * (vatRate / 100);
|
|
|
|
row.querySelector('.item-total').value = total.toFixed(3);
|
|
subtotal += total;
|
|
totalVat += vatAmount;
|
|
});
|
|
const grandTotal = subtotal + totalVat;
|
|
|
|
if (subtotalEl) subtotalEl.textContent = 'OMR ' + subtotal.toFixed(3);
|
|
if (totalVatEl) totalVatEl.textContent = 'OMR ' + totalVat.toFixed(2);
|
|
if (grandTotalEl) grandTotalEl.textContent = 'OMR ' + grandTotal.toFixed(3);
|
|
}
|
|
|
|
function attachRowListeners(row, tableBody, grandTotalEl, subtotalEl, totalVatEl) {
|
|
row.querySelector('.item-qty').addEventListener('input', function() {
|
|
const allowZeroStock = (typeof companySettings !== 'undefined' && String(companySettings.allow_zero_stock_sell) === '1');
|
|
if (invoiceType === 'sale' && !allowZeroStock) {
|
|
const stock = parseFloat(row.querySelector('.item-row-stock').value) || 0;
|
|
const qty = parseFloat(this.value) || 0;
|
|
if (qty > stock) {
|
|
alert('Insufficient stock! Available: ' + stock);
|
|
this.value = stock;
|
|
}
|
|
}
|
|
recalculate(tableBody, grandTotalEl, subtotalEl, totalVatEl);
|
|
});
|
|
row.querySelector('.item-price').addEventListener('input', () => recalculate(tableBody, grandTotalEl, subtotalEl, totalVatEl));
|
|
row.querySelector('.remove-row').addEventListener('click', function() {
|
|
row.remove();
|
|
recalculate(tableBody, grandTotalEl, subtotalEl, totalVatEl);
|
|
});
|
|
}
|
|
|
|
const invoiceType = '';
|
|
initInvoiceForm('productSearchInput', 'searchSuggestions', 'invoiceItemsTableBody', 'grandTotal', 'subtotal', 'totalVat');
|
|
initInvoiceForm('editProductSearchInput', 'editSearchSuggestions', 'editInvoiceItemsTableBody', 'edit_grandTotal', 'edit_subtotal', 'edit_totalVat');
|
|
|
|
// LPO Form Logic
|
|
initInvoiceForm('lpoProductSearchInput', 'lpoSearchSuggestions', 'lpoItemsTableBody', 'lpo_grand_display', 'lpo_subtotal_display', 'lpo_vat_display');
|
|
initInvoiceForm('editLpoProductSearchInput', 'editLpoSearchSuggestions', 'editLpoItemsTableBody', 'edit_lpo_grand_display', 'edit_lpo_subtotal_display', 'edit_lpo_vat_display');
|
|
|
|
document.querySelectorAll('.edit-lpo-btn').forEach(btn => {
|
|
btn.addEventListener('click', function() {
|
|
const data = JSON.parse(this.dataset.json);
|
|
document.getElementById('edit_lpo_id').value = data.id;
|
|
const supplierSelect = document.getElementById('edit_lpo_supplier_id');
|
|
supplierSelect.value = data.supplier_id;
|
|
if (window.jQuery && $(supplierSelect).data('select2')) {
|
|
$(supplierSelect).trigger('change');
|
|
}
|
|
document.getElementById('edit_lpo_date').value = data.lpo_date;
|
|
document.getElementById('edit_lpo_delivery_date').value = data.delivery_date || '';
|
|
document.getElementById('edit_lpo_status').value = data.status || 'pending';
|
|
document.getElementById('edit_lpo_terms').value = data.terms_conditions || '';
|
|
|
|
const tableBody = document.getElementById('editLpoItemsTableBody');
|
|
tableBody.innerHTML = '';
|
|
|
|
data.items.forEach(item => {
|
|
addItemToTable({
|
|
id: item.item_id,
|
|
name_en: item.name_en,
|
|
name_ar: item.name_ar,
|
|
sku: '',
|
|
vat_rate: item.vat_rate || 0
|
|
}, tableBody, null, null,
|
|
document.getElementById('edit_lpo_grand_display'),
|
|
document.getElementById('edit_lpo_subtotal_display'),
|
|
document.getElementById('edit_lpo_vat_display'),
|
|
{ quantity: item.quantity, unit_price: item.unit_price });
|
|
});
|
|
});
|
|
});
|
|
|
|
document.querySelectorAll('.view-lpo-btn').forEach(btn => {
|
|
btn.addEventListener('click', function() {
|
|
const data = JSON.parse(this.dataset.json);
|
|
window.viewAndPrintLPO(data);
|
|
});
|
|
});
|
|
|
|
window.viewAndPrintLPO = function(data) {
|
|
const modal = new bootstrap.Modal(document.getElementById('viewLpoModal'));
|
|
const content = document.getElementById('lpoDetailsContent');
|
|
|
|
const logoUrl = companySettings.company_logo || '';
|
|
const companyHeader = `
|
|
<div class="row align-items-center mb-4">
|
|
<div class="col-6">
|
|
${logoUrl ? `<img src="${logoUrl}" alt="Logo" style="max-height: 80px;" class="mb-3">` : ''}
|
|
<h4 class="fw-bold mb-0">${companySettings.company_name || 'Your Company'}</h4>
|
|
<p class="text-muted mb-0 small">
|
|
${companySettings.company_address || ''}<br>
|
|
Phone: ${companySettings.company_phone || ''} | Email: ${companySettings.company_email || ''}
|
|
${companySettings.tax_number ? `<br>TRN: ${companySettings.tax_number}` : ''}
|
|
</p>
|
|
</div>
|
|
<div class="col-6 text-end">
|
|
<h2 class="text-primary fw-bold mb-1">LOCAL PURCHASE ORDER</h2>
|
|
<p class="h5 mb-0 text-muted">LPO-${data.id.toString().padStart(5, '0')}</p>
|
|
</div>
|
|
</div>
|
|
`;
|
|
|
|
let itemsHtml = '';
|
|
data.items.forEach((item, index) => {
|
|
itemsHtml += `
|
|
<tr>
|
|
<td>${index + 1}</td>
|
|
<td>${item.name_en}<br><small class="text-muted">${item.name_ar}</small></td>
|
|
<td class="text-center">${item.quantity}</td>
|
|
<td class="text-end">${parseFloat(item.unit_price).toFixed(3)}</td>
|
|
<td class="text-center">${parseFloat(item.vat_rate || 0).toFixed(2)}%</td>
|
|
<td class="text-end">${parseFloat(item.total_amount).toFixed(3)}</td>
|
|
</tr>
|
|
`;
|
|
});
|
|
|
|
content.innerHTML = `
|
|
${companyHeader}
|
|
<hr>
|
|
<div class="row mb-4">
|
|
<div class="col-6">
|
|
<h6 class="text-uppercase text-muted fw-bold mb-3" data-en="Supplier" data-ar="المورد">Supplier</h6>
|
|
<p class="h6 mb-1 fw-bold">${data.supplier_name}</p>
|
|
<p class="small text-muted mb-0">
|
|
${data.supplier_phone ? `Phone: ${data.supplier_phone}` : ''}
|
|
</p>
|
|
</div>
|
|
<div class="col-6 text-end">
|
|
<h6 class="text-uppercase text-muted fw-bold mb-3" data-en="Details" data-ar="تفاصيل">Details</h6>
|
|
<div class="d-flex justify-content-end mb-1">
|
|
<span class="text-muted me-2">Date:</span>
|
|
<span class="fw-bold">${data.lpo_date}</span>
|
|
</div>
|
|
<div class="d-flex justify-content-end mb-1">
|
|
<span class="text-muted me-2">Delivery:</span>
|
|
<span class="fw-bold">${data.delivery_date || '---'}</span>
|
|
</div>
|
|
<div class="d-flex justify-content-end">
|
|
<span class="text-muted me-2">Status:</span>
|
|
<span class="badge ${data.status === 'pending' ? 'bg-warning text-dark' : 'bg-success'}">${data.status.toUpperCase()}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="table-responsive">
|
|
<table class="table table-striped table-bordered">
|
|
<thead class="table-dark">
|
|
<tr>
|
|
<th style="width: 5%">#</th>
|
|
<th style="width: 45%" data-en="Description" data-ar="الوصف">Description</th>
|
|
<th style="width: 10%" class="text-center" data-en="Qty" data-ar="الكمية">Qty</th>
|
|
<th style="width: 15%" class="text-end">Unit Price</th>
|
|
<th style="width: 10%" class="text-center">VAT</th>
|
|
<th style="width: 15%" class="text-end" data-en="Total" data-ar="الإجمالي">Total</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>${itemsHtml}</tbody>
|
|
<tfoot class="table-light">
|
|
<tr>
|
|
<td colspan="5" class="text-end fw-bold" data-en="Subtotal" data-ar="الإجمالي الفرعي">Subtotal</td>
|
|
<td class="text-end fw-bold">OMR ${parseFloat(data.total_amount).toFixed(3)}</td>
|
|
</tr>
|
|
<tr>
|
|
<td colspan="5" class="text-end fw-bold">VAT Amount</td>
|
|
<td class="text-end fw-bold">OMR ${parseFloat(data.vat_amount).toFixed(2)}</td>
|
|
</tr>
|
|
<tr class="table-primary">
|
|
<td colspan="5" class="text-end fw-bold h5">Grand Total</td>
|
|
<td class="text-end fw-bold h5">OMR ${parseFloat(data.total_with_vat).toFixed(3)}</td>
|
|
</tr>
|
|
</tfoot>
|
|
</table>
|
|
</div>
|
|
${data.terms_conditions ? `
|
|
<div class="card bg-light border-0 mt-4">
|
|
<div class="card-body p-3">
|
|
<h6 class="fw-bold mb-2 small text-uppercase text-muted">Terms & Conditions</h6>
|
|
<p class="small mb-0">${data.terms_conditions.replace(/\n/g, '<br>')}</p>
|
|
</div>
|
|
</div>` : ''}
|
|
|
|
<div class="row mt-5 pt-3">
|
|
<div class="col-4 text-center">
|
|
<div style="border-top: 1px solid #dee2e6; padding-top: 10px;">
|
|
<p class="small mb-0">Prepared By</p>
|
|
</div>
|
|
</div>
|
|
<div class="col-4"></div>
|
|
<div class="col-4 text-center">
|
|
<div style="border-top: 1px solid #dee2e6; padding-top: 10px;">
|
|
<p class="small mb-0">Authorized Signature</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
`;
|
|
|
|
window.printLPO = function() {
|
|
const printWindow = window.open('', '_blank');
|
|
printWindow.document.write('<html><head><title>LPO-' + data.id + '</title>');
|
|
printWindow.document.write('<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.rtl.min.css" rel="stylesheet">');
|
|
printWindow.document.write('<style>body { padding: 40px; } @media print { .no-print { display: none; } }</style>');
|
|
printWindow.document.write('</head><body>');
|
|
printWindow.document.write(content.innerHTML);
|
|
printWindow.document.write('</body></html>');
|
|
printWindow.document.close();
|
|
setTimeout(() => {
|
|
printWindow.print();
|
|
printWindow.close();
|
|
}, 500);
|
|
};
|
|
|
|
modal.show();
|
|
};
|
|
|
|
// Quotation Form Logic
|
|
initInvoiceForm('quotProductSearchInput', 'quotSearchSuggestions', 'quotItemsTableBody', 'quot_grand_display', 'quot_subtotal_display', 'quot_vat_display');
|
|
initInvoiceForm('editQuotProductSearchInput', 'editQuotSearchSuggestions', 'editQuotItemsTableBody', 'edit_quot_grand_display', 'edit_quot_subtotal_display', 'edit_quot_vat_display');
|
|
|
|
document.querySelectorAll('.edit-quotation-btn').forEach(btn => {
|
|
btn.addEventListener('click', function() {
|
|
const data = JSON.parse(this.dataset.json);
|
|
document.getElementById('edit_quotation_id').value = data.id;
|
|
document.getElementById('edit_quot_customer_id').value = data.customer_id;
|
|
document.getElementById('edit_quot_date').value = data.quotation_date;
|
|
document.getElementById('edit_quot_valid').value = data.valid_until || '';
|
|
document.getElementById('edit_quot_status').value = data.status || 'pending';
|
|
|
|
const tableBody = document.getElementById('editQuotItemsTableBody');
|
|
tableBody.innerHTML = '';
|
|
|
|
data.items.forEach(item => {
|
|
addItemToTable({
|
|
id: item.item_id,
|
|
name_en: item.name_en,
|
|
name_ar: item.name_ar,
|
|
sku: '',
|
|
vat_rate: item.vat_rate || 0
|
|
}, tableBody, null, null,
|
|
document.getElementById('edit_quot_grand_display'),
|
|
document.getElementById('edit_quot_subtotal_display'),
|
|
document.getElementById('edit_quot_vat_display'),
|
|
{ quantity: item.quantity, unit_price: item.unit_price });
|
|
});
|
|
});
|
|
});
|
|
|
|
document.querySelectorAll('.convert-quotation-btn').forEach(btn => {
|
|
btn.addEventListener('click', function() {
|
|
if (confirm('Convert this quotation to an invoice? This will reduce stock.')) {
|
|
const f = document.createElement('form');
|
|
f.method = 'POST';
|
|
f.innerHTML = `<input type="hidden" name="convert_to_invoice" value="1"><input type="hidden" name="quotation_id" value="${this.dataset.id}">`;
|
|
document.body.appendChild(f);
|
|
f.submit();
|
|
}
|
|
});
|
|
});
|
|
|
|
// View Quotation Logic
|
|
window.viewAndPrintQuotation = function(data, autoPrint = false) {
|
|
const modal = new bootstrap.Modal(document.getElementById('viewQuotationModal'));
|
|
const content = document.getElementById('quotationPrintableArea');
|
|
|
|
let itemsHtml = '';
|
|
data.items.forEach((item, index) => {
|
|
itemsHtml += `
|
|
<tr>
|
|
<td>${index + 1}</td>
|
|
<td>${item.name_en}<br><small>${item.name_ar}</small></td>
|
|
<td class="text-center">${item.quantity}</td>
|
|
<td class="text-end">${parseFloat(item.unit_price).toFixed(3)}</td>
|
|
<td class="text-center">${parseFloat(item.vat_rate || 0).toFixed(2)}%</td>
|
|
<td class="text-end">${parseFloat(item.total_price).toFixed(3)}</td>
|
|
</tr>
|
|
`;
|
|
});
|
|
|
|
// Company Logo and Header Construction
|
|
const logoUrl = companySettings.company_logo || '';
|
|
const logoImg = logoUrl ? `<img src="${logoUrl}" alt="Logo" class="invoice-logo mb-3">` : '';
|
|
const companyName = companySettings.company_name || 'Accounting System';
|
|
const companyAddress = (companySettings.company_address || '').replace(/\n/g, '<br>');
|
|
const companyVat = companySettings.vat_number ? `<p class="text-muted small mb-0">VAT: ${companySettings.vat_number}</p>` : '';
|
|
const companyPhone = companySettings.company_phone ? `<p class="text-muted small mb-0">Tel: ${companySettings.company_phone}</p>` : '';
|
|
|
|
// Quotation Header Construction
|
|
const quotDate = data.quotation_date;
|
|
const quotValid = data.valid_until || 'N/A';
|
|
const quotNo = 'QUO-' + data.id.toString().padStart(5, '0');
|
|
const customerName = data.customer_name || 'Walk-in Customer';
|
|
const statusBadge = `<span class="badge ${data.status === 'converted' ? 'bg-success' : 'bg-secondary'}">${data.status.toUpperCase()}</span>`;
|
|
|
|
content.innerHTML = `
|
|
<div class="p-5">
|
|
<div class="invoice-header mb-4">
|
|
<div class="row align-items-center">
|
|
<div class="col-6">
|
|
${logoImg}
|
|
<h3 class="mb-1 fw-bold">${companyName}</h3>
|
|
<p class="text-muted small mb-0">${companyAddress}</p>
|
|
${companyVat}
|
|
${companyPhone}
|
|
</div>
|
|
<div class="col-6 text-end">
|
|
<h1 class="invoice-title fw-bold mb-0 text-uppercase">Quotation / عرض سعر</h1>
|
|
<div class="mt-2">${statusBadge}</div>
|
|
<div class="mt-3">
|
|
<p class="mb-0 fs-5">No / رقم: <strong class="text-primary">${quotNo}</strong></p>
|
|
<p class="mb-0">Date / التاريخ: <span class="fw-bold">${quotDate}</span></p>
|
|
<p class="mb-0">Valid Until / صالح لغاية: <span class="fw-bold">${quotValid}</span></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row mb-4 g-3">
|
|
<div class="col-6">
|
|
<div class="invoice-info-card">
|
|
<p class="text-muted small text-uppercase fw-bold mb-2 border-bottom pb-1">To / إلى</p>
|
|
<h5 class="mb-1 fw-bold">${customerName}</h5>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<table class="table table-bordered table-formal">
|
|
<thead class="bg-dark text-white">
|
|
<tr>
|
|
<th>#</th>
|
|
<th>Item Description / وصف الصنف</th>
|
|
<th class="text-center">Qty / الكمية</th>
|
|
<th class="text-end">Unit Price / سعر الوحدة</th>
|
|
<th class="text-center">VAT / الضريبة</th>
|
|
<th class="text-end">Total / الإجمالي</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>${itemsHtml}</tbody>
|
|
<tfoot>
|
|
<tr>
|
|
<th colspan="5" class="text-end">Subtotal / المجموع الفرعي</th>
|
|
<td class="text-end fw-bold">${parseFloat(data.total_amount).toFixed(3)}</td>
|
|
</tr>
|
|
<tr>
|
|
<th colspan="5" class="text-end">VAT Amount / مبلغ الضريبة</th>
|
|
<td class="text-end fw-bold">${parseFloat(data.vat_amount).toFixed(2)}</td>
|
|
</tr>
|
|
<tr class="table-primary">
|
|
<th colspan="5" class="text-end h5">Grand Total (OMR) / المجموع الكلي (رع)</th>
|
|
<td class="text-end h5 fw-bold">${parseFloat(data.total_with_vat).toFixed(3)}</td>
|
|
</tr>
|
|
</tfoot>
|
|
</table>
|
|
|
|
<div class="mt-5 pt-3 border-top">
|
|
<div class="row">
|
|
<div class="col-6">
|
|
<p class="small text-muted text-uppercase fw-bold">Terms & Conditions / الشروط والأحكام:</p>
|
|
<ul class="small text-muted">
|
|
<li>Quotation is valid until the date mentioned above. / عرض السعر صالح لغاية التاريخ المذكور أعلاه.</li>
|
|
<li>Prices are inclusive of VAT where applicable. / الأسعار تشمل ضريبة القيمة المضافة حيثما ينطبق ذلك.</li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-6 text-end pt-4">
|
|
<div class="border-top d-inline-block px-5">Authorized Signature / التوقيع المعتمد</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="mt-4 text-center">
|
|
<p class="text-muted x-small mb-0">Generated by / تم إنشاؤه بواسطة ${companyName}</p>
|
|
</div>
|
|
</div>
|
|
`;
|
|
|
|
const actionButtons = document.getElementById('quotationActionButtons');
|
|
actionButtons.innerHTML = '';
|
|
if (data.status === 'pending') {
|
|
const convertBtn = document.createElement('button');
|
|
convertBtn.className = 'btn btn-success me-2';
|
|
convertBtn.innerHTML = '<i class="bi bi-receipt"></i> <span data-en="Convert to Invoice" data-ar="تحويل إلى فاتورة">Convert to Invoice</span>';
|
|
convertBtn.onclick = function() {
|
|
if (confirm('Convert this quotation to an invoice?')) {
|
|
const f = document.createElement('form');
|
|
f.method = 'POST';
|
|
f.innerHTML = `<input type="hidden" name="convert_to_invoice" value="1"><input type="hidden" name="quotation_id" value="${data.id}">`;
|
|
document.body.appendChild(f);
|
|
f.submit();
|
|
}
|
|
};
|
|
actionButtons.appendChild(convertBtn);
|
|
|
|
const editBtn = document.createElement('button');
|
|
editBtn.className = 'btn btn-primary';
|
|
editBtn.innerHTML = '<i class="bi bi-pencil-square"></i> <span data-en="Edit" data-ar="تعديل">Edit</span>';
|
|
editBtn.onclick = function() {
|
|
const editModal = new bootstrap.Modal(document.getElementById('editQuotationModal'));
|
|
modal.hide();
|
|
const originalEditBtn = document.querySelector(`.edit-quotation-btn[data-json*='"id":${data.id},']`) ||
|
|
document.querySelector(`.edit-quotation-btn[data-json*='"id":${data.id}']`);
|
|
if (originalEditBtn) originalEditBtn.click();
|
|
};
|
|
actionButtons.appendChild(editBtn);
|
|
}
|
|
|
|
modal.show();
|
|
if (autoPrint) {
|
|
setTimeout(() => { window.print(); }, 500);
|
|
}
|
|
};
|
|
|
|
document.querySelectorAll('.view-quotation-btn').forEach(btn => {
|
|
btn.addEventListener('click', function() {
|
|
const data = JSON.parse(this.dataset.json);
|
|
window.viewAndPrintQuotation(data, false);
|
|
});
|
|
});
|
|
|
|
// Edit Invoice Logic
|
|
document.querySelectorAll('.edit-invoice-btn').forEach(btn => {
|
|
btn.addEventListener('click', function() {
|
|
const data = JSON.parse(this.dataset.json);
|
|
document.getElementById('edit_invoice_id').value = data.id;
|
|
document.getElementById('edit_customer_id').value = data.customer_id;
|
|
document.getElementById('edit_invoice_date').value = data.invoice_date;
|
|
document.getElementById('edit_due_date').value = data.due_date || '';
|
|
document.getElementById('edit_payment_type').value = data.payment_type || 'cash';
|
|
document.getElementById('edit_status').value = data.status || 'unpaid';
|
|
document.getElementById('edit_paid_amount').value = parseFloat(data.paid_amount || 0).toFixed(3);
|
|
|
|
if (data.status === 'partially_paid') {
|
|
document.getElementById('editPaidAmountContainer').style.display = 'block';
|
|
} else {
|
|
document.getElementById('editPaidAmountContainer').style.display = 'none';
|
|
}
|
|
|
|
const tableBody = document.getElementById('editInvoiceItemsTableBody');
|
|
tableBody.innerHTML = '';
|
|
|
|
data.items.forEach(item => {
|
|
// We need more data than what's in invoice_items (like SKU and names, but we have them from the join in PHP)
|
|
// The dataset-json already contains name_en, name_ar etc because of the PHP logic at line 1093
|
|
const itemMeta = {
|
|
id: item.item_id,
|
|
name_en: item.name_en,
|
|
name_ar: item.name_ar,
|
|
sku: '', // Optional, or fetch if needed
|
|
vat_rate: 0 // Will be handled if we have it in the join
|
|
};
|
|
|
|
// Fetch current item details to get VAT rate if possible, or use stored if available
|
|
// For simplicity, let's assume we want to use the item's current VAT rate or store it.
|
|
// Looking at the join at line 1093, it doesn't fetch vat_rate. Let's fix that in PHP too.
|
|
|
|
addItemToTable({
|
|
id: item.item_id,
|
|
name_en: item.name_en,
|
|
name_ar: item.name_ar,
|
|
sku: '',
|
|
vat_rate: item.vat_rate || 0 // We'll add this to PHP join
|
|
}, tableBody, null, null,
|
|
document.getElementById('edit_grandTotal'),
|
|
document.getElementById('edit_subtotal'),
|
|
document.getElementById('edit_totalVat'),
|
|
{ quantity: item.quantity, unit_price: item.unit_price });
|
|
});
|
|
});
|
|
});
|
|
|
|
// View and Print Invoice Logic
|
|
document.addEventListener('click', function(e) {
|
|
if (e.target.closest('.view-invoice-btn')) {
|
|
const btn = e.target.closest('.view-invoice-btn');
|
|
const data = JSON.parse(btn.dataset.json);
|
|
if (window.viewAndPrintA4Invoice) {
|
|
window.viewAndPrintA4Invoice(data, false);
|
|
}
|
|
}
|
|
if (e.target.closest('.print-a4-btn')) {
|
|
const btn = e.target.closest('.print-a4-btn');
|
|
const data = JSON.parse(btn.dataset.json);
|
|
if (window.viewAndPrintA4Invoice) {
|
|
window.viewAndPrintA4Invoice(data, true);
|
|
}
|
|
}
|
|
});
|
|
|
|
// Return Logic (General for Sales and Purchase)
|
|
const setupReturnLogic = (selectId, containerId, tbodyId, totalDisplayId, submitBtnId, type = "sale") => {
|
|
const select = document.getElementById(selectId);
|
|
if (!select) return;
|
|
|
|
const calculateTotal = function() {
|
|
let total = 0;
|
|
document.querySelectorAll('#' + tbodyId + ' tr').forEach(row => {
|
|
const qtyInput = row.querySelector('.return-qty-input');
|
|
if (!qtyInput) return;
|
|
const qty = parseFloat(qtyInput.value) || 0;
|
|
const price = parseFloat(qtyInput.dataset.price) || 0;
|
|
const lineTotal = qty * price;
|
|
const lineTotalDisplay = row.querySelector('.line-total');
|
|
if (lineTotalDisplay) {
|
|
lineTotalDisplay.innerText = lineTotal.toFixed(3);
|
|
}
|
|
total += lineTotal;
|
|
});
|
|
const totalDisplay = document.getElementById(totalDisplayId);
|
|
if (totalDisplay) {
|
|
totalDisplay.innerText = 'OMR ' + total.toFixed(3);
|
|
}
|
|
const submitBtn = document.getElementById(submitBtnId);
|
|
if (submitBtn) {
|
|
submitBtn.disabled = total <= 0;
|
|
}
|
|
};
|
|
|
|
const handleInvoiceChange = async function() {
|
|
const invoiceId = select.value;
|
|
const container = document.getElementById(containerId);
|
|
const tbody = document.getElementById(tbodyId);
|
|
const submitBtn = document.getElementById(submitBtnId);
|
|
|
|
if (!invoiceId) {
|
|
if (container) container.style.display = 'none';
|
|
if (submitBtn) submitBtn.disabled = true;
|
|
return;
|
|
}
|
|
|
|
if (tbody) {
|
|
tbody.innerHTML = '<tr><td colspan="5" class="text-center"><div class="spinner-border spinner-border-sm text-primary"></div> <span data-en="Loading items..." data-ar="جاري تحميل الأصناف...">Loading items...</span></td></tr>';
|
|
}
|
|
if (container) container.style.display = 'block';
|
|
|
|
try {
|
|
const resp = await fetch(`index.php?action=get_invoice_items&invoice_id=${invoiceId}&type=${type}`);
|
|
const items = await resp.json();
|
|
|
|
if (tbody) {
|
|
tbody.innerHTML = '';
|
|
if (items.length === 0) {
|
|
tbody.innerHTML = '<tr><td colspan="5" class="text-center text-muted" data-en="No items found for this invoice." data-ar="لا توجد أصناف لهذه الفاتورة.">No items found for this invoice.</td></tr>';
|
|
} else {
|
|
let html = '';
|
|
items.forEach(item => {
|
|
html += `
|
|
<tr>
|
|
<td>${item.name_en}<br><small class="text-muted">${item.sku}</small></td>
|
|
<td>${parseFloat(item.quantity).toFixed(2)}</td>
|
|
<td>
|
|
<input type="number" name="quantities[]" class="form-control form-control-sm return-qty-input"
|
|
step="0.01" min="0" max="${item.quantity}" value="0"
|
|
data-price="${item.unit_price}">
|
|
<input type="hidden" name="item_ids[]" value="${item.item_id}">
|
|
<input type="hidden" name="prices[]" value="${item.unit_price}">
|
|
</td>
|
|
<td class="text-end">${parseFloat(item.unit_price).toFixed(3)}</td>
|
|
<td class="text-end line-total">0.000</td>
|
|
</tr>
|
|
`;
|
|
});
|
|
tbody.innerHTML = html;
|
|
}
|
|
}
|
|
|
|
if (submitBtn) submitBtn.disabled = true;
|
|
|
|
const qtyInputs = tbody.querySelectorAll('.return-qty-input');
|
|
qtyInputs.forEach(input => {
|
|
['input', 'change', 'keyup'].forEach(evt => input.addEventListener(evt, calculateTotal));
|
|
});
|
|
|
|
calculateTotal();
|
|
} catch (e) {
|
|
console.error(e);
|
|
if (window.Swal) Swal.fire('Error', 'Failed to fetch invoice items', 'error');
|
|
}
|
|
};
|
|
|
|
select.addEventListener('change', handleInvoiceChange);
|
|
if (window.jQuery && jQuery.fn.select2) {
|
|
$(select).on('select2:select change', handleInvoiceChange);
|
|
}
|
|
};
|
|
|
|
setupReturnLogic('return_invoice_select', 'return_items_container', 'return_items_tbody', 'return_total_display', 'submit_return_btn', 'sale');
|
|
setupReturnLogic('purchase_return_invoice_select', 'purchase_return_items_container', 'purchase_return_items_tbody', 'purchase_return_total_display', 'purchase_submit_return_btn', 'purchase');
|
|
|
|
// Return Invoice Button from Sales/Purchases list
|
|
document.querySelectorAll('.return-invoice-btn').forEach(btn => {
|
|
btn.addEventListener('click', function() {
|
|
const invoiceId = this.dataset.id;
|
|
const targetModal = this.dataset.bsTarget;
|
|
const selectId = targetModal === '#addSalesReturnModal' ? 'return_invoice_select' : 'purchase_return_invoice_select';
|
|
const select = document.getElementById(selectId);
|
|
if (select) {
|
|
$(select).val(invoiceId).trigger('change');
|
|
}
|
|
});
|
|
});
|
|
|
|
// View Return Logic
|
|
document.querySelectorAll('.view-return-btn').forEach(btn => {
|
|
btn.addEventListener('click', async function() {
|
|
const returnId = this.dataset.id;
|
|
const type = 'sale';
|
|
const modal = new bootstrap.Modal(document.getElementById('viewReturnDetailsModal'));
|
|
|
|
try {
|
|
const resp = await fetch(`index.php?action=get_return_details&return_id=${returnId}&type=${type}`);
|
|
const data = await resp.json();
|
|
|
|
if (data) {
|
|
document.getElementById('view_return_no').innerText = (type === 'purchase' ? 'PRET-' : 'SRET-') + String(data.id).padStart(5, '0');
|
|
document.getElementById('view_return_party').innerText = data.party_name;
|
|
document.getElementById('view_return_date').innerText = data.return_date;
|
|
const refId = data.purchase_id || data.invoice_id;
|
|
const refPrefix = type === 'purchase' ? 'PUR-' : 'INV-';
|
|
document.getElementById('view_return_invoice').innerText = refPrefix + String(refId).padStart(5, '0');
|
|
document.getElementById('view_return_total').innerText = 'OMR ' + parseFloat(data.total_amount).toFixed(3);
|
|
document.getElementById('view_return_notes').innerText = data.notes || 'No notes';
|
|
|
|
let itemsHtml = '';
|
|
data.items.forEach(item => {
|
|
itemsHtml += `
|
|
<tr>
|
|
<td>${item.name_en}<br><small class="text-muted">${item.sku}</small></td>
|
|
<td class="text-center">${parseFloat(item.quantity).toFixed(2)}</td>
|
|
<td class="text-end">${parseFloat(item.unit_price).toFixed(3)}</td>
|
|
<td class="text-end">${parseFloat(item.total_price).toFixed(3)}</td>
|
|
</tr>
|
|
`;
|
|
});
|
|
document.getElementById('view_return_items_tbody').innerHTML = itemsHtml;
|
|
modal.show();
|
|
}
|
|
} catch (e) {
|
|
console.error(e);
|
|
Swal.fire('Error', 'Failed to fetch return details', 'error');
|
|
}
|
|
});
|
|
});
|
|
|
|
} catch (e) { console.error("JS Error in DOMContentLoaded:", e); }
|
|
});
|
|
</script>
|
|
<!-- View Return Details Modal -->
|
|
<div class="modal fade" id="viewReturnDetailsModal" tabindex="-1">
|
|
<div class="modal-dialog modal-lg">
|
|
<div class="modal-content text-start border-0 shadow">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title">Return Details <span id="view_return_no"></span></h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<div class="row mb-4">
|
|
<div class="col-6">
|
|
<label class="text-muted small d-block">Party Name</label>
|
|
<div id="view_return_party" class="fw-bold"></div>
|
|
</div>
|
|
<div class="col-3">
|
|
<label class="text-muted small d-block">Return Date</label>
|
|
<div id="view_return_date"></div>
|
|
</div>
|
|
<div class="col-3">
|
|
<label class="text-muted small d-block">Against Invoice</label>
|
|
<div id="view_return_invoice"></div>
|
|
</div>
|
|
</div>
|
|
<h6>Returned Items</h6>
|
|
<div class="table-responsive">
|
|
<table class="table table-sm table-bordered">
|
|
<thead class="bg-light">
|
|
<tr>
|
|
<th>Item</th>
|
|
<th class="text-center">Returned Qty</th>
|
|
<th class="text-end">Unit Price</th>
|
|
<th class="text-end">Total Price</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="view_return_items_tbody"></tbody>
|
|
<tfoot>
|
|
<tr>
|
|
<th colspan="3" class="text-end">Total Amount:</th>
|
|
<th class="text-end fw-bold" id="view_return_total"></th>
|
|
</tr>
|
|
</tfoot>
|
|
</table>
|
|
</div>
|
|
<div class="mt-3">
|
|
<label class="text-muted small d-block">Notes</label>
|
|
<div id="view_return_notes" class="p-2 bg-light rounded"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<!-- Add Account Modal -->
|
|
<div class="modal fade" id="addAccountModal" tabindex="-1">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content border-0 shadow">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title" data-en="Add New Account" data-ar="إضافة حساب جديد">Add New Account</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
|
</div>
|
|
<form method="POST">
|
|
<div class="modal-body">
|
|
<div class="row g-3">
|
|
<div class="col-md-4">
|
|
<label class="form-label" data-en="Code" data-ar="الكود">Code</label>
|
|
<input type="text" name="code" class="form-control" required placeholder="e.g. 1101">
|
|
</div>
|
|
<div class="col-md-8">
|
|
<label class="form-label" data-en="Name (EN)" data-ar="الاسم (إنجليزي)">Name (EN)</label>
|
|
<input type="text" name="name_en" class="form-control" required>
|
|
</div>
|
|
<div class="col-md-12">
|
|
<label class="form-label" data-en="Name (AR)" data-ar="الاسم (عربي)">Name (AR)</label>
|
|
<input type="text" name="name_ar" class="form-control" required>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<label class="form-label" data-en="Type" data-ar="النوع">Type</label>
|
|
<select name="type" class="form-select" required>
|
|
<option value="asset">Asset</option>
|
|
<option value="liability">Liability</option>
|
|
<option value="equity">Equity</option>
|
|
<option value="revenue">Revenue</option>
|
|
<option value="expense">Expense</option>
|
|
</select>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<label class="form-label" data-en="Parent Account" data-ar="الحساب الأب">Parent Account</label>
|
|
<select name="parent_id" class="form-select">
|
|
<option value="">--- None ---</option>
|
|
<option value="1">1000 - Assets</option>
|
|
<option value="2">1100 - Cash on Hand</option>
|
|
<option value="3">1200 - Bank Account</option>
|
|
<option value="4">1300 - Accounts Receivable</option>
|
|
<option value="5">1400 - Inventory</option>
|
|
<option value="14">1500 - VAT Input</option>
|
|
<option value="6">2000 - Liabilities</option>
|
|
<option value="7">2100 - Accounts Payable</option>
|
|
<option value="15">2300 - VAT Payable</option>
|
|
<option value="8">3000 - Equity</option>
|
|
<option value="9">4000 - Revenue</option>
|
|
<option value="10">4100 - Sales Revenue</option>
|
|
<option value="11">5000 - Expenses</option>
|
|
<option value="12">5100 - Cost of Goods Sold</option>
|
|
<option value="13">5200 - Operating Expenses</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-light" data-bs-dismiss="modal" data-en="Cancel" data-ar="إلغاء">Cancel</button>
|
|
<button type="submit" name="add_account" class="btn btn-primary">Save Account</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Add Manual Journal Modal -->
|
|
<div class="modal fade" id="addManualJournalModal" tabindex="-1">
|
|
<div class="modal-dialog modal-lg">
|
|
<div class="modal-content border-0 shadow">
|
|
<div class="modal-header bg-success text-white">
|
|
<h5 class="modal-title" data-en="New Manual Journal Entry" data-ar="قيد يومية يدوي جديد">New Manual Journal Entry</h5>
|
|
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"></button>
|
|
</div>
|
|
<form method="POST">
|
|
<div class="modal-body">
|
|
<div class="row g-3 mb-4">
|
|
<div class="col-md-4">
|
|
<label class="form-label" data-en="Entry Date" data-ar="تاريخ القيد">Entry Date</label>
|
|
<input type="date" name="entry_date" class="form-control" value="2026-03-17" required>
|
|
</div>
|
|
<div class="col-md-8">
|
|
<label class="form-label" data-en="Description" data-ar="الوصف">Description</label>
|
|
<input type="text" name="description" class="form-control" required placeholder="e.g. Opening Balance or Adjustment">
|
|
</div>
|
|
<div class="col-md-4">
|
|
<label class="form-label" data-en="Reference" data-ar="المرجع">Reference</label>
|
|
<input type="text" name="reference" class="form-control" placeholder="e.g. JV-001">
|
|
</div>
|
|
</div>
|
|
|
|
<h6>Journal Details</h6>
|
|
<div class="table-responsive">
|
|
<table class="table table-bordered">
|
|
<thead class="bg-light">
|
|
<tr>
|
|
<th style="width: 50%;">Account</th>
|
|
<th style="width: 20%;">Debit</th>
|
|
<th style="width: 20%;">Credit</th>
|
|
<th style="width: 10%;"></th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="manualJournalBody">
|
|
<tr class="journal-row">
|
|
<td>
|
|
<select name="codes[]" class="form-select select2-journal" required>
|
|
<option value="">--- Select Account ---</option>
|
|
<option value="1000">1000 - Assets</option>
|
|
<option value="1100">1100 - Cash on Hand</option>
|
|
<option value="1200">1200 - Bank Account</option>
|
|
<option value="1300">1300 - Accounts Receivable</option>
|
|
<option value="1400">1400 - Inventory</option>
|
|
<option value="1500">1500 - VAT Input</option>
|
|
<option value="2000">2000 - Liabilities</option>
|
|
<option value="2100">2100 - Accounts Payable</option>
|
|
<option value="2300">2300 - VAT Payable</option>
|
|
<option value="3000">3000 - Equity</option>
|
|
<option value="4000">4000 - Revenue</option>
|
|
<option value="4100">4100 - Sales Revenue</option>
|
|
<option value="5000">5000 - Expenses</option>
|
|
<option value="5100">5100 - Cost of Goods Sold</option>
|
|
<option value="5200">5200 - Operating Expenses</option>
|
|
</select>
|
|
</td>
|
|
<td><input type="number" step="0.001" name="debits[]" class="form-control journal-debit" value="0.000"></td>
|
|
<td><input type="number" step="0.001" name="credits[]" class="form-control journal-credit" value="0.000"></td>
|
|
<td></td>
|
|
</tr>
|
|
<tr class="journal-row">
|
|
<td>
|
|
<select name="codes[]" class="form-select select2-journal" required>
|
|
<option value="">--- Select Account ---</option>
|
|
<option value="1000">1000 - Assets</option>
|
|
<option value="1100">1100 - Cash on Hand</option>
|
|
<option value="1200">1200 - Bank Account</option>
|
|
<option value="1300">1300 - Accounts Receivable</option>
|
|
<option value="1400">1400 - Inventory</option>
|
|
<option value="1500">1500 - VAT Input</option>
|
|
<option value="2000">2000 - Liabilities</option>
|
|
<option value="2100">2100 - Accounts Payable</option>
|
|
<option value="2300">2300 - VAT Payable</option>
|
|
<option value="3000">3000 - Equity</option>
|
|
<option value="4000">4000 - Revenue</option>
|
|
<option value="4100">4100 - Sales Revenue</option>
|
|
<option value="5000">5000 - Expenses</option>
|
|
<option value="5100">5100 - Cost of Goods Sold</option>
|
|
<option value="5200">5200 - Operating Expenses</option>
|
|
</select>
|
|
</td>
|
|
<td><input type="number" step="0.001" name="debits[]" class="form-control journal-debit" value="0.000"></td>
|
|
<td><input type="number" step="0.001" name="credits[]" class="form-control journal-credit" value="0.000"></td>
|
|
<td></td>
|
|
</tr>
|
|
</tbody>
|
|
<tfoot>
|
|
<tr>
|
|
<td colspan="4">
|
|
<button type="button" class="btn btn-outline-primary btn-sm" onclick="addJournalRow()">
|
|
<i class="bi bi-plus-lg"></i> Add Row
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
<tr class="table-light fw-bold">
|
|
<td class="text-end" data-en="Total" data-ar="الإجمالي">Total</td>
|
|
<td id="totalDebitDisplay">0.000</td>
|
|
<td id="totalCreditDisplay">0.000</td>
|
|
<td></td>
|
|
</tr>
|
|
</tfoot>
|
|
</table>
|
|
</div>
|
|
<div id="journalBalanceWarning" class="alert alert-danger py-2 mt-2" style="display:none;">
|
|
<small><i class="bi bi-exclamation-triangle"></i> Journal is not balanced! Difference: <span id="journalDifference">0.000</span></small>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-light" data-bs-dismiss="modal" data-en="Cancel" data-ar="إلغاء">Cancel</button>
|
|
<button type="submit" name="add_manual_journal" id="saveJournalBtn" class="btn btn-primary" data-en="Save Entry" data-ar="حفظ القيد" disabled>Save Entry</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
function addJournalRow() {
|
|
const tbody = document.getElementById('manualJournalBody');
|
|
const row = document.createElement('tr');
|
|
row.className = 'journal-row';
|
|
row.innerHTML = `
|
|
<td>
|
|
<select name="codes[]" class="form-select select2-journal" required>
|
|
<option value="">--- Select Account ---</option>
|
|
<option value="1000">1000 - Assets</option>
|
|
<option value="1100">1100 - Cash on Hand</option>
|
|
<option value="1200">1200 - Bank Account</option>
|
|
<option value="1300">1300 - Accounts Receivable</option>
|
|
<option value="1400">1400 - Inventory</option>
|
|
<option value="1500">1500 - VAT Input</option>
|
|
<option value="2000">2000 - Liabilities</option>
|
|
<option value="2100">2100 - Accounts Payable</option>
|
|
<option value="2300">2300 - VAT Payable</option>
|
|
<option value="3000">3000 - Equity</option>
|
|
<option value="4000">4000 - Revenue</option>
|
|
<option value="4100">4100 - Sales Revenue</option>
|
|
<option value="5000">5000 - Expenses</option>
|
|
<option value="5100">5100 - Cost of Goods Sold</option>
|
|
<option value="5200">5200 - Operating Expenses</option>
|
|
</select>
|
|
</td>
|
|
<td><input type="number" step="0.001" name="debits[]" class="form-control journal-debit" value="0.000"></td>
|
|
<td><input type="number" step="0.001" name="credits[]" class="form-control journal-credit" value="0.000"></td>
|
|
<td class="text-center">
|
|
<button type="button" class="btn btn-link text-danger p-0" onclick="this.closest('tr').remove(); calculateJournalBalance();">
|
|
<i class="bi bi-trash"></i>
|
|
</button>
|
|
</td>
|
|
`;
|
|
tbody.appendChild(row);
|
|
|
|
// Init Select2 for new row
|
|
$(row).find('.select2-journal').select2({
|
|
width: '100%',
|
|
dropdownParent: $('#addManualJournalModal')
|
|
});
|
|
|
|
attachJournalListeners(row);
|
|
}
|
|
|
|
function attachJournalListeners(row) {
|
|
row.querySelectorAll('input').forEach(input => {
|
|
input.addEventListener('input', calculateJournalBalance);
|
|
});
|
|
}
|
|
|
|
function calculateJournalBalance() {
|
|
let totalDebit = 0;
|
|
let totalCredit = 0;
|
|
document.querySelectorAll('.journal-row').forEach(row => {
|
|
totalDebit += parseFloat(row.querySelector('.journal-debit').value) || 0;
|
|
totalCredit += parseFloat(row.querySelector('.journal-credit').value) || 0;
|
|
});
|
|
|
|
document.getElementById('totalDebitDisplay').innerText = totalDebit.toFixed(3);
|
|
document.getElementById('totalCreditDisplay').innerText = totalCredit.toFixed(3);
|
|
|
|
const diff = Math.abs(totalDebit - totalCredit);
|
|
const isBalanced = diff < 0.001 && (totalDebit > 0 || totalCredit > 0);
|
|
|
|
document.getElementById('saveJournalBtn').disabled = !isBalanced;
|
|
|
|
const warning = document.getElementById('journalBalanceWarning');
|
|
if (diff >= 0.001) {
|
|
warning.style.display = 'block';
|
|
document.getElementById('journalDifference').innerText = diff.toFixed(3);
|
|
} else {
|
|
warning.style.display = 'none';
|
|
}
|
|
}
|
|
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
document.querySelectorAll('.journal-row').forEach(attachJournalListeners);
|
|
$('.select2-journal').select2({
|
|
width: '100%',
|
|
dropdownParent: $('#addManualJournalModal')
|
|
});
|
|
});
|
|
</script>
|
|
|
|
<!-- View Invoice Modal -->
|
|
<!-- Add Invoice Modal -->
|
|
<div class="modal fade" id="addInvoiceModal" tabindex="-1">
|
|
<div class="modal-dialog modal-xl">
|
|
<div class="modal-content border-0 shadow">
|
|
<div class="modal-header bg-primary text-white">
|
|
<h5 class="modal-title" data-en="Create New Tax Invoice" data-ar="إنشاء فاتورة ضريبية جديدة">Create New Tax Invoice</h5>
|
|
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"></button>
|
|
</div>
|
|
<form method="POST">
|
|
<input type="hidden" name="type" value="purchase">
|
|
<div class="modal-body p-4">
|
|
<div class="row g-3 mb-4">
|
|
<div class="col-md-3">
|
|
<label class="form-label fw-bold" data-en="Supplier" data-ar="المورد">Supplier</label>
|
|
<select name="customer_id" class="form-select select2" required>
|
|
<option value="">---</option>
|
|
</select>
|
|
</div>
|
|
<div class="col-md-2">
|
|
<label class="form-label fw-bold" data-en="Date" data-ar="التاريخ">Date</label>
|
|
<input type="date" name="invoice_date" class="form-control" value="2026-03-17" required>
|
|
</div>
|
|
<div class="col-md-2">
|
|
<label class="form-label fw-bold" data-en="Due Date" data-ar="تاريخ الاستحقاق">Due Date</label>
|
|
<input type="date" name="due_date" class="form-control">
|
|
</div>
|
|
<div class="col-md-2">
|
|
<label class="form-label fw-bold" data-en="Payment Type" data-ar="طريقة الدفع">Payment Type</label>
|
|
<select name="payment_type" class="form-select">
|
|
<option value="cash">Cash</option>
|
|
<option value="card">Credit Card</option>
|
|
<option value="bank_transfer">Bank Transfer</option>
|
|
<option value="credit">Credit</option>
|
|
</select>
|
|
</div>
|
|
<div class="col-md-3">
|
|
<label class="form-label fw-bold" data-en="Status" data-ar="الحالة">Status</label>
|
|
<select name="status" id="add_status" class="form-select">
|
|
<option value="unpaid">Unpaid</option>
|
|
<option value="partially_paid">Partially Paid</option>
|
|
<option value="paid">Paid</option>
|
|
</select>
|
|
</div>
|
|
<div class="col-md-3" id="addPaidAmountContainer" style="display: none;">
|
|
<label class="form-label fw-bold" data-en="Paid Amount" data-ar="المبلغ المدفوع">Paid Amount</label>
|
|
<input type="number" step="0.001" name="paid_amount" class="form-control" value="0.000">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card mb-4">
|
|
<div class="card-body bg-light">
|
|
<label class="form-label fw-bold" data-en="Search Items" data-ar="بحث عن أصناف">Search Items</label>
|
|
<div class="position-relative">
|
|
<input type="text" id="productSearchInput" class="form-control" placeholder="Search by name or SKU..." autocomplete="off">
|
|
<div id="searchSuggestions" class="list-group position-absolute w-100 shadow-sm" style="display: none; z-index: 1000;"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="table-responsive">
|
|
<table class="table table-bordered align-middle">
|
|
<thead class="bg-light">
|
|
<tr>
|
|
<th style="width: 40%;" data-en="Item Details" data-ar="تفاصيل الصنف">Item Details</th>
|
|
<th style="width: 15%;" data-en="Qty" data-ar="الكمية">Qty</th>
|
|
<th style="width: 15%;" data-en="Unit Price" data-ar="سعر الوحدة">Unit Price</th>
|
|
<th style="width: 10%;" data-en="VAT" data-ar="الضريبة">VAT</th>
|
|
<th style="width: 15%;" data-en="Total" data-ar="الإجمالي">Total</th>
|
|
<th style="width: 5%;"></th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="invoiceItemsTableBody"></tbody>
|
|
<tfoot>
|
|
<tr>
|
|
<td colspan="4" class="text-end fw-bold" data-en="Subtotal" data-ar="الإجمالي الفرعي">Subtotal</td>
|
|
<td class="text-end fw-bold" id="subtotal">ر.ع / OMR 0.000</td>
|
|
<td></td>
|
|
</tr>
|
|
<tr>
|
|
<td colspan="4" class="text-end fw-bold" data-en="Total VAT" data-ar="إجمالي الضريبة">Total VAT</td>
|
|
<td class="text-end fw-bold" id="totalVat">ر.ع / OMR 0.000</td>
|
|
<td></td>
|
|
</tr>
|
|
<tr class="table-primary">
|
|
<td colspan="4" class="text-end fw-bold h5" data-en="Grand Total" data-ar="الإجمالي النهائي">Grand Total</td>
|
|
<td class="text-end fw-bold h5" id="grandTotal">ر.ع / OMR 0.000</td>
|
|
<td></td>
|
|
</tr>
|
|
</tfoot>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-light" data-bs-dismiss="modal" data-en="Cancel" data-ar="إلغاء">Cancel</button>
|
|
<button type="submit" name="add_invoice" class="btn btn-primary" data-en="Create Invoice" data-ar="إنشاء الفاتورة">Create Invoice</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Edit Invoice Modal -->
|
|
<div class="modal fade" id="editInvoiceModal" tabindex="-1">
|
|
<div class="modal-dialog modal-xl">
|
|
<div class="modal-content border-0 shadow">
|
|
<div class="modal-header bg-primary text-white">
|
|
<h5 class="modal-title" data-en="Edit Invoice" data-ar="تعديل الفاتورة">Edit Invoice</h5>
|
|
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"></button>
|
|
</div>
|
|
<form method="POST">
|
|
<input type="hidden" name="invoice_id" id="edit_invoice_id">
|
|
<div class="modal-body p-4">
|
|
<div class="row g-3 mb-4">
|
|
<div class="col-md-3">
|
|
<label class="form-label fw-bold" data-en="Supplier" data-ar="المورد">Supplier</label>
|
|
<select name="customer_id" id="edit_customer_id" class="form-select select2" required>
|
|
<option value="">---</option>
|
|
</select>
|
|
</div>
|
|
<div class="col-md-2">
|
|
<label class="form-label fw-bold" data-en="Date" data-ar="التاريخ">Date</label>
|
|
<input type="date" name="invoice_date" id="edit_invoice_date" class="form-control" required>
|
|
</div>
|
|
<div class="col-md-2">
|
|
<label class="form-label fw-bold" data-en="Due Date" data-ar="تاريخ الاستحقاق">Due Date</label>
|
|
<input type="date" name="due_date" id="edit_due_date" class="form-control">
|
|
</div>
|
|
<div class="col-md-2">
|
|
<label class="form-label fw-bold" data-en="Payment Type" data-ar="طريقة الدفع">Payment Type</label>
|
|
<select name="payment_type" id="edit_payment_type" class="form-select">
|
|
<option value="cash">Cash</option>
|
|
<option value="card">Credit Card</option>
|
|
<option value="bank_transfer">Bank Transfer</option>
|
|
<option value="credit">Credit</option>
|
|
</select>
|
|
</div>
|
|
<div class="col-md-3">
|
|
<label class="form-label fw-bold" data-en="Status" data-ar="الحالة">Status</label>
|
|
<select name="status" id="edit_status" class="form-select">
|
|
<option value="unpaid">Unpaid</option>
|
|
<option value="partially_paid">Partially Paid</option>
|
|
<option value="paid">Paid</option>
|
|
</select>
|
|
</div>
|
|
<div class="col-md-3" id="editPaidAmountContainer" style="display: none;">
|
|
<label class="form-label fw-bold" data-en="Paid Amount" data-ar="المبلغ المدفوع">Paid Amount</label>
|
|
<input type="number" step="0.001" name="paid_amount" id="edit_paid_amount" class="form-control">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card mb-4">
|
|
<div class="card-body bg-light">
|
|
<label class="form-label fw-bold" data-en="Search Items" data-ar="بحث عن أصناف">Search Items</label>
|
|
<div class="position-relative">
|
|
<input type="text" id="editProductSearchInput" class="form-control" placeholder="Search by name or SKU..." autocomplete="off">
|
|
<div id="editSearchSuggestions" class="list-group position-absolute w-100 shadow-sm" style="display: none; z-index: 1000;"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="table-responsive">
|
|
<table class="table table-bordered align-middle">
|
|
<thead class="bg-light">
|
|
<tr>
|
|
<th style="width: 40%;" data-en="Item Details" data-ar="تفاصيل الصنف">Item Details</th>
|
|
<th style="width: 15%;" data-en="Qty" data-ar="الكمية">Qty</th>
|
|
<th style="width: 15%;" data-en="Unit Price" data-ar="سعر الوحدة">Unit Price</th>
|
|
<th style="width: 10%;" data-en="VAT" data-ar="الضريبة">VAT</th>
|
|
<th style="width: 15%;" data-en="Total" data-ar="الإجمالي">Total</th>
|
|
<th style="width: 5%;"></th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="editInvoiceItemsTableBody"></tbody>
|
|
<tfoot>
|
|
<tr>
|
|
<td colspan="4" class="text-end fw-bold" data-en="Subtotal" data-ar="الإجمالي الفرعي">Subtotal</td>
|
|
<td class="text-end fw-bold" id="edit_subtotal">ر.ع / OMR 0.000</td>
|
|
<td></td>
|
|
</tr>
|
|
<tr>
|
|
<td colspan="4" class="text-end fw-bold" data-en="Total VAT" data-ar="إجمالي الضريبة">Total VAT</td>
|
|
<td class="text-end fw-bold" id="edit_totalVat">ر.ع / OMR 0.000</td>
|
|
<td></td>
|
|
</tr>
|
|
<tr class="table-primary">
|
|
<td colspan="4" class="text-end fw-bold h5" data-en="Grand Total" data-ar="الإجمالي النهائي">Grand Total</td>
|
|
<td class="text-end fw-bold h5" id="edit_grandTotal">ر.ع / OMR 0.000</td>
|
|
<td></td>
|
|
</tr>
|
|
</tfoot>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-light" data-bs-dismiss="modal" data-en="Cancel" data-ar="إلغاء">Cancel</button>
|
|
<button type="submit" name="edit_invoice" class="btn btn-primary" data-en="Update Invoice" data-ar="تحديث الفاتورة">Update Invoice</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Add Quotation Modal -->
|
|
<!-- Add LPO Modal -->
|
|
<div class="modal fade" id="addLpoModal" tabindex="-1">
|
|
<div class="modal-dialog modal-xl">
|
|
<div class="modal-content border-0 shadow">
|
|
<div class="modal-header bg-primary text-white">
|
|
<h5 class="modal-title" data-en="Create New LPO" data-ar="إنشاء أمر شراء جديد">Create New LPO</h5>
|
|
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"></button>
|
|
</div>
|
|
<form method="POST">
|
|
<div class="modal-body p-4">
|
|
<div class="row g-3 mb-4">
|
|
<div class="col-md-3">
|
|
<label class="form-label fw-bold" data-en="Supplier" data-ar="المورد">Supplier</label>
|
|
<select name="supplier_id" class="form-select select2" required>
|
|
<option value="">---</option>
|
|
</select>
|
|
</div>
|
|
<div class="col-md-3">
|
|
<label class="form-label fw-bold" data-en="Date" data-ar="التاريخ">Date</label>
|
|
<input type="date" name="lpo_date" class="form-control" value="2026-03-17" required>
|
|
</div>
|
|
<div class="col-md-3">
|
|
<label class="form-label fw-bold" data-en="Delivery Date" data-ar="تاريخ التسليم">Delivery Date</label>
|
|
<input type="date" name="delivery_date" class="form-control">
|
|
</div>
|
|
<div class="col-md-3">
|
|
<label class="form-label fw-bold" data-en="Terms & Conditions" data-ar="الشروط والأحكام">Terms & Conditions</label>
|
|
<textarea name="terms_conditions" class="form-control" rows="1"></textarea>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card mb-4">
|
|
<div class="card-body bg-light">
|
|
<label class="form-label fw-bold" data-en="Search Items" data-ar="بحث عن أصناف">Search Items</label>
|
|
<div class="position-relative">
|
|
<input type="text" id="lpoProductSearchInput" class="form-control" placeholder="Search by name or SKU..." autocomplete="off">
|
|
<div id="lpoSearchSuggestions" class="list-group position-absolute w-100 shadow-sm" style="display: none; z-index: 1000;"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="table-responsive">
|
|
<table class="table table-bordered align-middle">
|
|
<thead class="bg-light">
|
|
<tr>
|
|
<th style="width: 40%;" data-en="Item Details" data-ar="تفاصيل الصنف">Item Details</th>
|
|
<th style="width: 15%;" data-en="Qty" data-ar="الكمية">Qty</th>
|
|
<th style="width: 15%;" data-en="Unit Price" data-ar="سعر الوحدة">Unit Price</th>
|
|
<th style="width: 10%;" data-en="VAT" data-ar="الضريبة">VAT</th>
|
|
<th style="width: 15%;" data-en="Total" data-ar="الإجمالي">Total</th>
|
|
<th style="width: 5%;"></th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="lpoItemsTableBody"></tbody>
|
|
<tfoot>
|
|
<tr>
|
|
<td colspan="4" class="text-end fw-bold" data-en="Subtotal" data-ar="الإجمالي الفرعي">Subtotal</td>
|
|
<td class="text-end fw-bold" id="lpo_subtotal_display">ر.ع / OMR 0.000</td>
|
|
</tr>
|
|
<tr>
|
|
<td colspan="4" class="text-end fw-bold" data-en="Total VAT" data-ar="إجمالي الضريبة">Total VAT</td>
|
|
<td class="text-end fw-bold" id="lpo_vat_display">ر.ع / OMR 0.000</td>
|
|
</tr>
|
|
<tr class="table-primary">
|
|
<td colspan="4" class="text-end fw-bold h5" data-en="Grand Total" data-ar="الإجمالي النهائي">Grand Total</td>
|
|
<td class="text-end fw-bold h5" id="lpo_grand_display">ر.ع / OMR 0.000</td>
|
|
</tr>
|
|
</tfoot>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-light" data-bs-dismiss="modal" data-en="Cancel" data-ar="إلغاء">Cancel</button>
|
|
<button type="submit" name="add_lpo" class="btn btn-primary" data-en="Create LPO" data-ar="إنشاء أمر الشراء">Create LPO</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Edit LPO Modal -->
|
|
<div class="modal fade" id="editLpoModal" tabindex="-1">
|
|
<div class="modal-dialog modal-xl">
|
|
<div class="modal-content border-0 shadow">
|
|
<div class="modal-header bg-primary text-white">
|
|
<h5 class="modal-title" data-en="Edit LPO" data-ar="تعديل أمر الشراء">Edit LPO</h5>
|
|
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"></button>
|
|
</div>
|
|
<form method="POST">
|
|
<input type="hidden" name="lpo_id" id="edit_lpo_id">
|
|
<div class="modal-body p-4">
|
|
<div class="row g-3 mb-4">
|
|
<div class="col-md-3">
|
|
<label class="form-label fw-bold" data-en="Supplier" data-ar="المورد">Supplier</label>
|
|
<select name="supplier_id" id="edit_lpo_supplier_id" class="form-select select2" required>
|
|
<option value="">---</option>
|
|
</select>
|
|
</div>
|
|
<div class="col-md-2">
|
|
<label class="form-label fw-bold" data-en="Date" data-ar="التاريخ">Date</label>
|
|
<input type="date" name="lpo_date" id="edit_lpo_date" class="form-control" required>
|
|
</div>
|
|
<div class="col-md-2">
|
|
<label class="form-label fw-bold" data-en="Delivery Date" data-ar="تاريخ التسليم">Delivery Date</label>
|
|
<input type="date" name="delivery_date" id="edit_lpo_delivery_date" class="form-control">
|
|
</div>
|
|
<div class="col-md-3">
|
|
<label class="form-label fw-bold" data-en="Status" data-ar="الحالة">Status</label>
|
|
<select name="status" id="edit_lpo_status" class="form-select">
|
|
<option value="pending">Pending</option>
|
|
<option value="converted">Converted</option>
|
|
<option value="cancelled">Cancelled</option>
|
|
</select>
|
|
</div>
|
|
<div class="col-md-12">
|
|
<label class="form-label fw-bold" data-en="Terms" data-ar="الشروط">Terms</label>
|
|
<textarea name="terms_conditions" id="edit_lpo_terms" class="form-control" rows="1"></textarea>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card mb-4">
|
|
<div class="card-body bg-light">
|
|
<label class="form-label fw-bold" data-en="Search Items" data-ar="بحث عن أصناف">Search Items</label>
|
|
<div class="position-relative">
|
|
<input type="text" id="editLpoProductSearchInput" class="form-control" placeholder="Search by name or SKU..." autocomplete="off">
|
|
<div id="editLpoSearchSuggestions" class="list-group position-absolute w-100 shadow-sm" style="display: none; z-index: 1000;"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="table-responsive">
|
|
<table class="table table-bordered align-middle">
|
|
<thead class="bg-light">
|
|
<tr>
|
|
<th style="width: 40%;" data-en="Item Details" data-ar="تفاصيل الصنف">Item Details</th>
|
|
<th style="width: 15%;" data-en="Qty" data-ar="الكمية">Qty</th>
|
|
<th style="width: 15%;" data-en="Unit Price" data-ar="سعر الوحدة">Unit Price</th>
|
|
<th style="width: 10%;" data-en="VAT" data-ar="الضريبة">VAT</th>
|
|
<th style="width: 15%;" data-en="Total" data-ar="الإجمالي">Total</th>
|
|
<th style="width: 5%;"></th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="editLpoItemsTableBody"></tbody>
|
|
<tfoot>
|
|
<tr>
|
|
<td colspan="4" class="text-end fw-bold" data-en="Subtotal" data-ar="الإجمالي الفرعي">Subtotal</td>
|
|
<td class="text-end fw-bold" id="edit_lpo_subtotal_display">ر.ع / OMR 0.000</td>
|
|
</tr>
|
|
<tr>
|
|
<td colspan="4" class="text-end fw-bold" data-en="Total VAT" data-ar="إجمالي الضريبة">Total VAT</td>
|
|
<td class="text-end fw-bold" id="edit_lpo_vat_display">ر.ع / OMR 0.000</td>
|
|
</tr>
|
|
<tr class="table-primary">
|
|
<td colspan="4" class="text-end fw-bold h5" data-en="Grand Total" data-ar="الإجمالي النهائي">Grand Total</td>
|
|
<td class="text-end fw-bold h5" id="edit_lpo_grand_display">ر.ع / OMR 0.000</td>
|
|
</tr>
|
|
</tfoot>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-light" data-bs-dismiss="modal" data-en="Cancel" data-ar="إلغاء">Cancel</button>
|
|
<button type="submit" name="edit_lpo" class="btn btn-primary" data-en="Update LPO" data-ar="تحديث أمر الشراء">Update LPO</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- View LPO Modal -->
|
|
<div class="modal fade" id="viewLpoModal" tabindex="-1">
|
|
<div class="modal-dialog modal-lg">
|
|
<div class="modal-content border-0 shadow">
|
|
<div class="modal-header bg-info text-white">
|
|
<h5 class="modal-title">LPO Details</h5>
|
|
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"></button>
|
|
</div>
|
|
<div class="modal-body p-4" id="lpoDetailsContent">
|
|
<!-- Loaded via JS -->
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal" data-en="Close" data-ar="إغلاق">Close</button>
|
|
<button type="button" class="btn btn-primary" onclick="window.printLPO()">Print LPO</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="modal fade" id="addQuotationModal" tabindex="-1">
|
|
<div class="modal-dialog modal-xl">
|
|
<div class="modal-content border-0 shadow">
|
|
<div class="modal-header bg-primary text-white">
|
|
<h5 class="modal-title" data-en="Create New Quotation" data-ar="إنشاء عرض سعر جديد">Create New Quotation</h5>
|
|
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"></button>
|
|
</div>
|
|
<form method="POST">
|
|
<div class="modal-body p-4">
|
|
<div class="row g-3 mb-4">
|
|
<div class="col-md-4">
|
|
<label class="form-label fw-bold" data-en="Customer" data-ar="العميل">Customer</label>
|
|
<select name="customer_id" class="form-select select2" required>
|
|
<option value="">---</option>
|
|
</select>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<label class="form-label fw-bold" data-en="Date" data-ar="التاريخ">Date</label>
|
|
<input type="date" name="quotation_date" class="form-control" value="2026-03-17" required>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<label class="form-label fw-bold" data-en="Valid Until" data-ar="صالح حتى">Valid Until</label>
|
|
<input type="date" name="valid_until" class="form-control">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card mb-4">
|
|
<div class="card-body bg-light">
|
|
<label class="form-label fw-bold" data-en="Search Items" data-ar="بحث عن أصناف">Search Items</label>
|
|
<div class="position-relative">
|
|
<input type="text" id="quotProductSearchInput" class="form-control" placeholder="Search by name or SKU..." autocomplete="off">
|
|
<div id="quotSearchSuggestions" class="list-group position-absolute w-100 shadow-sm" style="display: none; z-index: 1000;"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="table-responsive">
|
|
<table class="table table-bordered align-middle">
|
|
<thead class="bg-light">
|
|
<tr>
|
|
<th style="width: 40%;" data-en="Item Details" data-ar="تفاصيل الصنف">Item Details</th>
|
|
<th style="width: 15%;" data-en="Qty" data-ar="الكمية">Qty</th>
|
|
<th style="width: 15%;" data-en="Unit Price" data-ar="سعر الوحدة">Unit Price</th>
|
|
<th style="width: 10%;" data-en="VAT" data-ar="الضريبة">VAT</th>
|
|
<th style="width: 15%;" data-en="Total" data-ar="الإجمالي">Total</th>
|
|
<th style="width: 5%;"></th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="quotItemsTableBody"></tbody>
|
|
<tfoot>
|
|
<tr>
|
|
<td colspan="4" class="text-end fw-bold" data-en="Subtotal" data-ar="الإجمالي الفرعي">Subtotal</td>
|
|
<td class="text-end fw-bold" id="quot_subtotal_display">ر.ع / OMR 0.000</td>
|
|
</tr>
|
|
<tr>
|
|
<td colspan="4" class="text-end fw-bold" data-en="Total VAT" data-ar="إجمالي الضريبة">Total VAT</td>
|
|
<td class="text-end fw-bold" id="quot_vat_display">ر.ع / OMR 0.000</td>
|
|
</tr>
|
|
<tr class="table-primary">
|
|
<td colspan="4" class="text-end fw-bold h5" data-en="Grand Total" data-ar="الإجمالي النهائي">Grand Total</td>
|
|
<td class="text-end fw-bold h5" id="quot_grand_display">ر.ع / OMR 0.000</td>
|
|
</tr>
|
|
</tfoot>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-light" data-bs-dismiss="modal" data-en="Cancel" data-ar="إلغاء">Cancel</button>
|
|
<button type="submit" name="add_quotation" class="btn btn-primary" data-en="Create Quotation" data-ar="إنشاء عرض السعر">Create Quotation</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Edit Quotation Modal -->
|
|
<div class="modal fade" id="editQuotationModal" tabindex="-1">
|
|
<div class="modal-dialog modal-xl">
|
|
<div class="modal-content border-0 shadow">
|
|
<div class="modal-header bg-primary text-white">
|
|
<h5 class="modal-title" data-en="Edit Quotation" data-ar="تعديل عرض السعر">Edit Quotation</h5>
|
|
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"></button>
|
|
</div>
|
|
<form method="POST">
|
|
<input type="hidden" name="quotation_id" id="edit_quotation_id">
|
|
<div class="modal-body p-4">
|
|
<div class="row g-3 mb-4">
|
|
<div class="col-md-3">
|
|
<label class="form-label fw-bold" data-en="Customer" data-ar="العميل">Customer</label>
|
|
<select name="customer_id" id="edit_quot_customer_id" class="form-select select2" required>
|
|
<option value="">---</option>
|
|
</select>
|
|
</div>
|
|
<div class="col-md-3">
|
|
<label class="form-label fw-bold" data-en="Date" data-ar="التاريخ">Date</label>
|
|
<input type="date" name="quotation_date" id="edit_quot_date" class="form-control" required>
|
|
</div>
|
|
<div class="col-md-3">
|
|
<label class="form-label fw-bold" data-en="Valid Until" data-ar="صالح حتى">Valid Until</label>
|
|
<input type="date" name="valid_until" id="edit_quot_valid" class="form-control">
|
|
</div>
|
|
<div class="col-md-3">
|
|
<label class="form-label fw-bold" data-en="Status" data-ar="الحالة">Status</label>
|
|
<select name="status" id="edit_quot_status" class="form-select">
|
|
<option value="pending">Pending</option>
|
|
<option value="converted">Converted</option>
|
|
<option value="expired">Expired</option>
|
|
<option value="cancelled">Cancelled</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card mb-4">
|
|
<div class="card-body bg-light">
|
|
<label class="form-label fw-bold" data-en="Search Items" data-ar="بحث عن أصناف">Search Items</label>
|
|
<div class="position-relative">
|
|
<input type="text" id="editQuotProductSearchInput" class="form-control" placeholder="Search by name or SKU..." autocomplete="off">
|
|
<div id="editQuotSearchSuggestions" class="list-group position-absolute w-100 shadow-sm" style="display: none; z-index: 1000;"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="table-responsive">
|
|
<table class="table table-bordered align-middle">
|
|
<thead class="bg-light">
|
|
<tr>
|
|
<th style="width: 40%;" data-en="Item Details" data-ar="تفاصيل الصنف">Item Details</th>
|
|
<th style="width: 15%;" data-en="Qty" data-ar="الكمية">Qty</th>
|
|
<th style="width: 15%;" data-en="Unit Price" data-ar="سعر الوحدة">Unit Price</th>
|
|
<th style="width: 10%;" data-en="VAT" data-ar="الضريبة">VAT</th>
|
|
<th style="width: 15%;" data-en="Total" data-ar="الإجمالي">Total</th>
|
|
<th style="width: 5%;"></th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="editQuotItemsTableBody"></tbody>
|
|
<tfoot>
|
|
<tr>
|
|
<td colspan="4" class="text-end fw-bold" data-en="Subtotal" data-ar="الإجمالي الفرعي">Subtotal</td>
|
|
<td class="text-end fw-bold" id="edit_quot_subtotal_display">ر.ع / OMR 0.000</td>
|
|
</tr>
|
|
<tr>
|
|
<td colspan="4" class="text-end fw-bold" data-en="Total VAT" data-ar="إجمالي الضريبة">Total VAT</td>
|
|
<td class="text-end fw-bold" id="edit_quot_vat_display">ر.ع / OMR 0.000</td>
|
|
</tr>
|
|
<tr class="table-primary">
|
|
<td colspan="4" class="text-end fw-bold h5" data-en="Grand Total" data-ar="الإجمالي النهائي">Grand Total</td>
|
|
<td class="text-end fw-bold h5" id="edit_quot_grand_display">ر.ع / OMR 0.000</td>
|
|
</tr>
|
|
</tfoot>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-light" data-bs-dismiss="modal" data-en="Cancel" data-ar="إلغاء">Cancel</button>
|
|
<button type="submit" name="edit_quotation" class="btn btn-primary" data-en="Update Quotation" data-ar="تحديث عرض السعر">Update Quotation</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- View Quotation Modal -->
|
|
<div class="modal fade" id="viewQuotationModal" tabindex="-1">
|
|
<div class="modal-dialog modal-lg">
|
|
<div class="modal-content border-0 shadow">
|
|
<div class="modal-header bg-info text-white d-print-none">
|
|
<h5 class="modal-title" data-en="View Quotation" data-ar="عرض سعر">View Quotation</h5>
|
|
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"></button>
|
|
</div>
|
|
<div class="modal-body p-0" id="quotationPrintableArea">
|
|
<!-- Dynamic content -->
|
|
</div>
|
|
<div class="modal-footer d-print-none">
|
|
<div id="quotationActionButtons" class="me-auto"></div>
|
|
<button type="button" class="btn btn-secondary" onclick="window.print()"><i class="bi bi-printer"></i data-en="Print" data-ar="طباعة">Print</button>
|
|
<button type="button" class="btn btn-light" data-bs-dismiss="modal" data-en="Close" data-ar="إغلاق">Close</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<style>
|
|
@media print {
|
|
.no-print, .sidebar, .topbar, .btn, .modal-header, .modal-footer, .d-print-none,
|
|
.modal-backdrop { display: none !important; }
|
|
body { background: white !important; margin: 0 !important; padding: 0 !important; overflow: visible !important; }
|
|
.main-content { margin: 0 !important; padding: 0 !important; background: white !important; }
|
|
|
|
/* Hide all modals by default */
|
|
.modal { display: none !important; }
|
|
|
|
/* Show ONLY the active modal */
|
|
.modal.show {
|
|
position: absolute !important;
|
|
left: 0 !important;
|
|
top: 0 !important;
|
|
margin: 0 !important;
|
|
padding: 0 !important;
|
|
overflow: visible !important;
|
|
display: block !important;
|
|
visibility: visible !important;
|
|
background: white !important;
|
|
width: 100% !important;
|
|
}
|
|
|
|
.modal.show .modal-dialog { max-width: 100% !important; width: 100% !important; margin: 0 !important; padding: 0 !important; }
|
|
.modal.show .modal-content { border: none !important; box-shadow: none !important; background: white !important; }
|
|
.modal.show .modal-body { padding: 0 !important; margin: 0 !important; background: white !important; }
|
|
|
|
@page {
|
|
size: auto;
|
|
margin: 5mm;
|
|
}
|
|
|
|
.invoice-printable-container {
|
|
padding: 10px !important;
|
|
}
|
|
|
|
.mt-4 { margin-top: 1rem !important; }
|
|
.mt-5 { margin-top: 1.5rem !important; }
|
|
.mb-4 { margin-bottom: 1rem !important; }
|
|
.p-5 { padding: 1.5rem !important; }
|
|
|
|
.table-bordered th, .table-bordered td { border: 1px solid #dee2e6 !important; }
|
|
.bg-light { background-color: #f8f9fa !important; -webkit-print-color-adjust: exact; }
|
|
.text-primary { color: #0d6efd !important; -webkit-print-color-adjust: exact; }
|
|
.badge { border: 1px solid #000; color: #000 !important; }
|
|
|
|
/* Ensure the modal is the only thing visible ONLY when a modal is open */
|
|
body.modal-open:not(.printing-receipt) { visibility: hidden !important; }
|
|
body.modal-open:not(.printing-receipt) .modal.show {
|
|
visibility: visible !important;
|
|
display: block !important;
|
|
position: absolute !important;
|
|
left: 0 !important;
|
|
top: 0 !important;
|
|
width: 100% !important;
|
|
}
|
|
body.modal-open:not(.printing-receipt) .modal.show * { visibility: visible !important; }
|
|
|
|
/* Old rules that caused blank pages for nested modals */
|
|
/* body.modal-open:not(.printing-receipt) > *:not(.modal):not(.swal2-container) { display: none !important; } */
|
|
/* body.modal-open:not(.printing-receipt) .main-content { display: none !important; } */
|
|
|
|
/* POS Receipt printing specific */
|
|
body.printing-receipt .modal { display: none !important; }
|
|
body.printing-receipt .modal-backdrop { display: none !important; }
|
|
body.printing-receipt #posPrintArea {
|
|
display: block !important;
|
|
visibility: visible !important;
|
|
position: absolute !important;
|
|
left: 0 !important;
|
|
top: 0 !important;
|
|
width: 100% !important;
|
|
z-index: 9999 !important;
|
|
background: white !important;
|
|
}
|
|
body.printing-receipt #posPrintArea * {
|
|
visibility: visible !important;
|
|
}
|
|
}
|
|
.invoice-logo { max-height: 80px; width: auto; }
|
|
.invoice-header { border-bottom: 2px solid #333; padding-bottom: 20px; }
|
|
.invoice-title { font-size: 2.5rem; color: #333; letter-spacing: 2px; }
|
|
.invoice-info-card { background: #f8f9fa; border-radius: 8px; padding: 15px; height: 100%; }
|
|
.table-formal thead th { background: #333; color: #fff; border: none; text-transform: uppercase; font-size: 0.85rem; }
|
|
</style>
|
|
|
|
<div class="modal fade" id="viewInvoiceModal" tabindex="-1">
|
|
<div class="modal-dialog modal-lg">
|
|
<div class="modal-content border-0 shadow">
|
|
<div class="modal-header d-print-none">
|
|
<h5 class="modal-title" data-en="View Invoice" data-ar="عرض الفاتورة">View Invoice</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
|
</div>
|
|
<div class="modal-body p-0" id="invoicePrintableArea">
|
|
<div class="p-4 invoice-printable-container">
|
|
<div class="invoice-header mb-4">
|
|
<div class="row align-items-center">
|
|
<div class="col-6">
|
|
<img src="uploads/logo.png" alt="Logo" class="invoice-logo mb-3">
|
|
<h3 class="mb-1 fw-bold">Bahjet Al-Safa Trading</h3>
|
|
<p class="text-muted small mb-0">AL Hamra<br />
|
|
Oman</p>
|
|
<p class="text-muted small mb-0">VAT: OM25418</p>
|
|
<p class="text-muted small mb-0">Tel: 99359472</p>
|
|
</div>
|
|
<div class="col-6 text-end">
|
|
<h1 class="invoice-title fw-bold mb-0 text-uppercase">Tax Invoice / فاتورة ضريبية</h1>
|
|
<div class="mt-2"><span id="invoiceTypeLabel" class="badge"></span></div>
|
|
<div class="mt-3">
|
|
<p class="mb-0 fs-5">Invoice No / رقم الفاتورة: <strong id="invNumber" class="text-primary"></strong></p>
|
|
<p class="mb-0">Date / التاريخ: <span id="invDate" class="fw-bold"></span></p>
|
|
<p class="mb-0 small">Status / الحالة: <span id="invoiceStatusLabel"></span></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row mb-4 g-3">
|
|
<div class="col-6">
|
|
<div class="invoice-info-card">
|
|
<p class="text-muted small text-uppercase fw-bold mb-2 border-bottom pb-1" id="invPartyLabel">Bill To / فاتورة إلى</p>
|
|
<h5 class="mb-1 fw-bold"><span id="invCustomerName"></span></h5>
|
|
<p class="small text-muted mb-0" id="invCustomerTaxIdContainer">VAT / الضريبة: <span id="invCustomerTaxId"></span></p>
|
|
<p class="small text-muted mb-0" id="invCustomerPhoneContainer">Phone / الهاتف: <span id="invCustomerPhone"></span></p>
|
|
</div>
|
|
</div>
|
|
<div class="col-6">
|
|
<div class="invoice-info-card text-end">
|
|
<p class="text-muted small text-uppercase fw-bold mb-2 border-bottom pb-1">Payment Details / تفاصيل الدفع</p>
|
|
<p class="mb-1">Method / الطريقة: <strong id="invPaymentType"></strong></p>
|
|
<p class="mb-0 small text-muted">Currency / العملة: <strong>OMR / ريال عماني</strong></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<table class="table table-bordered table-formal">
|
|
<thead>
|
|
<tr>
|
|
<th>Item Description / وصف الصنف</th>
|
|
<th class="text-center" style="width: 80px;">Qty / الكمية</th>
|
|
<th class="text-end" style="width: 120px;">Unit Price / سعر الوحدة</th>
|
|
<th class="text-end" style="width: 100px;">VAT % / الضريبة %</th>
|
|
<th class="text-end" style="width: 150px;">Total / الإجمالي</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="invItemsBody"></tbody>
|
|
</table>
|
|
|
|
<div class="row mt-4">
|
|
<div class="col-6">
|
|
<div class="p-3 bg-light rounded" style="min-height: 80px;">
|
|
<p class="text-muted small text-uppercase fw-bold mb-1">Amount in Words / المبلغ بالحروف</p>
|
|
<p id="invAmountInWords" class="small fw-bold mb-0"></p>
|
|
</div>
|
|
<div class="mt-3">
|
|
<p class="text-muted small text-uppercase fw-bold mb-1">Terms & Conditions / الشروط والأحكام</p>
|
|
<ul class="small text-muted ps-3 mb-0">
|
|
<li>Goods once sold will not be taken back or exchanged.</li>
|
|
<li>Payment is due within the agreed credit period.</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div class="col-6">
|
|
<div class="d-flex justify-content-between mb-2">
|
|
<span class="text-muted">Subtotal (Excl. VAT) / المجموع الفرعي (دون الضريبة)</span>
|
|
<span id="invSubtotal" class="fw-bold text-nowrap"></span>
|
|
</div>
|
|
<div class="d-flex justify-content-between mb-2">
|
|
<span class="text-muted">VAT Amount / مبلغ الضريبة</span>
|
|
<span id="invVatAmount" class="fw-bold text-nowrap"></span>
|
|
</div>
|
|
<div class="d-flex justify-content-between mb-3 border-top pt-2">
|
|
<span class="h4 fw-bold">Grand Total / المجموع الكلي</span>
|
|
<span id="invGrandTotal" class="h4 fw-bold text-primary text-nowrap"></span>
|
|
</div>
|
|
|
|
<div id="invPaymentsSection" class="mt-4 border-top pt-3">
|
|
<p class="text-muted small text-uppercase fw-bold mb-2">Payment Tracking / تتبع الدفع</p>
|
|
<table class="table table-sm table-bordered small mb-3">
|
|
<thead class="table-light">
|
|
<tr>
|
|
<th>Date / التاريخ</th>
|
|
<th>Method / الطريقة</th>
|
|
<th class="text-end">Amount / المبلغ</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="invPaymentsBody"></tbody>
|
|
</table>
|
|
<div class="bg-light p-3 rounded">
|
|
<div class="d-flex justify-content-between small mb-1">
|
|
<span>Paid Amount / المبلغ المدفوع</span>
|
|
<span id="invPaidInfo" class="text-success fw-bold"></span>
|
|
</div>
|
|
<div class="d-flex justify-content-between small fw-bold">
|
|
<span>Balance Due / الرصيد المتبقي</span>
|
|
<span id="invBalanceInfo" class="text-danger"></span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mt-4 pt-3 border-top text-center">
|
|
<div class="row">
|
|
<div class="col-4">
|
|
<div class="border-top pt-2 mx-auto" style="width: 150px;">
|
|
<p class="small text-muted mb-0">Customer Signature / توقيع العميل</p>
|
|
</div>
|
|
</div>
|
|
<div class="col-4">
|
|
<div id="invQrCode" class="d-flex justify-content-center"></div>
|
|
</div>
|
|
<div class="col-4">
|
|
<div class="border-top pt-2 mx-auto" style="width: 150px;">
|
|
<p class="small text-muted mb-0">Authorized Signatory / التوقيع المعتمد</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<p class="text-muted x-small mt-3 mb-0">Generated by Bahjet Al-Safa Trading | Visit us at </p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer d-print-none">
|
|
<button type="button" class="btn btn-light" data-bs-dismiss="modal" data-en="Close" data-ar="إغلاق">Close</button>
|
|
<button type="button" class="btn btn-primary" onclick="window.print()"><i class="bi bi-printer me-2"></i>Print Invoice</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Pay Invoice Modal -->
|
|
<div class="modal fade" id="payInvoiceModal" tabindex="-1">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content border-0 shadow">
|
|
<div class="modal-header bg-success text-white">
|
|
<h5 class="modal-title" data-en="Record Payment" data-ar="تسجيل دفعة">Record Payment</h5>
|
|
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"></button>
|
|
</div>
|
|
<form method="POST">
|
|
<div class="modal-body">
|
|
<input type="hidden" name="invoice_id" id="pay_invoice_id">
|
|
<div class="mb-2">
|
|
<label class="form-label smaller fw-bold mb-1" data-en="Total Amount" data-ar="المبلغ الإجمالي">Total Amount</label>
|
|
<input type="text" id="pay_invoice_total" class="form-control form-control-sm" readonly>
|
|
</div>
|
|
<div class="mb-2">
|
|
<label class="form-label smaller fw-bold mb-1" data-en="Remaining Amount" data-ar="المبلغ المتبقي">Remaining Amount</label>
|
|
<input type="text" id="pay_remaining_amount" class="form-control form-control-sm" readonly>
|
|
</div>
|
|
<div class="mb-2">
|
|
<label class="form-label smaller fw-bold mb-1" data-en="Amount to Pay" data-ar="المبلغ المراد دفعه">Amount to Pay</label>
|
|
<input type="number" step="0.001" name="amount" id="pay_amount" class="form-control form-control-sm" required>
|
|
</div>
|
|
<div class="mb-2">
|
|
<label class="form-label smaller fw-bold mb-1" data-en="Payment Date" data-ar="تاريخ الدفع">Payment Date</label>
|
|
<input type="date" name="payment_date" class="form-control form-control-sm" value="2026-03-17" required>
|
|
</div>
|
|
<div class="mb-2">
|
|
<label class="form-label smaller fw-bold mb-1" data-en="Payment Method" data-ar="طريقة الدفع">Payment Method</label>
|
|
<select name="payment_method" class="form-select form-select-sm select2" required>
|
|
<option value="Cash">Cash</option>
|
|
<option value="Card">Credit Card</option>
|
|
<option value="Bank Transfer">Bank Transfer</option>
|
|
</select>
|
|
</div>
|
|
<div class="mb-2">
|
|
<label class="form-label smaller fw-bold mb-1" data-en="Notes" data-ar="ملاحظات">Notes</label>
|
|
<textarea name="notes" class="form-control form-control-sm" rows="2"></textarea>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-light" data-bs-dismiss="modal" data-en="Cancel" data-ar="إلغاء">Cancel</button>
|
|
<button type="submit" name="record_payment" class="btn btn-success" data-en="Save Payment" data-ar="حفظ الدفعة">Save Payment</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Payment Receipt Modal -->
|
|
<div class="modal fade" id="receiptModal" tabindex="-1">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content border-0 shadow">
|
|
<div class="modal-header border-0 pb-0 d-print-none">
|
|
<h5 class="modal-title">Payment Receipt</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
|
</div>
|
|
<div class="modal-body p-0" id="printableReceipt">
|
|
<div class="receipt-container p-4">
|
|
<div class="text-center mb-4">
|
|
<img src="uploads/logo.png" alt="Logo" class="invoice-logo mb-3">
|
|
<h3 class="mb-1 fw-bold">Bahjet Al-Safa Trading</h3>
|
|
<p class="text-muted small mb-0">AL Hamra<br />
|
|
Oman</p>
|
|
<hr class="my-4">
|
|
<h4 class="letter-spacing-2 fw-bold text-uppercase">Payment Receipt / سند قبض</h4>
|
|
</div>
|
|
<div class="row mb-4">
|
|
<div class="col-6">
|
|
<p class="mb-1 text-muted small text-uppercase fw-bold">Receipt No / رقم السند</p>
|
|
<p class="fw-bold h5 text-primary" id="receiptNo"></p>
|
|
</div>
|
|
<div class="col-6 text-end">
|
|
<p class="mb-1 text-muted small text-uppercase fw-bold">Date / التاريخ</p>
|
|
<p class="fw-bold" id="receiptDate"></p>
|
|
</div>
|
|
</div>
|
|
<div class="mb-4 p-3 bg-light rounded">
|
|
<div class="row mb-2">
|
|
<div class="col-4 text-muted small text-uppercase fw-bold" id="receiptPartyLabel">Received From / استلمنا من</div>
|
|
<div class="col-8 fw-bold" id="receiptCustomer"></div>
|
|
</div>
|
|
<div class="row mb-2">
|
|
<div class="col-4 text-muted small text-uppercase fw-bold" id="receiptAgainstLabel">Against Invoice / مقابل فاتورة</div>
|
|
<div class="col-8 fw-bold" id="receiptInvNo"></div>
|
|
</div>
|
|
<div class="row mb-2">
|
|
<div class="col-4 text-muted small text-uppercase fw-bold">Payment Method / طريقة الدفع</div>
|
|
<div class="col-8 fw-bold" id="receiptMethod"></div>
|
|
</div>
|
|
</div>
|
|
<div class="text-center my-4 py-4 border-top border-bottom">
|
|
<p class="mb-1 text-muted small text-uppercase fw-bold">Amount Paid / المبلغ المدفوع</p>
|
|
<h3 class="fw-bold text-primary mb-1" id="receiptAmount"></h3>
|
|
<p class="text-muted small font-italic" id="receiptAmountWords"></p>
|
|
</div>
|
|
<div id="receiptNotesContainer" class="mb-4" style="display: none;">
|
|
<p class="mb-1 text-muted small text-uppercase fw-bold">Notes / ملاحظات</p>
|
|
<p class="small p-2 bg-light rounded" id="receiptNotes"></p>
|
|
</div>
|
|
<div class="row mt-5 pt-4">
|
|
<div class="col-6">
|
|
<div class="border-top pt-2 text-center small text-muted">Receiver's Signature / توقيع المستلم</div>
|
|
</div>
|
|
<div class="col-6">
|
|
<div class="border-top pt-2 text-center small text-muted">Authorized Signatory / التوقيع المعتمد</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer border-0 d-print-none">
|
|
<button type="button" class="btn btn-light" data-bs-dismiss="modal" data-en="Close" data-ar="إغلاق">Close</button>
|
|
<button type="button" class="btn btn-primary" onclick="window.printReceipt()"><i class="bi bi-printer me-2"></i>Print Receipt</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<style>
|
|
#posPaymentModal .modal-body { padding: 0.75rem; font-size: 0.8rem; }
|
|
#posPaymentModal .amount-due-box { background: #f8f9fa; border-radius: 12px; padding: 10px 0; border: 1px solid #eee; }
|
|
#posPaymentModal .amount-due-box .label { font-size: 0.65rem; text-transform: uppercase; font-weight: 700; color: #64748b; }
|
|
#posPaymentModal .amount-due-box .value { font-size: 1rem; font-weight: 800; color: #1e293b; }
|
|
#posPaymentModal .payment-methods-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
|
|
#posPaymentModal .payment-method-btn {
|
|
padding: 6px 4px; border-radius: 10px; border: 2px solid #f1f5f9; cursor: pointer;
|
|
text-align: center; transition: all 0.2s; background: white;
|
|
}
|
|
#posPaymentModal .payment-method-btn.active { border-color: #3b82f6; background: #eff6ff; color: #1d4ed8; }
|
|
#posPaymentModal .payment-method-btn i { font-size: 1rem; display: block; margin-bottom: 2px; }
|
|
#posPaymentModal .payment-method-btn span { font-size: 0.65rem; }
|
|
#posPaymentModal .quick-pay-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 4px; }
|
|
#posPaymentModal .quick-pay-btn {
|
|
padding: 5px; border-radius: 8px; border: 1px solid #e2e8f0; background: white;
|
|
font-weight: bold; text-align: center; cursor: pointer; font-size: 0.75rem;
|
|
}
|
|
#posPaymentModal .payment-line {
|
|
display: flex; justify-content: space-between; align-items: center;
|
|
padding: 6px 10px; background: #f1f5f9; border-radius: 8px; margin-bottom: 4px;
|
|
}
|
|
#posPaymentModal .payment-line .method { font-weight: 600; color: #475569; font-size: 0.75rem; }
|
|
#posPaymentModal .form-control { font-size: 0.85rem; padding: 0.35rem 0.6rem; }
|
|
#posPaymentModal .btn-primary { padding: 0.35rem 0.8rem; font-size: 0.85rem; }
|
|
#posPaymentModal .modal-header { padding: 0.75rem 1rem 0.25rem; }
|
|
#posPaymentModal .modal-footer { padding: 0.25rem 1rem 0.75rem; }
|
|
</style>
|
|
|
|
<!-- POS Payment Modal -->
|
|
<div class="modal fade" id="posPaymentModal" tabindex="-1" aria-hidden="true">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content border-0">
|
|
<div class="modal-header border-0 pb-0">
|
|
<h5 class="modal-title fw-bold">Payment</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<div class="mb-2 p-2 border rounded bg-light shadow-sm">
|
|
<div class="d-flex justify-content-between align-items-center">
|
|
<div>
|
|
<span class="small text-muted d-block" data-en="Customer" data-ar="العميل">Customer</span>
|
|
<span class="h6 fw-bold m-0 text-primary" id="paymentCustomerName">Walk-in Customer</span>
|
|
</div>
|
|
<i class="bi bi-person-circle fs-3 text-secondary"></i>
|
|
</div>
|
|
<div id="creditCustomerSection" class="mt-2 pt-2 border-top" style="display:none;">
|
|
<label class="form-label smaller fw-bold mb-1">Select Credit Customer</label>
|
|
<select id="paymentCreditCustomer" class="form-select form-select-sm select2" onchange="cart.syncCustomer(this.value)">
|
|
<option value="">--- Select Customer ---</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="amount-due-box mb-2">
|
|
<div class="d-flex justify-content-between px-3">
|
|
<div class="text-start">
|
|
<div class="label">Amount Due</div>
|
|
<div class="value" id="paymentAmountDue">0.000</div>
|
|
</div>
|
|
<div class="text-end">
|
|
<div class="label text-danger">Remaining</div>
|
|
<div class="value text-danger" id="paymentRemaining">0.000</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="paymentList" class="mb-2">
|
|
<!-- Added payments will appear here -->
|
|
</div>
|
|
|
|
<div class="mb-2 p-2 border rounded bg-light">
|
|
<label class="form-label small fw-bold mb-1">Add Payment Method</label>
|
|
<div class="payment-methods-grid mb-2">
|
|
<div class="payment-method-btn active" data-method="cash" onclick="cart.selectMethod('cash', this)">
|
|
<i class="bi bi-cash-stack"></i>
|
|
<span class="small fw-bold">Cash</span>
|
|
</div>
|
|
<div class="payment-method-btn" data-method="card" onclick="cart.selectMethod('card', this)">
|
|
<i class="bi bi-credit-card"></i>
|
|
<span class="small fw-bold">Credit Card</span>
|
|
</div>
|
|
<div class="payment-method-btn" data-method="credit" onclick="cart.selectMethod('credit', this)">
|
|
<i class="bi bi-person-badge"></i>
|
|
<span class="small fw-bold">Credit</span>
|
|
</div>
|
|
<div class="payment-method-btn" data-method="transfer" onclick="cart.selectMethod('transfer', this)">
|
|
<i class="bi bi-bank"></i>
|
|
<span class="small fw-bold">Bank Transfer</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row g-2 align-items-end">
|
|
<div class="col">
|
|
<label class="form-label smaller fw-bold mb-1" data-en="Amount" data-ar="المبلغ">Amount</label>
|
|
<div class="input-group">
|
|
<input type="number" step="0.001" id="partialAmount" class="form-control" placeholder="0.000" oninput="cart.updateRemaining()">
|
|
</div>
|
|
</div>
|
|
<div class="col-auto">
|
|
<button type="button" class="btn btn-primary" onclick="cart.addPaymentLine()">
|
|
<i class="bi bi-plus-lg"></i data-en="Add" data-ar="إضافة">ADD</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="quick-pay-grid mt-2">
|
|
<div class="quick-pay-btn" onclick="cart.fillPartial(1)">1</div>
|
|
<div class="quick-pay-btn" onclick="cart.fillPartial(5)">5</div>
|
|
<div class="quick-pay-btn" onclick="cart.fillPartial(10)">10</div>
|
|
<div class="quick-pay-btn" onclick="cart.fillPartial(20)">20</div>
|
|
<div class="quick-pay-btn" onclick="cart.fillPartial(50)">50</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="cashPaymentSection" style="display: none;">
|
|
<div class="d-flex justify-content-between align-items-center p-3 bg-primary-subtle rounded border border-primary-subtle">
|
|
<span class="fw-bold">Total Tendered (Cash)</span>
|
|
<span class="h6 m-0 fw-bold text-primary" id="changeDue">0.000</span>
|
|
</div>
|
|
<div class="small text-muted mt-1">* Change is calculated based on cash payments only.</div>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer border-0">
|
|
<button type="button" class="btn btn-light" data-bs-dismiss="modal" data-en="Cancel" data-ar="إلغاء">Cancel</button>
|
|
<button type="button" class="btn btn-primary px-4" id="confirmPaymentBtn" onclick="cart.completeOrder()">
|
|
PAY & COMPLETE
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- POS Receipt Modal -->
|
|
<div class="modal fade" id="posReceiptModal" tabindex="-1" aria-hidden="true">
|
|
<div class="modal-dialog modal-sm">
|
|
<div class="modal-content border-0">
|
|
<div class="modal-header border-0 pb-0">
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
|
</div>
|
|
<div class="modal-body pt-0">
|
|
<div id="posReceiptContent">
|
|
<!-- Receipt content will be generated here -->
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer border-0">
|
|
<button type="button" class="btn btn-primary w-100" onclick="printPosReceipt()">
|
|
<i class="bi bi-printer me-2"></i>PRINT RECEIPT
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="posPrintArea" class="d-none d-print-block"></div>
|
|
|
|
<!-- Barcode Print Modal -->
|
|
<div class="modal fade" id="barcodePrintModal" tabindex="-1">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content border-0 shadow">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title">Print Barcode Label</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
|
</div>
|
|
<div class="modal-body text-center">
|
|
<div id="barcodeContainer" class="p-4 bg-white border mb-3 mx-auto" style="width: fit-content;">
|
|
<div id="barcodeLabelName" class="fw-bold small mb-1"></div>
|
|
<svg id="barcodeSvg"></svg>
|
|
<div id="barcodeLabelPrice" class="fw-bold mt-1"></div>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label class="form-label small">Number of Labels</label>
|
|
<input type="number" id="barcodeQty" class="form-control form-control-sm mx-auto" value="1" min="1" style="width: 80px;">
|
|
</div>
|
|
<div class="row mb-3 mx-auto" style="max-width: 200px;">
|
|
<div class="col-6">
|
|
<label class="form-label small">Width (mm)</label>
|
|
<input type="number" id="barcodeWidth" class="form-control form-control-sm" value="40" min="10">
|
|
</div>
|
|
<div class="col-6">
|
|
<label class="form-label small">Height (mm)</label>
|
|
<input type="number" id="barcodeHeight" class="form-control form-control-sm" value="25" min="10">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-light" data-bs-dismiss="modal" data-en="Close" data-ar="إغلاق">Close</button>
|
|
<button type="button" class="btn btn-primary" onclick="executeBarcodePrint()"><i class="bi bi-printer me-2"></i>Print Now</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Avery Labels Modal -->
|
|
<div class="modal fade" id="averyLabelsModal" tabindex="-1">
|
|
<div class="modal-dialog modal-xl">
|
|
<div class="modal-content border-0 shadow">
|
|
<div class="modal-header d-print-none">
|
|
<h5 class="modal-title">Avery Barcode Labels (A4)</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<div class="row mb-4 d-print-none">
|
|
<div class="col-md-4">
|
|
<label class="form-label small">Label Layout</label>
|
|
<select id="averyLayout" class="form-select form-select-sm" onchange="updateAveryPreview()">
|
|
<option value="3x7">3 x 7 (21 Labels per sheet)</option>
|
|
<option value="3x8">3 x 8 (24 Labels per sheet)</option>
|
|
<option value="4x10">4 x 10 (40 Labels per sheet)</option>
|
|
<option value="L7651">L7651 (5 x 13 - 65 Labels)</option>
|
|
<option value="L4736">L4736 (2 x 7 - 14 Labels)</option>
|
|
</select>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<label class="form-label small">Copies (Set All)</label>
|
|
<input type="number" id="averyCopies" class="form-control form-control-sm" value="1" min="1" oninput="updateAllItemQuantities()" onchange="updateAllItemQuantities()">
|
|
</div>
|
|
<div class="col-md-4 d-flex align-items-end">
|
|
<button class="btn btn-primary btn-sm w-100" onclick="window.print()"><i class="bi bi-printer me-2"></i>Print A4 Sheet</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row mb-3 d-print-none">
|
|
<div class="col-12">
|
|
<label class="form-label small fw-bold" data-en="Quantities per Item" data-ar="الكميات لكل صنف">Quantities per Item</label>
|
|
<div id="averyItemQuantities" class="border rounded p-2 bg-light" style="max-height: 150px; overflow-y: auto;">
|
|
<small class="text-muted">Select items to adjust quantities.</small>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="averyPrintArea" class="avery-container">
|
|
<!-- Labels will be generated here -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<footer class="main-footer d-print-none">
|
|
<div class="text-center py-3 border-top mt-5">
|
|
<div class="text-muted small">
|
|
Powered By <strong>Accounting</strong> • omanapp.cloud • aalabry@gmail.com • Whatsapp: +968 99359472
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
</div>
|
|
|
|
<style>
|
|
/* Avery Label Printing */
|
|
.avery-container {
|
|
background: white;
|
|
width: 210mm; /* A4 Width */
|
|
min-height: 297mm; /* A4 Height */
|
|
padding: 10mm 5mm;
|
|
margin: 0 auto;
|
|
display: grid;
|
|
gap: 2mm;
|
|
box-shadow: 0 0 10px rgba(0,0,0,0.1);
|
|
}
|
|
.avery-layout-3x7 { grid-template-columns: repeat(3, 1fr); grid-auto-rows: 38mm; }
|
|
.avery-layout-3x8 { grid-template-columns: repeat(3, 1fr); grid-auto-rows: 34mm; }
|
|
.avery-layout-4x10 { grid-template-columns: repeat(4, 1fr); grid-auto-rows: 27mm; }
|
|
.avery-layout-L7651 { grid-template-columns: repeat(5, 1fr); grid-auto-rows: 21mm; }
|
|
.avery-layout-L4736 { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 38mm; }
|
|
|
|
.avery-layout-L7651 .avery-label { padding: 2mm; }
|
|
.avery-layout-L7651 .avery-label svg { height: 25px; }
|
|
.avery-layout-L7651 .avery-label div { font-size: 8px !important; }
|
|
|
|
.avery-label {
|
|
border: 1px dashed #eee;
|
|
padding: 5mm;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
text-align: center;
|
|
overflow: hidden;
|
|
background: white;
|
|
}
|
|
|
|
.avery-label svg {
|
|
max-width: 100%;
|
|
height: auto;
|
|
}
|
|
|
|
@media print {
|
|
body.printing-avery .sidebar,
|
|
body.printing-avery .topbar,
|
|
body.printing-avery .modal-header,
|
|
body.printing-avery .d-print-none,
|
|
body.printing-avery .modal-backdrop {
|
|
display: none !important;
|
|
}
|
|
body.printing-avery .modal {
|
|
position: absolute !important;
|
|
left: 0 !important;
|
|
top: 0 !important;
|
|
width: 100% !important;
|
|
display: block !important;
|
|
visibility: visible !important;
|
|
background: white !important;
|
|
}
|
|
body.printing-avery .modal-dialog {
|
|
max-width: 100% !important;
|
|
width: 100% !important;
|
|
margin: 0 !important;
|
|
padding: 0 !important;
|
|
}
|
|
body.printing-avery .modal-content {
|
|
border: none !important;
|
|
}
|
|
body.printing-avery .avery-label {
|
|
border: none !important;
|
|
}
|
|
.avery-container {
|
|
margin: 0 !important;
|
|
padding: 10mm 5mm !important;
|
|
box-shadow: none !important;
|
|
border: none !important;
|
|
}
|
|
}
|
|
</style>
|
|
|
|
<script>
|
|
// Avery Label Logic
|
|
const selectAllItems = document.getElementById('selectAllItems');
|
|
const bulkBarcodeBtn = document.getElementById('bulkBarcodeBtn');
|
|
|
|
if (selectAllItems) {
|
|
selectAllItems.addEventListener('change', function() {
|
|
document.querySelectorAll('.item-checkbox').forEach(cb => {
|
|
cb.checked = this.checked;
|
|
});
|
|
toggleBulkBtn();
|
|
});
|
|
}
|
|
|
|
document.addEventListener('change', function(e) {
|
|
if (e.target.classList.contains('item-checkbox')) {
|
|
toggleBulkBtn();
|
|
}
|
|
});
|
|
|
|
function toggleBulkBtn() {
|
|
const checked = document.querySelectorAll('.item-checkbox:checked').length;
|
|
if (bulkBarcodeBtn) {
|
|
bulkBarcodeBtn.style.display = checked > 0 ? 'inline-block' : 'none';
|
|
}
|
|
}
|
|
|
|
window.openAveryModal = function() {
|
|
const modal = new bootstrap.Modal(document.getElementById('averyLabelsModal'));
|
|
const checkedItems = document.querySelectorAll('.item-checkbox:checked');
|
|
const container = document.getElementById('averyItemQuantities');
|
|
const defaultCopies = parseInt(document.getElementById('averyCopies').value) || 1;
|
|
|
|
if (container) {
|
|
container.innerHTML = '';
|
|
if (checkedItems.length === 0) {
|
|
container.innerHTML = '<small class="text-muted" data-en="No items selected." data-ar="لم يتم تحديد أي صنف.">No items selected.</small>';
|
|
} else {
|
|
const table = document.createElement('table');
|
|
table.className = 'table table-sm table-borderless mb-0';
|
|
const tbody = document.createElement('tbody');
|
|
|
|
checkedItems.forEach(cb => {
|
|
const sku = cb.dataset.sku;
|
|
const name = cb.dataset.name;
|
|
const id = cb.dataset.id;
|
|
|
|
const tr = document.createElement('tr');
|
|
tr.innerHTML = `
|
|
<td class="align-middle" style="width: 70%; font-size: 0.9em;">${name} <span class="text-muted">(${sku})</span></td>
|
|
<td class="align-middle" style="width: 30%;">
|
|
<input type="number" class="form-control form-control-sm item-qty-input"
|
|
data-id="${id}" value="${defaultCopies}" min="0" onchange="updateAveryPreview()" onkeyup="updateAveryPreview()">
|
|
</td>
|
|
`;
|
|
tbody.appendChild(tr);
|
|
});
|
|
table.appendChild(tbody);
|
|
container.appendChild(table);
|
|
}
|
|
}
|
|
|
|
modal.show();
|
|
updateAveryPreview();
|
|
};
|
|
|
|
window.updateAllItemQuantities = function() {
|
|
const globalQty = document.getElementById('averyCopies').value;
|
|
const itemInputs = document.querySelectorAll('.item-qty-input');
|
|
itemInputs.forEach(input => {
|
|
input.value = globalQty;
|
|
});
|
|
updateAveryPreview();
|
|
};
|
|
|
|
window.updateAveryPreview = function() {
|
|
const layout = document.getElementById('averyLayout').value;
|
|
const container = document.getElementById('averyPrintArea');
|
|
const checkedItems = document.querySelectorAll('.item-checkbox:checked');
|
|
|
|
container.className = 'avery-container avery-layout-' + layout;
|
|
container.innerHTML = '';
|
|
|
|
checkedItems.forEach(cb => {
|
|
const sku = cb.dataset.sku;
|
|
const name = cb.dataset.name;
|
|
const price = cb.dataset.price;
|
|
const id = cb.dataset.id;
|
|
|
|
// Find specific quantity input
|
|
const qtyInput = document.querySelector(`.item-qty-input[data-id="${id}"]`);
|
|
let copies = 1;
|
|
if (qtyInput) {
|
|
copies = parseInt(qtyInput.value) || 0;
|
|
} else {
|
|
copies = parseInt(document.getElementById('averyCopies').value) || 1;
|
|
}
|
|
|
|
for (let i = 0; i < copies; i++) {
|
|
const label = document.createElement('div');
|
|
label.className = 'avery-label';
|
|
const uniqueId = Math.random().toString(36).substr(2, 9);
|
|
const svgId = `bc-${sku}-${uniqueId}`;
|
|
label.innerHTML = `
|
|
<div style="font-size: 9px; font-weight: bold; margin-bottom: 2px; line-height: 1.1; overflow: hidden; text-overflow: ellipsis; width: 100%;">${name}</div>
|
|
<svg id="${svgId}"></svg>
|
|
<div style="font-size: 11px; font-weight: bold; margin-top: 2px;">OMR ${price}</div>
|
|
`;
|
|
container.appendChild(label);
|
|
|
|
setTimeout(() => {
|
|
if (document.getElementById(svgId)) {
|
|
const bcHeight = layout === 'L7651' ? 20 : 35;
|
|
JsBarcode(`#${svgId}`, sku, {
|
|
format: "CODE128",
|
|
width: layout === 'L7651' ? 1.0 : 1.2,
|
|
height: bcHeight,
|
|
displayValue: true,
|
|
fontSize: layout === 'L7651' ? 8 : 10,
|
|
margin: 0
|
|
});
|
|
}
|
|
}, 0);
|
|
}
|
|
});
|
|
};
|
|
|
|
window.addEventListener('beforeprint', () => {
|
|
if (document.getElementById('averyLabelsModal') && document.getElementById('averyLabelsModal').classList.contains('show')) {
|
|
document.body.classList.add('printing-avery');
|
|
}
|
|
});
|
|
window.addEventListener('afterprint', () => {
|
|
document.body.classList.remove('printing-avery');
|
|
});
|
|
</script>
|
|
|
|
|
|
|
|
<script>
|
|
window.printItemBarcode = function(sku, name, price) {
|
|
if (!sku) {
|
|
Swal.fire('Error', 'This item has no SKU/Barcode assigned.', 'error');
|
|
return;
|
|
}
|
|
document.getElementById('barcodeLabelName').textContent = name;
|
|
document.getElementById('barcodeLabelPrice').textContent = 'OMR ' + price;
|
|
|
|
JsBarcode("#barcodeSvg", sku, {
|
|
format: "CODE128",
|
|
lineColor: "#000",
|
|
width: 2,
|
|
height: 50,
|
|
displayValue: true
|
|
});
|
|
|
|
const modal = new bootstrap.Modal(document.getElementById('barcodePrintModal'));
|
|
modal.show();
|
|
};
|
|
|
|
window.executeBarcodePrint = function() {
|
|
const qty = parseInt(document.getElementById('barcodeQty').value) || 1;
|
|
const width = parseInt(document.getElementById('barcodeWidth').value) || 40;
|
|
const height = parseInt(document.getElementById('barcodeHeight').value) || 25;
|
|
|
|
// Get content
|
|
const name = document.getElementById('barcodeLabelName').innerText;
|
|
const price = document.getElementById('barcodeLabelPrice').innerText;
|
|
const svg = document.getElementById('barcodeSvg').outerHTML;
|
|
|
|
// Create a hidden iframe
|
|
const iframe = document.createElement('iframe');
|
|
iframe.style.position = 'absolute';
|
|
iframe.style.width = '0px';
|
|
iframe.style.height = '0px';
|
|
iframe.style.border = 'none';
|
|
document.body.appendChild(iframe);
|
|
|
|
const doc = iframe.contentWindow.document;
|
|
|
|
let labelsHtml = '';
|
|
for (let i = 0; i < qty; i++) {
|
|
labelsHtml += `
|
|
<div class="label-container">
|
|
<div class="label-name">${name}</div>
|
|
${svg}
|
|
<div class="label-price">${price}</div>
|
|
</div>
|
|
`;
|
|
}
|
|
|
|
doc.open();
|
|
doc.write(`
|
|
<html>
|
|
<head>
|
|
<style>
|
|
@page { size: ${width}mm ${height}mm; margin: 0; }
|
|
body { margin: 0; padding: 0; font-family: sans-serif; }
|
|
.label-container {
|
|
width: ${width}mm;
|
|
height: ${height}mm;
|
|
page-break-after: always;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: center;
|
|
text-align: center;
|
|
overflow: hidden;
|
|
box-sizing: border-box;
|
|
padding: 1mm;
|
|
}
|
|
.label-container:last-child { page-break-after: avoid; }
|
|
.label-name { font-size: 9px; font-weight: bold; margin-bottom: 2px; line-height: 1.1; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
|
|
.label-price { font-size: 12px; font-weight: bold; margin-top: 2px; }
|
|
svg { max-width: 100%; height: auto; max-height: 70%; display: block; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
${labelsHtml}
|
|
</body>
|
|
</html>
|
|
`);
|
|
doc.close();
|
|
|
|
iframe.contentWindow.focus();
|
|
setTimeout(() => {
|
|
iframe.contentWindow.print();
|
|
setTimeout(() => {
|
|
document.body.removeChild(iframe);
|
|
}, 2000);
|
|
}, 500);
|
|
};
|
|
|
|
window.viewAndPrintA4Invoice = function(data, autoPrint = true) {
|
|
if (!data) return;
|
|
// Reuse view logic
|
|
document.getElementById('invNumber').textContent = 'INV-' + data.id.toString().padStart(5, '0');
|
|
document.getElementById('invDate').textContent = data.invoice_date;
|
|
document.getElementById('invPaymentType').textContent = data.payment_type ? data.payment_type.toUpperCase() : 'CASH';
|
|
document.getElementById('invCustomerName').textContent = data.customer_name || '---';
|
|
|
|
const phoneEl = document.getElementById('invCustomerPhone');
|
|
const phoneContainer = document.getElementById('invCustomerPhoneContainer');
|
|
if (data.customer_phone) {
|
|
phoneEl.textContent = data.customer_phone;
|
|
phoneContainer.style.display = 'block';
|
|
} else {
|
|
phoneContainer.style.display = 'none';
|
|
}
|
|
|
|
const taxIdEl = document.getElementById('invCustomerTaxId');
|
|
const taxIdContainer = document.getElementById('invCustomerTaxIdContainer');
|
|
if (data.customer_tax_id) {
|
|
taxIdEl.textContent = data.customer_tax_id;
|
|
taxIdContainer.style.display = 'block';
|
|
} else {
|
|
taxIdContainer.style.display = 'none';
|
|
}
|
|
|
|
document.getElementById('invAmountInWords').textContent = data.total_in_words || '';
|
|
|
|
document.getElementById('invPartyLabel').textContent = data.type === 'sale' ? 'Bill To / فاتورة إلى' : 'Bill From / فاتورة من';
|
|
document.getElementById('invPartyLabel').setAttribute('data-en', data.type === 'sale' ? 'Bill To' : 'Bill From');
|
|
document.getElementById('invPartyLabel').setAttribute('data-ar', data.type === 'sale' ? 'فاتورة إلى' : 'فاتورة من');
|
|
document.getElementById('invoiceTypeLabel').textContent = data.type;
|
|
document.getElementById('invoiceTypeLabel').className = 'badge text-uppercase ' + (data.type === 'sale' ? 'bg-success' : 'bg-warning');
|
|
|
|
const statusLabel = document.getElementById('invoiceStatusLabel');
|
|
let statusClass = 'bg-secondary';
|
|
let statusEn = data.status ? (data.status.charAt(0).toUpperCase() + data.status.slice(1)) : '---';
|
|
if (data.status === 'paid') statusClass = 'bg-success';
|
|
else if (data.status === 'unpaid') statusClass = 'bg-danger';
|
|
else if (data.status === 'partially_paid') {
|
|
statusClass = 'bg-warning text-dark';
|
|
statusEn = 'Partially Paid';
|
|
}
|
|
|
|
statusLabel.textContent = statusEn;
|
|
statusLabel.className = 'badge text-uppercase ' + statusClass;
|
|
|
|
const body = document.getElementById('invItemsBody');
|
|
body.innerHTML = '';
|
|
if (data.items) {
|
|
data.items.forEach(item => {
|
|
const tr = document.createElement('tr');
|
|
tr.innerHTML = `
|
|
<td>${item.name_en} / ${item.name_ar}</td>
|
|
<td class="text-center">${item.quantity}</td>
|
|
<td class="text-end"><small>ر.ع / OMR</small> ${parseFloat(item.unit_price).toFixed(3)}</td>
|
|
<td class="text-end">${parseFloat(item.vat_rate || 0).toFixed(2)}%</td>
|
|
<td class="text-end"><small>ر.ع / OMR</small> ${parseFloat(item.total_price).toFixed(3)}</td>
|
|
`;
|
|
body.appendChild(tr);
|
|
});
|
|
}
|
|
const vatVal = parseFloat(data.vat_amount || 0);
|
|
const totalVal = parseFloat(data.total_amount || 0);
|
|
const grandTotalValue = (parseFloat(data.total_with_vat) || (totalVal + vatVal));
|
|
|
|
if (document.getElementById('invSubtotal')) document.getElementById('invSubtotal').innerHTML = '<small>ر.ع / OMR</small> ' + (grandTotalValue - vatVal).toFixed(3);
|
|
if (document.getElementById('invVatAmount')) document.getElementById('invVatAmount').innerHTML = '<small>ر.ع / OMR</small> ' + vatVal.toFixed(2);
|
|
if (document.getElementById('invGrandTotal')) document.getElementById('invGrandTotal').innerHTML = '<small>ر.ع / OMR</small> ' + grandTotalValue.toFixed(3);
|
|
|
|
if (document.getElementById('invPaidInfo')) document.getElementById('invPaidInfo').innerHTML = '<small>ر.ع / OMR</small> ' + parseFloat(data.paid_amount || 0).toFixed(3);
|
|
const balance = grandTotalValue - parseFloat(data.paid_amount || 0);
|
|
if (document.getElementById('invBalanceInfo')) document.getElementById('invBalanceInfo').innerHTML = '<small>ر.ع / OMR</small> ' + balance.toFixed(3);
|
|
|
|
// Generate QR Code for Zakat, Tax and Customs Authority (ZATCA) style or simple formal
|
|
const companyName = "Bahjet Al-Safa Trading";
|
|
const vatNo = "OM25418";
|
|
const qrData = `Seller: ${companyName}\nVAT: ${vatNo}\nInvoice: INV-${data.id.toString().padStart(5, '0')}\nDate: ${data.invoice_date}\nTotal: ${grandTotalValue.toFixed(3)}`;
|
|
const qrUrl = `https://api.qrserver.com/v1/create-qr-code/?size=100x100&data=${encodeURIComponent(qrData)}`;
|
|
if (document.getElementById('invQrCode')) {
|
|
document.getElementById('invQrCode').innerHTML = `<img src="${qrUrl}" alt="QR Code" style="width: 100px; height: 100px;" class="border p-1 bg-white">`;
|
|
}
|
|
|
|
const viewModal = bootstrap.Modal.getOrCreateInstance(document.getElementById('viewInvoiceModal'));
|
|
viewModal.show();
|
|
|
|
if (autoPrint) {
|
|
setTimeout(() => { window.print(); }, 1000);
|
|
}
|
|
|
|
fetch(`index.php?action=get_payments&invoice_id=${data.id}`)
|
|
.then(res => res.json())
|
|
.then(payments => {
|
|
const paymentsBody = document.getElementById('invPaymentsBody');
|
|
const paymentsSection = document.getElementById('invPaymentsSection');
|
|
if (paymentsBody) paymentsBody.innerHTML = '';
|
|
if (payments && payments.length > 0) {
|
|
if (paymentsBody) {
|
|
payments.forEach(p => {
|
|
const tr = document.createElement('tr');
|
|
tr.innerHTML = `<td>${p.payment_date}</td><td>${p.payment_method}</td><td class="text-end fw-bold">OMR ${parseFloat(p.amount).toFixed(3)}</td>`;
|
|
paymentsBody.appendChild(tr);
|
|
});
|
|
}
|
|
if (paymentsSection) paymentsSection.style.display = 'block';
|
|
} else {
|
|
if (paymentsSection) paymentsSection.style.display = 'none';
|
|
}
|
|
}).catch(err => console.error('Error fetching payments:', err));
|
|
};
|
|
|
|
window.printPosReceiptFromInvoice = function(inv) {
|
|
const container = document.getElementById('posReceiptContent');
|
|
const itemsHtml = inv.items.map(item => {
|
|
const itemTotal = item.unit_price * item.quantity;
|
|
const vatRate = parseFloat(item.vat_rate !== undefined && item.vat_rate !== null ? item.vat_rate : 0);
|
|
const vatAmount = itemTotal * (vatRate / (100 + vatRate));
|
|
return `
|
|
<tr>
|
|
<td>${item.name_en} / ${item.name_ar}<br><small>${item.quantity} x ${parseFloat(item.unit_price).toFixed(3)}</small></td>
|
|
<td style="text-align: right; vertical-align: bottom;">${vatAmount.toFixed(2)}</td>
|
|
<td style="text-align: right; vertical-align: bottom;">${itemTotal.toFixed(3)}</td>
|
|
</tr>
|
|
`;
|
|
}).join('');
|
|
|
|
const totalVat = inv.items.reduce((sum, item) => {
|
|
const itemTotal = item.unit_price * item.quantity;
|
|
const vatRate = parseFloat(item.vat_rate !== undefined && item.vat_rate !== null ? item.vat_rate : 0);
|
|
return sum + (itemTotal * (vatRate / (100 + vatRate)));
|
|
}, 0);
|
|
const subtotal = inv.items.reduce((sum, item) => sum + (item.unit_price * item.quantity), 0);
|
|
|
|
const companyName = "Bahjet Al-Safa Trading";
|
|
const companyPhone = "99359472";
|
|
const companyVat = "OM25418";
|
|
const companyLogo = "uploads/logo.png";
|
|
|
|
container.innerHTML = `
|
|
<div class="thermal-receipt">
|
|
<div class="center">
|
|
${companyLogo ? `<img src="${companyLogo}" alt="Logo" style="max-height: 60px; width: auto; margin-bottom: 10px; display: block; margin-left: auto; margin-right: auto;">` : ''}
|
|
<h5 class="mb-0 fw-bold">${companyName}</h5>
|
|
${companyPhone ? `<div>Tel: ${companyPhone}</div>` : ''}
|
|
${companyVat ? `<div>VAT: ${companyVat}</div>` : ''}
|
|
<div class="separator"></div>
|
|
<h6 class="fw-bold">TAX INVOICE / فاتورة ضريبية</h6>
|
|
<div>Inv / رقم: INV-${inv.id.toString().padStart(5, '0')}</div>
|
|
<div>Date / التاريخ: ${inv.invoice_date}</div>
|
|
<div class="separator"></div>
|
|
</div>
|
|
<div>
|
|
<strong>Customer / العميل:</strong> ${inv.customer_name || 'Walk-in / عميل عابر'}
|
|
</div>
|
|
<div class="separator"></div>
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<th>ITEM / الصنف</th>
|
|
<th style="text-align: right;">VAT / الضريبة</th>
|
|
<th style="text-align: right;">TOTAL / الإجمالي</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
${itemsHtml}
|
|
</tbody>
|
|
</table>
|
|
<div class="separator"></div>
|
|
<div class="d-flex justify-content-between small">
|
|
<span>Subtotal (Excl. VAT) / المجموع الفرعي (دون الضريبة)</span>
|
|
<span>ر.ع / OMR ${(subtotal - totalVat).toFixed(3)}</span>
|
|
</div>
|
|
<div class="d-flex justify-content-between small">
|
|
<span>VAT / الضريبة</span>
|
|
<span>ر.ع / OMR ${totalVat.toFixed(2)}</span>
|
|
</div>
|
|
<div class="total-row d-flex justify-content-between">
|
|
<span>TOTAL (Incl. VAT) / الإجمالي (شامل الضريبة)</span>
|
|
<span>ر.ع / OMR ${subtotal.toFixed(3)}</span>
|
|
</div>
|
|
<div class="d-flex justify-content-between small">
|
|
<span>PAID / المدفوع</span>
|
|
<span>ر.ع / OMR ${parseFloat(inv.paid_amount).toFixed(3)}</span>
|
|
</div>
|
|
<div class="d-flex justify-content-between small fw-bold">
|
|
<span>BALANCE / الرصيد</span>
|
|
<span>ر.ع / OMR ${(subtotal - inv.paid_amount).toFixed(3)}</span>
|
|
</div>
|
|
<div class="separator"></div>
|
|
<div class="center small">
|
|
<p>Thank You for your business! / شكراً لتعاملكم معنا!</p>
|
|
</div>
|
|
</div>
|
|
`;
|
|
|
|
const posModal = new bootstrap.Modal(document.getElementById('posReceiptModal'));
|
|
posModal.show();
|
|
};
|
|
|
|
function printPosReceipt() {
|
|
const content = document.getElementById('posReceiptContent').innerHTML;
|
|
const printArea = document.getElementById('posPrintArea');
|
|
printArea.innerHTML = `<div class="thermal-receipt thermal-receipt-print">${content}</div>`;
|
|
|
|
document.body.classList.add('printing-receipt');
|
|
window.print();
|
|
document.body.classList.remove('printing-receipt');
|
|
location.reload();
|
|
}
|
|
|
|
// --- Language Apply Script ---
|
|
function applyLanguage(node) {
|
|
const docLang = document.documentElement.lang || 'ar';
|
|
const targetAttr = docLang === 'ar' ? 'data-ar' : 'data-en';
|
|
|
|
let elements = [];
|
|
if (node.nodeType === Node.ELEMENT_NODE) {
|
|
if (node.hasAttribute(targetAttr)) {
|
|
elements.push(node);
|
|
}
|
|
node.querySelectorAll('[' + targetAttr + ']').forEach(el => elements.push(el));
|
|
}
|
|
|
|
elements.forEach(el => {
|
|
const text = el.getAttribute(targetAttr);
|
|
if (!text) return;
|
|
|
|
if (el.hasAttribute('placeholder')) {
|
|
el.setAttribute('placeholder', text);
|
|
}
|
|
if (el.hasAttribute('title')) {
|
|
el.setAttribute('title', text);
|
|
}
|
|
|
|
let textNodes = [];
|
|
el.childNodes.forEach(child => {
|
|
if (child.nodeType === Node.TEXT_NODE && child.nodeValue.trim() !== '') {
|
|
textNodes.push(child);
|
|
}
|
|
});
|
|
|
|
if (textNodes.length > 0) {
|
|
textNodes[0].nodeValue = text;
|
|
for (let i = 1; i < textNodes.length; i++) {
|
|
textNodes[i].nodeValue = '';
|
|
}
|
|
} else if (el.children.length === 1 && ['STRONG', 'B', 'SPAN', 'SMALL'].includes(el.children[0].tagName)) {
|
|
el.children[0].textContent = text;
|
|
} else if (el.children.length === 0) {
|
|
el.textContent = text;
|
|
}
|
|
});
|
|
}
|
|
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
applyLanguage(document.body);
|
|
|
|
const observer = new MutationObserver(mutations => {
|
|
mutations.forEach(mutation => {
|
|
mutation.addedNodes.forEach(node => {
|
|
if (node.nodeType === Node.ELEMENT_NODE) {
|
|
applyLanguage(node);
|
|
}
|
|
});
|
|
});
|
|
});
|
|
observer.observe(document.body, { childList: true, subtree: true });
|
|
});
|
|
// -----------------------------
|
|
|
|
</script>
|
|
</body>
|
|
</html>
|