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

Add angular material and use snackbar for user edit success msg

pull/40/head
HardiReady 2018-06-29 22:20:30 +02:00
parent dd89fc7e5a
commit 10784f55f4
15 changed files with 117 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
static/package-lock.json generated
View File

@ -41,6 +41,14 @@
"tslib": "1.8.0"
}
},
"@angular/cdk": {
"version": "5.0.0",
"resolved": "https://registry.npmjs.org/@angular/cdk/-/cdk-5.0.0.tgz",
"integrity": "sha512-+u67Bns23tuCUGUCWhqkR/+onCwB4ObRURUv7ar2+BHw5VIvzML+IOCi1BJRF7gqvL+IVYQpLuY2cQh0J2SbBQ==",
"requires": {
"tslib": "1.8.0"
}
},
"@angular/cli": {
"version": "1.5.0",
"resolved": "https://registry.npmjs.org/@angular/cli/-/cli-1.5.0.tgz",
@ -156,6 +164,14 @@
"tslib": "1.8.0"
}
},
"@angular/material": {
"version": "5.0.0",
"resolved": "https://registry.npmjs.org/@angular/material/-/material-5.0.0.tgz",
"integrity": "sha512-rzF061r4aYgaf2WI12Jk0+Rd4c1VBObdeMDFWRa3XKIcvETtkz+DXFH1n+vIC4YabfPgrdJRPrzdrZ7fKhRz6g==",
"requires": {
"tslib": "1.8.0"
}
},
"@angular/platform-browser": {
"version": "5.0.1",
"resolved": "https://registry.npmjs.org/@angular/platform-browser/-/platform-browser-5.0.1.tgz",

2
static/package.json
View File

@ -16,6 +16,7 @@
},
"dependencies": {
"@angular/animations": "^5.0.0",
"@angular/cdk": "^5.0.0",
"@angular/cli": "^1.5.0",
"@angular/common": "^5.0.0",
"@angular/compiler": "^5.0.0",
@ -23,6 +24,7 @@
"@angular/core": "^5.0.0",
"@angular/forms": "^5.0.0",
"@angular/http": "^5.0.0",
"@angular/material": "^5.0.0",
"@angular/platform-browser": "^5.0.0",
"@angular/platform-browser-dynamic": "^5.0.0",
"@angular/router": "^5.0.0",

2
static/src/app/app.module.ts
View File

@ -11,7 +11,7 @@ import {DecorationService} from './services/army-management/decoration.service';
import {RankStore} from './services/stores/rank.store';
import {RankService} from './services/army-management/rank.service';
import {AppConfig} from './app.config';
import {LoginGuardAdmin, LoginGuardHL, LoginGuardSQL} from './login/login.guard';
import {LoginGuardAdmin, LoginGuardHL, LoginGuardSQL} from './login';
import {AwardingService} from './services/army-management/awarding.service';
import {HttpClient} from './services/http-client';
import {ArmyService} from './services/army-service/army.service';

52
static/src/app/common/modules/material-components.module.ts Normal file
View File

@ -0,0 +1,52 @@
/**
* Angular material imports
*/
import { NgModule } from '@angular/core';
import {
MatSidenavModule,
MatFormFieldModule,
MatInputModule,
MatButtonModule,
MatCheckboxModule,
MatTableModule,
MatPaginatorModule,
MatSortModule,
MatIconModule,
MatSnackBarModule,
MatToolbarModule,
MatExpansionModule
} from '@angular/material';
@NgModule({
imports: [
MatSidenavModule,
MatFormFieldModule,
MatInputModule,
MatButtonModule,
MatCheckboxModule,
MatTableModule,
MatPaginatorModule,
MatSortModule,
MatIconModule,
MatSnackBarModule,
MatToolbarModule,
MatExpansionModule
],
exports: [
MatSidenavModule,
MatFormFieldModule,
MatInputModule,
MatButtonModule,
MatCheckboxModule,
MatTableModule,
MatPaginatorModule,
MatSortModule,
MatIconModule,
MatSnackBarModule,
MatToolbarModule,
MatExpansionModule
]
})
export class MaterialComponentsModule {}

10
static/src/app/pub/decoration-overview/decoration-overview.component.ts
View File

@ -2,11 +2,11 @@ import {Component, Inject, OnDestroy, OnInit} from '@angular/core';
import {ActivatedRoute, Router} from '@angular/router';
import {DOCUMENT} from '@angular/common';
import {Fraction} from "../../utils/fraction.enum";
import {CSSHelpers} from "../../global.helpers";
import {RouteConfig} from "../../app.config";
import {Decoration} from "../../models/model-interfaces";
import {DecorationService} from "../../services/army-management/decoration.service";
import {Fraction} from '../../utils/fraction.enum';
import {CSSHelpers} from '../../global.helpers';
import {RouteConfig} from '../../app.config';
import {Decoration} from '../../models/model-interfaces';
import {DecorationService} from '../../services/army-management/decoration.service';
@Component({

4
static/src/app/pub/public.module.ts
View File

@ -3,8 +3,8 @@ import {SharedModule} from '../shared.module';
import {CommonModule} from '@angular/common';
import {RankService} from '../services/army-management/rank.service';
import {ButtonsModule} from 'ngx-bootstrap';
import {pubRouterModule, pubRoutingComponents} from "./public.routing";
import {DecorationService} from "../services/army-management/decoration.service";
import {pubRouterModule, pubRoutingComponents} from './public.routing';
import {DecorationService} from '../services/army-management/decoration.service';
@NgModule({
declarations: pubRoutingComponents,

10
static/src/app/pub/public.routing.ts
View File

@ -1,8 +1,8 @@
import {RouterModule, Routes} from "@angular/router";
import {RankOverviewComponent} from "./rank-overview/rank-overview.component";
import {ModuleWithProviders} from "@angular/core";
import {DecorationOverviewComponent} from "./decoration-overview/decoration-overview.component";
import {PublicComponent} from "./public.component";
import {RouterModule, Routes} from '@angular/router';
import {RankOverviewComponent} from './rank-overview/rank-overview.component';
import {ModuleWithProviders} from '@angular/core';
import {DecorationOverviewComponent} from './decoration-overview/decoration-overview.component';
import {PublicComponent} from './public.component';
export const publicRoutes: Routes = [
{

10
static/src/app/pub/rank-overview/rank-overview.component.ts
View File

@ -2,11 +2,11 @@ import {Component, Inject, OnDestroy, OnInit} from '@angular/core';
import {ActivatedRoute, Router} from '@angular/router';
import {DOCUMENT} from '@angular/common';
import {Fraction} from "../../utils/fraction.enum";
import {CSSHelpers} from "../../global.helpers";
import {RouteConfig} from "../../app.config";
import {Rank} from "../../models/model-interfaces";
import {RankService} from "../../services/army-management/rank.service";
import {Fraction} from '../../utils/fraction.enum';
import {CSSHelpers} from '../../global.helpers';
import {RouteConfig} from '../../app.config';
import {Rank} from '../../models/model-interfaces';
import {RankService} from '../../services/army-management/rank.service';
@Component({

9
static/src/app/shared.module.ts
View File

@ -2,11 +2,14 @@ import {NgModule} from '@angular/core';
import {FormsModule, ReactiveFormsModule} from '@angular/forms';
import {ShowErrorComponent} from './common/show-error/show-error.component';
import {CommonModule} from '@angular/common';
import {MaterialComponentsModule} from './common/modules/material-components.module';
import {SnackBarComponent} from './user-interface/snack-bar/snack-bar.component';
@NgModule({
declarations: [ShowErrorComponent],
imports: [CommonModule, FormsModule, ReactiveFormsModule],
exports: [FormsModule, ReactiveFormsModule, ShowErrorComponent]
declarations: [ShowErrorComponent, SnackBarComponent],
imports: [CommonModule, FormsModule, ReactiveFormsModule, MaterialComponentsModule],
exports: [FormsModule, ReactiveFormsModule, ShowErrorComponent],
entryComponents: [SnackBarComponent]
})
export class SharedModule {
}

5
static/src/app/user-interface/snack-bar/snack-bar-message.css Normal file
View File

@ -0,0 +1,5 @@
.snack-bar-span {
text-align: center;
font-weight: 700;
color: #00d100;
}

3
static/src/app/user-interface/snack-bar/snack-bar-message.html Normal file
View File

@ -0,0 +1,3 @@
<div class="snack-bar-span">
Success!!!
</div>

8
static/src/app/user-interface/snack-bar/snack-bar.component.ts Normal file
View File

@ -0,0 +1,8 @@
import {Component} from '@angular/core';
@Component({
selector: 'snack-bar-message',
templateUrl: 'snack-bar-message.html',
styleUrls: ['snack-bar-message.css'],
})
export class SnackBarComponent {}

6
static/src/app/users/edit-user/edit-user.component.html
View File

@ -62,10 +62,4 @@
{{error}}
</span>
<span *ngIf="showSuccessLabel"
class="label label-success label-small"
style="margin-left: inherit">
Erfolgreich gespeichert
</span>
</form>

10
static/src/app/users/edit-user/edit-user.component.ts
View File

@ -7,6 +7,8 @@ import {RankService} from '../../services/army-management/rank.service';
import {Subscription} from 'rxjs/Subscription';
import {NgForm} from '@angular/forms';
import {Fraction} from '../../utils/fraction.enum';
import {MatSnackBar} from '@angular/material/snack-bar';
import {SnackBarComponent} from '../../user-interface/snack-bar/snack-bar.component';
@Component({
@ -39,7 +41,8 @@ export class EditUserComponent implements OnInit {
private route: ActivatedRoute,
private userService: UserService,
private squadService: SquadService,
private rankService: RankService) {
private rankService: RankService,
private snackBar: MatSnackBar) {
}
ngOnInit() {
@ -101,10 +104,7 @@ export class EditUserComponent implements OnInit {
user.squad = '0';
}
this.user = user;
this.showSuccessLabel = true;
setTimeout(() => {
this.showSuccessLabel = false;
}, 2000);
this.snackBar.openFromComponent(SnackBarComponent, {duration: 2000});
});
} else {
this.userService.submitUser(updateObject)

2
static/src/styles.css
View File

@ -1,3 +1,5 @@
@import "../node_modules/@angular/material/prebuilt-themes/deeppurple-amber.css";
body {
padding-top: 50px;
}