Merge branch 'dev' of github.com:cvazquezlos/BREMS-Library-App into dev

frontend/src/app/component/admin/admin-routing.module.ts

@@ -1,40 +1,51 @@
-import { NgModule } from '@angular/core';
-import { RouterModule, Routes } from '@angular/router';
+import {NgModule} from '@angular/core';
+import {RouterModule, Routes} from '@angular/router';
+
+import {AdminComponent} from './admin.component';
+
+import {DashboardComponent} from './dashboard/dashboard.component';
+
+import {ManageResourcesComponent} from './manage-resources/manage-resources.component';
+import {EditResourceComponent} from './manage-resources/edit/edit.component';
+
+import {ManageLoansComponent} from './manage-loans/manage-loans.component';
+
+import {ManageFinesComponent} from './manage-fines/manage-fines.component';
+
+import {CreateUserComponent} from './manage-users/create/create.component';
+import {EditUserComponent} from './manage-users/edit/edit.component';
+import {ManageUsersComponent} from './manage-users/manage-users.component';
 
-import { AdminComponent } from './admin.component';
-import { ManageResourcesComponent } from './manage-resources/manage-resources.component';
-import { EditResourceComponent } from './manage-resources/edit/edit.component';
-import { ManageLoansComponent } from './manage-loans/manage-loans.component';
-import { ManageFinesComponent } from './manage-fines/manage-fines.component';
-import { ManageUsersComponent } from './manage-users/manage-users.component';
-import { DashboardComponent } from './dashboard/dashboard.component';
 
 const adminRoutes: Routes = [
-    {
+  {
+    path: '',
+    component: AdminComponent,
+    children: [
+      {
         path: '',
-        component: AdminComponent,
         children: [
-            {
-                path: '',
-                children: [
-                    { path: 'resources', component: ManageResourcesComponent },
-                    { path: 'resource/:id', component: EditResourceComponent },
-                    { path: 'loans', component: ManageLoansComponent },
-                    { path: 'fines', component: ManageFinesComponent },
-                    { path: 'users', component: ManageUsersComponent },
-                    { path: '', component: DashboardComponent }
-                ]
-            }
+          {path: 'resources', component: ManageResourcesComponent},
+          {path: 'resource/:id', component: EditResourceComponent},
+          {path: 'loans', component: ManageLoansComponent},
+          {path: 'fines', component: ManageFinesComponent},
+          {path: 'users', component: ManageUsersComponent},
+          {path: 'user/:id', component: EditUserComponent},
+          {path: 'user/new', component: CreateUserComponent},
+          {path: '', component: DashboardComponent}
         ]
-    }
+      }
+    ]
+  }
 ];
 
 @NgModule({
-    imports: [
-        RouterModule.forChild(adminRoutes)
-    ],
-    exports: [
-        RouterModule
-    ]
+  imports: [
+    RouterModule.forChild(adminRoutes)
+  ],
+  exports: [
+    RouterModule
+  ]
 })
-export class AdminRoutingModule { }
+export class AdminRoutingModule {
+}

frontend/src/app/component/admin/admin.module.ts

@@ -2,20 +2,22 @@ import { NgModule } from '@angular/core';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { CommonModule } from '@angular/common';
 
-import { AdminComponent } from './admin.component';
+import {AdminComponent} from './admin.component';
 
-import { AdminRoutingModule } from './admin-routing.module';
-import { HeaderComponent } from './header/header.component';
-import { SidebarComponent } from './sidebar/sidebar.component';
-import { ManageResourcesComponent } from './manage-resources/manage-resources.component';
-import { EditResourceComponent } from './manage-resources/edit/edit.component';
-import { ManageLoansComponent } from './manage-loans/manage-loans.component';
-import { ManageFinesComponent } from './manage-fines/manage-fines.component';
-import { ManageUsersComponent } from './manage-users/manage-users.component';
-import { DashboardComponent } from './dashboard/dashboard.component';
+import {AdminRoutingModule} from './admin-routing.module';
+import {HeaderComponent} from './header/header.component';
+import {SidebarComponent} from './sidebar/sidebar.component';
+import {ManageResourcesComponent} from './manage-resources/manage-resources.component';
+import {EditResourceComponent} from './manage-resources/edit/edit.component';
+import {EditUserComponent} from './manage-users/edit/edit.component';
+import {ManageLoansComponent} from './manage-loans/manage-loans.component';
+import {ManageFinesComponent} from './manage-fines/manage-fines.component';
+import {CreateUserComponent} from './manage-users/create/create.component';
+import {ManageUsersComponent} from './manage-users/manage-users.component';
+import {DashboardComponent} from './dashboard/dashboard.component';
 
 @NgModule({
-    imports: [
+     imports: [
         CommonModule,
         AdminRoutingModule,
         FormsModule,
@@ -25,12 +27,16 @@ import { DashboardComponent } from './dashboard/dashboard.component';
         AdminComponent,
         HeaderComponent,
         SidebarComponent,
+        DashboardComponent,
         ManageResourcesComponent,
         EditResourceComponent,
         ManageLoansComponent,
         ManageFinesComponent,
         ManageUsersComponent,
-        DashboardComponent
+        CreateUserComponent,
+        EditUserComponent,
+
     ]
 })
-export class AdminModule { }
+export class AdminModule {
+}

frontend/src/app/component/admin/manage-users/create/create.component.html

@@ -0,0 +1,66 @@
+<div class="content-wrapper">
+  <div class="alert alert-danger alert-dismissible" role="alert">
+    <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span>
+    </button>
+  </div>
+  <section class="content-header">
+    <h1>
+      Administración de usuarios
+      <small>Administra los usuarios</small>
+    </h1>
+    <ol class="breadcrumb">
+      <li><a href="/admin/"><i class="fa fa-dashboard"></i> Inicio</a></li>
+      <li><a href="/admin/users">Usuarios</a></li>
+      <li class="active">Añadir usuario</li>
+    </ol>
+  </section>
+  <section class="content">
+    <div class="box box-default">
+      <div class="box-header with-border">
+        <h3 class="box-title">Nuevo usuario</h3>
+      </div>
+      <div class="box-body">
+        <div class="row">
+          <div class="col-lg-8">
+            <div class="form-group">
+              <label>Nombre y apellidos</label>
+              <br>
+              <input type="text" class="form-control" style='display: inline; width: 38%;' placeholder="Nombre"
+                     #firstName required>
+              <input type="text" class="form-control" style='display: inline; width: 30%;'
+                     placeholder="Primer apellido" #lastName1 required>
+              <input type="text" class="form-control" style='display: inline; width: 30%;'
+                     placeholder="Segundo apellido" #lastName2 required>
+            </div>
+            <div class="form-group">
+              <label>Usuario</label>
+              <input type="text" class="form-control" name="name" placeholder="Usuario" #name required>
+            </div>
+            <div class="form-group">
+              <label>Email</label>
+              <input type="text" class="form-control" name="email" placeholder="Email" #email required>
+            </div>
+            <div class="pull-left">
+              <button class="btn btn-success" (click)="create(firstName.value, lastName1.value, lastName2.value,
+              name.value, email.value, password.value, dni.value, telephone.value)">Registrar</button>
+            </div>
+          </div>
+          <div class="col-lg-2">
+            <div class="form-group">
+              <label>Contraseña</label>
+              <input class="form-control" name="password" type="password" placeholder="Contraseña" #password required>
+            </div>
+            <div class="form-group">
+              <label>D.N.I.</label>
+              <input class="form-control" name="dni" type="text" #dni placeholder="D.N.I.">
+            </div>
+            <div class="form-group">
+              <label>Teléfono</label>
+              <input class="form-control" name="telephone" type="text" #telephone placeholder="Teléfono">
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </section>
+</div>

frontend/src/app/component/admin/manage-users/create/create.component.ts

@@ -0,0 +1,38 @@
+import {Component, OnInit} from '@angular/core';
+import {ActivatedRoute, Router} from '@angular/router'
+
+import {User} from '../../../../model/user.model';
+
+import {SessionService} from '../../../../service/session.service';
+import {UserService} from '../../../../service/user.service';
+
+@Component({
+  templateUrl: './create.component.html'
+})
+export class CreateUserComponent implements OnInit {
+
+  constructor(private router: Router, private userService: UserService, private sessionService: SessionService) {
+  }
+
+  ngOnInit() {
+    if (!this.sessionService.checkCredentials()) {
+      this.router.navigate(['/login']);
+    }
+  }
+
+  create(firstName: string, lastName1: string, lastName2: string, name: string, email: string, password: string,
+         dni: string, telephone: string) {
+    let createdUser: User = {
+      name: name, dni: dni, firstName: firstName, lastName1: lastName1, lastName2: lastName2, email: email,
+      telephone: telephone, literaryHobby: []
+    };
+    this.userService.createUser(createdUser).subscribe(
+      response => {
+        console.log(name + " successfully created.");
+        this.router.navigate(['/admin/users']);
+      },
+      error => console.log('Fail trying to register new user.')
+    );
+  }
+
+}

frontend/src/app/component/admin/manage-users/edit/edit.component.html

@@ -0,0 +1,48 @@
+<div class="content-wrapper">
+  <section class="content-header">
+    <h1>
+      Administración de usuarios
+      <small>Administra los usuarios</small>
+    </h1>
+    <ol class="breadcrumb">
+      <li><a [routerLink]="['/admin']"><i class="fa fa-dashboard"></i> Inicio</a></li>
+      <li><a [routerLink]="['/admin/users']">Usuarios</a></li>
+      <li class="active">Añadir usuario</li>
+    </ol>
+  </section>
+  <section class="content">
+    <div class="box box-default">
+      <div class="box-header with-border">
+        <h3 class="box-title">Editar {{user?.name}}</h3>
+      </div>
+      <div class="box-body">
+        <div class="row">
+          <div class="col-lg-8">
+            <div class="form-group">
+              <label>Nombre y apellidos</label>
+              <br>
+              <input type="text" class="form-control" name="firstName" style='display: inline; width: 38%;'
+                     #firstName value="{{user?.firstName}}">
+              <input type="text" class="form-control" name="lastName1" style='display: inline; width: 30%;'
+                     #lastName1 value="{{user?.lastName1}}">
+              <input type="text" class="form-control" name="lastName2" style='display: inline; width: 30%;'
+                     #lastName2 value="{{user?.lastName2}}">
+            </div>
+            <div class="form-group">
+              <label>Email</label>
+              <input type="text" class="form-control" name="email" #email value="{{user?.email}}">
+            </div>
+            <div class="form-group">
+              <label>DNI</label>
+              <input type="text" class="form-control" name="dni" #dni value="{{user?.dni}}">
+            </div>
+            <div class="pull-right">
+              <button type="submit" class="btn btn-success" (click)="edit(firstName.value, lastName1.value,
+              lastName2.value, email.value, dni.value)">Modificar</button>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </section>
+</div>

frontend/src/app/component/admin/manage-users/edit/edit.component.ts

@@ -0,0 +1,46 @@
+import {Component, OnInit} from '@angular/core';
+import {ActivatedRoute, Router} from '@angular/router';
+
+import {User} from '../../../../model/user.model';
+
+import {SessionService} from '../../../../service/session.service';
+import {UserService} from '../../../../service/user.service';
+
+@Component({
+  templateUrl: './edit.component.html'
+})
+export class EditUserComponent implements OnInit {
+
+  user: User;
+
+  constructor(private activatedRoute: ActivatedRoute, private router: Router, private userService: UserService,
+              private sessionService: SessionService) {
+  }
+
+  ngOnInit() {
+    if (!this.sessionService.checkCredentials()) {
+      this.router.navigate(['/login']);
+    } else {
+      this.userService.getUser(this.activatedRoute.snapshot.params['id']).subscribe(
+        response => this.user = response,
+        error => console.log('Fail trying to access to user details.')
+      );
+    }
+  }
+
+  edit(firstName: string, lastName1: string, lastName2: string, email: string, dni: string) {
+    let updatedUser = {
+      id: this.user.id, name: this.user.name, dni: this.user.dni, firstName: firstName,
+      lastName1: lastName1, lastName2: lastName2, email: email, telephone: this.user.telephone,
+      viewTelephone: this.user.viewTelephone, address: this.user.address, biography: this.user.biography
+    };
+
+    this.userService.updateUser(updatedUser, false).subscribe(
+      response => {
+        console.log(this.user.name + " successfully updated.");
+        this.router.navigate(['/admin/users']);
+      },
+      error => console.log("Fail trying to modify " + this.user.name + ".")
+    );
+  }
+}

frontend/src/app/component/admin/manage-users/manage-users.component.html

@@ -1,3 +1,55 @@
-<p>
-  manage-users works!
-</p>
+<div class="content-wrapper">
+  <div *ngIf="successMessage" class="alert alert-success">
+    <strong>¡Eliminado!</strong> {{message}}
+  </div>
+  <div *ngIf="errorMessage" class="alert alert-danger">
+    <strong>Algo ha ido mal...</strong> {{message}}
+  </div>
+  <section class="content-header">
+    <h1>
+      Administración de usuarios
+      <small>Administra los usuarios</small>
+    </h1>
+    <ol class="breadcrumb">
+      <li><a [routerLink]="['/admin']"><i class="fa fa-dashboard"></i> Inicio</a></li>
+      <li class="active">Usuarios</li>
+    </ol>
+  </section>
+  <section class="content">
+    <table class="table table-bordered table-striped" style="background-color: white !important;">
+      <thead>
+      <tr>
+        <th>Nombre y apellidos</th>
+        <th>Usuario</th>
+        <th>Rol(es)</th>
+        <th>Multas</th>
+        <th>Préstamos</th>
+        <th>Administrar</th>
+      </tr>
+      </thead>
+      <tbody>
+      <ng-template ngFor let-user [ngForOf]="users">
+        <tr>
+          <td>{{user.firstName}} {{user.lastName1}} {{user.lastName2}}</td>
+          <td>{{user.name}}</td>
+          <td>{{user.roles?.length}}</td>
+          <td>{{user.penalties?.length}}</td>
+          <td>{{user.actions?.length}}</td>
+          <td>
+            <a [routerLink]="['/user',user.id]">
+              <button type="button" class="btn btn-success"><span class="fa fa-pencil"></span></button>
+            </a>
+            &nbsp;&nbsp;
+            <button type="button" class="btn btn-warning" (click)="delete(user.id)"><span class="fa fa-trash"></span>
+            </button>
+          </td>
+        </tr>
+      </ng-template>
+      </tbody>
+    </table>
+    <a [routerLink]="['/user/new']">
+      <button type="button" class="btn btn-primary"><span class="fa fa-plus-circle"> </span> &nbsp; Añadir usuario
+      </button>
+    </a>
+  </section>
+</div>