From 21d72c4a80fe2937d0c4ddd20624b27adbcd989b Mon Sep 17 00:00:00 2001 From: lizi00164331 Date: Mon, 7 Aug 2017 11:39:39 +0800 Subject: Upload the ESR GUI seed code Issue-ID: AAI-68 Change-Id: Ia50ce0570c2fabecd77199d4e8454f56fe587c4e Signed-off-by: lizi00164331 --- esr/src/main/webapp/extsys/vim/js/client-cometd.js | 63 ++ .../webapp/extsys/vim/js/jqBootstrapValidation.js | 925 +++++++++++++++++++++ esr/src/main/webapp/extsys/vim/js/vim-validate.js | 116 +++ esr/src/main/webapp/extsys/vim/js/vimChart.js | 430 ++++++++++ .../webapp/extsys/vim/js/vimChartController.js | 160 ++++ esr/src/main/webapp/extsys/vim/js/vimController.js | 319 +++++++ esr/src/main/webapp/extsys/vim/js/vimUtil.js | 51 ++ 7 files changed, 2064 insertions(+) create mode 100644 esr/src/main/webapp/extsys/vim/js/client-cometd.js create mode 100644 esr/src/main/webapp/extsys/vim/js/jqBootstrapValidation.js create mode 100644 esr/src/main/webapp/extsys/vim/js/vim-validate.js create mode 100644 esr/src/main/webapp/extsys/vim/js/vimChart.js create mode 100644 esr/src/main/webapp/extsys/vim/js/vimChartController.js create mode 100644 esr/src/main/webapp/extsys/vim/js/vimController.js create mode 100644 esr/src/main/webapp/extsys/vim/js/vimUtil.js (limited to 'esr/src/main/webapp/extsys/vim/js') diff --git a/esr/src/main/webapp/extsys/vim/js/client-cometd.js b/esr/src/main/webapp/extsys/vim/js/client-cometd.js new file mode 100644 index 0000000..86c60bf --- /dev/null +++ b/esr/src/main/webapp/extsys/vim/js/client-cometd.js @@ -0,0 +1,63 @@ +/* + * Copyright 2016-2017 ZTE Corporation. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +/** + * Created by 10184303 on 15-11-17. + */ + +$(function () { + var registerCometdMessage = function (url, callback) { + var cometd = new $.Cometd(); + var cometdURL = location.protocol + "//" + location.host + "/api/nsocnotification/v1"; + cometd.configure({ + url: cometdURL, + logLevel: "debug" + }); + + cometd.addListener("/meta/handshake", function (handshake) { + if (handshake.successful === true) { + cometd.batch(function () { + cometd.subscribe(url, function (message) { + callback.call(this, message.data); + }); + }); + } + }); + cometd.handshake(); + } + registerCometdMessage("/VIMstatus", function (data) { + var alarmArray = JSON.parse(data.greeting); + console.log(data.greeting); + for (var i = 0; i < alarmArray.length; i++) { + vm.vimStatusTime = alarmArray[i].checkTime; + for (var n = 0; n < vm.vimInfo.length; n++) { + if (alarmArray[i].id == vm.vimInfo[n].oid && alarmArray[i].hostStorageInfo == "") { + vm.vimInfo[n].status = alarmArray[i].status; + vm.vimInfo[n].errorInfo = alarmArray[i].alarmContent; + break; + } + if (alarmArray[i].id == vm.vimInfo[n].oid && alarmArray[i].hostStorageInfo.length != "") { + vm.vimInfo[n].status = "inactive"; + vm.vimInfo[n].errorInfo = alarmArray[i].hostStorageInfo; + break; + } + + } + } + + setTimeout('resUtil.tooltipVimStatus()', 5000); + }); +}); + diff --git a/esr/src/main/webapp/extsys/vim/js/jqBootstrapValidation.js b/esr/src/main/webapp/extsys/vim/js/jqBootstrapValidation.js new file mode 100644 index 0000000..d88405b --- /dev/null +++ b/esr/src/main/webapp/extsys/vim/js/jqBootstrapValidation.js @@ -0,0 +1,925 @@ +/* + * Copyright 2016-2017 ZTE Corporation. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +/* jqBootstrapValidation + * A plugin for automating validation on Twitter Bootstrap formatted forms. + * + * v1.3.6 + * + * License: MIT - see LICENSE file + * + * http://ReactiveRaven.github.com/jqBootstrapValidation/ + */ + +(function ($) { + + var createdElements = []; + + var defaults = { + options: { + prependExistingHelpBlock: false, + sniffHtml: true, // sniff for 'required', 'maxlength', etc + preventSubmit: true, // stop the form submit event from firing if validation fails + submitError: false, // function called if there is an error when trying to submit + submitSuccess: false, // function called just before a successful submit event is sent to the server + semanticallyStrict: false, // set to true to tidy up generated HTML output + autoAdd: { + helpBlocks: true + }, + filter: function () { + // return $(this).is(":visible"); // only validate elements you can see + return true; // validate everything + } + }, + methods: { + init: function (options) { + + var settings = $.extend(true, {}, defaults); + + settings.options = $.extend(true, settings.options, options); + + var $siblingElements = this; + + var uniqueForms = $.unique( + $siblingElements.map(function () { + return $(this).parents("form")[0]; + }).toArray() + ); + + $(uniqueForms).bind("submit", function (e) { + var $form = $(this); + var warningsFound = 0; + var $inputs = $form.find("input,textarea,select").not("[type=submit],[type=image]").filter(settings.options.filter); + $inputs.trigger("submit.validation").trigger("validationLostFocus.validation"); + + $inputs.each(function (i, el) { + var $this = $(el), + $controlGroup = $this.parents(".control-group").first(); + if ( + $controlGroup.hasClass("warning") + ) { + $controlGroup.removeClass("warning").addClass("error"); + warningsFound++; + } + }); + + $inputs.trigger("validationLostFocus.validation"); + + if (warningsFound) { + if (settings.options.preventSubmit) { + e.preventDefault(); + } + $form.addClass("error"); + if ($.isFunction(settings.options.submitError)) { + settings.options.submitError($form, e, $inputs.jqBootstrapValidation("collectErrors", true)); + } + } else { + $form.removeClass("error"); + if ($.isFunction(settings.options.submitSuccess)) { + settings.options.submitSuccess($form, e); + } + } + }); + + return this.each(function () { + + // Get references to everything we're interested in + var $this = $(this), + $controlGroup = $this.parents(".control-group").first(), + $helpBlock = $controlGroup.find(".help-block").first(), + $form = $this.parents("form").first(), + validatorNames = []; + + // create message container if not exists + if (!$helpBlock.length && settings.options.autoAdd && settings.options.autoAdd.helpBlocks) { + $helpBlock = $('
'); + $controlGroup.find('.controls').append($helpBlock); + createdElements.push($helpBlock[0]); + } + + // ============================================================= + // SNIFF HTML FOR VALIDATORS + // ============================================================= + + // *snort sniff snuffle* + + if (settings.options.sniffHtml) { + var message = ""; + // --------------------------------------------------------- + // PATTERN + // --------------------------------------------------------- + if ($this.attr("pattern") !== undefined) { + message = "Not in the expected format"; + if ($this.data("validationPatternMessage")) { + message = $this.data("validationPatternMessage"); + } + $this.data("validationPatternMessage", message); + $this.data("validationPatternRegex", $this.attr("pattern")); + } + // --------------------------------------------------------- + // MAX + // --------------------------------------------------------- + if ($this.attr("max") !== undefined || $this.attr("aria-valuemax") !== undefined) { + var max = ($this.attr("max") !== undefined ? $this.attr("max") : $this.attr("aria-valuemax")); + message = "Too high: Maximum of '" + max + "'"; + if ($this.data("validationMaxMessage")) { + message = $this.data("validationMaxMessage"); + } + $this.data("validationMaxMessage", message); + $this.data("validationMaxMax", max); + } + // --------------------------------------------------------- + // MIN + // --------------------------------------------------------- + if ($this.attr("min") !== undefined || $this.attr("aria-valuemin") !== undefined) { + var min = ($this.attr("min") !== undefined ? $this.attr("min") : $this.attr("aria-valuemin")); + message = "Too low: Minimum of '" + min + "'"; + if ($this.data("validationMinMessage")) { + message = $this.data("validationMinMessage"); + } + $this.data("validationMinMessage", message); + $this.data("validationMinMin", min); + } + // --------------------------------------------------------- + // MAXLENGTH + // --------------------------------------------------------- + if ($this.attr("maxlength") !== undefined) { + message = "Too long: Maximum of '" + $this.attr("maxlength") + "' characters"; + if ($this.data("validationMaxlengthMessage")) { + message = $this.data("validationMaxlengthMessage"); + } + $this.data("validationMaxlengthMessage", message); + $this.data("validationMaxlengthMaxlength", $this.attr("maxlength")); + } + // --------------------------------------------------------- + // MINLENGTH + // --------------------------------------------------------- + if ($this.attr("minlength") !== undefined) { + message = "Too short: Minimum of '" + $this.attr("minlength") + "' characters"; + if ($this.data("validationMinlengthMessage")) { + message = $this.data("validationMinlengthMessage"); + } + $this.data("validationMinlengthMessage", message); + $this.data("validationMinlengthMinlength", $this.attr("minlength")); + } + // --------------------------------------------------------- + // REQUIRED + // --------------------------------------------------------- + if ($this.attr("required") !== undefined || $this.attr("aria-required") !== undefined) { + message = settings.builtInValidators.required.message; + if ($this.data("validationRequiredMessage")) { + message = $this.data("validationRequiredMessage"); + } + $this.data("validationRequiredMessage", message); + } + // --------------------------------------------------------- + // NUMBER + // --------------------------------------------------------- + if ($this.attr("type") !== undefined && $this.attr("type").toLowerCase() === "number") { + message = settings.builtInValidators.number.message; + if ($this.data("validationNumberMessage")) { + message = $this.data("validationNumberMessage"); + } + $this.data("validationNumberMessage", message); + } + // --------------------------------------------------------- + // EMAIL + // --------------------------------------------------------- + if ($this.attr("type") !== undefined && $this.attr("type").toLowerCase() === "email") { + message = "Not a valid email address"; + if ($this.data("validationValidemailMessage")) { + message = $this.data("validationValidemailMessage"); + } else if ($this.data("validationEmailMessage")) { + message = $this.data("validationEmailMessage"); + } + $this.data("validationValidemailMessage", message); + } + // --------------------------------------------------------- + // MINCHECKED + // --------------------------------------------------------- + if ($this.attr("minchecked") !== undefined) { + message = "Not enough options checked; Minimum of '" + $this.attr("minchecked") + "' required"; + if ($this.data("validationMincheckedMessage")) { + message = $this.data("validationMincheckedMessage"); + } + $this.data("validationMincheckedMessage", message); + $this.data("validationMincheckedMinchecked", $this.attr("minchecked")); + } + // --------------------------------------------------------- + // MAXCHECKED + // --------------------------------------------------------- + if ($this.attr("maxchecked") !== undefined) { + message = "Too many options checked; Maximum of '" + $this.attr("maxchecked") + "' required"; + if ($this.data("validationMaxcheckedMessage")) { + message = $this.data("validationMaxcheckedMessage"); + } + $this.data("validationMaxcheckedMessage", message); + $this.data("validationMaxcheckedMaxchecked", $this.attr("maxchecked")); + } + } + + // ============================================================= + // COLLECT VALIDATOR NAMES + // ============================================================= + + // Get named validators + if ($this.data("validation") !== undefined) { + validatorNames = $this.data("validation").split(","); + } + + // Get extra ones defined on the element's data attributes + $.each($this.data(), function (i, el) { + var parts = i.replace(/([A-Z])/g, ",$1").split(","); + if (parts[0] === "validation" && parts[1]) { + validatorNames.push(parts[1]); + } + }); + + // ============================================================= + // NORMALISE VALIDATOR NAMES + // ============================================================= + + var validatorNamesToInspect = validatorNames; + var newValidatorNamesToInspect = []; + + do // repeatedly expand 'shortcut' validators into their real validators + { + // Uppercase only the first letter of each name + $.each(validatorNames, function (i, el) { + validatorNames[i] = formatValidatorName(el); + }); + + // Remove duplicate validator names + validatorNames = $.unique(validatorNames); + + // Pull out the new validator names from each shortcut + newValidatorNamesToInspect = []; + $.each(validatorNamesToInspect, function (i, el) { + if ($this.data("validation" + el + "Shortcut") !== undefined) { + // Are these custom validators? + // Pull them out! + $.each($this.data("validation" + el + "Shortcut").split(","), function (i2, el2) { + newValidatorNamesToInspect.push(el2); + }); + } else if (settings.builtInValidators[el.toLowerCase()]) { + // Is this a recognised built-in? + // Pull it out! + var validator = settings.builtInValidators[el.toLowerCase()]; + if (validator.type.toLowerCase() === "shortcut") { + $.each(validator.shortcut.split(","), function (i, el) { + el = formatValidatorName(el); + newValidatorNamesToInspect.push(el); + validatorNames.push(el); + }); + } + } + }); + + validatorNamesToInspect = newValidatorNamesToInspect; + + } while (validatorNamesToInspect.length > 0) + + // ============================================================= + // SET UP VALIDATOR ARRAYS + // ============================================================= + + var validators = {}; + + $.each(validatorNames, function (i, el) { + // Set up the 'override' message + var message = $this.data("validation" + el + "Message"); + var hasOverrideMessage = (message !== undefined); + var foundValidator = false; + message = + ( + message + ? message + : "'" + el + "' validation failed " + ) + ; + + $.each( + settings.validatorTypes, + function (validatorType, validatorTemplate) { + if (validators[validatorType] === undefined) { + validators[validatorType] = []; + } + if (!foundValidator && $this.data("validation" + el + formatValidatorName(validatorTemplate.name)) !== undefined) { + validators[validatorType].push( + $.extend( + true, + { + name: formatValidatorName(validatorTemplate.name), + message: message + }, + validatorTemplate.init($this, el) + ) + ); + foundValidator = true; + } + } + ); + + if (!foundValidator && settings.builtInValidators[el.toLowerCase()]) { + + var validator = $.extend(true, {}, settings.builtInValidators[el.toLowerCase()]); + if (hasOverrideMessage) { + validator.message = message; + } + var validatorType = validator.type.toLowerCase(); + + if (validatorType === "shortcut") { + foundValidator = true; + } else { + $.each( + settings.validatorTypes, + function (validatorTemplateType, validatorTemplate) { + if (validators[validatorTemplateType] === undefined) { + validators[validatorTemplateType] = []; + } + if (!foundValidator && validatorType === validatorTemplateType.toLowerCase()) { + $this.data("validation" + el + formatValidatorName(validatorTemplate.name), validator[validatorTemplate.name.toLowerCase()]); + validators[validatorType].push( + $.extend( + validator, + validatorTemplate.init($this, el) + ) + ); + foundValidator = true; + } + } + ); + } + } + + if (!foundValidator) { + $.error("Cannot find validation info for '" + el + "'"); + } + }); + + // ============================================================= + // STORE FALLBACK VALUES + // ============================================================= + + $helpBlock.data( + "original-contents", + ( + $helpBlock.data("original-contents") + ? $helpBlock.data("original-contents") + : $helpBlock.html() + ) + ); + + $helpBlock.data( + "original-role", + ( + $helpBlock.data("original-role") + ? $helpBlock.data("original-role") + : $helpBlock.attr("role") + ) + ); + + $controlGroup.data( + "original-classes", + ( + $controlGroup.data("original-clases") + ? $controlGroup.data("original-classes") + : $controlGroup.attr("class") + ) + ); + + $this.data( + "original-aria-invalid", + ( + $this.data("original-aria-invalid") + ? $this.data("original-aria-invalid") + : $this.attr("aria-invalid") + ) + ); + + // ============================================================= + // VALIDATION + // ============================================================= + + $this.bind( + "validation.validation", + function (event, params) { + + var value = getValue($this); + + // Get a list of the errors to apply + var errorsFound = []; + + $.each(validators, function (validatorType, validatorTypeArray) { + if (value || value.length || (params && params.includeEmpty) || (!!settings.validatorTypes[validatorType].blockSubmit && params && !!params.submitting)) { + $.each(validatorTypeArray, function (i, validator) { + if (settings.validatorTypes[validatorType].validate($this, value, validator)) { + errorsFound.push(validator.message); + } + }); + } + }); + + return errorsFound; + } + ); + + $this.bind( + "getValidators.validation", + function () { + return validators; + } + ); + + // ============================================================= + // WATCH FOR CHANGES + // ============================================================= + $this.bind( + "submit.validation", + function () { + return $this.triggerHandler("change.validation", {submitting: true}); + } + ); + $this.bind( + [ + "keyup", + "focus", + "blur", + "click", + "keydown", + "keypress", + "change" + ].join(".validation ") + ".validation", + function (e, params) { + + var value = getValue($this); + + var errorsFound = []; + + $controlGroup.find("input,textarea,select").each(function (i, el) { + var oldCount = errorsFound.length; + $.each($(el).triggerHandler("validation.validation", params), function (j, message) { + errorsFound.push(message); + }); + if (errorsFound.length > oldCount) { + $(el).attr("aria-invalid", "true"); + } else { + var original = $this.data("original-aria-invalid"); + $(el).attr("aria-invalid", (original !== undefined ? original : false)); + } + }); + + $form.find("input,select,textarea").not($this).not("[name=\"" + $this.attr("name") + "\"]").trigger("validationLostFocus.validation"); + + errorsFound = $.unique(errorsFound.sort()); + + // Were there any errors? + if (errorsFound.length) { + // Better flag it up as a warning. + $controlGroup.removeClass("success error").addClass("warning"); + + // How many errors did we find? + if (settings.options.semanticallyStrict && errorsFound.length === 1) { + // Only one? Being strict? Just output it. + $helpBlock.html(errorsFound[0] + + ( settings.options.prependExistingHelpBlock ? $helpBlock.data("original-contents") : "" )); + } else { + // Multiple? Being sloppy? Glue them together into an UL. + $helpBlock.html("
  • " + errorsFound.join("
  • ") + "
" + + ( settings.options.prependExistingHelpBlock ? $helpBlock.data("original-contents") : "" )); + } + } else { + $controlGroup.removeClass("warning error success"); + if (value.length > 0) { + $controlGroup.addClass("success"); + } + $helpBlock.html($helpBlock.data("original-contents")); + } + + if (e.type === "blur") { + $controlGroup.removeClass("success"); + } + } + ); + $this.bind("validationLostFocus.validation", function () { + $controlGroup.removeClass("success"); + }); + }); + }, + destroy: function () { + + return this.each( + function () { + + var + $this = $(this), + $controlGroup = $this.parents(".control-group").first(), + $helpBlock = $controlGroup.find(".help-block").first(); + + // remove our events + $this.unbind('.validation'); // events are namespaced. + // reset help text + $helpBlock.html($helpBlock.data("original-contents")); + // reset classes + $controlGroup.attr("class", $controlGroup.data("original-classes")); + // reset aria + $this.attr("aria-invalid", $this.data("original-aria-invalid")); + // reset role + $helpBlock.attr("role", $this.data("original-role")); + // remove all elements we created + if (createdElements.indexOf($helpBlock[0]) > -1) { + $helpBlock.remove(); + } + + } + ); + + }, + collectErrors: function (includeEmpty) { + + var errorMessages = {}; + this.each(function (i, el) { + var $el = $(el); + var name = $el.attr("name"); + var errors = $el.triggerHandler("validation.validation", {includeEmpty: true}); + errorMessages[name] = $.extend(true, errors, errorMessages[name]); + }); + + $.each(errorMessages, function (i, el) { + if (el.length === 0) { + delete errorMessages[i]; + } + }); + + return errorMessages; + + }, + hasErrors: function () { + + var errorMessages = []; + + this.each(function (i, el) { + errorMessages = errorMessages.concat( + $(el).triggerHandler("getValidators.validation") ? $(el).triggerHandler("validation.validation", {submitting: true}) : [] + ); + }); + + return (errorMessages.length > 0); + }, + override: function (newDefaults) { + defaults = $.extend(true, defaults, newDefaults); + } + }, + validatorTypes: { + callback: { + name: "callback", + init: function ($this, name) { + return { + validatorName: name, + callback: $this.data("validation" + name + "Callback"), + lastValue: $this.val(), + lastValid: true, + lastFinished: true + }; + }, + validate: function ($this, value, validator) { + if (validator.lastValue === value && validator.lastFinished) { + return !validator.lastValid; + } + + if (validator.lastFinished === true) { + validator.lastValue = value; + validator.lastValid = true; + validator.lastFinished = false; + + var rrjqbvValidator = validator; + var rrjqbvThis = $this; + executeFunctionByName( + validator.callback, + window, + $this, + value, + function (data) { + if (rrjqbvValidator.lastValue === data.value) { + rrjqbvValidator.lastValid = data.valid; + if (data.message) { + rrjqbvValidator.message = data.message; + } + rrjqbvValidator.lastFinished = true; + rrjqbvThis.data("validation" + rrjqbvValidator.validatorName + "Message", rrjqbvValidator.message); + // Timeout is set to avoid problems with the events being considered 'already fired' + setTimeout(function () { + rrjqbvThis.trigger("change.validation"); + }, 1); // doesn't need a long timeout, just long enough for the event bubble to burst + } + } + ); + } + + return false; + + } + }, + ajax: { + name: "ajax", + init: function ($this, name) { + return { + validatorName: name, + url: $this.data("validation" + name + "Ajax"), + lastValue: $this.val(), + lastValid: true, + lastFinished: true + }; + }, + validate: function ($this, value, validator) { + if ("" + validator.lastValue === "" + value && validator.lastFinished === true) { + return validator.lastValid === false; + } + + if (validator.lastFinished === true) { + validator.lastValue = value; + validator.lastValid = true; + validator.lastFinished = false; + $.ajax({ + url: validator.url, + data: "value=" + value + "&field=" + $this.attr("name"), + dataType: "json", + success: function (data) { + if ("" + validator.lastValue === "" + data.value) { + validator.lastValid = !!(data.valid); + if (data.message) { + validator.message = data.message; + } + validator.lastFinished = true; + $this.data("validation" + validator.validatorName + "Message", validator.message); + // Timeout is set to avoid problems with the events being considered 'already fired' + setTimeout(function () { + $this.trigger("change.validation"); + }, 1); // doesn't need a long timeout, just long enough for the event bubble to burst + } + }, + failure: function () { + validator.lastValid = true; + validator.message = "ajax call failed"; + validator.lastFinished = true; + $this.data("validation" + validator.validatorName + "Message", validator.message); + // Timeout is set to avoid problems with the events being considered 'already fired' + setTimeout(function () { + $this.trigger("change.validation"); + }, 1); // doesn't need a long timeout, just long enough for the event bubble to burst + } + }); + } + + return false; + + } + }, + regex: { + name: "regex", + init: function ($this, name) { + return {regex: regexFromString($this.data("validation" + name + "Regex"))}; + }, + validate: function ($this, value, validator) { + return (!validator.regex.test(value) && !validator.negative) + || (validator.regex.test(value) && validator.negative); + } + }, + required: { + name: "required", + init: function ($this, name) { + return {}; + }, + validate: function ($this, value, validator) { + return !!(value.length === 0 && !validator.negative) + || !!(value.length > 0 && validator.negative); + }, + blockSubmit: true + }, + match: { + name: "match", + init: function ($this, name) { + var element = $this.parents("form").first().find("[name=\"" + $this.data("validation" + name + "Match") + "\"]").first(); + element.bind("validation.validation", function () { + $this.trigger("change.validation", {submitting: true}); + }); + return {"element": element}; + }, + validate: function ($this, value, validator) { + return (value !== validator.element.val() && !validator.negative) + || (value === validator.element.val() && validator.negative); + }, + blockSubmit: true + }, + max: { + name: "max", + init: function ($this, name) { + return {max: $this.data("validation" + name + "Max")}; + }, + validate: function ($this, value, validator) { + return (parseFloat(value, 10) > parseFloat(validator.max, 10) && !validator.negative) + || (parseFloat(value, 10) <= parseFloat(validator.max, 10) && validator.negative); + } + }, + min: { + name: "min", + init: function ($this, name) { + return {min: $this.data("validation" + name + "Min")}; + }, + validate: function ($this, value, validator) { + return (parseFloat(value) < parseFloat(validator.min) && !validator.negative) + || (parseFloat(value) >= parseFloat(validator.min) && validator.negative); + } + }, + maxlength: { + name: "maxlength", + init: function ($this, name) { + return {maxlength: $this.data("validation" + name + "Maxlength")}; + }, + validate: function ($this, value, validator) { + return ((value.length > validator.maxlength) && !validator.negative) + || ((value.length <= validator.maxlength) && validator.negative); + } + }, + minlength: { + name: "minlength", + init: function ($this, name) { + return {minlength: $this.data("validation" + name + "Minlength")}; + }, + validate: function ($this, value, validator) { + return ((value.length < validator.minlength) && !validator.negative) + || ((value.length >= validator.minlength) && validator.negative); + } + }, + maxchecked: { + name: "maxchecked", + init: function ($this, name) { + var elements = $this.parents("form").first().find("[name=\"" + $this.attr("name") + "\"]"); + elements.bind("click.validation", function () { + $this.trigger("change.validation", {includeEmpty: true}); + }); + return {maxchecked: $this.data("validation" + name + "Maxchecked"), elements: elements}; + }, + validate: function ($this, value, validator) { + return (validator.elements.filter(":checked").length > validator.maxchecked && !validator.negative) + || (validator.elements.filter(":checked").length <= validator.maxchecked && validator.negative); + }, + blockSubmit: true + }, + minchecked: { + name: "minchecked", + init: function ($this, name) { + var elements = $this.parents("form").first().find("[name=\"" + $this.attr("name") + "\"]"); + elements.bind("click.validation", function () { + $this.trigger("change.validation", {includeEmpty: true}); + }); + return {minchecked: $this.data("validation" + name + "Minchecked"), elements: elements}; + }, + validate: function ($this, value, validator) { + return (validator.elements.filter(":checked").length < validator.minchecked && !validator.negative) + || (validator.elements.filter(":checked").length >= validator.minchecked && validator.negative); + }, + blockSubmit: true + } + }, + builtInValidators: { + email: { + name: "Email", + type: "shortcut", + shortcut: "validemail" + }, + validemail: { + name: "Validemail", + type: "regex", + regex: "[A-Za-z0-9._%+-]+@[A-Za-z0-9.-]+\\\.[A-Za-z]{2,4}", + message: "Not a valid email address" + }, + passwordagain: { + name: "Passwordagain", + type: "match", + match: "password", + message: "Does not match the given password" + }, + positive: { + name: "Positive", + type: "shortcut", + shortcut: "number,positivenumber" + }, + negative: { + name: "Negative", + type: "shortcut", + shortcut: "number,negativenumber" + }, + number: { + name: "Number", + type: "regex", + regex: "([+-]?\\\d+(\\\.\\\d*)?([eE][+-]?[0-9]+)?)?", + message: "Must be a number" + }, + integer: { + name: "Integer", + type: "regex", + regex: "[+-]?\\\d+", + message: "No decimal places allowed" + }, + positivenumber: { + name: "Positivenumber", + type: "min", + min: 0, + message: "Must be a positive number" + }, + negativenumber: { + name: "Negativenumber", + type: "max", + max: 0, + message: "Must be a negative number" + }, + required: { + name: "Required", + type: "required", + message: "This is required" + }, + checkone: { + name: "Checkone", + type: "minchecked", + minchecked: 1, + message: "Check at least one option" + } + } + }; + + var formatValidatorName = function (name) { + return name + .toLowerCase() + .replace( + /(^|\s)([a-z])/g, + function (m, p1, p2) { + return p1 + p2.toUpperCase(); + } + ) + ; + }; + + var getValue = function ($this) { + // Extract the value we're talking about + var value = $this.val(); + var type = $this.attr("type"); + if (type === "checkbox") { + value = ($this.is(":checked") ? value : ""); + } + if (type === "radio") { + value = ($('input[name="' + $this.attr("name") + '"]:checked').length > 0 ? value : ""); + } + return value; + }; + + function regexFromString(inputstring) { + return new RegExp("^" + inputstring + "$"); + } + + /** + * Thanks to Jason Bunting via StackOverflow.com + * + * http://stackoverflow.com/questions/359788/how-to-execute-a-javascript-function-when-i-have-its-name-as-a-string#answer-359910 + * Short link: http://tinyurl.com/executeFunctionByName + **/ + function executeFunctionByName(functionName, context /*, args*/) { + var args = Array.prototype.slice.call(arguments).splice(2); + var namespaces = functionName.split("."); + var func = namespaces.pop(); + for (var i = 0; i < namespaces.length; i++) { + context = context[namespaces[i]]; + } + return context[func].apply(this, args); + } + + $.fn.jqBootstrapValidation = function (method) { + + if (defaults.methods[method]) { + return defaults.methods[method].apply(this, Array.prototype.slice.call(arguments, 1)); + } else if (typeof method === 'object' || !method) { + return defaults.methods.init.apply(this, arguments); + } else { + $.error('Method ' + method + ' does not exist on jQuery.jqBootstrapValidation'); + return null; + } + + }; + + $.jqBootstrapValidation = function (options) { + $(":input").not("[type=image],[type=submit]").jqBootstrapValidation.apply(this, arguments); + }; + +})(jQuery); diff --git a/esr/src/main/webapp/extsys/vim/js/vim-validate.js b/esr/src/main/webapp/extsys/vim/js/vim-validate.js new file mode 100644 index 0000000..2297458 --- /dev/null +++ b/esr/src/main/webapp/extsys/vim/js/vim-validate.js @@ -0,0 +1,116 @@ +/* + * Copyright 2016-2017 ZTE Corporation. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +/** + * Created by 10184303 on 15-11-17. + */ +var form = $('#vim_form'); +var error = $('.alert-danger', form); +var success = $('.alert-success', form); +form.validate({ + doNotHideMessage: true, //this option enables to show the error/success messages on tab switch. + errorElement: 'span', //default input error message container + errorClass: 'help-block', // default input error message class + focusInvalid: false, // do not focus the last invalid input + rules: { + url: { + required: true, + url: true, + maxlength: 50 + //,repeatedName: true + }, + vimName: { + required: true, + maxlength: 20 + }, + version: { + required: true, + maxlength: 20 + }, + vendor: { + required: true, + maxlength: 20 + }, + userName: { + required: true, + maxlength: 20 + }, + password: { + required: true, + maxlength: 20 + }, + tenant: { + required: true, + maxlength: 20 + } + }, + messages: { + url: { + //required: $.i18n.prop('com_zte_ums_zenic_topology_connectmanager_enter_name') + required: $.i18n.prop('com_zte_ums_eco_roc_vim_auth_url_require_message'), + url: $.i18n.prop('com_zte_ums_eco_roc_vim_auth_url_alarm_message') + }, + vimName: { + required: $.i18n.prop('com_zte_ums_eco_roc_vim_name_alarm_message') + }, + userName: { + required: $.i18n.prop('com_zte_ums_eco_roc_vim_username_alarm_message') + }, + password: { + required: $.i18n.prop('com_zte_ums_eco_roc_vim_password_alarm_message') + }, + version: { + required: $.i18n.prop('com_zte_ums_eco_roc_vim_version_alarm_message') + }, + vendor: { + required: $.i18n.prop('com_zte_ums_eco_roc_vim_vendor_alarm_message') + }, + tenant: { + required: $.i18n.prop('com_zte_ums_eco_roc_vim_tenant_alarm_message') + } + }, + errorPlacement: function (error, element) { // render error placement for each input type + error.insertAfter(element); // for other inputs, just perform default behavior + }, + + invalidHandler: function (event, validator) { //display error alert on form submit + success.hide(); + error.show(); + //ZteFrameWork.scrollTo(error, -200); + }, + + highlight: function (element) { // hightlight error inputs + $(element) + .closest('.form-group').removeClass('has-success').addClass('has-error'); // set error class to the control group + }, + + unhighlight: function (element) { // revert the change done by hightlight + $(element) + .closest('.form-group').removeClass('has-error'); // set error class to the control group + }, + + success: function (label) { + label + .addClass('valid') // mark the current input as valid and display OK icon + .closest('.form-group').removeClass('has-error'); // set success class to the control group + }, + + submitHandler: function (form) { + success.show(); + error.hide(); + //add here some ajax code to submit your form or just call form.submit() if you want to submit the form without ajax + } + +}); diff --git a/esr/src/main/webapp/extsys/vim/js/vimChart.js b/esr/src/main/webapp/extsys/vim/js/vimChart.js new file mode 100644 index 0000000..078a7e6 --- /dev/null +++ b/esr/src/main/webapp/extsys/vim/js/vimChart.js @@ -0,0 +1,430 @@ +/* + * Copyright 2016-2017 ZTE Corporation. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +var vimChart = {}; + + +var labelTop = { + normal: { + label: { + show: true, + position: 'outer', + formatter: function (params) { + var total = params.series.data[1].value + params.series.data[0].value; + var util = params.series.data[0].util; + return $.i18n.prop('com_zte_ums_eco_roc_vim_resource_chart_used') + params.value + util + "\n" + + $.i18n.prop('com_zte_ums_eco_roc_vim_resource_chart_total') + total + util; + }, + textStyle: { + baseline: 'bottom', + fontWeight: 'normal' + + } + }, + labelLine: { + show: true + } + } +}; + + +var labelFromatter = { + normal: { + label: { + formatter: function (params) { + return params.series.data[0].name + "\n" + (100 - params.percent).toFixed(0) + '%' + }, + textStyle: { + baseline: 'center', + color: "#000", + fontWeight: 'bold' + + + } + } + } +} +var labelBottom = { + normal: { + color: '#ccc', + label: { + show: true, + position: 'center' + }, + labelLine: { + show: false + } + }, + emphasis: { + color: 'rgba(0,0,0,0)' + } +}; + +var radius = [40, 55]; + +var vimPieChart; + +vimChart.vimPieChartInit = function () { + vimPieChart = echarts.init(document.getElementById('vimPieChartDiv')); + vimPieChart.showLoading({ + text: "Loading", + effect: "whirling", + textStyle: { + fontSize: 20 + } + }); + +} + +vimChart.vimPieChart = function (data) { + + var option = { + animation: true, + legend: { + x: 'left', + y: "top", + data: [ + $.i18n.prop('com_zte_ums_eco_roc_vim_resource_vim_cpu'), + $.i18n.prop('com_zte_ums_eco_roc_vim_resource_vim_memory'), + $.i18n.prop('com_zte_ums_eco_roc_vim_resource_vim_disk') + ], + orient: 'vertical' + }, + color: ["#578ebe", "#44b6ae", "#DABA36"], + title: { + text: '', + subtext: '', + x: 'center' + }, + toolbox: { + show: true, + + feature: { + saveAsImage: { + show: true, + title: $.i18n.prop('com_zte_ums_eco_roc_vim_resource_chart_save_picture'), + type: 'png', + lang: [$.i18n.prop('com_zte_ums_eco_roc_vim_resource_chart_click_save')] + } + } + }, + series: [ + { + type: 'pie', + center: ['15%', '55%'], + radius: radius, + itemStyle: labelFromatter, + data: [ + { + name: $.i18n.prop('com_zte_ums_eco_roc_vim_resource_vim_cpu'), + value: data.usage.cpu, + itemStyle: labelTop, + util: '' + }, + {name: 'other', value: data.resource.cpu - data.usage.cpu, itemStyle: labelBottom} + + ] + }, + { + type: 'pie', + center: ['40%', '55%'], + radius: radius, + itemStyle: labelFromatter, + data: [ + { + name: $.i18n.prop('com_zte_ums_eco_roc_vim_resource_vim_memory'), + value: data.usage.memoryMb, + itemStyle: labelTop, + util: 'MB' + }, + {name: 'other', value: data.resource.memoryMb - data.usage.memoryMb, itemStyle: labelBottom} + + ] + }, + { + type: 'pie', + center: ['65%', '55%'], + radius: radius, + itemStyle: labelFromatter, + data: [ + { + name: $.i18n.prop('com_zte_ums_eco_roc_vim_resource_vim_disk'), + value: data.usage.diskGb, + itemStyle: labelTop, + util: 'GB' + }, + {name: 'other', value: data.resource.diskGb - data.usage.diskGb, itemStyle: labelBottom} + + ] + } + + ] + }; + + + + vimPieChart.hideLoading(); + vimPieChart.setOption(option); + window.onresize = vimPieChart.resize; + + +} + +vimChart.getPieCenter = function (n) { + var center; + switch (n) { + case 1: + center = ['15%', '30%']; + break; + case 2: + center = ['40%', '30%']; + break; + case 3: + center = ['65%', '30%']; + break; + case 4: + center = ['15%', '80%']; + break; + case 5: + center = ['40%', '80%']; + break; + case 6: + center = ['65%', '80%']; + break; + case 7: + center = ['90%', '80%']; + break; + + } + return center; +} + + +var tenantPieChart; +vimChart.tenantPieChartInit = function () { + tenantPieChart = echarts.init(document.getElementById('tenantPieChartDiv')); + + tenantPieChart.showLoading({ + text: "Loading", + effect: "whirling", + textStyle: { + fontSize: 20 + } + }); +} +vimChart.tenantPieChart = function (data) { + + var legend_data = new Array(); + var series = new Array(); + var n = 0; + + if (data.quota.instances != -1) { + n++; + + legend_data.push($.i18n.prop('com_zte_ums_eco_roc_vim_resource_tenant_instances')); + var instances_series = { + type: 'pie', + center: vimChart.getPieCenter(n), + radius: radius, + itemStyle: labelFromatter, + data: [ + { + name: $.i18n.prop('com_zte_ums_eco_roc_vim_resource_tenant_instances'), + value: data.usage.instances, + itemStyle: labelTop, + util: '' + }, + {name: 'other', value: data.quota.instances - data.usage.instances, itemStyle: labelBottom} + + ] + }; + series.push(instances_series); + + } + if (data.quota.cpu != -1) { + n++; + legend_data.push($.i18n.prop('com_zte_ums_eco_roc_vim_resource_tenant_cpu')); + var cpu_series = { + type: 'pie', + center: vimChart.getPieCenter(n), + radius: radius, + itemStyle: labelFromatter, + data: [ + { + name: $.i18n.prop('com_zte_ums_eco_roc_vim_resource_tenant_cpu'), + value: data.usage.cpu, + itemStyle: labelTop, + util: '' + }, + {name: 'other', value: data.quota.cpu - data.usage.cpu, itemStyle: labelBottom} + + ] + }; + series.push(cpu_series); + } + if (data.quota.memoryMb != -1) { + n++; + legend_data.push($.i18n.prop('com_zte_ums_eco_roc_vim_resource_tenant_memoryMb')); + var memoryMb_series = { + type: 'pie', + center: vimChart.getPieCenter(n), + radius: radius, + itemStyle: labelFromatter, + data: [ + { + name: $.i18n.prop('com_zte_ums_eco_roc_vim_resource_tenant_memoryMb'), + value: data.usage.memoryMb, + itemStyle: labelTop, + util: 'MB' + }, + {name: 'other', value: data.quota.memoryMb - data.usage.memoryMb, itemStyle: labelBottom} + + ] + }; + series.push(memoryMb_series); + } + if (data.quota.floatingIps != -1) { + n++; + legend_data.push($.i18n.prop('com_zte_ums_eco_roc_vim_resource_tenant_floatingIps')); + var floatingIps_series = { + type: 'pie', + center: vimChart.getPieCenter(n), + radius: radius, + itemStyle: labelFromatter, + data: [ + { + name: $.i18n.prop('com_zte_ums_eco_roc_vim_resource_tenant_floatingIps'), + value: data.usage.floatingIps, + itemStyle: labelTop, + util: '' + }, + {name: 'other', value: data.quota.floatingIps - data.usage.floatingIps, itemStyle: labelBottom} + + ] + }; + series.push(floatingIps_series); + } + if (data.quota.securityGroups != -1) { + n++; + legend_data.push($.i18n.prop('com_zte_ums_eco_roc_vim_resource_tenant_securityGroups')); + var securityGroups_series = { + type: 'pie', + center: vimChart.getPieCenter(n), + radius: radius, + itemStyle: labelFromatter, + data: [ + { + name: $.i18n.prop('com_zte_ums_eco_roc_vim_resource_tenant_securityGroups'), + value: data.usage.securityGroups, + itemStyle: labelTop, + util: '' + }, + {name: 'other', value: data.quota.securityGroups - data.usage.securityGroups, itemStyle: labelBottom} + + ] + }; + series.push(securityGroups_series); + } + if (data.quota.volumes != -1) { + n++; + legend_data.push($.i18n.prop('com_zte_ums_eco_roc_vim_resource_tenant_volumes')); + var volumes_series = { + type: 'pie', + center: vimChart.getPieCenter(n), + radius: radius, + itemStyle: labelFromatter, + data: [ + { + name: $.i18n.prop('com_zte_ums_eco_roc_vim_resource_tenant_volumes'), + value: data.usage.volumes, + itemStyle: labelTop, + util: '' + }, + {name: 'other', value: data.quota.volumes - data.usage.volumes, itemStyle: labelBottom} + + ] + }; + series.push(volumes_series); + } + if (data.quota.volumeStorage != -1) { + n++; + legend_data.push($.i18n.prop('com_zte_ums_eco_roc_vim_resource_tenant_volumeStorage')); + var volumeStorage_series = { + type: 'pie', + center: vimChart.getPieCenter(n), + radius: radius, + itemStyle: labelFromatter, + data: [ + { + name: $.i18n.prop('com_zte_ums_eco_roc_vim_resource_tenant_volumeStorage'), + value: data.usage.volumeStorage, + itemStyle: labelTop, + util: 'GB' + }, + {name: 'other', value: data.quota.volumeStorage - data.usage.volumeStorage, itemStyle: labelBottom} + + ] + }; + series.push(volumeStorage_series); + } + + + var option = { + animation: true, + legend: { + x: 'left', + y: "top", + data: legend_data, + orient: 'vertical' + }, + color: ["#578ebe", "#44b6ae", "#DABA36", "#F79695", "#9699e0", "#57b5e3", "#48c79c"], + title: { + text: '', + subtext: '', + x: 'center' + }, + toolbox: { + show: true, + feature: { + saveAsImage: { + show: true, + title: $.i18n.prop('com_zte_ums_eco_roc_vim_resource_chart_save_picture'), + type: 'png', + lang: [$.i18n.prop('com_zte_ums_eco_roc_vim_resource_chart_click_save')] + } + } + }, + series: series + }; + + + + tenantPieChart.hideLoading(); + tenantPieChart.setOption(option); + window.onresize = tenantPieChart.resize; + + +} + +vimChart.growl = function (message, type) { + $.growl({ + icon: "fa fa-envelope-o fa-lg", + title: "  " + $.i18n.prop('com_zte_ums_eco_roc_vim_title_notice'), + message: message + "        " + }, { + type: type, + delay: 0 + }); +} \ No newline at end of file diff --git a/esr/src/main/webapp/extsys/vim/js/vimChartController.js b/esr/src/main/webapp/extsys/vim/js/vimChartController.js new file mode 100644 index 0000000..cdfaa40 --- /dev/null +++ b/esr/src/main/webapp/extsys/vim/js/vimChartController.js @@ -0,0 +1,160 @@ +/* + * Copyright 2016-2017 ZTE Corporation. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +var vm = avalon + .define({ + $id: "vimChartController", + $vimChartUrl: '../../api/vim/v1/{vim_id}/resource', + $tenantChartUrl: '../../api/vim/v1/{vim_id}/resource/{tenant_name}', + $tenantListUrl: '../../api/vim/v1/{vim_id}/tenants', + $tenantRoleUrl: '../../api/vim/v1/{vim_id}/roles', + vimInfo: { + name: name, + id: id, + tenant: tenant, + isAdmin: true + }, + tenantSelectList: { + condName: $.i18n.prop("com_zte_ums_eco_roc_vim_type"), + component_type: 'select', + selectItems: [] + }, + initChart: function () { + + //has admin role + var tenantRoleUrl = vm.$tenantRoleUrl.replace("{vim_id}", vm.vimInfo.id); + $.ajax({ + "type": 'get', + "url": tenantRoleUrl, + "dataType": "json", + success: function (resp) { + vm.vimInfo.isAdmin = (resp == null) ? false : resp.isAdminRole; + + }, + error: function (XMLHttpRequest, textStatus, errorThrown) { + vimChart.growl("get [tenant Role] is error ：" + textStatus + ":" + errorThrown, "danger"); + }, + complete: function () { + if (vm.vimInfo.isAdmin == true) { + + //get all resource + vm.vimChartLoad(); + + //get tenant list + vm.vimListLoad(); + } + + } + }); + //get resource of tenant + vm.tenantChartLoad(); + }, + gotoVimPage: function () { + window.parent.ZteFrameWork.goToURLByIDAndNewAction('eco_roc_vimmgr'); + }, + vimListLoad: function () { + var tenantListUrl = vm.$tenantListUrl.replace("{vim_id}", vm.vimInfo.id); + $.ajax({ + "type": 'get', + "url": tenantListUrl, + "dataType": "json", + success: function (resp) { + vm.tenantSelectList.selectItems = (resp == null) ? [] : resp; + }, + error: function (XMLHttpRequest, textStatus, errorThrown) { + vimChart.growl("get [tenant List] is error ：" + textStatus + ":" + errorThrown, "danger"); + } + }); + }, + vimChartLoad: function () { + var viminitData = { + "resource": { + "cpu": 0, + "memoryMb": 503, + "diskGb": 9.8 + }, + "usage": { + "cpu": 0, + "memoryMb": 0, + "diskGb": 0 + } + } + + vimChart.vimPieChartInit(); + + var vimChartUrl = vm.$vimChartUrl.replace("{vim_id}", vm.vimInfo.id); + + + $.ajax({ + "type": 'get', + "url": vimChartUrl, + "dataType": "json", + success: function (resp) { + var vimData = (resp == null) ? viminitData : resp; + vimChart.vimPieChart(vimData); + }, + error: function (XMLHttpRequest, textStatus, errorThrown) { + vimChart.growl("get [virtual machine manager resource using status] is error ：" + textStatus + ":" + errorThrown, "danger"); + } + }); + + }, + tenantChartLoad: function () { + var tenantChartUrl = vm.$tenantChartUrl.replace("{vim_id}", vm.vimInfo.id).replace("{tenant_name}", vm.vimInfo.tenant); + + var tenantinitData = { + "tenant_name": "", + "errormsg": "", + "quota": { + "cpu": 0, + "memoryMb": 0, + "instances": 0, + "floatingIps": 0, + "securityGroups": 0, + "volumeStorage": 0, + "volumes": 0 + }, + "usage": { + "cpu": 0, + "memoryMb": 0, + "instances": 0, + "floatingIps": 0, + "securityGroups": 0, + "volumeStorage": 0, + "volumes": 0 + } + }; + vimChart.tenantPieChartInit(); + $.ajax({ + "type": 'get', + "url": tenantChartUrl, + "dataType": "json", + success: function (resp) { + var tenantData = (resp == null) ? tenantinitData : resp; + if (tenantData.errormsg != null) { + vimChart.growl(tenantData.errormsg, "danger"); + } + vimChart.tenantPieChart(tenantData); + }, + error: function (XMLHttpRequest, textStatus, errorThrown) { + vimChart.growl("get [tenant quota using status] occur error ：" + textStatus + ":" + errorThrown, "danger"); + } + }); + + } + + }); +avalon.scan(); +vm.initChart(); \ No newline at end of file diff --git a/esr/src/main/webapp/extsys/vim/js/vimController.js b/esr/src/main/webapp/extsys/vim/js/vimController.js new file mode 100644 index 0000000..a96b3d5 --- /dev/null +++ b/esr/src/main/webapp/extsys/vim/js/vimController.js @@ -0,0 +1,319 @@ +/* + * Copyright 2016-2017 ZTE Corporation. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +var vm = avalon + .define({ + $id: "vimController", + vimInfo: [], + //vimStatusTime:$.i18n.prop('com_zte_ums_eco_roc_vim_getting_info'), + // ifSearch : 0, + // server_rtn:{ + // info_block:false, + // warning_block:false, + // rtn_info:"", + // $RTN_SUCCESS:"RTN_SUCCESS", + // $RTN_FAILED:"RTN_FAILED", + // wait : $.i18n.prop('com_zte_ums_eco_roc_vim_checking_status') + // }, + executeWait: {clazz: 'alert-info', visible: true, text: $.i18n.prop('com_zte_ums_eco_roc_vim_checking_status')}, + executeError: {clazz: 'alert-danger', visible: true, text: 'error'}, + $Status: { + success: "active", + failed: "inactive", + displayActive: $.i18n.prop('com_zte_ums_eco_roc_vim_normal'), + displayInactive: $.i18n.prop('com_zte_ums_eco_roc_vim_abnormal') + }, + isSave: true, + action: {ADD: 'add', UPDATE: 'update'}, + $queryVimInfoUrl: '/openoapi/extsys/v1/vims', + $addVimInfoUrl: '/openoapi/extsys/v1/vims/', + $updateVimInfoUrl: '/openoapi/extsys/v1/vims/', + $delVimInfoUrl: '/openoapi/extsys/v1/vims/{vim_id}', + $initTable: function () { + $.ajax({ + "type": 'get', + "url": vm.$queryVimInfoUrl, + //"dataType": "json", + "success": function (resp, statusText, jqXHR) { + if (jqXHR.status == "200") { + vm.vimInfo = resp; + } + else { + vm.vimInfo = []; + bootbox.alert($.i18n.prop("com_zte_ums_eco_roc_vim_growl_msg_query_failed")); + return; + } + }, + error: function (XMLHttpRequest, textStatus, errorThrown) { + bootbox.alert($.i18n.prop("com_zte_ums_eco_roc_vim_growl_msg_query_failed") + textStatus + ":" + errorThrown); + return; + }, + complete: function () { + resUtil.tooltipVimStatus(); + } + }); + + }, + $vimType: { + condName: $.i18n.prop("com_zte_ums_eco_roc_vim_type"), + component_type: 'select', + selectItems: [ + { + cond_value: 'vmware', + name: "vmware", + value: true + }, + { + cond_value: 'openstack', + name: "openstack", + value: true + } + ] + }, + addVim: { + titleName: $.i18n.prop("com_zte_ums_eco_roc_vim_register_info"), + vimId: "", + vimName: "", + domain: '', + domainVisable:true, + vimNameModify:false, + userName: "", + tenant: "", + password: "", + url: "", + saveType: "add", + description: "", + vimType: "openstack", + vendor: "", + version: "" + }, + $showVimTable: function (el, action) { + vm.isSave = false; + if (vm.action.ADD == action) { + vm.addVim.vimId = ""; + vm.addVim.vimName = ""; + vm.addVim.vimNameModify=false; + vm.addVim.userName = ""; + vm.addVim.password = ""; + vm.addVim.url = ""; + vm.addVim.domain = ""; + vm.addVim.domainVisable = true; + vm.addVim.description = ""; + vm.addVim.tenant = ""; + vm.addVim.vendor = ""; + vm.addVim.saveType = "add"; + vm.addVim.vimType = "openstack"; + vm.addVim.titleName = $.i18n.prop("com_zte_ums_eco_roc_vim_register_info"); + + } else { + vm.addVim.vimId = el.vimId; + vm.addVim.vimName = el.name; + vm.addVim.vimNameModify=true; + vm.addVim.url = el.url; + vm.addVim.description = el.description; + vm.addVim.userName = el.userName; + vm.addVim.password = el.password; + vm.addVim.tenant = el.tenant; + vm.addVim.domain = el.domain; + vm.addVim.domainVisable=vm.$getdomainVisable(el.type); + vm.addVim.saveType = "update"; + vm.addVim.titleName = $.i18n.prop('com_zte_ums_eco_roc_vim_modify_info'); + vm.addVim.vimType = el.type; + vm.addVim.vendor = el.vendor; + vm.addVim.version = el.version; + } + vm.executeError.visible = false; + vm.executeWait.visible = false; + $(".form-group").each(function () { + $(this).removeClass('has-success'); + $(this).removeClass('has-error'); + $(this).find(".help-block[id]").remove(); + }); + $("#addVimDlg").modal("show"); + }, + + $saveVimTable: function () { + vm.isSave = true; + success.hide(); + error.hide(); + if (form.valid() == false) { + vm.isSave = false; + return false; + } + vm.executeWait.visible = true; + vm.executeError.visible = false; + if (vm.addVim.saveType == "add") { + for( var i = 0; i < vm.vimInfo.length; i ++ ){ + if(vm.addVim.name == vm.vimInfo[i].name){ + resUtil.growl($.i18n.prop("com_zte_ums_eco_roc_vim_growl_msg_title") + ' already exists',"info"); + $('#addVimDlg').modal('hide'); + return; + } + } + vm.persistVim(); + } else if (vm.addVim.saveType == "update") { + vm.updateVim(); + } + }, + //add vim + persistVim: function () { + $.ajax({ + type: "Post", + url: vm.$addVimInfoUrl, + data: JSON.stringify({ + name: vm.addVim.vimName, + url: vm.addVim.url, + userName: vm.addVim.userName, + password: vm.addVim.password, + tenant: vm.addVim.tenant, + domain: vm.addVim.domain, + vendor: vm.addVim.vendor, + version: vm.addVim.version, + description: vm.addVim.description, + type: vm.addVim.vimType, + }), + async: false, + dataType: "json", + contentType: 'application/json', + success: function (data, statusText, jqXHR) { + vm.executeWait.visible = false; + vm.executeError.visible = false; + if (jqXHR.status == "201") { + vm.addVim.vimId = data.vimId; + vm.addVim.name = data.name; + vm.addVim.tenant = data.tenant; + vm.addVim.type = data.type; + var newVim = jQuery.extend({}, vm.addVim); + vm.vimInfo.push(newVim); + + $('#addVimDlg').modal('hide'); + resUtil.growl($.i18n.prop("com_zte_ums_eco_roc_vim_growl_msg_title") + $.i18n.prop("com_zte_ums_eco_roc_vim_growl_msg_save_success"), "success"); + } else { + vm.executeError.visible = true; + vm.executeError.text = $.i18n.prop("com_zte_ums_eco_roc_vim_growl_msg_save_failed"); + } + }, + error: function (XMLHttpRequest, textStatus, errorThrown) { + vm.executeError.visible = true; + vm.executeError.text = textStatus + ":" + errorThrown; + vm.executeWait.visible = false; + vm.isSave = false; + } + }); + }, + //update vim + updateVim: function () { + $.ajax({ + type: "Put", + url: vm.$updateVimInfoUrl + vm.addVim.vimId, + contentType: 'application/json', + data: JSON.stringify({ + name: vm.addVim.vimName, + userName: vm.addVim.userName, + password: vm.addVim.password, + domain: vm.addVim.domain, + version: vm.addVim.version, + description: vm.addVim.description, + url: vm.addVim.url, + tenant: vm.addVim.tenant, + type: vm.addVim.vimType, + vendor: vm.addVim.vendor, + }), + dataType: "json", + async: false, + success: function (data, statusText, jqXHR) { + vm.executeWait.visible = false; + vm.executeError.visible = false; + if (jqXHR.status == "200") { + for (var i = 0; i < vm.vimInfo.length; i++) { + if (vm.vimInfo[i].vimId == vm.addVim.vimId) { + vm.vimInfo[i].name = vm.addVim.vimName; + vm.vimInfo[i].userName = vm.addVim.userName; + vm.vimInfo[i].password = vm.addVim.password; + vm.vimInfo[i].url = vm.addVim.url; + vm.vimInfo[i].tenant = vm.addVim.tenant; + vm.vimInfo[i].domain = vm.addVim.domain; + vm.vimInfo[i].description = vm.addVim.description; + vm.vimInfo[i].type = vm.addVim.vimType; + vm.vimInfo[i].version=vm.addVim.version; + vm.vimInfo[i].vendor=vm.addVim.vendor; + } + } + $('#addVimDlg').modal('hide'); + resUtil.growl($.i18n.prop('com_zte_ums_eco_roc_vim_growl_msg_title') + $.i18n.prop('com_zte_ums_eco_roc_vim_growl_msg_save_success'), "success"); + } + else { + vm.executeError.visible = true; + vm.executeError.text = $.i18n.prop('com_zte_ums_eco_roc_vim_growl_msg_save_failed'); + } + }, + error: function (XMLHttpRequest, textStatus, errorThrown) { + vm.isSave = false; + vm.executeError.visible = true; + vm.executeError.text = textStatus + ":" + errorThrown; + vm.executeWait.visible = false; + } + }); + }, + delVim: function (el) { + bootbox.confirm($.i18n.prop('com_zte_ums_eco_roc_vim_confirm_delete_vim_record'), function (result) { + if (result) { + $.ajax({ + type: "DELETE", + url: vm.$delVimInfoUrl.replace('{vim_id}', el.vimId), + success: function (data, statusText, jqXHR) { + if (jqXHR.status == "204") { + for (var i = 0; i < vm.vimInfo.length; i++) { + if (el.vimId == vm.vimInfo[i].vimId) { + vm.vimInfo.splice(i, 1); + break; + } + } + resUtil.growl($.i18n.prop('com_zte_ums_eco_roc_vim_growl_msg_title') + $.i18n.prop('com_zte_ums_eco_roc_vim_growl_msg_remove_success'), "success"); + } + else { + resUtil.growl($.i18n.prop('com_zte_ums_eco_roc_vim_growl_msg_title') + $.i18n.prop('com_zte_ums_eco_roc_vim_growl_msg_remove_failed'), "warning"); + } + }, + error: function (XMLHttpRequest, textStatus, errorThrown) { + resUtil.growl($.i18n.prop('com_zte_ums_eco_roc_vim_growl_msg_title') + errorThrown, "danger"); + } + }); + } + }); + }, + gotoChartPage: function (oid, name, tenant) { + window.location.href = "vimChart.html?" + oid + "&" + name + "&" + tenant; + }, + $getdomainVisable:function(vimType){ + if ("openstack"==vimType){ + return true; + }else{ + return false; + } + + }, + vimTypeRendered:function(){ + vm.addVim.domainVisable=vm.$getdomainVisable(vm.addVim.vimType); + } + + + }); +avalon.scan(); +vm.$initTable(); + + + + diff --git a/esr/src/main/webapp/extsys/vim/js/vimUtil.js b/esr/src/main/webapp/extsys/vim/js/vimUtil.js new file mode 100644 index 0000000..610a266 --- /dev/null +++ b/esr/src/main/webapp/extsys/vim/js/vimUtil.js @@ -0,0 +1,51 @@ +/* + * Copyright 2016-2017 ZTE Corporation. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +var resUtil = {}; + +resUtil.tooltipVimStatus = function () { + $("[data-toggle='tooltip']").tooltip(); + +} + +resUtil.growl = function (message, type) { + $.growl({ + icon: "fa fa-envelope-o fa-lg", + title: "  Notice: ", + message: message + "        " + }, { + type: type + }); + /* + $.bootstrapGrowl(message, { + ele: 'body', // which element to append to + type: type, // (null, 'info', 'danger', 'success') + offset: {from: 'bottom', amount: 20}, // 'top', or 'bottom' + align: 'right', // ('left', 'right', or 'center') + width: 'auto', // (integer, or 'auto') + delay: 3000, // Time while the message will be displayed. It's not equivalent to the *demo* timeOut! + allow_dismiss: false, // If true then will display a cross to close the popup. + stackup_spacing: 10 // spacing between consecutively stacked growls. + }); + */ +} + + + + + + + + -- cgit 1.2.3-korg