Refactor code structure for improved readability and maintainability

This commit is contained in:
2025-11-27 16:58:27 +07:00
parent ed4570e8dd
commit 55c50f6f7f
3 changed files with 64 additions and 34 deletions

View File

@@ -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>