feat: add schedule files upload
This commit is contained in:
@ -73,4 +73,17 @@ export class ScheduleService extends ApiService {
|
|||||||
|
|
||||||
return this.addAuth(request).post<any>(request);
|
return this.addAuth(request).post<any>(request);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
public uploadScheduleFile(files: File[], force: boolean) {
|
||||||
|
const formData = new FormData();
|
||||||
|
files.forEach(file => formData.append('files', file, file.name));
|
||||||
|
|
||||||
|
const request = this.createRequestBuilder()
|
||||||
|
.setEndpoint('Upload')
|
||||||
|
.setData(formData)
|
||||||
|
.setQueryParams({force: force})
|
||||||
|
.build;
|
||||||
|
|
||||||
|
return this.addAuth(request).post(request);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
@ -0,0 +1,28 @@
|
|||||||
|
<app-configuration-card
|
||||||
|
[title]="'Загрузка расписания Excel'"
|
||||||
|
[isSaveEnabled]="selectedFiles.length > 0"
|
||||||
|
[saveFunction]="saveFunction()"
|
||||||
|
(onSaveFunction)="onUpload($event)">
|
||||||
|
|
||||||
|
<input type="file" #fileInput (change)="onFileSelected($event)" multiple accept=".xlsx, .xls" style="display: none;">
|
||||||
|
|
||||||
|
@if (fileLoading) {
|
||||||
|
<app-data-spinner/>
|
||||||
|
} @else {
|
||||||
|
<button mat-raised-button color="primary" (click)="onFileChooseClick()">
|
||||||
|
Выберите файлы
|
||||||
|
<mat-icon>attach_file</mat-icon>
|
||||||
|
</button>
|
||||||
|
}
|
||||||
|
|
||||||
|
@if (selectedFiles.length > 0) {
|
||||||
|
<div style="margin-top: 15px;">
|
||||||
|
<p>Выбранные файлы:</p>
|
||||||
|
<ul>
|
||||||
|
@for (file of selectedFiles; track $index) {
|
||||||
|
<li>{{ file.name }}</li>
|
||||||
|
}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
</app-configuration-card>
|
@ -0,0 +1,57 @@
|
|||||||
|
import {Component, ElementRef, Input, ViewChild} from '@angular/core';
|
||||||
|
import {ConfigurationCardComponent} from "@component/admin/configuration-card/configuration-card.component";
|
||||||
|
import {MatDialog} from "@angular/material/dialog";
|
||||||
|
import {
|
||||||
|
ConfirmDeleteScheduleDialogComponent
|
||||||
|
} from "@component/admin/confirm-delete-schedule-dialog/confirm-delete-schedule-dialog.component";
|
||||||
|
import {Observable, of, switchMap} from "rxjs";
|
||||||
|
import {MatButtonModule} from "@angular/material/button";
|
||||||
|
import {MatIcon} from "@angular/material/icon";
|
||||||
|
import {ScheduleService} from "@api/v1/configuration/schedule.service";
|
||||||
|
import {DataSpinnerComponent} from "@component/common/data-spinner/data-spinner.component";
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'app-schedule-file-upload',
|
||||||
|
imports: [
|
||||||
|
ConfigurationCardComponent,
|
||||||
|
MatButtonModule,
|
||||||
|
MatIcon,
|
||||||
|
DataSpinnerComponent
|
||||||
|
],
|
||||||
|
templateUrl: './schedule-file-upload.component.html',
|
||||||
|
providers: [ScheduleService]
|
||||||
|
})
|
||||||
|
export class ScheduleFileUploadComponent {
|
||||||
|
selectedFiles: File[] = [];
|
||||||
|
fileLoading: boolean = false;
|
||||||
|
@ViewChild('fileInput') input!: ElementRef;
|
||||||
|
|
||||||
|
constructor(private dialog: MatDialog, private api: ScheduleService) {
|
||||||
|
}
|
||||||
|
|
||||||
|
protected saveFunction() {
|
||||||
|
return () => {
|
||||||
|
const dialogRef = this.dialog.open(ConfirmDeleteScheduleDialogComponent);
|
||||||
|
|
||||||
|
return dialogRef.afterClosed().pipe(switchMap(result => {
|
||||||
|
return this.api.uploadScheduleFile(this.selectedFiles, result);
|
||||||
|
}));
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
onFileChooseClick() {
|
||||||
|
this.fileLoading = true;
|
||||||
|
this.input.nativeElement.click();
|
||||||
|
}
|
||||||
|
|
||||||
|
onFileSelected(event: any): void {
|
||||||
|
this.fileLoading = false;
|
||||||
|
this.selectedFiles = Array.from(event.target.files);
|
||||||
|
}
|
||||||
|
|
||||||
|
onUpload(data: Observable<any>): void {
|
||||||
|
data.subscribe(_ => {
|
||||||
|
this.selectedFiles = [];
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
Reference in New Issue
Block a user