diff options
Diffstat (limited to 'testapi/opnfv_testapi/ui/components/projects')
5 files changed, 380 insertions, 0 deletions
diff --git a/testapi/opnfv_testapi/ui/components/projects/project/project.html b/testapi/opnfv_testapi/ui/components/projects/project/project.html new file mode 100644 index 0000000..9d46364 --- /dev/null +++ b/testapi/opnfv_testapi/ui/components/projects/project/project.html @@ -0,0 +1,25 @@ +<div ng-show="ctrl.data" class="projects-table" style="margin-top:24px; margin-left:8px;"> + <table class="table"> + <tbody> + <tr> <td class="col-md-3">Name</td> <td class="col-md-9">{{ctrl.data.name}}</td> </tr> + <tr> <td>Description</td> <td>{{ctrl.data.description}}</td> </tr> + <tr> <td>Creation date</td> <td>{{ctrl.data.creation_date}}</td> </tr> + </tbody> + </table> +</div> + +<div class="row" style="margin-bottom:24px;"></div> +<div class="project-create col-md-3" style="margin-top:10px" ng-class="{ 'hidden': ! ((auth.projectNames.length>0) && + auth.isAuthenticated) }"> + <button type="submit" class="btn btn-primary" ng-click="ctrl.openDeleteModal()">Delete Project</button> + <button type="submit" class="btn btn-primary" ng-click="ctrl.openUpdateModal()">Update Project</button> +</div> +<div ng-show="ctrl.showError" class="alert alert-danger col-md-9" role="alert"> + <span class="glyphicon glyphicon-exclamation-sign" aria-hidden="true"></span> + <span class="sr-only">Error:</span> + {{ctrl.error}} +</div> +<div ng-show="ctrl.showSuccess" class="alert alert-success col-md-9" role="alert"> + <span class="glyphicon glyphicon-ok" aria-hidden="true"></span> + Update Success +</div>
\ No newline at end of file diff --git a/testapi/opnfv_testapi/ui/components/projects/project/projectController.js b/testapi/opnfv_testapi/ui/components/projects/project/projectController.js new file mode 100644 index 0000000..8f4bd20 --- /dev/null +++ b/testapi/opnfv_testapi/ui/components/projects/project/projectController.js @@ -0,0 +1,183 @@ +/* + * 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 () { + 'use strict'; + + angular + .module('testapiApp') + .controller('ProjectController', ProjectController); + + ProjectController.$inject = [ + '$scope', '$http', '$filter', '$state', '$window', '$uibModal', 'testapiApiUrl','raiseAlert', + 'confirmModal' + ]; + + /** + * TestAPI Project Controller + * This controller is for the '/projects' page where a user can browse + * through projects declared in TestAPI. + */ + function ProjectController($scope, $http, $filter, $state, $window, $uibModal, testapiApiUrl, + raiseAlert, confirmModal) { + var ctrl = this; + ctrl.name = $state.params['name']; + ctrl.url = testapiApiUrl + '/projects/' + ctrl.name; + + ctrl.loadDetails = loadDetails; + ctrl.deleteProject = deleteProject; + ctrl.openDeleteModal = openDeleteModal; + ctrl.openUpdateModal = openUpdateModal; + ctrl.updateProject = updateProject; + + + /** + * This will contact the TestAPI to update an existing project. + */ + function updateProject(name,description) { + ctrl.showError = false; + ctrl.showSuccess = false; + if(ctrl.name != ""){ + var projects_url = ctrl.url; + var body = { + name: name, + description: description + }; + ctrl.projectsRequest = + $http.put(projects_url, body).success(function (data){ + ctrl.showSuccess = true ; + }) + .error(function (data) { + ctrl.showError = true; + ctrl.error = 'Error updating the existing Project from server: ' + angular.toJson(data); + }); + ctrl.name = ""; + ctrl.description=""; + } + else{ + ctrl.showError = true; + ctrl.error = 'Name is missing.' + } + } + + /** + * This will contact the TestAPI to delete an existing project. + */ + function deleteProject() { + ctrl.showError = false; + ctrl.showSuccess = false; + ctrl.projectsRequest = + $http.delete(ctrl.url).success(function (data) { + $state.go('projects', {}, {reload: true}); + ctrl.showSuccess = true ; + + }).error(function (error) { + ctrl.showError = true; + ctrl.error = + 'Error deleting project from server: ' + + angular.toJson(error); + }); + } + + /** + * This will open the modal that will show the delete confirm + * message + */ + function openDeleteModal() { + confirmModal("Delete",ctrl.deleteProject); + } + + /** + * This will open the modal that will show the update + * view + */ + function openUpdateModal(){ + $uibModal.open({ + templateUrl: 'testapi-ui/components/projects/project/updateModal.html', + controller: 'ModalInstanceCtrl as updateModal', + size: 'md', + resolve: { + data: function () { + return { + text: "Update", + successHandler: ctrl.updateProject, + project: ctrl.data + }; + } + } + }); + } + + /** + * This will contact the TestAPI to get a listing of declared projects. + */ + function loadDetails() { + ctrl.showError = false; + ctrl.projectsRequest = + $http.get(ctrl.url).success(function (data) { + ctrl.data = data; + }).error(function (error) { + ctrl.data = null; + ctrl.showError = true; + ctrl.error = + 'Error retrieving projects from server: ' + + angular.toJson(error); + }); + } + ctrl.loadDetails(); + } + + + /** + * TestAPI Modal instance Controller + * This controller is for the update modal where a user can update + * the project information. + */ + angular.module('testapiApp').controller('ModalInstanceCtrl', ModalInstanceCtrl); + ModalInstanceCtrl.$inject = ['$scope', '$uibModalInstance', 'data']; + function ModalInstanceCtrl($scope, $uibModalInstance, data) { + var ctrl = this; + ctrl.confirm = confirm; + ctrl.cancel = cancel; + ctrl.data = angular.copy(data); + + ctrl.createRequirements = [ + {label: 'name', type: 'text', required: true}, + {label: 'description', type: 'textarea', required: false} + ]; + + ctrl.name = ctrl.data.project.name; + ctrl.description = ctrl.data.project.description; + + /** + * Initiate confirmation and call the success handler with the + * inputs. + */ + function confirm() { + $uibModalInstance.close(); + if (angular.isDefined(ctrl.data.successHandler)) { + ctrl.data.successHandler(ctrl.name,ctrl.description); + } + } + + /** + * Close the confirm modal without initiating changes. + */ + function cancel() { + $uibModalInstance.dismiss('cancel'); + } + } + + +})(); diff --git a/testapi/opnfv_testapi/ui/components/projects/project/updateModal.html b/testapi/opnfv_testapi/ui/components/projects/project/updateModal.html new file mode 100644 index 0000000..ab8d64e --- /dev/null +++ b/testapi/opnfv_testapi/ui/components/projects/project/updateModal.html @@ -0,0 +1,26 @@ +<div class="modal-header"><h3 class="modal-title">Confirm</h3></div> +<div class="modal-body"> + <div class="form-group"> + <h4>Update</h4> + <div class="row"> + <div ng-repeat="require in updateModal.createRequirements"> + <div class="update-project" style="margin-left:24px;"> + <p class="input-group"> + <label for="cpid">{{require.label|capitalize}}: </label> + <a ng-if="require.type == 'text'"> + <input type="text" dynamic-model="'updateModal.' + require.label"/> + </a> + <a ng-if="require.type == 'textarea'"> + <textarea rows="2" cols="50" value={{require.vaule}} dynamic-model="'updateModal.' + require.label"> + </textarea> + </a> + </p> + </div> + </div> + </div> + </div> +</div> +<div class="modal-footer"> + <button class="btn btn-primary" ng-click="updateModal.confirm()">Ok</button> + <button class="btn btn-default" ng-click="updateModal.cancel()">Cancel</button> +</div> diff --git a/testapi/opnfv_testapi/ui/components/projects/projects.html b/testapi/opnfv_testapi/ui/components/projects/projects.html new file mode 100644 index 0000000..55f8683 --- /dev/null +++ b/testapi/opnfv_testapi/ui/components/projects/projects.html @@ -0,0 +1,52 @@ +<h3>Projects</h3> + +<div class="row" style="margin-bottom:24px;"></div> +<div class="project-create" ng-class="{ 'hidden': ! ((auth.projectNames.length>0) && + auth.isAuthenticated) }"> + <h4>Create</h4> + <div class="row"> + <div ng-repeat="require in ctrl.createRequirements"> + <div class="create-project" style="margin-left:24px;"> + <p class="input-group"> + <label for="cpid">{{require.label|capitalize}}: </label> + <a ng-if="require.type == 'text'"> + <input type="text" dynamic-model="'ctrl.' + require.label"/> + </a> + <a ng-if="require.type == 'textarea'"> + <textarea rows="2" cols="50" dynamic-model="'ctrl.' + require.label"> + </textarea> + </a> + </p> + </div> + </div> + <div class="col-md-1 col-sm-1 col-xs-1 " style="margin-top:15px;"> + <button type="submit" class="btn btn-primary" ng-click="ctrl.create()">Create</button> + </div> + <div class="col-md-11 col-sm-11 col-xs-11"> + <div ng-show="ctrl.showError" class="alert alert-danger" role="alert"> + <span class="glyphicon glyphicon-exclamation-sign" aria-hidden="true"></span> + <span class="sr-only">Error:</span> + {{ctrl.error}} + </div> + <div ng-show="ctrl.showSuccess" class="alert alert-success" role="alert"> + <span class="glyphicon glyphicon-ok" aria-hidden="true"></span> + Create Success + </div> + </div> + </div> +</div> + + +<div ng-show="ctrl.data" class="projects-table" style="margin-top:24px; margin-left:8px;"> + <table ng-data="ctrl.data.projects" ng-show="ctrl.data" class="table table-striped table-hover"> + <tbody> + <tr ng-repeat-start="(index, project) in ctrl.data.projects"> + <td> + <a ui-sref='project({name: project.name})'>{{project.name}}</a> + </td> + </tr> + <tr ng-repeat-end=> + </tr> + </tbody> + </table> +</div>
\ No newline at end of file diff --git a/testapi/opnfv_testapi/ui/components/projects/projectsController.js b/testapi/opnfv_testapi/ui/components/projects/projectsController.js new file mode 100644 index 0000000..16002f6 --- /dev/null +++ b/testapi/opnfv_testapi/ui/components/projects/projectsController.js @@ -0,0 +1,94 @@ +/* + * 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 () { + 'use strict'; + + angular + .module('testapiApp') + .controller('ProjectsController', ProjectsController); + + ProjectsController.$inject = [ + '$scope', '$http', '$filter', '$state', 'testapiApiUrl','raiseAlert' + ]; + + /** + * TestAPI Project Controller + * This controller is for the '/projects' page where a user can browse + * through projects declared in TestAPI. + */ + function ProjectsController($scope, $http, $filter, $state, testapiApiUrl, + raiseAlert) { + var ctrl = this; + ctrl.url = testapiApiUrl + '/projects'; + ctrl.create = create; + ctrl.update = update; + + ctrl.createRequirements = [ + {label: 'name', type: 'text', required: true}, + {label: 'description', type: 'textarea', required: false} + ]; + + ctrl.name = ''; + ctrl.details = ''; + + /** + * This will contact the TestAPI to create a new project. + */ + function create() { + ctrl.showError = false; + ctrl.showSuccess = false; + if(ctrl.name != ""){ + var projects_url = ctrl.url; + var body = { + name: ctrl.name, + description: ctrl.description + }; + ctrl.projectsRequest = + $http.post(projects_url, body).success(function (data){ + ctrl.showSuccess = true ; + ctrl.update(); + }) + .error(function (data) { + ctrl.showError = true; + ctrl.error = 'Error creating the new Project from server:' + angular.toJson(data); + }); + ctrl.name = ""; + ctrl.description=""; + } + else{ + ctrl.showError = true; + ctrl.error = 'Name is missing.' + } + } + + /** + * This will contact the TestAPI to get a listing of declared projects. + */ + function update() { + ctrl.showError = false; + ctrl.projectsRequest = + $http.get(ctrl.url).success(function (data) { + ctrl.data = data; + }).error(function (error) { + ctrl.data = null; + ctrl.showError = true; + ctrl.error = + 'Error retrieving projects from server: ' + + angular.toJson(error); + }); + } + ctrl.update(); + } +})(); |