Début d'ajout d'une image pour les avions

This commit is contained in:
Sébastien André
2020-07-30 18:57:51 +02:00
parent eee6f596ac
commit 6c654d298d
8 changed files with 130 additions and 78 deletions

View File

@@ -1,31 +1,31 @@
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 { 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";
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"],
selector: 'app-list-of-images',
templateUrl: './list-of-images.component.html',
styleUrls: ['./list-of-images.component.css'],
})
export class ListOfImagesComponent implements OnInit {
public displayedColumns: Array<string> = ["comment", "data"];
public displayedColumns: Array<string> = ['comment', 'data'];
public imgForm: FormGroup;
public imageError: string;
private selectedFile: string;
public dataSourceTable: MatTableDataSource<ImageResp>;
public resultsLength = 0;
private selectedFile: string;
@ViewChild(MatPaginator, { static: true }) paginator: MatPaginator;
constructor(
private serviceApi: ImageService,
private serviceComm: ServiceComm
) {}
) { }
ngOnInit(): void {
this.serviceComm.refreshRequest.subscribe((action) => {
@@ -36,8 +36,8 @@ export class ListOfImagesComponent implements OnInit {
this.getListOfImages();
this.imgForm = new FormGroup({
comment: new FormControl("", Validators.required),
image: new FormControl("", Validators.required),
comment: new FormControl('', Validators.required),
image: new FormControl('', Validators.required),
});
}
@@ -52,16 +52,16 @@ export class ListOfImagesComponent implements OnInit {
}
public onFileChanged(fileInput: any) {
var file = fileInput.dataTransfer
const file = fileInput.dataTransfer
? fileInput.dataTransfer.files[0]
: fileInput.target.files[0];
const allowed_types = ["image/png", "image/jpeg"];
const allowed_types = ['image/png', 'image/jpeg'];
const max_size = 20971520;
if (!allowed_types.includes(file.type)) {
this.imageError = "Only Images are allowed ( JPG | PNG )";
this.imageError = 'Only Images are allowed ( JPG | PNG )';
} else if (file.size > max_size) {
this.imageError = "Maximum size allowed is " + max_size / 1000 + "Mb";
this.imageError = 'Maximum size allowed is ' + max_size / 1000 + 'Mb';
} else {
const reader = new FileReader();
reader.onload = this.checkAndExtractDataToBase64.bind(this);
@@ -76,16 +76,16 @@ export class ListOfImagesComponent implements OnInit {
const image = new Image();
image.src = e.target.result;
image.onload = (rs) => {
const img_height = rs.currentTarget["height"];
const img_width = rs.currentTarget["width"];
const img_height = rs.currentTarget['height'];
const img_width = rs.currentTarget['width'];
if (img_height > max_height && img_width > max_width) {
this.imageError =
"Maximum dimentions allowed " + max_height + "*" + max_width + "px";
'Maximum dimentions allowed ' + max_height + '*' + max_width + 'px';
} else {
const imgBase64Path = e.target.result;
this.selectedFile = imgBase64Path;
this.imageError = "OK";
this.imageError = 'OK';
}
};
}