diff --git a/src/app/pages/home/home.component.css b/src/app/pages/home/home.component.css
index a2a1b6d938e90a16e8173d76b5386ac2f51269de..f378f8895d793091f6bd02e03d6a7e54f0630df6 100644
--- a/src/app/pages/home/home.component.css
+++ b/src/app/pages/home/home.component.css
@@ -1,6 +1,7 @@
mat-grid-tile {
- border-radius: 7px;
- font-size: 22px;
+ border-radius: 4px;
+ font-size: 15px;
+ text-align: center;
}
mat-grid-tile:hover {
@@ -11,12 +12,19 @@ z-index: 1;
mat-grid-list {
width: 100%;
height: 80%;
+ margin-left: 15px;
cursor: pointer;
- margin-top: 200px;
-
+ margin-top: 50px;
+
}
a {
color: black;
}
+h1 {
+ font-size: 15 px ;
+ text-align: center;
+
+}
+
diff --git a/src/app/pages/home/home.component.html b/src/app/pages/home/home.component.html
index 0c5f0c1e1aafc6dbde4c1f16ddbfc0aa9ffc2f7d..c3830a494c7e1d9fce39b7197cde61aaf14019b2 100644
--- a/src/app/pages/home/home.component.html
+++ b/src/app/pages/home/home.component.html
@@ -1,11 +1,10 @@
<body>
- <p>Some text here?</p>
- <p>Maybe some graphics also</p>
- <!-- Dashboard -->
- <mat-grid-list cols="4" rowHeight="120px">
+
+
+ <mat-grid-list cols="4" rowHeight="45px">
<nav>
<a><mat-grid-tile
- *ngFor="let tile of tiles"
+ *ngFor="let tile of tilesTonaliteMed"
[colspan]="tile.cols"
[rowspan]="tile.rows"
[style.background]="tile.color"
@@ -13,11 +12,30 @@
[style.border]="tile.border"
(mouseenter)="setColorHover(tile)"
(mouseleave)="setColorHover(tile)"
- [title]="tile.title"
- [routerLink]="tile.route">
+ >
<strong>{{tile.text}}</strong>
</mat-grid-tile></a></nav>
</mat-grid-list>
+
+
+ <mat-grid-list cols="5" rowHeight="45px">
+ <nav>
+ <a><mat-grid-tile
+ *ngFor="let tile of tilesThemeRec"
+ [colspan]="tile.cols"
+ [rowspan]="tile.rows"
+ [style.background]="tile.color"
+ [style.color]="tile.textColor"
+ [style.border]="tile.border"
+ (mouseenter)="setColorHover(tile)"
+ (mouseleave)="setColorHover(tile)"
+ >
+ <strong>{{tile.text}}</strong>
+ </mat-grid-tile></a></nav>
+ </mat-grid-list>
+
+
+
</body>
diff --git a/src/app/pages/home/home.component.ts b/src/app/pages/home/home.component.ts
index 2e8ddfc5e791aea60906a5d872383ca52aefafbf..1ae15a38896633e04bb62115aeaeb7fc01b47929 100644
--- a/src/app/pages/home/home.component.ts
+++ b/src/app/pages/home/home.component.ts
@@ -8,8 +8,7 @@ export interface Tile {
rows: number;
text: string;
textColor: string;
- title: string;
- route: string;
+
}
@Component({
@@ -24,12 +23,7 @@ export interface Tile {
*/
export class HomeComponent{
- // Dashboard infos
- tiles: Tile[] = [
- {text: 'Saisie de donnée', cols: 4, rows: 1, textColor: "white", color: 'rgb(0,94,184)', border: "3px solid rgb(0,94,184)", title: "Saisir un nouvel article", route: "/data-entry"},
- {text: 'Graphiques', cols: 2, rows: 1, textColor: "white", color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)", title: "Modéliser les données graphiquement", route: "/graphics"},
- {text: "Recherche d'article", cols: 2, rows: 1, textColor: "white", color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)", title: "Rechercher un article dans la base de données",route: "/articles"},
- ];
+
/**
@@ -43,5 +37,106 @@ export class HomeComponent{
tile.textColor = originalColor;
}
+ // Summary of Datas
+
+ tilesTonaliteMed : Tile[] = [
+ {text :'Tonalité des médias' , cols : 2 , rows : 1 , textColor : "white" , color: 'rgb(0,94,184)', border: "3px solid rgb(0,94,184)"},
+ {text :'Positif ' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(0,94,184)', border: "3px solid rgb(0,94,184)"},
+ {text :'Négatif' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(0,94,184)', border: "3px solid rgb(0,94,184)"},
+ {text :'Total' , cols : 2 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'71' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'6' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'Landes' , cols : 2 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'17' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'1' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'Hautes Pyrénées' , cols : 2 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'80' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'3' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'Pyrénées Atlantiques' , cols : 2 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'19' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'2' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ ];
+
+ tilesThemeRec : Tile[] = [
+ {text :'Thèmes les plus récurents' , cols : 5 , rows : 1 , textColor : 'black', color: "white" , border: "none"},
+ {text :'Thème' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(0,94,184)', border: "3px solid rgb(0,94,184)"},
+ {text :'Total ' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(0,94,184)', border: "3px solid rgb(0,94,184)"},
+ {text :'Landes' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(0,94,184)', border: "3px solid rgb(0,94,184)"},
+ {text :'Hautes Pyrénées' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(0,94,184)', border: "3px solid rgb(0,94,184)"},
+ {text :'Pyrénées Atlantiques' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(0,94,184)', border: "3px solid rgb(0,94,184)"},
+ {text :'Partenariat' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'71' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'6' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'17' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'17' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'Sécurité' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'71' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'6' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'17' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'17' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'Transition énergétique' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'71' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'6' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'17' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'17' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'RH' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'71' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'6' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'17' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'17' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'Crise' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'71' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'6' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'17' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'17' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'Réseau' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'71' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'6' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'17' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'17' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'Linky∕Smartgrid' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'71' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'6' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'17' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'17' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'Envrionnement' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'71' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'6' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'17' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ {text :'17' , cols : 1 , rows : 1 , textColor : "white" , color: 'rgb(147,201,14)', border: "3px solid rgb(147,201,14)"},
+ ]
+
+ public displayTonaliteMed(){
+ let arrayTonaliteMed = new Array(5);
+
+ for ( let i=0 ; i <5 ; i++){
+ arrayTonaliteMed[i]=new Array(3)
+ }
+
+ arrayTonaliteMed[0][0]= 'TONALITES DES MEDIAS';
+ arrayTonaliteMed[0][1]= 'POSITIF';
+ arrayTonaliteMed[0][2]= 'NEGATIF';
+
+ arrayTonaliteMed[1][0]= 'TOTAL';
+ arrayTonaliteMed[1][1]= arrayTonaliteMed[2][1]+ arrayTonaliteMed[3][1] + arrayTonaliteMed[4][1];
+ arrayTonaliteMed[1][2]= arrayTonaliteMed[2][2]+ arrayTonaliteMed[3][2] + arrayTonaliteMed[4][2];
+
+ arrayTonaliteMed[2][0]= 'LANDES';
+ arrayTonaliteMed[2][1]= 17 ;
+ arrayTonaliteMed[2][2]= 1;
+
+ arrayTonaliteMed[3][0]= 'HAUTES PYRENEES';
+ arrayTonaliteMed[3][1]= 80;
+ arrayTonaliteMed[3][2]= 3;
+
+ arrayTonaliteMed[4][0]= 'PYRENNES ATLANTIQUES';
+ arrayTonaliteMed[4][1]= 19;
+ arrayTonaliteMed[4][2]= 2;
+
+ return arrayTonaliteMed;
+
+
+ }
+
}