File

src/app/modules/dashboard/components/report-summary/report-summary.component.ts

Implements

OnInit

Metadata

Index

Properties
Methods
Inputs

Constructor

constructor(reportService: ReportService, resourceService: ResourceService)
Parameters :
Name Type Optional
reportService ReportService No
resourceService ResourceService No

Inputs

inputData
Type : Array<ReportSummary>

Methods

ngOnInit
ngOnInit()
Returns : void

Properties

Public reportService
Type : ReportService
Public resourceService
Type : ResourceService
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}}: &nbsp;</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>

./report-summary.component.scss

.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
Component
Html element with directive

results matching ""

    No results matching ""