feat: add support for individual consumable items in service items

- Introduced `consumables` field in `ServiceItem` to allow multiple individual items alongside inventory packages.
- Created `ServiceItemConsumable` entity to manage individual consumable items linked to a service.
- Updated `ServiceItemController` to handle CRUD operations for consumables.
- Enhanced `ServiceDetailPage` and `ServiceItemFormModal` to display and manage consumables.
- Added tests to ensure functionality for adding, updating, and validating consumables.
- Updated API documentation to reflect changes in service item structure and consumables.

assets/admin/pages/ServiceDetailPage.test.tsx

@@ -55,6 +55,9 @@ const mockApi = (item: unknown = ITEM, notFound = false) => {
     if (url.includes('/tenant-insurances')) return Promise.resolve({ data: { data: [
       { uuid: 'ins1', insurance_name: 'بیمه ایران', insurance_kind: 'basic', coverage_percent: 70 },
     ] } });
+    if (url.includes('/inventory-items')) return Promise.resolve({ success: true, data: { items: [
+      { uuid: 'inv1', name: 'گاز استریل', unit: 'عدد', price: 50_000, stock: 100 },
+    ] } });
     if (url.includes('/inventory-packages')) return Promise.resolve({ success: true, data: [
       {
         uuid: 'pkg1', title: 'پکیج سرم', total: 1_200_000, available: true,
@@ -145,14 +148,42 @@ describe('ServiceDetailPage (جزئیات سرویس)', () => {
     expect(screen.getByText('۲ عدد')).toBeInTheDocument();
   });
 
-  it('سرویس بدون پکیج، حالت خالی با لینک انبار می‌دهد', async () => {
+  it('سرویس بدون هیچ کالایی، حالت خالی با لینک انبار می‌دهد', async () => {
     render();
     fireEvent.click(await screen.findByText('کالاهای مرتبط'));
 
-    expect(await screen.findByText('پکیج کالایی به این سرویس متصل نیست')).toBeInTheDocument();
+    expect(await screen.findByText('کالایی به این سرویس متصل نیست')).toBeInTheDocument();
     expect(screen.getByText('مدیریت انبار')).toBeInTheDocument();
   });
 
+  it('پکیج و کالای تکی هم‌زمان در تب کالاها نمایش داده می‌شوند', async () => {
+    mockApi({
+      ...ITEM,
+      inventory_package_uuid: 'pkg1',
+      inventory_package_title: 'پکیج سرم',
+      consumables: [{ item_uuid: 'inv1', name: 'گاز استریل', unit: 'عدد', price: 50_000, stock: 100, amount: 3 }],
+    });
+    render();
+    fireEvent.click(await screen.findByText('کالاهای مرتبط'));
+
+    expect(await screen.findByText('پکیج')).toBeInTheDocument();
+    expect(screen.getByText('پکیج سرم')).toBeInTheDocument();
+    expect(screen.getByText('کالاهای تکی')).toBeInTheDocument();
+    expect(screen.getByText('گاز استریل')).toBeInTheDocument();
+    expect(screen.getByText('۳ عدد')).toBeInTheDocument();
+  });
+
+  it('کالای تکی با موجودی ناکافی نشان‌دار می‌شود', async () => {
+    mockApi({
+      ...ITEM,
+      consumables: [{ item_uuid: 'inv1', name: 'گاز استریل', unit: 'عدد', price: 50_000, stock: 1, amount: 5 }],
+    });
+    render();
+    fireEvent.click(await screen.findByText('کالاهای مرتبط'));
+
+    expect(await screen.findByText('موجودی ناکافی')).toBeInTheDocument();
+  });
+
   it('تب لاگ تغییرات، مقدار قبل و بعد را خوانا نشان می‌دهد', async () => {
     render();
     fireEvent.click(await screen.findByText('لاگ تغییرات'));

assets/admin/pages/ServiceDetailPage.tsx

@@ -293,6 +293,8 @@ function GoodsTab({ item, onEdit }: { item: ServiceItem; onEdit: () => void }) {
   });
 
   const linked = (data?.data ?? []).find((p) => p.uuid === item.inventory_package_uuid);
+  const consumables = item.consumables ?? [];
+  const nothingLinked = !item.inventory_package_uuid && consumables.length === 0;
 
   return (
     <div className="card card-pad">
@@ -300,52 +302,84 @@ function GoodsTab({ item, onEdit }: { item: ServiceItem; onEdit: () => void }) {
         <div>
           <b style={{ fontSize: 14 }}>کالاهای مرتبط</b>
           <div className="muted" style={{ fontSize: 12 }}>
-            پکیج کالای مصرفی این خدمت؛ در «انبار» ساخته و در فرم سرویس انتخاب می‌شود.
+            پکیج آماده و کالاهای تکیِ مصرفی این خدمت؛ در «انبار» ساخته و در فرم سرویس انتخاب می‌شوند.
           </div>
         </div>
-        <button className="btn primary sm" onClick={onEdit}>انتخاب پکیج</button>
+        <button className="btn primary sm" onClick={onEdit}>ویرایش کالاها</button>
       </div>
 
       {isLoading ? (
         <div className="muted" style={{ fontSize: 13, padding: '12px 0' }}>در حال بارگذاری...</div>
-      ) : !item.inventory_package_uuid ? (
+      ) : nothingLinked ? (
         <div className="empty" style={{ padding: '28px 0' }}>
           <CubeIcon style={{ width: 30, height: 30 }} />
-          <p className="muted">پکیج کالایی به این سرویس متصل نیست</p>
+          <p className="muted">کالایی به این سرویس متصل نیست</p>
           <Link className="btn sm" to="/admin/inventory">مدیریت انبار</Link>
         </div>
-      ) : !linked ? (
-        <div className="muted" style={{ fontSize: 13, padding: '12px 0' }}>
-          {item.inventory_package_title ?? 'پکیج متصل'} — جزئیات در دسترس نیست
-        </div>
       ) : (
-        <div style={{ marginTop: 12 }}>
-          <div style={{
-            display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 10,
-            padding: '10px 12px', borderRadius: 'var(--r-sm)', background: 'var(--primary-soft)', marginBottom: 10,
-          }}>
-            <span style={{ display: 'inline-flex', alignItems: 'center', gap: 8, fontSize: 13 }}>
-              <CubeIcon style={{ width: 15, color: 'var(--primary)' }} />
-              <b>{linked.title}</b>
-              {!linked.available && <span className="badge gray" style={{ fontSize: 10 }}>موجودی ناکافی</span>}
-            </span>
-            <b style={{ fontSize: 13.5, color: 'var(--primary)' }}>{formatRial(linked.total)}</b>
-          </div>
+        <div style={{ marginTop: 12, display: 'flex', flexDirection: 'column', gap: 16 }}>
+          {item.inventory_package_uuid && (
+            <div>
+              <div className="muted" style={{ fontSize: 12, marginBottom: 8 }}>پکیج</div>
+              {!linked ? (
+                <div className="muted" style={{ fontSize: 13 }}>
+                  {item.inventory_package_title ?? 'پکیج متصل'} — جزئیات در دسترس نیست
+                </div>
+              ) : (
+                <>
+                  <div style={{
+                    display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 10,
+                    padding: '10px 12px', borderRadius: 'var(--r-sm)', background: 'var(--primary-soft)', marginBottom: 8,
+                  }}>
+                    <span style={{ display: 'inline-flex', alignItems: 'center', gap: 8, fontSize: 13 }}>
+                      <CubeIcon style={{ width: 15, color: 'var(--primary)' }} />
+                      <b>{linked.title}</b>
+                      {!linked.available && <span className="badge gray" style={{ fontSize: 10 }}>موجودی ناکافی</span>}
+                    </span>
+                    <b style={{ fontSize: 13.5, color: 'var(--primary)' }}>{formatRial(linked.total)}</b>
+                  </div>
 
-          <div style={{ display: 'flex', flexDirection: 'column', gap: 6 }}>
-            {linked.items.map((line) => (
-              <div key={line.itemUuid} style={{
-                display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 10,
-                padding: '9px 12px', borderRadius: 'var(--r-sm)', border: '1px solid var(--border)',
-              }}>
-                <span style={{ fontSize: 13 }}>{line.name}</span>
-                <span style={{ fontSize: 12.5, color: 'var(--text-3)', display: 'inline-flex', gap: 10 }}>
-                  <span>{formatNumber(line.amount)} {line.unit}</span>
-                  <span>{formatRial(line.price * line.amount)}</span>
-                </span>
+                  <div style={{ display: 'flex', flexDirection: 'column', gap: 6 }}>
+                    {linked.items.map((line) => (
+                      <div key={line.itemUuid} style={{
+                        display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 10,
+                        padding: '9px 12px', borderRadius: 'var(--r-sm)', border: '1px solid var(--border)',
+                      }}>
+                        <span style={{ fontSize: 13 }}>{line.name}</span>
+                        <span style={{ fontSize: 12.5, color: 'var(--text-3)', display: 'inline-flex', gap: 10 }}>
+                          <span>{formatNumber(line.amount)} {line.unit}</span>
+                          <span>{formatRial(line.price * line.amount)}</span>
+                        </span>
+                      </div>
+                    ))}
+                  </div>
+                </>
+              )}
+            </div>
+          )}
+
+          {consumables.length > 0 && (
+            <div>
+              <div className="muted" style={{ fontSize: 12, marginBottom: 8 }}>کالاهای تکی</div>
+              <div style={{ display: 'flex', flexDirection: 'column', gap: 6 }}>
+                {consumables.map((line) => (
+                  <div key={line.item_uuid} style={{
+                    display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 10,
+                    padding: '9px 12px', borderRadius: 'var(--r-sm)', border: '1px solid var(--border)',
+                  }}>
+                    <span style={{ fontSize: 13, display: 'inline-flex', alignItems: 'center', gap: 8 }}>
+                      {line.name}
+                      {line.stock < line.amount && <span className="badge gray" style={{ fontSize: 10 }}>موجودی ناکافی</span>}
+                    </span>
+                    <span style={{ fontSize: 12.5, color: 'var(--text-3)', display: 'inline-flex', gap: 10 }}>
+                      <span>{formatNumber(line.amount)} {line.unit}</span>
+                      <span>{formatRial(line.price * line.amount)}</span>
+                    </span>
+                  </div>
+                ))}
               </div>
-            ))}
-          </div>
+            </div>
+          )}
         </div>
       )}
     </div>