NewAppointment.tsx
58 lines
| 1.9 KiB
| text/x-typescript
|
TypeScriptLexer
cin
|
r134 | import { id as mid } from "module"; | |
import { djbase, djclass } from "@implab/djx/declare"; | |||
cin
|
r136 | import { bind, createElement, prop } from "@implab/djx/tsx"; | |
cin
|
r134 | import { DjxWidgetBase } from "@implab/djx/tsx/DjxWidgetBase"; | |
import Form from "@implab/djx/form/Form"; | |||
import { TraceSource } from "@implab/core-amd/log/TraceSource"; | |||
import DateTextBox = require("dijit/form/DateTextBox"); | |||
import Button = require("dijit/form/Button"); | |||
import ValidationTextBox = require("dijit/form/ValidationTextBox"); | |||
const trace = TraceSource.get(mid); | |||
interface NewAppointmentProps { | |||
title: string; | |||
startAt?: Date; | |||
} | |||
@djclass | |||
export default class NewAppointment extends djbase(DjxWidgetBase) { | |||
value: NewAppointmentProps = {title: "Appointment 1"}; | |||
render() { | |||
return <section> | |||
<Form<NewAppointmentProps> ref={bind("value", prop(this, "value"))} | |||
method="DIALOG" | |||
onSubmit={this._onSubmit} | |||
onReset={this._onReset} | |||
onValidStateChange={this._onValidStateChange} | |||
onValueChange={this._onValueChange} | |||
> | |||
<p><label>Title: <ValidationTextBox required name="title"/></label></p> | |||
<p><label>Appointment date: <DateTextBox required name="startAt"/></label></p> | |||
<footer> | |||
<Button type="submit">Send</Button> | |||
<Button type="reset">Reset</Button> | |||
</footer> | |||
</Form> | |||
</section>; | |||
} | |||
private readonly _onSubmit = (evt: Event) => { | |||
trace.debug("onSubmit"); | |||
}; | |||
private readonly _onValidStateChange = (isValid?: boolean) => { | |||
trace.debug("isValid={0}", isValid); | |||
}; | |||
private readonly _onValueChange = (value: NewAppointmentProps) => { | |||
trace.debug("valueChange={0}", value); | |||
}; | |||
private readonly _onReset = (evt: Event) => { | |||
trace.debug("onReset"); | |||
//evt.preventDefault(); | |||
}; | |||
} |