mirror of https://github.com/abpframework/abp.git
Sinan997
3 years ago
23 changed files with 432 additions and 391 deletions
@ -1,65 +1,65 @@ |
|||
<ng-template #loginBtn> |
|||
<a role="button" class="nav-link pointer" (click)="navigateToLogin()">{{ |
|||
'AbpAccount::Login' | abpLocalization |
|||
}}</a> |
|||
</ng-template> |
|||
<div |
|||
*ngIf="(currentUser$ | async)?.isAuthenticated; else loginBtn" |
|||
ngbDropdown |
|||
class="dropdown" |
|||
#currentUserDropdown="ngbDropdown" |
|||
display="static" |
|||
> |
|||
<a |
|||
ngbDropdownToggle |
|||
class="nav-link" |
|||
href="javascript:void(0)" |
|||
role="button" |
|||
id="dropdownMenuLink" |
|||
data-toggle="dropdown" |
|||
aria-haspopup="true" |
|||
aria-expanded="false" |
|||
> |
|||
<small *ngIf="(selectedTenant$ | async)?.name as tenantName" |
|||
><i>{{ tenantName }}</i |
|||
>\</small |
|||
> |
|||
<strong>{{ (currentUser$ | async)?.userName }}</strong> |
|||
</a> |
|||
@if ((currentUser$ | async)?.isAuthenticated) { |
|||
<div |
|||
class="dropdown-menu dropdown-menu-end border-0 shadow-sm" |
|||
aria-labelledby="dropdownMenuLink" |
|||
[class.d-block]="smallScreen && currentUserDropdown.isOpen()" |
|||
*ngIf="(currentUser$ | async)?.isAuthenticated" |
|||
ngbDropdown |
|||
class="dropdown" |
|||
#currentUserDropdown="ngbDropdown" |
|||
display="static" |
|||
> |
|||
<ng-container *ngFor="let item of userMenu.items$ | async; trackBy: trackByFn"> |
|||
<ng-container *abpVisible="!item.visible || item.visible(item)"> |
|||
<li class="nav-item d-flex align-items-center" *abpPermission="item.requiredPolicy"> |
|||
<ng-container |
|||
*ngIf="item.component; else htmlTemplate" |
|||
[ngComponentOutlet]="item.component" |
|||
[ngComponentOutletInjector]="item | toInjector" |
|||
></ng-container> |
|||
|
|||
<ng-template #htmlTemplate> |
|||
<div |
|||
*ngIf="item.html; else textTemplate" |
|||
[innerHTML]="item.html" |
|||
(click)="item.action ? item.action() : null" |
|||
></div> |
|||
</ng-template> |
|||
|
|||
<ng-template #textTemplate> |
|||
<a |
|||
*ngIf="item.textTemplate" |
|||
(click)="item.action ? item.action() : null" |
|||
class="dropdown-item pointer" |
|||
> |
|||
<i *ngIf="item.textTemplate.icon" class="me-1 {{ item.textTemplate.icon }}"></i> |
|||
{{ item.textTemplate.text | abpLocalization }}</a |
|||
> |
|||
</ng-template> |
|||
</li> |
|||
</ng-container> |
|||
</ng-container> |
|||
<a |
|||
ngbDropdownToggle |
|||
class="nav-link" |
|||
href="javascript:void(0)" |
|||
role="button" |
|||
id="dropdownMenuLink" |
|||
data-toggle="dropdown" |
|||
aria-haspopup="true" |
|||
aria-expanded="false" |
|||
> |
|||
@if ((selectedTenant$ | async)?.name; as tenantName) { |
|||
<small |
|||
><i>{{ tenantName }}</i |
|||
>\</small |
|||
> |
|||
} |
|||
<strong>{{ (currentUser$ | async)?.userName }}</strong> |
|||
</a> |
|||
<div |
|||
class="dropdown-menu dropdown-menu-end border-0 shadow-sm" |
|||
aria-labelledby="dropdownMenuLink" |
|||
[class.d-block]="smallScreen && currentUserDropdown.isOpen()" |
|||
> |
|||
@for (item of userMenu.items$ | async; track $index) { |
|||
<ng-container *abpVisible="!item.visible || item.visible(item)"> |
|||
<li class="nav-item d-flex align-items-center" *abpPermission="item.requiredPolicy"> |
|||
@if (item.component) { |
|||
<ng-container |
|||
[ngComponentOutlet]="item.component" |
|||
[ngComponentOutletInjector]="item | toInjector" |
|||
></ng-container> |
|||
} @else { |
|||
@if (item.html) { |
|||
<div [innerHTML]="item.html" (click)="item.action ? item.action() : null"></div> |
|||
} @else { |
|||
@if (item.textTemplate) { |
|||
<a (click)="item.action ? item.action() : null" class="dropdown-item pointer"> |
|||
@if (item.textTemplate.icon) { |
|||
<i class="me-1 {{ item.textTemplate.icon }}"></i> |
|||
} |
|||
{{ item.textTemplate.text | abpLocalization }}</a |
|||
> |
|||
} |
|||
} |
|||
} |
|||
</li> |
|||
</ng-container> |
|||
} |
|||
</div> |
|||
</div> |
|||
</div> |
|||
} @else { |
|||
<ng-template #loginBtn> |
|||
<a role="button" class="nav-link pointer" (click)="navigateToLogin()">{{ |
|||
'AbpAccount::Login' | abpLocalization |
|||
}}</a> |
|||
</ng-template> |
|||
} |
|||
|
|||
@ -1,18 +1,16 @@ |
|||
<ul class="navbar-nav"> |
|||
<ng-container *ngFor="let item of navItems.items$ | async; trackBy: trackByFn"> |
|||
<ng-container *abpVisible="!item.visible || item.visible(item)"> |
|||
@for (item of navItems.items$ | async; track $index) { |
|||
<ng-container *abpVisible="!item.visible || item.visible(item)"> |
|||
<li class="nav-item d-flex align-items-center" *abpPermission="item.requiredPolicy"> |
|||
<ng-container |
|||
|
|||
*ngIf="item.component; else htmlTemplate" |
|||
[ngComponentOutlet]="item.component" |
|||
[ngComponentOutletInjector]="item | toInjector" |
|||
></ng-container> |
|||
|
|||
<ng-template #htmlTemplate> |
|||
@if (item.component) { |
|||
<ng-container |
|||
[ngComponentOutlet]="item.component" |
|||
[ngComponentOutletInjector]="item | toInjector" |
|||
></ng-container> |
|||
} @else { |
|||
<div [innerHTML]="item.html" (click)="item.action ? item.action() : null"></div> |
|||
</ng-template> |
|||
} |
|||
</li> |
|||
</ng-container> |
|||
</ng-container> |
|||
</ul> |
|||
} |
|||
</ul> |
|||
|
|||
@ -1,24 +1,26 @@ |
|||
<ng-container *ngFor="let alert of service.alerts$ | async; let i = index"> |
|||
@for (alert of service.alerts$ | async; track i; let i = $index) { |
|||
<div |
|||
class="alert alert-{{ alert.type }} fade show" |
|||
[ngClass]="{ 'alert-dismissible fade show': alert.dismissible }" |
|||
role="alert" |
|||
> |
|||
<h4 |
|||
class="alert-heading" |
|||
*ngIf="alert.title" |
|||
[innerHTML]="alert.title | abpSafeHtml | abpLocalization: alert.titleLocalizationParams" |
|||
></h4> |
|||
@if (alert.title) { |
|||
<h4 |
|||
class="alert-heading" |
|||
[innerHTML]="alert.title | abpSafeHtml | abpLocalization: alert.titleLocalizationParams" |
|||
></h4> |
|||
} |
|||
<span |
|||
[innerHTML]="alert.message | abpSafeHtml | abpLocalization: alert.messageLocalizationParams" |
|||
></span> |
|||
<button |
|||
*ngIf="alert.dismissible" |
|||
type="button" |
|||
class="btn-close" |
|||
data-dismiss="alert" |
|||
aria-label="Close" |
|||
(click)="service.remove(i)" |
|||
></button> |
|||
@if (alert.dismissible) { |
|||
<button |
|||
type="button" |
|||
class="btn-close" |
|||
data-dismiss="alert" |
|||
aria-label="Close" |
|||
(click)="service.remove(i)" |
|||
></button> |
|||
} |
|||
</div> |
|||
</ng-container> |
|||
} |
|||
|
|||
@ -1,42 +1,51 @@ |
|||
<div class="confirmation" *ngIf="confirmation$ | async as data"> |
|||
<div |
|||
class="confirmation-backdrop" |
|||
(click)="data.options?.dismissible ? close(dismiss) : null" |
|||
></div> |
|||
<div class="confirmation-dialog"> |
|||
<div class="icon-container" [ngClass]="data.severity" *ngIf="data.severity || isCustomIconExists(data)"> |
|||
<div [outerHTML]="data.options.iconTemplate" *ngIf="isIconTemplateExits(data); else iconHolder" ></div> |
|||
<ng-template #iconHolder> |
|||
<i class="icon" [ngClass]="getIconClass(data)"></i> |
|||
</ng-template> |
|||
</div> |
|||
<div class="content"> |
|||
<h1 |
|||
class="title" |
|||
*ngIf="data.title" |
|||
[innerHTML]="data.title | abpLocalization: data.options?.titleLocalizationParams" |
|||
></h1> |
|||
<p |
|||
class="message" |
|||
*ngIf="data.message" |
|||
[innerHTML]="data.message | abpLocalization: data.options?.messageLocalizationParams" |
|||
></p> |
|||
</div> |
|||
<div class="footer"> |
|||
<button |
|||
id="cancel" |
|||
class="btn btn-outline-primary me-2" |
|||
[innerHTML]="data.options?.cancelText || 'AbpUi::Cancel' | abpLocalization" |
|||
*ngIf="!data?.options?.hideCancelBtn" |
|||
(click)="close(reject)" |
|||
></button> |
|||
<button |
|||
id="confirm" |
|||
class="btn btn-primary" |
|||
[innerHTML]="data.options?.yesText || 'AbpUi::Yes' | abpLocalization" |
|||
*ngIf="!data?.options?.hideYesBtn" |
|||
(click)="close(confirm)" |
|||
></button> |
|||
@if (confirmation$ | async; as data) { |
|||
<div class="confirmation"> |
|||
<div |
|||
class="confirmation-backdrop" |
|||
(click)="data.options?.dismissible ? close(dismiss) : null" |
|||
></div> |
|||
<div class="confirmation-dialog"> |
|||
@if (data.severity || isCustomIconExists(data)) { |
|||
<div class="icon-container" [ngClass]="data.severity"> |
|||
@if (isIconTemplateExits(data)) { |
|||
<div [outerHTML]="data.options.iconTemplate"></div> |
|||
} @else { |
|||
<i class="icon" [ngClass]="getIconClass(data)"></i> |
|||
} |
|||
</div> |
|||
} |
|||
<div class="content"> |
|||
@if (data.title) { |
|||
<h1 |
|||
class="title" |
|||
[innerHTML]="data.title | abpLocalization: data.options?.titleLocalizationParams" |
|||
></h1> |
|||
} |
|||
@if (data.message) { |
|||
<p |
|||
class="message" |
|||
[innerHTML]="data.message | abpLocalization: data.options?.messageLocalizationParams" |
|||
></p> |
|||
} |
|||
</div> |
|||
<div class="footer"> |
|||
@if (!data?.options?.hideCancelBtn) { |
|||
<button |
|||
id="cancel" |
|||
class="btn btn-outline-primary me-2" |
|||
[innerHTML]="data.options?.cancelText || 'AbpUi::Cancel' | abpLocalization" |
|||
(click)="close(reject)" |
|||
></button> |
|||
} |
|||
@if (!data?.options?.hideYesBtn) { |
|||
<button |
|||
id="confirm" |
|||
class="btn btn-primary" |
|||
[innerHTML]="data.options?.yesText || 'AbpUi::Yes' | abpLocalization" |
|||
(click)="close(confirm)" |
|||
></button> |
|||
} |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
} |
|||
|
|||
@ -1,21 +1,27 @@ |
|||
<ng-content></ng-content> |
|||
|
|||
<ng-template #modalContent let-modal> |
|||
<div *ngIf="abpHeader" id="abp-modal-header" class="modal-header abp-modal-header"> |
|||
<ng-container *ngTemplateOutlet="abpHeader"></ng-container> |
|||
|
|||
<button |
|||
id="abp-modal-close-button" |
|||
type="button" |
|||
class="btn-sm btn-close" |
|||
aria-label="Close" |
|||
(click)="modal.dismiss()" |
|||
></button> |
|||
</div> |
|||
<div *ngIf="abpBody" id="abp-modal-body" class="modal-body"> |
|||
<ng-container *ngTemplateOutlet="abpBody"></ng-container> |
|||
</div> |
|||
<div *ngIf="abpFooter" id="abp-modal-footer" class="modal-footer"> |
|||
<ng-container *ngTemplateOutlet="abpFooter"></ng-container> |
|||
</div> |
|||
@if (abpHeader) { |
|||
<div id="abp-modal-header" class="modal-header abp-modal-header"> |
|||
<ng-container *ngTemplateOutlet="abpHeader"></ng-container> |
|||
|
|||
<button |
|||
id="abp-modal-close-button" |
|||
type="button" |
|||
class="btn-sm btn-close" |
|||
aria-label="Close" |
|||
(click)="modal.dismiss()" |
|||
></button> |
|||
</div> |
|||
} |
|||
@if (abpBody) { |
|||
<div id="abp-modal-body" class="modal-body"> |
|||
<ng-container *ngTemplateOutlet="abpBody"></ng-container> |
|||
</div> |
|||
} |
|||
@if (abpFooter) { |
|||
<div id="abp-modal-footer" class="modal-footer"> |
|||
<ng-container *ngTemplateOutlet="abpFooter"></ng-container> |
|||
</div> |
|||
} |
|||
</ng-template> |
|||
|
|||
Loading…
Reference in new issue