dstpabuaran.com/docs/2026-08-15-raw-material-photo-fix.md

2.4 KiB

Fix: Foto Bahan Baku Tidak Muncul di Cutting & Belanja

Tujuan

Memperbaiki foto bahan baku (raw material) yang tidak muncul di halaman create/edit Cutting dan Belanja (Purchasing). Menampilkan foto conversion (thumbnail) bukan original.

File yang Dibaca

  • app/Services/Admin/Master/RawMaterial/RawMaterialVariantService.phpgetForCutting() method (root cause backend)
  • resources/js/pages/admin/manage/cutting/columns.tsxCuttingCreateData type (root cause frontend)
  • resources/js/pages/admin/manage/purchase/columns.tsxPurchaseCreateData type (root cause frontend)
  • resources/js/pages/admin/master/raw-material/columns.tsx → reference type pattern

Root Cause

Backend

getForCutting() tidak load media atau set photo_url/photo_conversion_url pada RawMaterialPrice.

Frontend

Type CuttingCreateData dan PurchaseCreateData tidak include photo_conversion_url di raw_material_prices → TypeScript strip property → frontend tidak bisa akses.

Perubahan

1. Backend — RawMaterialVariantService::getForCutting()

  • Tambah eager load rawMaterialPrices.media
  • Iterasi setiap RawMaterialPrice untuk set photo_url + photo_conversion_url

2. Frontend Types — columns.tsx

  • CuttingCreateData.raw_material_prices → tambah photo_conversion_url: string | null
  • PurchaseCreateData.raw_material_prices → tambah photo_conversion_url: string | null

3. Frontend Components — 4 files

  • Tambah photo_conversion_url ke MaterialState type (cutting create/edit)
  • Map photo_conversion_url dari backend data
  • <img src={price.photo_url}<img src={price.photo_conversion_url ?? price.photo_url}
  • photoUrl: price.photo_urlphotoUrl: price.photo_conversion_url ?? price.photo_url (purchase cart items)

Files Changed

File Change
RawMaterialVariantService.php Load media + set photo_url/photo_conversion_url
cutting/columns.tsx Add photo_conversion_url to type
purchase/columns.tsx Add photo_conversion_url to type
cutting/create.tsx Type + mapping + img tags
cutting/edit.tsx Type + mapping + img tags
purchase/create.tsx Cart photoUrl + img tag
purchase/edit.tsx Cart photoUrl + img tag

Dampak

  • Create/Edit Cutting → foto bahan baku muncul (conversion/thumbnail)
  • Create/Edit Belanja → foto bahan baku muncul (conversion/thumbnail)