Add more views

This commit is contained in:
Timothy Warren 2018-04-19 14:46:20 -04:00
parent 1243bd3f5e
commit baf620133b
5 changed files with 97 additions and 1 deletions

View File

@ -5,7 +5,7 @@ import * as V from './views';
export const Routes = (props) => (
<Switch>
<Route exact path="/" component={V.HomeView} />
<Route path="/camera" component={V.CameraListView} />
<Route path="/camera" component={V.CameraAddView} />
<Route path="/film" component={V.FilmAddView} />
<Route component={V.OopsView} />
</Switch>

View File

@ -0,0 +1,91 @@
import { linkEvent, Component } from 'inferno';
import {
Button,
Card,
CardBody,
CardHeader,
CardFooter,
CardTitle,
Col,
Form,
Row,
} from '../../components/Bootstrap';
import { FormBlock } from '../../components/Form';
export class CameraAddView extends Component {
constructor (props) {
super(props);
this.state = {
form: {
valid: {},
values: {},
},
};
}
handleFormChange (instance, e) {
instance.setState({
form: {
...instance.state.form,
values: {
...instance.state.form.values,
[e.target.id]: e.target.value,
},
},
});
}
render () {
return (
<Row className="full-height">
<Col sm={12} md={8} lg={4} className="abs-center">
<Form onKeyDown={ linkEvent(this, this.handleFormChange) }>
<Card>
<CardHeader>
<CardTitle>Add a Camera</CardTitle>
</CardHeader>
<CardBody>
<Row className="align-items-baseline">
<FormBlock
label="Brand"
name="brand"
required
value={this.state.form.values['brand']}
/>
<FormBlock
label="Model"
name="model"
required
value={this.state.form.values['model']}
/>
<FormBlock
label="Film Format"
name="film-format"
value={this.state.form.values['film-format']}
>
<select className="custom-select" id="film-format" name="film-format">
<option value="110">110</option>
<option value="120">120</option>
<option value="127">127</option>
<option value="135">135</option>
</select>
</FormBlock>
</Row>
</CardBody>
<CardFooter>
<Row>
<Col xs={12}>
<Button color="primary" type="submit">Save</Button>
</Col>
</Row>
</CardFooter>
</Card>
</Form>
</Col>
</Row>
);
}
}

View File

@ -1 +1,2 @@
export * from './CameraAddView';
export * from './CameraListView';

View File

@ -0,0 +1,3 @@
export const LensesListView = () => {
return <div />
};

View File

@ -0,0 +1 @@
export * from './LensesListView';