rodolfo_ruiz/fendi-react-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chore: improve the ui for Products

Browse Source
This commit is contained in:
Rodolfo Ruiz
2025-09-06 19:53:10 -06:00
parent 74d6a8b269
commit 01a19b9144
1 changed files with 85 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files

143
src/private/catalogs/products/AddOrEditProductCollectionForm.jsx
View File

@@ -199,12 +199,13 @@ export default function AddOrEditProductCollectionForm({ initialData, onAdd, onC
<Box> <Box>
<Box display="flex" flexDirection="column" gap={2}> <Box display="flex" flexDirection="column" gap={2}>
{/* Name */} {/* Name */}
<TextField label="Name" fullWidth value={form.name} onChange={(e) => setVal('name', e.target.value)} /> <TextField
{/* Status */} label="Name"
<TextField select label="Status" fullWidth value={form.status} onChange={(e) => setVal('status', e.target.value)}> fullWidth
<MenuItem value="Active">Active</MenuItem> value={form.name}
<MenuItem value="Inactive">Inactive</MenuItem> onChange={(e) => setVal('name', e.target.value)}
</TextField> sx={{ mt: 1 }}
/>
{/* Category / Provider */} {/* Category / Provider */}
<TextField <TextField
@@ -233,57 +234,81 @@ export default function AddOrEditProductCollectionForm({ initialData, onAdd, onC
))} ))}
</TextField> </TextField>
{/* Color / Line / Currency */} <Box display="flex" gap={2}>
<TextField {/* Color */}
select <Box flex={1}>
label="Color" <TextField
fullWidth select
value={form.color} label="Color"
onChange={(e) => setVal('color', e.target.value)} fullWidth
> value={form.color}
{loadingTags && <MenuItem value="" disabled><CircularProgress size={16} /> Cargando…</MenuItem>} onChange={(e) => setVal('color', e.target.value)}
{!loadingTags && options.colors.filter(t => t.status !== 'Inactive').map(tag => ( >
<MenuItem key={tag._id?.$oid || tag._id || tag.id} value={tag.tagName}>{tag.tagName}</MenuItem> {loadingTags && <MenuItem value="" disabled><CircularProgress size={16} /> Cargando…</MenuItem>}
))} {!loadingTags && options.colors.filter(t => t.status !== 'Inactive').map(tag => (
</TextField> <MenuItem key={tag._id?.$oid || tag._id || tag.id} value={tag.tagName}>{tag.tagName}</MenuItem>
<TextField ))}
select </TextField>
label="Line" </Box>
fullWidth {/* Line */}
value={form.line} <Box flex={1}>
onChange={(e) => setVal('line', e.target.value)} <TextField
> select
{loadingTags && <MenuItem value="" disabled><CircularProgress size={16} /> Cargando…</MenuItem>} label="Line"
{!loadingTags && options.lines.filter(t => t.status !== 'Inactive').map(tag => ( fullWidth
<MenuItem key={tag._id?.$oid || tag._id || tag.id} value={tag.tagName}>{tag.tagName}</MenuItem> value={form.line}
))} onChange={(e) => setVal('line', e.target.value)}
</TextField> >
<TextField {loadingTags && <MenuItem value="" disabled><CircularProgress size={16} /> Cargando…</MenuItem>}
select {!loadingTags && options.lines.filter(t => t.status !== 'Inactive').map(tag => (
label="Currency" <MenuItem key={tag._id?.$oid || tag._id || tag.id} value={tag.tagName}>{tag.tagName}</MenuItem>
fullWidth ))}
value={form.currency} </TextField>
onChange={(e) => setVal('currency', e.target.value)} </Box>
> {/* Material */}
{loadingTags && <MenuItem value="" disabled><CircularProgress size={16} /> Cargando…</MenuItem>} <Box flex={1}>
{!loadingTags && options.currencies.filter(t => t.status !== 'Inactive').map(tag => ( <TextField
<MenuItem key={tag._id?.$oid || tag._id || tag.id} value={tag.tagName}>{tag.tagName}</MenuItem> select
))} label="Material"
</TextField> fullWidth
value={form.attributes.material}
onChange={(e) => setVal('attributes.material', e.target.value)}
>
{loadingTags && <MenuItem value="" disabled><CircularProgress size={16} /> Cargando…</MenuItem>}
{!loadingTags && options.materials.filter(t => t.status !== 'Inactive').map(tag => (
<MenuItem key={tag._id?.$oid || tag._id || tag.id} value={tag.tagName}>{tag.tagName}</MenuItem>
))}
</TextField>
</Box>
</Box>
<Box display="flex" gap={2}>
{/* Price */}
<Box flex={1}>
<TextField label="Price" type="number" fullWidth value={form.price} onChange={(e) => setVal('price', e.target.value)} />
</Box>
{/* Stock */}
<Box flex={1}>
<TextField label="Stock" type="number" fullWidth value={form.stock} onChange={(e) => setVal('stock', e.target.value)} />
</Box>
{/* Currency */}
<Box flex={1}>
<TextField
select
label="Currency"
fullWidth
value={form.currency}
onChange={(e) => setVal('currency', e.target.value)}
>
{loadingTags && <MenuItem value="" disabled><CircularProgress size={16} /> Cargando…</MenuItem>}
{!loadingTags && options.currencies.filter(t => t.status !== 'Inactive').map(tag => (
<MenuItem key={tag._id?.$oid || tag._id || tag.id} value={tag.tagName}>{tag.tagName}</MenuItem>
))}
</TextField>
</Box>
</Box>
{/* Attributes */} {/* Attributes */}
<TextField
select
label="Material"
fullWidth
value={form.attributes.material}
onChange={(e) => setVal('attributes.material', e.target.value)}
>
{loadingTags && <MenuItem value="" disabled><CircularProgress size={16} /> Cargando…</MenuItem>}
{!loadingTags && options.materials.filter(t => t.status !== 'Inactive').map(tag => (
<MenuItem key={tag._id?.$oid || tag._id || tag.id} value={tag.tagName}>{tag.tagName}</MenuItem>
))}
</TextField>
<TextField <TextField
select select
label="Legs" label="Legs"
@@ -309,9 +334,11 @@ export default function AddOrEditProductCollectionForm({ initialData, onAdd, onC
))} ))}
</TextField> </TextField>
{/* Stock / Price */} {/* Status */}
<TextField label="Stock" type="number" fullWidth value={form.stock} onChange={(e) => setVal('stock', e.target.value)} /> <TextField select label="Status" fullWidth value={form.status} onChange={(e) => setVal('status', e.target.value)}>
<TextField label="Price" type="number" fullWidth value={form.price} onChange={(e) => setVal('price', e.target.value)} /> <MenuItem value="Active">Active</MenuItem>
<MenuItem value="Inactive">Inactive</MenuItem>
</TextField>
</Box> </Box>
<Box display="flex" justifyContent="flex-end" mt={3} gap={1}> <Box display="flex" justifyContent="flex-end" mt={3} gap={1}>