diff options
author | 2018-07-10 15:57:37 +0300 | |
---|---|---|
committer | 2018-07-10 15:57:37 +0300 | |
commit | ff76b5ed0aa91d5fdf9dc4f95e8b20f91ed9d072 (patch) | |
tree | aae42404a93fdffdd16ff050eaa28129959f7577 /vid-webpack-master/src/app/shared/components/model-information | |
parent | c72d565bb58226b20625b2bce5f0019046bee649 (diff) |
New Angular UI from 1806
Change-Id: I39c160db0e0a6ec2e587ccf007ee1b23c6a08666
Issue-ID: VID-208
Signed-off-by: Sonsino, Ofir (os0695) <os0695@intl.att.com>
Diffstat (limited to 'vid-webpack-master/src/app/shared/components/model-information')
3 files changed, 88 insertions, 0 deletions
diff --git a/vid-webpack-master/src/app/shared/components/model-information/model-information.component.ts b/vid-webpack-master/src/app/shared/components/model-information/model-information.component.ts new file mode 100644 index 00000000..fea4c44c --- /dev/null +++ b/vid-webpack-master/src/app/shared/components/model-information/model-information.component.ts @@ -0,0 +1,42 @@ +import {Component, Input} from '@angular/core'; +import * as _ from 'lodash'; + +@Component({ + selector: 'model-information', + templateUrl: 'model-information.html', + styleUrls: ['model-information.scss'] +}) + +export class ModelInformationComponent { + private _modelInformationItems: Array<ModelInformationItem>; + + + get modelInformationItems(): Array<ModelInformationItem> { + return this._modelInformationItems; + } + + @Input() + set modelInformationItems(_modelInformationItems: Array<ModelInformationItem>) { + if (_modelInformationItems) { + this._modelInformationItems = _modelInformationItems.filter(x => x.mandatory || (!_.isEmpty(x.values) && !_.isEmpty(x.values[0]))); + } + } +} + + +export class ModelInformationItem { + label: string; + testsId: string; + values: Array<string>; + toolTipText: string; + mandatory: boolean; + + constructor(label: string, testsId: string, values: Array<any>, toolTipText: string = "", mandatory: boolean = false,nested:boolean=false) { + this.label = label; + this.testsId = testsId; + this.values = values; + this.toolTipText = toolTipText; + this.mandatory = mandatory; + } + +} diff --git a/vid-webpack-master/src/app/shared/components/model-information/model-information.html b/vid-webpack-master/src/app/shared/components/model-information/model-information.html new file mode 100644 index 00000000..456dfdee --- /dev/null +++ b/vid-webpack-master/src/app/shared/components/model-information/model-information.html @@ -0,0 +1,12 @@ +<div id="model-information"> + <div *ngFor="let item of modelInformationItems" class="item" attr.data-tests-id="model-item-{{item.label}}"> + <tooltip-content #a> + <span> {{item.toolTipText}}</span> + </tooltip-content> + + <div class="wrapper" [tooltip]="a" [tooltipDisabled]="!item.toolTipText" tooltipPlacement="top" [tooltipAnimation]="false"> + <label attr.data-tests-id="model-item-label-{{item.testsId}}">{{item.label}}</label> + <div *ngFor="let value of item.values" attr.data-tests-id="model-item-value-{{item.testsId}}">{{value}}</div> + </div> + </div> +</div> diff --git a/vid-webpack-master/src/app/shared/components/model-information/model-information.scss b/vid-webpack-master/src/app/shared/components/model-information/model-information.scss new file mode 100644 index 00000000..cd42136e --- /dev/null +++ b/vid-webpack-master/src/app/shared/components/model-information/model-information.scss @@ -0,0 +1,34 @@ +#model-information { + overflow: auto; + +} + +tooltip-content span { + font-family: OpenSans-Regular; + font-size: 12px; + color: #FFFFFF; + letter-spacing: 0; + line-height: 16px; +} + +.item { + display: block; + + .wrapper { + + display: inline-block; + margin-bottom: 25px; + + label { + font-family: OpenSans-Semibold; + font-size: 12px; + } + + div { + font-family: OpenSans-Regular; + font-size: 14px; + } + } +} + + |