Fix render of transaction summary

* do not display time_start and time_end transaction attributes
  if they are not specified
* display transaction name instead of graph_type
  of graph_type is not specified

Closes-Bug: #1647609

Change-Id: I29144644bb4c144cb09781f190294f6ad3cc5f4b
This commit is contained in:
Julia Aranovich 2016-12-06 12:02:49 +03:00
parent 1fefcfc42b
commit 7e6bb0618e
2 changed files with 35 additions and 22 deletions

View File

@ -351,7 +351,8 @@
"time_end": "Finished",
"status": "Status",
"message": "Message",
"dry_run": "dry run"
"dry_run": "dry run",
"name": "Name"
},
"transaction_statuses": {
"ready": "Ready",

View File

@ -113,6 +113,7 @@ HistoryTab = React.createClass({
var ns = 'cluster_page.history_tab.';
var transactions = cluster.get('transactions').filterTasks({active: false});
var activeTransaction = cluster.get('transactions').get(activeTransactionId);
var activeTransactionGraphType = activeTransaction && activeTransaction.get('graph_type');
var visibleTransactionsAmount = 7;
var visibleTransactions = transactions;
var hiddenTransactions = [];
@ -202,27 +203,36 @@ HistoryTab = React.createClass({
>
<div className='row'>
<div className='col-xs-2 transaction-summary-label'>
{i18n(ns + 'transaction_attributes.graph_type')}
{i18n(
ns + 'transaction_attributes.' +
(_.isNull(activeTransactionGraphType) ? 'name' : 'graph_type')
)}
</div>
<div className='col-xs-4'>
{i18n(
ns + 'graph_titles.' + activeTransaction.get('graph_type'),
{defaultValue: activeTransaction.get('graph_type')}
)}
{_.isNull(activeTransactionGraphType) ?
activeTransaction.get('name')
:
i18n(
ns + 'graph_titles.' + activeTransactionGraphType,
{defaultValue: activeTransactionGraphType}
)
}
{activeTransaction.get('dry_run') &&
<div className='dry-run-label label label-default'>
{i18n(ns + 'transaction_attributes.dry_run')}
</div>
}
</div>
<div className='col-xs-2 transaction-summary-label'>
{i18n(ns + 'transaction_attributes.time_start')}
</div>
<div className='col-xs-4'>
{utils.formatTimestamp(
utils.parseISO8601Date(activeTransaction.get('time_start'))
)}
</div>
{activeTransaction.get('time_start') && [
<div key='time-start-label' className='col-xs-2 transaction-summary-label'>
{i18n(ns + 'transaction_attributes.time_start')}
</div>,
<div key='time-start-value' className='col-xs-4'>
{utils.formatTimestamp(
utils.parseISO8601Date(activeTransaction.get('time_start'))
)}
</div>
]}
</div>
<div className='row'>
<div className='col-xs-2 transaction-summary-label'>
@ -234,14 +244,16 @@ HistoryTab = React.createClass({
{defaultValue: activeTransaction.get('status')}
)}
</div>
<div className='col-xs-2 transaction-summary-label'>
{i18n(ns + 'transaction_attributes.time_end')}
</div>
<div className='col-xs-4'>
{utils.formatTimestamp(
utils.parseISO8601Date(activeTransaction.get('time_end'))
)}
</div>
{activeTransaction.get('time_end') && [
<div key='time-end-label' className='col-xs-2 transaction-summary-label'>
{i18n(ns + 'transaction_attributes.time_end')}
</div>,
<div key='time-end-value' className='col-xs-4'>
{utils.formatTimestamp(
utils.parseISO8601Date(activeTransaction.get('time_end'))
)}
</div>
]}
</div>
<div className='row'>
<div className='col-xs-2 transaction-summary-label'>