TSK-1043: Fix access-items table width

This commit is contained in:
Sofie Hofmann 2021-01-26 12:47:24 +01:00
parent e8e976de0c
commit 5f94d31056
8 changed files with 19 additions and 13 deletions

View File

@ -39,7 +39,8 @@ const classificationServiceSpy = jest.fn().mockImplementation(
); );
const domainServiceSpy = jest.fn().mockImplementation( const domainServiceSpy = jest.fn().mockImplementation(
(): Partial<DomainService> => ({ (): Partial<DomainService> => ({
getSelectedDomainValue: jest.fn().mockReturnValue(of()) getSelectedDomainValue: jest.fn().mockReturnValue(of()),
getSelectedDomain: jest.fn().mockReturnValue(of('A'))
}) })
); );

View File

@ -9,8 +9,8 @@
&__typeahead { &__typeahead {
text-align: left; text-align: left;
min-width: 180px; min-width: 124px;
width: calc(100% + 20px); max-width: 124px;
line-height: 20px; line-height: 20px;
padding-bottom: 0% !important; padding-bottom: 0% !important;
margin-top: 5px; margin-top: 5px;

View File

@ -37,6 +37,7 @@ import { MatInputModule } from '@angular/material/input';
import { MatProgressBarModule } from '@angular/material/progress-bar'; import { MatProgressBarModule } from '@angular/material/progress-bar';
import { MatCheckboxModule } from '@angular/material/checkbox'; import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatIconModule } from '@angular/material/icon'; import { MatIconModule } from '@angular/material/icon';
import { MatTooltipModule } from '@angular/material/tooltip';
@Component({ selector: 'taskana-shared-spinner', template: '' }) @Component({ selector: 'taskana-shared-spinner', template: '' })
class SpinnerStub { class SpinnerStub {
@ -93,7 +94,8 @@ describe('WorkbasketAccessItemsComponent', () => {
MatAutocompleteModule, MatAutocompleteModule,
MatProgressBarModule, MatProgressBarModule,
MatCheckboxModule, MatCheckboxModule,
MatIconModule MatIconModule,
MatTooltipModule
], ],
declarations: [WorkbasketAccessItemsComponent, TypeAheadComponent, SpinnerStub], declarations: [WorkbasketAccessItemsComponent, TypeAheadComponent, SpinnerStub],
providers: [ providers: [

View File

@ -101,10 +101,10 @@ export class WorkbasketAccessItemsComponent implements OnInit, OnChanges, OnDest
ngOnInit() { ngOnInit() {
this.init(); this.init();
this.customFields$ = this.accessItemsCustomization$.pipe(getCustomFields(customFieldCount)); this.customFields$ = this.accessItemsCustomization$.pipe(getCustomFields(customFieldCount));
this.customFields$.subscribe((v) => { this.customFields$.pipe(takeUntil(this.destroy$)).subscribe((v) => {
this.customFields = v; this.customFields = v;
}); });
this.accessItemsRepresentation$.subscribe((accessItemsRepresentation) => { this.accessItemsRepresentation$.pipe(takeUntil(this.destroy$)).subscribe((accessItemsRepresentation) => {
if (typeof accessItemsRepresentation !== 'undefined') { if (typeof accessItemsRepresentation !== 'undefined') {
this.accessItemsRepresentation = { ...accessItemsRepresentation }; this.accessItemsRepresentation = { ...accessItemsRepresentation };
this.setAccessItemsGroups(accessItemsRepresentation.accessItems); this.setAccessItemsGroups(accessItemsRepresentation.accessItems);
@ -142,7 +142,7 @@ export class WorkbasketAccessItemsComponent implements OnInit, OnChanges, OnDest
} }
ngAfterViewInit() { ngAfterViewInit() {
this.inputs.changes.subscribe((next) => { this.inputs.changes.pipe(takeUntil(this.destroy$)).subscribe((next) => {
if (typeof next.last !== 'undefined') { if (typeof next.last !== 'undefined') {
if (this.added) next.last.nativeElement.focus(); if (this.added) next.last.nativeElement.focus();
} }

View File

@ -39,6 +39,7 @@ import { MatFormFieldModule } from '@angular/material/form-field';
import { MatSelectModule } from '@angular/material/select'; import { MatSelectModule } from '@angular/material/select';
import { MatInputModule } from '@angular/material/input'; import { MatInputModule } from '@angular/material/input';
import { MatAutocompleteModule } from '@angular/material/autocomplete'; import { MatAutocompleteModule } from '@angular/material/autocomplete';
import { MatTooltipModule } from '@angular/material/tooltip';
@Component({ selector: 'taskana-shared-field-error-display', template: '' }) @Component({ selector: 'taskana-shared-field-error-display', template: '' })
class FieldErrorDisplayStub { class FieldErrorDisplayStub {
@ -112,7 +113,8 @@ describe('WorkbasketInformationComponent', () => {
MatFormFieldModule, MatFormFieldModule,
MatInputModule, MatInputModule,
MatSelectModule, MatSelectModule,
MatAutocompleteModule MatAutocompleteModule,
MatTooltipModule
], ],
declarations: [ declarations: [
WorkbasketInformationComponent, WorkbasketInformationComponent,

View File

@ -23,7 +23,8 @@ import { WorkbasketQueryFilterParameter } from '../../../shared/models/workbaske
const getDomainFn = jest.fn().mockReturnValue(true); const getDomainFn = jest.fn().mockReturnValue(true);
const domainServiceMock = jest.fn().mockImplementation( const domainServiceMock = jest.fn().mockImplementation(
(): Partial<DomainService> => ({ (): Partial<DomainService> => ({
getDomains: getDomainFn getDomains: getDomainFn,
getSelectedDomain: jest.fn().mockReturnValue(of('A'))
}) })
); );

View File

@ -6,10 +6,10 @@
</mat-label> </mat-label>
<input #inputTypeAhead [required]="isRequired" class="typeahead__form-input align" matInput type="text" <input #inputTypeAhead [required]="isRequired" class="typeahead__form-input align" matInput type="text"
[matAutocomplete]="auto" placeholder="{{placeHolderMessage}}" [(ngModel)]="value" name="accessId" [matAutocomplete]="auto" placeholder="{{placeHolderMessage}}" [(ngModel)]="value" name="accessId"
(ngModelChange)="initializeDataSource()" /> (ngModelChange)="initializeDataSource()" matTooltip="{{value}}"/>
<mat-autocomplete #autoComplete autoActiveFirstOption (optionSelected)="typeaheadOnSelect($event)" <mat-autocomplete #autoComplete autoActiveFirstOption (optionSelected)="typeaheadOnSelect($event)"
#auto="matAutocomplete"> #auto="matAutocomplete">
<mat-option class="typeahead__form-options" *ngFor="let item of items" [value]="item.accessId"> <mat-option class="typeahead__form-options" *ngFor="let item of items" [value]="item.accessId" matTooltip="{{item.accessId}} {{item.name}}">
<small>{{item.accessId}}&nbsp;&nbsp;{{item.name}}</small> <small>{{item.accessId}}&nbsp;&nbsp;{{item.name}}</small>
</mat-option> </mat-option>
</mat-autocomplete> </mat-autocomplete>

View File

@ -13,8 +13,7 @@ import { MatAutocompleteModule } from '@angular/material/autocomplete';
import { MatFormFieldModule } from '@angular/material/form-field'; import { MatFormFieldModule } from '@angular/material/form-field';
import { MatInputModule } from '@angular/material/input'; import { MatInputModule } from '@angular/material/input';
import { FormsModule } from '@angular/forms'; import { FormsModule } from '@angular/forms';
import { compileComponentFromMetadata, componentFactoryName } from '@angular/compiler'; import { MatTooltipModule } from '@angular/material/tooltip';
import { AccessIdDefinition } from 'app/shared/models/access-id';
const AccessIdsServiceSpy = jest.fn().mockImplementation( const AccessIdsServiceSpy = jest.fn().mockImplementation(
(): Partial<AccessIdsService> => ({ (): Partial<AccessIdsService> => ({
@ -40,6 +39,7 @@ describe('TypeAheadComponent', () => {
MatAutocompleteModule, MatAutocompleteModule,
MatFormFieldModule, MatFormFieldModule,
MatInputModule, MatInputModule,
MatTooltipModule,
FormsModule, FormsModule,
BrowserAnimationsModule BrowserAnimationsModule
], ],