fix: Spostato lo state nel form

This commit is contained in:
Maicol Battistini 2023-07-19 16:35:23 +02:00
parent ef92a05c73
commit 75ac1f0eaf
No known key found for this signature in database
5 changed files with 22 additions and 22 deletions

View File

@ -26,7 +26,7 @@
"include-media": "^2.0.0",
"lit": "^2.7.6",
"mithril": "^2.2.2",
"mithril-utilities": "^1.2.0",
"mithril-utilities": "^1.2.4",
"modern-normalize": "^2.0.0",
"postcss-scss": "^4.0.6",
"prntr": "^2.0.18",

View File

@ -46,7 +46,7 @@ export default class LoginPage extends Page {
contents(vnode: Vnode<PageAttributes>) {
return <>
<h1>{__('Accedi')}</h1>
<Form id="login" style={{display: 'flex', flexDirection: 'column', gap: '16px'}} onsubmit={this.onLoginFormSubmit.bind(this)}>
<Form id="login" style={{display: 'flex', flexDirection: 'column', gap: '16px'}} state={this.form} onsubmit={this.onLoginFormSubmit.bind(this)}>
{this.fields().toArray()}
<div className="login-buttons" style={{gap: '16px'}}>
{this.buttons().toArray()}
@ -71,18 +71,18 @@ export default class LoginPage extends Page {
fields() {
return collect<VnodeCollectionItem>({
username: (
<md-filled-text-field name="username" required label={__('Nome utente/email')} state={this.form.username}>
<md-filled-text-field name="username" required label={__('Nome utente/email')}>
<MdIcon icon={mdiAccountOutline} slot="leadingicon"/>
</md-filled-text-field>
),
password: (
<md-filled-text-field name="password" required label={__('Password')} type="password" state={this.form.password}>
<md-filled-text-field name="password" required label={__('Password')} type="password">
<MdIcon icon={mdiLockOutline} slot="leadingicon"/>
</md-filled-text-field>
),
remember: (
<label>
<md-checkbox name="remember" state={this.form.remember}/>
<md-checkbox name="remember"/>
<span>{__('Ricordami')}</span>
</label>
)
@ -92,7 +92,7 @@ export default class LoginPage extends Page {
forgotPasswordFields() {
return collect<VnodeCollectionItem>({
email: (
<md-filled-text-field name="email" required label={__('Email')} type="email" state={this.forgotPasswordForm.email}>
<md-filled-text-field name="email" required label={__('Email')} type="email">
<MdIcon icon={mdiEmailOutline} slot="leadingicon"/>
</md-filled-text-field>
)

View File

@ -44,7 +44,7 @@ export default class AdminUserStep extends SetupStep<AdminUserStepAttributes> {
<p>
{__('Inserisci le informazioni richieste per creare un utente amministratore per accedere a OpenSTAManager.')}
</p>
<Form onsubmit={vnode.attrs.onSaveInstall}>
<Form state={this.adminUser} onsubmit={vnode.attrs.onSaveInstall}>
<md-layout-grid>
{this.fields().toArray()}
</md-layout-grid>
@ -57,22 +57,22 @@ export default class AdminUserStep extends SetupStep<AdminUserStepAttributes> {
fields() {
return collect<VnodeCollectionItem>({
email: (
<md-filled-text-field name="email" label={__('Email')} required state={this.adminUser.email} grid-span={6}>
<md-filled-text-field name="email" label={__('Email')} required grid-span={6}>
<MdIcon icon={mdiEmailOutline} slot="leadingicon"/>
</md-filled-text-field>
),
username: (
<md-filled-text-field name="username" label={__('Nome utente')} required state={this.adminUser.username} grid-span={6}>
<md-filled-text-field name="username" label={__('Nome utente')} required grid-span={6}>
<MdIcon icon={mdiAccountOutline} slot="leadingicon"/>
</md-filled-text-field>
),
password: (
<md-filled-text-field name="password" label={__('Password')} required type="password" state={this.adminUser.password} minLength={8} grid-span={6}>
<md-filled-text-field name="password" label={__('Password')} required type="password" minLength={8} grid-span={6}>
<MdIcon icon={mdiLockOutline} slot="leadingicon"/>
</md-filled-text-field>
),
password_confirmation: (
<md-filled-text-field name="password_confirmation" label={__('Conferma password')} required type="password" state={this.adminUser.passwordConfirmation} minLength={8} grid-span={6}>
<md-filled-text-field name="passwordConfirmation" label={__('Conferma password')} required type="password" minLength={8} grid-span={6}>
<MdIcon icon={mdiLockCheckOutline} slot="leadingicon"/>
</md-filled-text-field>
)

View File

@ -48,7 +48,7 @@ export default class DatabaseStep extends SetupStep {
<div>
<h4>{__('Database')}</h4>
<p>{__('Inserisci le informazioni per connetterti al database MySQL. I campi sono già compilati con un esempio. Se non sai come procedere, contatta il tuo fornitore di hosting.')}</p>
<Form>
<Form state={this.database}>
<md-layout-grid>
{this.fields().toArray()}
</md-layout-grid>
@ -62,32 +62,32 @@ export default class DatabaseStep extends SetupStep {
return collect<VnodeCollectionItem>({
// TODO: Autocomplete/Select with possible drivers
driver: (
<md-filled-text-field name="driver" label={__('Driver')} required state={this.database.driver} grid-span={4}>
<md-filled-text-field name="driver" label={__('Driver')} required grid-span={4}>
<MdIcon icon={mdiPowerPlugOutline} slot="leadingicon"/>
</md-filled-text-field>
),
host: (
<md-filled-text-field name="host" label={__('Host')} required state={this.database.host} grid-span={4} placeholder="localhost">
<md-filled-text-field name="host" label={__('Host')} required grid-span={4} placeholder="localhost">
<MdIcon icon={mdiServerNetwork} slot="leadingicon"/>
</md-filled-text-field>
),
username: (
<md-filled-text-field name="username" label={__('Nome utente')} required state={this.database.username} grid-span={4} placeholder="root">
<md-filled-text-field name="username" label={__('Nome utente')} required grid-span={4} placeholder="root">
<MdIcon icon={mdiAccountOutline} slot="leadingicon"/>
</md-filled-text-field>
),
password: (
<md-filled-text-field type="password" name="password" label={__('Password')} state={this.database.password} grid-span={4}>
<md-filled-text-field type="password" name="password" label={__('Password')} grid-span={4}>
<MdIcon icon={mdiFormTextboxPassword} slot="leadingicon"/>
</md-filled-text-field>
),
database_name: (
<md-filled-text-field name="database_name" label={__('Nome database')} required state={this.database.database_name} grid-span={4} placeholder="openstamanager">
<md-filled-text-field name="database_name" label={__('Nome database')} required grid-span={4} placeholder="openstamanager">
<MdIcon icon={mdiDatabaseOutline} slot="leadingicon"/>
</md-filled-text-field>
),
port: (
<md-filled-text-field name="port" label={__('Porta')} required state={this.database.port} grid-span={4} placeholder="3306">
<md-filled-text-field name="port" label={__('Porta')} required grid-span={4} placeholder="3306">
<MdIcon icon={mdiServerNetwork} slot="leadingicon"/>
</md-filled-text-field>
)

View File

@ -35,7 +35,7 @@ export default class RegionalSettings extends SetupStep {
dayjs_link: <a href="https://day.js.org/docs/en/display/format">DayJS</a>
})}
</p>
<Form>
<Form state={this.dateFormats}>
<md-layout-grid style={{'--mdc-layout-grid-margin-desktop': 0}}>
{this.fields().toArray()}
</md-layout-grid>
@ -57,21 +57,21 @@ export default class RegionalSettings extends SetupStep {
return collect<VnodeCollectionItem>({
long_date_format: (
// eslint-disable-next-line sonarjs/no-duplicate-string
<md-filled-text-field name="long_date_format" label={__('Formato data lunga')} required state={this.dateFormats.long} supporting-text={__('Anteprima: :date', {
<md-filled-text-field name="long" label={__('Formato data lunga')} required supporting-text={__('Anteprima: :date', {
date: dayjs().format(this.dateFormats.long())
})}>
<MdIcon icon={mdiCalendarClockOutline} slot="leadingicon"/>
</md-filled-text-field>
),
short_date_format: (
<md-filled-text-field name="short_date_format" label={__('Formato data corta')} required state={this.dateFormats.short} supporting-text={__('Anteprima: :date', {
<md-filled-text-field name="short" label={__('Formato data corta')} required supporting-text={__('Anteprima: :date', {
date: dayjs().format(this.dateFormats.short())
})}>
<MdIcon icon={mdiCalendarMonthOutline} slot="leadingicon"/>
</md-filled-text-field>
),
time_format: (
<md-filled-text-field name="time_format" label={__('Formato orario')} required state={this.dateFormats.time} supporting-text={__('Anteprima: :date', {
<md-filled-text-field name="time" label={__('Formato orario')} required supporting-text={__('Anteprima: :date', {
date: dayjs().format(this.dateFormats.time())
})}
>