Commit 0ae62aae authored by ndurand's avatar ndurand
Browse files

chargement asynchrone des énumérations

parent ed40a085
......@@ -8,7 +8,7 @@ const routes: Routes = [
{
path: 'tableView/:uuid',
component: MainComponent,
data: { pageId: 'tableView', secured: false},
children: [
{
path: '',
......
......@@ -8,5 +8,5 @@ import { DataService } from './services/data.service';
styleUrls: ['./app.component.css']
})
export class AppComponent {
constructor(private dataService: DataService){console.log(dataService)}
constructor(){}
}
......@@ -8,9 +8,6 @@ import { DataService } from 'src/app/services/data.service';
styleUrls: ['./dynamic-template.component.css']
})
export class DynamicTemplateComponent implements OnInit {
/** */
@Input() uuid: string;
/** Type: header / footer */
protected type: string;
......@@ -22,10 +19,9 @@ export class DynamicTemplateComponent implements OnInit {
constructor(protected dataService: DataService) { }
ngOnInit() {
console.log(25, this.uuid, this.type);
if(this.type && this.uuid){
if(this.type){
this.htmlContent = "";
this.dataService.loadHtmlContentByUuid(this.uuid, this.type)
this.dataService.loadHtmlContent(this.type)
.then(
htmlContent => {
this.htmlContent = htmlContent.replace("{title}", this.title);
......
<h4 class="modal-title" id="modal-basic-title">Gid: {{feature && feature.properties.gid}}</h4>
<form>
<form *ngIf="feature">
<div class="form-group" *ngFor="let structure of structures$ | async" >
<div *ngIf="structure.column_name !== 'gid'">
<ng-container [ngSwitch]="structure.data_type">
......@@ -129,4 +129,4 @@
</div>
</div>
</form>
<button type="button" class="btn btn-outline-dark" (click)="c('Save click')">Save</button>
<button type="button" class="btn btn-outline-dark" (click)="saveData()">Save</button>
......@@ -5,6 +5,7 @@ import { Feature, featureCollection } from 'src/app/models/layer-type';
import { Structure } from 'src/app/models/structure';
import { DataService } from 'src/app/services/data.service';
import { Observable } from 'rxjs';
import { ActivatedRoute } from '@angular/router';
@Component({
selector: 'app-modal-edit',
......@@ -15,10 +16,10 @@ import { Observable } from 'rxjs';
})
export class EditDataComponent {
/** */
@Input() featureIndex: number;
private uuid: string;
/** */
@Input() uuid: string;
private gid: string;
/** */
private feature : Feature ;
......@@ -28,25 +29,37 @@ export class EditDataComponent {
/** */
private structures$: Observable<Structure[]>;
/** */
private enumerations$: Observable<Object>;
/** */
private enumerations: Object;
constructor(private tableViewData: TableViewDataService, private dataService: DataService) {
constructor(private tableViewData: TableViewDataService, private dataService: DataService,private activatedRoute: ActivatedRoute) {
// customize default values of modals used by this component tree
this.structures$ = this.tableViewData.structures$;
this.enumerations$ = this.tableViewData.enumerations$;
this.enumerations$.subscribe( enumerations => {
this.enumerations = enumerations;
});
}
/** */
ngOnInit() {
this.enumerations = this.tableViewData.enumerations;
this.structures$ = this.tableViewData.structures$;
if(this.tableViewData.getFeatureByIndex(this.featureIndex)){
this.feature = JSON.parse(JSON.stringify( this.tableViewData.getFeatureByIndex(this.featureIndex) ));
this.gid = this.activatedRoute.snapshot.paramMap.get('gid');
if( this.gid ){
this.dataService.getData(this.gid).subscribe(response =>{
if(response && response.features && response.features.length > 0){
this.feature = response.features[0];
}
});
//this.feature = JSON.parse(JSON.stringify( this.tableViewData.getFeatureByIndex(this.featureIndex) ));
}
else{
this.structures$.subscribe(structures => {
console.log(structures);
let properties = {};
this.tableViewData.structures.forEach(structure => {
......@@ -61,7 +74,7 @@ export class EditDataComponent {
/** */
saveData(){
this.dataService.postData(this.uuid, [this.feature]);
this.dataService.postData([this.feature]);
}
/** */
......
<app-header [uuid]="uuid" [title]="title"></app-header>
<app-header [title]="title"></app-header>
<div class="container-fluid">
<router-outlet></router-outlet>
</div>
<app-footer [uuid]="uuid" [title]="title" ></app-footer>
<app-footer [title]="title" ></app-footer>
......@@ -4,11 +4,12 @@ import { ActivatedRoute } from '@angular/router';
import { FeatureCollection } from 'src/app/models/layer-type';
import { TableViewDataService } from 'src/app/services/table-view-data.service';
import { DecimalPipe } from '@angular/common';
@Component({
selector: 'app-main',
templateUrl: './main.component.html',
styleUrls: ['./main.component.css'],
providers: [TableViewDataService, DecimalPipe]
providers: [TableViewDataService, DecimalPipe, DataService]
})
export class MainComponent implements OnInit {
/** */
......@@ -23,31 +24,32 @@ export class MainComponent implements OnInit {
/** uuid */
if(this.activatedRoute.snapshot.paramMap.get('uuid')){
this.uuid = this.activatedRoute.snapshot.paramMap.get('uuid');
this.dataService.uuid = this.uuid;
}
/** config */
this.dataService.getContifData(this.uuid).subscribe( response => {
this.dataService.getContifData().subscribe( response => {
if(response && response.metadata && response.metadata.title){
this.title = response.metadata.title;
}
});
/** Data */
this.dataService.getData(this.uuid).subscribe((featureCollection)=>{
this.dataService.getData().subscribe((featureCollection)=>{
if(featureCollection && featureCollection.features && featureCollection.features.length > 0){
this.tableViewData.initFeatures( featureCollection.features );
}
})
/** Structure */
this.dataService.getStructuByUuid(this.uuid).subscribe(structures => {
this.dataService.getStructure().subscribe(structures => {
if(structures){
this.tableViewData.structures = structures ;
}
})
/** Enumeration */
this.dataService.getEnumByUuid(this.uuid).subscribe(enumerations => {
this.dataService.getEnum().subscribe(enumerations => {
if(enumerations){
this.tableViewData.enumerations = enumerations;
}
......
......@@ -4,6 +4,7 @@
<span class="ml-3" *ngIf="tableViewDataService.loading$ | async">Loading...</span>
</div>
<a routerLink="edit" class="btn btn-primary" routerLinkActive="active"><i class="fas fa-edit"></i> Editer</a>
<div class="d-flex justify-content-between p-2">
<ngb-pagination [collectionSize]="total$ | async" [(page)]="tableViewDataService.page" [maxSize]="10" [pageSize]="tableViewDataService.pageSize" [rotate]="true" [boundaryLinks]="true" >
</ngb-pagination>
......@@ -12,6 +13,7 @@
<option *ngFor="let choiceValue of pageSizeChoice" [ngValue]="choiceValue">{{choiceValue}}</option>
</select>
</div>
<table class="table table-striped" >
<thead>
<tr>
......@@ -25,13 +27,13 @@
{{feature.properties[structure.column_name]}}
</td>
<td class="table-button-action">
<!--<app-modal-edit [featureIndex]="i" ></app-modal-edit>-->
<a routerLink="edit/{{feature.properties.gid}}" class="btn btn-primary" routerLinkActive="active"><i class="fas fa-edit"></i> Editer</a>
<button type="button" class="btn btn-danger"><i class="fas fa-times"></i> Suprimmer</button>
</td>
</tr>
</tbody>
</table>
<div class="d-flex justify-content-between p-2">
<ngb-pagination [collectionSize]="total$ | async" [(page)]="tableViewDataService.page" [maxSize]="10" [pageSize]="tableViewDataService.pageSize" [rotate]="true" [boundaryLinks]="true" >
</ngb-pagination>
......
......@@ -44,11 +44,6 @@ export class TableViewComponent implements OnInit {
/** */
ngOnInit() {
/** uuid */
if(this.activatedRoute.snapshot.paramMap.get('uuid')){
this.uuid = this.activatedRoute.snapshot.paramMap.get('uuid');
}
this.tableViewDataService.searchFromUrlParam();
}
......
......@@ -11,39 +11,48 @@ import { Structure } from '../models/structure';
providedIn: 'root'
})
export class DataService {
private httpOption: {withCredentials: boolean} = {withCredentials: true};
private httpOption = {withCredentials: true, params: null};
private _uuid: string;
constructor(
private http: HttpClient,
private envService: EnvService,
){}
set uuid(uuid: string){this._uuid = uuid;}
get uuid(){return this._uuid;}
/** Donnée tabulaire */
getData(uuid: string): Observable<FeatureCollection> {
return this.http.get<FeatureCollection>( this.envService.catalogueUrl + '/api/data/' + uuid, this.httpOption);
getData(gid: string = null): Observable<FeatureCollection> {
if(gid){
this.httpOption.params = {gid: gid}
}
return this.http.get<FeatureCollection>( this.envService.catalogueUrl + '/api/data/' + this._uuid , this.httpOption);
}
/** Ajout de données tabulaire*/
postData(uuid: string, features: Array<Feature>) {
postData(features: Array<Feature>) {
let data = <FeatureCollection>{type: "FeatureCollection", features: features }
console.log(data);
this.http.post(this.envService.catalogueUrl +'/api/data/' + uuid, data, this.httpOption).subscribe(response => {
this.http.post(this.envService.catalogueUrl +'/api/data/' + this._uuid, data, this.httpOption).subscribe(response => {
console.log(response);
});
}
/** Config (pour le titre)*/
getContifData(uuid: string): Observable<ConfigData> {
let request = this.envService.geonetworkUrl + "/srv/fre/q?_content_type=json&fast=index&uuid=" + uuid;
getContifData(): Observable<ConfigData> {
let request = this.envService.geonetworkUrl + "/srv/fre/q?_content_type=json&fast=index&uuid=" + this._uuid;
return this.http.get<ConfigData>(request);
}
/** Pour récuperrer les fichier html (header/footer) */
loadHtmlContentByUuid(uuid: string, type: string): Promise<string>{
loadHtmlContent(type: string): Promise<string>{
let retour: string = "";
return new Promise((resolve, reject) => {
this.http.get( this.envService.templatesTableUrl + uuid + "/" + type +".html", {responseType: 'text'}).subscribe(data => {
this.http.get( this.envService.templatesTableUrl + this._uuid + "/" + type +".html", {responseType: 'text'}).subscribe(data => {
console.log('data', data);
resolve(data);
}, error =>{
......@@ -57,13 +66,13 @@ export class DataService {
}
/** Structure */
getStructuByUuid(uuid: string): Observable< Array<Structure> >{
return this.http.get<Array<Structure>>( this.envService.catalogueUrl + '/api/structure/' + uuid, this.httpOption)
getStructure(): Observable< Array<Structure> >{
return this.http.get<Array<Structure>>( this.envService.catalogueUrl + '/api/structure/' + this._uuid, this.httpOption)
}
/** Enumeration */
getEnumByUuid(uuid: string): Observable< Object >{
return this.http.get<Object>(this.envService.catalogueUrl + "/api/enum/" + uuid, this.httpOption);
getEnum(): Observable< Object >{
return this.http.get<Object>(this.envService.catalogueUrl + "/api/enum/" + this._uuid, this.httpOption);
}
}
......@@ -68,6 +68,7 @@ export class TableViewDataService {
private _structures: Array<Structure> = [];
/** */
private _enumerations$ = new BehaviorSubject<Object>({});
private _enumerations: Object;
private _state: State = {
......@@ -95,6 +96,7 @@ export class TableViewDataService {
}
get structures$() {return this._structures$.asObservable();}
get enumerations$() {return this._enumerations$.asObservable();}
get features$() { return this._features$.asObservable(); }
get total$() { return this._total$.asObservable(); }
get loading$() { return this._loading$.asObservable(); }
......@@ -103,7 +105,6 @@ export class TableViewDataService {
get searchTerm() { return this._state.searchTerm; }
get enumerations() { return this._enumerations; }
get structures(){ return this._structures;}
set page(page: number) { this._set({page}); }
......@@ -113,7 +114,7 @@ export class TableViewDataService {
set sortDirection(sortDirection: SortDirection) { this._set({sortDirection}); }
set structures(structures: Array<Structure>){ this._structures = structures;this._structures$.next(this._structures )}
set enumerations(enumerations: Object) {this._enumerations = enumerations; }
set enumerations(enumerations: Object) {this._enumerations = enumerations; this._enumerations$.next(this._enumerations)}
public getFeatureByIndex(index: number){
return this._features[index];
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment