61 lines
1.9 KiB
HTML
61 lines
1.9 KiB
HTML
<!-- Component Template -->
|
|
<ng-container *ngIf="getValue(wrapWithCard) | async; else componentsRef">
|
|
<x-card
|
|
class="x-card"
|
|
[showActions]="true"
|
|
[color]="getValue(cardColor) | async"
|
|
[ngClass]="getValue(cssClass) | async"
|
|
[isInPage]="getValue(isInPage) | async"
|
|
[showHeader]="
|
|
(notEmptyValue(cardTitle) | async) ||
|
|
(notEmptyValue(cardSubTitle) | async)
|
|
"
|
|
[subTitle]="getResourceValue(cardSubTitle)"
|
|
[title]="getResourceValue(cardTitle) | async"
|
|
[showFooter]="getValue(cardShowFooter) | async"
|
|
[showActions]="getValue(cardShowActions) | async"
|
|
[foregroundColor]="getValue(cardForegroundColor) | async"
|
|
>
|
|
<!-- Content -->
|
|
<ng-container *ngTemplateOutlet="componentsRef"></ng-container>
|
|
|
|
<!-- Actions -->
|
|
<div class="x-actions" [ngClass]="getValue(cssClass) | async" actions>
|
|
<ng-content select="[actions]"></ng-content>
|
|
</div>
|
|
|
|
<!-- Footer -->
|
|
<div footer *ngIf="getValue(cardShowFooter) | async">
|
|
<ng-content select="[footer]"></ng-content>
|
|
</div>
|
|
</x-card>
|
|
</ng-container>
|
|
|
|
<!-- Component's itSelf Template -->
|
|
<ng-template #componentsRef>
|
|
<!-- Component Box ... -->
|
|
<div
|
|
class="x-chart x-wrapper"
|
|
[class.mobile]="isMobileUi$ | async"
|
|
[ngClass]="getValue(cssClass) | async"
|
|
>
|
|
<!-- Toolbar -->
|
|
<x-action-bar
|
|
[color]="actionBarColor"
|
|
[cssClass]="actionBarCssClass"
|
|
[actionProvider]="actionBarActionProvider"
|
|
[foregroundColor]="actionBarForegroundColor"
|
|
(actionFired)="handleActionBarActionFired($event)"
|
|
*ngIf="
|
|
(getValue(showActionBar) | async) &&
|
|
(hasChildValue(actionBarActions) | async) &&
|
|
(hasChildValue(availableActionBarItems) | async)
|
|
"
|
|
[actions]="getArrayValue(actionBarActions) | async"
|
|
></x-action-bar>
|
|
|
|
<!-- Chart Box -->
|
|
<div #chartContainer class="x-chart-container"></div>
|
|
</div>
|
|
</ng-template>
|