[CST-4659] Deque accessibility issues - 469984

This commit is contained in:
Davide Negretti
2021-10-05 12:54:09 +02:00
parent 69bd118001
commit ad15c07a18
5 changed files with 68 additions and 50 deletions

View File

@@ -1,4 +1,8 @@
<div class="d-flex"> <div>
<fieldset class="d-flex">
<legend [id]="'legend_' + model.id" [ngClass]="[getClass('element', 'label'), getClass('grid', 'label')]">
{{model.placeholder}} <span *ngIf="model.required">*</span>
</legend>
<ds-number-picker <ds-number-picker
tabindex="1" tabindex="1"
[disabled]="model.disabled" [disabled]="model.disabled"
@@ -44,7 +48,7 @@
(change)="onChange($event)" (change)="onChange($event)"
(focus)="onFocus($event)" (focus)="onFocus($event)"
></ds-number-picker> ></ds-number-picker>
</fieldset>
</div> </div>
<div class="clearfix"></div> <div class="clearfix"></div>

View File

@@ -1,3 +1,7 @@
.col-lg-1 { .col-lg-1 {
width: auto; width: auto;
} }
legend {
font-size: initial;
}

View File

@@ -20,6 +20,7 @@ export class DsDatePickerComponent extends DynamicFormControlComponent implement
@Input() bindId = true; @Input() bindId = true;
@Input() group: FormGroup; @Input() group: FormGroup;
@Input() model: DynamicDsDatePickerModel; @Input() model: DynamicDsDatePickerModel;
@Input() legend: string;
@Output() selected = new EventEmitter<number>(); @Output() selected = new EventEmitter<number>();
@Output() remove = new EventEmitter<number>(); @Output() remove = new EventEmitter<number>();

View File

@@ -1,24 +1,30 @@
import { import {
DynamicDateControlModel, DynamicDateControlModel,
DynamicDateControlModelConfig, DynamicDatePickerModelConfig,
DynamicFormControlLayout, DynamicFormControlLayout,
serializable serializable
} from '@ng-dynamic-forms/core'; } from '@ng-dynamic-forms/core';
export const DYNAMIC_FORM_CONTROL_TYPE_DSDATEPICKER = 'DATE'; export const DYNAMIC_FORM_CONTROL_TYPE_DSDATEPICKER = 'DATE';
export interface DynamicDsDateControlModelConfig extends DynamicDatePickerModelConfig {
legend?: string;
}
/** /**
* Dynamic Date Picker Model class * Dynamic Date Picker Model class
*/ */
export class DynamicDsDatePickerModel extends DynamicDateControlModel { export class DynamicDsDatePickerModel extends DynamicDateControlModel {
@serializable() readonly type: string = DYNAMIC_FORM_CONTROL_TYPE_DSDATEPICKER; @serializable() readonly type: string = DYNAMIC_FORM_CONTROL_TYPE_DSDATEPICKER;
malformedDate: boolean; malformedDate: boolean;
legend: string;
hasLanguages = false; hasLanguages = false;
repeatable = false; repeatable = false;
constructor(config: DynamicDateControlModelConfig, layout?: DynamicFormControlLayout) { constructor(config: DynamicDsDateControlModelConfig, layout?: DynamicFormControlLayout) {
super(config, layout); super(config, layout);
this.malformedDate = false; this.malformedDate = false;
this.legend = config.legend;
} }
} }

View File

@@ -1,6 +1,8 @@
import { FieldParser } from './field-parser'; import { FieldParser } from './field-parser';
import { DynamicDatePickerModelConfig } from '@ng-dynamic-forms/core'; import {
import { DynamicDsDatePickerModel } from '../ds-dynamic-form-ui/models/date-picker/date-picker.model'; DynamicDsDateControlModelConfig,
DynamicDsDatePickerModel
} from '../ds-dynamic-form-ui/models/date-picker/date-picker.model';
import { isNotEmpty } from '../../../empty.util'; import { isNotEmpty } from '../../../empty.util';
import { DS_DATE_PICKER_SEPARATOR } from '../ds-dynamic-form-ui/models/date-picker/date-picker.component'; import { DS_DATE_PICKER_SEPARATOR } from '../ds-dynamic-form-ui/models/date-picker/date-picker.component';
import { FormFieldMetadataValueObject } from '../models/form-field-metadata-value.model'; import { FormFieldMetadataValueObject } from '../models/form-field-metadata-value.model';
@@ -9,7 +11,8 @@ export class DateFieldParser extends FieldParser {
public modelFactory(fieldValue?: FormFieldMetadataValueObject | any, label?: boolean): any { public modelFactory(fieldValue?: FormFieldMetadataValueObject | any, label?: boolean): any {
let malformedDate = false; let malformedDate = false;
const inputDateModelConfig: DynamicDatePickerModelConfig = this.initModel(null, label); const inputDateModelConfig: DynamicDsDateControlModelConfig = this.initModel(null, false, true);
inputDateModelConfig.legend = this.configData.label;
inputDateModelConfig.toggleIcon = 'fas fa-calendar'; inputDateModelConfig.toggleIcon = 'fas fa-calendar';
this.setValues(inputDateModelConfig as any, fieldValue); this.setValues(inputDateModelConfig as any, fieldValue);