4 * Copyright 2016 RIFT.IO Inc
6 * Licensed under the Apache License, Version 2.0 (the "License");
7 * you may not use this file except in compliance with the License.
8 * You may obtain a copy of the License at
10 * http://www.apache.org/licenses/LICENSE-2.0
12 * Unless required by applicable law or agreed to in writing, software
13 * distributed under the License is distributed on an "AS IS" BASIS,
14 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
15 * See the License for the specific language governing permissions and
16 * limitations under the License.
19 import React from 'react';
20 export default class PlacementGroupsInfo extends React.Component {
25 this.state.displayedGroup = null;
27 componentWillReceiveProps(props) {
30 dict: buildPlacementGroupDictFromVDUR(props.nsr),
31 // dict: buildPlacementGroupDict(props.nsr),
34 showDisplayGroup = (context, ref, type) => {
37 displayedGroup: this.state.dict[ref]
42 let vdurs = <VduPlacement nsr={this.props.nsr} showDisplayGroup={this.showDisplayGroup.bind(null, this)}/>;
43 let details = <PlacementGroupDetails displayedGroup={this.state.displayedGroup} />;
44 return <div className="placementGroups">{vdurs}{details}</div>;
47 PlacementGroupsInfo.defaultProps = {
52 class VduPlacement extends React.Component {
55 let {showDisplayGroup, nsr, ...props} = this.props;
57 <div className="panel panel-5">
58 <h3 className="sectionHeader">
61 <div className="vdupTable">
62 <div className="vdup-title">
64 <h4>Placement Group</h4>
66 <dl className="nsrType">
68 <div>NSR: {nsr.name}</div>
73 flattenPlacementGroupsToHTML(nsr, showDisplayGroup)
81 function flattenPlacementGroupsToHTML(nsr, onClick) {
83 nsr.vnfrs && nsr.vnfrs.map(function(v, i) {
86 <dl className="vnfrType" key={'vnfr-' + i}>
88 <div>VNFR: {v['short-name']}</div>
94 v && v.vdur && v.vdur.map(function(vd, j) {
97 <dl className="vduType" key={'vdur-' + i + '-'+ j}>
99 <div>VDUR: {vd['name']}</div>
104 vd['placement-groups-info'].map(function(p, k) {
105 return <li onClick={onClick.bind(null, p.name)} key={'pg-' + i + '-' + j + '-' + k}>{p.name}</li>
117 class PlacementGroupDetails extends React.Component {
120 let {displayedGroup, ...props} = this.props;
121 let dg = displayedGroup;
125 <dl className="placementGroupDetails">
129 <dd>{dg.requirement}</dd>
131 <dd>{dg.strategy}</dd>
132 <dt>Cloud Provider</dt>
133 <dd>{dg['cloud-type']}</dd>
135 (dg['availability-zone'] != undefined) ?
136 <dt>Availability Zone</dt> : ''
139 (dg['availability-zone'] != undefined) ?
140 <dd>{dg['availability-zone']}</dd> : ''
143 (dg['server-group'] != undefined) ?
144 <dt>Affinity/Anti-Affinity Server Group</dt> : ''
147 (dg['server-group'] != undefined) ?
148 <dd>{dg['server-group']}</dd> : ''
151 (dg['host-aggregate'] != undefined) ?
152 <dt>Host Aggregates</dt> : ''
155 dg['host-aggregate'] != undefined ?
157 {dg['host-aggregate'].map(function(ha, h) {
158 return <div key={h}>{ha['metadata-key']}:{ha['metadata-value']}</div>
167 <div className="panel panel-5">
168 <h3 className="sectionHeader">
169 Placement Group Details
179 PlacementGroupDetails.defaultProps = {
182 function buildPlacementGroupDictFromVDUR(data) {
184 data.vnfrs.map(function(vnf) {
185 vnf.vdur && vnf.vdur.map(function(v) {
186 v['placement-groups-info'].map(function(p) {
193 function buildPlacementGroupDict(data) {
195 let nsd = data['nsd-placement-group-maps'];
196 let vnfd = data['vnfd-placement-group-maps'];
197 nsd.map(function(m, i) {
198 d[m['placement-group-ref']] = m;
200 vnfd.map(function(m, i) {
201 d[m['placement-group-ref']] = m;