diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts index c7fb99d..d87ee3e 100644 --- a/src/app/app-routing.module.ts +++ b/src/app/app-routing.module.ts @@ -1,6 +1,7 @@ import { NgModule } from '@angular/core'; import { RouterModule, Routes } from '@angular/router'; import { CreateCentreComponent } from './centre/create-centre/create-centre.component'; +import { ListeCentreComponent } from './centre/liste-centre/liste-centre.component'; import { CreateLieuComponent } from './lieu/create-lieu/create-lieu.component'; import { DetailLieuComponent } from './lieu/detail-lieu/detail-lieu.component'; import { CreateComponent } from './personne/create/create.component'; @@ -39,6 +40,10 @@ const routes: Routes = [ path: 'doctor', component: CreateCentreComponent, }, + { + path: 'centre', + component: ListeCentreComponent, + } ]; @NgModule({ diff --git a/src/app/app.component.html b/src/app/app.component.html index ccd2350..620aea8 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -1,4 +1,4 @@ - + +
- + + +
-

Hello

-

Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam, - quidem!

+
-
--> + diff --git a/src/app/app.component.scss b/src/app/app.component.scss index 048ac6c..386e76f 100644 --- a/src/app/app.component.scss +++ b/src/app/app.component.scss @@ -1,144 +1,253 @@ +// .navbar{ +// background-color: #FFD098; +// color: black; +// font-family: 'Poppins', sans-serif; +// } +// .space { +// flex: 1 1 auto; +// } +// .conteuneur{ +// display: flex; +// flex-direction: row; +// align-items: center; +// justify-content: flex-start; +// width: 100vw; +// height: 100vh; +// // gap: 5%; +// } +// .cont{ +// width: 80%; +// height: 100%; +// margin: 0 auto; +// margin-top: 1em; +// } +// .sidemenu{ +// width: 5%; +// height: 100vh; +// background-color: #ffffff; +// border-right: 1px solid #F4F4F4; +// } +// .conteuneur-principal{ +// padding-top: 1%; +// width: 95%; +// height: 100vh; +// background-color: #FCFCFC; +// } -.navbar{ - background-color: #FFD098; - color: black; - font-family: 'Poppins', sans-serif; -} -.space { - flex: 1 1 auto; - } -.conteuneur{ - display: flex; - flex-direction: row; - align-items: center; - justify-content: flex-start; - width: 100vw; - height: 100vh; - // gap: 5%; -} -.cont{ - width: 80%; - height: 100%; - margin: 0 auto; - margin-top: 1em; -} -.sidemenu{ - width: 5%; - height: 100vh; - background-color: #ffffff; - border-right: 1px solid #F4F4F4; -} -.conteuneur-principal{ - padding-top: 1%; - width: 95%; - height: 100vh; - background-color: #FCFCFC; -} +// .sidemenu{ +// padding-top: 1%; +// display: flex; +// flex-direction: column; +// align-items: center; +// gap: 5em; +// } -.sidemenu{ - padding-top: 1%; - display: flex; - flex-direction: column; - align-items: center; - gap: 5em; -} +// #logoSpan{ +// width: 40px; +// height: 40px; +// border-radius: 50%; +// background-color: black; +// display: block; +// } +// .menuDiv ul{ +// padding: 0; +// } +// .menuDiv ul li{ +// list-style: none; +// margin-bottom: 1.5em; +// } -#logoSpan{ - width: 40px; - height: 40px; - border-radius: 50%; - background-color: black; - display: block; -} -.menuDiv ul{ - padding: 0; -} -.menuDiv ul li{ - list-style: none; - margin-bottom: 1.5em; -} +// .menuDiv ul li span{ +// width: 1.5em; +// height: 1.5em; +// display: block; +// background-size: cover; +// background-repeat: no-repeat; +// } -.menuDiv ul li span{ - width: 1.5em; - height: 1.5em; - display: block; - background-size: cover; - background-repeat: no-repeat; -} +// .menuDiv ul li span#personneAdd{ +// background-image: url('../assets/img/icon/user.png'); +// } +// .menuDiv ul li span#personneAdd:hover{ +// background-image: url('../assets/img/icon/users-alt.png'); +// } +// .menuDiv ul li span#testAdd{ +// background-image: url('../assets/img/icon/test.png'); +// } +// .menuDiv ul li span#testAdd:hover{ +// background-image: url('../assets/img/icon/test-alt.png'); +// } +// .menuDiv ul li span#vaccinAdd{ +// background-image: url('../assets/img/icon/vaccin.png'); +// } +// .menuDiv ul li span#vaccinAdd:hover{ +// background-image: url('../assets/img/icon/syringe-alt.png'); +// } +// .menuDiv ul li span#tdb{ +// background-image: url('../assets/img/icon/browser-mat.png'); +// } +// .menuDiv ul li span#tdb:hover{ +// background-image: url('../assets/img/icon/browser.png'); +// } +// .menuDiv ul li span#lieu{ +// background-image: url('../assets/img/icon/building-alt.png'); +// } +// .menuDiv ul li span#lieu:hover{ +// background-image: url('../assets/img/icon/building.png'); +// } +// .menuDiv ul li span#centre{ +// background-image: url('../assets/img/icon/doctor-alt.png'); +// } +// .menuDiv ul li span#centre:hover{ +// background-image: url('../assets/img/icon/doctor.png'); +// } +// .menuDiv ul li span.active#personneAdd{ +// background-image: url('../assets/img/icon/users-alt.png'); +// } +// .menuDiv ul li span.active#testAdd{ +// background-image: url('../assets/img/icon/test-alt.png'); +// } +// .menuDiv ul li span.active#vaccinAdd{ +// background-image: url('../assets/img/icon/syringe-alt.png'); +// } +// .menuDiv ul li span.active#tdb{ +// background-image: url('../assets/img/icon/browser.png'); +// } +// .menuDiv ul li span.active#lieu{ +// background-image: url('../assets/img/icon/building.png'); +// } +// .menuDiv ul li span.active#centre{ +// background-image: url('../assets/img/icon/doctor.png'); +// } +// .conteuneur-principal{ +// padding-top: 1%; +// } -.menuDiv ul li span#personneAdd{ - background-image: url('../assets/img/icon/user.png'); -} -.menuDiv ul li span#personneAdd:hover{ - background-image: url('../assets/img/icon/users-alt.png'); -} -.menuDiv ul li span#testAdd{ - background-image: url('../assets/img/icon/test.png'); -} -.menuDiv ul li span#testAdd:hover{ - background-image: url('../assets/img/icon/test-alt.png'); +.main { + width: 100%; + height: 100%; + display: flex; + flex-direction: row; + overflow: hidden; } -.menuDiv ul li span#vaccinAdd{ - background-image: url('../assets/img/icon/vaccin.png'); + +.linkPart { + padding: 0; + margin: 0; + list-style: none; } -.menuDiv ul li span#vaccinAdd:hover{ - background-image: url('../assets/img/icon/syringe-alt.png'); + +.sideNav { + width: 15%; + height: 100vh; + padding: 1em; + border-right: 1px solid #dddddd; } -.menuDiv ul li span#tdb{ - background-image: url('../assets/img/icon/browser-mat.png'); + +.logoPart, +.logoDiv, +#logoSpan, +#logoSpan img { + width: 100%; } -.menuDiv ul li span#tdb:hover{ - background-image: url('../assets/img/icon/browser.png'); + +#logoSpan img { + height: 50px; + object-fit: cover; } -.menuDiv ul li span#lieu{ - background-image: url('../assets/img/icon/building-alt.png'); + +.linkPart li a { + text-decoration: none; + color: #707585; + font-size: 14px; + font-weight: 500; + font-family: "Poppins", sans-serif; } -.menuDiv ul li span#lieu:hover{ - background-image: url('../assets/img/icon/building.png'); + +.link, +.link .leftLink { + display: flex; } -.menuDiv ul li span#centre{ - background-image: url('../assets/img/icon/doctor-alt.png'); + +.link { + justify-content: space-between; + // padding: 0 1em; } -.menuDiv ul li span#centre:hover{ - background-image: url('../assets/img/icon/doctor.png'); + +.link .leftLink .icon { + align-items: center; + margin-right: 0.5em; } -.menuDiv ul li span.active#personneAdd{ - background-image: url('../assets/img/icon/users-alt.png'); + +.link .icon { + width: 1.5em; + height: 1.5em; + display: block; + background-size: cover; + background-repeat: no-repeat; + filter: invert(47%) sepia(8%) saturate(676%) hue-rotate(188deg) + brightness(94%) contrast(86%); } -.menuDiv ul li span.active#testAdd{ - background-image: url('../assets/img/icon/test-alt.png'); + +.logoPart { + margin-bottom: 1em; } -.menuDiv ul li span.active#vaccinAdd{ - background-image: url('../assets/img/icon/syringe-alt.png'); + +.linkPart li { + // margin-top: 2em; } -.menuDiv ul li span.active#tdb{ - background-image: url('../assets/img/icon/browser.png'); + +.leftLink { + align-items: flex-end; } -.menuDiv ul li span.active#lieu{ - background-image: url('../assets/img/icon/building.png'); + +.content { + padding: 1.5em; + font-family: "Poppins", sans-serif; + width: 80%; } -.menuDiv ul li span.active#centre{ - background-image: url('../assets/img/icon/doctor.png'); + +.content h1 { + font-family: "Poppins", sans-serif; + + font-size: 2em; + font-weight: 600; + margin-bottom: 1em; } -.conteuneur-principal{ - padding-top: 1%; + +:host ::ng-deep { + .mat-expansion-panel:not([class*="mat-elevation-z"]) { + box-shadow: none; + } + .mat-expansion-panel-header-title { + color: #707585; + font-size: 14px; + font-weight: 500; + font-family: "Poppins", sans-serif; + } } -// .main{ -// width: 100%; -// height: 100%; -// display: flex; -// flex-direction: row; -// } +.linkPanel { + list-style: none; + margin-left: 10px; + border-left: #707585 solid 0.1em; + padding: 0 1em; +} -// .linkPart{ -// padding: 0; -// margin: 0; -// } +.linkPanel a span { + // margin-bottom: 1em; + height: 35px; + border-radius: 5px; + display: flex; + align-items: center; + padding-left: 0.8em; +} +.linkPanel li a span:hover { + background-color: rgba(90, 255, 122, 0.2); + color: #05664f; +} -// #logoSpan{ -// background: url("../assets/img/icon/novid.png"); -// background-size: cover; -// background-repeat: no-repeat; -// object-fit: scale-down; -// } \ No newline at end of file +.linkPanel li .active span { + background-color: rgba(90, 255, 122, 0.2); + color: #05664f; +} diff --git a/src/app/app.component.ts b/src/app/app.component.ts index 5030473..b1cce5a 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -7,4 +7,5 @@ import { Component } from '@angular/core'; }) export class AppComponent { title = 'backoffice'; + panelOpenState = true; } diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 37048b8..4d9c0aa 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -31,6 +31,8 @@ import { MatDialogModule } from '@angular/material/dialog'; import { MatTableModule } from '@angular/material/table'; import { NgxQRCodeModule } from '@techiediaries/ngx-qrcode'; import { MatInputModule } from '@angular/material/input'; +import { MatExpansionModule } from '@angular/material/expansion'; +import { ListeCentreComponent } from './centre/liste-centre/liste-centre.component'; @NgModule({ declarations: [ @@ -47,6 +49,7 @@ import { MatInputModule } from '@angular/material/input'; CreateTestComponent, DetailTestComponent, ListeTestComponent, + ListeCentreComponent, ], imports: [ BrowserModule, @@ -68,6 +71,7 @@ import { MatInputModule } from '@angular/material/input'; MatDialogModule, NgxQRCodeModule, MatInputModule, + MatExpansionModule, ], providers: [], bootstrap: [AppComponent], diff --git a/src/app/centre/liste-centre/liste-centre.component.html b/src/app/centre/liste-centre/liste-centre.component.html new file mode 100644 index 0000000..cd2b5fc --- /dev/null +++ b/src/app/centre/liste-centre/liste-centre.component.html @@ -0,0 +1,3 @@ +
+ {{ item.nom_centre }} +
diff --git a/src/app/centre/liste-centre/liste-centre.component.scss b/src/app/centre/liste-centre/liste-centre.component.scss new file mode 100644 index 0000000..e69de29 diff --git a/src/app/centre/liste-centre/liste-centre.component.ts b/src/app/centre/liste-centre/liste-centre.component.ts new file mode 100644 index 0000000..8340324 --- /dev/null +++ b/src/app/centre/liste-centre/liste-centre.component.ts @@ -0,0 +1,20 @@ +import { Component, OnInit } from '@angular/core'; +import { Centre } from 'src/app/models/centre'; +import { CentreService } from 'src/app/services/centre.service'; + +@Component({ + selector: 'app-liste-centre', + templateUrl: './liste-centre.component.html', + styleUrls: ['./liste-centre.component.scss'], +}) +export class ListeCentreComponent implements OnInit { + centres: Centre[] = []; + + constructor(private centreService: CentreService) {} + + ngOnInit(): void { + this.centreService.getCentres().subscribe((data: any) => { + this.centres = data.docs; + }); + } +} diff --git a/src/app/models/test.ts b/src/app/models/test.ts index f712105..18e7b47 100644 --- a/src/app/models/test.ts +++ b/src/app/models/test.ts @@ -11,6 +11,7 @@ export interface Test { } export interface TestToDisplay { + _id: String; id_test: String; date_test: Date; etat_test: number; diff --git a/src/app/testCovid/detail-test/detail-test.component.html b/src/app/testCovid/detail-test/detail-test.component.html index 70d8762..cbaf139 100644 --- a/src/app/testCovid/detail-test/detail-test.component.html +++ b/src/app/testCovid/detail-test/detail-test.component.html @@ -15,7 +15,7 @@

Résultat du test

{{ getStatuts(data.testToDisplay.etat_test) }}

diff --git a/src/app/testCovid/liste-test/liste-test.component.ts b/src/app/testCovid/liste-test/liste-test.component.ts index fc32db5..6feb0fb 100644 --- a/src/app/testCovid/liste-test/liste-test.component.ts +++ b/src/app/testCovid/liste-test/liste-test.component.ts @@ -3,14 +3,8 @@ import { Centre } from 'src/app/models/centre'; import { Personne } from 'src/app/models/personne'; import { Test, TestToDisplay } from 'src/app/models/test'; import { CentreService } from 'src/app/services/centre.service'; -import { - - PersonneServiceService, -} from 'src/app/services/personne-service.service'; -import { - - TestCovidService, -} from 'src/app/services/test-covid.service'; +import { PersonneServiceService } from 'src/app/services/personne-service.service'; +import { TestCovidService } from 'src/app/services/test-covid.service'; import { MatTableDataSource } from '@angular/material/table'; import { MatPaginator } from '@angular/material/paginator'; import { MatSort } from '@angular/material/sort'; @@ -42,8 +36,8 @@ export class ListeTestComponent implements OnInit { @ViewChild(MatSort) sort!: MatSort; ngAfterViewInit() { - this.dataSource.paginator = this.paginator; - this.dataSource.sort = this.sort; + // this.dataSource.paginator = this.paginator; + // this.dataSource.sort = this.sort; } constructor( @@ -62,10 +56,9 @@ export class ListeTestComponent implements OnInit { this.dataSource.filter = filterValue.trim().toLowerCase(); } - - getTestToDisplay() { this.testService.getTests().subscribe((data: any) => { + console.log(data.docs); this.test = data.docs; this.centreService.getCentres().subscribe((data: any) => { this.centres = data.docs; @@ -73,22 +66,25 @@ export class ListeTestComponent implements OnInit { this.personnes = data.docs; this.test.forEach((test) => { var personneTemp = this.personnes.find( - (pers) => pers.id_personne === test.personne_id + (pers) => pers._id === test.personne_id ); var centreTemp = this.centres.find( - (centre) => centre.id_centre === test.centre_id + (centre) => centre._id === test.centre_id ); this.testToDisplay.push({ - id_test: test.id_test, + id_test: test._id, date_test: test.date_test, etat_test: test.etat_test, personne: personneTemp!, centre: centreTemp!, + _id: test._id, }); this.dataSource = new MatTableDataSource( this.testToDisplay ); }); + this.dataSource.paginator = this.paginator; + this.dataSource.sort = this.sort; }); }); }); diff --git a/src/assets/img/icon/add-outline.svg b/src/assets/img/icon/add-outline.svg new file mode 100644 index 0000000..ba8d276 --- /dev/null +++ b/src/assets/img/icon/add-outline.svg @@ -0,0 +1 @@ +Add \ No newline at end of file diff --git a/src/assets/img/icon/bar-chart-outline.svg b/src/assets/img/icon/bar-chart-outline.svg new file mode 100644 index 0000000..d17a659 --- /dev/null +++ b/src/assets/img/icon/bar-chart-outline.svg @@ -0,0 +1 @@ +Bar Chart \ No newline at end of file diff --git a/src/assets/img/icon/flask-outline.svg b/src/assets/img/icon/flask-outline.svg new file mode 100644 index 0000000..9c4c478 --- /dev/null +++ b/src/assets/img/icon/flask-outline.svg @@ -0,0 +1 @@ +Flask \ No newline at end of file diff --git a/src/assets/img/icon/medkit-outline.svg b/src/assets/img/icon/medkit-outline.svg new file mode 100644 index 0000000..67b6dfc --- /dev/null +++ b/src/assets/img/icon/medkit-outline.svg @@ -0,0 +1 @@ +Medkit \ No newline at end of file diff --git a/src/assets/img/icon/people-outline.svg b/src/assets/img/icon/people-outline.svg new file mode 100644 index 0000000..4dafac1 --- /dev/null +++ b/src/assets/img/icon/people-outline.svg @@ -0,0 +1 @@ +People \ No newline at end of file diff --git a/src/assets/img/icon/shield-outline.svg b/src/assets/img/icon/shield-outline.svg new file mode 100644 index 0000000..8efdab2 --- /dev/null +++ b/src/assets/img/icon/shield-outline.svg @@ -0,0 +1 @@ +Shield Checkmark \ No newline at end of file diff --git a/src/assets/img/icon/stats-chart-outline.svg b/src/assets/img/icon/stats-chart-outline.svg new file mode 100644 index 0000000..214098a --- /dev/null +++ b/src/assets/img/icon/stats-chart-outline.svg @@ -0,0 +1 @@ +Stats Chart \ No newline at end of file diff --git a/src/assets/img/icon/trail-sign-outline.svg b/src/assets/img/icon/trail-sign-outline.svg new file mode 100644 index 0000000..2342bd6 --- /dev/null +++ b/src/assets/img/icon/trail-sign-outline.svg @@ -0,0 +1 @@ +Trail Sign \ No newline at end of file diff --git a/src/styles.scss b/src/styles.scss index f885942..54e54af 100644 --- a/src/styles.scss +++ b/src/styles.scss @@ -1,8 +1,9 @@ -@import '~maplibre-gl/dist/maplibre-gl.css'; -body{ - margin: 0; - padding: 0; - font-family: 'Poppins', sans-serif; - width: 100vw; - box-sizing: border-box; -} \ No newline at end of file +@import "~maplibre-gl/dist/maplibre-gl.css"; +body { + margin: 0; + padding: 0; + font-family: "Poppins", sans-serif; + width: 100vw; + box-sizing: border-box; + // overflow: hidden; +}