support display error message when changing setting failed

master
MaysWind 2016-06-25 21:48:06 +08:00
parent d04d321de9
commit b6839d0a34
4 changed files with 110 additions and 4 deletions

View File

@ -23,7 +23,7 @@
if (response.success && response.data == 'OK') {
optionStatus.setSuccess();
} else {
optionStatus.setFailed();
optionStatus.setFailed(response.data.message);
}
}, true);
};

View File

@ -197,7 +197,7 @@
if (response.success && response.data == 'OK') {
optionStatus.setSuccess();
} else {
optionStatus.setFailed();
optionStatus.setFailed(response.data.message);
}
}, true);
};

View File

@ -24,27 +24,56 @@
scope.optionStatus = (function () {
var value = 'ready';
var destroyTooltip = function () {
angular.element(element).tooltip('destroy');
};
var showTooltip = function (cause, type) {
if (!cause) {
return;
}
angular.element(element).tooltip({
title: cause,
trigger: 'focus',
container: element,
template:
'<div class="tooltip' + (type ? ' tooltip-' + type : '') + '" role="tooltip">' +
'<div class="tooltip-arrow"></div>' +
'<div class="tooltip-inner"></div>' +
'</div>'
}).tooltip('show');
};
return {
getValue: function () {
return value;
},
setReady: function () {
destroyTooltip();
value = 'ready';
},
setPending: function () {
destroyTooltip();
value = 'pending';
},
setSaving: function () {
destroyTooltip();
value = 'pending';
},
setSuccess: function () {
destroyTooltip();
value = 'success';
},
setFailed: function () {
setFailed: function (cause) {
destroyTooltip();
value = 'failed';
showTooltip(cause, 'warning');
},
setError: function () {
setError: function (cause) {
destroyTooltip();
value = 'error';
showTooltip(cause, 'error');
},
getStatusFeedbackStyle: function () {
if (value == 'success') {

View File

@ -384,6 +384,83 @@ td {
color: #208fe5;
}
.skin-aria-ng .tooltip.tooltip-success.in, .skin-aria-ng .tooltip.tooltip-warning.in, .skin-aria-ng .tooltip.tooltip-error.in {
filter: alpha(opacity=95);
opacity: 0.95
}
.skin-aria-ng .tooltip.tooltip-success.top .tooltip-arrow,
.skin-aria-ng .tooltip.tooltip-success.top-left .tooltip-arrow,
.skin-aria-ng .tooltip.tooltip-success.top-right .tooltip-arrow {
border-top-color: #00a65a;
}
.skin-aria-ng .tooltip.tooltip-warning.top .tooltip-arrow,
.skin-aria-ng .tooltip.tooltip-warning.top-left .tooltip-arrow,
.skin-aria-ng .tooltip.tooltip-warning.top-right .tooltip-arrow {
border-top-color: #f39c12;
}
.skin-aria-ng .tooltip.tooltip-error.top .tooltip-arrow,
.skin-aria-ng .tooltip.tooltip-error.top-left .tooltip-arrow,
.skin-aria-ng .tooltip.tooltip-error.top-right .tooltip-arrow {
border-top-color: #dd4b39;
}
.skin-aria-ng .tooltip.tooltip-success.left .tooltip-arrow {
border-left-color: #00a65a;
}
.skin-aria-ng .tooltip.tooltip-warning.left .tooltip-arrow {
border-left-color: #f39c12;
}
.skin-aria-ng .tooltip.tooltip-error.left .tooltip-arrow {
border-left-color: #dd4b39;
}
.skin-aria-ng .tooltip.tooltip-success.right .tooltip-arrow {
border-right-color: #00a65a;
}
.skin-aria-ng .tooltip.tooltip-warning.right .tooltip-arrow {
border-right-color: #f39c12;
}
.skin-aria-ng .tooltip.tooltip-error.right .tooltip-arrow {
border-right-color: #dd4b39;
}
.skin-aria-ng .tooltip.tooltip-success.bottom .tooltip-arrow,
.skin-aria-ng .tooltip.tooltip-success.bottom-left .tooltip-arrow,
.skin-aria-ng .tooltip.tooltip-success.bottom-right .tooltip-arrow {
border-bottom-color: #00a65a;
}
.skin-aria-ng .tooltip.tooltip-warning.bottom .tooltip-arrow,
.skin-aria-ng .tooltip.tooltip-warning.bottom-left .tooltip-arrow,
.skin-aria-ng .tooltip.tooltip-warning.bottom-right .tooltip-arrow {
border-bottom-color: #f39c12;
}
.skin-aria-ng .tooltip.tooltip-error.bottom .tooltip-arrow,
.skin-aria-ng .tooltip.tooltip-error.bottom-left .tooltip-arrow,
.skin-aria-ng .tooltip.tooltip-error.bottom-right .tooltip-arrow {
border-bottom-color: #dd4b39;
}
.skin-aria-ng .tooltip.tooltip-success .tooltip-inner {
background-color: #00a65a;
}
.skin-aria-ng .tooltip.tooltip-warning .tooltip-inner {
background-color: #f39c12;
}
.skin-aria-ng .tooltip.tooltip-error .tooltip-inner {
background-color: #dd4b39;
}
.skin-aria-ng .input-group .form-group.has-success + .input-group-addon {
border-color: #00a65a;
background-color: #00a65a;