TSK-1276: Added radio buttons for selection of classification types

This commit is contained in:
Tristan Eisermann 2020-06-08 18:53:29 +02:00 committed by Tristan2357
parent 2665bd58eb
commit f749c8d272
7 changed files with 21 additions and 18 deletions

View File

@ -10,6 +10,7 @@ import { TreeModule } from 'angular-tree-component';
import { ClassificationTypesSelectorComponent } from 'app/administration/components/classification-types-selector/classification-types-selector.component';
import { ClassificationCategoriesService } from 'app/shared/services/classification-categories/classification-categories.service';
import { AccessItemsManagementComponent } from 'app/administration/components/access-items-management/access-items-management.component';
import { MatRadioModule } from '@angular/material/radio';
import { AdministrationRoutingModule } from './administration-routing.module';
/**
* Components
@ -61,7 +62,10 @@ const DECLARATIONS = [
@NgModule({
declarations: DECLARATIONS,
imports: MODULES,
imports: [
MODULES,
MatRadioModule
],
providers: [
ClassificationDefinitionService,
WorkbasketDefinitionService,

View File

@ -21,6 +21,7 @@ import { configureTests } from 'app/app.test.configuration';
import { TreeService } from 'app/shared/services/tree/tree.service';
import { ImportExportService } from 'app/administration/services/import-export.service';
import { NgxsModule } from '@ngxs/store';
import { MatRadioModule } from '@angular/material/radio';
import { ClassificationListComponent } from './classification-list.component';
import { NotificationService } from '../../../shared/services/notifications/notification.service';
@ -46,7 +47,7 @@ describe('ClassificationListComponent', () => {
testBed.configureTestingModule({
declarations: [ClassificationListComponent, ImportExportComponent, ClassificationTypesSelectorComponent,
DummyDetailComponent],
imports: [HttpClientModule, RouterTestingModule.withRoutes(routes), FormsModule, AngularSvgIconModule, NgxsModule.forRoot()],
imports: [HttpClientModule, RouterTestingModule.withRoutes(routes), FormsModule, AngularSvgIconModule, NgxsModule.forRoot(), MatRadioModule],
providers: [
HttpClient, WorkbasketDefinitionService, NotificationService,
ClassificationsService, DomainService, ClassificationDefinitionService,

View File

@ -5,15 +5,11 @@
<span class="caret"></span>
<span class="sr-only">Toggle Dropdown</span>
</button>
<div class="dropdown-menu dropdown-menu-right sortby-dropdown popup" aria-labelledby="sortingDropdown">
<li *ngFor="let classificationType of classificationTypes$ | async">
<a (click)="select(classificationType)">
<label>
<span data-toggle="tooltip" class="material-icons md-20 blue">{{(classificationTypeSelected$ | async) === classificationType?
'check_box': 'check_box_outline_blank'}}</span>
<span>{{classificationType}}</span>
</label>
</a>
</li>
<div class="dropdown-menu dropdown-menu-right popup" aria-labelledby="sortingDropdown">
<mat-radio-group name="classificationTypeSelector" color="accent" class="radio-group">
<mat-radio-button *ngFor="let classificationType of classificationTypes$ | async"
name="classificationTypeSelector" id="select-{{classificationType}}" [checked]="classificationType === (classificationTypeSelected$ | async)"
(change)="select(classificationType)" [value]="classificationType">{{classificationType}}</mat-radio-button>
</mat-radio-group>
</div>
</div>
</div>

View File

@ -0,0 +1,5 @@
.radio-group {
display: flex;
flex-direction: column;
margin: 0.5rem 2.5rem;
}

View File

@ -1,6 +1,7 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { NgxsModule } from '@ngxs/store';
import { MatRadioModule } from '@angular/material/radio';
import { ClassificationTypesSelectorComponent } from './classification-types-selector.component';
describe('ClassificationTypesSelectorComponent', () => {
@ -9,7 +10,7 @@ describe('ClassificationTypesSelectorComponent', () => {
beforeEach(async(() => {
TestBed.configureTestingModule({
imports: [NgxsModule.forRoot()],
imports: [NgxsModule.forRoot(), MatRadioModule],
declarations: [ClassificationTypesSelectorComponent],
providers: []
}).compileComponents();

View File

@ -31,7 +31,6 @@
<mat-radio-button *ngFor="let sortingField of sortingFields | mapValues"
name="sort" id="sort-by-{{sortingField.key}}" [checked]="sortingField.key === defaultSortBy"
(change)="changeSortBy(sortingField.key)" [value]="sortingField.value"> {{ sortingField.value }}</mat-radio-button>
<!--TODO make sortingby the default checked and change theme colors to use taskana colors-->
</mat-radio-group>
</div>
</div>

View File

@ -2,9 +2,6 @@
min-width: 200px;
}
ul {
list-style-type: none;
}
.bold-blue {
color: #337ab7;
font-weight: bold;