Add(new file or existing file with drag and drop)/modify.delete script + link to Git + search by nameversion_2
floxx2112
2 years ago
parent
9571e2f4ff
commit
1eb347b5f8
@ -0,0 +1,20 @@ |
|||||||
|
import { Pipe, PipeTransform } from '@angular/core'; |
||||||
|
import { Script } from './app/model/script'; |
||||||
|
|
||||||
|
@Pipe({ |
||||||
|
name: 'filterscript', |
||||||
|
pure: false |
||||||
|
}) |
||||||
|
export class CustomFilterScript implements PipeTransform { |
||||||
|
transform(items: Script[], filter: string): any { |
||||||
|
if (!items || !filter) { |
||||||
|
return items; |
||||||
|
} |
||||||
|
// filter items array, items which match and return true will be
|
||||||
|
// kept, false will be filtered out
|
||||||
|
if(filter){ |
||||||
|
return items.filter(item => item.name.indexOf(filter) !== -1); |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
|
} |
||||||
@ -0,0 +1,64 @@ |
|||||||
|
<div class="my-4"> |
||||||
|
<div class="flex sm:flex-nowrap flex-wrap sm:space-x-4"> |
||||||
|
|
||||||
|
<div class="w-full sm:w-2/3 h-full text-center rounded-lg overflow-hidden shadow-lg bg-white p-4 "> |
||||||
|
<div class="flex"> |
||||||
|
<button (click)="isNewFile()" class="text-white bg-gradient-to-r from-purple-500 to-pink-500 hover:bg-gradient-to-l focus:ring-4 focus:outline-none focus:ring-purple-200 font-semibold py-2 px-4 rounded shadow m-2" >Nouveau</button> |
||||||
|
<button (click)="isExistingFile()" class="text-white bg-gradient-to-r from-purple-500 to-pink-500 hover:bg-gradient-to-l focus:ring-4 focus:outline-none focus:ring-purple-200 font-semibold py-2 px-4 rounded shadow m-2" >Fichier Éxistant</button> |
||||||
|
</div> |
||||||
|
<div class="rounded-lg overflow-hidden shadow-lg bg-slate-100 border-solid border-orange-400 border-2"> |
||||||
|
<div class="p-4"> |
||||||
|
|
||||||
|
<div *ngIf="newFile"> |
||||||
|
<div class="font-bold text-xl text-left mb-2">Vueillez rentrer le contenu du Script : </div> |
||||||
|
<textarea [(ngModel)]="newFileData" rows="20" class="block p-2.5 w-full text-sm rounded-lg border bg-gray-700 border-gray-600 placeholder-gray-400 text-white focus:ring-orange-400 focus:border-orange-400"> |
||||||
|
</textarea> |
||||||
|
</div> |
||||||
|
|
||||||
|
|
||||||
|
<div *ngIf="!newFile"> |
||||||
|
<div class="py-2 relative rounded-lg overflow-hidden bg-slate-900 border-solid border-orange-400 border-2 text-center text-white" appDnd (fileDropped)="onFileDropped($event)" > |
||||||
|
<input type="file" multiple class=" z-10 opacity-0 absolute w-full h-full top-0 left-0"/> |
||||||
|
<mat-icon class="flex !h-20 !w-20" svgIcon="upload"></mat-icon> |
||||||
|
<div>Glisser / Déposer le script ici</div> |
||||||
|
</div> |
||||||
|
<div *ngIf="files.length > 0" class="my-2"> |
||||||
|
<div *ngFor="let file of files, index as i" class="mb-2 p-2 rounded-lg overflow-hidden bg-slate-200 border-solid border-orange-400 border-2" (click)="displayText(i)"> |
||||||
|
<div class="grid grid-cols-1 sm:grid-cols-2 "> |
||||||
|
<div class="flex justify-start "> |
||||||
|
<div class="font-bold mr-2">{{ file?.name }}</div> |
||||||
|
<div>Taille: {{ formatBytes(file.size) }}</div> |
||||||
|
</div> |
||||||
|
<div class="flex justify-end my-auto"> |
||||||
|
<mat-icon (click)="deleteFile(i)" class="text-red-600 mx-2 hover:cursor-pointer" svgIcon="trash"></mat-icon> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div class="font-bold text-xl text-left mb-2">Contenu du Script : </div> |
||||||
|
<textarea [(ngModel)]="existingFileData" rows="20" class="block p-2.5 w-full text-sm rounded-lg border bg-gray-700 border-gray-600 placeholder-gray-400 text-white focus:ring-orange-400 focus:border-orange-400"> |
||||||
|
</textarea> |
||||||
|
</div> |
||||||
|
|
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
|
||||||
|
<div class="w-full mt-2 sm:mt-0 sm:w-1/3 h-full rounded-lg overflow-hidden shadow-lg bg-white p-4 "> |
||||||
|
<div class="text-xl font-bold pb-2 text-center">Informations du Script :</div> |
||||||
|
<div class="font-bold text-lg">Nom du Script :</div> |
||||||
|
<input type="text" class="block w-full my-2 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-slate-800 focus:border-slate-800" [(ngModel)]="nameOfFile" placeholder="Tapez ici..."> |
||||||
|
<div class="font-bold text-lg">Type d'extension :</div> |
||||||
|
<select [(ngModel)]="nameOfExtension" class="mb-4 bg-gray-50 text-sm text-slate-800 rounded-lg focus:ring-slate-800 focus:border-slate-800 block w-full p-2.5" required> |
||||||
|
<option [ngValue]="undefined" disabled>Sélectionner l'extension</option> |
||||||
|
<option *ngFor="let ext of listOfExtension" value="{{ ext }}">{{ ext }}</option> |
||||||
|
</select> |
||||||
|
|
||||||
|
<button (click)="addScriptToCentral()" type="button" class="text-gray-900 bg-gradient-to-r from-teal-200 to-lime-200 hover:bg-gradient-to-l hover:from-teal-200 hover:to-lime-200 focus:ring-4 focus:outline-none focus:ring-lime-200 font-semibold rounded-lg px-4 py-2 text-center mr-2 mb-2">Ajouter le Script</button> |
||||||
|
|
||||||
|
|
||||||
|
</div> |
||||||
|
|
||||||
|
</div> |
||||||
|
</div> |
||||||
|
|
||||||
@ -0,0 +1,127 @@ |
|||||||
|
import { HttpErrorResponse } from '@angular/common/http'; |
||||||
|
import { Component } from '@angular/core'; |
||||||
|
import { MatIconRegistry } from '@angular/material/icon'; |
||||||
|
import { DomSanitizer } from '@angular/platform-browser'; |
||||||
|
import { Observable, Subject } from 'rxjs'; |
||||||
|
import { Script } from '../model/script'; |
||||||
|
import { Router, RouterModule } from '@angular/router'; |
||||||
|
import { ScriptService } from '../service/script.service'; |
||||||
|
|
||||||
|
@Component({ |
||||||
|
selector: 'app-add-script', |
||||||
|
templateUrl: './add-script.component.html', |
||||||
|
styleUrls: ['./add-script.component.scss'] |
||||||
|
}) |
||||||
|
export class AddScriptComponent { |
||||||
|
nameOfFile : String | undefined; |
||||||
|
nameOfExtension : String | undefined; |
||||||
|
listOfExtension : String[] = ["sql", "ps1", "txt", "bat"]; |
||||||
|
newFile : boolean = false; |
||||||
|
newFileData: String | undefined; |
||||||
|
existingFileData: String | undefined; |
||||||
|
files: File[] = []; |
||||||
|
contentOfFiles: string[] = []; |
||||||
|
scriptToSend: Script | undefined; |
||||||
|
|
||||||
|
constructor( |
||||||
|
private scriptService: ScriptService, |
||||||
|
private router: Router, |
||||||
|
private matIconRegistry: MatIconRegistry, |
||||||
|
private domSanitizer: DomSanitizer){ |
||||||
|
this.matIconRegistry.addSvgIcon('upload', this.domSanitizer.bypassSecurityTrustResourceUrl('../../assets/svg/upload.svg')), |
||||||
|
this.matIconRegistry.addSvgIcon('trash', this.domSanitizer.bypassSecurityTrustResourceUrl('../../assets/svg/trash.svg')) |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
public isNewFile (){ |
||||||
|
this.newFile = true; |
||||||
|
} |
||||||
|
|
||||||
|
public isExistingFile (){ |
||||||
|
this.newFile = false; |
||||||
|
} |
||||||
|
|
||||||
|
public deleteFile(index: number) { |
||||||
|
this.files.splice(index, 1); |
||||||
|
if(index == 0){ |
||||||
|
this.newFileData = undefined; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
public onFileDropped(event: any){ |
||||||
|
this.readFile(event[0]).subscribe((output) => { |
||||||
|
this.newFileData = output; |
||||||
|
}) |
||||||
|
for(const item of event){ |
||||||
|
this.files.push(item); |
||||||
|
} |
||||||
|
console.log(this.files) |
||||||
|
} |
||||||
|
|
||||||
|
public displayText(index: number){ |
||||||
|
this.readFile(this.files[index]).subscribe((output) => { |
||||||
|
this.newFileData = output; |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
readFile(file: File): Observable<string> { |
||||||
|
const sub = new Subject<string>(); |
||||||
|
var reader = new FileReader(); |
||||||
|
|
||||||
|
reader.onload = () => { |
||||||
|
const content: string = reader.result as string; |
||||||
|
sub.next(content); |
||||||
|
sub.complete(); |
||||||
|
}; |
||||||
|
|
||||||
|
reader.readAsText(file); |
||||||
|
return sub.asObservable(); |
||||||
|
} |
||||||
|
|
||||||
|
public renderFileContent( value: string[] ) : void { |
||||||
|
console.log(value) |
||||||
|
//this.existingFileData = value;
|
||||||
|
this.newFileData = value[0]; |
||||||
|
console.log(this.existingFileData) |
||||||
|
|
||||||
|
} |
||||||
|
public seeCont(){ |
||||||
|
console.log(this.newFileData) |
||||||
|
} |
||||||
|
|
||||||
|
public formatBytes(bytes: number) { |
||||||
|
if (bytes === 0) { |
||||||
|
return '0 Bytes'; |
||||||
|
} |
||||||
|
const k = 1024; |
||||||
|
const dm = 2; |
||||||
|
const sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB']; |
||||||
|
const i = Math.floor(Math.log(bytes) / Math.log(k)); |
||||||
|
return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + ' ' + sizes[i]; |
||||||
|
} |
||||||
|
|
||||||
|
public addScriptToCentral(){ |
||||||
|
if(this.nameOfExtension && this.nameOfFile && (this.existingFileData || this.newFileData)){ |
||||||
|
const fullName = this.nameOfFile + "." + this.nameOfExtension; |
||||||
|
let tempData: String = ""; |
||||||
|
if(this.newFile && this.newFileData){ |
||||||
|
tempData = this.newFileData |
||||||
|
} else if(!this.newFile && this.existingFileData){ |
||||||
|
tempData = this.existingFileData |
||||||
|
} |
||||||
|
this.scriptToSend = { |
||||||
|
extension: this.nameOfExtension, |
||||||
|
name: fullName, |
||||||
|
data: tempData, |
||||||
|
} |
||||||
|
this.scriptService.addOneScript(this.scriptToSend).subscribe( |
||||||
|
() => { |
||||||
|
this.router.navigateByUrl('scriptmanagement'); |
||||||
|
}, |
||||||
|
(error: HttpErrorResponse) => { |
||||||
|
alert(error.message) |
||||||
|
}); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
@ -0,0 +1,53 @@ |
|||||||
|
import { Directive, EventEmitter, HostBinding, HostListener, Output } from '@angular/core'; |
||||||
|
|
||||||
|
@Directive({ |
||||||
|
selector: '[appDnd]' |
||||||
|
}) |
||||||
|
export class DndDirective { |
||||||
|
@HostBinding('class.animate-pulse') fileOver: boolean | undefined; |
||||||
|
@Output() fileDropped = new EventEmitter<any>(); |
||||||
|
@Output() textDrop = new EventEmitter<string[]>(); |
||||||
|
listOfContent: string[] = []; |
||||||
|
|
||||||
|
// Dragover listener
|
||||||
|
@HostListener('dragover', ['$event']) onDragOver(evt: any) { |
||||||
|
evt.preventDefault(); |
||||||
|
evt.stopPropagation(); |
||||||
|
this.fileOver = true; |
||||||
|
} |
||||||
|
|
||||||
|
// Dragleave listener
|
||||||
|
@HostListener('dragleave', ['$event']) public onDragLeave(evt: any) { |
||||||
|
evt.preventDefault(); |
||||||
|
evt.stopPropagation(); |
||||||
|
this.fileOver = false; |
||||||
|
} |
||||||
|
|
||||||
|
// Drop listener
|
||||||
|
@HostListener('drop', ['$event']) public ondrop(evt: any) { |
||||||
|
evt.preventDefault(); |
||||||
|
evt.stopPropagation(); |
||||||
|
this.fileOver = false; |
||||||
|
let files = evt.dataTransfer.files; |
||||||
|
if (files.length > 0) { |
||||||
|
this.fileDropped.emit(files); |
||||||
|
// for(let i = 0; i < files.length; i++){
|
||||||
|
// var reader = new FileReader();
|
||||||
|
// console.log(files[i])
|
||||||
|
// reader.readAsText(files[i]);
|
||||||
|
// reader.onload = () => {
|
||||||
|
// this.listOfContent.push(reader.result as string);
|
||||||
|
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
|
||||||
|
// this.textDrop.emit( this.listOfContent);
|
||||||
|
|
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
constructor(){ |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
@ -0,0 +1,30 @@ |
|||||||
|
<div class="my-4"> |
||||||
|
<div class="flex sm:flex-nowrap flex-wrap sm:space-x-4"> |
||||||
|
|
||||||
|
<div class="w-full sm:w-2/3 h-full text-center rounded-lg overflow-hidden shadow-lg bg-white p-4 "> |
||||||
|
<div class="rounded-lg overflow-hidden shadow-lg bg-slate-100 border-solid border-orange-400 border-2"> |
||||||
|
<div class="p-4"> |
||||||
|
<div class="font-bold text-xl text-left mb-2">Contenu du Script : </div> |
||||||
|
<textarea [(ngModel)]="newData" rows="20" class="block p-2.5 w-full text-sm rounded-lg border bg-gray-700 border-gray-600 placeholder-gray-400 text-white focus:ring-orange-400 focus:border-orange-400"> |
||||||
|
</textarea> |
||||||
|
|
||||||
|
|
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
|
||||||
|
<div class="w-full mt-2 sm:mt-0 sm:w-1/3 h-full rounded-lg overflow-hidden shadow-lg bg-white p-4 "> |
||||||
|
<div class="text-xl font-bold pb-2 text-center">Informations du Script :</div> |
||||||
|
<div class="font-bold text-lg">Nom du Script :</div> |
||||||
|
<input [(ngModel)]="newName" type="text" class="block w-full my-2 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-slate-800 focus:border-slate-800" placeholder="Tapez ici..."> |
||||||
|
<div class="font-bold text-lg">Type d'extension :</div> |
||||||
|
<select [(ngModel)]="newExtension" class="mb-4 bg-gray-50 text-sm text-slate-800 rounded-lg focus:ring-slate-800 focus:border-slate-800 block w-full p-2.5" required> |
||||||
|
<option [ngValue]="undefined" disabled>Sélectionner l'extension</option> |
||||||
|
<option *ngFor="let ext of listOfExtension" value="{{ ext }}">{{ ext }}</option> |
||||||
|
|
||||||
|
</select> |
||||||
|
<button (click)="editScript()" type="button" class="text-gray-900 bg-gradient-to-r from-teal-200 to-lime-200 hover:bg-gradient-to-l hover:from-teal-200 hover:to-lime-200 focus:ring-4 focus:outline-none focus:ring-lime-200 font-semibold rounded-lg px-4 py-2 text-center mr-2 mb-2">Modifier le Script</button> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
|
||||||
@ -0,0 +1,52 @@ |
|||||||
|
import { HttpErrorResponse } from '@angular/common/http'; |
||||||
|
import { Component } from '@angular/core'; |
||||||
|
import { Router } from '@angular/router'; |
||||||
|
import { ScriptService } from '../service/script.service'; |
||||||
|
|
||||||
|
@Component({ |
||||||
|
selector: 'app-edit-script', |
||||||
|
templateUrl: './edit-script.component.html', |
||||||
|
styleUrls: ['./edit-script.component.scss'] |
||||||
|
}) |
||||||
|
export class EditScriptComponent { |
||||||
|
defaultName: String | undefined; |
||||||
|
newName: String | undefined; |
||||||
|
newExtension: String | undefined; |
||||||
|
newData: String | undefined; |
||||||
|
listOfExtension : String[] = ["sql", "ps1", "txt", "bat"]; |
||||||
|
|
||||||
|
constructor(private router: Router, |
||||||
|
private scriptService: ScriptService,){ |
||||||
|
const navigation = this.router.getCurrentNavigation(); |
||||||
|
if(navigation){ |
||||||
|
const state = navigation.extras.state as { |
||||||
|
name: string, |
||||||
|
extension: string, |
||||||
|
data: string |
||||||
|
}; |
||||||
|
const splitString = state.name.split("."); |
||||||
|
this.defaultName = state.name; |
||||||
|
this.newName = splitString[0]; |
||||||
|
this.newExtension = state.extension; |
||||||
|
this.newData = state.data; |
||||||
|
console.log(this.defaultName, this.newData) |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
public editScript(){ |
||||||
|
if(this.newExtension && this.newName && this.newData && this.defaultName){ |
||||||
|
const fullName = this.newName + "." + this.newExtension; |
||||||
|
console.log(this.defaultName, fullName, this.newData) |
||||||
|
|
||||||
|
this.scriptService.editScript(this.newData, this.defaultName, fullName).subscribe( |
||||||
|
() => { |
||||||
|
this.router.navigateByUrl('scriptmanagement'); |
||||||
|
}, |
||||||
|
(error: HttpErrorResponse) => { |
||||||
|
alert(error.message) |
||||||
|
}); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
} |
||||||
@ -0,0 +1,5 @@ |
|||||||
|
export interface Script { |
||||||
|
extension: String, |
||||||
|
name: String, |
||||||
|
data: String |
||||||
|
} |
||||||
@ -0,0 +1,48 @@ |
|||||||
|
<div class="max-w-full rounded-2xl overflow-hidden shadow-lg bg-white"> |
||||||
|
<div class="m-2 grid grid-cols-10 gap-4 justify-items-center"> |
||||||
|
<div class="col-span-2 my-auto "> |
||||||
|
<button class="flex text-white bg-gradient-to-br from-purple-600 to-blue-500 hover:bg-gradient-to-bl focus:ring-4 focus:outline-none focus:ring-blue-300 font-semibold py-2 px-4 rounded shadow m-2" (click)="getAllScripts()">Rafraichir</button> |
||||||
|
</div> |
||||||
|
<div class="col-span-6 my-auto text-2xl font-bold"> |
||||||
|
|| Gestionnaire de Scripts || |
||||||
|
</div> |
||||||
|
<div class="col-span-2 my-auto"> |
||||||
|
<a routerLink="/addscript" class="flex text-black bg-gradient-to-r from-red-200 via-red-300 to-yellow-200 hover:bg-gradient-to-bl focus:ring-4 focus:outline-none focus:ring-red-100 dark:focus:ring-red-400 font-semibold py-2 px-4 rounded shadow m-2" >Ajouter un Script</a> |
||||||
|
|
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div class="max-w-full rounded-2xl overflow-hidden shadow-lg bg-white my-4 p-4"> |
||||||
|
<div class="grid grid-cols-3 gap-4"> |
||||||
|
<div class="col-span-2 rounded-lg overflow-hidden shadow-lg bg-slate-100 border-solid border-orange-400 border-2 p-4"> |
||||||
|
<div class="flex space-x-2"> |
||||||
|
<input [(ngModel)]="filterScriptName" type="text" class="block w-full my-2 pl-2 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-slate-800 focus:border-slate-800" placeholder="Rechercher..."> |
||||||
|
<input type="text" class="block w-full my-2 pl-2 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-slate-800 focus:border-slate-800" placeholder="Tags..."> |
||||||
|
</div> |
||||||
|
<div class="overflow-y-auto h-96"> |
||||||
|
<div class="grid grid-cols-2"> |
||||||
|
<div *ngFor="let script of allScripts | filterscript: filterScriptName, index as i" class="grid grid-cols-2 rounded-2xl overflow-hidden shadow-lg bg-gray-300 p-4 m-2 " (click)="displayText(script.data)"> |
||||||
|
<div class="flex justify-start"> |
||||||
|
<div class="font-bold font-mono mr-2 text-lg rounded-full overflow-hidden shadow-lg bg-green-300 p-2"> |
||||||
|
{{script.extension}} |
||||||
|
</div> |
||||||
|
<div class="my-auto font-bold "> |
||||||
|
{{script.name}} |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<div class="my-auto flex justify-end"> |
||||||
|
<mat-icon (click)="editScript(script)" class="text-orange-400 ml-2 hover:cursor-pointer" svgIcon="edit"></mat-icon> |
||||||
|
<mat-icon (click)="deleteSpecifiedScript(script.name)" class="text-red-600 mx-2 hover:cursor-pointer" svgIcon="trash"></mat-icon> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
|
||||||
|
</div> |
||||||
|
<div class="mt-2 text-center p- "> |
||||||
|
<div class="text-xl font-bold pb-2">Contenu du Script :</div> |
||||||
|
<textarea rows="20" class="block p-2.5 w-full text-sm rounded-lg border bg-gray-700 border-gray-600 placeholder-gray-400 text-white focus:ring-orange-400 focus:border-orange-400"> |
||||||
|
{{textTo}}</textarea> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
@ -0,0 +1,81 @@ |
|||||||
|
import { HttpErrorResponse } from '@angular/common/http'; |
||||||
|
import { Component, OnInit } from '@angular/core'; |
||||||
|
import { ScriptService } from '../service/script.service'; |
||||||
|
import { Script } from '../model/script'; |
||||||
|
import { MatIconRegistry } from '@angular/material/icon'; |
||||||
|
import { DomSanitizer } from '@angular/platform-browser'; |
||||||
|
import { Router, NavigationExtras } from '@angular/router'; |
||||||
|
|
||||||
|
|
||||||
|
@Component({ |
||||||
|
selector: 'app-script-management', |
||||||
|
templateUrl: './script-management.component.html', |
||||||
|
styleUrls: ['./script-management.component.scss'] |
||||||
|
}) |
||||||
|
export class ScriptManagementComponent implements OnInit { |
||||||
|
listScript: String[] = ['INNER JOIN', 'LEFT JOIN', 'RIGHT JOIN', 'FULL JOIN', 'LEFT JOIN', 'RIGHT JOIN', 'FULL JOIN', 'LEFT JOIN', 'RIGHT JOIN', 'FULL JOIN', 'LEFT JOIN', 'RIGHT JOIN', 'FULL JOIN']; |
||||||
|
textTo: String | undefined; |
||||||
|
allScripts: Script[] = []; |
||||||
|
filterScriptName: any; |
||||||
|
|
||||||
|
constructor( |
||||||
|
private router: Router, |
||||||
|
private scriptService: ScriptService, |
||||||
|
private matIconRegistry: MatIconRegistry, |
||||||
|
private domSanitizer: DomSanitizer |
||||||
|
){ |
||||||
|
this.matIconRegistry.addSvgIcon('edit', this.domSanitizer.bypassSecurityTrustResourceUrl('../../assets/svg/edit.svg')), |
||||||
|
this.matIconRegistry.addSvgIcon('trash', this.domSanitizer.bypassSecurityTrustResourceUrl('../../assets/svg/trash.svg')) |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
ngOnInit(): void{ |
||||||
|
this.getAllScripts(); |
||||||
|
} |
||||||
|
|
||||||
|
public displayText(text: String){ |
||||||
|
if(this.allScripts){ |
||||||
|
this.textTo = text; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
public editScript(script: Script){ |
||||||
|
const navigationExtras: NavigationExtras = { |
||||||
|
state: { |
||||||
|
name: script.name, |
||||||
|
extension: script.extension, |
||||||
|
data: script.data |
||||||
|
} |
||||||
|
}; |
||||||
|
this.router.navigate(['editscript'], navigationExtras); |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
public getAllScripts(){ |
||||||
|
this.scriptService.retreiveScripts().subscribe( |
||||||
|
(response : Script[]) => { |
||||||
|
this.allScripts = response; |
||||||
|
}, |
||||||
|
(error: HttpErrorResponse) => { |
||||||
|
alert(error.message) |
||||||
|
} |
||||||
|
); |
||||||
|
} |
||||||
|
|
||||||
|
public deleteSpecifiedScript(name: String){ |
||||||
|
if(window.confirm('Êtes-vous sûr de vouloir supprimer ce Script ?')){ |
||||||
|
this.scriptService.deleteScript(name).subscribe( |
||||||
|
() => { |
||||||
|
this.getAllScripts(); |
||||||
|
this.textTo = undefined; |
||||||
|
}, |
||||||
|
(error: HttpErrorResponse) => { |
||||||
|
alert(error.message) |
||||||
|
} |
||||||
|
); |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
} |
||||||
@ -0,0 +1,32 @@ |
|||||||
|
import { Injectable } from '@angular/core'; |
||||||
|
import { environment } from '../../environments/environment.development'; |
||||||
|
import { HttpClient, HttpParams } from '@angular/common/http'; |
||||||
|
import { Observable } from 'rxjs'; |
||||||
|
import { Script } from '../model/script'; |
||||||
|
|
||||||
|
@Injectable({ |
||||||
|
providedIn: 'root' |
||||||
|
}) |
||||||
|
export class ScriptService { |
||||||
|
private apiServerUrl = environment.apiBaseUrl; |
||||||
|
|
||||||
|
constructor(private http: HttpClient) { } |
||||||
|
|
||||||
|
public retreiveScripts(): Observable<Script[]>{ |
||||||
|
return this.http.get<Script[]>(`${this.apiServerUrl}/api/scripts`); |
||||||
|
} |
||||||
|
|
||||||
|
public deleteScript(name: String){ |
||||||
|
return this.http.delete<void>(`${this.apiServerUrl}/api/script/delete/${name}`); |
||||||
|
} |
||||||
|
|
||||||
|
public addOneScript(script: Script){ |
||||||
|
const paramsAddScript = new HttpParams().set('content', script.data.toString()).set('name', script.name.toString()); |
||||||
|
return this.http.get<void>(`${this.apiServerUrl}/api/script/add`, {params: paramsAddScript}); |
||||||
|
} |
||||||
|
|
||||||
|
public editScript(content: String, defaultName: String, newName: String){ |
||||||
|
const paramsAddScript = new HttpParams().set('content', content.toString()).set('defaultname', defaultName.toString()).set('newname', newName.toString()); |
||||||
|
return this.http.get<void>(`${this.apiServerUrl}/api/script/edit`, {params: paramsAddScript}); |
||||||
|
} |
||||||
|
} |
||||||
|
After Width: | Height: | Size: 749 B |
|
After Width: | Height: | Size: 502 B |
|
After Width: | Height: | Size: 675 B |
Loading…
Reference in new issue