andry/EMS-ESP32
1
0
Fork 0
mirror of https://github.com/emsesp/EMS-ESP32.git synced 2025-12-07 08:19:52 +03:00
Code Issues Packages Projects Releases Wiki Activity

Scheduler #701 updates to dialog

Browse Source
This commit is contained in:
proddy
2023-03-05 10:08:26 +01:00
parent de59434d95
commit 8ee8998381
2 changed files with 34 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

55
interface/src/project/SettingsScheduler.tsx
View File

@@ -13,6 +13,7 @@ import {
ToggleButton, ToggleButton,
ToggleButtonGroup, ToggleButtonGroup,
Checkbox, Checkbox,
Grid,
TextField, TextField,
Divider Divider
} from '@mui/material'; } from '@mui/material';
@@ -51,7 +52,6 @@ import { useI18nContext } from 'i18n/i18n-react';
import * as EMSESP from './api'; import * as EMSESP from './api';
function makeid() { function makeid() {
// TODO finish this!
let result = ''; let result = '';
const characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789'; const characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
const charactersLength = characters.length; const charactersLength = characters.length;
@@ -330,7 +330,7 @@ const SettingsScheduler: FC = () => {
const addScheduleItem = () => { const addScheduleItem = () => {
setCreating(true); setCreating(true);
setScheduleItem({ setScheduleItem({
id: '', id: makeid(),
active: false, active: false,
deleted: false, deleted: false,
flags: 0, flags: 0,
@@ -342,7 +342,9 @@ const SettingsScheduler: FC = () => {
}; };
const updateScheduleItem = () => { const updateScheduleItem = () => {
setSchedule([...schedule.filter((si) => creating || si.o_id !== scheduleItem.o_id), scheduleItem]); if (scheduleItem) {
setSchedule([...schedule.filter((si) => creating || si.o_id !== scheduleItem.o_id), scheduleItem]);
}
setScheduleItem(undefined); setScheduleItem(undefined);
}; };
@@ -366,7 +368,7 @@ const SettingsScheduler: FC = () => {
<HeaderCell stiff>{LL.TIME()}</HeaderCell> <HeaderCell stiff>{LL.TIME()}</HeaderCell>
<HeaderCell stiff>{LL.COMMAND()}</HeaderCell> <HeaderCell stiff>{LL.COMMAND()}</HeaderCell>
<HeaderCell stiff>{LL.VALUE(0)}</HeaderCell> <HeaderCell stiff>{LL.VALUE(0)}</HeaderCell>
<HeaderCell stiff>{LL.NAME()}</HeaderCell> <HeaderCell stiff>{LL.NAME(0)}</HeaderCell>
</HeaderRow> </HeaderRow>
</Header> </Header>
<Body> <Body>
@@ -409,7 +411,7 @@ const SettingsScheduler: FC = () => {
if (scheduleItem) { if (scheduleItem) {
try { try {
setFieldErrors(undefined); setFieldErrors(undefined);
await validate(schedulerItemValidation(schedule, scheduleItem.o_id), scheduleItem); await validate(schedulerItemValidation(schedule, scheduleItem), scheduleItem);
updateScheduleItem(); updateScheduleItem();
} catch (errors: any) { } catch (errors: any) {
setFieldErrors(errors); setFieldErrors(errors);
@@ -419,7 +421,7 @@ const SettingsScheduler: FC = () => {
const closeDialog = () => { const closeDialog = () => {
setScheduleItem(undefined); setScheduleItem(undefined);
setFieldErrors(); setFieldErrors(undefined);
}; };
const renderEditSchedule = () => { const renderEditSchedule = () => {
@@ -431,7 +433,7 @@ const SettingsScheduler: FC = () => {
{creating ? LL.ADD(0) + ' ' + LL.NEW() : LL.EDIT()}&nbsp;{LL.SCHEDULE()} {creating ? LL.ADD(0) + ' ' + LL.NEW() : LL.EDIT()}&nbsp;{LL.SCHEDULE()}
</DialogTitle> </DialogTitle>
<DialogContent dividers> <DialogContent dividers>
<Box display="flex" flexWrap="wrap" mb={2}> <Box display="flex" flexWrap="wrap" mb={1}>
<Box flexGrow={1}> <Box flexGrow={1}>
<ToggleButtonGroup <ToggleButtonGroup
size="small" size="small"
@@ -478,33 +480,36 @@ const SettingsScheduler: FC = () => {
)} )}
</Box> </Box>
</Box> </Box>
<BlockFormControlLabel
control={<Checkbox checked={scheduleItem.active} onChange={updateValue(setScheduleItem)} name="active" />}
label={LL.ACTIVE()}
/>
<ValidatedTextField <ValidatedTextField
fieldErrors={fieldErrors} fieldErrors={fieldErrors}
name="name" name="name"
label={LL.NAME()} label={LL.NAME(0)}
value={scheduleItem.name} value={scheduleItem.name}
fullWidth fullWidth
margin="normal" margin="normal"
sx={{ width: '60ch' }} sx={{ width: '60ch' }}
onChange={updateValue(setScheduleItem)} onChange={updateValue(setScheduleItem)}
/> />
<BlockFormControlLabel
control={<Checkbox checked={scheduleItem.active} onChange={updateValue(setScheduleItem)} name="active" />} <Grid container spacing={0} direction="row" justifyContent="flex-start" alignItems="flex-start">
label={LL.ACTIVE()} <TextField
/> name="time"
<TextField type="time"
name="time" label={isTimer ? LL.TIMER() : LL.TIME()}
type="time" value={scheduleItem.time}
label={isTimer ? LL.TIMER() : LL.TIME()} margin="normal"
value={scheduleItem.time} onChange={updateValue(setScheduleItem)}
margin="normal" />
onChange={updateValue(setScheduleItem)} {isTimer && (
/> <Box color="warning.main" ml={2} mt={4}>
{isTimer && ( <Typography variant="body2">{LL.SCHEDULER_HELP_2()}</Typography>
<Box color="warning.main"> </Box>
<Typography variant="body2">{LL.SCHEDULER_HELP_2()}</Typography> )}
</Box> </Grid>
)}
<ValidatedTextField <ValidatedTextField
fieldErrors={fieldErrors} fieldErrors={fieldErrors}
name="cmd" name="cmd"

8
interface/src/project/validators.ts
View File

@@ -85,7 +85,7 @@ export const createSettingsValidator = (settings: Settings) =>
}) })
}); });
export const schedulerItemValidation = (schedule: ScheduleItem[], o_id: string) => export const schedulerItemValidation = (schedule: ScheduleItem[], scheduleItem: ScheduleItem) =>
new Schema({ new Schema({
name: [ name: [
{ {
@@ -93,7 +93,7 @@ export const schedulerItemValidation = (schedule: ScheduleItem[], o_id: string)
pattern: /^[a-zA-Z0-9_\\.]{1,15}$/, pattern: /^[a-zA-Z0-9_\\.]{1,15}$/,
message: "Must be 1-15 characters: alpha numeric, '_' or '.'" message: "Must be 1-15 characters: alpha numeric, '_' or '.'"
}, },
...[uniqueNameValidator(schedule, o_id)] ...[uniqueNameValidator(schedule, scheduleItem.o_name)]
], ],
cmd: [ cmd: [
{ required: true, message: 'Command is required' }, { required: true, message: 'Command is required' },
@@ -101,9 +101,9 @@ export const schedulerItemValidation = (schedule: ScheduleItem[], o_id: string)
] ]
}); });
export const uniqueNameValidator = (schedule: ScheduleItem[], o_name: string) => ({ export const uniqueNameValidator = (schedule: ScheduleItem[], o_name?: string) => ({
validator(rule: InternalRuleItem, name: string, callback: (error?: string) => void) { validator(rule: InternalRuleItem, name: string, callback: (error?: string) => void) {
if (name && o_name !== name && schedule.find((si) => si.name === name)) { if (name && o_name && o_name !== name && schedule.find((si) => si.name === name)) {
callback('Name already in use'); callback('Name already in use');
} else { } else {
callback(); callback();