dialog ui fix

This commit is contained in:
Sonika 2024-01-17 16:20:30 +05:30
parent 95dbc0cff7
commit 0e4a5f4435
2 changed files with 63 additions and 50 deletions

View File

@ -71,12 +71,15 @@ const StyledTextField = (props:any) => (
'&:hover fieldset': { borderColor: 'white', borderWidth: 2 },
},
...props.sx,
width:'92vh'
}}
>
{props.children}
</Select>
</div>
);
interface Row {
username: string;
role: string;
@ -259,23 +262,30 @@ export default function IntranetUsers(){
onPageChange={handleChangePage}
onRowsPerPageChange={handleChangeRowsPerPage}
/>
<Dialog open={open} onClose={handleClose}>
<DialogTitle sx={{bgcolor:'rgb(24 24 23)', color:'white'}}>{selectedRow && selectedRow.id ? 'Edit Row' : 'Add New Row'}</DialogTitle>
<DialogContent sx={{ bgcolor: 'rgb(24 24 23)' }} className="dialog-class">
<Dialog open={open} onClose={handleClose} maxWidth="sm" fullWidth>
<DialogTitle sx={{ bgcolor: 'rgb(24 24 23)', color: 'white', textAlign: 'center' }}>
{selectedRow && selectedRow.id ? 'Edit Row' : 'Add New Row'}
</DialogTitle>
<DialogContent sx={{ bgcolor: 'rgb(24 24 23)', display: 'flex', flexDirection: 'column', alignItems: 'center', padding: '20px' }} className="dialog-class">
<StyledTextField
label="Name"
type="text"
name="username"
value={selectedRow && selectedRow.username}
onChange={handleChange}
sx={{ width: '100%', marginBottom: '20px', }}
/>
<StyledTextField
label="Role"
name="role"
value={selectedRow && selectedRow.role}
onChange={handleChange}
sx={{ width: '100%', marginBottom: '20px' }}
/>
<StyledSelect
fullWidth
label="Active"
placeholder="Active"
name="active"
@ -287,7 +297,7 @@ export default function IntranetUsers(){
</StyledSelect>
</DialogContent>
<DialogActions sx={{bgcolor:'rgb(24 24 23)'}} className="dialog-class-actions">
<DialogActions sx={{ bgcolor: 'rgb(24 24 23)', justifyContent: 'space-between', padding: '20px' }} className="dialog-class-actions">
<Button onClick={handleClose} color="primary">
Cancel
</Button>
@ -296,6 +306,8 @@ export default function IntranetUsers(){
</Button>
</DialogActions>
</Dialog>
</Paper>
</Paper>
</Box>

View File

@ -69,6 +69,7 @@ const StyledTextField = (props:any) => (
'&:hover fieldset': { borderColor: 'white', borderWidth: 2 },
},
...props.sx,
width:'92vh'
}}
>
{props.children}
@ -263,29 +264,28 @@ export default function ManageUsers(){
onPageChange={handleChangePage}
onRowsPerPageChange={handleChangeRowsPerPage}
/>
<Dialog open={open} onClose={handleClose}>
<DialogTitle sx={{bgcolor:'rgb(24 24 23)', color:'white'}}>{selectedRow && selectedRow.id ? 'Edit Row' : 'Add New Row'}</DialogTitle>
<DialogContent sx={{ bgcolor: 'rgb(24 24 23)' }} className="dialog-class">
<Dialog open={open} onClose={handleClose} maxWidth="sm" fullWidth>
<DialogTitle sx={{ bgcolor: 'rgb(24 24 23)', color: 'white', textAlign: 'center' }}>
{selectedRow && selectedRow.id ? 'Edit Row' : 'Add New Row'}
</DialogTitle>
<DialogContent sx={{ bgcolor: 'rgb(24 24 23)', display: 'flex', flexDirection: 'column', alignItems: 'center', padding: '20px' }} className="dialog-class">
<StyledTextField
label="Name"
type="text"
name="username"
value={selectedRow && selectedRow.username}
onChange={handleChange}
sx={{ width: '100%', marginBottom: '20px', }}
/>
<StyledTextField
label="Email"
name="email_id"
value={selectedRow && selectedRow.email_id}
onChange={handleChange}
/>
<StyledTextField
label="Last Login"
name="last_login"
value={selectedRow && selectedRow.last_login}
label="Role"
name="role"
value={selectedRow && selectedRow.role}
onChange={handleChange}
sx={{ width: '100%', marginBottom: '20px' }}
/>
<StyledSelect
fullWidth
label="Active"
placeholder="Active"
name="active"
@ -295,8 +295,9 @@ export default function ManageUsers(){
<MenuItem value='Active'>Active</MenuItem>
<MenuItem value='Inactive'>Inactive</MenuItem>
</StyledSelect>
</DialogContent>
<DialogActions sx={{bgcolor:'rgb(24 24 23)'}} className="dialog-class-actions">
<DialogActions sx={{ bgcolor: 'rgb(24 24 23)', justifyContent: 'space-between', padding: '20px' }} className="dialog-class-actions">
<Button onClick={handleClose} color="primary">
Cancel
</Button>