AAI-153 SDNC registration portal realization

Change-Id: Ifde1ed2bf6470350a58e7146588837a323ed9bbb
Issue-ID: AAI-153
Signed-off-by: qin.liang(10184303) <qin.liang13@zte.com.cn>

4 files changed, 494 insertions, 0 deletions

diff --git a/esr/src/main/webapp/extsys/sdncontroller/js/commonUtil.js b/esr/src/main/webapp/extsys/sdncontroller/js/commonUtil.js
new file mode 100644
index 0000000..44a72f3
--- /dev/null
+++ b/esr/src/main/webapp/extsys/sdncontroller/js/commonUtil.js
@@ -0,0 +1,128 @@
+/*
+ * 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 commonUtil = {};
+commonUtil.arrayRemove = function (aryInstance, index) {
+    if (aryInstance == undefined || aryInstance == null) {
+        return;
+    }
+    for (var i = 0, n = 0; i < aryInstance.length; i++) {
+        if (aryInstance[i] != aryInstance[dx]) {
+            aryInstance[n++] = aryInstance[i];
+        }
+    }
+    aryInstance.length -= 1;
+};
+
+//For the expansion of the Date, convert the Date to specify the format String
+// examples：
+// (new Date()).Format("yyyy-MM-dd hh:mm:ss.S") ==> 2006-07-02 08:09:04.423
+// (new Date()).Format("yyyy-M-d h:m:s.S")      ==> 2006-7-2 8:9:4.18
+commonUtil.parseDate = function (dateObj, format) {
+    var o = {
+        "M+": dateObj.getMonth() + 1, //month
+        "d+": dateObj.getDate(),    //day
+        "h+": dateObj.getHours(),   //hour
+        "m+": dateObj.getMinutes(), //minute
+        "s+": dateObj.getSeconds(), //second
+        "q+": Math.floor((dateObj.getMonth() + 3) / 3),  //quarter
+        "S": dateObj.getMilliseconds() //millisecond
+    }
+    if (/(y+)/.test(format)) format = format.replace(RegExp.$1,
+        (dateObj.getFullYear() + "").substr(4 - RegExp.$1.length));
+    for (var k in o)
+        if (new RegExp("(" + k + ")").test(format))
+            format = format.replace(RegExp.$1, RegExp.$1.length == 1 ? o[k] :
+                ("00" + o[k]).substr(("" + o[k]).length));
+    return format;
+};
+
+//tooltip
+commonUtil.showMessage = function (message, type) {
+    $.growl({
+        icon: "fa fa-envelope-o fa-lg",
+        title: "&nbsp;&nbsp;" + $.i18n.prop("nfv-nso-iui-common-tip"),
+        message: message
+    }, {
+        type: type
+    });
+};
+
+commonUtil.registerCometdMessage = function (url, channel, callback) {
+    var cometd = new $.Cometd();
+    var cometdURL = location.protocol + "//" + location.host + url;
+    cometd.configure({
+        url: cometdURL,
+        logLevel: "info"
+    });
+    // unregister websocket transport, use long-polling transport
+    cometd.unregisterTransport('websocket');
+    // store channel object parameters(this object include channel and callback function), start from arguments[1]
+    var _args = arguments;
+
+    cometd.addListener("/meta/handshake", function (handshake) {
+        if (handshake.successful === true) {
+            cometd.batch(function () {
+                //subscribe channel
+                cometd.subscribe(channel, function (message) {
+                    callback.call(this, message.data);
+                });
+            });
+        }
+    });
+    cometd.handshake();
+}
+
+commonUtil.format = function () {
+    if (arguments.length == 0) {
+        return null;
+    }
+    var str = arguments[0];
+    for (var i = 0; i < arguments.length; i++) {
+        var reg = new RegExp("\\{" + (i - 1) + "\\}", "gm");
+        str = str.replace(reg, arguments[i]);
+    }
+    return str;
+}
+
+commonUtil.get = function (url, params, callback) {
+    $.ajax({
+        type: "GET",
+        url: url,
+        //contentType : contentType || "application/x-www-form-urlencoded; charset=UTF-8",
+        dataType: "json",
+        data: params || {},
+        success: callback
+    });
+}
+
+commonUtil.post = function (url, params, callback, contentType) {
+    $.ajax({
+        type: "POST",
+        url: url,
+        contentType: contentType || "application/x-www-form-urlencoded; charset=UTF-8",
+        data: params || {},
+        success: callback
+    });
+}
+
+commonUtil.delete = function (url, callback, contentType) {
+    $.ajax({
+        type: "DELETE",
+        url: url,
+        contentType: contentType || "application/x-www-form-urlencoded; charset=UTF-8",
+        success: callback
+    });
+}
\ No newline at end of file
diff --git a/esr/src/main/webapp/extsys/sdncontroller/js/loadi18n_nsoc.js b/esr/src/main/webapp/extsys/sdncontroller/js/loadi18n_nsoc.js
new file mode 100644
index 0000000..45224af
--- /dev/null
+++ b/esr/src/main/webapp/extsys/sdncontroller/js/loadi18n_nsoc.js
@@ -0,0 +1,38 @@
+/*
+ * 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.
+ */
+function loadPropertiesSideMenu(lang, fileNamePrefix, filePath) {
+    jQuery.i18n.properties({
+        language: lang,
+        name: fileNamePrefix,
+        path: filePath,
+        mode: 'map',
+        callback: function () {
+            var i18nItems = $("[name_i18n=com_zte_nfv_nsoc_i18n]");
+            for (var i = 0; i < i18nItems.length; i++) {
+                var $item = $(i18nItems.eq(i));
+                var itemId = $item.attr("id_i18n");
+                var itemTitle = $item.attr("title");
+                if (typeof(itemTitle) != "undefined") {
+                    $item.attr("title", $.i18n.prop(itemId));
+                } else {
+                    $item.text($.i18n.prop(itemId));
+                }
+            }
+        }
+    });
+}
+var lang = getLanguage();
+loadPropertiesSideMenu(lang, 'nfv-nso-iui-i18n', 'i18n/');
\ No newline at end of file
diff --git a/esr/src/main/webapp/extsys/sdncontroller/js/sdnc-validate.js b/esr/src/main/webapp/extsys/sdncontroller/js/sdnc-validate.js
new file mode 100644
index 0000000..7cca638
--- /dev/null
+++ b/esr/src/main/webapp/extsys/sdncontroller/js/sdnc-validate.js
@@ -0,0 +1,89 @@
+/*
+ * 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.
+ */
+$(function () {
+    var form = $('#vnfm_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: {
+            name: {
+                required: true,
+                maxlength: 20
+            },
+            type: {
+                required: true,
+                maxlength: 20
+            },
+            version: {
+                required: true,
+                maxlength: 20
+            },
+            vendor: {
+                required: true,
+                maxlength: 20
+            },
+            url: {
+                required: true,
+                url: true
+            }
+        },
+        messages: {
+            name: {
+                required: $.i18n.prop("nfv-ems-iui-validate-name")
+            },
+            type: {
+                required: $.i18n.prop("nfv-ems-iui-validate-type")
+            },
+            version: {
+                required: $.i18n.prop("nfv-ems-iui-validate-version")
+            },
+            vendor: {
+                required: $.i18n.prop("nfv-ems-iui-validate-vendor")
+            },
+            url: {
+                required: $.i18n.prop("nfv-ems-iui-validate-url-required"),
+                url: $.i18n.prop("nfv-ems-iui-validate-url")
+            }
+        },
+        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();
+        },
+        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
+        }
+    });
+});
\ No newline at end of file
diff --git a/esr/src/main/webapp/extsys/sdncontroller/js/sdncController.js b/esr/src/main/webapp/extsys/sdncontroller/js/sdncController.js
new file mode 100644
index 0000000..56f22c2
--- /dev/null
+++ b/esr/src/main/webapp/extsys/sdncontroller/js/sdncController.js
@@ -0,0 +1,239 @@
+/*
+ * 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: "emsController",
+        sdncList: [],
+        currentElement: {},
+        currentIndex: 0,
+        $sdncList: [],
+        $newElement: {
+            "sdnControllerId":"a6c42529-cd6",
+            "name":"sdnc1",
+            "status": "active",
+            "url":"",
+            "userName":"admin",
+            "password":"admin",
+            "version":"v1.0",
+            "vendor":"ZTE",
+            "description":"",
+            "protocol":"netconf",
+            "productName":"",
+            "type":"WAN"
+        },
+        vimSelectItems: [],
+        saveType: "add",
+        server_rtn: {
+            info_block: false,
+            warning_block: false,
+            rtn_info: "",
+            $RTN_SUCCESS: "RTN_SUCCESS",
+            $RTN_FAILED: "RTN_FAILED"
+        },
+        modalTitle: $.i18n.prop("nfv-sdnc-iui-text-register"),
+        urlTip: "",
+        currentStep: 1,
+        status: {
+            success: "active",
+            failed: "inactive"
+        },
+        $format: {
+            "ipv4": /^((?:(?:25[0-5]|2[0-4]\d|((1\d{2})|([1-9]?\d)))\.){3}(?:25[0-5]|2[0-4]\d|((1\d{2})|([1-9]?\d))))$/,
+            "port": /^([0-9]|[1-9]\d|[1-9]\d{2}|[1-9]\d{3}|[1-5]\d{4}|6[0-4]\d{3}|65[0-4]\d{2}|655[0-2]\d|6553[0-5])$/,
+            "url": /^(http|ftp|https):\/\/[\w\-_]+(\.[\w\-_]+)+([\w\-\.,@?^=%&:/~\+#]*[\w\-\@?^=%&/~\+#])?$/
+        },
+        $restUrl: {
+            queryEmsInfoUrl: "/esrui/extsys/sdncontroller/mock-data/sdnc.json",//'/onapapi/aai/esr/v1/ems',
+            addVnfmInfoUrl: '/onapapi/aai/esr/v1/ems',
+            updateVnfmInfoUrl: '/onapapi/aai/esr/v1/ems/',
+            delVnfmInfoUrl: '/onapapi/aai/esr/v1/ems/',
+            queryMocUrl: '',
+            queryVimUrl: '/onapapi/aai/esr/v1/vims'
+        },
+        $htmlText: {
+            saveSuccess: $.i18n.prop("nfv-sdnc-iui-message-save-success"),
+            saveFail: $.i18n.prop("nfv-sdnc-iui-message-save-fail"),
+            alreadyExist: $.i18n.prop("nfv-sdnc-iui-message-ems-already-exists"),
+            updateSuccess: $.i18n.prop("nfv-sdnc-iui-message-update-success"),
+            updateFail: $.i18n.prop("nfv-sdnc-iui-message-update-fail")
+        },
+        $initTable: function () {
+            $.ajax({
+                "type": 'GET',
+                "url": vm.$restUrl.queryEmsInfoUrl,
+                "dataType": "json",
+                "success": function (resp) {
+                    vm.sdncList = resp;
+                    vm.$sdncList = $.extend(true, [], resp) ;
+                },
+                error: function (XMLHttpRequest, textStatus, errorThrown) {
+                    bootbox.alert($.i18n.prop("nfv-sdnc-iui-message-query-fail") + "：" + textStatus + ":" + errorThrown);
+                    return;
+                },
+                complete: function () {
+                    $("[data-toggle='tooltip']").tooltip();
+                }
+            });
+        },
+       $registerSDNC: function () {
+            vm.currentIndex = -1;
+            vm.currentElement = $.extend(true, {}, vm.$newElement);
+            vm.saveType = "add";
+            vm.modalTitle = $.i18n.prop("nfv-sdnc-iui-text-register");
+            vm.$showTable();
+        },
+        $showTable: function () {
+            $(".form-group").removeClass('has-success').removeClass('has-error');
+            $("#addEmsDlg").modal("show");
+        },
+        dismiss: function () {
+            if(vm.currentIndex !== -1){
+                vm.currentElement.name = vm.$sdncList[vm.currentIndex].name;
+            }
+            $("#addEmsDlg").modal("hide");
+        },
+        $saveSDNC: function () {
+            var form = $('#vnfm_form');
+           //TODO valiate
+            vm.server_rtn.info_block = true;
+            vm.server_rtn.warning_block = false;
+
+            //save VIM info
+            var res = false;
+            if (vm.saveType == "add") {
+                res = vm.postSDNC();
+            } else {
+                res = vm.putSDNC();
+            }
+            if(res){
+                $("#addEmsDlg").modal("hide");
+            }
+        },
+        updateSDNC: function (index) {
+            vm.saveType = "update";
+            vm.currentIndex = index;
+            vm.currentElement = vm.sdncList[index];
+            vm.$showTable();
+        },
+        delSDNC: function (id, index) {
+            bootbox.confirm($.i18n.prop("nfv-sdnc-iui-message-delete-confirm"), function (result) {
+                if (result) {
+                    vm.sdncList.splice(index, 1);
+                    vm.$sdncList.splice(index, 1);
+                    console.log(vm.sdncList[index]);
+                   /* $.ajax({
+                        type: "DELETE",
+                        url: vm.$restUrl.delVnfmInfoUrl + id,
+                        dataType: "json",
+                        success: function (data, statusText, jqXHR) {
+                            if (jqXHR.status == "204") {
+
+                                commonUtil.showMessage($.i18n.prop("nfv-sdnc-iui-message-delete-success"), "success");
+                            } else {
+                                commonUtil.showMessage($.i18n.prop("nfv-sdnc-iui-message-delete-fail"), "warning");
+                            }
+                        },
+                        error: function () {
+                            commonUtil.showMessage($.i18n.prop("nfv-sdnc-iui-message-delete-fail"), "warning");
+                        }
+                    });*/
+                }
+            });
+        },
+        postSDNC: function () {
+            var emsSave = vm.getSDNCSave();
+            emsSave.sdnControllerId = Math.floor(Math.random() * 100000) / 100000;
+            vm.sdncList.push(emsSave);
+            vm.$sdncList.push(emsSave);
+            console.log(emsSave);
+            return true;
+            /*$.ajax({
+                type: "POST",
+                url: vm.$restUrl.addVnfmInfoUrl,
+                data: JSON.stringify(vm.currentElement),
+                dataType: "json",
+                contentType: "application/json",
+                success: function (data) {
+                    vm.server_rtn.info_block = false;
+                    vm.server_rtn.warning_block = false;
+                    if (data) {
+                        vm.vnfmInfo = [];
+                        vm.$initTable();
+
+                        $('#addEmsDlg').modal('hide');
+                        commonUtil.showMessage(vm.$htmlText.saveSuccess, "success");
+                    } else {
+                        vm.server_rtn.warning_block = true;
+                        vm.server_rtn.rtn_info = vm.$htmlText.saveFail;
+                        commonUtil.showMessage(vm.$htmlText.saveFail, "failed");
+                    }
+                },
+                error: function (XMLHttpRequest, textStatus, errorThrown) {
+                    vm.server_rtn.warning_block = true;
+                    vm.server_rtn.rtn_info = textStatus + ":" + errorThrown;
+                    vm.server_rtn.info_block = false;
+                }
+            });*/
+        },
+        putSDNC: function () {
+            console.log(vm.getSDNCSave());
+            return true;
+           /* $.ajax({
+                type: "PUT",
+                url: vm.$restUrl.updateVnfmInfoUrl + vm.currentElement.emsId,
+                data: JSON.stringify(vm.currentElement),
+                dataType: "json",
+                contentType: "application/json",
+                success: function (data) {
+                    vm.server_rtn.info_block = false;
+                    vm.server_rtn.warning_block = false;
+                    if (data) {
+                        for (var i = 0; i < vm.vnfmInfo.length; i++) {
+                            if (vm.vnfmInfo[i].vnfmId == vm.addVnfm.vnfmId) {
+                                vm.vnfmInfo[i].name = vm.addVnfm.name;
+                                vm.vnfmInfo[i].vimId = $("#vimId").val();
+                                vm.vnfmInfo[i].vendor = vm.addVnfm.vendor;
+                                vm.vnfmInfo[i].version = vm.addVnfm.version;
+                                vm.vnfmInfo[i].certificateUrl = vm.addVnfm.certificateUrl;
+                                vm.vnfmInfo[i].description = vm.addVnfm.description;
+                                vm.vnfmInfo[i].url = vm.addVnfm.url;
+                                vm.vnfmInfo[i].userName = vm.addVnfm.userName;
+                                vm.vnfmInfo[i].password = vm.addVnfm.password;
+                            }
+                        }
+                        $('#addEmsDlg').modal('hide');
+                        commonUtil.showMessage(vm.$htmlText.updateSuccess, "success");
+                    } else {
+                        vm.server_rtn.warning_block = true;
+                        vm.server_rtn.rtn_info = vm.$htmlText.updateFail;
+                        commonUtil.showMessage(vm.$htmlText.updateFail, "failed");
+                    }
+                },
+                error: function (XMLHttpRequest, textStatus, errorThrown) {
+                    vm.server_rtn.warning_block = true;
+                    vm.server_rtn.rtn_info = textStatus + ":" + errorThrown;
+                    vm.server_rtn.info_block = false;
+                }
+            });*/
+        },
+        getSDNCSave: function () {
+            var emsSave = $.extend(true, {}, vm.currentElement.$model);
+            return emsSave;
+        }
+    });
+vm.currentElement = $.extend(true, {}, vm.$newElement);
+avalon.scan();
+vm.$initTable();
\ No newline at end of file