vodorod/parcer
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(wip): scheduler styling

Browse Source
This commit is contained in:
karishmas6
2024-09-12 22:27:32 +05:30
parent ce8344a1be
commit a09841372b
1 changed files with 40 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files

77
src/components/molecules/ScheduleSettings.tsx
View File

@@ -1,6 +1,6 @@
import React, { useState } from 'react'; import React, { useState } from 'react';
import { GenericModal } from "../atoms/GenericModal"; import { GenericModal } from "../atoms/GenericModal";
import { MenuItem, TextField, Typography } from "@mui/material"; import { MenuItem, TextField, Typography, Box } from "@mui/material";
import { Dropdown } from "../atoms/DropdownMui"; import { Dropdown } from "../atoms/DropdownMui";
import Button from "@mui/material/Button"; import Button from "@mui/material/Button";
import { modalStyle } from "./AddWhereCondModal"; import { modalStyle } from "./AddWhereCondModal";
@@ -38,19 +38,22 @@ export const ScheduleSettingsModal = ({ isOpen, handleStart, handleClose }: Sche
onClose={handleClose} onClose={handleClose}
modalStyle={modalStyle} modalStyle={modalStyle}
> >
<div style={{ <Box sx={{
display: 'flex', display: 'flex',
flexDirection: 'column', flexDirection: 'column',
alignItems: 'flex-start', alignItems: 'flex-start',
marginLeft: '65px', padding: '20px',
'& > *': { marginBottom: '20px' },
}}> }}>
<div style={{ display: 'flex', alignItems: 'center', marginBottom: '15px' }}> <Typography variant="h6">Schedule Settings</Typography>
<Typography>Run once every</Typography>
<Box sx={{ display: 'flex', alignItems: 'center', width: '100%' }}>
<Typography sx={{ marginRight: '10px' }}>Run once every</Typography>
<TextField <TextField
type="number" type="number"
value={settings.runEvery} value={settings.runEvery}
onChange={(e) => handleChange('runEvery', parseInt(e.target.value))} onChange={(e) => handleChange('runEvery', parseInt(e.target.value))}
style={{ width: '60px', margin: '0 10px' }} sx={{ width: '60px', marginRight: '10px' }}
/> />
<Dropdown <Dropdown
label="unit" label="unit"
@@ -64,10 +67,10 @@ export const ScheduleSettingsModal = ({ isOpen, handleStart, handleClose }: Sche
<MenuItem value="weeks">weeks</MenuItem> <MenuItem value="weeks">weeks</MenuItem>
<MenuItem value="months">months</MenuItem> <MenuItem value="months">months</MenuItem>
</Dropdown> </Dropdown>
</div> </Box>
<div style={{ marginBottom: '15px' }}> <Box sx={{ width: '100%' }}>
<Typography>Start from</Typography> <Typography sx={{ marginBottom: '5px' }}>Start from</Typography>
<Dropdown <Dropdown
label="start from" label="start from"
id="startFrom" id="startFrom"
@@ -82,36 +85,36 @@ export const ScheduleSettingsModal = ({ isOpen, handleStart, handleClose }: Sche
<MenuItem value="Saturday">Saturday</MenuItem> <MenuItem value="Saturday">Saturday</MenuItem>
<MenuItem value="Sunday">Sunday</MenuItem> <MenuItem value="Sunday">Sunday</MenuItem>
</Dropdown> </Dropdown>
</div> </Box>
<div style={{ marginBottom: '15px' }}> <Box sx={{ display: 'flex', alignItems: 'center', width: '100%' }}>
<Typography>At around</Typography> <Box sx={{ marginRight: '20px' }}>
<TextField <Typography sx={{ marginBottom: '5px' }}>At around</Typography>
type="time" <TextField
value={settings.atTime} type="time"
onChange={(e) => handleChange('atTime', e.target.value)} value={settings.atTime}
/> onChange={(e) => handleChange('atTime', e.target.value)}
</div> />
</Box>
<Box>
<Typography sx={{ marginBottom: '5px' }}>Timezone</Typography>
<Dropdown
label="timezone"
id="timezone"
value={settings.timezone}
handleSelect={(e) => handleChange('timezone', e.target.value)}
>
<MenuItem value="UTC">UTC</MenuItem>
<MenuItem value="America/New_York">America/New_York</MenuItem>
<MenuItem value="Europe/London">Europe/London</MenuItem>
<MenuItem value="Asia/Tokyo">Asia/Tokyo</MenuItem>
<MenuItem value="Asia/Kolkata">Asia/Kolkata</MenuItem>
</Dropdown>
</Box>
</Box>
<div style={{ marginBottom: '15px' }}> <Button variant="contained" onClick={() => handleStart(settings)}>Start</Button>
<Typography>Timezone</Typography> </Box>
<Dropdown
label="timezone"
id="timezone"
value={settings.timezone}
handleSelect={(e) => handleChange('timezone', e.target.value)}
>
<MenuItem value="UTC">UTC</MenuItem>
<MenuItem value="America/New_York">America/New_York</MenuItem>
<MenuItem value="Europe/London">Europe/London</MenuItem>
<MenuItem value="Asia/Tokyo">Asia/Tokyo</MenuItem>
<MenuItem value="Asia/Kolkata">Asia/Kolkata</MenuItem>
{/* Add more timezone options as needed */}
</Dropdown>
</div>
<Button onClick={() => handleStart(settings)}>Start</Button>
</div>
</GenericModal> </GenericModal>
); );
} }