From 51d50f0ef642e0f996a1c8b8d2ef4838bdfec892 Mon Sep 17 00:00:00 2001
From: Tal Gitelman <tg851x@intl.att.com>
Date: Sun, 10 Dec 2017 18:55:03 +0200
Subject: Final commit to master merge from

Change-Id: Ib464f9a8828437c86fe6def8af238aaf83473507
Issue-ID: SDC-714
Signed-off-by: Tal Gitelman <tg851x@intl.att.com>
---
 .../radio-buttons/radio-button.component.less      | 42 ++++++++++++++++++++++
 .../radio-buttons/radio-buttons.component.html     |  8 +++++
 .../radio-buttons/radio-buttons.component.ts       | 29 +++++++++++++++
 3 files changed, 79 insertions(+)
 create mode 100644 catalog-ui/src/app/ng2/components/ui/form-components/radio-buttons/radio-button.component.less
 create mode 100644 catalog-ui/src/app/ng2/components/ui/form-components/radio-buttons/radio-buttons.component.html
 create mode 100644 catalog-ui/src/app/ng2/components/ui/form-components/radio-buttons/radio-buttons.component.ts

(limited to 'catalog-ui/src/app/ng2/components/ui/form-components/radio-buttons')

diff --git a/catalog-ui/src/app/ng2/components/ui/form-components/radio-buttons/radio-button.component.less b/catalog-ui/src/app/ng2/components/ui/form-components/radio-buttons/radio-button.component.less
new file mode 100644
index 0000000000..b929486b10
--- /dev/null
+++ b/catalog-ui/src/app/ng2/components/ui/form-components/radio-buttons/radio-button.component.less
@@ -0,0 +1,42 @@
+@import './../../../../../../assets/styles/variables.less';
+.radio-buttons-container{
+  display: flex;
+  &.vertical{
+    flex-direction: column;
+  }
+  &.horizontal{
+    flex-direction: row;
+  }
+}
+.radio-button {
+  margin: 0 10px 10px 0;
+  display: flex;
+}
+
+input[type=radio] {
+  width:0;
+  height:0;
+  display:none;
+  &[disabled] ~ .radio-button {
+
+  }
+}
+
+.shown-radio-button{
+  border: @main_color_n solid 1px;
+  height: 14px;
+  width: 14px;
+  border-radius: 50%;
+  padding: 1px;
+  margin: auto 5px;
+  .selected{
+    background-color: @main_color_a;
+    height: 100%;
+    width: 100%;
+    border-radius: 50%;
+  }
+}
+span{
+  margin: auto 0;
+  color: @func_color_s;
+}
diff --git a/catalog-ui/src/app/ng2/components/ui/form-components/radio-buttons/radio-buttons.component.html b/catalog-ui/src/app/ng2/components/ui/form-components/radio-buttons/radio-buttons.component.html
new file mode 100644
index 0000000000..6c927301db
--- /dev/null
+++ b/catalog-ui/src/app/ng2/components/ui/form-components/radio-buttons/radio-buttons.component.html
@@ -0,0 +1,8 @@
+<div class="radio-buttons-container {{direction}}">
+    <div *ngFor="let option of options" class="radio-button" [ngClass]="{'disabled':readonly}">
+        <input type="radio" [(ngModel)]="value"  name="{{fieldName}}" value="{{option.value}}" [disabled]="readonly"/>
+        <div class="shown-radio-button" (click)="!readonly && select(option.value)"><div *ngIf="value==option.value" class="selected"></div></div>
+        <span>{{option.key}}</span>
+    </div>
+</div>
+
diff --git a/catalog-ui/src/app/ng2/components/ui/form-components/radio-buttons/radio-buttons.component.ts b/catalog-ui/src/app/ng2/components/ui/form-components/radio-buttons/radio-buttons.component.ts
new file mode 100644
index 0000000000..0f80e2ad44
--- /dev/null
+++ b/catalog-ui/src/app/ng2/components/ui/form-components/radio-buttons/radio-buttons.component.ts
@@ -0,0 +1,29 @@
+/**
+ * Created by rc2122 on 9/4/2017.
+ */
+import { Component, Input, Output, EventEmitter, ViewEncapsulation } from '@angular/core';
+import { RadioButtonModel } from 'app/models'
+import {UiElementBaseInterface, UiElementBase} from "../ui-element-base.component";
+
+@Component({
+    selector: 'radio-buttons',
+    templateUrl: './radio-buttons.component.html',
+    styleUrls: ['./radio-button.component.less']
+})
+export class RadioButtonComponent  extends UiElementBase implements UiElementBaseInterface {
+    
+    onSave() {
+        this.baseEmitter.emit(this.value);
+    }
+
+    @Input() options:Array<RadioButtonModel>;
+    @Input() readonly:boolean;
+    @Input() direction:string = 'vertical'; //get 'horizontal' | 'vertical'
+    value:any;
+    
+    select(value:any) {
+        this.value = value;
+        this.baseEmitter.emit(this.value);
+    }
+}
+
-- 
cgit 1.2.3-korg