X-Git-Url: https://osm.etsi.org/gitweb/?p=osm%2FUI.git;a=blobdiff_plain;f=skyquake%2Fplugins%2Flaunchpad%2Fsrc%2FrecordViewer%2FrecordCard.jsx;h=ddb4779ddf4329cf9f212dd66b093371ef5803e2;hp=f69c2ba61a5cf7d155abb58de875089c7a1886c6;hb=a167f88c7e729d494ed2e27670cdf575795a21d1;hpb=a75ac3eb67ef3730e787d766224800c81f82a9fa

diff --git a/skyquake/plugins/launchpad/src/recordViewer/recordCard.jsx b/skyquake/plugins/launchpad/src/recordViewer/recordCard.jsx
index f69c2ba61..ddb4779dd 100644
--- a/skyquake/plugins/launchpad/src/recordViewer/recordCard.jsx
+++ b/skyquake/plugins/launchpad/src/recordViewer/recordCard.jsx
@@ -32,7 +32,7 @@ import PlacementGroupsInfo from './placementGroupsInfo.jsx';
 import JobListCard from '../launchpad_card/jobListCard.jsx';
 import NSVirtualLinks from '../virtual_links/nsVirtualLinks.jsx';
 import LaunchpadFleetStore from '../launchpadFleetStore.js';
-
+import _forEach from 'lodash/forEach';
 import Prism from 'prismjs';
 import 'prismjs/themes/prism.css';
 
@@ -106,7 +106,7 @@ export default class RecordCard extends React.Component {
                         //That match the currently selected job id
                         if(v.id == cardData.id) {
                           return v.primitive.map(function(p, i) {
-                            return <JobListCard type="vnfr" job-id={job['job-id']} cardData={cardData} key={ob['job-id'] + '-' + i} {...p} />
+                            return <JobListCard type="vnfr" job-id={job['job-id']} cardData={cardData} key={job['job-id'] + '-' + i} {...p} />
                           })
                         }
                       })
@@ -142,21 +142,23 @@ export default class RecordCard extends React.Component {
                 //     </pre>
                 function buildProperties(obj) {
                   let p = [];
-                    _.forEach(obj, function(v, k) {
+                    _forEach(obj, function(v, k) {
+                      if (!v) {
+                        return null;
+                      }
                     p.push(
-                      <div style={{margin: '0.5rem 0.5rem'}} key={k + vi}>
-                        <div style={{margin: '0 0.5rem',
-    fontWeight: 'bold', textTransform: 'uppercase'}}>{k}</div>
-                        <div style={{margin: '0 0.5rem'}}>{v.constructor.name != 'Object' ? v : buildProperties(v)}</div>
+                      <div style={{margin: '0.5rem 0.5rem'}} key={k + '-' + vi}>
+                        <div style={{margin: '0 0.5rem', fontWeight: 'bold', textTransform: 'uppercase', color: '#5b5b5b'}}>{k}</div>
+                        <div style={{margin: '0 0.5rem'}}>{(v.constructor.name == 'String' || v.constructor.name == 'Number') ? v : buildProperties(v)}</div>
                       </div>
                     )
                   });
                     return p;
                  }
                 volumesHTML.push(
-                    <div key={vi}>
+                    <div key={index + vi}>
                       <div className="launchpadCard_title">
-                        VOLUME
+                        VOLUME ({vdur['name']})
                       </div>
                       <div style={{display: 'flex', flexDirection: 'column'}}>
                       {
@@ -208,7 +210,7 @@ export default class RecordCard extends React.Component {
                         //That match the currently selected job id
                         if(v.id == cardData.id) {
                           return v.primitive.map(function(p, i) {
-                            return <JobListCard type="vnfr" job-id={job['job-id']} cardData={cardData} key={ob['job-id'] + '-' + 'vnfr' + '-' + h} {...p} />
+                            return <JobListCard type="vnfr" job-id={job['job-id']} cardData={cardData} key={job['job-id'] + '-' + 'vnfr' + '-' + h} {...p} />
                           })
                         }
                       })
@@ -266,7 +268,7 @@ export default class RecordCard extends React.Component {
       if(this.props.isLoading) {
         html = <DashboardCard className="loading" showHeader={true} title={cardData["short-name"]}><LoadingIndicator size={10} show={true} /></DashboardCard>
       } else {
-        let glyphValue = (this.props.mmmrecordDetailsToggleValue) ? "chevron-left" : "chevron-right";
+        let glyphValue = (!this.props.recordDetailsToggleValue) ? "chevron-left" : "chevron-right";
 
         if (this.props.type == 'nsr') {
           tabList.push(
@@ -369,11 +371,11 @@ export default class RecordCard extends React.Component {
           consoleUrlsTabTitle = 'VDU Console Links';
 
           tabList.push(
-            <Tab key={cardData.id + '-cp'}>{consoleUrlsTabTitle}</Tab>
+            <Tab key={cardData.id + '-vducl'}>{consoleUrlsTabTitle}</Tab>
           );
 
           tabPanels.push(
-            <TabPanel key={cardData.id + '-cp-panel'}>
+            <TabPanel key={cardData.id + '-vducl-panel'}>
               <div className="consoleUrls">
                 {consoleUrlsComponent}
               </div>