[Fix] Buat dan edit produk

This commit is contained in:
Baghaztra 2025-09-12 14:04:08 +07:00
parent 380ede5ca8
commit 75648b52d9
5 changed files with 237 additions and 172 deletions

View File

@ -10,8 +10,12 @@ class FotoSementaraController extends Controller
{ {
public function upload(Request $request) public function upload(Request $request)
{ {
$user = $request->user();
if (!$user) {
return response()->json(['message' => 'Unauthorized'], 401);
}
$request->validate([ $request->validate([
'id_user' => 'required|exists:users,id',
'foto' => 'required|image|mimes:jpg,jpeg,png|max:2048', 'foto' => 'required|image|mimes:jpg,jpeg,png|max:2048',
]); ]);
@ -19,15 +23,20 @@ class FotoSementaraController extends Controller
$url = asset('storage/' . $path); $url = asset('storage/' . $path);
$foto = FotoSementara::create([ $foto = FotoSementara::create([
'id_user' => $request->id_user, 'id_user' => $user->id,
'url' => $url, 'url' => $url,
]); ]);
return response()->json($foto, 201); return response()->json($foto, 201);
} }
public function hapus($id) public function hapus(Request $request, int $id)
{ {
$user = $request->user();
if (!$user) {
return response()->json(['message' => 'Unauthorized'], 401);
}
$foto = FotoSementara::findOrFail($id); $foto = FotoSementara::findOrFail($id);
// Extract the relative path from the URL // Extract the relative path from the URL
@ -42,18 +51,25 @@ class FotoSementaraController extends Controller
return response()->json(['message' => 'Foto berhasil dihapus']); return response()->json(['message' => 'Foto berhasil dihapus']);
} }
public function getAll($user_id) public function getAll(Request $request)
{ {
$data = FotoSementara::where('id_user', $user_id); $user = $request->user();
if (!$data->exists()) { if (!$user) {
return response()->json(['message' => 'Tidak ada foto ditemukan'], 404); return response()->json(['message' => 'Unauthorized'], 401);
} }
$data = FotoSementara::where('id_user', $user->id)->get();
return response()->json($data); return response()->json($data);
} }
public function reset($user_id) public function reset(Request $request)
{ {
FotoSementara::where('id_user', $user_id)->delete(); $user = $request->user();
if (!$user) {
return response()->json(['message' => 'Unauthorized'], 401);
}
FotoSementara::where('id_user', $user->id)->delete();
return response()->json(['message' => 'Foto sementara berhasil direset']); return response()->json(['message' => 'Foto sementara berhasil direset']);
} }
} }

View File

@ -26,39 +26,35 @@ class ProdukController extends Controller
*/ */
public function store(Request $request) public function store(Request $request)
{ {
$validated = $request->validate([ $user = $request->user();
if (!$user) {
return response()->json(['message' => 'Unauthorized'], 401);
}
$validated = $request->validate(
[
'nama' => 'required|string|max:100', 'nama' => 'required|string|max:100',
'id_kategori' => 'required|exists:kategoris,id', 'id_kategori' => 'required|exists:kategoris,id',
'berat' => 'required|numeric', 'berat' => 'required|numeric',
'kadar' => 'required|integer', 'kadar' => 'required|integer',
'harga_per_gram' => 'required|numeric', 'harga_per_gram' => 'required|numeric',
'harga_jual' => 'required|numeric', 'harga_jual' => 'required|numeric',
'id_user' => 'nullable|exists:users,id',
], ],
[ [
'nama.required' => 'Nama produk harus diisi.', 'nama.required' => 'Nama produk harus diisi.',
'id_kategori' => 'Kategori tidak valid.', 'id_kategori' => 'Kategori tidak valid.',
'berat.required' => 'Berat harus diisi.', 'berat.required' => 'Berat harus diisi.',
'kadar.required' => 'Kadar harus diisi', 'kadar.required' => 'Kadar harus diisi.',
'harga_per_gram.required' => 'Harga per gram harus diisi', 'harga_per_gram.required' => 'Harga per gram harus diisi.',
'harga_jual.required' => 'Harga jual harus diisi' 'harga_jual.required' => 'Harga jual harus diisi.'
]); ]
);
DB::beginTransaction(); DB::beginTransaction();
try { try {
// Create produk $produk = Produk::create($validated);
$produk = Produk::create([
'nama' => $validated['nama'],
'id_kategori' => $validated['id_kategori'],
'berat' => $validated['berat'],
'kadar' => $validated['kadar'],
'harga_per_gram' => $validated['harga_per_gram'],
'harga_jual' => $validated['harga_jual'],
]);
// Pindahkan foto sementara ke foto permanen jika ada $fotoSementara = FotoSementara::where('id_user', $user->id)->get();
if (isset($validated['id_user'])) {
$fotoSementara = FotoSementara::where('id_user', $validated['id_user'])->get();
foreach ($fotoSementara as $fs) { foreach ($fotoSementara as $fs) {
Foto::create([ Foto::create([
@ -66,10 +62,8 @@ class ProdukController extends Controller
'url' => $fs->url 'url' => $fs->url
]); ]);
// Hapus foto sementara setelah dipindah
$fs->delete(); $fs->delete();
} }
}
DB::commit(); DB::commit();
@ -77,7 +71,6 @@ class ProdukController extends Controller
'message' => 'Produk berhasil dibuat', 'message' => 'Produk berhasil dibuat',
'data' => $produk->load('foto') 'data' => $produk->load('foto')
], 201); ], 201);
} catch (\Exception $e) { } catch (\Exception $e) {
DB::rollback(); DB::rollback();
return response()->json([ return response()->json([
@ -96,20 +89,45 @@ class ProdukController extends Controller
return response()->json($produk); return response()->json($produk);
} }
/**
* Get the specified resource to edit.
*/
public function edit(Request $request, int $id)
{
$user = $request->user();
if (!$user) {
return response()->json(['message' => 'Unauthorized'], 401);
}
$produk = Produk::with('foto', 'kategori')->findOrFail($id);
$foto_sementara = [];
foreach ($produk->foto as $foto) {
$foto_sementara[] = FotoSementara::create([
'id_user' => $user->id,
'url' => $foto->url
]);
}
return response()->json($produk);
}
/** /**
* Update the specified resource in storage. * Update the specified resource in storage.
*/ */
public function update(Request $request, int $id) public function update(Request $request, int $id)
{ {
$validated = $request->validate([ $user = $request->user();
if (!$user) {
return response()->json(['message' => 'Unauthorized'], 401);
}
$validated = $request->validate(
[
'nama' => 'required|string|max:100', 'nama' => 'required|string|max:100',
'id_kategori' => 'required|exists:kategoris,id', 'id_kategori' => 'required|exists:kategoris,id',
'berat' => 'required|numeric', 'berat' => 'required|numeric',
'kadar' => 'required|integer', 'kadar' => 'required|integer',
'harga_per_gram' => 'required|numeric', 'harga_per_gram' => 'required|numeric',
'harga_jual' => 'required|numeric', 'harga_jual' => 'required|numeric',
'id_user' => 'nullable|exists:users,id', // untuk mengambil foto sementara baru
'hapus_foto_lama' => 'nullable|boolean', // flag untuk menghapus foto lama
], ],
[ [
'nama.required' => 'Nama produk harus diisi.', 'nama.required' => 'Nama produk harus diisi.',
@ -117,8 +135,9 @@ class ProdukController extends Controller
'berat.required' => 'Berat harus diisi.', 'berat.required' => 'Berat harus diisi.',
'kadar.required' => 'Kadar harus diisi', 'kadar.required' => 'Kadar harus diisi',
'harga_per_gram.required' => 'Harga per gram harus diisi', 'harga_per_gram.required' => 'Harga per gram harus diisi',
'harga_jual.required' => 'Harga jual harus diisi' 'harga_jual.required' => 'Harga jual harus diisi',
]); ]
);
DB::beginTransaction(); DB::beginTransaction();
try { try {
@ -134,21 +153,21 @@ class ProdukController extends Controller
'harga_jual' => $validated['harga_jual'], 'harga_jual' => $validated['harga_jual'],
]); ]);
// Hapus foto lama jika diminta // Hapus foto lama
if (isset($validated['hapus_foto_lama']) && $validated['hapus_foto_lama']) {
foreach ($produk->foto as $foto) { foreach ($produk->foto as $foto) {
// Hapus file fisik // Hapus file fisik jika memungkinkan
try {
$relativePath = str_replace(asset('storage') . '/', '', $foto->url); $relativePath = str_replace(asset('storage') . '/', '', $foto->url);
if (Storage::disk('public')->exists($relativePath)) { if (Storage::disk('public')->exists($relativePath)) {
Storage::disk('public')->delete($relativePath); Storage::disk('public')->delete($relativePath);
} }
} catch (\Exception $e) {
// Maklum Pak, soalnya kadang url aja, ga ada file fisiknya #Bagas
}
$foto->delete(); $foto->delete();
} }
}
// Tambahkan foto baru dari foto sementara jika ada $fotoSementara = FotoSementara::where('id_user', $user->id)->get();
if (isset($validated['id_user'])) {
$fotoSementara = FotoSementara::where('id_user', $validated['id_user'])->get();
foreach ($fotoSementara as $fs) { foreach ($fotoSementara as $fs) {
Foto::create([ Foto::create([
@ -156,10 +175,8 @@ class ProdukController extends Controller
'url' => $fs->url 'url' => $fs->url
]); ]);
// Hapus foto sementara setelah dipindah
$fs->delete(); $fs->delete();
} }
}
DB::commit(); DB::commit();
@ -167,7 +184,6 @@ class ProdukController extends Controller
'message' => 'Produk berhasil diubah', 'message' => 'Produk berhasil diubah',
'data' => $produk->load('foto') 'data' => $produk->load('foto')
], 200); ], 200);
} catch (\Exception $e) { } catch (\Exception $e) {
DB::rollback(); DB::rollback();
return response()->json([ return response()->json([
@ -203,7 +219,6 @@ class ProdukController extends Controller
return response()->json([ return response()->json([
'message' => 'Produk berhasil dihapus.' 'message' => 'Produk berhasil dihapus.'
], 200); ], 200);
} catch (\Exception $e) { } catch (\Exception $e) {
DB::rollback(); DB::rollback();
return response()->json([ return response()->json([

View File

@ -225,6 +225,7 @@ import mainLayout from "../layouts/mainLayout.vue";
import InputField from "../components/InputField.vue"; import InputField from "../components/InputField.vue";
import InputSelect from "../components/InputSelect.vue"; import InputSelect from "../components/InputSelect.vue";
import CreateItemModal from "../components/CreateItemModal.vue"; import CreateItemModal from "../components/CreateItemModal.vue";
import { errorMessages } from "@vue/compiler-core";
const route = useRoute(); const route = useRoute();
const router = useRouter(); const router = useRouter();
@ -250,7 +251,6 @@ const fileInput = ref(null);
const openItemModal = ref(false); const openItemModal = ref(false);
const editedProduct = ref(null); const editedProduct = ref(null);
const userId = ref(1); // TODO: ambil dari auth
const isFormValid = computed(() => { const isFormValid = computed(() => {
return ( return (
@ -281,12 +281,14 @@ const loadKategori = async () => {
}; };
const loadProduk = async () => { const loadProduk = async () => {
const response = await axios.get(`/api/produk/${productId}`, { const response = await axios.get(`/api/produk/edit/${productId}`, {
headers: { headers: {
Authorization: `Bearer ${localStorage.getItem("token")}`, Authorization: `Bearer ${localStorage.getItem("token")}`,
}, },
}); });
const produk = response.data; const produk = response.data;
console.log(produk);
form.value = { form.value = {
nama: produk.nama, nama: produk.nama,
id_kategori: produk.id_kategori, id_kategori: produk.id_kategori,
@ -295,7 +297,22 @@ const loadProduk = async () => {
harga_per_gram: produk.harga_per_gram, harga_per_gram: produk.harga_per_gram,
harga_jual: produk.harga_jual, harga_jual: produk.harga_jual,
}; };
uploadedImages.value = produk.foto || []; };
const loadFoto = async () => {
try {
const response = await axios.get(`/api/foto`, {
headers: {
Authorization: `Bearer ${localStorage.getItem("token")}`,
},
});
uploadedImages.value = response.data;
console.log(uploadedImages.value);
} catch (e) {
console.error(e);
uploadError.value = "Gagal memuat foto";
}
}; };
const triggerFileInput = () => { const triggerFileInput = () => {
@ -318,27 +335,57 @@ const handleDrop = (e) => {
}; };
const uploadFiles = async (files) => { const uploadFiles = async (files) => {
uploadError.value = ""; uploadError.value = '';
const validFiles = files.filter(
(file) => if (uploadedImages.value.length + files.length > 6) {
["image/jpeg", "image/jpg", "image/png"].includes(file.type) && uploadError.value = 'Maksimal 6 foto yang dapat diupload';
file.size <= 2 * 1024 * 1024 return;
); }
if (!validFiles.length) return;
const validFiles = files.filter(file => {
const isValidType = ['image/jpeg', 'image/jpg', 'image/png'].includes(file.type);
const isValidSize = file.size <= 2 * 1024 * 1024;
if (!isValidType) {
uploadError.value = 'Format file harus JPG, JPEG, atau PNG';
return false;
}
if (!isValidSize) {
uploadError.value = 'Ukuran file maksimal 2MB';
return false;
}
return true;
});
if (validFiles.length === 0) return;
uploadLoading.value = true; uploadLoading.value = true;
try { try {
for (const file of validFiles) { for (const file of validFiles) {
const formData = new FormData(); const formData = new FormData();
formData.append("foto", file); formData.append('foto', file);
formData.append("id_user", userId.value);
const res = await axios.post("/api/foto/upload", formData, { const response = await axios.post('/api/foto', formData, {
headers: { headers: {
Authorization: `Bearer ${localStorage.getItem("token")}`, Authorization: `Bearer ${localStorage.getItem("token")}`,
"Content-Type": "multipart/form-data", 'Content-Type': 'multipart/form-data',
}, },
}); });
uploadedImages.value.push(res.data);
uploadedImages.value.push(response.data);
} }
if (fileInput.value) {
fileInput.value.value = '';
}
} catch (error) {
console.error('Upload error:', error);
uploadError.value = error.response?.data?.message || 'Gagal mengupload foto';
} finally { } finally {
uploadLoading.value = false; uploadLoading.value = false;
} }
@ -346,7 +393,7 @@ const uploadFiles = async (files) => {
const removeImage = async (id) => { const removeImage = async (id) => {
try { try {
await axios.delete(`http://127.0.0.1:8000/api/foto/hapus/${id}`, { await axios.delete(`/api/foto/${id}`, {
headers: { headers: {
Authorization: `Bearer ${localStorage.getItem("token")}`, Authorization: `Bearer ${localStorage.getItem("token")}`,
}, },
@ -361,21 +408,16 @@ const submitForm = async () => {
loading.value = true; loading.value = true;
try { try {
await axios.put( await axios.put(
`/api/produk/${productId}`, `/api/produk/${productId}`,form.value,
{
...form.value,
id_user: userId.value,
},
{ {
headers: { headers: {
Authorization: `Bearer ${localStorage.getItem("token")}`, Authorization: `Bearer ${localStorage.getItem("token")}`,
}, },
} }
); );
alert("Produk berhasil diupdate!");
router.push("/produk"); router.push("/produk");
} catch (err) { } catch (err) {
alert("Gagal update produk!"); errorMessages.value = err.response?.data?.message || "Gagal menyimpan produk";
console.error(err); console.error(err);
} finally { } finally {
loading.value = false; loading.value = false;
@ -390,8 +432,10 @@ const back = () => {
router.push("/produk"); router.push("/produk");
}; };
onMounted(() => { onMounted(async () => {
loadKategori(); await loadKategori();
loadProduk(); await loadProduk();
loadFoto();
}); });
</script> </script>

View File

@ -1,11 +1,7 @@
<template> <template>
<mainLayout> <mainLayout>
<!-- Modal Buat Item - Sekarang menggunakan komponen terpisah --> <!-- Modal Buat Item - Sekarang menggunakan komponen terpisah -->
<CreateItemModal <CreateItemModal :isOpen="openItemModal" :product="createdProduct" @close="closeItemModal" />
:isOpen="openItemModal"
:product="createdProduct"
@close="closeItemModal"
/>
<div class="p-6"> <div class="p-6">
<p class="font-serif italic text-[25px] text-D">Produk Baru</p> <p class="font-serif italic text-[25px] text-D">Produk Baru</p>
@ -168,8 +164,6 @@ const uploadedImages = ref([]);
const isDragging = ref(false); const isDragging = ref(false);
const uploadError = ref(''); const uploadError = ref('');
const fileInput = ref(null); const fileInput = ref(null);
// TODO: Logika autentikasi user
const userId = ref(1);
const openItemModal = ref(false); const openItemModal = ref(false);
const createdProduct = ref(null); const createdProduct = ref(null);
@ -192,22 +186,24 @@ const calculateHargaJual = () => {
} }
}; };
const loadExistingPhotos = async () => { const loadFoto = async () => {
loading.value = true;
try { try {
const response = await axios.get(`/api/foto/${userId.value}`, { const response = await axios.get(`/api/foto`, {
headers: { headers: {
Authorization: `Bearer ${localStorage.getItem("token")}`, Authorization: `Bearer ${localStorage.getItem("token")}`,
}, },
}); });
if (response.data && Array.isArray(response.data)) {
uploadedImages.value = response.data; uploadedImages.value = response.data;
console.log(uploadedImages.value);
} catch (e) {
console.error(e);
uploadError.value = "Gagal memuat foto";
} }
} catch (error) { loading.value = false;
if (error.response?.status !== 404) {
console.error('Error loading existing photos:', error);
} }
}
};
const openCreateItemModal = (product) => { const openCreateItemModal = (product) => {
createdProduct.value = product; createdProduct.value = product;
@ -275,9 +271,8 @@ const uploadFiles = async (files) => {
for (const file of validFiles) { for (const file of validFiles) {
const formData = new FormData(); const formData = new FormData();
formData.append('foto', file); formData.append('foto', file);
formData.append('id_user', userId.value);
const response = await axios.post('/api/foto/upload', formData, { const response = await axios.post('/api/foto', formData, {
headers: { headers: {
Authorization: `Bearer ${localStorage.getItem("token")}`, Authorization: `Bearer ${localStorage.getItem("token")}`,
'Content-Type': 'multipart/form-data', 'Content-Type': 'multipart/form-data',
@ -300,19 +295,16 @@ const uploadFiles = async (files) => {
} }
}; };
const removeImage = async (imageId) => { const removeImage = async (id) => {
try { try {
await axios.delete(`/api/foto/hapus/${imageId}`, { await axios.delete(`/api/foto/${id}`, {
headers: { headers: {
Authorization: `Bearer ${localStorage.getItem("token")}`, Authorization: `Bearer ${localStorage.getItem("token")}`,
}, },
}) });
; uploadedImages.value = uploadedImages.value.filter((i) => i.id !== id);
uploadedImages.value = uploadedImages.value.filter(img => img.id !== imageId); } catch {
uploadError.value = ''; uploadError.value = "Gagal menghapus foto";
} catch (error) {
console.error('Delete error:', error);
uploadError.value = 'Gagal menghapus foto';
} }
}; };
@ -325,10 +317,7 @@ const submitForm = async (addItem) => {
loading.value = true; loading.value = true;
try { try {
const response = await axios.post('/api/produk', { const response = await axios.post('/api/produk', form.value,
...form.value,
id_user: userId.value,
},
{ {
headers: { headers: {
Authorization: `Bearer ${localStorage.getItem("token")}`, Authorization: `Bearer ${localStorage.getItem("token")}`,
@ -405,7 +394,7 @@ const back = () => {
}; };
onMounted(() => { onMounted(() => {
loadExistingPhotos(); loadFoto();
loadKategori(); loadKategori();
}); });
</script> </script>

View File

@ -32,10 +32,11 @@ Route::prefix('api')->group(function () {
Route::delete('kosongkan-nampan', [NampanController::class, 'kosongkan']); Route::delete('kosongkan-nampan', [NampanController::class, 'kosongkan']);
// Foto Sementara // Foto Sementara
Route::post('foto/upload', [FotoSementaraController::class, 'upload']); Route::get('foto', [FotoSementaraController::class, 'getAll']);
Route::delete('foto/hapus/{id}', [FotoSementaraController::class, 'hapus']); Route::post('foto', [FotoSementaraController::class, 'upload']);
Route::get('foto/{user_id}', [FotoSementaraController::class, 'getAll']); Route::delete('foto/{id}', [FotoSementaraController::class, 'hapus']);
Route::delete('foto/reset/{user_id}', [FotoSementaraController::class, 'reset']); Route::get('produk/edit/{id}', [ProdukController::class, 'edit']);
Route::delete('foto/all', [FotoSementaraController::class, 'reset']);
// Laporan // Laporan
Route::prefix('laporan')->group(function () { Route::prefix('laporan')->group(function () {