--- /dev/null
+/*\r
+\r
+ Copyright 2017, Huawei Technologies Co., Ltd.\r
+\r
+ Licensed under the Apache License, Version 2.0 (the "License");\r
+ you may not use this file except in compliance with the License.\r
+ You may obtain a copy of the License at\r
+\r
+ http://www.apache.org/licenses/LICENSE-2.0\r
+\r
+ Unless required by applicable law or agreed to in writing, software\r
+ distributed under the License is distributed on an "AS IS" BASIS,\r
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
+ See the License for the specific language governing permissions and\r
+ limitations under the License.\r
+\r
+ */\r
+\r
+var app = angular.module("ProvinceManagementApp", ["ui.router", "ngTable"])\r
+\r
+ .config(function($stateProvider, $urlRouterProvider, $urlMatcherFactoryProvider){\r
+\r
+ $urlMatcherFactoryProvider.caseInsensitive(true);\r
+ $urlRouterProvider.otherwise('/provinceMgmt');\r
+ $stateProvider\r
+ .state("" +\r
+ "provinceMgmt", {\r
+ url: "/provinceMgmt",\r
+ templateUrl : "templates/management.html",\r
+ controller : "managementCtrl"\r
+ })\r
+ })\r
+\r
+\r
+ .controller("managementCtrl", function($scope, $log, provinceDataService, $state, $compile, NgTableParams){\r
+ $scope.message = "Management";\r
+\r
+ $scope.init = function() {\r
+ provinceDataService.getAllProvinceData()\r
+ .then(function(data){\r
+ $scope.provinceData = data.provinceData;\r
+ console.log("Data: ");\r
+ loadButtons();\r
+ $log.info(data.provinceData);\r
+ }, function(reason){\r
+ $scope.message = "Error is :" + JSON.stringify(reason);\r
+ });\r
+\r
+ /*DataService.post("http://localhost:4000/api/getAllJSONData", {"wdgtType":$scope.provinceTip})\r
+ .then(function(data){\r
+ $scope.provinceTipData = data.data.provinceTip;\r
+ });*/\r
+ }\r
+\r
+ function loadButtons() {\r
+\r
+ console.log("modelTemplate issss"+modelTemplate);\r
+ var def_button_tpl = $(modelTemplate).filter('#defaultButtons').html();\r
+ var def_iconbutton_tpl = $(modelTemplate).filter('#defaultIconButtons').html();\r
+ var dialog = $(modelTemplate).filter('#dialog').html();\r
+\r
+ var add_data = {"title":"Create", "type":"btn btn-default", "gType": "plus-icon", "iconPosition":"left", "clickAction":"showAddModal()"};\r
+\r
+ var delete_data = {"title":"Delete Selected", "type":"btn btn-default", "gType": "delete-icon", "iconPosition":"left", "clickAction":"deleteData()"};\r
+ var addhtml = Mustache.to_html(def_iconbutton_tpl, add_data);\r
+ var deletehtml = Mustache.to_html(def_iconbutton_tpl, delete_data);\r
+ $('#provinceAction').html($compile(addhtml)($scope));\r
+\r
+\r
+\r
+ $('#provinceAction').append($compile(deletehtml)($scope));\r
+\r
+ $('#managementDialog').html($compile(dialog)($scope));\r
+\r
+ $scope.checkboxes = { 'checked': false, items: {} };\r
+\r
+ $scope.tableParams = new NgTableParams({count: 5, sorting: {province_name: 'asc'} //{page: 1,count: 10,filter: {name: 'M'},sorting: {name: 'desc'}\r
+ }, { counts:[5, 10, 20, 50], dataset: $scope.provinceData});\r
+\r
+ $scope.$watch('checkboxes.checked', function(value) {\r
+ angular.forEach($scope.provinceData, function(item) {\r
+ if (angular.isDefined(item.id)) {\r
+ $scope.checkboxes.items[item.id] = value;\r
+ }\r
+ });\r
+ });\r
+\r
+ var text = $(modelTemplate).filter('#textfield').html();\r
+ var ipv4 = $(modelTemplate).filter('#ipv4').html();\r
+ var number = $(modelTemplate).filter('#numeric').html();\r
+\r
+ $('#managementDialog .modalHeader').html('<h5 class="modal-title titlestyle">Modal Header</h5>');\r
+ $('#managementDialog .modalBodyContent').html('<div class="form-group row"> <label class="col-xs-4 col-form-label labelstyle">Name</label> <div class="col-xs-8 provinceName" > </div> </div>');\r
+ $('#managementDialog .modalBodyContent').append('<div class="form-group row"> <label class="col-xs-4 col-form-label labelstyle">IP Address</label> <div class="col-xs-8 ipAddress" > </div> </div>');\r
+ $('#managementDialog .modalBodyContent').append(' <div class="form-group row"> <label for="port" class="col-xs-4 col-form-label labelstyle">Port</label> <div class="col-xs-8 port" > </div> </div>');\r
+ $('#managementDialog .modalBodyContent').append(' <div class="form-group row"> <label for="desc" class="col-xs-4 col-form-label labelstyle">Description</label> <div class="col-xs-8 desc" > </div> </div>');\r
+\r
+\r
+\r
+ var dataText = {"ErrMsg" : {"errmsg" : "Please input Name.", "modalVar":"province.province_name", "placeholder":"Name", "errtag":"ptextboxErr", "errfunc":"validatetextbox", "required":true}};\r
+ $('#managementDialog .provinceName').html($compile(Mustache.to_html(text, dataText.ErrMsg))($scope));\r
+\r
+ var dataIP = {"ErrMsg" : {"errmsg" : "Please input IP Address.", "modalVar":"province.ip", "placeholder":"IP Address"}};\r
+ $('#managementDialog .ipAddress').html($compile(Mustache.to_html(ipv4, dataIP.ErrMsg))($scope));\r
+\r
+ var dataNum = {"ErrMsg" : {"errmsg" : "Please input port.", "modalVar":"province.port", "placeholder":"Port"}};\r
+ $('#managementDialog .port').html($compile(Mustache.to_html(number, dataNum.ErrMsg))($scope));\r
+\r
+ var dataText = {"ErrMsg" : {"errmsg" : "Please input description.", "modalVar":"province.desc", "placeholder":"Description"}};\r
+ $('#managementDialog .desc').html($compile(Mustache.to_html(text, dataText.ErrMsg))($scope));\r
+\r
+ var modelSubmit_data = {"title":"OK", "clickAction":"saveData(province.id)"};\r
+ var modelSubmit_html = Mustache.to_html(def_button_tpl, modelSubmit_data);\r
+ $('#managementDialog #footerBtns').html($compile(modelSubmit_html)($scope));\r
+\r
+ var modelBtn_data = {"title":"Cancel", "clickAction":"closeModal()"};\r
+ var modelBtn_html = Mustache.to_html(def_button_tpl, modelBtn_data);\r
+ $('#managementDialog #footerBtns').append($compile(modelBtn_html)($scope));\r
+ }\r
+\r
+ $scope.validatetextbox = function (value){\r
+ if($scope.province.province_name) {\r
+ $scope.ptextboxErr = false;\r
+ }\r
+ else\r
+ $scope.ptextboxErr = true;\r
+ }\r
+\r
+ $scope.checkAll = function() {\r
+ console.log("Checked ..");\r
+ angular.forEach($scope.provinceData, function(data) {\r
+ $scope.checkboxes.items[user.id]\r
+ });\r
+ };\r
+\r
+ $scope.closeModal = function() {\r
+ console.log("Closing Modal...");\r
+ $('#managementDialog').modal('hide');\r
+ }\r
+\r
+ $scope.showAddModal = function() {\r
+ console.log("Showing Modal to Add data");\r
+ $scope.province = {};\r
+ $scope.textboxErr = false;\r
+ $scope.ipv4Err = false;\r
+ $scope.numericErr = false;\r
+ //$("#myModal").modal();\r
+ $("#uniModal").modal({}).draggable();\r
+ }\r
+ $scope.saveData = function(id) {\r
+ if(id) {\r
+ //edit data\r
+ console.log("Editing data.." + JSON.stringify($scope.province));\r
+ provinceDataService.editProvinceData($scope.province)\r
+ .then(function (data) {\r
+ $scope.message = "Success :-)";\r
+ $state.reload();\r
+ },\r
+ function (reason) {\r
+ $scope.message = reason.status + " " + reason.statusText;\r
+ });\r
+ }\r
+ else {\r
+ console.log("Adding data.." + JSON.stringify($scope.province));\r
+ provinceDataService.addProvinceData($scope.province)\r
+ .then(function (data) {\r
+ $scope.message = "Success :-)";\r
+ $state.reload();\r
+ },\r
+ function (reason) {\r
+ $scope.message = reason.status + " " + reason.statusText;\r
+ });\r
+ }\r
+ $('#uniModal').modal('hide');\r
+ }\r
+\r
+ /*$scope.deleteIndividualData = function(id) {\r
+ var deleteArr = [];\r
+ //$log.info($scope.checkboxes);\r
+ deleteArr.push(id);\r
+\r
+ console.log("To be deleted : "+deleteArr);\r
+ //$log.info(deleteArr);\r
+\r
+\r
+ provinceDataService.post("http://localhost:4000/api/deleteProvinceData", {'idList':deleteArr})\r
+ .then(function(data){\r
+ $scope.message = "Successfully deleted :-)";\r
+ $state.reload();\r
+ },\r
+ function(reason){\r
+ //$log.info(reason);\r
+ $scope.message = reason.status + " " + reason.statusText;\r
+ });\r
+ }*/\r
+ $scope.deleteData = function(id) {\r
+ var confirmation=false;\r
+ var dialog_tpl = $(modelTemplate).filter('#personDialog').html();\r
+ var error = {"err_data" : { "title": "Error",\r
+ "showClose": "true",\r
+ "closeBtnTxt": "Cancel",\r
+ "icon": "glyphicon glyphicon-exclamation-sign",\r
+ "iconColor": "icon_error",\r
+ "msg": "Do you really wanted to Delete?.",\r
+ "buttons": [\r
+ {\r
+ "text": "OK", "action": "deleteConfirmation("+id+")"\r
+ }]\r
+ }};\r
+ var html = Mustache.to_html(dialog_tpl, error.err_data);\r
+ $($compile(html)($scope)).modal({backdrop: "static"});\r
+ }\r
+\r
+ $scope.deleteConfirmation = function(id) {\r
+ console.log("data in province data is :");\r
+ $log.info($scope.provinceData);\r
+ var deleteArr = [];\r
+ if (typeof id !== "undefined"){\r
+\r
+ deleteArr.push(id);\r
+ }else{\r
+ angular.forEach($scope.checkboxes.items, function (value, key) {\r
+ if (value) {\r
+ console.log("deleting name is :" + key);\r
+ deleteArr.push(key);\r
+ }\r
+ });\r
+\r
+ }\r
+\r
+ console.log("To be deleted : " + deleteArr);\r
+\r
+ for(var i = 0; i < deleteArr.length; i++) {\r
+ console.log("To be deleted : "+deleteArr[i]);\r
+ provinceDataService.deleteProvinceData(deleteArr[i])\r
+ .then(function(data){\r
+ $scope.message = "Successfully deleted :-)";\r
+ $state.reload();\r
+ },\r
+ function(reason){\r
+ $scope.message = reason.status + " " + reason.statusText;\r
+ });\r
+ }\r
+\r
+ /* provinceDataService.post("http://localhost:4000/api/deleteProvinceData", {'idList':deleteArr})\r
+ .then(function (data) {\r
+ $scope.message = "Successfully deleted :-)";\r
+ $state.reload();\r
+ },\r
+ function (reason) {\r
+ $scope.message = reason.status + " " + reason.statusText;\r
+ });*/\r
+ }\r
+\r
+ $scope.editData = function(id) {\r
+ $scope.textboxErr = false;\r
+ $scope.ipv4Err = false;\r
+ $scope.numericErr = false;\r
+ console.log("To be edited : " + id);\r
+ var dataFound = false;\r
+ angular.forEach($scope.provinceData, function(data) {\r
+ if(!dataFound) {\r
+ if (data.id == id) {\r
+ console.log("Found : " + data.id);\r
+ $scope.province = data;\r
+\r
+ $("#uniModal").modal();\r
+ dataFound = true;\r
+ }\r
+ }\r
+ });\r
+ }\r
+\r
+ })\r
+\r
+var modelTemplate = "";\r
+function loadTemplate() {\r
+ $.get('framework/template.html', function (template) {\r
+ modelTemplate += template;\r
+ });\r
+ $.get('framework/templateContainer.html', function (template) {\r
+ modelTemplate += template;\r
+ });\r
+ $.get('framework/templateWidget.html', function (template) {\r
+ //console.log("Template is : "+template);\r
+ modelTemplate += template;\r
+ });\r
+ $.get('framework/templateNotification.html', function (template) {\r
+ modelTemplate += template;\r
+ });\r
+ $.get('framework/templateFunctional.html', function (template) {\r
+ modelTemplate += template;\r
+ });\r
+}
\ No newline at end of file
--- /dev/null
+/*\r
+\r
+ Copyright 2017, Huawei Technologies Co., Ltd.\r
+\r
+ Licensed under the Apache License, Version 2.0 (the "License");\r
+ you may not use this file except in compliance with the License.\r
+ You may obtain a copy of the License at\r
+\r
+ http://www.apache.org/licenses/LICENSE-2.0\r
+\r
+ Unless required by applicable law or agreed to in writing, software\r
+ distributed under the License is distributed on an "AS IS" BASIS,\r
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
+ See the License for the specific language governing permissions and\r
+ limitations under the License.\r
+\r
+ */\r
+\r
+\r
+app.factory("provinceDataService", function($http,DataService, $log){\r
+ var uri = 'http://192.168.9.13:18008';\r
+ return {\r
+ getAllProvinceData : function() {\r
+ /*return $http({\r
+ url: 'http://localhost:4000/api/getAllProvinceData',\r
+ method: 'GET',\r
+ headers: {'Content-Type': 'application/json'}\r
+ }).then(function(response){\r
+ //$log.info(response);\r
+ return response.data;\r
+ });*/\r
+ return DataService.get(uri+'/api/getAllProvinceData')\r
+ .then(function(response){\r
+ $log.info("in get data service data is :"+response);\r
+ console.log(response);\r
+ return response;\r
+ });\r
+ },\r
+ addProvinceData : function(provinceDetail) {\r
+ /*return $http({\r
+ url: 'http://localhost:4000/api/addProvinceData',\r
+ method: 'POST',\r
+ data: provinceDetail,\r
+ headers: {'Content-Type': 'application/json '}\r
+ }).then(function(response){\r
+ console.log("Response : ");\r
+ $log.info(response.data);\r
+ return response.data;\r
+ });*/\r
+ return DataService.post(uri+'/api/addProvinceData', provinceDetail)\r
+ .then(function(response){\r
+ console.log("Successfully added.. Data returned in DataService is");\r
+ console.log(response);\r
+ return response;\r
+ });\r
+ },\r
+ deleteProvinceData : function(id) {\r
+ /*return $http({\r
+ url: 'http://localhost:4000/api/deleteProvinceData',\r
+ method: 'POST',\r
+ data: {'idList':idList},\r
+ headers: {'Content-Type': 'application/json'}\r
+ }).then(function(response){\r
+ console.log("Successfully Deleted..");\r
+ $log.info(response);\r
+ return response.data;\r
+ });*/\r
+ return DataService.delete(uri+'/api/deleteProvinceData'+"/"+id)\r
+ .then(function(response){\r
+ $log.info("in delete data service data is :"+response);\r
+ console.log(response);\r
+ return response;\r
+ });\r
+ },\r
+ editProvinceData : function(provinceDetail) {\r
+ /*return $http({\r
+ url: 'http://localhost:4000/api/editProvinceData',\r
+ method: 'POST',\r
+ data: provinceDetail,\r
+ headers: {'Content-Type': 'application/json'}\r
+ }).then(function(response){\r
+ console.log("Successfully Edited...");\r
+ $log.info(response);\r
+ return response.data;\r
+ });*/\r
+ return DataService.put(uri+'/api/editProvinceData', provinceDetail)\r
+ .then(function(response){\r
+ console.log("Successfully edited.. Data returned in DataService is");\r
+ console.log(response);\r
+ return response;\r
+ });\r
+ }\r
+ }\r
+});\r
--- /dev/null
+<!--\r
+\r
+ Copyright 2017, Huawei Technologies Co., Ltd.\r
+\r
+ Licensed under the Apache License, Version 2.0 (the "License");\r
+ you may not use this file except in compliance with the License.\r
+ You may obtain a copy of the License at\r
+\r
+ http://www.apache.org/licenses/LICENSE-2.0\r
+\r
+ Unless required by applicable law or agreed to in writing, software\r
+ distributed under the License is distributed on an "AS IS" BASIS,\r
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
+ See the License for the specific language governing permissions and\r
+ limitations under the License.\r
+\r
+-->\r
+<div class="homecontent center">\r
+<div class="col-md-12 col-sm-12 col-lg-12">\r
+ <h4>{{message}}</h4>\r
+ <br><br>\r
+ <div id="provinceAction" ng-init="init()">\r
+\r
+ </div>\r
+ <br>\r
+ <br>\r
+\r
+ <table ng-table="tableParams" class="table table-bordered table-striped customtable" show-filter="true">\r
+ <tr ng-repeat="provinceData in $data">\r
+ <td header="'ng-table/headers/checkbox.html'">\r
+ <input type="checkbox" ng-model="checkboxes.items[provinceData.id]" />\r
+ </td>\r
+ <td title="'Name'" filter="{ province_name: 'text'}" sortable="'province_name'">\r
+ {{provinceData.province_name}}\r
+ </td>\r
+ <td title="'IP Address'" filter="{ ip: 'text'}" sortable="'ip'">\r
+ {{provinceData.ip}}\r
+ </td>\r
+ <td title="'Port'" filter="{ port: 'number'}" sortable="'port'">\r
+ {{provinceData.port}}\r
+ </td>\r
+ <td title="'Description'" filter="{ port: 'text'}" sortable="'desc'">\r
+ {{provinceData.desc}}\r
+ </td>\r
+ <td title="'Action'">\r
+ <span ng-click="editData(provinceData.id)" style="cursor: pointer;margin: 0 5px"> <img src="framework/images/edit.png" height="15" align="left"/></span>\r
+ <span ng-click="deleteData(provinceData.id)" style="cursor: pointer;margin: 0 5px"><img src="framework/images/delete.png" height="15" align="middle"/></span>\r
+ </td>\r
+ </tr>\r
+ </table>\r
+\r
+\r
+ <script type="text/ng-template" id="ng-table/headers/checkbox.html">\r
+ <input type="checkbox" ng-model="checkboxes.checked" name="filter-checkbox" value="" />\r
+ </script>\r
+\r
+ <!--<div id="myTable"></div>-->\r
+\r
+\r
+ <!-- Modal\r
+ <div id="myModal" class="modal fade" role="dialog">\r
+ <div class="modal-dialog">\r
+\r
+ <!– Modal content–>\r
+ <div class="modal-content">\r
+ <div class="modal-header">\r
+ <button type="button" class="close" data-dismiss="modal">×</button>\r
+ <h5 class="modal-title titlestyle">Modal Header</h5>\r
+ </div>\r
+ <form name="provinceForm" method="post"><!– ng-submit="saveData(province.id)"–>\r
+ <div class="modal-body">\r
+\r
+ <div class="form-group row">\r
+ <label class="col-xs-4 col-form-label labelstyle">Name</label>\r
+ <div class="col-xs-8 provinceName" >\r
+ <!–<input class="form-control" ng-model="province.province_name" type="text" value="" placeholder="Province Name" id="pname" required><br>–>\r
+ </div>\r
+ </div>\r
+ <div class="form-group row">\r
+ <label class="col-xs-4 col-form-label labelstyle">IP Address</label>\r
+ <div class="col-xs-8 ipAddress" >\r
+ <!–<input class="form-control" ng-model="province.ip" type="ipv4" pattern="((^|\.)((25[0-5])|(2[0-4]\d)|(1\d\d)|([1-9]?\d))){4}$" value="" placeholder="IP Address" id="ipaddress" required><br>–>\r
+ </div>\r
+ </div>\r
+ <div class="form-group row">\r
+ <label for="port" class="col-xs-4 col-form-label labelstyle">Port</label>\r
+ <div class="col-xs-8 port" >\r
+ <!–<input class="form-control" ng-model="province.port" type="number" value="" placeholder="Port" id="port" required>–>\r
+\r
+ </div>\r
+ </div>\r
+\r
+ <!–<input type="submit" class="btn btn-default" value="validate"/>–>\r
+\r
+ </div>\r
+\r
+ <div id="footerBtns" class="modal-footer">\r
+ <!–<button type="button" class="btn btn-default" ng-click="addData(province._id)" data-dismiss="modal" ng-disabled="provinceForm.$invalid">OK</button>–>\r
+ <!–<input type="submit" class="btn btn-default" value="Submit"/>–>\r
+ <!–<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>–>\r
+ </div>\r
+ </form>\r
+ </div>\r
+\r
+\r
+ </div>\r
+ </div>-->\r
+ <!--<div id="myModal" class="modal-header">-->\r
+ <div id="managementDialog"></div>\r
+ <!--</div>-->\r
+</div>\r
+</div>
\ No newline at end of file
Code Review / vnfsdk / refrepo.git / commitdiff