Integrate esr-gui with server for vnfm

Issue-ID: AAI-348

Change-Id: If9685418a38d2b8b2b3dfee6ebbcda369b00edc7
Signed-off-by: 覃亮10184303 <qin.liang13@zte.com.cn>

4 files changed, 174 insertions, 285 deletions

diff --git a/portal/src/main/webapp/extsys/vnfm/js/commonUtil.js b/portal/src/main/webapp/extsys/vnfm/js/commonUtil.js
index 44a72f3..081fef1 100644
--- a/portal/src/main/webapp/extsys/vnfm/js/commonUtil.js
+++ b/portal/src/main/webapp/extsys/vnfm/js/commonUtil.js
@@ -53,7 +53,7 @@ commonUtil.parseDate = function (dateObj, format) {
 commonUtil.showMessage = function (message, type) {
     $.growl({
         icon: "fa fa-envelope-o fa-lg",
-        title: "  " + $.i18n.prop("nfv-nso-iui-common-tip"),
+        title: "  Tips: ",
         message: message
     }, {
         type: type
diff --git a/portal/src/main/webapp/extsys/vnfm/js/loadi18n_nsoc.js b/portal/src/main/webapp/extsys/vnfm/js/loadi18n_nsoc.js
index a543a20..45224af 100644
--- a/portal/src/main/webapp/extsys/vnfm/js/loadi18n_nsoc.js
+++ b/portal/src/main/webapp/extsys/vnfm/js/loadi18n_nsoc.js
@@ -23,7 +23,7 @@ function loadPropertiesSideMenu(lang, fileNamePrefix, filePath) {
             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");
+                var itemId = $item.attr("id_i18n");
                 var itemTitle = $item.attr("title");
                 if (typeof(itemTitle) != "undefined") {
                     $item.attr("title", $.i18n.prop(itemId));
diff --git a/portal/src/main/webapp/extsys/vnfm/js/vnfmController.js b/portal/src/main/webapp/extsys/vnfm/js/vnfmController.js
index 1df32b1..6f1c52e 100644
--- a/portal/src/main/webapp/extsys/vnfm/js/vnfmController.js
+++ b/portal/src/main/webapp/extsys/vnfm/js/vnfmController.js
@@ -14,12 +14,27 @@
  * limitations under the License.
  */
 
-var vm = avalon
-    .define({
+var vm = avalon.define({
         $id: "vnfmController",
         vnfmInfo: [],
-        //mocSelectItems : [],
-        vimSelectItems: [],
+        currentElement: {},
+        currentIndex: 0,
+        saveType: "add",
+        $vnfmList: [],
+        $newElement: {
+            "vnfmId": "",
+            "name": "",
+            "type": "Tacker",
+            "vimId": "",
+            "vendor": "ZTE",
+            "version": "v1.0",
+            "certificateUrl": "",
+            "url": "http://",
+            "userName": "",
+            "password": ""
+        },
+        saveType: "add",
+        modalTitle: $.i18n.prop("nfv-ems-iui-text-register"),
         server_rtn: {
             info_block: false,
             warning_block: false,
@@ -32,12 +47,10 @@ var vm = avalon
             failed: "inactive"
         },
         $restUrl: {
-            queryVnfmInfoUrl: '/onapapi/aai/esr/v1/vnfms',
-            addVnfmInfoUrl: '/onapapi/aai/esr/v1/vnfms',
-            updateVnfmInfoUrl: '/onapapi/aai/esr/v1/vnfms/',
-            delVnfmInfoUrl: '/onapapi/aai/esr/v1/vnfms/',
-            queryMocUrl: '',
-            queryVimUrl: '/onapapi/aai/esr/v1/vims'
+            queryVnfmInfoUrl: '/api/aai-esr-server/v1/vnfms',
+            addVnfmInfoUrl: '/api/aai-esr-server/v1/vnfms',
+            updateVnfmInfoUrl: '/api/aai-esr-server/v1/vnfms/{vnfmId}',
+            delVnfmInfoUrl: '/api/aai-esr-server/v1/vnfms/{vnfmId}'
         },
         $htmlText: {
             saveSuccess: $.i18n.prop("nfv-vnfm-iui-message-save-success"),
@@ -50,12 +63,14 @@ var vm = avalon
             $.ajax({
                 "type": 'GET',
                 "url": vm.$restUrl.queryVnfmInfoUrl,
-                //"dataType": "json",
-                "success": function (resp) {
-                    for (var i = 0; i < resp.length; i++) {
-                        resp[i].status = vm.$Status.success;
+                "dataType": "json",
+                "success": function (resp, statusText, jqXHR) {
+                    if(jqXHR.status == 200){
+                        vm.vnfmInfo = resp;
+                        vm.$vnfmList =  $.extend(true, [], resp) ;
+                    } else {
+                        bootbox.alert($.i18n.prop("nfv-vnfm-iui-message-query-fail") + "：" + textStatus + ":" + errorThrown);
                     }
-                    vm.vnfmInfo = resp;
                 },
                 error: function (XMLHttpRequest, textStatus, errorThrown) {
                     bootbox.alert($.i18n.prop("nfv-vnfm-iui-message-query-fail") + "：" + textStatus + ":" + errorThrown);
@@ -66,77 +81,7 @@ var vm = avalon
                 }
             });
         },
-        // $initMoc : function() {
-        // 	/*var url = vm.$restUrl.queryMocUrl;
-        //     commonUtil.get(url, null, function(resp) {
-        //         if (resp) {
-        //             vm.addVnfm.moc = resp.data;
-        //         }
-        //     });*/
-        //     var resp = [
-        //     	{ id : "nfv.vnfm.eco", name : "VNFM(ECO)"},
-        //     	{ id : "nfv.vnfm.tacker", name : "VNFM(Tacker)"},
-        //     	{ id : "nfv.vnfm.cmcc", name : "VNFM(CMCC)"},
-        //     	{ id : "nfv.vnfm.etsi", name : "VNFM(ETSI)"}
-        //     ]
-        //     vm.mocSelectItems = resp;
-        // },
-        $initVim: function () {
-            $.ajax({
-                type: 'get',
-                url: vm.$restUrl.queryVimUrl,
-                dataType: 'json',
-                success: function (resp) {
-                    if (resp) {
-                        vm.vimSelectItems = resp;
-                    }
-                    vm.vimSelectItems.push({"vimId": "", "name": ""});
-                }
-            });
-        },
-        addVnfm: {
-            title: $.i18n.prop("nfv-vnfm-iui-text-register"),
-            vnfmId: "",
-            name: "",
-            type: "",
-            //moc : "",
-            nameReadonly : false,
-            vimId: "",
-            //vimVisiable : false,
-            vendor: "",
-            version: "",
-            description: "",
-            certificateUrl: "",
-            url: "",
-            urlTip: $.i18n.prop("nfv-vnfm-iui-text-url-tip"),
-            userName: "",
-            password: "",
-            saveType: "add",
-            status: ""
-        },
         $showVnfmTable: function () {
-            vm.addVnfm.title = $.i18n.prop("nfv-vnfm-iui-text-register"),
-                vm.addVnfm.vnfmId = "";
-            vm.addVnfm.name = "";
-            vm.addVnfm.type = "";
-            //vm.addVnfm.moc = "";
-            vm.addVnfm.nameReadonly = false;
-            vm.addVnfm.vimId = "";
-            //vm.addVnfm.vimVisiable = false;
-            vm.addVnfm.vendor = "";
-            vm.addVnfm.version = "";
-            vm.addVnfm.description = "";
-            vm.addVnfm.certificateUrl = "";
-            vm.addVnfm.url = "";
-            vm.addVnfm.userName = "";
-            vm.addVnfm.password = "";
-            vm.addVnfm.saveType = "add";
-            vm.server_rtn.warning_block = false;
-            vm.server_rtn.info_block = false;
-            //vm.$initMoc();
-            vm.$initVim();
-            //vm.$mocChange();
-
             $(".form-group").each(function () {
                 $(this).removeClass('has-success');
                 $(this).removeClass('has-error');
@@ -144,159 +89,128 @@ var vm = avalon
             });
             $("#addVnfmDlg").modal("show");
         },
-        // $getMocName : function(mocId) {
-        //       	var items = vm.mocSelectItems;
-        //           for(var i=0;i<items.length;i++) {
-        //    		if(items[i].id == mocId) {
-        //    			return items[i].name;
-        //    		}
-        //    	}
-        //    	return "";
-        // },
         $saveVnfm: function () {
             var form = $('#vnfm_form');
             if (form.valid() == false) {
                 return false;
             }
-            vm.server_rtn.info_block = true;
-            vm.server_rtn.warning_block = false;
-            vm.addVnfm.status = vm.$Status.success;
-
-            var param = {
-                name: vm.addVnfm.name,
-                //status : vm.addVnfm.status,
-                //moc : $("#moc").val(),
-                //vimId : vm.$getVimId($("#moc").val()),
-                vimId: $("#vimId").val(),
-                vendor: vm.addVnfm.vendor,
-                version: vm.addVnfm.version,
-                type: vm.addVnfm.type,
-                description: vm.addVnfm.description,
-                certificateUrl: vm.addVnfm.certificateUrl,
-                url: vm.addVnfm.url,
-                userName: vm.addVnfm.userName,
-                password: vm.addVnfm.password
-            }
             //save VIM info
-            if (vm.addVnfm.saveType == "add") {  
-                //      for( var i = 0; i < vm.vnfmInfo.length; i ++ ){
-                //     if(vm.addVnfm.name == vm.vnfmInfo[i].name){                       
-                //        vm.server_rtn.warning_block = true;
-                //        vm.server_rtn.rtn_info = vm.$htmlText.alreadyExist;
-                //        commonUtil.showMessage(vm.$htmlText.alreadyExist, "failed");
-                //        return;
-                //     }
-                // }     
-                $.ajax({
-                    type: "POST",
-                    url: vm.$restUrl.addVnfmInfoUrl,
-                    data: JSON.stringify(param),
-                    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();
-
-                            $('#addVnfmDlg').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;
-                    }
-                });
+            if (vm.saveType == "add") {
+                vm.postVnfm();
             } else {
-                $.ajax({
-                    type: "PUT",
-                    url: vm.$restUrl.updateVnfmInfoUrl + vm.addVnfm.vnfmId,
-                    data: JSON.stringify(param),
-                    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;
-                                }
+                vm.putVnfm();
+            }
+        },
+        registerVnfm: function () {
+            vm.saveType = "add";
+            vm.currentIndex = -1;
+            vm.modalTitle = "Register";
+            vm.currentElement = $.extend(true, {}, vm.$newElement);
+            vm.$showVnfmTable();
+        },
+        delVnfm: function (id, index) {
+            bootbox.confirm($.i18n.prop("nfv-vnfm-iui-message-delete-confirm"), function (result) {
+                if (result) {
+                    var vnfmId = vm.vnfmInfo[index]["vnfmId"];
+                    var url = vm.$restUrl.delVnfmInfoUrl.replace("{vnfmId}", vnfmId)
+                    $.ajax({
+                        type: "DELETE",
+                        url: url,
+                        dataType: "json",
+                        success: function (data, statusText, jqXHR) {
+                            if (jqXHR.status == "204") {
+                                vm.vnfmInfo.splice(index, 1);
+                                vm.$vnfmList.splice(index, 1);
+                                commonUtil.showMessage($.i18n.prop("nfv-vnfm-iui-message-delete-success"), "success");
+                            } else {
+                                commonUtil.showMessage($.i18n.prop("nfv-vnfm-iui-message-delete-fail"), "warning");
                             }
-                            $('#addVnfmDlg').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) {
+                            commonUtil.showMessage($.i18n.prop("nfv-vnfm-iui-message-delete-fail"), "warning");
                         }
-                    },
-                    error: function (XMLHttpRequest, textStatus, errorThrown) {
+                    });
+                }
+            });
+        },
+        updateVnfm: function (index) {
+            vm.saveType = "update";
+            vm.currentIndex = index;
+            vm.modalTitle = "Modify";
+            vm.currentElement = $.extend(true, {}, vm.vnfmInfo[index].$model);
+            vm.$showVnfmTable();
+        },
+        postVnfm: function () {
+            var currentElement = vm.getVnfmSave();
+            $.ajax({
+                type: "POST",
+                url: vm.$restUrl.addVnfmInfoUrl,
+                data: JSON.stringify(currentElement),
+                dataType: "json",
+                contentType: "application/json",
+                success: function (resp, statusText, jqXHR) {
+                    if (jqXHR.status == 200) {
+                        currentElement.vnfmId = resp.id;
+                        vm.vnfmInfo.push(currentElement);
+                        $('#addVnfmDlg').modal('hide');
+                        commonUtil.showMessage(vm.$htmlText.saveSuccess, "success");
+                    } else {
                         vm.server_rtn.warning_block = true;
-                        vm.server_rtn.rtn_info = textStatus + ":" + errorThrown;
-                        vm.server_rtn.info_block = false;
+                        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;
+                }
+            });
         },
-        //  		mocRendered : function(action) {
-        // 	if(vm.addVnfm.saveType === "update" && vm.addVnfm.moc) {
-        // 		var items = vm.mocSelectItems;
-        // 		for(var i=0;i<items.length;i++) {
-        //     		if(items[i].id == vm.addVnfm.moc) {
-        //     			$("#moc")[0].selectedIndex = i;
-        //     			vm.$mocChange();
-        //     			break;
-        //     		}
-        //     	}
-        // 	} else {
-        // 		$("#moc")[0].selectedIndex = 0;
-        // 	}
-        // },
-        vimRendered: function (action) {
-            var items = vm.vimSelectItems;
-            if (vm.addVnfm.saveType === "update") {
-                for (var i = 0; i < items.length; i++) {
-                    if (items[i].vimId == vm.addVnfm.vimId) {
-                        $("#vimId")[0].selectedIndex = i;
-                        break;
+        putVnfm: function () {
+            var currentElement = vm.getVnfmSave();
+            var url = vm.$restUrl.updateVnfmInfoUrl .replace("{vnfmId}", currentElement.vnfmId);
+            $.ajax({
+                type: "PUT",
+                url: url,
+                data: JSON.stringify(currentElement),
+                dataType: "json",
+                contentType: "application/json",
+                success: function (resp, statusText, jqXHR) {
+                    if (jqXHR.status == 200) {
+                        vm.fillElement(currentElement, vm.vnfmInfo[vm.currentIndex]);
+                        $('#addVnfmDlg').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;
                 }
-            } else {
-                $("#vimId")[0].selectedIndex = items.length - 1;
-            }
+            });
+        },
+        fillElement: function (sourceElement, targetElement) {
+            targetElement["vnfmId"] = sourceElement["vnfmId"];
+            targetElement["name"] = sourceElement["name"];
+            targetElement["type"] = sourceElement["type"];
+            targetElement["vimId"] = sourceElement["vimId"];
+            targetElement["vendor"] = sourceElement["vendor"];
+            targetElement["version"] = sourceElement["version"];
+            targetElement["certificateUrl"] = sourceElement["certificateUrl"];
+            targetElement["url"] = sourceElement["url"];
+            targetElement["userName"] = sourceElement["userName"];
+            targetElement["password"] = sourceElement["password"];
         },
-        // $mocChange : function() {
-        // 	var mocId = $('#moc').val();
-        // 	if(mocId == "nfv.vnfm.tacker") {
-        // 		vm.addVnfm.vimVisiable = true;
-        // 	} else {
-        // 		vm.addVnfm.vimVisiable = false;
-        // 	}
-        // },
-        // $getVimId : function(mocId) {
-        // 	if(vm.addVnfm.vimVisiable) {
-        // 		return $("#vimId").val();
-        // 	} else {
-        // 		return "";
-        // 	}
-        // }
-    });
+        getVnfmSave: function () {
+            var vnfmSave = $.extend(true, {}, vm.currentElement.$model);
+            return vnfmSave;
+        }
+});
+vm.currentElement = $.extend(true, {}, vm.$newElement);
 avalon.scan();
-vm.$initTable();
-//vm.$initMoc();
\ No newline at end of file
+vm.$initTable();
\ No newline at end of file
diff --git a/portal/src/main/webapp/extsys/vnfm/vnfmView.html b/portal/src/main/webapp/extsys/vnfm/vnfmView.html
index a26ed57..b5da6fc 100644
--- a/portal/src/main/webapp/extsys/vnfm/vnfmView.html
+++ b/portal/src/main/webapp/extsys/vnfm/vnfmView.html
@@ -23,7 +23,6 @@
     <link href="../../thirdparty/font-awesome/css/font-awesome.min.css" rel="stylesheet"/>
     <link href="../../thirdparty/bootstrap/css/bootstrap.min.css" rel="stylesheet"/>
     <link href="../../thirdparty/uniform/css/uniform.default.min.css" rel="stylesheet"/>
-    <link href="../../thirdparty/css/ZteIctIcons/style.css" rel="stylesheet"/>
     <link href="../../thirdparty/css/ngict-component.css" rel="stylesheet"/>
     <link href="css/animate.min.css" rel="stylesheet"/>
     <link href="css/vnfm.css" rel="stylesheet"/>
@@ -36,57 +35,52 @@
 </head>
 <body>
 <div ms-controller="vnfmController" class="container-fluid ms-controller">
-    <div id="addVnfmDlg" class="modal  fade" tabindex="-1" role="dialog"
-         aria-labelledby="myModalLabel" aria-hidden="true">
+    <div id="addVnfmDlg" class="modal  fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
         <div class="modal-dialog">
             <div class="modal-content Changepasswd">
                 <div class="content">
                     <div class="modal-header">
-                        <button type="button" class="close" data-dismiss="modal"
-                                aria-hidden="true">×
-                        </button>
-                        <h4 id="myModalLabel">{{addVnfm.title}}</h4>
+                        <h4 id="myModalLabel">{{modalTitle}}</h4>
                     </div>
                     <div class="modal-body">
                         <form class="form-horizontal" id="vnfm_form" role="form">
-                            <input type="hidden" ms-duplex="addVnfm.vnfmId" name="vnfmId" class="form-control"/>
                             <div class="form-group">
                                 <label class="control-label col-sm-3">
-                                    <span id="nfv-vnfm-iui-text-name" name_i18n="com_zte_nfv_nsoc_i18n"></span>
+                                    <span id_i18n="nfv-vnfm-iui-text-name" name_i18n="com_zte_nfv_nsoc_i18n"></span>
                                     <span class="required" aria-required="true">*</span>
                                 </label>
                                 <div class="col-sm-7">
-                                    <input type="text" ms-duplex="addVnfm.name" name="name" class="form-control" ms-readonly="addVnfm.nameReadonly"/>
+                                    <input type="text" ms-duplex="currentElement.name" name="name" class="form-control" ms-attr-readonly="addVnfm.nameReadonly"/>
                                     <span class="help-block"></span>
                                 </div>
                             </div>
                             <div class="form-group">
                                 <label class="control-label col-sm-3">
-                                    <span id="nfv-vnfm-iui-text-type" name_i18n="com_zte_nfv_nsoc_i18n"></span>
+                                    <span id_i18n="nfv-vnfm-iui-text-type" name_i18n="com_zte_nfv_nsoc_i18n"></span>
                                     <span class="required" aria-required="true">*</span>
                                 </label>
                                 <div class="col-sm-7">
-                                    <input type="text" ms-duplex="addVnfm.type" name="type" class="form-control"/>
+                                    <input type="text" ms-duplex="currentElement.type" name="type" class="form-control"/>
                                     <span class="help-block"></span>
                                 </div>
                             </div>
                             <div class="form-group">
                                 <label class="control-label col-sm-3">
-                                    <span id="nfv-vnfm-iui-text-vendor" name_i18n="com_zte_nfv_nsoc_i18n"></span>
+                                    <span id_i18n="nfv-vnfm-iui-text-vendor" name_i18n="com_zte_nfv_nsoc_i18n"></span>
                                     <span class="required" aria-required="true">*</span>
                                 </label>
                                 <div class="col-sm-7">
-                                    <input type="text" ms-duplex="addVnfm.vendor" name="vendor" class="form-control"/>
+                                    <input type="text" ms-duplex="currentElement.vendor" name="vendor" class="form-control"/>
                                     <span class="help-block"></span>
                                 </div>
                             </div>
                             <div class="form-group">
                                 <label class="control-label col-sm-3">
-                                    <span id="nfv-vnfm-iui-text-version" name_i18n="com_zte_nfv_nsoc_i18n"></span>
+                                    <span id_i18n="nfv-vnfm-iui-text-version" name_i18n="com_zte_nfv_nsoc_i18n"></span>
                                     <span class="required" aria-required="true">*</span>
                                 </label>
                                 <div class="col-sm-7">
-                                    <input type="text" ms-duplex="addVnfm.version" name="version" class="form-control"/>
+                                    <input type="text" ms-duplex="currentElement.version" name="version" class="form-control"/>
                                     <span class="help-block"></span>
                                 </div>
                             </div>
@@ -96,8 +90,7 @@
                                     <span class="required" aria-required="true">*</span>
                                 </label>
                                 <div class="col-sm-7">
-                                    <input type="text" ms-duplex="addVnfm.url" name="url" class="form-control"
-                                           ms-attr-placeholder="addVnfm.urlTip"/>
+                                    <input type="text" ms-duplex="currentElement.url" name="url" class="form-control" placeholder="Example: http://10.0.0.1"/>
                                     <span class="help-block"></span>
                                 </div>
                             </div>
@@ -106,62 +99,45 @@
                                     <span></span>
                                 </label>
                                 <div class="col-sm-7">
-                                    <select class="form-control" id="vimId" name="vimId">
-                                        <option ms-repeat-vim="vimSelectItems" ms-attr-value="vim.vimId"
-                                                data-repeat-rendered="vimRendered">{{vim.name}}
-                                        </option>
-                                    </select>
+                                    <input class="form-control" ms-duplex="currentElement.vimId" id="vimId" name="vimId"/>
                                 </div>
                             </div>
                             <div class="form-group">
                                 <label class="control-label col-sm-3">
-                                    <span id="nfv-vnfm-iui-text-certificateUrl"
-                                          name_i18n="com_zte_nfv_nsoc_i18n"></span>
+                                    <span id_i18n="nfv-vnfm-iui-text-certificateUrl" name_i18n="com_zte_nfv_nsoc_i18n"></span>
                                 </label>
                                 <div class="col-sm-7">
-                                    <input type="text" ms-duplex="addVnfm.certificateUrl" name="certificateUrl"
+                                    <input type="text" ms-duplex="currentElement.certificateUrl" name="certificateUrl"
                                            class="form-control"/>
                                     <span class="help-block"></span>
                                 </div>
                             </div>
                             <div class="form-group">
                                 <label class="control-label col-sm-3">
-                                    <span id="nfv-vnfm-iui-text-userName" name_i18n="com_zte_nfv_nsoc_i18n"></span>
+                                    <span id_i18n="nfv-vnfm-iui-text-userName" name_i18n="com_zte_nfv_nsoc_i18n"></span>
                                 </label>
                                 <div class="col-sm-7">
-                                    <input type="text" ms-duplex="addVnfm.userName" name="userName"
+                                    <input type="text" ms-duplex="currentElement.userName" name="userName"
                                            class="form-control"/>
                                     <span class="help-block"></span>
                                 </div>
                             </div>
                             <div class="form-group">
                                 <label class="control-label col-sm-3">
-                                    <span id="nfv-vnfm-iui-text-password" name_i18n="com_zte_nfv_nsoc_i18n"></span>
+                                    <span id_i18n="nfv-vnfm-iui-text-password" name_i18n="com_zte_nfv_nsoc_i18n"></span>
                                 </label>
                                 <div class="col-sm-7">
-                                    <input type="password" ms-duplex="addVnfm.password" name="password"
+                                    <input type="password" ms-duplex="currentElement.password" name="password"
                                            class="form-control"/>
                                     <span class="help-block"></span>
                                 </div>
                             </div>
-                            <div class="form-group">
-                                <label class="control-label col-sm-3">
-                                    <span id="nfv-vnfm-iui-text_description" name_i18n="com_zte_nfv_nsoc_i18n"></span>                                    
-                                </label>
-                                <div class="col-sm-7">
-                                    <textarea class="form-control" rows="3" ms-duplex="addVnfm.description"
-                                              name="description"></textarea>
-                                    <span class="help-block"></span>
-                                </div>
-                            </div>
                         </form>
 
                     </div>
                     <div class="modal-footer">
-                        <button class="btn" data-dismiss="modal" aria-hidden="true" id="nfv-vnfm-iui-text-cancelBtn"
-                                name_i18n="com_zte_nfv_nsoc_i18n"></button>
-                        <button class="btn btn-primary" type="submit" ms-click="$saveVnfm"
-                                id="nfv-vnfm-iui-text-saveBtn" name_i18n="com_zte_nfv_nsoc_i18n"></button>
+                        <button class="btn" data-dismiss="modal" aria-hidden="true" id_i18n="nfv-vnfm-iui-text-cancelBtn" name_i18n="com_zte_nfv_nsoc_i18n"></button>
+                        <button class="btn btn-primary" type="submit" ms-click="$saveVnfm" id_i18n="nfv-vnfm-iui-text-saveBtn" name_i18n="com_zte_nfv_nsoc_i18n"></button>
                     </div>
                 </div>
             </div>
@@ -169,22 +145,21 @@
     </div>
     <div class="row-fluid" data-name="cond_zone">
         <div class="col-md-12">
-            <button class="btn white radius_l" id="app-new-btn" ms-click="$showVnfmTable">
-                <i class="ict-new"></i> <span id="nfv-vnfm-iui-text-registerBtn"
-                                              name_i18n="com_zte_nfv_nsoc_i18n"></span>
+            <button class="btn white radius_l" id="app-new-btn" ms-click="registerVnfm()">
+                <i class="ict-new"></i> <span id_i18n="nfv-vnfm-iui-text-registerBtn" name_i18n="com_zte_nfv_nsoc_i18n"></span>
             </button>
         </div>
     </div>
 
     <div class="col-sm-12 vnfm-padding" ms-each-el="vnfmInfo">
-        <div class="col-sm-4 animated-panel zoomIn" style="-webkit-animation-delay: 0.1s;">
+        <div class="col-sm-3 animated-panel zoomIn" style="-webkit-animation-delay: 0.1s;">
             <div class="hpanel stats">
                 <div class="panel-body h-200" ms-hover="hpanel_show">
                     <div class="pull-left">
                         <span class="label label-success" ms-if="el.status === $Status.success"
-                              id="nfv-vnfm-iui-text-status-normal" name_i18n="com_zte_nfv_nsoc_i18n"></span>
+                              id_i18n="nfv-vnfm-iui-text-status-normal" name_i18n="com_zte_nfv_nsoc_i18n"></span>
                         <span class="label label-danger" ms-attr-title="el.errorInfo" data-toggle="tooltip"
-                              ms-if="el.status === $Status.failed" id="nfv-vnfm-iui-text-status-fail"
+                              ms-if="el.status === $Status.failed" id_i18n="nfv-vnfm-iui-text-status-fail"
                               name_i18n="com_zte_nfv_nsoc_i18n"></span>
                     </div>
                     <div class="stats-icon pull-right">
@@ -192,16 +167,16 @@
                     </div>
                     <div class="m-t-xl">
                         <h3 ms-text="el.name"></h3>
-                        <div><span id="nfv-vnfm-iui-text-type" name_i18n="com_zte_nfv_nsoc_i18n"></span>：<span
+                        <div><span id_i18n="nfv-vnfm-iui-text-type" name_i18n="com_zte_nfv_nsoc_i18n"></span>：<span
                                 ms-text="el.type"></span></div>
                         <div>URL：<span ms-text="el.url"></span></div>
                     </div>
                 </div>
                 <div class="panel-footer">
                     <div class="pull-right">
-                        <a class="btn btn-default btn-sm" ms-click="vnfmUtil.updateVnfm(el.$model)"><i
+                        <a class="btn btn-default btn-sm" ms-click="updateVnfm($index)"><i
                                 class="fa fa-pencil-square-o fa-lg"></i></a>
-                        <a class="btn btn-default btn-sm" ms-click="vnfmUtil.delVnfm(el.vnfmId)"><i
+                        <a class="btn btn-default btn-sm" ms-click="delVnfm(el.vnfmId, $index)"><i
                                 class="fa fa-trash-o fa-lg"> </i></a>
                     </div>
                 </div>
@@ -210,9 +185,11 @@
     </div>
     <div class="col-sm-12">
         <div class="pull-left text-muted">
-            <small><span id="nfv-vnfm-iui-text-total" name_i18n="com_zte_nfv_nsoc_i18n"></span> <span class="blue-font"
-                                                                                                      ms-text="vnfmInfo.size()"></span>
-                <span id="nfv-vnfm-iui-text-total-vnfm" name_i18n="com_zte_nfv_nsoc_i18n"></span></small>
+            <small>
+                <span id_i18n="nfv-vnfm-iui-text-total" name_i18n="com_zte_nfv_nsoc_i18n"></span>
+                <span class="blue-font" ms-text="vnfmInfo.size()"></span>
+                <span id_i18n="nfv-vnfm-iui-text-total-vnfm" name_i18n="com_zte_nfv_nsoc_i18n"></span>
+            </small>
         </div>
     </div>
 </div>
@@ -224,8 +201,6 @@
 <script type="text/javascript" src="../../thirdparty/jquery-validation/js/additional-methods.min.js"></script>
 
 <script type="text/javascript" src="../../thirdparty/bootstrap-growl/bootstrap-growl.min.js"></script>
-<!--<script type="text/javascript" src="../../thirdparty/cometd/cometd.js"></script>-->
-<!--<script type="text/javascript" src="../../thirdparty/cometd/jquery.cometd.js"></script>-->
 <script type="text/javascript" src="../../thirdparty/avalon/avalon.js"></script>
 
 <script type="text/javascript" src="../../thirdparty/js/tools.js"></script>