File
Implements
Index
Properties
|
|
Methods
|
|
Inputs
|
|
import { ResourceService } from '@sunbird/shared';
import { Component, OnInit, Input } from '@angular/core';
import { ReportService } from '../../services';
interface ReportSummary {
label: string;
text: Array<string>;
createdOn: string;
}
@Component({
selector: 'app-report-summary',
templateUrl: './report-summary.component.html',
styleUrls: ['./report-summary.component.scss']
})
export class ReportSummaryComponent implements OnInit {
@Input() inputData: Array<ReportSummary>;
constructor(public reportService: ReportService, public resourceService: ResourceService) { }
ngOnInit() {
}
}
<div class="ui message fsmall p-24 my-24">
<div class="mb-16" *ngFor="let summary of inputData">
<div class="header" *ngIf="summary?.label">
{{summary?.label}}
</div>
<div class="ui unordered list" *ngIf="summary?.text">
<div class="d-flex flex-jc-flex-end mt-8 mr-8 sb-last-update-status">
<span class="font-italic">{{summary?.label | titlecase}} {{resourceService?.frmelmnts?.lbl?.lastUpdatedOn}}: </span>
{{summary?.createdOn | date: 'medium'}}
</div>
<ng-container *ngFor="let body of summary.text">
<div class="item" [innerHTML]="reportService.transformHTML(body)"></div>
</ng-container>
</div>
</div>
</div>
.ui.message {
border-radius: 0px !important;
box-shadow: none !important;
background: var(--white) !important;
}
.header {
font-weight: 300;
}
.sb-last-update-status {
width:30%;
float:right;
}
.item {
width: 65%;
}
Legend
Html element with directive