Un début d'ajout pour uploader des images

This commit is contained in:
Sébastien André
2020-05-26 19:10:25 +02:00
parent f21bda7d7b
commit 6ea906f80f
8 changed files with 165 additions and 0 deletions

View File

@@ -0,0 +1,63 @@
import { Component, OnInit, ViewChild } from "@angular/core";
import { FormGroup, FormControl, Validators } from "@angular/forms";
import { MatTableDataSource } from "@angular/material/table";
import { MatPaginator } from "@angular/material/paginator";
import { ImageService } from "../../services/image.service";
import { ServiceComm } from "../../services/service-comm.service";
import { ImageResp } from "../../models/Image";
import { AddAction } from "../../models/add-action.enum";
@Component({
selector: "app-list-of-images",
templateUrl: "./list-of-images.component.html",
styleUrls: ["./list-of-images.component.css"],
})
export class ListOfImagesComponent implements OnInit {
public imgForm: FormGroup;
private selectedFile: File;
public dataSourceTable: MatTableDataSource<ImageResp>;
public resultsLength = 0;
@ViewChild(MatPaginator, { static: true }) paginator: MatPaginator;
constructor(
private serviceApi: ImageService,
private serviceComm: ServiceComm
) {}
ngOnInit(): void {
this.serviceComm.refreshRequest.subscribe((action) => {
if (action === AddAction.Gear) {
this.getListOfImages();
}
});
this.getListOfImages();
this.imgForm = new FormGroup({
comment: new FormControl("", Validators.required),
image: new FormControl("", Validators.required),
});
}
getListOfImages() {
this.serviceApi.getListOfImages().subscribe((data) => {
setTimeout(() => {
this.dataSourceTable = new MatTableDataSource<ImageResp>(data);
this.dataSourceTable.paginator = this.paginator;
this.resultsLength = data.length;
}, 500);
});
}
onFileChanged(event) {
this.selectedFile = event.target.files[0];
}
onSubmit(formData) {
if (this.imgForm.invalid) {
return;
}
this.serviceApi.AddImage(formData.comment, this.selectedFile);
}
}