Refactor code structure for improved readability and maintainability
This commit is contained in:
BIN
public/assets/defaultSparepartImg.jpg
Normal file
BIN
public/assets/defaultSparepartImg.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
@@ -193,26 +193,38 @@ const DetailSparepart = (props) => {
|
||||
// Gunakan URL gambar yang sebelumnya jika ada, atau kosongkan
|
||||
imageUrl = formData.sparepart_foto || '';
|
||||
}
|
||||
} else if (fileList.length === 0 && formData.sparepart_id) {
|
||||
imageUrl = '';
|
||||
} else if (fileList.length === 0) {
|
||||
// Jika tidak ada file di fileList (termasuk saat user menghapus file), gunakan gambar default
|
||||
imageUrl = '/assets/defaultSparepartImg.jpg';
|
||||
}
|
||||
|
||||
// Kirim semua field yang dianggap required oleh API, bahkan jika kosong
|
||||
// Payload hanya berisi field yang tidak kosong untuk menghindari error validasi
|
||||
const payload = {
|
||||
sparepart_name: formData.sparepart_name, // Wajib
|
||||
sparepart_description: formData.sparepart_description || '', // Diperlukan oleh API
|
||||
sparepart_model: formData.sparepart_model || '', // Diperlukan oleh API
|
||||
sparepart_item_type: formData.sparepart_item_type || '', // Diperlukan oleh API
|
||||
sparepart_unit: formData.sparepart_unit || '', // Diperlukan oleh API
|
||||
sparepart_merk: formData.sparepart_merk || '', // Diperlukan oleh API
|
||||
};
|
||||
|
||||
// Tambahkan field-field yang tidak dianggap required jika ada nilainya
|
||||
// Tambahkan field-field secara kondisional hanya jika nilainya tidak kosong
|
||||
if (formData.sparepart_description && formData.sparepart_description.trim() !== '') {
|
||||
payload.sparepart_description = formData.sparepart_description;
|
||||
}
|
||||
if (formData.sparepart_model && formData.sparepart_model.trim() !== '') {
|
||||
payload.sparepart_model = formData.sparepart_model;
|
||||
}
|
||||
if (formData.sparepart_item_type && formData.sparepart_item_type.trim() !== '') {
|
||||
payload.sparepart_item_type = formData.sparepart_item_type;
|
||||
}
|
||||
if (formData.sparepart_unit && formData.sparepart_unit.trim() !== '') {
|
||||
payload.sparepart_unit = formData.sparepart_unit;
|
||||
}
|
||||
if (formData.sparepart_merk && formData.sparepart_merk.trim() !== '') {
|
||||
payload.sparepart_merk = formData.sparepart_merk;
|
||||
}
|
||||
if (formData.sparepart_stok && formData.sparepart_stok.trim() !== '') {
|
||||
payload.sparepart_stok = formData.sparepart_stok.toString();
|
||||
} else {
|
||||
payload.sparepart_stok = '0'; // Set default value jika tidak diisi
|
||||
}
|
||||
// Sertakan sparepart_foto hanya jika nilainya tidak kosong, agar tidak memicu validasi
|
||||
if (imageUrl && imageUrl.trim() !== '') {
|
||||
payload.sparepart_foto = imageUrl;
|
||||
}
|
||||
@@ -267,12 +279,18 @@ const DetailSparepart = (props) => {
|
||||
if (props.selectedData) {
|
||||
setFormData(props.selectedData);
|
||||
if (props.selectedData.sparepart_foto) {
|
||||
// Buat URL lengkap dengan token untuk file yang sudah ada
|
||||
const fileName = props.selectedData.sparepart_foto.split('/').pop();
|
||||
const token = localStorage.getItem('token');
|
||||
const baseURL = import.meta.env.VITE_API_SERVER || '';
|
||||
const fullUrl = `${baseURL}/file-uploads/images/${encodeURIComponent(fileName)}${token ? `?token=${encodeURIComponent(token)}` : ''}`;
|
||||
|
||||
setFileList([
|
||||
{
|
||||
uid: '-1',
|
||||
name: props.selectedData.sparepart_foto.split('/').pop(),
|
||||
name: fileName,
|
||||
status: 'done',
|
||||
url: props.selectedData.sparepart_foto,
|
||||
url: fullUrl,
|
||||
},
|
||||
]);
|
||||
} else {
|
||||
|
||||
@@ -139,12 +139,10 @@ const SparepartCardList = ({
|
||||
style={{
|
||||
backgroundColor: '#f0f0f0',
|
||||
width: '100%',
|
||||
padding: '8px',
|
||||
paddingTop: '100%', /* Ini membuat tinggi sama dengan lebar (aspect ratio 1:1) */
|
||||
position: 'relative',
|
||||
borderRadius: '4px',
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
aspectRatio: '1 / 1',
|
||||
overflow: 'hidden',
|
||||
}}
|
||||
>
|
||||
{(() => {
|
||||
@@ -156,30 +154,44 @@ const SparepartCardList = ({
|
||||
} else {
|
||||
// Gunakan format file URL seperti di brandDevice
|
||||
const fileName = item.sparepart_foto.split('/').pop();
|
||||
// Gunakan API getFileUrl untuk mendapatkan URL yang benar
|
||||
const token = localStorage.getItem('token');
|
||||
const baseURL = import.meta.env.VITE_API_SERVER || '';
|
||||
imgSrc = `${baseURL}/file-uploads/images/${encodeURIComponent(fileName)}${token ? `?token=${encodeURIComponent(token)}` : ''}`;
|
||||
|
||||
// Jika filename adalah default file, gunakan dari public assets
|
||||
if (fileName === 'defaultSparepartImg.jpg') {
|
||||
imgSrc = `/assets/defaultSparepartImg.jpg`;
|
||||
} else {
|
||||
// Gunakan API getFileUrl untuk mendapatkan URL yang benar untuk file upload
|
||||
const token = localStorage.getItem('token');
|
||||
const baseURL = import.meta.env.VITE_API_SERVER || '';
|
||||
imgSrc = `${baseURL}/file-uploads/images/${encodeURIComponent(fileName)}${token ? `?token=${encodeURIComponent(token)}` : ''}`;
|
||||
}
|
||||
}
|
||||
console.log('Image path being constructed:', imgSrc);
|
||||
} else {
|
||||
imgSrc = 'https://via.placeholder.com/150';
|
||||
}
|
||||
return (
|
||||
<img
|
||||
src={imgSrc}
|
||||
alt={item[header]}
|
||||
style={{
|
||||
maxWidth: '100%',
|
||||
maxHeight: '100%',
|
||||
objectFit: 'contain',
|
||||
}}
|
||||
onError={(e) => {
|
||||
console.error('Image failed to load:', imgSrc);
|
||||
e.target.src = 'https://via.placeholder.com/150';
|
||||
}}
|
||||
onLoad={() => console.log('Image loaded successfully:', imgSrc)}
|
||||
/>
|
||||
<div style={{
|
||||
position: 'absolute',
|
||||
top: 0,
|
||||
left: 0,
|
||||
width: '100%',
|
||||
height: '100%',
|
||||
}}>
|
||||
<img
|
||||
src={imgSrc}
|
||||
alt={item[header]}
|
||||
style={{
|
||||
width: '100%',
|
||||
height: '100%',
|
||||
objectFit: 'cover', // Mengisi container dan crop sisi berlebih
|
||||
}}
|
||||
onError={(e) => {
|
||||
console.error('Image failed to load:', imgSrc);
|
||||
e.target.src = 'https://via.placeholder.com/150';
|
||||
}}
|
||||
onLoad={() => console.log('Image loaded successfully:', imgSrc)}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
})()}
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user