UNOV/mycontrolpanel
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

CP Adding a dashboard page

Browse Source
This commit is contained in:
Thomas Fransolet 2020-02-26 20:33:06 +01:00
parent d114ba16c3
commit cf1300150a
10 changed files with 88 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/app/app-routing.module.ts
View File

@ -8,6 +8,7 @@ import { ProfileComponent } from './control-panel/profile/profile/profile.compon
import { EditProfileComponent } from './control-panel/profile/edit-profile/edit-profile.component';
import { EditConfigurationComponent } from './control-panel/profile/configuration/edit-configuration/edit-configuration.component';
import { DevicesComponent } from './control-panel/profile/devices/devices.component';
import { DashboardComponent } from './control-panel/profile/dashboard/dashboard.component';
const routes: Routes =
[
@ -20,6 +21,7 @@ const routes: Routes =
{ path: '', component: ProfileComponent},
{ path: ':profileId', children: [
{ path: '', component: ProfileComponent},
{ path: 'dashboard', component: DashboardComponent},
{ path: 'edit', component: EditProfileComponent},
{ path: 'configurations', children: [
{ path: '', component: ConfigurationComponent},

1
src/app/app.component.html
View File

@ -9,6 +9,7 @@
<button *ngIf="!Connected" pButton type="button" [label]="LabelHeaderAbout"></button>
<button *ngIf="!Connected" pButton type="button" [label]="LabelHeaderTeam" ></button>
<button *ngIf="!Connected" pButton type="button" [label]="LabelHeaderContact" ></button>
<button *ngIf="Connected" pButton type="button" label="MY DASHBOARD" (click)="GoToDashboard()"></button>
<button *ngIf="Connected" pButton type="button" label="MY DEVICES" (click)="GoToDevices()"></button>
<button *ngIf="Connected" pButton type="button" label="MY CONFIGURATIONS" (click)="GoToConfiguration()"></button>
<button *ngIf="!Connected" pButton type="button" label="{{LabelHeaderSignIn}}" icon="pi pi-pencil" iconPos="right" (click)="SignUp()"></button>

4
src/app/app.component.ts
View File

@ -162,6 +162,10 @@ export class AppComponent implements OnInit {
this._router.navigate(['/home']);
}
public GoToDashboard() {
this._router.navigate(['/profile/' + this.ConnectedUser.id + '/dashboard']);
}
public GoToProfile() {
this._router.navigate(['/profile/' + this.ConnectedUser.id]);
}

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

@ -38,6 +38,7 @@ import { ToastModule } from 'primeng/toast';
import { DropdownModule } from 'primeng/dropdown';
import { EditConfigurationComponent } from './control-panel/profile/configuration/edit-configuration/edit-configuration.component';
import { DevicesComponent } from './control-panel/profile/devices/devices.component';
import { DashboardComponent } from './control-panel/profile/dashboard/dashboard.component';
@ -71,7 +72,8 @@ export function HttpLoaderFactory(http: HttpClient) {
ProfileComponent,
EditProfileComponent,
EditConfigurationComponent,
DevicesComponent
DevicesComponent,
DashboardComponent
],
imports: [
BrowserModule,

25
src/app/control-panel/home/home.component.html
View File

@ -86,26 +86,13 @@
<div class="container">
<div class="row justify-content-around">
<div class="col-3 ">
<div class="card" style="border: solid 2px #f5f5f5;" appBorderCard>
<div class="card-body">
<h5 class="card-title">HUBERT</h5>
<img class="card-img" src="../../assets/images/home-page/Hubert.jpg" style="margin-bottom: 2em">
<h6 class="card-subtitle mb-2 text-muted">Cette petite bite</h6>
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
<ul class="social-network social-circle" style="text-align : center">
<li><a href="#" class="icoFacebook" title="Facebook"><i class="fa fa-facebook"></i></a></li>
<li><a href="#" class="icoTwitter" title="Twitter"><i class="fa fa-twitter"></i></a></li>
<li><a href="#" class="icoLinkedin" title="Linkedin"><i class="fa fa-linkedin"></i></a></li>
</ul>
</div>
</div>
</div>
<div class="col-3">
<div class="col-6">
<div class="card" style="border: solid 2px #f5f5f5;" appBorderCard>
<div class="card-body">
<h5 class="card-title">FRANSOLET</h5>
<img class="card-img" src="../../assets/images/home-page/Thomas.jpg" style="margin-bottom: 2em">
<div style="justify-content: center;">
<img class="card-img" src="../../assets/images/home-page/Thomas.jpg" style="width: 50%; margin-bottom: 2em">
</div>
<h6 class="card-subtitle mb-2 text-muted">Cette gribouille</h6>
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
<ul class="social-network social-circle">
@ -116,11 +103,11 @@
</div>
</div>
</div>
<div class="col-3" >
<div class="col-6" >
<div class="card" style="border: solid 2px #f5f5f5;" appBorderCard>
<div class="card-body">
<h5 class="card-title">MICHEL</h5>
<img class="card-img" src="../../assets/images/home-page/Michel2.jpg" style="margin-bottom: 2em">
<img class="card-img" src="../../assets/images/home-page/Michel2.jpg" style="width: 50%;margin-bottom: 2em">
<h6 class="card-subtitle mb-2 text-muted">Ce poseur</h6>
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
<ul class="social-network social-circle">

21
src/app/control-panel/profile/dashboard/dashboard.component.css Normal file
View File

@ -0,0 +1,21 @@
.sidebar {
position: fixed;
width: 200px;
height: 400px;
background: #000;
}
.content {
margin-left: 200px;
height: 500px;
width: auto;
position: relative;
background: #f00;
overflow: auto;
z-index: 1;
}
.info {
width: 1440px;
height: 300px;
position: relative;
background: #f55;
}

9
src/app/control-panel/profile/dashboard/dashboard.component.html Normal file
View File

@ -0,0 +1,9 @@
<!-- THIS NEED TO BE UPDATED PROPERLY -->
<div class="blankSpace">
<br>
<br>
</div>
<div class="sidebar"></div>
<div class="content">
<div class="info"></div>
</div>

25
src/app/control-panel/profile/dashboard/dashboard.component.spec.ts Normal file
View File

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

15
src/app/control-panel/profile/dashboard/dashboard.component.ts Normal file
View File

@ -0,0 +1,15 @@
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-dashboard',
templateUrl: './dashboard.component.html',
styleUrls: ['./dashboard.component.css']
})
export class DashboardComponent implements OnInit {
constructor() { }
ngOnInit() {
}
}

2
src/app/control-panel/profile/profile/profile.component.html
View File

@ -9,6 +9,8 @@
This is your profile view => You can see all your devices (the availability, params?), all your playlists, and links to create new configuration
</p>
It's more a dashboard.. like home assistant.
<p>
Connect new device button => Scanner (?) with wizard ?
</p>