self-hosted/pigallery2
1
0
Fork 0
mirror of https://github.com/bpatrik/pigallery2.git synced 2024-12-23 01:27:14 +02:00
Code Issues Releases Activity

Add confirming popup for jobs #764

Browse Source
This commit is contained in:
Patrik J. Braun 2024-01-03 11:24:35 +01:00
parent 13e828d210
commit dccd9c30e1
2 changed files with 64 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
src/frontend/app/ui/settings/workflow/button/job-button.settings.component.html
View File

@ -4,9 +4,9 @@
i18n-title
*ngIf="!Running"
[disabled]="disabled || jobsService.jobStartingStopping[jobName]"
(click)="start();">
(click)="openModal(jobRunModal);">
<span class="me-2" *ngIf="!shortName"><ng-container
i18n>Run now</ng-container>: {{backendTextService.getJobName(jobName)}}</span>
i18n>Run now</ng-container>: {{ backendTextService.getJobName(jobName) }}</span>
<ng-icon name="ionPlayOutline"></ng-icon>
</button>
<button class="btn btn-secondary"
@ -15,5 +15,36 @@
(click)="stop();">
<ng-icon name="ionStopOutline"></ng-icon>
<span class="ms-2" *ngIf="!shortName"><ng-container
i18n>Cancel</ng-container>: {{backendTextService.getJobName(jobName)}}</span>
i18n>Cancel</ng-container>: {{ backendTextService.getJobName(jobName) }}</span>
</button>
<ng-template #jobRunModal>
<!-- job running Modal-->
<div class="modal-header">
<h5 class="modal-title" i18n>Do you want to run {{ backendTextService.getJobName(jobName) }}?</h5>
<button type="button" class="btn-close" (click)="hideModal()" data-dismiss="modal" aria-label="Close">
</button>
</div>
<div class="modal-body">
<span i18n>Are you sue you want to run this job? This will have the following effect:</span>
<div class="alert alert-secondary" role="alert">
{{ backendTextService.getJobDescription(jobName) }}
</div>
</div>
<div class="modal-footer">
<div class="btn-group float-end row" style="display: block">
<div class="pe-0">
<button class="btn btn-secondary me-2" type="button"
(click)="hideModal()">
<ng-container i18n>Cancel</ng-container>
</button>
<button class="btn {{danger ? 'btn-danger': 'btn-success'}}" type="button"
(click)="start(); hideModal();">
<ng-container i18n>Run now</ng-container>
<ng-icon name="ionPlayOutline" class="ms-1"></ng-icon>
</button>
</div>
</div>
</div>
</ng-template>

31
src/frontend/app/ui/settings/workflow/button/job-button.settings.component.ts
View File

@ -1,10 +1,13 @@
import {Component, EventEmitter, Input, Output} from '@angular/core';
import {Component, EventEmitter, Input, Output, TemplateRef} from '@angular/core';
import {JobProgressStates, OnTimerJobProgressDTO,} from '../../../../../../common/entities/job/JobProgressDTO';
import {ErrorDTO} from '../../../../../../common/entities/Error';
import {ScheduledJobsService} from '../../scheduled-jobs.service';
import {NotificationService} from '../../../../model/notification.service';
import {JobDTOUtils} from '../../../../../../common/entities/job/JobDTO';
import {BackendtextService} from '../../../../model/backendtext.service';
import {BsModalRef} from 'ngx-bootstrap/modal';
import {BsModalService} from '../../../../../../../node_modules/ngx-bootstrap/modal';
import {ConfigStyle} from '../../settings.service';
@Component({
selector: 'app-settings-job-button',
@ -21,10 +24,12 @@ export class JobButtonComponent {
@Input() danger = false;
JobProgressStates = JobProgressStates;
@Output() jobError = new EventEmitter<string>();
private modalRef: BsModalRef;
constructor(
private notification: NotificationService,
public jobsService: ScheduledJobsService,
private modalService: BsModalService,
public backendTextService: BackendtextService
) {
}
@ -54,6 +59,28 @@ export class JobButtonComponent {
];
}
public hideModal(): void {
this.modalRef.hide();
this.modalRef = null;
}
public async openModal(template: TemplateRef<unknown>): Promise<void> {
// if we show the button in short form (at the jobs settings),
// we assume users know what they are doing,
// so we do not show a confirm window.
if(this.shortName){
await this.start();
return;
}
this.modalRef = this.modalService.show(template, {
class: 'modal-lg',
});
document.body.style.paddingRight = '0px';
}
public async start(): Promise<boolean> {
this.jobError.emit('');
this.populateConfig();
@ -98,6 +125,8 @@ export class JobButtonComponent {
}
return false;
}
protected readonly ConfigStyle = ConfigStyle;
}