hardi
/
opt-cc
1
0
Fork 0
Code Pull Requests Releases 47 Activity

Add material button toggle to user management

pull/40/head
HardiReady 2018-07-03 20:42:10 +02:00
parent eebcbc32a5
commit 0aefb9c6d9
3 changed files with 18 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
static/src/app/users/user-list/user-list.component.html
View File

@ -1,10 +1,16 @@
<div class="select-list"> <div class="select-list">
<div class="input-group list-header pull-left"> <div class="input-group list-header pull-left">
<div class="btn-group" (click)="filterUsers()"> <mat-button-toggle-group #group="matButtonToggleGroup">
<label class="btn btn-success" [(ngModel)]="radioModel" btnRadio="BLUFOR" uncheckable>{{fraction.BLUFOR}}</label> <mat-button-toggle value="BLUFOR" (change)="filterUsers(undefined, group)">
<label class="btn btn-success" [(ngModel)]="radioModel" btnRadio="OPFOR" uncheckable>{{fraction.OPFOR}}</label> {{fraction.BLUFOR}}
<label class="btn btn-success" [(ngModel)]="radioModel" btnRadio="UNASSIGNED" uncheckable>Ohne Squad</label> </mat-button-toggle>
</div> <mat-button-toggle value="OPFOR" (change)="filterUsers(undefined, group)">
{{fraction.OPFOR}}
</mat-button-toggle>
<mat-button-toggle value="UNASSIGNED" (change)="filterUsers(undefined, group)">
Ohne Squad
</mat-button-toggle>
</mat-button-toggle-group>
<a class="pull-right btn btn-success" (click)="openNewUserForm()">+</a> <a class="pull-right btn btn-success" (click)="openNewUserForm()">+</a>
</div> </div>

7
static/src/app/users/user-list/user-list.component.ts
View File

@ -8,6 +8,8 @@ import {UserService} from '../../services/army-management/user.service';
import {User} from '../../models/model-interfaces'; import {User} from '../../models/model-interfaces';
import {ADD, LOAD} from '../../services/stores/user.store'; import {ADD, LOAD} from '../../services/stores/user.store';
import {Fraction} from '../../utils/fraction.enum'; import {Fraction} from '../../utils/fraction.enum';
import {MatButtonToggleGroup} from '@angular/material';
import {UIHelpers} from '../../utils/global.helpers';
@Component({ @Component({
selector: 'squad-list', selector: 'squad-list',
@ -22,7 +24,7 @@ export class UserListComponent implements OnInit {
searchTerm = new FormControl(); searchTerm = new FormControl();
public radioModel: string; radioModel: string = '';
throttle = 300; throttle = 300;
@ -80,11 +82,12 @@ export class UserListComponent implements OnInit {
} }
} }
filterUsers(action?) { filterUsers(action?, group?:MatButtonToggleGroup) {
if (!action || action === LOAD) { if (!action || action === LOAD) {
this.offset = 0; this.offset = 0;
this.limit = 20; this.limit = 20;
} }
this.radioModel = UIHelpers.toggleReleaseButton(this.radioModel, group);
return this.users$ = this.userService.findUsers(this.searchTerm.value, this.radioModel, return this.users$ = this.userService.findUsers(this.searchTerm.value, this.radioModel,
null, this.limit, this.offset, action); null, this.limit, this.offset, action);
} }

4
static/src/app/users/users.module.ts
View File

@ -2,12 +2,12 @@ import {NgModule} from '@angular/core';
import {usersRouterModule, usersRoutingComponents} from './users.routing'; import {usersRouterModule, usersRoutingComponents} from './users.routing';
import {CommonModule} from '@angular/common'; import {CommonModule} from '@angular/common';
import {SharedModule} from '../shared.module'; import {SharedModule} from '../shared.module';
import {ButtonsModule} from 'ngx-bootstrap';
import {InfiniteScrollModule} from 'ngx-infinite-scroll'; import {InfiniteScrollModule} from 'ngx-infinite-scroll';
import {MatButtonToggleModule} from '@angular/material';
@NgModule({ @NgModule({
declarations: usersRoutingComponents, declarations: usersRoutingComponents,
imports: [CommonModule, SharedModule, ButtonsModule.forRoot(), InfiniteScrollModule, usersRouterModule], imports: [CommonModule, SharedModule, MatButtonToggleModule, InfiniteScrollModule, usersRouterModule],
}) })
export class UsersModule { export class UsersModule {
static routes = usersRouterModule; static routes = usersRouterModule;