Merge "Fix style of the submit button on confirmation modal"

This commit is contained in:
Zuul 2017-11-09 16:50:13 +00:00 committed by Gerrit Code Review
commit d6df45eeb0
8 changed files with 25 additions and 13 deletions

View File

@ -14,8 +14,8 @@
type="button" ng-click="modalCtrl.cancel()"> type="button" ng-click="modalCtrl.cancel()">
<span ng-bind="::modalCtrl.context.cancel"></span> <span ng-bind="::modalCtrl.context.cancel"></span>
</button> </button>
<button class="btn btn-primary" <button class="btn" ng-class="modalCtrl.context.confirmCssClass"
type="button" ng-click="modalCtrl.submit()"> type="button" ng-click="modalCtrl.submit()">
<span ng-bind="::modalCtrl.context.submit"></span> <span ng-bind="::modalCtrl.context.submit"></span>
</button> </button>
</div> </div>

View File

@ -79,7 +79,8 @@
title: params.title, title: params.title,
body: params.body, body: params.body,
submit: params.submit || gettext('Submit'), submit: params.submit || gettext('Submit'),
cancel: params.cancel || gettext('Cancel') cancel: params.cancel || gettext('Cancel'),
confirmCssClass: params.confirmCssClass || "btn-primary"
}; };
} }
} }

View File

@ -43,13 +43,17 @@ horizon.modals.initModal = function (modal) {
}; };
/* Creates a modal dialog from the client-side template. */ /* Creates a modal dialog from the client-side template. */
horizon.modals.create = function (title, body, confirm, cancel) { horizon.modals.create = function (title, body, confirm, cancel, confirmCssClass) {
if (!cancel) { if (!cancel) {
cancel = gettext("Cancel"); cancel = gettext("Cancel");
} }
var template = horizon.templates.compiled_templates["#modal_template"], var template = horizon.templates.compiled_templates["#modal_template"],
params = { params = {
title: title, body: body, confirm: confirm, cancel: cancel, title: title,
body: body,
confirm: confirm,
cancel: cancel,
confirmCssClass: confirmCssClass || "btn-primary",
modal_backdrop: horizon.modals.MODAL_BACKDROP modal_backdrop: horizon.modals.MODAL_BACKDROP
}; };
return $(template.render(params)).appendTo("#modal_wrapper"); return $(template.render(params)).appendTo("#modal_wrapper");

View File

@ -318,8 +318,9 @@ horizon.datatables.confirm = function(action) {
} catch (e) { } catch (e) {
body = name_string + gettext("Please confirm your selection. ") + help_text; body = name_string + gettext("Please confirm your selection. ") + help_text;
} }
var actionNode = action.nodeType ? action: action[0];
var modal = horizon.modals.create(title, body, action_string); var confirmCssClass = actionNode.className.indexOf("btn-danger") >= 0 ? "btn-danger" : "btn-primary";
var modal = horizon.modals.create(title, body, action_string, "", confirmCssClass);
modal.modal(); modal.modal();
if ($uibModal_parent.length) { if ($uibModal_parent.length) {
@ -329,7 +330,7 @@ horizon.datatables.confirm = function(action) {
modal.css('z-index', child_backdrop.css('z-index')+10); modal.css('z-index', child_backdrop.css('z-index')+10);
} }
modal.find('.btn-primary').click(function () { modal.find('.' + confirmCssClass).click(function () {
var $form = $action.closest('form'); var $form = $action.closest('form');
var el = document.createElement("input"); var el = document.createElement("input");
el.type = 'hidden'; el.type = 'hidden';

View File

@ -18,7 +18,7 @@
</div> </div>
<div class='modal-footer'> <div class='modal-footer'>
<a href='#' class='btn btn-default cancel' data-dismiss='modal'>[[cancel]]</a> <a href='#' class='btn btn-default cancel' data-dismiss='modal'>[[cancel]]</a>
<a href='#' class='btn btn-primary'>[[confirm]]</a> <a href='#' class='btn [[confirmCssClass]]'>[[confirm]]</a>
</div> </div>
</div> </div>
</div> </div>

View File

@ -137,8 +137,9 @@
body: interpolate( body: interpolate(
gettext('Are you sure you want to delete container %(name)s?'), container, true gettext('Are you sure you want to delete container %(name)s?'), container, true
), ),
submit: gettext('Yes'), submit: gettext('Delete'),
cancel: gettext('No') cancel: gettext('Cancel'),
confirmCssClass: "btn-danger"
}; };
simpleModalService.modal(options).result.then(function confirmed() { simpleModalService.modal(options).result.then(function confirmed() {

View File

@ -32,7 +32,7 @@
<span class="fa fa-close"></span> <span class="fa fa-close"></span>
<translate>Cancel</translate> <translate>Cancel</translate>
</button> </button>
<button class="btn btn-primary" ng-disabled="ctrl.model.running" ng-click="ctrl.action()"> <button class="btn btn-danger" ng-disabled="ctrl.model.running" ng-click="ctrl.action()">
<translate ng-if="ctrl.model.mode === 'discovery'">Delete</translate> <translate ng-if="ctrl.model.mode === 'discovery'">Delete</translate>
<translate ng-if="ctrl.model.mode === 'deletion'">OK</translate> <translate ng-if="ctrl.model.mode === 'deletion'">OK</translate>
</button> </button>

View File

@ -283,6 +283,7 @@ class BaseFormRegion(baseregion.BaseRegion):
"""Base class for forms.""" """Base class for forms."""
_submit_locator = (by.By.CSS_SELECTOR, '*.btn.btn-primary') _submit_locator = (by.By.CSS_SELECTOR, '*.btn.btn-primary')
_submit_danger_locator = (by.By.CSS_SELECTOR, '*.btn.btn-danger')
_cancel_locator = (by.By.CSS_SELECTOR, '*.btn.cancel') _cancel_locator = (by.By.CSS_SELECTOR, '*.btn.cancel')
_default_form_locator = (by.By.CSS_SELECTOR, 'div.modal-dialog') _default_form_locator = (by.By.CSS_SELECTOR, 'div.modal-dialog')
@ -298,7 +299,11 @@ class BaseFormRegion(baseregion.BaseRegion):
@property @property
def _submit_element(self): def _submit_element(self):
return self._get_element(*self._submit_locator) try:
submit_element = self._get_element(*self._submit_locator)
except exceptions.NoSuchElementException:
submit_element = self._get_element(*self._submit_danger_locator)
return submit_element
def submit(self): def submit(self):
self._submit_element.click() self._submit_element.click()