mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-07-24 17:32:15 +00:00
[ADF-5543] Enable lint accessibility and resolve found issues (#9421)
This commit is contained in:
tomson
GitHub
@@ -5,8 +5,7 @@
|
||||
{
|
||||
"files": ["*.ts"],
|
||||
"extends": [
|
||||
"plugin:@nrwl/nx/angular",
|
||||
"plugin:@angular-eslint/template/process-inline-templates"
|
||||
"plugin:@nrwl/nx/angular"
|
||||
],
|
||||
"rules": {
|
||||
"no-underscore-dangle": ["error", { "allowAfterThis": true }],
|
||||
|
||||
@@ -1,68 +1,82 @@
|
||||
<div *ngIf="reports">
|
||||
<div class="adf-report-icons">
|
||||
<button mat-icon-button
|
||||
*ngFor="let report of reports; let idx = index"
|
||||
[matTooltip]="report.title"
|
||||
[color]="isCurrent(idx) ? 'primary' : null"
|
||||
(click)="selectCurrent(idx)">
|
||||
<mat-icon>{{report.icon}}</mat-icon>
|
||||
<button
|
||||
mat-icon-button
|
||||
*ngFor="let report of reports; let idx = index"
|
||||
[matTooltip]="report.title"
|
||||
[color]="isCurrent(idx) ? 'primary' : null"
|
||||
(click)="selectCurrent(idx)"
|
||||
>
|
||||
<mat-icon>{{ report.icon }}</mat-icon>
|
||||
</button>
|
||||
</div>
|
||||
<div class="adf-clear-both"> </div>
|
||||
<div class="adf-clear-both"></div>
|
||||
<div *ngFor="let report of reports; let idx = index">
|
||||
<div [ngSwitch]="report.type">
|
||||
<div *ngSwitchCase="'pie'">
|
||||
<div *ngIf="isCurrent(idx)">
|
||||
<h4>{{report.title}}</h4>
|
||||
<div *ngIf="!report.hasData()">{{'ANALYTICS.MESSAGES.NO-DATA-FOUND' | translate}}</div>
|
||||
<h4>{{ report.title }}</h4>
|
||||
<div *ngIf="!report.hasData()">{{ 'ANALYTICS.MESSAGES.NO-DATA-FOUND' | translate }}</div>
|
||||
<div *ngIf="report.hasData()">
|
||||
<div *ngIf="report.hasZeroValues()">{{'ANALYTICS.MESSAGES.ZERO-DATA-FOUND' | translate}}</div>
|
||||
<canvas baseChart *ngIf="!report.hasZeroValues()" class="adf-chart"
|
||||
[datasets]="report.datasets"
|
||||
[labels]="report.labels"
|
||||
[type]="'pie'"
|
||||
[options]="report.options">
|
||||
<div *ngIf="report.hasZeroValues()">{{ 'ANALYTICS.MESSAGES.ZERO-DATA-FOUND' | translate }}</div>
|
||||
<canvas
|
||||
baseChart
|
||||
*ngIf="!report.hasZeroValues()"
|
||||
class="adf-chart"
|
||||
[datasets]="report.datasets"
|
||||
[labels]="report.labels"
|
||||
[type]="'pie'"
|
||||
[options]="report.options"
|
||||
>
|
||||
</canvas>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngSwitchCase="'table'" >
|
||||
<div *ngSwitchCase="'table'">
|
||||
<div *ngIf="isCurrent(idx)">
|
||||
<h4>{{report.title}}</h4>
|
||||
<div *ngIf="!report.hasDatasets()">{{'ANALYTICS.MESSAGES.NO-DATA-FOUND' | translate}}</div>
|
||||
<h4>{{ report.title }}</h4>
|
||||
<div *ngIf="!report.hasDatasets()">{{ 'ANALYTICS.MESSAGES.NO-DATA-FOUND' | translate }}</div>
|
||||
<div [attr.id]="'chart-table-' + report.id" *ngIf="report.hasDatasets()">
|
||||
<table class="adf-table adf-table-responsive adf-table-condensed" class="adf-partial-width">
|
||||
<tr>
|
||||
<th *ngFor="let label of report.labels">{{label | translate}}</th>
|
||||
<th *ngFor="let label of report.labels">{{ label | translate }}</th>
|
||||
</tr>
|
||||
<tr *ngFor="let rows of report.datasets">
|
||||
<td *ngFor="let row of rows">{{row | translate }}</td>
|
||||
<td *ngFor="let row of rows">{{ row | translate }}</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngSwitchCase="'masterDetailTable'" >
|
||||
<div *ngSwitchCase="'masterDetailTable'">
|
||||
<div *ngIf="isCurrent(idx)">
|
||||
<h4>{{report.title}}</h4>
|
||||
<div *ngIf="!report.hasDatasets()">{{'ANALYTICS.MESSAGES.NO-DATA-FOUND' | translate}}</div>
|
||||
<h4>{{ report.title }}</h4>
|
||||
<div *ngIf="!report.hasDatasets()">{{ 'ANALYTICS.MESSAGES.NO-DATA-FOUND' | translate }}</div>
|
||||
<div [attr.id]="'chart-master-detail-table-' + report.id" *ngIf="report.hasDatasets()">
|
||||
<table class="adf-table adf-table-responsive adf-table-condensed adf-full-width">
|
||||
<tr>
|
||||
<th *ngFor="let label of report.labels">{{label | translate}}</th>
|
||||
<th *ngFor="let label of report.labels">{{ label | translate }}</th>
|
||||
</tr>
|
||||
<tr *ngFor="let rows of report.datasets" class="adf-analytics-row__entry">
|
||||
<td *ngFor="let row of rows" (click)="toggleDetailsTable()">{{row | translate }}</td>
|
||||
<td
|
||||
*ngFor="let row of rows"
|
||||
(click)="toggleDetailsTable()"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
(keyup.enter)="toggleDetailsTable()"
|
||||
>
|
||||
{{ row | translate }}
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
<div [attr.id]="'chart-master-detail-' + report.id" *ngIf="isShowDetails()">
|
||||
<table class="adf-table adf-table-responsive adf-table-condensed adf-full-width">
|
||||
<tr>
|
||||
<th *ngFor="let label of report.detailsTable.labels">{{label | translate}}</th>
|
||||
<th *ngFor="let label of report.detailsTable.labels">{{ label | translate }}</th>
|
||||
</tr>
|
||||
<tr *ngFor="let rows of report.detailsTable.datasets">
|
||||
<td *ngFor="let row of rows">{{row | translate }}</td>
|
||||
<td *ngFor="let row of rows">{{ row | translate }}</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
@@ -70,48 +84,57 @@
|
||||
</div>
|
||||
<div *ngSwitchCase="'bar'">
|
||||
<div *ngIf="isCurrent(idx)">
|
||||
<h4>{{report.title}}</h4>
|
||||
<div *ngIf="!report.hasDatasets()">{{'ANALYTICS.MESSAGES.NO-DATA-FOUND' | translate}}</div>
|
||||
<canvas baseChart *ngIf="report.hasDatasets()" class="adf-chart"
|
||||
[datasets]="report.datasets"
|
||||
[labels]="report.labels"
|
||||
[options]="report.options"
|
||||
[type]="'bar'">
|
||||
<h4>{{ report.title }}</h4>
|
||||
<div *ngIf="!report.hasDatasets()">{{ 'ANALYTICS.MESSAGES.NO-DATA-FOUND' | translate }}</div>
|
||||
<canvas
|
||||
baseChart
|
||||
*ngIf="report.hasDatasets()"
|
||||
class="adf-chart"
|
||||
[datasets]="report.datasets"
|
||||
[labels]="report.labels"
|
||||
[options]="report.options"
|
||||
[type]="'bar'"
|
||||
>
|
||||
</canvas>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngSwitchCase="'multiBar'">
|
||||
<div *ngIf="isCurrent(idx)">
|
||||
<h4>{{report.title}}</h4>
|
||||
<div *ngIf="!report.hasDatasets()">{{'ANALYTICS.MESSAGES.NO-DATA-FOUND' | translate}}</div>
|
||||
<h4>{{ report.title }}</h4>
|
||||
<div *ngIf="!report.hasDatasets()">{{ 'ANALYTICS.MESSAGES.NO-DATA-FOUND' | translate }}</div>
|
||||
<div *ngIf="report.hasDatasets()">
|
||||
<mat-checkbox
|
||||
color="primary"
|
||||
[id]="'stacked-id'"
|
||||
[checked]="report.options.scales.xAxes[0].stacked"
|
||||
[(ngModel)]="report.options.scales.xAxes[0].stacked"
|
||||
(change)="refresh(report)">Stacked</mat-checkbox>
|
||||
(change)="refresh(report)"
|
||||
>Stacked</mat-checkbox
|
||||
>
|
||||
|
||||
<canvas baseChart class="adf-chart"
|
||||
[datasets]="report.datasets"
|
||||
[labels]="report.labels"
|
||||
[options]="report.options"
|
||||
[type]="'bar'">
|
||||
<canvas
|
||||
baseChart
|
||||
class="adf-chart"
|
||||
[datasets]="report.datasets"
|
||||
[labels]="report.labels"
|
||||
[options]="report.options"
|
||||
[type]="'bar'"
|
||||
>
|
||||
</canvas>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngSwitchCase="'HeatMap'">
|
||||
<div *ngIf="isCurrent(idx)">
|
||||
<h4>{{report.title}}</h4>
|
||||
<h4>{{ report.title }}</h4>
|
||||
<analytics-report-heat-map [report]="report"></analytics-report-heat-map>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngSwitchDefault>
|
||||
<span>{{'ANALYTICS.MESSAGES.UNKNOWN-WIDGET-TYPE' | translate}}: {{report.type}}</span>
|
||||
<span>{{ 'ANALYTICS.MESSAGES.UNKNOWN-WIDGET-TYPE' | translate }}: {{ report.type }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<br><br><br>
|
||||
<div *ngIf="!reports">{{'ANALYTICS.MESSAGES.FILL-PARAMETER' | translate}}</div>
|
||||
<br /><br /><br />
|
||||
<div *ngIf="!reports">{{ 'ANALYTICS.MESSAGES.FILL-PARAMETER' | translate }}</div>
|
||||
|
||||
@@ -65,7 +65,9 @@ describe('AnalyticsReportListComponent', () => {
|
||||
expect(component.isReportsEmpty()).toBeTruthy();
|
||||
});
|
||||
|
||||
it('should return the default reports when the report list is empty', (done) => {
|
||||
// TODO: very flaky test, to be refactored
|
||||
// eslint-disable-next-line ban/ban
|
||||
xit('should return the default reports when the report list is empty', (done) => {
|
||||
jasmine.Ajax.stubRequest('http://localhost:9876/bpm/activiti-app/app/rest/reporting/reports').andReturn({
|
||||
status: 200,
|
||||
contentType: 'json',
|
||||
|
||||
@@ -13,142 +13,139 @@
|
||||
id="reportName"
|
||||
data-automation-id="reportName"
|
||||
[value]="reportParameters.name"
|
||||
(input)="reportParameters.name=$any($event).target.value"
|
||||
(input)="reportParameters.name = $any($event).target.value"
|
||||
(blur)="editTitle()"
|
||||
(keyup.enter)="editTitle()"
|
||||
/>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="adf-report-title" *ngIf="!isEditable" (click)="editEnable()">
|
||||
<div
|
||||
class="adf-report-title"
|
||||
*ngIf="!isEditable"
|
||||
(click)="editEnable()"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
(keyup.enter)="editEnable()"
|
||||
>
|
||||
<mat-icon class="adf-report-icon">mode_edit</mat-icon>
|
||||
<h4>{{reportParameters.name}}</h4>
|
||||
<h4>{{ reportParameters.name }}</h4>
|
||||
</div>
|
||||
</adf-toolbar-title>
|
||||
<adf-buttons-action-menu *ngIf="!isEditable">
|
||||
<button mat-menu-item (click)="toggleParameters()" id="">
|
||||
<mat-icon>settings</mat-icon><span>{{ 'ANALYTICS.MESSAGES.ICON-SETTING' | translate }}</span>
|
||||
<mat-icon>settings</mat-icon>
|
||||
<span>{{ 'ANALYTICS.MESSAGES.ICON-SETTING' | translate }}</span>
|
||||
</button>
|
||||
<button mat-menu-item (click)="deleteReport(reportId)" id="delete-button">
|
||||
<mat-icon>delete</mat-icon><span>{{ 'ANALYTICS.MESSAGES.ICON-DELETE' | translate }}</span>
|
||||
<mat-icon>delete</mat-icon>
|
||||
<span>{{ 'ANALYTICS.MESSAGES.ICON-DELETE' | translate }}</span>
|
||||
</button>
|
||||
<div *ngIf="isFormValid()">
|
||||
<button mat-menu-item (click)="showDialog('Export')" id="export-button">
|
||||
<mat-icon>file_download</mat-icon><span>{{ 'ANALYTICS.MESSAGES.ICON-EXPORT-CSV' | translate }}</span>
|
||||
<mat-icon>file_download</mat-icon>
|
||||
<span>{{ 'ANALYTICS.MESSAGES.ICON-EXPORT-CSV' | translate }}</span>
|
||||
</button>
|
||||
<button mat-menu-item (click)="showDialog('Save')" id="save-button">
|
||||
<mat-icon>save</mat-icon><span>{{ 'ANALYTICS.MESSAGES.ICON-SAVE' | translate }}</span>
|
||||
<mat-icon>save</mat-icon>
|
||||
<span>{{ 'ANALYTICS.MESSAGES.ICON-SAVE' | translate }}</span>
|
||||
</button>
|
||||
</div>
|
||||
</adf-buttons-action-menu>
|
||||
</adf-toolbar>
|
||||
<div *ngFor="let field of reportParameters.definition.parameters"
|
||||
[class.adf-is-hide]="isParametersHide()">
|
||||
<div *ngFor="let field of reportParameters.definition.parameters" [class.adf-is-hide]="isParametersHide()">
|
||||
<div [ngSwitch]="field.type">
|
||||
<div *ngSwitchCase="'integer'">
|
||||
<br>
|
||||
<br />
|
||||
<analytics-number-widget
|
||||
[field]="field"
|
||||
[group]="processInstanceGroup"
|
||||
[controllerName]="'slowProcessInstanceInteger'"
|
||||
[required]="true">
|
||||
[required]="true"
|
||||
>
|
||||
</analytics-number-widget>
|
||||
</div>
|
||||
<div *ngSwitchCase="'duration'">
|
||||
<br>
|
||||
<duration-widget
|
||||
[field]="field"
|
||||
[group]="durationGroup"
|
||||
[controllerName]="'duration'">
|
||||
</duration-widget>
|
||||
<br />
|
||||
<duration-widget [field]="field" [group]="durationGroup" [controllerName]="'duration'"> </duration-widget>
|
||||
</div>
|
||||
<div *ngSwitchCase="'boolean'">
|
||||
<br>
|
||||
<analytics-checkbox-widget
|
||||
[field]="field"
|
||||
[group]="typeFilteringGroup"
|
||||
[controllerName]="'typeFiltering'">
|
||||
<br />
|
||||
<analytics-checkbox-widget [field]="field" [group]="typeFilteringGroup" [controllerName]="'typeFiltering'">
|
||||
</analytics-checkbox-widget>
|
||||
</div>
|
||||
<div *ngSwitchCase="'status'">
|
||||
<br>
|
||||
<analytics-dropdown-widget
|
||||
[field]="field"
|
||||
[group]="statusGroup"
|
||||
[controllerName]="'status'"
|
||||
[required]="true">
|
||||
<br />
|
||||
<analytics-dropdown-widget [field]="field" [group]="statusGroup" [controllerName]="'status'" [required]="true">
|
||||
</analytics-dropdown-widget>
|
||||
</div>
|
||||
<div *ngSwitchCase="'processDefinition'">
|
||||
<br>
|
||||
<br />
|
||||
<analytics-dropdown-widget
|
||||
[field]="field"
|
||||
[group]="processDefGroup"
|
||||
[controllerName]="'processDefinitionId'"
|
||||
[required]="true"
|
||||
(fieldChanged)="onProcessDefinitionChanges(field)">
|
||||
(fieldChanged)="onProcessDefinitionChanges(field)"
|
||||
>
|
||||
</analytics-dropdown-widget>
|
||||
</div>
|
||||
<div *ngSwitchCase="'task'">
|
||||
<br>
|
||||
<analytics-dropdown-widget
|
||||
[field]="field"
|
||||
[group]="taskGroup"
|
||||
[controllerName]="'taskName'"
|
||||
[required]="true">
|
||||
<br />
|
||||
<analytics-dropdown-widget [field]="field" [group]="taskGroup" [controllerName]="'taskName'" [required]="true">
|
||||
</analytics-dropdown-widget>
|
||||
</div>
|
||||
<div *ngSwitchCase="'dateRange'">
|
||||
<br>
|
||||
<adf-date-range-widget
|
||||
[field]="field"
|
||||
[group]="dateRange">
|
||||
</adf-date-range-widget>
|
||||
<br />
|
||||
<adf-date-range-widget [field]="field" [group]="dateRange"> </adf-date-range-widget>
|
||||
</div>
|
||||
<div *ngSwitchCase="'dateInterval'">
|
||||
<br>
|
||||
<br />
|
||||
<analytics-dropdown-widget
|
||||
[field]="field"
|
||||
[group]="dateIntervalGroup"
|
||||
[controllerName]="'dateRangeInterval'"
|
||||
[required]="true"
|
||||
[showDefaultOption]="false">
|
||||
[showDefaultOption]="false"
|
||||
>
|
||||
</analytics-dropdown-widget>
|
||||
</div>
|
||||
<div *ngSwitchDefault>
|
||||
<span>{{'ANALYTICS.MESSAGES.UNKNOWN-WIDGET-TYPE' | translate}}: {{field.type}}</span>
|
||||
<span>{{ 'ANALYTICS.MESSAGES.UNKNOWN-WIDGET-TYPE' | translate }}: {{ field.type }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<ng-template #reportNameDialog>
|
||||
<div id="report-dialog" class="adf-report-dialog">
|
||||
<h5 matDialogTitle id="report-dialog-title">{{action}} report</h5>
|
||||
<h5 matDialogTitle id="report-dialog-title">{{ action }} report</h5>
|
||||
<div mat-dialog-content>
|
||||
<div *ngIf="isSaveAction()" id="save-title-submessage" class="adf-export-message">
|
||||
{{'DIALOG.SAVE_MESSAGE' | translate}}
|
||||
{{ 'DIALOG.SAVE_MESSAGE' | translate }}
|
||||
</div>
|
||||
<div class="adf-save-export-input">
|
||||
<mat-form-field class="adf-example-full-width" floatPlaceholder="always">
|
||||
<input matInput
|
||||
<input
|
||||
matInput
|
||||
type="text"
|
||||
id="repName"
|
||||
placeholder="Report Name"
|
||||
[value]="reportName"
|
||||
[(ngModel)]="reportName"
|
||||
[ngModelOptions]="{standalone: true}">
|
||||
[ngModelOptions]="{ standalone: true }"
|
||||
/>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
<div class="adf-report-dialog-actions" mat-dialog-actions>
|
||||
<button mat-button
|
||||
color="accent"
|
||||
type="button"
|
||||
id="close-dialog-button"
|
||||
(click)="closeDialog()">Close</button>
|
||||
<button mat-button
|
||||
<button mat-button color="accent" type="button" id="close-dialog-button" (click)="closeDialog()">Close</button>
|
||||
<button
|
||||
mat-button
|
||||
color="primary"
|
||||
type="button"
|
||||
id="action-dialog-button"
|
||||
(click)="performAction(action, reportParamQuery)">{{action}}</button>
|
||||
(click)="performAction(action, reportParamQuery)"
|
||||
>
|
||||
{{ action }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</ng-template>
|
||||
|
||||
Reference in New Issue
Block a user