fix: Display issues

This commit is contained in:
Jose Alberto Hernandez
2025-06-06 21:59:57 -05:00
parent 1d6b6fd743
commit 0293807877
18 changed files with 431 additions and 2116 deletions
@@ -2,8 +2,8 @@
<mat-card>
<form [formGroup]="reportForm" (ngSubmit)="submit()">
<mat-card-content>
<div class="layout-row-wrap responsive-column gap-4percent">
<mat-form-field class="flex-30">
<div class="layout-row-wrap responsive-column">
<mat-form-field class="flex-100">
<mat-label>{{ 'labels.inputs.Report Name' | translate }}</mat-label>
<input matInput required formControlName="reportName" />
<mat-error *ngIf="reportForm.controls.reportName.hasError('required')">
@@ -12,7 +12,7 @@
</mat-error>
</mat-form-field>
<mat-form-field class="flex-30">
<mat-form-field class="flex-50">
<mat-label>{{ 'labels.inputs.Report Type' | translate }}</mat-label>
<mat-select required formControlName="reportType">
<mat-option
@@ -28,7 +28,7 @@
</mat-error>
</mat-form-field>
<mat-form-field class="flex-30">
<mat-form-field class="flex-50">
<mat-label>{{ 'labels.inputs.Report Sub Type' | translate }}</mat-label>
<mat-select formControlName="reportSubType">
<mat-option
@@ -39,10 +39,8 @@
</mat-option>
</mat-select>
</mat-form-field>
</div>
<div class="layout-row-wrap responsive-column gap-4percent">
<mat-form-field class="flex-40">
<mat-form-field class="flex-50">
<mat-label>{{ 'labels.inputs.Report Category' | translate }}</mat-label>
<mat-select formControlName="reportCategory">
<mat-option *ngFor="let reportCategoryType of reportCategoryTypeOptions" [value]="reportCategoryType">
@@ -51,15 +49,13 @@
</mat-select>
</mat-form-field>
<div class="user-report-wrapper flex-10">
<div class="user-report-wrapper flex-50">
<mat-checkbox class="user-report" labelPosition="after" formControlName="useReport">
{{ 'labels.inputs.User Report (UI)' | translate }}
</mat-checkbox>
</div>
</div>
<div class="layout-column">
<mat-form-field class="flex-98">
<mat-form-field class="flex-100">
<mat-label>{{ 'labels.inputs.Description' | translate }}</mat-label>
<textarea matInput formControlName="description" cdkTextareaAutosize cdkAutosizeMinRows="2"></textarea>
</mat-form-field>
@@ -129,7 +129,8 @@ export class CreateReportComponent implements OnInit {
this.dataForDialog.parameterName = undefined;
this.dataForDialog.reportParameterName = undefined;
const addReportParameterDialogRef = this.dialog.open(ReportParameterDialogComponent, {
data: this.dataForDialog
data: { ...this.dataForDialog, layout: { addButtonText: 'Add' } },
width: '25rem'
});
addReportParameterDialogRef.afterClosed().subscribe((response: any) => {
if (response !== '') {
@@ -2,8 +2,8 @@
<mat-card>
<form [formGroup]="reportForm" (ngSubmit)="submit()">
<mat-card-content>
<div class="layout-row-wrap responsive-column gap-4percent">
<mat-form-field class="flex-30">
<div class="layout-row-wrap responsive-column">
<mat-form-field class="flex-100">
<mat-label>{{ 'labels.inputs.Report Name' | translate }}</mat-label>
<input matInput required formControlName="reportName" />
<mat-error *ngIf="reportForm.controls.reportName.hasError('required')">
@@ -12,7 +12,7 @@
</mat-error>
</mat-form-field>
<mat-form-field class="flex-30">
<mat-form-field class="flex-50">
<mat-label>{{ 'labels.inputs.Report Type' | translate }}</mat-label>
<mat-select required formControlName="reportType">
<mat-option *ngFor="let allowedReportType of reportData.allowedReportTypes" [value]="allowedReportType">
@@ -25,7 +25,7 @@
</mat-error>
</mat-form-field>
<mat-form-field class="flex-30">
<mat-form-field class="flex-50">
<mat-label>{{ 'labels.inputs.Report Sub Type' | translate }}</mat-label>
<mat-select formControlName="reportSubType">
<mat-option
@@ -36,10 +36,8 @@
</mat-option>
</mat-select>
</mat-form-field>
</div>
<div class="layout-row-wrap responsive-column gap-4percent">
<mat-form-field class="flex-40">
<mat-form-field class="flex-50">
<mat-label>{{ 'labels.inputs.Report Category' | translate }}</mat-label>
<mat-select formControlName="reportCategory">
<mat-option *ngFor="let reportCategoryType of reportCategoryTypeOptions" [value]="reportCategoryType">
@@ -48,15 +46,13 @@
</mat-select>
</mat-form-field>
<div class="user-report-wrapper flex-10">
<div class="flex-50">
<mat-checkbox class="user-report" labelPosition="after" formControlName="useReport">
{{ 'labels.inputs.User Report (UI)' | translate }}
</mat-checkbox>
</div>
</div>
<div class="layout-column">
<mat-form-field class="flex-98">
<mat-form-field class="flex-100">
<mat-label>{{ 'labels.inputs.Description' | translate }}</mat-label>
<textarea matInput formControlName="description" cdkTextareaAutosize cdkAutosizeMinRows="2"></textarea>
</mat-form-field>
@@ -14,7 +14,11 @@
<div class="container">
<mat-card>
<mat-card-title>{{ reportData.reportName }}</mat-card-title>
<mat-card-title class="layout-row-wrap flex-100">
<div class="flex-100 report-name">
{{ 'labels.catalogs.Report' | translate }} : <b>{{ reportData.reportName }}</b>
</div>
</mat-card-title>
<mat-card-content>
<div class="layout-row-wrap">
@@ -8,3 +8,7 @@
}
}
}
.report-name {
margin: 18px;
}