Repository: ignite Updated Branches: refs/heads/master a8d50e4cd -> b12d73802
IGNITE-9733 Web Console: Added support for "type=number" on InputDialog Project: http://git-wip-us.apache.org/repos/asf/ignite/repo Commit: http://git-wip-us.apache.org/repos/asf/ignite/commit/b12d7380 Tree: http://git-wip-us.apache.org/repos/asf/ignite/tree/b12d7380 Diff: http://git-wip-us.apache.org/repos/asf/ignite/diff/b12d7380 Branch: refs/heads/master Commit: b12d73802616e831d828c4f380e177d465b97ccd Parents: a8d50e4 Author: Alexander Kalinin <verba...@yandex.ru> Authored: Fri Sep 28 10:36:30 2018 +0700 Committer: Alexey Kuznetsov <akuznet...@apache.org> Committed: Fri Sep 28 10:36:30 2018 +0700 ---------------------------------------------------------------------- .../components/form-field-size/template.pug | 6 +-- .../input-dialog/input-dialog.controller.js | 13 ++--- .../input-dialog/input-dialog.service.js | 54 +++++++++++++++----- .../input-dialog/input-dialog.tpl.pug | 25 ++++++--- .../app/primitives/form-field/number.pug | 2 +- 5 files changed, 68 insertions(+), 32 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/ignite/blob/b12d7380/modules/web-console/frontend/app/components/form-field/components/form-field-size/template.pug ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/components/form-field/components/form-field-size/template.pug b/modules/web-console/frontend/app/components/form-field/components/form-field-size/template.pug index f587112..b712a67 100644 --- a/modules/web-console/frontend/app/components/form-field/components/form-field-size/template.pug +++ b/modules/web-console/frontend/app/components/form-field/components/form-field-size/template.pug @@ -22,8 +22,8 @@ include /app/helpers/jade/mixins required: '$ctrl.required', disabled: '$ctrl.ngDisabled' }) - +form-field__tooltip({ title: '{{::$ctrl.tip}}' })( - ng-if='::$ctrl.tip' + +form-field__tooltip({title: '{{$ctrl.tip}}'})( + ng-if='$ctrl.tip' ) .form-field__control.form-field__control-group(ng-form='$ctrl.innerForm') @@ -74,4 +74,4 @@ include /app/helpers/jade/mixins +form-field__error({ error: 'step', message: 'Invalid step' - }) \ No newline at end of file + }) http://git-wip-us.apache.org/repos/asf/ignite/blob/b12d7380/modules/web-console/frontend/app/components/input-dialog/input-dialog.controller.js ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/components/input-dialog/input-dialog.controller.js b/modules/web-console/frontend/app/components/input-dialog/input-dialog.controller.js index a2dd035..1de142c 100644 --- a/modules/web-console/frontend/app/components/input-dialog/input-dialog.controller.js +++ b/modules/web-console/frontend/app/components/input-dialog/input-dialog.controller.js @@ -20,18 +20,15 @@ import _ from 'lodash'; export default class InputDialogController { static $inject = ['deferred', 'ui']; - constructor(deferred, {title, label, value, toValidValue}) { + constructor(deferred, options) { this.deferred = deferred; - this.title = title; - this.label = label; - this.value = value; - this.toValidValue = toValidValue; + this.options = options; } confirm() { - if (_.isFunction(this.toValidValue)) - return this.deferred.resolve(this.toValidValue(this.value)); + if (_.isFunction(this.options.toValidValue)) + return this.deferred.resolve(this.options.toValidValue(this.options.value)); - this.deferred.resolve(this.value); + this.deferred.resolve(this.options.value); } } http://git-wip-us.apache.org/repos/asf/ignite/blob/b12d7380/modules/web-console/frontend/app/components/input-dialog/input-dialog.service.js ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/components/input-dialog/input-dialog.service.js b/modules/web-console/frontend/app/components/input-dialog/input-dialog.service.js index 7ef9c07..6ddf051 100644 --- a/modules/web-console/frontend/app/components/input-dialog/input-dialog.service.js +++ b/modules/web-console/frontend/app/components/input-dialog/input-dialog.service.js @@ -33,27 +33,29 @@ export default class InputDialog { } /** - * Open input dialog to configure custom value. + * Fabric for creating modal instance with different input types. * - * @param {String} title Dialog title. - * @param {String} label Input field label. - * @param {String} value Default value. - * @param {Function} [toValidValue] Validator function. - * @returns {ng.IPromise<string>} User input. + * @param {Object} args Options for rendering inputs: + * @param {'text'|'number'} args.mode Input type. + * @param {String} args.title Dialog title. + * @param {String} args.label Input field label. + * @param {String} args.tip Message for tooltip in label. + * @param {String|Number} args.value Default value. + * @param {String} args.placeholder Placeholder for input. + * @param {Function} [args.toValidValue] Validator function. + * @param {Number} args.min Min value for number input. + * @param {Number} args.max Max value for number input. + * @param {String} args.postfix Postfix for units in numer input. + * @return {Promise.<String>} User input. */ - input(title, label, value, toValidValue) { + dialogFabric(args) { const deferred = this.$q.defer(); const modal = this.$modal({ templateUrl, resolve: { deferred: () => deferred, - ui: () => ({ - title, - label, - value, - toValidValue - }) + ui: () => args }, controller, controllerAs: 'ctrl' @@ -68,11 +70,25 @@ export default class InputDialog { } /** + * Open input dialog to configure custom value. + * + * @param {String} title Dialog title. + * @param {String} label Input field label. + * @param {String} value Default value. + * @param {Function} [toValidValue] Validator function. + * @param {'text'|'number'} mode Input type. + * @returns {ng.IPromise<string>} User input. + */ + input(title, label, value, toValidValue, mode = 'text') { + return this.dialogFabric({title, label, value, toValidValue, mode}); + } + + /** * Open input dialog to configure cloned object name. * * @param {String} srcName Name of source object. * @param {Array.<String>} names List of already exist names. - * @returns {ng.IPromise<string>} New name + * @returns {ng.IPromise<string>} New name. */ clone(srcName, names) { const uniqueName = (value) => { @@ -90,4 +106,14 @@ export default class InputDialog { return this.input('Clone', 'New name', uniqueName(srcName), uniqueName); } + + /** + * Open input dialog to configure custom number value. + * + * @param {Object} options Object with settings for rendering number input. + * @returns {Promise.<String>} User input. + */ + number(options) { + return this.dialogFabric({mode: 'number', ...options}); + } } http://git-wip-us.apache.org/repos/asf/ignite/blob/b12d7380/modules/web-console/frontend/app/components/input-dialog/input-dialog.tpl.pug ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/components/input-dialog/input-dialog.tpl.pug b/modules/web-console/frontend/app/components/input-dialog/input-dialog.tpl.pug index 50087e9..95cb059 100644 --- a/modules/web-console/frontend/app/components/input-dialog/input-dialog.tpl.pug +++ b/modules/web-console/frontend/app/components/input-dialog/input-dialog.tpl.pug @@ -16,22 +16,22 @@ include /app/helpers/jade/mixins -.modal.modal--ignite.theme--ignite(tabindex='-1' role='dialog') +.modal.modal--ignite.theme--ignite.input-dialog(tabindex='-1' role='dialog') .modal-dialog form.modal-content(name='ctrl.form' novalidate) .modal-header h4.modal-title i.fa.fa-clone - span {{ ctrl.title }} + span {{ ctrl.options.title }} button.close(type='button' aria-label='Close' ng-click='$hide()') svg(ignite-icon="cross") - .modal-body - .row + .modal-body(ng-switch='ctrl.options.mode') + .row(ng-switch-when='text') .col-100 +form-field__text({ - label: '{{ ctrl.label }}', - model: 'ctrl.value', + label: '{{ ctrl.options.label }}', + model: 'ctrl.options.value', name: '"inputDialogField"', required: true, placeholder: 'Enter value' @@ -39,6 +39,19 @@ include /app/helpers/jade/mixins ignite-form-field-input-autofocus='true' ignite-on-enter='form.$valid && ctrl.confirm()' ) + .row(ng-switch-when='number') + .col-100 + +form-field__number({ + label: '{{ ctrl.options.label }}', + model: 'ctrl.options.value', + name: '"number"', + placeholder: '{{ ctrl.options.placeholder }}', + min: '{{ ctrl.options.min }}', + max: '{{ ctrl.options.max }}', + tip: '{{ ctrl.options.tip }}', + postfix: '{{ ctrl.options.postfix }}', + required: true + }) .modal-footer div http://git-wip-us.apache.org/repos/asf/ignite/blob/b12d7380/modules/web-console/frontend/app/primitives/form-field/number.pug ---------------------------------------------------------------------- diff --git a/modules/web-console/frontend/app/primitives/form-field/number.pug b/modules/web-console/frontend/app/primitives/form-field/number.pug index 7755415..ea90709 100644 --- a/modules/web-console/frontend/app/primitives/form-field/number.pug +++ b/modules/web-console/frontend/app/primitives/form-field/number.pug @@ -15,7 +15,7 @@ limitations under the License. mixin form-field__number({ label, model, name, disabled, required, placeholder, tip, min, max, step = '1', postfix }) - -var errLbl = label.substring(0, label.length - 1) + -var errLbl = label[label.length - 1] === ':' ? label.substring(0, label.length - 1) : label .form-field.ignite-form-field +form-field__label({ label, name, required, disabled })
