@newheap/platform-common 1.1.0 → 1.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -56,6 +56,7 @@ class UserNotificationNhCommonModuleConfig {
|
|
|
56
56
|
class BackgroundOperationsNhCommonModuleConfig {
|
|
57
57
|
constructor(init) {
|
|
58
58
|
this.urlSuffix = '/background-operations';
|
|
59
|
+
this.administrationUrlSuffix = '/background-operations/administration';
|
|
59
60
|
this.hubUrlSuffix = '/hub/background-operations';
|
|
60
61
|
this.pollingInterval = 5000;
|
|
61
62
|
this.liveUpdatesEnabled = true;
|
|
@@ -623,6 +624,17 @@ class NhUserNotificationCollectionHttpRequestOptions extends CollectionHttpReque
|
|
|
623
624
|
Object.assign(this, init);
|
|
624
625
|
}
|
|
625
626
|
}
|
|
627
|
+
function nhUserNotificationSeverityName(severity) {
|
|
628
|
+
if (typeof severity === 'string') {
|
|
629
|
+
return severity;
|
|
630
|
+
}
|
|
631
|
+
return {
|
|
632
|
+
0: 'Information',
|
|
633
|
+
10: 'Success',
|
|
634
|
+
20: 'Warning',
|
|
635
|
+
30: 'Error'
|
|
636
|
+
}[severity ?? 0] ?? 'Information';
|
|
637
|
+
}
|
|
626
638
|
class NhUserNotificationState {
|
|
627
639
|
constructor(init) {
|
|
628
640
|
this.overview = new NhUserNotificationOverview();
|
|
@@ -646,6 +658,9 @@ class NhUserNotification {
|
|
|
646
658
|
this.lastTitle = '';
|
|
647
659
|
this.lastMessage = '';
|
|
648
660
|
this.isLastRead = false;
|
|
661
|
+
this.category = null;
|
|
662
|
+
this.severity = 'Information';
|
|
663
|
+
this.groupKey = null;
|
|
649
664
|
this.data = new NhUserNotificationData();
|
|
650
665
|
Object.assign(this, init);
|
|
651
666
|
}
|
|
@@ -657,6 +672,7 @@ class NhUserNotificationMessage {
|
|
|
657
672
|
this.lastModifiedDateTime = '';
|
|
658
673
|
this.title = '';
|
|
659
674
|
this.message = '';
|
|
675
|
+
this.severity = 'Information';
|
|
660
676
|
this.userNotificationId = '';
|
|
661
677
|
Object.assign(this, init);
|
|
662
678
|
}
|
|
@@ -675,6 +691,12 @@ class NhBackgroundOperationCollectionHttpRequestOptions extends CollectionHttpRe
|
|
|
675
691
|
Object.assign(this, init);
|
|
676
692
|
}
|
|
677
693
|
}
|
|
694
|
+
class NhBackgroundOperationAdministrationCollectionHttpRequestOptions extends CollectionHttpRequestOptions {
|
|
695
|
+
constructor(init) {
|
|
696
|
+
super(init);
|
|
697
|
+
Object.assign(this, init);
|
|
698
|
+
}
|
|
699
|
+
}
|
|
678
700
|
function nhBackgroundOperationStatusName(status) {
|
|
679
701
|
if (typeof status === 'string') {
|
|
680
702
|
return status;
|
|
@@ -5460,6 +5482,49 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.28", ngImpo
|
|
|
5460
5482
|
args: [{ providedIn: 'root' }]
|
|
5461
5483
|
}] });
|
|
5462
5484
|
|
|
5485
|
+
/**
|
|
5486
|
+
* Client for the cross-owner background-operation administration endpoints. The
|
|
5487
|
+
* server enables them with `UseAdministrationPolicy` and authorizes every request
|
|
5488
|
+
* against that policy; the active division scopes the visible operations. The
|
|
5489
|
+
* administration view does not receive owner-scoped live updates, so refresh it
|
|
5490
|
+
* by polling.
|
|
5491
|
+
*/
|
|
5492
|
+
class NhBackgroundOperationAdministrationService {
|
|
5493
|
+
constructor() {
|
|
5494
|
+
this.config = inject(NhCommonModuleConfig);
|
|
5495
|
+
this.api = inject(NhApiService);
|
|
5496
|
+
this.baseUrl = this.joinUrl(this.config.apiBaseUrl, this.config.backgroundOperations.administrationUrlSuffix);
|
|
5497
|
+
}
|
|
5498
|
+
list(request = new NhBackgroundOperationAdministrationCollectionHttpRequestOptions({
|
|
5499
|
+
page: 1,
|
|
5500
|
+
itemsPerPage: this.config.backgroundOperations.listPageSize
|
|
5501
|
+
})) {
|
|
5502
|
+
return this.api.getCollection(this.baseUrl, request);
|
|
5503
|
+
}
|
|
5504
|
+
get(operationId, eventsAfterSequence) {
|
|
5505
|
+
let params = new HttpParams();
|
|
5506
|
+
if (eventsAfterSequence !== undefined) {
|
|
5507
|
+
params = params.set('eventsAfterSequence', eventsAfterSequence.toString());
|
|
5508
|
+
}
|
|
5509
|
+
return this.api.get(`${this.baseUrl}/${encodeURIComponent(operationId)}`, new HttpRequestOptions({ params }));
|
|
5510
|
+
}
|
|
5511
|
+
cancel(operationId) {
|
|
5512
|
+
return this.api.post(`${this.baseUrl}/${encodeURIComponent(operationId)}/cancel`, {});
|
|
5513
|
+
}
|
|
5514
|
+
retry(operationId) {
|
|
5515
|
+
return this.api.post(`${this.baseUrl}/${encodeURIComponent(operationId)}/retry`, {});
|
|
5516
|
+
}
|
|
5517
|
+
joinUrl(base, suffix) {
|
|
5518
|
+
return `${base.replace(/\/$/, '')}/${suffix.replace(/^\//, '')}`;
|
|
5519
|
+
}
|
|
5520
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0, type: NhBackgroundOperationAdministrationService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
5521
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0, type: NhBackgroundOperationAdministrationService, providedIn: 'root' }); }
|
|
5522
|
+
}
|
|
5523
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0, type: NhBackgroundOperationAdministrationService, decorators: [{
|
|
5524
|
+
type: Injectable,
|
|
5525
|
+
args: [{ providedIn: 'root' }]
|
|
5526
|
+
}] });
|
|
5527
|
+
|
|
5463
5528
|
class NhBackgroundOperationLiveUpdateService {
|
|
5464
5529
|
constructor(config, auth, app) {
|
|
5465
5530
|
this.config = config;
|
|
@@ -8153,11 +8218,11 @@ class NhBackgroundOperationProgressComponent {
|
|
|
8153
8218
|
&& ['Failed', 'Cancelled', 'TimedOut'].includes(nhBackgroundOperationStatusName(operation.status));
|
|
8154
8219
|
}
|
|
8155
8220
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0, type: NhBackgroundOperationProgressComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8156
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.28", type: NhBackgroundOperationProgressComponent, isStandalone: true, selector: "nh-background-operation-progress", inputs: { operation: "operation", showEvents: "showEvents", showActions: "showActions" }, outputs: { cancelRequested: "cancelRequested", retryRequested: "retryRequested" }, ngImport: i0, template: "<section class=\"nh-operation\" [attr.data-status]=\"statusKey(operation.status)\">\n <header class=\"nh-operation__header\">\n <div>\n <p class=\"nh-operation__eyebrow\">{{ 'nh-background-operations.operation' | translate }}</p>\n <h2>{{ operation.operationType }}</h2>\n </div>\n <span class=\"nh-operation__status\">{{ statusKey(operation.status) | translate }}</span>\n </header>\n\n <div class=\"nh-operation__overall\">\n <div class=\"nh-operation__progress-label\">\n <span>{{ operation.progressMessageKey ? (operation.progressMessageKey | translate: arguments(operation.progressMessageArgumentsJson)) : ('nh-background-operations.progress' | translate) }}</span>\n <strong>{{ percentage(operation.progressPercentage) | number:'1.0-1' }}%</strong>\n </div>\n <div class=\"nh-operation__progress\" role=\"progressbar\"\n [attr.aria-label]=\"'nh-background-operations.overall-progress' | translate\"\n aria-valuemin=\"0\" aria-valuemax=\"100\"\n [attr.aria-valuenow]=\"percentage(operation.progressPercentage)\">\n <span [style.width.%]=\"percentage(operation.progressPercentage)\"></span>\n </div>\n </div>\n\n @if (showActions && (canCancel(operation.status) || canRetry(operation))) {\n <div class=\"nh-operation__actions\">\n @if (canCancel(operation.status)) {\n <button type=\"button\" (click)=\"cancelRequested.emit(operation.id)\">\n {{ 'nh-background-operations.cancel' | translate }}\n </button>\n }\n @if (canRetry(operation)) {\n <button type=\"button\" (click)=\"retryRequested.emit(operation.id)\">\n {{ 'nh-background-operations.retry' | translate }}\n </button>\n }\n </div>\n }\n\n <div class=\"nh-operation__steps\" role=\"list\" [attr.aria-label]=\"'nh-background-operations.steps' | translate\">\n <ng-template #renderStep let-step let-depth=\"depth\">\n <article class=\"nh-step\" role=\"listitem\" [style.--nh-step-depth]=\"depth\">\n <div class=\"nh-step__heading\">\n <div>\n <strong>{{ stepTitle(step) | translate: arguments(step.titleArgumentsJson) }}</strong>\n @if (step.messageKey) {\n <span>{{ step.messageKey | translate: arguments(step.messageArgumentsJson) }}</span>\n }\n </div>\n <span class=\"nh-step__status\">{{ stepStatusKey(step.status) | translate }}</span>\n </div>\n <div class=\"nh-step__progress\" role=\"progressbar\"\n [attr.aria-label]=\"stepTitle(step) | translate: arguments(step.titleArgumentsJson)\"\n aria-valuemin=\"0\" aria-valuemax=\"100\"\n [attr.aria-valuenow]=\"percentage(step.percentage)\">\n <span [style.width.%]=\"percentage(step.percentage)\"></span>\n </div>\n @if (hasBatch(step)) {\n <dl class=\"nh-step__batch\">\n <div><dt>{{ 'nh-background-operations.batch.processed' | translate }}</dt><dd>{{ step.processedItems }} / {{ step.discoveredItems }}</dd></div>\n <div><dt>{{ 'nh-background-operations.batch.succeeded' | translate }}</dt><dd>{{ step.succeededItems }}</dd></div>\n <div><dt>{{ 'nh-background-operations.batch.failed' | translate }}</dt><dd>{{ step.failedItems }}</dd></div>\n <div><dt>{{ 'nh-background-operations.batch.skipped' | translate }}</dt><dd>{{ step.skippedItems }}</dd></div>\n @if (step.retriedItems > 0) {\n <div><dt>{{ 'nh-background-operations.batch.retried' | translate }}</dt><dd>{{ step.retriedItems }}</dd></div>\n }\n @if (step.activeItems > 0) {\n <div><dt>{{ 'nh-background-operations.batch.active' | translate }}</dt><dd>{{ step.activeItems }}</dd></div>\n }\n </dl>\n }\n </article>\n @for (child of step.children; track child.id) {\n <ng-container *ngTemplateOutlet=\"renderStep; context: {$implicit: child, depth: depth + 1}\"></ng-container>\n }\n </ng-template>\n\n @for (step of operation.steps; track step.id) {\n <ng-container *ngTemplateOutlet=\"renderStep; context: {$implicit: step, depth: 0}\"></ng-container>\n } @empty {\n <p class=\"nh-operation__empty\">{{ 'nh-background-operations.no-steps' | translate }}</p>\n }\n </div>\n\n @if (operation.children.length > 0) {\n <section class=\"nh-operation__children\">\n <h3>{{ 'nh-background-operations.children' | translate }}</h3>\n <div role=\"list\" [attr.aria-label]=\"'nh-background-operations.children' | translate\">\n <ng-template #renderChild let-child let-depth=\"depth\">\n <article class=\"nh-child\" role=\"listitem\" [style.--nh-child-depth]=\"depth\">\n <div class=\"nh-child__heading\">\n <div>\n <strong>{{ childLabel(child) }}</strong>\n <span>{{ child.operationType }}</span>\n </div>\n <span class=\"nh-child__status\">{{ statusKey(child.status) | translate }}</span>\n </div>\n <div class=\"nh-step__progress\" role=\"progressbar\"\n [attr.aria-label]=\"childLabel(child)\"\n aria-valuemin=\"0\" aria-valuemax=\"100\"\n [attr.aria-valuenow]=\"percentage(child.progressPercentage)\">\n <span [style.width.%]=\"percentage(child.progressPercentage)\"></span>\n </div>\n @if (child.resultUrl) {\n <a [href]=\"child.resultUrl\">{{ 'nh-background-operations.open-result' | translate }}</a>\n }\n </article>\n @for (nestedChild of child.children; track nestedChild.id) {\n <ng-container *ngTemplateOutlet=\"renderChild; context: {$implicit: nestedChild, depth: depth + 1}\"></ng-container>\n }\n </ng-template>\n\n @for (child of operation.children; track child.id) {\n <ng-container *ngTemplateOutlet=\"renderChild; context: {$implicit: child, depth: 0}\"></ng-container>\n }\n </div>\n </section>\n }\n\n @if (showEvents && operation.events.length > 0) {\n <section class=\"nh-operation__events\">\n <h3>{{ 'nh-background-operations.activity' | translate }}</h3>\n <ol>\n @for (event of operation.events; track event.id) {\n @if (event.messageKey) {\n <li>\n <time [attr.datetime]=\"event.creationDateTime\">{{ event.creationDateTime | date:'short' }}</time>\n <span>{{ event.messageKey | translate: arguments(event.messageArgumentsJson) }}</span>\n @if (event.resultUrl) {\n <a [href]=\"event.resultUrl\">{{ 'nh-background-operations.open-result' | translate }}</a>\n }\n </li>\n }\n }\n </ol>\n </section>\n }\n</section>\n", styles: [":host{display:block;color:var(--nh-color-text, #fff)}.nh-operation{display:grid;gap:1rem;padding:1rem;border:1px solid var(--nh-color-border, rgba(255, 255, 255, .14));border-radius:1rem;background:var(--nh-color-surface, #101827)}.nh-operation__header,.nh-step__heading,.nh-child__heading,.nh-operation__progress-label,.nh-operation__actions{display:flex;align-items:center;justify-content:space-between;gap:.75rem}.nh-operation__header h2,.nh-operation__events h3,.nh-operation__children h3,.nh-operation__eyebrow,.nh-step__heading span,.nh-step__batch,.nh-operation__events ol{margin:0}.nh-operation__eyebrow{color:var(--nh-color-muted, #9aa8bc);font-size:.75rem;letter-spacing:.06em;text-transform:uppercase}.nh-operation__status,.nh-step__status{flex:none;padding:.25rem .5rem;border-radius:.4rem;background:var(--nh-color-status-background, rgba(2, 41, 98, .75));font-size:.75rem}.nh-operation__progress,.nh-step__progress{overflow:hidden;height:.5rem;border-radius:.25rem;background:var(--nh-color-progress-track, rgba(255, 255, 255, .1))}.nh-operation__progress span,.nh-step__progress span{display:block;height:100%;background:var(--nh-color-progress, #ff6700);transition:width .18s ease-out}.nh-operation__steps{display:grid;gap:.625rem}.nh-operation__children,.nh-operation__children>div{display:grid;gap:.625rem}.nh-child{display:grid;gap:.5rem;margin-inline-start:min(var(--nh-child-depth) * 1rem,3rem);padding:.75rem;border:1px solid var(--nh-color-border, rgba(255, 255, 255, .14));border-radius:.5rem;background:var(--nh-color-surface-subtle, rgba(255, 255, 255, .035))}.nh-child__heading{display:flex;align-items:center;justify-content:space-between;gap:.75rem}.nh-child__heading>div{display:grid;gap:.125rem}.nh-child__heading span{color:var(--nh-color-muted, #9aa8bc);font-size:.8rem}.nh-child__status{flex:none;padding:.25rem .5rem;border-radius:.4rem;background:var(--nh-color-status-background, rgba(2, 41, 98, .75));color:var(--nh-color-text, #fff);font-size:.75rem}.nh-child a{justify-self:start}.nh-step{display:grid;gap:.5rem;margin-inline-start:calc(var(--nh-step-depth) * 1rem);padding:.75rem;border-inline-start:2px solid var(--nh-color-progress, #ff6700);background:var(--nh-color-surface-subtle, rgba(255, 255, 255, .035))}.nh-step__heading>div{display:grid;gap:.125rem}.nh-step__heading span{color:var(--nh-color-muted, #9aa8bc);font-size:.8rem}.nh-step__batch{display:flex;flex-wrap:wrap;gap:.5rem 1rem;color:var(--nh-color-muted, #9aa8bc);font-size:.75rem}.nh-step__batch div{display:flex;gap:.25rem}.nh-step__batch dd{margin:0;color:var(--nh-color-text, #fff)}.nh-operation__actions{justify-content:flex-end}.nh-operation__actions button{min-height:2.25rem;padding:.4rem .75rem;border:1px solid var(--nh-color-border, rgba(255, 255, 255, .2));border-radius:.5rem;color:inherit;background:transparent}.nh-operation__actions button:focus-visible,.nh-child a:focus-visible,.nh-operation__events a:focus-visible{outline:2px solid var(--nh-color-progress, #ff6700);outline-offset:2px}.nh-operation__events ol{display:grid;gap:.5rem;padding:0;list-style:none}.nh-operation__events li{display:grid;grid-template-columns:minmax(7rem,auto) 1fr auto;gap:.75rem;color:var(--nh-color-muted, #9aa8bc);font-size:.8rem}.nh-operation__events li span{color:var(--nh-color-text, #fff)}@media(prefers-reduced-motion:reduce){.nh-operation__progress span,.nh-step__progress span{transition:none}}@media(max-width:40rem){.nh-operation__header,.nh-step__heading,.nh-child__heading,.nh-operation__events li{align-items:flex-start;grid-template-columns:1fr}.nh-operation__header,.nh-step__heading{flex-direction:column}.nh-child__heading{align-items:flex-start;flex-direction:column}.nh-step{margin-inline-start:min(var(--nh-step-depth) * .5rem,1.5rem)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$3.DecimalPipe, name: "number" }, { kind: "pipe", type: i1$3.DatePipe, name: "date" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
8221
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.28", type: NhBackgroundOperationProgressComponent, isStandalone: true, selector: "nh-background-operation-progress", inputs: { operation: "operation", showEvents: "showEvents", showActions: "showActions" }, outputs: { cancelRequested: "cancelRequested", retryRequested: "retryRequested" }, ngImport: i0, template: "<section class=\"nh-operation\" [attr.data-status]=\"statusKey(operation.status)\">\n <header class=\"nh-operation__header\">\n <div>\n <p class=\"nh-operation__eyebrow\">{{ 'nh-background-operations.operation' | translate }}</p>\n <h2>{{ operation.operationType }}</h2>\n </div>\n <span class=\"nh-operation__status\">{{ statusKey(operation.status) | translate }}</span>\n </header>\n\n <div class=\"nh-operation__overall\">\n <div class=\"nh-operation__progress-label\">\n <span>{{ operation.progressMessageKey ? (operation.progressMessageKey | translate: arguments(operation.progressMessageArgumentsJson)) : ('nh-background-operations.progress' | translate) }}</span>\n <strong>{{ percentage(operation.progressPercentage) | number:'1.0-1' }}%</strong>\n </div>\n <div class=\"nh-operation__progress\" role=\"progressbar\"\n [attr.aria-label]=\"'nh-background-operations.overall-progress' | translate\"\n aria-valuemin=\"0\" aria-valuemax=\"100\"\n [attr.aria-valuenow]=\"percentage(operation.progressPercentage)\">\n <span [style.width.%]=\"percentage(operation.progressPercentage)\"></span>\n </div>\n </div>\n\n @if (showActions && (canCancel(operation.status) || canRetry(operation))) {\n <div class=\"nh-operation__actions\">\n @if (canCancel(operation.status)) {\n <button type=\"button\" (click)=\"cancelRequested.emit(operation.id)\">\n {{ 'nh-background-operations.cancel' | translate }}\n </button>\n }\n @if (canRetry(operation)) {\n <button type=\"button\" (click)=\"retryRequested.emit(operation.id)\">\n {{ 'nh-background-operations.retry' | translate }}\n </button>\n }\n </div>\n }\n\n <div class=\"nh-operation__steps\" role=\"list\" [attr.aria-label]=\"'nh-background-operations.steps' | translate\">\n <ng-template #renderStep let-step let-depth=\"depth\">\n <article class=\"nh-step\" role=\"listitem\" [style.--nh-step-depth]=\"depth\">\n <div class=\"nh-step__heading\">\n <div>\n <strong>{{ stepTitle(step) | translate: arguments(step.titleArgumentsJson) }}</strong>\n @if (step.messageKey) {\n <span>{{ step.messageKey | translate: arguments(step.messageArgumentsJson) }}</span>\n }\n </div>\n <span class=\"nh-step__status\">{{ stepStatusKey(step.status) | translate }}</span>\n </div>\n <div class=\"nh-step__progress\" role=\"progressbar\"\n [attr.aria-label]=\"stepTitle(step) | translate: arguments(step.titleArgumentsJson)\"\n aria-valuemin=\"0\" aria-valuemax=\"100\"\n [attr.aria-valuenow]=\"percentage(step.percentage)\">\n <span [style.width.%]=\"percentage(step.percentage)\"></span>\n </div>\n @if (hasBatch(step)) {\n <dl class=\"nh-step__batch\">\n <div><dt>{{ 'nh-background-operations.batch.processed' | translate }}</dt><dd>{{ step.processedItems }} / {{ step.discoveredItems }}</dd></div>\n <div><dt>{{ 'nh-background-operations.batch.succeeded' | translate }}</dt><dd>{{ step.succeededItems }}</dd></div>\n <div><dt>{{ 'nh-background-operations.batch.failed' | translate }}</dt><dd>{{ step.failedItems }}</dd></div>\n <div><dt>{{ 'nh-background-operations.batch.skipped' | translate }}</dt><dd>{{ step.skippedItems }}</dd></div>\n @if (step.retriedItems > 0) {\n <div><dt>{{ 'nh-background-operations.batch.retried' | translate }}</dt><dd>{{ step.retriedItems }}</dd></div>\n }\n @if (step.activeItems > 0) {\n <div><dt>{{ 'nh-background-operations.batch.active' | translate }}</dt><dd>{{ step.activeItems }}</dd></div>\n }\n </dl>\n }\n </article>\n @for (child of step.children; track child.id) {\n <ng-container *ngTemplateOutlet=\"renderStep; context: {$implicit: child, depth: depth + 1}\"></ng-container>\n }\n </ng-template>\n\n @for (step of operation.steps; track step.id) {\n <ng-container *ngTemplateOutlet=\"renderStep; context: {$implicit: step, depth: 0}\"></ng-container>\n } @empty {\n <p class=\"nh-operation__empty\">{{ 'nh-background-operations.no-steps' | translate }}</p>\n }\n </div>\n\n @if (operation.children.length > 0) {\n <section class=\"nh-operation__children\">\n <h3>{{ 'nh-background-operations.children' | translate }}</h3>\n <div role=\"list\" [attr.aria-label]=\"'nh-background-operations.children' | translate\">\n <ng-template #renderChild let-child let-depth=\"depth\">\n <article class=\"nh-child\" role=\"listitem\" [style.--nh-child-depth]=\"depth\">\n <div class=\"nh-child__heading\">\n <div>\n <strong>{{ childLabel(child) }}</strong>\n <span>{{ child.operationType }}</span>\n </div>\n <span class=\"nh-child__status\">{{ statusKey(child.status) | translate }}</span>\n </div>\n <div class=\"nh-step__progress\" role=\"progressbar\"\n [attr.aria-label]=\"childLabel(child)\"\n aria-valuemin=\"0\" aria-valuemax=\"100\"\n [attr.aria-valuenow]=\"percentage(child.progressPercentage)\">\n <span [style.width.%]=\"percentage(child.progressPercentage)\"></span>\n </div>\n @if (child.resultUrl) {\n <a [href]=\"child.resultUrl\">{{ 'nh-background-operations.open-result' | translate }}</a>\n }\n </article>\n @for (nestedChild of child.children; track nestedChild.id) {\n <ng-container *ngTemplateOutlet=\"renderChild; context: {$implicit: nestedChild, depth: depth + 1}\"></ng-container>\n }\n </ng-template>\n\n @for (child of operation.children; track child.id) {\n <ng-container *ngTemplateOutlet=\"renderChild; context: {$implicit: child, depth: 0}\"></ng-container>\n }\n </div>\n </section>\n }\n\n @if (showEvents && operation.events.length > 0) {\n <section class=\"nh-operation__events\">\n <h3>{{ 'nh-background-operations.activity' | translate }}</h3>\n <ol>\n @for (event of operation.events; track event.id) {\n @if (event.messageKey) {\n <li [class.nh-operation__event--operator]=\"event.isOperatorOnly\">\n <time [attr.datetime]=\"event.creationDateTime\">{{ event.creationDateTime | date:'short' }}</time>\n <span>\n {{ event.messageKey | translate: arguments(event.messageArgumentsJson) }}\n @if (event.isOperatorOnly) {\n <small class=\"nh-operation__event-badge\">{{ 'nh-background-operations.operator-only' | translate }}</small>\n }\n </span>\n @if (event.resultUrl) {\n <a [href]=\"event.resultUrl\">{{ 'nh-background-operations.open-result' | translate }}</a>\n }\n </li>\n }\n }\n </ol>\n </section>\n }\n</section>\n", styles: [":host{display:block;color:var(--nh-color-text, #fff)}.nh-operation{display:grid;gap:1rem;padding:1rem;border:1px solid var(--nh-color-border, rgba(255, 255, 255, .14));border-radius:1rem;background:var(--nh-color-surface, #101827)}.nh-operation__header,.nh-step__heading,.nh-child__heading,.nh-operation__progress-label,.nh-operation__actions{display:flex;align-items:center;justify-content:space-between;gap:.75rem}.nh-operation__header h2,.nh-operation__events h3,.nh-operation__children h3,.nh-operation__eyebrow,.nh-step__heading span,.nh-step__batch,.nh-operation__events ol{margin:0}.nh-operation__eyebrow{color:var(--nh-color-muted, #9aa8bc);font-size:.75rem;letter-spacing:.06em;text-transform:uppercase}.nh-operation__status,.nh-step__status{flex:none;padding:.25rem .5rem;border-radius:.4rem;background:var(--nh-color-status-background, rgba(2, 41, 98, .75));font-size:.75rem}.nh-operation__progress,.nh-step__progress{overflow:hidden;height:.5rem;border-radius:.25rem;background:var(--nh-color-progress-track, rgba(255, 255, 255, .1))}.nh-operation__progress span,.nh-step__progress span{display:block;height:100%;background:var(--nh-color-progress, #ff6700);transition:width .18s ease-out}.nh-operation__steps{display:grid;gap:.625rem}.nh-operation__children,.nh-operation__children>div{display:grid;gap:.625rem}.nh-child{display:grid;gap:.5rem;margin-inline-start:min(var(--nh-child-depth) * 1rem,3rem);padding:.75rem;border:1px solid var(--nh-color-border, rgba(255, 255, 255, .14));border-radius:.5rem;background:var(--nh-color-surface-subtle, rgba(255, 255, 255, .035))}.nh-child__heading{display:flex;align-items:center;justify-content:space-between;gap:.75rem}.nh-child__heading>div{display:grid;gap:.125rem}.nh-child__heading span{color:var(--nh-color-muted, #9aa8bc);font-size:.8rem}.nh-child__status{flex:none;padding:.25rem .5rem;border-radius:.4rem;background:var(--nh-color-status-background, rgba(2, 41, 98, .75));color:var(--nh-color-text, #fff);font-size:.75rem}.nh-child a{justify-self:start}.nh-step{display:grid;gap:.5rem;margin-inline-start:calc(var(--nh-step-depth) * 1rem);padding:.75rem;border-inline-start:2px solid var(--nh-color-progress, #ff6700);background:var(--nh-color-surface-subtle, rgba(255, 255, 255, .035))}.nh-step__heading>div{display:grid;gap:.125rem}.nh-step__heading span{color:var(--nh-color-muted, #9aa8bc);font-size:.8rem}.nh-step__batch{display:flex;flex-wrap:wrap;gap:.5rem 1rem;color:var(--nh-color-muted, #9aa8bc);font-size:.75rem}.nh-step__batch div{display:flex;gap:.25rem}.nh-step__batch dd{margin:0;color:var(--nh-color-text, #fff)}.nh-operation__actions{justify-content:flex-end}.nh-operation__actions button{min-height:2.25rem;padding:.4rem .75rem;border:1px solid var(--nh-color-border, rgba(255, 255, 255, .2));border-radius:.5rem;color:inherit;background:transparent}.nh-operation__actions button:focus-visible,.nh-child a:focus-visible,.nh-operation__events a:focus-visible{outline:2px solid var(--nh-color-progress, #ff6700);outline-offset:2px}.nh-operation__events ol{display:grid;gap:.5rem;padding:0;list-style:none}.nh-operation__events li{display:grid;grid-template-columns:minmax(7rem,auto) 1fr auto;gap:.75rem;color:var(--nh-color-muted, #9aa8bc);font-size:.8rem}.nh-operation__events li span{color:var(--nh-color-text, #fff)}.nh-operation__event-badge{margin-left:.5rem;padding:.125rem .375rem;border:1px solid var(--nh-color-border, rgba(255, 255, 255, .2));border-radius:.4rem;color:var(--nh-color-muted, #9aa8bc);font-size:.7rem;white-space:nowrap}@media(prefers-reduced-motion:reduce){.nh-operation__progress span,.nh-step__progress span{transition:none}}@media(max-width:40rem){.nh-operation__header,.nh-step__heading,.nh-child__heading,.nh-operation__events li{align-items:flex-start;grid-template-columns:1fr}.nh-operation__header,.nh-step__heading{flex-direction:column}.nh-child__heading{align-items:flex-start;flex-direction:column}.nh-step{margin-inline-start:min(var(--nh-step-depth) * .5rem,1.5rem)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$3.DecimalPipe, name: "number" }, { kind: "pipe", type: i1$3.DatePipe, name: "date" }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
8157
8222
|
}
|
|
8158
8223
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.28", ngImport: i0, type: NhBackgroundOperationProgressComponent, decorators: [{
|
|
8159
8224
|
type: Component,
|
|
8160
|
-
args: [{ selector: 'nh-background-operation-progress', standalone: true, imports: [CommonModule, TranslateModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<section class=\"nh-operation\" [attr.data-status]=\"statusKey(operation.status)\">\n <header class=\"nh-operation__header\">\n <div>\n <p class=\"nh-operation__eyebrow\">{{ 'nh-background-operations.operation' | translate }}</p>\n <h2>{{ operation.operationType }}</h2>\n </div>\n <span class=\"nh-operation__status\">{{ statusKey(operation.status) | translate }}</span>\n </header>\n\n <div class=\"nh-operation__overall\">\n <div class=\"nh-operation__progress-label\">\n <span>{{ operation.progressMessageKey ? (operation.progressMessageKey | translate: arguments(operation.progressMessageArgumentsJson)) : ('nh-background-operations.progress' | translate) }}</span>\n <strong>{{ percentage(operation.progressPercentage) | number:'1.0-1' }}%</strong>\n </div>\n <div class=\"nh-operation__progress\" role=\"progressbar\"\n [attr.aria-label]=\"'nh-background-operations.overall-progress' | translate\"\n aria-valuemin=\"0\" aria-valuemax=\"100\"\n [attr.aria-valuenow]=\"percentage(operation.progressPercentage)\">\n <span [style.width.%]=\"percentage(operation.progressPercentage)\"></span>\n </div>\n </div>\n\n @if (showActions && (canCancel(operation.status) || canRetry(operation))) {\n <div class=\"nh-operation__actions\">\n @if (canCancel(operation.status)) {\n <button type=\"button\" (click)=\"cancelRequested.emit(operation.id)\">\n {{ 'nh-background-operations.cancel' | translate }}\n </button>\n }\n @if (canRetry(operation)) {\n <button type=\"button\" (click)=\"retryRequested.emit(operation.id)\">\n {{ 'nh-background-operations.retry' | translate }}\n </button>\n }\n </div>\n }\n\n <div class=\"nh-operation__steps\" role=\"list\" [attr.aria-label]=\"'nh-background-operations.steps' | translate\">\n <ng-template #renderStep let-step let-depth=\"depth\">\n <article class=\"nh-step\" role=\"listitem\" [style.--nh-step-depth]=\"depth\">\n <div class=\"nh-step__heading\">\n <div>\n <strong>{{ stepTitle(step) | translate: arguments(step.titleArgumentsJson) }}</strong>\n @if (step.messageKey) {\n <span>{{ step.messageKey | translate: arguments(step.messageArgumentsJson) }}</span>\n }\n </div>\n <span class=\"nh-step__status\">{{ stepStatusKey(step.status) | translate }}</span>\n </div>\n <div class=\"nh-step__progress\" role=\"progressbar\"\n [attr.aria-label]=\"stepTitle(step) | translate: arguments(step.titleArgumentsJson)\"\n aria-valuemin=\"0\" aria-valuemax=\"100\"\n [attr.aria-valuenow]=\"percentage(step.percentage)\">\n <span [style.width.%]=\"percentage(step.percentage)\"></span>\n </div>\n @if (hasBatch(step)) {\n <dl class=\"nh-step__batch\">\n <div><dt>{{ 'nh-background-operations.batch.processed' | translate }}</dt><dd>{{ step.processedItems }} / {{ step.discoveredItems }}</dd></div>\n <div><dt>{{ 'nh-background-operations.batch.succeeded' | translate }}</dt><dd>{{ step.succeededItems }}</dd></div>\n <div><dt>{{ 'nh-background-operations.batch.failed' | translate }}</dt><dd>{{ step.failedItems }}</dd></div>\n <div><dt>{{ 'nh-background-operations.batch.skipped' | translate }}</dt><dd>{{ step.skippedItems }}</dd></div>\n @if (step.retriedItems > 0) {\n <div><dt>{{ 'nh-background-operations.batch.retried' | translate }}</dt><dd>{{ step.retriedItems }}</dd></div>\n }\n @if (step.activeItems > 0) {\n <div><dt>{{ 'nh-background-operations.batch.active' | translate }}</dt><dd>{{ step.activeItems }}</dd></div>\n }\n </dl>\n }\n </article>\n @for (child of step.children; track child.id) {\n <ng-container *ngTemplateOutlet=\"renderStep; context: {$implicit: child, depth: depth + 1}\"></ng-container>\n }\n </ng-template>\n\n @for (step of operation.steps; track step.id) {\n <ng-container *ngTemplateOutlet=\"renderStep; context: {$implicit: step, depth: 0}\"></ng-container>\n } @empty {\n <p class=\"nh-operation__empty\">{{ 'nh-background-operations.no-steps' | translate }}</p>\n }\n </div>\n\n @if (operation.children.length > 0) {\n <section class=\"nh-operation__children\">\n <h3>{{ 'nh-background-operations.children' | translate }}</h3>\n <div role=\"list\" [attr.aria-label]=\"'nh-background-operations.children' | translate\">\n <ng-template #renderChild let-child let-depth=\"depth\">\n <article class=\"nh-child\" role=\"listitem\" [style.--nh-child-depth]=\"depth\">\n <div class=\"nh-child__heading\">\n <div>\n <strong>{{ childLabel(child) }}</strong>\n <span>{{ child.operationType }}</span>\n </div>\n <span class=\"nh-child__status\">{{ statusKey(child.status) | translate }}</span>\n </div>\n <div class=\"nh-step__progress\" role=\"progressbar\"\n [attr.aria-label]=\"childLabel(child)\"\n aria-valuemin=\"0\" aria-valuemax=\"100\"\n [attr.aria-valuenow]=\"percentage(child.progressPercentage)\">\n <span [style.width.%]=\"percentage(child.progressPercentage)\"></span>\n </div>\n @if (child.resultUrl) {\n <a [href]=\"child.resultUrl\">{{ 'nh-background-operations.open-result' | translate }}</a>\n }\n </article>\n @for (nestedChild of child.children; track nestedChild.id) {\n <ng-container *ngTemplateOutlet=\"renderChild; context: {$implicit: nestedChild, depth: depth + 1}\"></ng-container>\n }\n </ng-template>\n\n @for (child of operation.children; track child.id) {\n <ng-container *ngTemplateOutlet=\"renderChild; context: {$implicit: child, depth: 0}\"></ng-container>\n }\n </div>\n </section>\n }\n\n @if (showEvents && operation.events.length > 0) {\n <section class=\"nh-operation__events\">\n <h3>{{ 'nh-background-operations.activity' | translate }}</h3>\n <ol>\n @for (event of operation.events; track event.id) {\n @if (event.messageKey) {\n <li>\n <time [attr.datetime]=\"event.creationDateTime\">{{ event.creationDateTime | date:'short' }}</time>\n <span>{{ event.messageKey | translate: arguments(event.messageArgumentsJson) }}</span>\n @if (event.resultUrl) {\n <a [href]=\"event.resultUrl\">{{ 'nh-background-operations.open-result' | translate }}</a>\n }\n </li>\n }\n }\n </ol>\n </section>\n }\n</section>\n", styles: [":host{display:block;color:var(--nh-color-text, #fff)}.nh-operation{display:grid;gap:1rem;padding:1rem;border:1px solid var(--nh-color-border, rgba(255, 255, 255, .14));border-radius:1rem;background:var(--nh-color-surface, #101827)}.nh-operation__header,.nh-step__heading,.nh-child__heading,.nh-operation__progress-label,.nh-operation__actions{display:flex;align-items:center;justify-content:space-between;gap:.75rem}.nh-operation__header h2,.nh-operation__events h3,.nh-operation__children h3,.nh-operation__eyebrow,.nh-step__heading span,.nh-step__batch,.nh-operation__events ol{margin:0}.nh-operation__eyebrow{color:var(--nh-color-muted, #9aa8bc);font-size:.75rem;letter-spacing:.06em;text-transform:uppercase}.nh-operation__status,.nh-step__status{flex:none;padding:.25rem .5rem;border-radius:.4rem;background:var(--nh-color-status-background, rgba(2, 41, 98, .75));font-size:.75rem}.nh-operation__progress,.nh-step__progress{overflow:hidden;height:.5rem;border-radius:.25rem;background:var(--nh-color-progress-track, rgba(255, 255, 255, .1))}.nh-operation__progress span,.nh-step__progress span{display:block;height:100%;background:var(--nh-color-progress, #ff6700);transition:width .18s ease-out}.nh-operation__steps{display:grid;gap:.625rem}.nh-operation__children,.nh-operation__children>div{display:grid;gap:.625rem}.nh-child{display:grid;gap:.5rem;margin-inline-start:min(var(--nh-child-depth) * 1rem,3rem);padding:.75rem;border:1px solid var(--nh-color-border, rgba(255, 255, 255, .14));border-radius:.5rem;background:var(--nh-color-surface-subtle, rgba(255, 255, 255, .035))}.nh-child__heading{display:flex;align-items:center;justify-content:space-between;gap:.75rem}.nh-child__heading>div{display:grid;gap:.125rem}.nh-child__heading span{color:var(--nh-color-muted, #9aa8bc);font-size:.8rem}.nh-child__status{flex:none;padding:.25rem .5rem;border-radius:.4rem;background:var(--nh-color-status-background, rgba(2, 41, 98, .75));color:var(--nh-color-text, #fff);font-size:.75rem}.nh-child a{justify-self:start}.nh-step{display:grid;gap:.5rem;margin-inline-start:calc(var(--nh-step-depth) * 1rem);padding:.75rem;border-inline-start:2px solid var(--nh-color-progress, #ff6700);background:var(--nh-color-surface-subtle, rgba(255, 255, 255, .035))}.nh-step__heading>div{display:grid;gap:.125rem}.nh-step__heading span{color:var(--nh-color-muted, #9aa8bc);font-size:.8rem}.nh-step__batch{display:flex;flex-wrap:wrap;gap:.5rem 1rem;color:var(--nh-color-muted, #9aa8bc);font-size:.75rem}.nh-step__batch div{display:flex;gap:.25rem}.nh-step__batch dd{margin:0;color:var(--nh-color-text, #fff)}.nh-operation__actions{justify-content:flex-end}.nh-operation__actions button{min-height:2.25rem;padding:.4rem .75rem;border:1px solid var(--nh-color-border, rgba(255, 255, 255, .2));border-radius:.5rem;color:inherit;background:transparent}.nh-operation__actions button:focus-visible,.nh-child a:focus-visible,.nh-operation__events a:focus-visible{outline:2px solid var(--nh-color-progress, #ff6700);outline-offset:2px}.nh-operation__events ol{display:grid;gap:.5rem;padding:0;list-style:none}.nh-operation__events li{display:grid;grid-template-columns:minmax(7rem,auto) 1fr auto;gap:.75rem;color:var(--nh-color-muted, #9aa8bc);font-size:.8rem}.nh-operation__events li span{color:var(--nh-color-text, #fff)}@media(prefers-reduced-motion:reduce){.nh-operation__progress span,.nh-step__progress span{transition:none}}@media(max-width:40rem){.nh-operation__header,.nh-step__heading,.nh-child__heading,.nh-operation__events li{align-items:flex-start;grid-template-columns:1fr}.nh-operation__header,.nh-step__heading{flex-direction:column}.nh-child__heading{align-items:flex-start;flex-direction:column}.nh-step{margin-inline-start:min(var(--nh-step-depth) * .5rem,1.5rem)}}\n"] }]
|
|
8225
|
+
args: [{ selector: 'nh-background-operation-progress', standalone: true, imports: [CommonModule, TranslateModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<section class=\"nh-operation\" [attr.data-status]=\"statusKey(operation.status)\">\n <header class=\"nh-operation__header\">\n <div>\n <p class=\"nh-operation__eyebrow\">{{ 'nh-background-operations.operation' | translate }}</p>\n <h2>{{ operation.operationType }}</h2>\n </div>\n <span class=\"nh-operation__status\">{{ statusKey(operation.status) | translate }}</span>\n </header>\n\n <div class=\"nh-operation__overall\">\n <div class=\"nh-operation__progress-label\">\n <span>{{ operation.progressMessageKey ? (operation.progressMessageKey | translate: arguments(operation.progressMessageArgumentsJson)) : ('nh-background-operations.progress' | translate) }}</span>\n <strong>{{ percentage(operation.progressPercentage) | number:'1.0-1' }}%</strong>\n </div>\n <div class=\"nh-operation__progress\" role=\"progressbar\"\n [attr.aria-label]=\"'nh-background-operations.overall-progress' | translate\"\n aria-valuemin=\"0\" aria-valuemax=\"100\"\n [attr.aria-valuenow]=\"percentage(operation.progressPercentage)\">\n <span [style.width.%]=\"percentage(operation.progressPercentage)\"></span>\n </div>\n </div>\n\n @if (showActions && (canCancel(operation.status) || canRetry(operation))) {\n <div class=\"nh-operation__actions\">\n @if (canCancel(operation.status)) {\n <button type=\"button\" (click)=\"cancelRequested.emit(operation.id)\">\n {{ 'nh-background-operations.cancel' | translate }}\n </button>\n }\n @if (canRetry(operation)) {\n <button type=\"button\" (click)=\"retryRequested.emit(operation.id)\">\n {{ 'nh-background-operations.retry' | translate }}\n </button>\n }\n </div>\n }\n\n <div class=\"nh-operation__steps\" role=\"list\" [attr.aria-label]=\"'nh-background-operations.steps' | translate\">\n <ng-template #renderStep let-step let-depth=\"depth\">\n <article class=\"nh-step\" role=\"listitem\" [style.--nh-step-depth]=\"depth\">\n <div class=\"nh-step__heading\">\n <div>\n <strong>{{ stepTitle(step) | translate: arguments(step.titleArgumentsJson) }}</strong>\n @if (step.messageKey) {\n <span>{{ step.messageKey | translate: arguments(step.messageArgumentsJson) }}</span>\n }\n </div>\n <span class=\"nh-step__status\">{{ stepStatusKey(step.status) | translate }}</span>\n </div>\n <div class=\"nh-step__progress\" role=\"progressbar\"\n [attr.aria-label]=\"stepTitle(step) | translate: arguments(step.titleArgumentsJson)\"\n aria-valuemin=\"0\" aria-valuemax=\"100\"\n [attr.aria-valuenow]=\"percentage(step.percentage)\">\n <span [style.width.%]=\"percentage(step.percentage)\"></span>\n </div>\n @if (hasBatch(step)) {\n <dl class=\"nh-step__batch\">\n <div><dt>{{ 'nh-background-operations.batch.processed' | translate }}</dt><dd>{{ step.processedItems }} / {{ step.discoveredItems }}</dd></div>\n <div><dt>{{ 'nh-background-operations.batch.succeeded' | translate }}</dt><dd>{{ step.succeededItems }}</dd></div>\n <div><dt>{{ 'nh-background-operations.batch.failed' | translate }}</dt><dd>{{ step.failedItems }}</dd></div>\n <div><dt>{{ 'nh-background-operations.batch.skipped' | translate }}</dt><dd>{{ step.skippedItems }}</dd></div>\n @if (step.retriedItems > 0) {\n <div><dt>{{ 'nh-background-operations.batch.retried' | translate }}</dt><dd>{{ step.retriedItems }}</dd></div>\n }\n @if (step.activeItems > 0) {\n <div><dt>{{ 'nh-background-operations.batch.active' | translate }}</dt><dd>{{ step.activeItems }}</dd></div>\n }\n </dl>\n }\n </article>\n @for (child of step.children; track child.id) {\n <ng-container *ngTemplateOutlet=\"renderStep; context: {$implicit: child, depth: depth + 1}\"></ng-container>\n }\n </ng-template>\n\n @for (step of operation.steps; track step.id) {\n <ng-container *ngTemplateOutlet=\"renderStep; context: {$implicit: step, depth: 0}\"></ng-container>\n } @empty {\n <p class=\"nh-operation__empty\">{{ 'nh-background-operations.no-steps' | translate }}</p>\n }\n </div>\n\n @if (operation.children.length > 0) {\n <section class=\"nh-operation__children\">\n <h3>{{ 'nh-background-operations.children' | translate }}</h3>\n <div role=\"list\" [attr.aria-label]=\"'nh-background-operations.children' | translate\">\n <ng-template #renderChild let-child let-depth=\"depth\">\n <article class=\"nh-child\" role=\"listitem\" [style.--nh-child-depth]=\"depth\">\n <div class=\"nh-child__heading\">\n <div>\n <strong>{{ childLabel(child) }}</strong>\n <span>{{ child.operationType }}</span>\n </div>\n <span class=\"nh-child__status\">{{ statusKey(child.status) | translate }}</span>\n </div>\n <div class=\"nh-step__progress\" role=\"progressbar\"\n [attr.aria-label]=\"childLabel(child)\"\n aria-valuemin=\"0\" aria-valuemax=\"100\"\n [attr.aria-valuenow]=\"percentage(child.progressPercentage)\">\n <span [style.width.%]=\"percentage(child.progressPercentage)\"></span>\n </div>\n @if (child.resultUrl) {\n <a [href]=\"child.resultUrl\">{{ 'nh-background-operations.open-result' | translate }}</a>\n }\n </article>\n @for (nestedChild of child.children; track nestedChild.id) {\n <ng-container *ngTemplateOutlet=\"renderChild; context: {$implicit: nestedChild, depth: depth + 1}\"></ng-container>\n }\n </ng-template>\n\n @for (child of operation.children; track child.id) {\n <ng-container *ngTemplateOutlet=\"renderChild; context: {$implicit: child, depth: 0}\"></ng-container>\n }\n </div>\n </section>\n }\n\n @if (showEvents && operation.events.length > 0) {\n <section class=\"nh-operation__events\">\n <h3>{{ 'nh-background-operations.activity' | translate }}</h3>\n <ol>\n @for (event of operation.events; track event.id) {\n @if (event.messageKey) {\n <li [class.nh-operation__event--operator]=\"event.isOperatorOnly\">\n <time [attr.datetime]=\"event.creationDateTime\">{{ event.creationDateTime | date:'short' }}</time>\n <span>\n {{ event.messageKey | translate: arguments(event.messageArgumentsJson) }}\n @if (event.isOperatorOnly) {\n <small class=\"nh-operation__event-badge\">{{ 'nh-background-operations.operator-only' | translate }}</small>\n }\n </span>\n @if (event.resultUrl) {\n <a [href]=\"event.resultUrl\">{{ 'nh-background-operations.open-result' | translate }}</a>\n }\n </li>\n }\n }\n </ol>\n </section>\n }\n</section>\n", styles: [":host{display:block;color:var(--nh-color-text, #fff)}.nh-operation{display:grid;gap:1rem;padding:1rem;border:1px solid var(--nh-color-border, rgba(255, 255, 255, .14));border-radius:1rem;background:var(--nh-color-surface, #101827)}.nh-operation__header,.nh-step__heading,.nh-child__heading,.nh-operation__progress-label,.nh-operation__actions{display:flex;align-items:center;justify-content:space-between;gap:.75rem}.nh-operation__header h2,.nh-operation__events h3,.nh-operation__children h3,.nh-operation__eyebrow,.nh-step__heading span,.nh-step__batch,.nh-operation__events ol{margin:0}.nh-operation__eyebrow{color:var(--nh-color-muted, #9aa8bc);font-size:.75rem;letter-spacing:.06em;text-transform:uppercase}.nh-operation__status,.nh-step__status{flex:none;padding:.25rem .5rem;border-radius:.4rem;background:var(--nh-color-status-background, rgba(2, 41, 98, .75));font-size:.75rem}.nh-operation__progress,.nh-step__progress{overflow:hidden;height:.5rem;border-radius:.25rem;background:var(--nh-color-progress-track, rgba(255, 255, 255, .1))}.nh-operation__progress span,.nh-step__progress span{display:block;height:100%;background:var(--nh-color-progress, #ff6700);transition:width .18s ease-out}.nh-operation__steps{display:grid;gap:.625rem}.nh-operation__children,.nh-operation__children>div{display:grid;gap:.625rem}.nh-child{display:grid;gap:.5rem;margin-inline-start:min(var(--nh-child-depth) * 1rem,3rem);padding:.75rem;border:1px solid var(--nh-color-border, rgba(255, 255, 255, .14));border-radius:.5rem;background:var(--nh-color-surface-subtle, rgba(255, 255, 255, .035))}.nh-child__heading{display:flex;align-items:center;justify-content:space-between;gap:.75rem}.nh-child__heading>div{display:grid;gap:.125rem}.nh-child__heading span{color:var(--nh-color-muted, #9aa8bc);font-size:.8rem}.nh-child__status{flex:none;padding:.25rem .5rem;border-radius:.4rem;background:var(--nh-color-status-background, rgba(2, 41, 98, .75));color:var(--nh-color-text, #fff);font-size:.75rem}.nh-child a{justify-self:start}.nh-step{display:grid;gap:.5rem;margin-inline-start:calc(var(--nh-step-depth) * 1rem);padding:.75rem;border-inline-start:2px solid var(--nh-color-progress, #ff6700);background:var(--nh-color-surface-subtle, rgba(255, 255, 255, .035))}.nh-step__heading>div{display:grid;gap:.125rem}.nh-step__heading span{color:var(--nh-color-muted, #9aa8bc);font-size:.8rem}.nh-step__batch{display:flex;flex-wrap:wrap;gap:.5rem 1rem;color:var(--nh-color-muted, #9aa8bc);font-size:.75rem}.nh-step__batch div{display:flex;gap:.25rem}.nh-step__batch dd{margin:0;color:var(--nh-color-text, #fff)}.nh-operation__actions{justify-content:flex-end}.nh-operation__actions button{min-height:2.25rem;padding:.4rem .75rem;border:1px solid var(--nh-color-border, rgba(255, 255, 255, .2));border-radius:.5rem;color:inherit;background:transparent}.nh-operation__actions button:focus-visible,.nh-child a:focus-visible,.nh-operation__events a:focus-visible{outline:2px solid var(--nh-color-progress, #ff6700);outline-offset:2px}.nh-operation__events ol{display:grid;gap:.5rem;padding:0;list-style:none}.nh-operation__events li{display:grid;grid-template-columns:minmax(7rem,auto) 1fr auto;gap:.75rem;color:var(--nh-color-muted, #9aa8bc);font-size:.8rem}.nh-operation__events li span{color:var(--nh-color-text, #fff)}.nh-operation__event-badge{margin-left:.5rem;padding:.125rem .375rem;border:1px solid var(--nh-color-border, rgba(255, 255, 255, .2));border-radius:.4rem;color:var(--nh-color-muted, #9aa8bc);font-size:.7rem;white-space:nowrap}@media(prefers-reduced-motion:reduce){.nh-operation__progress span,.nh-step__progress span{transition:none}}@media(max-width:40rem){.nh-operation__header,.nh-step__heading,.nh-child__heading,.nh-operation__events li{align-items:flex-start;grid-template-columns:1fr}.nh-operation__header,.nh-step__heading{flex-direction:column}.nh-child__heading{align-items:flex-start;flex-direction:column}.nh-step{margin-inline-start:min(var(--nh-step-depth) * .5rem,1.5rem)}}\n"] }]
|
|
8161
8226
|
}], propDecorators: { operation: [{
|
|
8162
8227
|
type: Input,
|
|
8163
8228
|
args: [{ required: true }]
|
|
@@ -8703,5 +8768,5 @@ function nhTranslateBrowserLoaderFactory(httpClient, transferState) {
|
|
|
8703
8768
|
* Generated bundle index. Do not edit.
|
|
8704
8769
|
*/
|
|
8705
8770
|
|
|
8706
|
-
export { AbstractValueAccessor, AspMvcFormServerSideFormValidator, AuthSessionExpirationInformation, AuthenticateModel, AuthenticationNhCommonModuleConfig, AuthenticationSessionCreateResponse, BackgroundOperationsNhCommonModuleConfig, BaseNhAuthService, CheckAuthenticateSessionModel, Claim, ClaimAuthenticateSessionAccountMutateModel, ClaimAuthenticateSessionAccountViewModel, ClaimTypes, CollectionHttpRequestOptions, CollectionHttpResponse, DefaultMultiSelectSettings, DefaultMultiSelectTexts, EndpointsAuthenticationNhCommonModuleConfig, FilterRequestOptions, FormError, FormValidationResult, HttpDownloadRequestOptions, HttpRequestOptions, HttpRequestOptionsArrayBuffer, HttpRequestOptionsText, ImpersonateAuthenticateModel, IsAllPermissionsGrantedPipe, IsAuthenticatedPipe, IsClaimGrantedPipe, IsDefined, IsGrantedRolePipe, IsOneActiveDivisionPermissionGrantedGuard, IsOneActiveDivisionPermissionGrantedPipe, IsOneActiveDivisionRoleGrantedGuard, IsOneActiveDivisionRoleGrantedPipe, IsOneClaimGrantedPipe, IsOneDivisionPermissionGrantedPipe, IsOneDivisionRoleGrantedPipe, IsOnePermissionGrantedPipe, IsOneRoleGrantedPipe, JsonLdDataChanged, ListSortDirection, MakeProvider, MutationType, NH_ERROR_HANDLERS, NH_ROUTER_LANGUAGE_CHANGE_METHOD, NH_ROUTER_ROOT_ROUTES, NhAccountInformationResponse, NhAngularUtil, NhApiService, NhApiUtil, NhAppService, NhAsyncLock, NhAuthService, NhAuthorization, NhBackgroundOperationCollectionHttpRequestOptions, NhBackgroundOperationLiveUpdateService, NhBackgroundOperationProgressComponent, NhBackgroundOperationService, NhBackgroundOperationStore, NhBaseApiService, NhBooleanToStringPipe, NhBreadCrumb, NhBreadCrumbItem, NhButtonDebounceDirective, NhCanCancelNavigationGuard, NhCollectionBaseComponent, NhCollectionTypeBaseComponent, NhCommonConfig, NhCommonConfigChanged, NhCommonModule, NhCommonModuleConfig, NhConfigCommonService, NhContextMenu, NhContextMenuItem, NhContextMenuService, NhContextMenuServiceConfig, NhCookieService, NhDatePipe, NhDateTimePipe, NhDateUtcPipe, NhDebounceDirective, NhDeduplicateGetRequestsInterceptor, NhDivision, NhDivisionRole, NhDivisionUser, NhEncodeHttpParamsInterceptor, NhEncodingUtil, NhErrorComponent, NhErrorHandlerService, NhFormDropDownComponent, NhFormDropDownNhCommonModuleConfig, NhFormDropDownSettings, NhFormErrorMessageComponent, NhFormHelper, NhHeadService, NhHttpNhCommonModuleConfig, NhHttpUtil, NhInternetConnectionService, NhIsAllPermissionsGrantedGuard, NhIsAuthenticatedGuard, NhIsOneClaimGrantedGuard, NhIsOnePermissionGrantedGuard, NhIsOneRoleGrantedGuard, NhJsonLdComponent, NhJsonLdData, NhJsonLdDataItem, NhJsonLdService, NhLoaderComponent, NhMetaService, NhModalComponent, NhModalComponentClosed, NhModalComponentImpl, NhModalComponentRef, NhModalConfirmComponent, NhModalContentDirective, NhModalLoadingComponent, NhModalMutateBaseComponent, NhModalMutateBaseTypeComponent, NhModalOptions, NhModalService, NhMutateBaseComponent, NhMutateBaseTypeComponent, NhMutex, NhPageBaseComponent, NhPageService, NhPageSettings, NhPageSizeComponent, NhPageTypeBaseComponent, NhRegisterRoute, NhRequestScopedServerHttpInterceptorService, NhRoute, NhRouteInfo, NhRouteNavigationItem, NhRouterLinkDirective, NhRouterService, NhRouterSetupService, NhSearchInputComponent, NhServerHttpInterceptor, NhServerService, NhServerSideFormValidationService, NhSitemap, NhSitemapEntry, NhSitemapEntryItem, NhStringUtil, NhTaskResultFormValidationService, NhTitleService, NhToHeadDirective, NhTranslateBrowserLoader, NhTranslationNhCommonModuleConfig, NhTypedPageBaseComponent, NhTypedPageTypeBaseComponent, NhUrlEncodePipe, NhUser, NhUserNotification, NhUserNotificationCollectionHttpRequestOptions, NhUserNotificationData, NhUserNotificationMessage, NhUserNotificationOverview, NhUserNotificationService, NhUserNotificationState, NhUserNotificationsAbstractComponent, OrderByRequestOptions, PreConnectUrlItem, PreLoadUrlItem, REVIEW_AGGREGATE_RATING_KEY, REVIEW_KEY, RefreshTokenLoginAccountMutateModel, RevertImpersonateAuthenticateModel, SafeHtmlPipe, SafeResourceUrlPipe, SafeUrlPipe, SearchableCollectionHttpRequestOptions, SimpleCollectionHttpRequestOptions, SimpleCollectionHttpResponse, TaskResult, TaskResultItem, TypedNhPageSettings, UserNotificationNhCommonModuleConfig, enumIntValuesToArray, enumKeysToArray, enumStringValuesToArray, enumValuesToArray, getEmptyGuid, getRandomIdentifier, groupBy, languageToCultureMap, nameof, nhBackgroundOperationStatusName, nhBackgroundOperationStepStatusName, nhBackgroundOperationTranslationSegment, nhTranslateBrowserLoaderFactory, uppercaseFirst };
|
|
8771
|
+
export { AbstractValueAccessor, AspMvcFormServerSideFormValidator, AuthSessionExpirationInformation, AuthenticateModel, AuthenticationNhCommonModuleConfig, AuthenticationSessionCreateResponse, BackgroundOperationsNhCommonModuleConfig, BaseNhAuthService, CheckAuthenticateSessionModel, Claim, ClaimAuthenticateSessionAccountMutateModel, ClaimAuthenticateSessionAccountViewModel, ClaimTypes, CollectionHttpRequestOptions, CollectionHttpResponse, DefaultMultiSelectSettings, DefaultMultiSelectTexts, EndpointsAuthenticationNhCommonModuleConfig, FilterRequestOptions, FormError, FormValidationResult, HttpDownloadRequestOptions, HttpRequestOptions, HttpRequestOptionsArrayBuffer, HttpRequestOptionsText, ImpersonateAuthenticateModel, IsAllPermissionsGrantedPipe, IsAuthenticatedPipe, IsClaimGrantedPipe, IsDefined, IsGrantedRolePipe, IsOneActiveDivisionPermissionGrantedGuard, IsOneActiveDivisionPermissionGrantedPipe, IsOneActiveDivisionRoleGrantedGuard, IsOneActiveDivisionRoleGrantedPipe, IsOneClaimGrantedPipe, IsOneDivisionPermissionGrantedPipe, IsOneDivisionRoleGrantedPipe, IsOnePermissionGrantedPipe, IsOneRoleGrantedPipe, JsonLdDataChanged, ListSortDirection, MakeProvider, MutationType, NH_ERROR_HANDLERS, NH_ROUTER_LANGUAGE_CHANGE_METHOD, NH_ROUTER_ROOT_ROUTES, NhAccountInformationResponse, NhAngularUtil, NhApiService, NhApiUtil, NhAppService, NhAsyncLock, NhAuthService, NhAuthorization, NhBackgroundOperationAdministrationCollectionHttpRequestOptions, NhBackgroundOperationAdministrationService, NhBackgroundOperationCollectionHttpRequestOptions, NhBackgroundOperationLiveUpdateService, NhBackgroundOperationProgressComponent, NhBackgroundOperationService, NhBackgroundOperationStore, NhBaseApiService, NhBooleanToStringPipe, NhBreadCrumb, NhBreadCrumbItem, NhButtonDebounceDirective, NhCanCancelNavigationGuard, NhCollectionBaseComponent, NhCollectionTypeBaseComponent, NhCommonConfig, NhCommonConfigChanged, NhCommonModule, NhCommonModuleConfig, NhConfigCommonService, NhContextMenu, NhContextMenuItem, NhContextMenuService, NhContextMenuServiceConfig, NhCookieService, NhDatePipe, NhDateTimePipe, NhDateUtcPipe, NhDebounceDirective, NhDeduplicateGetRequestsInterceptor, NhDivision, NhDivisionRole, NhDivisionUser, NhEncodeHttpParamsInterceptor, NhEncodingUtil, NhErrorComponent, NhErrorHandlerService, NhFormDropDownComponent, NhFormDropDownNhCommonModuleConfig, NhFormDropDownSettings, NhFormErrorMessageComponent, NhFormHelper, NhHeadService, NhHttpNhCommonModuleConfig, NhHttpUtil, NhInternetConnectionService, NhIsAllPermissionsGrantedGuard, NhIsAuthenticatedGuard, NhIsOneClaimGrantedGuard, NhIsOnePermissionGrantedGuard, NhIsOneRoleGrantedGuard, NhJsonLdComponent, NhJsonLdData, NhJsonLdDataItem, NhJsonLdService, NhLoaderComponent, NhMetaService, NhModalComponent, NhModalComponentClosed, NhModalComponentImpl, NhModalComponentRef, NhModalConfirmComponent, NhModalContentDirective, NhModalLoadingComponent, NhModalMutateBaseComponent, NhModalMutateBaseTypeComponent, NhModalOptions, NhModalService, NhMutateBaseComponent, NhMutateBaseTypeComponent, NhMutex, NhPageBaseComponent, NhPageService, NhPageSettings, NhPageSizeComponent, NhPageTypeBaseComponent, NhRegisterRoute, NhRequestScopedServerHttpInterceptorService, NhRoute, NhRouteInfo, NhRouteNavigationItem, NhRouterLinkDirective, NhRouterService, NhRouterSetupService, NhSearchInputComponent, NhServerHttpInterceptor, NhServerService, NhServerSideFormValidationService, NhSitemap, NhSitemapEntry, NhSitemapEntryItem, NhStringUtil, NhTaskResultFormValidationService, NhTitleService, NhToHeadDirective, NhTranslateBrowserLoader, NhTranslationNhCommonModuleConfig, NhTypedPageBaseComponent, NhTypedPageTypeBaseComponent, NhUrlEncodePipe, NhUser, NhUserNotification, NhUserNotificationCollectionHttpRequestOptions, NhUserNotificationData, NhUserNotificationMessage, NhUserNotificationOverview, NhUserNotificationService, NhUserNotificationState, NhUserNotificationsAbstractComponent, OrderByRequestOptions, PreConnectUrlItem, PreLoadUrlItem, REVIEW_AGGREGATE_RATING_KEY, REVIEW_KEY, RefreshTokenLoginAccountMutateModel, RevertImpersonateAuthenticateModel, SafeHtmlPipe, SafeResourceUrlPipe, SafeUrlPipe, SearchableCollectionHttpRequestOptions, SimpleCollectionHttpRequestOptions, SimpleCollectionHttpResponse, TaskResult, TaskResultItem, TypedNhPageSettings, UserNotificationNhCommonModuleConfig, enumIntValuesToArray, enumKeysToArray, enumStringValuesToArray, enumValuesToArray, getEmptyGuid, getRandomIdentifier, groupBy, languageToCultureMap, nameof, nhBackgroundOperationStatusName, nhBackgroundOperationStepStatusName, nhBackgroundOperationTranslationSegment, nhTranslateBrowserLoaderFactory, nhUserNotificationSeverityName, uppercaseFirst };
|
|
8707
8772
|
//# sourceMappingURL=newheap-platform-common.mjs.map
|