openstack
/
fuel-ui
Code Issues Proposed changes

Display transaction summary on History tab 

Closes-Bug: #1616914
Partial-Bug: #1619733

Change-Id: Ifaaa903f99cfac0f9683e24a82a0de75a46baf62
This commit is contained in:
Julia Aranovich 2016-09-06 19:05:14 +03:00 committed by Vitaly Kramskikh
parent 00d15f9eb7
commit 07faba5864
3 changed files with 98 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
static/styles/main.less
View File

@ -5335,6 +5335,36 @@ input[type=range] {
}
}
.transaction-summary {
border-radius: 5px;
border: 1px solid #ccc;
padding: 10px;
margin-bottom: @base-indent;
> div {
margin-bottom: 5px;
&:last-child {
margin-bottom: 0;
}
}
&.ready {
.status {
.text-success;
}
}
&.error {
.status, .message {
.text-danger;
}
}
.transaction-summary-label {
.font-semibold;
}
.dry-run-label {
margin-left: 10px;
}
}
.screen-loading-bar {
margin: 0;
}

12
static/translations/core.json
View File

@ -339,6 +339,18 @@
"no_finished_deployment_alert": "No deployment finished yet.",
"graph_titles": {
"default": "Deployment"
},
"transaction_attributes": {
"graph_type": "Workflow",
"time_start": "Started",
"time_end": "Finished",
"status": "Status",
"message": "Message",
"dry_run": "DRY RUN"
},
"transaction_statuses": {
"ready": "Ready",
"error": "Error"
}
},
"workflows_tab": {

56
static/views/cluster_page_tabs/history_tab.js
View File

@ -112,6 +112,7 @@ HistoryTab = React.createClass({
var {deploymentHistory} = this.state;
var ns = 'cluster_page.history_tab.';
var transactions = cluster.get('transactions').filterTasks({active: false});
var activeTransaction = cluster.get('transactions').get(activeTransactionId);
var visibleTransactionsAmount = 7;
var visibleTransactions = transactions;
var hiddenTransactions = [];
@ -196,6 +197,61 @@ HistoryTab = React.createClass({
);
})}
</div>
<div
className={utils.classNames('transaction-summary', activeTransaction.get('status'))}
>
<div className='row'>
<div className='col-xs-2 transaction-summary-label'>
{i18n(ns + 'transaction_attributes.graph_type')}
</div>
<div className='col-xs-4'>
{i18n(
ns + 'graph_titles.' + activeTransaction.get('graph_type'),
{defaultValue: activeTransaction.get('graph_type')}
)}
{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>
</div>
<div className='row'>
<div className='col-xs-2 transaction-summary-label'>
{i18n(ns + 'transaction_attributes.status')}
</div>
<div className='col-xs-4 status'>
{i18n(
ns + 'transaction_statuses.' + activeTransaction.get('status'),
{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>
</div>
<div className='row'>
<div className='col-xs-2 transaction-summary-label'>
{i18n(ns + 'transaction_attributes.message')}
</div>
<div className='col-xs-10 transaction-summary-value message'>
{activeTransaction.get('message')}
</div>
</div>
</div>
{!_.isNull(deploymentHistory) &&
<ReactTransitionGroup
component='div'