Add some admin page stuff

master
trivernis 4 years ago
parent 5c339d53ba
commit 9f9afe21d4

@ -59,11 +59,12 @@ import {MatDialogModule} from '@angular/material/dialog';
import {MatTooltipModule} from '@angular/material/tooltip';
import {MatExpansionModule} from '@angular/material/expansion';
import {MatDatepickerModule} from '@angular/material/datepicker';
import {MatNativeDateModule, MatProgressBarModule} from '@angular/material/';
import {MatGridListModule, MatNativeDateModule, MatProgressBarModule} from '@angular/material/';
import {MatSnackBarModule} from '@angular/material/snack-bar';
import { ServiceWorkerModule } from '@angular/service-worker';
import { environment } from '../environments/environment';
import {LightboxModule} from 'ngx-lightbox';
import { AdminpageComponent } from './components/adminpage/adminpage.component';
const config: SocketIoConfig = {url: 'http://localhost:4444', options: {}};
@ -76,6 +77,7 @@ const appRoutes: Routes = [
{path: 'register', component: RegisterComponent},
{path: 'about', component: AboutComponent},
{path: 'imprint', component: ImprintComponent},
{path: 'admin', component: AdminpageComponent},
];
@NgModule({
@ -104,6 +106,7 @@ const appRoutes: Routes = [
UserlistComponent,
DialogFileUploadComponent,
DialogGroupFileUploadComponent,
AdminpageComponent,
],
imports: [
BrowserModule,
@ -149,7 +152,8 @@ const appRoutes: Routes = [
MatSnackBarModule,
MatProgressBarModule,
LightboxModule,
ServiceWorkerModule.register('ngsw-worker.js', { enabled: environment.production }),
ServiceWorkerModule.register('ngsw-worker.js', {enabled: environment.production}),
MatGridListModule,
],
entryComponents: [
DialogCreateGroupComponent,

@ -0,0 +1,46 @@
<div id="adminpage">
<h1>Administration</h1>
<div class="grid">
<div class="column">
<div class="column-header">
<h2>Levels</h2>
</div>
</div>
<div class="column">
<div class="column-header">
<h2>Activities</h2>
</div>
<div>
<mat-form-field class="input">
<input matInput type="text" placeholder="Activity name">
</mat-form-field>
<mat-table [dataSource]="activitySource" matSort>
<ng-container matColumnDef="points">
<th mat-header-cell *matHeaderCellDef mat-sort-header> points</th>
<td mat-cell *matCellDef="let action"> {{action.points}} </td>
</ng-container>
<!-- Name Column -->
<ng-container matColumnDef="name">
<th mat-header-cell *matHeaderCellDef mat-sort-header> action</th>
<td mat-cell *matCellDef="let action"> {{action.name}} </td>
</ng-container>
<!-- description Column -->
<ng-container matColumnDef="description">
<th mat-header-cell *matHeaderCellDef mat-sort-header> description</th>
<td mat-cell *matCellDef="let action"> {{action.description}} </td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedActivityColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedActivityColumns;"></tr>
</mat-table>
</div>
</div>
<div class="column">
<div class="column-header">
<h2>Blacklist</h2>
</div>
</div>
</div>
</div>

@ -0,0 +1,18 @@
@import "../../../styles/mixins.sass"
#adminpage
margin: 1em
.grid
display: grid
grid-template: 100% / 33% 33% 33%
.column-header
text-align: center
.column
&:nth-child(1)
@include gridPosition(1, 2, 1, 2)
&:nth-child(2)
@include gridPosition(1, 2, 2, 3)
&:nth-child(3)
@include gridPosition(1, 2, 3, 4)

@ -0,0 +1,25 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { AdminpageComponent } from './adminpage.component';
describe('AdminpageComponent', () => {
let component: AdminpageComponent;
let fixture: ComponentFixture<AdminpageComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ AdminpageComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(AdminpageComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

@ -0,0 +1,31 @@
import {Component, OnInit, ViewChild} from '@angular/core';
import {Levellist} from '../../models/levellist';
import {ActivityService} from '../../services/activity/activity.service';
import {Activitylist} from '../../models/activity';
import {MatTableDataSource} from '@angular/material/table';
import {MatSort} from '@angular/material/sort';
@Component({
selector: 'app-adminpage',
templateUrl: './adminpage.component.html',
styleUrls: ['./adminpage.component.sass']
})
export class AdminpageComponent implements OnInit {
public activitySource: MatTableDataSource<any>;
public displayedActivityColumns = ['points', 'name', 'description'];
@ViewChild(MatSort, {static: true}) activitySort: MatSort;
constructor(private activityService: ActivityService) {
}
ngOnInit() {
this.activityService.getActivities();
this.activityService.activitylist.subscribe(response => {
this.activitySource = new MatTableDataSource(response.Actions);
this.activitySource.sort = this.activitySort;
});
}
}

@ -125,7 +125,13 @@
<div [hidden]="loggedIn">
<button mat-menu-item routerLink="/login">
<mat-icon>exit_to_app</mat-icon>
<span>login</span>
<span>Login</span>
</button>
</div>
<div [hidden]="!user.isAdmin">
<button mat-menu-item routerLink="/admin">
<mat-icon>settings</mat-icon>
<span>Administration</span>
</button>
</div>
</mat-menu>

@ -45,4 +45,6 @@ export interface IUser {
eventCount: number;
events: any[];
isAdmin?: boolean;
}

@ -18,6 +18,7 @@ export class User {
joinedAt: string;
friendCount: number;
groupCount: number;
isAdmin: boolean = false;
darkmode = false;
@ -79,6 +80,9 @@ export class User {
this.receivedRequests = userDataResponse.receivedRequests
.map(request => new FriendRequest(request.id, request.sender.id, request.sender.handle, request.sender.name));
}
if (userDataResponse.isAdmin) {
this.isAdmin = true;
}
return this;
}

@ -47,6 +47,7 @@ const graphqlQuery = `mutation($email: String!, $pwHash: String!) {
id
},
settings
isAdmin
}
}`;

Loading…
Cancel
Save