feat: port inventory (انبارداری) page from tauri to admin dashboard

Add a per-tenant (doctor/clinic) Inventory domain and admin page, ported from clinic-pro-tauri /inventory (which was static/mock) into a real feature. Backend (src/Inventory/): - Entities InventoryItem, InventoryPackage, InventoryPackageItem, scoped via entity_type/entity_id like TenantTag. Item status is derived, package total and availability derived at read time. - InventoryService (stats, package assembly, availability), thin InventoryController with CRUD for items and packages + categories endpoint. - Migration + docs/api/inventory.md + functional tests (10 tests, 42 assertions). Frontend (assets/admin/): - InventoryPage with two tabs (کالاهای مصرفی / پکیج), stat cards, items table (desktop + mobile cards), packages accordion, add/edit item and package modals, search + category filter — pixel-matched to the tauri source. - useInventory hook (TanStack Query), route + sidebar link for doctor/clinic. - Vitest coverage (real data, empty state, modal, packages tab). Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
2026-07-15 13:48:29 +03:30
parent f1e9129a2c
commit 519bc8d7f6
23 changed files with 2124 additions and 0 deletions
@@ -0,0 +1,89 @@
+import React from 'react';
+import { PencilSquareIcon, TrashIcon } from '@heroicons/react/24/outline';
+import { formatRial, formatNumber } from '../../lib/utils';
+import type { InventoryItem } from '../../hooks/useInventory';
+import InventoryStatusBadge from './InventoryStatusBadge';
+import InventoryActionsMenu from './InventoryActionsMenu';
+
+interface Props {
+  items: InventoryItem[];
+  onEdit: (item: InventoryItem) => void;
+  onDelete: (item: InventoryItem) => void;
+}
+
+const HEAD = ['نام کالا', 'موجودی', 'واحد', 'قیمت', 'وضعیت', 'عملیات'];
+
+/** Consumable-items list: desktop table + mobile card grid (tauri InventoryList). */
+export default function InventoryItemsTable({ items, onEdit, onDelete }: Props) {
+  return (
+    <div style={{ width: '100%' }}>
+      {/* Desktop table */}
+      <div
+        className="inv-desktop"
+        style={{ border: '1px solid #E7E7E7', borderRadius: 8, overflow: 'hidden' }}
+      >
+        <table className="inv-table">
+          <thead>
+            <tr>{HEAD.map((h) => <th key={h}>{h}</th>)}</tr>
+          </thead>
+          <tbody>
+            {items.map((item) => (
+              <tr key={item.uuid}>
+                <td style={{ color: 'var(--text-2)' }}>{item.name}</td>
+                <td>{formatNumber(item.stock)}</td>
+                <td>{item.unit}</td>
+                <td>{formatRial(item.price)}</td>
+                <td><InventoryStatusBadge status={item.status} /></td>
+                <td><InventoryActionsMenu item={item} onEdit={onEdit} onDelete={onDelete} /></td>
+              </tr>
+            ))}
+          </tbody>
+        </table>
+      </div>
+
+      {/* Mobile cards */}
+      <ul
+        className="inv-mobile"
+        style={{ gridTemplateColumns: 'repeat(auto-fill, minmax(260px, 1fr))', gap: 16, margin: 0, padding: 0, listStyle: 'none' }}
+      >
+        {items.map((item) => (
+          <li
+            key={item.uuid}
+            style={{
+              padding: 12, background: 'var(--surface)', border: '1px solid var(--border)',
+              borderRadius: 8, boxShadow: 'var(--shadow-sm)',
+            }}
+          >
+            <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', marginBottom: 12 }}>
+              <span style={{ color: 'var(--text)', fontSize: 14, fontWeight: 600 }}>{item.name}</span>
+              <InventoryStatusBadge status={item.status} />
+            </div>
+            {[
+              ['موجودی:', formatNumber(item.stock)],
+              ['واحد:', item.unit],
+              ['قیمت:', formatRial(item.price)],
+            ].map(([label, value], i, arr) => (
+              <div key={label}>
+                <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 12 }}>
+                  <span style={{ color: 'var(--text-3)', fontSize: 14 }}>{label}</span>
+                  <span style={{ color: 'var(--text-2)', fontSize: 14, fontWeight: 500 }}>{value}</span>
+                </div>
+                {i < arr.length - 1 && (
+                  <div style={{ height: 1, background: 'var(--border)', margin: '8px auto', width: 'calc(100% - 20px)' }} />
+                )}
+              </div>
+            ))}
+            <div style={{ display: 'flex', justifyContent: 'flex-end', gap: 8, marginTop: 12 }}>
+              <button className="btn sm ghost" aria-label="ویرایش" onClick={() => onEdit(item)} style={{ color: 'var(--text-2)' }}>
+                <PencilSquareIcon style={{ width: 16 }} />
+              </button>
+              <button className="btn sm ghost" aria-label="حذف" onClick={() => onDelete(item)} style={{ color: 'var(--danger)' }}>
+                <TrashIcon style={{ width: 16 }} />
+              </button>
+            </div>
+          </li>
+        ))}
+      </ul>
+    </div>
+  );
+}