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

feat: day of month handle

Browse Source
This commit is contained in:
karishmas6
2024-10-29 01:09:20 +05:30
parent fd9d55fbfc
commit d375361432
1 changed files with 98 additions and 112 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -1,6 +1,6 @@
import React, { useState, useEffect } from 'react'; import React, { useState, useEffect } from 'react';
import { GenericModal } from "../atoms/GenericModal"; import { GenericModal } from "../atoms/GenericModal";
import { MenuItem, TextField, Typography, Box, Switch, FormControlLabel } 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 { validMomentTimezones } from '../../constants/const'; import { validMomentTimezones } from '../../constants/const';
@@ -17,7 +17,8 @@ interface ScheduleSettingsProps {
export interface ScheduleSettings { export interface ScheduleSettings {
runEvery: number; runEvery: number;
runEveryUnit: string; runEveryUnit: string;
startFrom: string; startFrom: string;
dayOfMonth?: string;
atTimeStart?: string; atTimeStart?: string;
atTimeEnd?: string; atTimeEnd?: string;
timezone: string; timezone: string;
@@ -28,13 +29,13 @@ export const ScheduleSettingsModal = ({ isOpen, handleStart, handleClose, initia
const [settings, setSettings] = useState<ScheduleSettings>({ const [settings, setSettings] = useState<ScheduleSettings>({
runEvery: 1, runEvery: 1,
runEveryUnit: 'HOURS', runEveryUnit: 'HOURS',
startFrom: 'MONDAY', startFrom: 'MONDAY',
dayOfMonth: '',
atTimeStart: '00:00', atTimeStart: '00:00',
atTimeEnd: '01:00', atTimeEnd: '01:00',
timezone: 'UTC' timezone: 'UTC'
}); });
// Load initial settings if provided
useEffect(() => { useEffect(() => {
if (initialSettings) { if (initialSettings) {
setSettings(initialSettings); setSettings(initialSettings);
@@ -66,20 +67,8 @@ export const ScheduleSettingsModal = ({ isOpen, handleStart, handleClose, initia
'MONTHS' 'MONTHS'
]; ];
const days = [
'MONDAY',
'TUESDAY',
'WEDNESDAY',
'THURSDAY',
'FRIDAY',
'SATURDAY',
'SUNDAY'
];
const { recordingId } = useGlobalInfoStore(); const { recordingId } = useGlobalInfoStore();
console.log(`Recoridng ID Shculde: ${recordingId}`);
const deleteRobotSchedule = () => { const deleteRobotSchedule = () => {
if (recordingId) { if (recordingId) {
deleteSchedule(recordingId); deleteSchedule(recordingId);
@@ -92,6 +81,7 @@ export const ScheduleSettingsModal = ({ isOpen, handleStart, handleClose, initia
runEvery: 1, runEvery: 1,
runEveryUnit: 'HOURS', runEveryUnit: 'HOURS',
startFrom: 'MONDAY', startFrom: 'MONDAY',
dayOfMonth: '',
atTimeStart: '00:00', atTimeStart: '00:00',
atTimeEnd: '01:00', atTimeEnd: '01:00',
timezone: 'UTC' timezone: 'UTC'
@@ -101,7 +91,6 @@ export const ScheduleSettingsModal = ({ isOpen, handleStart, handleClose, initia
const getRobotSchedule = async () => { const getRobotSchedule = async () => {
if (recordingId) { if (recordingId) {
const scheduleData = await getSchedule(recordingId); const scheduleData = await getSchedule(recordingId);
console.log(`Robot found schedule: ${JSON.stringify(scheduleData, null, 2)}`);
setSchedule(scheduleData); setSchedule(scheduleData);
} else { } else {
console.error('No recording id provided'); console.error('No recording id provided');
@@ -132,116 +121,113 @@ export const ScheduleSettingsModal = ({ isOpen, handleStart, handleClose, initia
}}> }}>
<Typography variant="h6" sx={{ marginBottom: '20px' }}>Schedule Settings</Typography> <Typography variant="h6" sx={{ marginBottom: '20px' }}>Schedule Settings</Typography>
<> <>
{ {schedule !== null ? (
(schedule !== null) ? ( <>
<> <Typography>Run every: {schedule.runEvery} {schedule.runEveryUnit.toLowerCase()}</Typography>
<Typography>Run every: {schedule.runEvery} {schedule.runEveryUnit.toLowerCase()}</Typography> <Typography>Start from: {schedule.startFrom.charAt(0).toUpperCase() + schedule.startFrom.slice(1).toLowerCase()}</Typography>
<Typography>Start from: {schedule.startFrom.charAt(0).toUpperCase() + schedule.startFrom.slice(1).toLowerCase()}</Typography> <Typography>On day: {schedule.dayOfMonth}</Typography>
<Typography>At around: {schedule.atTimeStart}, {schedule.timezone} Timezone</Typography> <Typography>At around: {schedule.atTimeStart}, {schedule.timezone} Timezone</Typography>
<Box mt={2} display="flex" justifyContent="space-between"> <Box mt={2} display="flex" justifyContent="space-between">
<Button <Button
onClick={deleteRobotSchedule} onClick={deleteRobotSchedule}
variant="outlined" variant="outlined"
color="error" color="error"
> >
Delete Schedule Delete Schedule
</Button> </Button>
</Box> </Box>
</> </>
) : ( ) : (
<> <>
<Box sx={{ display: 'flex', alignItems: 'center', width: '100%' }}>
<Typography sx={{ marginRight: '10px' }}>Run once every</Typography>
<TextField
type="number"
value={settings.runEvery}
onChange={(e) => handleChange('runEvery', parseInt(e.target.value))}
sx={textStyle}
inputProps={{ min: 1 }}
/>
<Dropdown
label=""
id="runEveryUnit"
value={settings.runEveryUnit}
handleSelect={(e) => handleChange('runEveryUnit', e.target.value)}
sx={dropDownStyle}
>
{units.map((unit) => (
<MenuItem key={unit} value={unit}>{unit}</MenuItem>
))}
</Dropdown>
</Box>
{settings.runEveryUnit === 'MONTHS' && (
<Box sx={{ display: 'flex', alignItems: 'center', width: '100%' }}> <Box sx={{ display: 'flex', alignItems: 'center', width: '100%' }}>
<Typography sx={{ marginRight: '10px' }}>Run once every</Typography> <Typography sx={{ marginBottom: '5px', marginRight: '25px' }}>On Day of the Month</Typography>
<TextField <TextField
type="number" type="number"
value={settings.runEvery} value={settings.dayOfMonth}
onChange={(e) => handleChange('runEvery', parseInt(e.target.value))} onChange={(e) => handleChange('dayOfMonth', e.target.value)}
sx={textStyle} sx={textStyle}
inputProps={{ min: 1 }} inputProps={{ min: 1, max: 31 }}
/> />
<Dropdown
label=""
id="runEveryUnit"
value={settings.runEveryUnit}
handleSelect={(e) => handleChange('runEveryUnit', e.target.value)}
sx={dropDownStyle}
>
{units.map((unit) => (
<MenuItem key={unit} value={unit}>{unit}</MenuItem>
))}
</Dropdown>
</Box> </Box>
)}
{['MINUTES', 'HOURS'].includes(settings.runEveryUnit) ? (
<Box sx={{ display: 'flex', alignItems: 'center', width: '100%' }}> <Box sx={{ display: 'flex', alignItems: 'center', width: '100%' }}>
<Typography sx={{ marginBottom: '5px', marginRight: '25px' }}>Start from / On</Typography> <Box sx={{ marginRight: '20px' }}>
<Dropdown <Typography sx={{ marginBottom: '5px' }}>In Between</Typography>
label=""
id="startFrom"
value={settings.startFrom}
handleSelect={(e) => handleChange('startFrom', e.target.value)}
sx={dropDownStyle}
>
{days.map((day) => (
<MenuItem key={day} value={day}>{day}</MenuItem>
))}
</Dropdown>
</Box>
{['MINUTES', 'HOURS'].includes(settings.runEveryUnit) ? (
<Box sx={{ display: 'flex', alignItems: 'center', width: '100%' }}>
<Box sx={{ marginRight: '20px' }}>
<Typography sx={{ marginBottom: '5px' }}>In Between</Typography>
<TextField
type="time"
value={settings.atTimeStart}
onChange={(e) => handleChange('atTimeStart', e.target.value)}
sx={textStyle}
/>
<TextField
type="time"
value={settings.atTimeEnd}
onChange={(e) => handleChange('atTimeEnd', e.target.value)}
sx={textStyle}
/>
</Box>
</Box>
) : (
<Box sx={{ display: 'flex', alignItems: 'center', width: '100%' }}>
<Typography sx={{ marginBottom: '5px', marginRight: '10px' }}>At Around</Typography>
<TextField <TextField
type="time" type="time"
value={settings.atTimeStart} value={settings.atTimeStart}
onChange={(e) => handleChange('atTimeStart', e.target.value)} onChange={(e) => handleChange('atTimeStart', e.target.value)}
sx={textStyle} sx={textStyle}
/> />
<TextField
type="time"
value={settings.atTimeEnd}
onChange={(e) => handleChange('atTimeEnd', e.target.value)}
sx={textStyle}
/>
</Box> </Box>
)} </Box>
) : (
<Box sx={{ display: 'flex', alignItems: 'center', width: '100%' }}> <Box sx={{ display: 'flex', alignItems: 'center', width: '100%' }}>
<Typography sx={{ marginRight: '10px' }}>Timezone</Typography> <Typography sx={{ marginBottom: '5px', marginRight: '10px' }}>At Around</Typography>
<Dropdown <TextField
label="" type="time"
id="timezone" value={settings.atTimeStart}
value={settings.timezone} onChange={(e) => handleChange('atTimeStart', e.target.value)}
handleSelect={(e) => handleChange('timezone', e.target.value)} sx={textStyle}
sx={dropDownStyle} />
>
{validMomentTimezones.map((tz) => (
<MenuItem key={tz} value={tz}>{tz}</MenuItem>
))}
</Dropdown>
</Box> </Box>
<Box mt={2} display="flex" justifyContent="flex-end"> )}
<Button onClick={() => handleStart(settings)} variant="contained" color="primary">
Save Schedule <Box sx={{ display: 'flex', alignItems: 'center', width: '100%' }}>
</Button> <Typography sx={{ marginRight: '10px' }}>Timezone</Typography>
<Button onClick={handleClose} color="primary" variant="outlined" style={{ marginLeft: '10px' }}> <Dropdown
Cancel label=""
</Button> id="timezone"
</Box> value={settings.timezone}
</> handleSelect={(e) => handleChange('timezone', e.target.value)}
) sx={dropDownStyle}
} >
{validMomentTimezones.map((tz) => (
<MenuItem key={tz} value={tz}>{tz}</MenuItem>
))}
</Dropdown>
</Box>
<Box mt={2} display="flex" justifyContent="flex-end">
<Button onClick={() => handleStart(settings)} variant="contained" color="primary">
Save Schedule
</Button>
<Button onClick={handleClose} color="primary" variant="outlined" style={{ marginLeft: '10px' }}>
Cancel
</Button>
</Box>
</>
)}
</> </>
</Box> </Box>
</GenericModal> </GenericModal>