amikhalev/sprinklers3
1
1
Fork 0
Code Issues 9 Pull Requests 1 Releases Wiki Activity

Refer to section by id in SectionChooser

Browse Source
This commit is contained in:
Alex Mikhalev 2018-08-17 13:57:41 -06:00
parent f8a1dd0a8c
commit f345344974
2 changed files with 18 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
client/components/RunSectionForm.tsx
View File

@ -15,18 +15,18 @@ export default class RunSectionForm extends React.Component<{
uiStore: UiStore,
}, {
duration: Duration,
section: Section | undefined,
sectionId: number | undefined,
}> {
constructor(props: any, context?: any) {
super(props, context);
this.state = {
duration: new Duration(0, 0),
section: undefined,
sectionId: undefined,
};
}
render() {
const { section, duration } = this.state;
const { sectionId, duration } = this.state;
return (
<Segment>
<Header>Run Section</Header>
@ -34,7 +34,7 @@ export default class RunSectionForm extends React.Component<{
<SectionChooser
label="Section"
sections={this.props.device.sections}
value={section}
sectionId={sectionId}
onChange={this.onSectionChange}
/>
<DurationView
@ -55,8 +55,8 @@ export default class RunSectionForm extends React.Component<{
);
}
private onSectionChange = (newSection: Section) => {
this.setState({ section: newSection });
private onSectionChange = (newSectionId: number) => {
this.setState({ sectionId: newSectionId });
}
private onDurationChange = (newDuration: Duration) => {
@ -65,10 +65,11 @@ export default class RunSectionForm extends React.Component<{
private run = (e: React.SyntheticEvent<HTMLElement>) => {
e.preventDefault();
const { section, duration } = this.state;
if (!section) {
const { sectionId, duration } = this.state;
if (sectionId == null) {
return;
}
const section = this.props.device.sections[sectionId];
section.run(duration.toSeconds())
.then(this.onRunSuccess)
.catch(this.onRunError);
@ -91,6 +92,6 @@ export default class RunSectionForm extends React.Component<{
}
private get isValid(): boolean {
return this.state.section != null && this.state.duration.toSeconds() > 0;
return this.state.sectionId != null && this.state.duration.toSeconds() > 0;
}
}

17
client/components/SectionChooser.tsx
View File

@ -12,17 +12,16 @@ export default class SectionChooser extends React.Component<{
label?: string,
inline?: boolean,
sections: Section[],
value?: Section,
onChange?: (section: Section) => void,
sectionId?: number,
onChange?: (sectionId: number) => void,
}> {
render() {
const { label, inline, sections, value, onChange } = this.props;
let section = (value == null) ? "" : sections.indexOf(value);
section = (section === -1) ? "" : section;
const onSectionChange = (onChange == null) ? undefined : this.onSectionChange;
const { label, inline, sections, sectionId, onChange } = this.props;
if (onChange == null) {
return <React.Fragment>{label || ""} '{value ? value.toString() : ""}'</React.Fragment>;
const sectionStr = sectionId != null ? sections[sectionId].toString() : "";
return <React.Fragment>{label || ""} '{sectionStr}'</React.Fragment>;
}
const section = (sectionId == null) ? "" : sectionId;
return (
<Form.Select
className="sectionChooser"
@ -31,13 +30,13 @@ export default class SectionChooser extends React.Component<{
placeholder="Section"
options={this.sectionOptions}
value={section}
onChange={onSectionChange}
onChange={this.onSectionChange}
/>
);
}
private onSectionChange = (e: React.SyntheticEvent<HTMLElement>, v: DropdownProps) => {
this.props.onChange!(this.props.sections[v.value as number]);
this.props.onChange!(this.props.sections[v.value as number].id);
}
@computed