Commit 137642d6 authored by benjaminParisel's avatar benjaminParisel Committed by abirembaut

Feat/bs 18918 change page type in save as (#2516)

* feat(info): Make page information more clearer (#2515)

* edit tooltip for button show popup
* Cut page|form on display name default value
* Update rest API message
* replace text when no rest api call is found

Covers [BS-18917](https://bonitasoft.atlassian.net/browse/BS-18917)

* feat(convert): Create new entry to convert page or form

* remove type in page/form information
* New item in dropdown  next to save
* Adding fields type with tooltip in save as popup

Covers [BS-18918](https://bonitasoft.atlassian.net/browse/BS-18918)
parent 92931cd6
......@@ -60,8 +60,6 @@ public class Page extends AbstractPage implements HasUUID {
return "".equals(displayName) ? this.getName() : displayName;
}
public void setDisplayName(String displayName) {
this.displayName = displayName;
}
......
(function() {
'use strict';
class ConvertPopUpController {
constructor($uibModalInstance, page, gettext) {
'ngInject';
this.$uibModalInstance = $uibModalInstance;
this.page = page;
this.types = {
page: {
key: 'page',
value: gettext('Application page')
},
form: {
key: 'form',
value: gettext('Process form')
}
};
if (this.types[page.type]) {
this.type = this.types[page.type];
}
}
save() {
if (this.type) {
this.page.type = this.type.key;
}
this.$uibModalInstance.close();
}
}
angular
.module('bonitasoft.designer.editor.header')
.controller('ConvertPopUpController', ConvertPopUpController);
})();
<div class="modal-header">
<h3 class="modal-title" translate>Convert {{ctrl.page.name}}</h3>
</div>
<form class="form EditorHeader-convert" name="convert" novalidate>
<div class="modal-body" id="modal-convert">
<p translate>
In the Studio, a form must be linked to a process or a task, using the contract; a page is
linked to an application descriptor.</p>
<div class="form-group" ng-if="ctrl.type.key === 'page' || ctrl.type.key === 'form'">
<label class="control-label" for="type" tranlate>Type</label>
<div id="type" class="radio" ng-repeat="type in ctrl.types">
<label><input type="radio" name="type" id="type-{{type.key}}" ng-model="ctrl.type" ng-value="type">{{type.value
| translate}}</label>
</div>
</div>
</div>
</div>
<div class="modal-footer" id="modal-export-page-controls">
<button class="btn btn-primary" ng-click="ctrl.save(editMetadata)" name="save"
ng-disabled="editMetadata.$invalid" translate>Save
</button>
<button class="btn btn-link" ng-click="$dismiss('cancel')" name="cancel" translate>Cancel</button>
</div>
</form>
......@@ -84,6 +84,22 @@
.then(() => this.$state.go(`designer.${page.type}`, this.$stateParams, { reload: true }));
}
convert(page) {
var modalInstance = this.$uibModal.open({
templateUrl: 'js/editor/header/convert-popup.html',
controller: 'ConvertPopUpController',
controllerAs: 'ctrl',
resolve: {
page: () => page
}
});
modalInstance.result
.then(() => {
this.save(page);
});
}
removeReferences(data) {
if (angular.isArray(data)) {
data.forEach(item => this.removeReferences(item));
......
......@@ -31,6 +31,7 @@
</button>
<ul class="dropdown-menu" role="menu">
<li><a id="saveAs" class="clickable" ng-click="vm.saveAs(vm.page)" ng-disabled="!formName.$valid" translate>Save as ...</a></li>
<li ng-if="vm.page.type === 'page' || vm.page.type === 'form'"><a id="convert" class="clickable" ng-click="vm.convert(vm.page)" ng-disabled="!formName.$valid" translate>Convert to ...</a></li>
</ul>
</div>
<button type="button" id="export" class="btn btn-bonita-primary" ng-disabled="!formName.$valid" ng-click="vm.saveAndExport(vm.page)"
......
......@@ -3,35 +3,19 @@
'use strict';
class MetadataPopUpController {
constructor($uibModalInstance, page, resources, gettext) {
constructor($uibModalInstance, page, resources) {
'ngInject';
this.$uibModalInstance = $uibModalInstance;
this.page = page;
this.displayName = page.displayName;
this.description = page.description;
this.resources = resources;
this.types = {
page: {
key: 'page',
value: gettext('Application page')
},
form: {
key: 'form',
value: gettext('Process form')
}
};
if (this.types[page.type]) {
this.type = this.types[page.type];
}
}
save(form) {
if (!form.$invalid) {
this.page.displayName = this.displayName;
this.page.description = this.description;
if (this.type) {
this.page.type = this.type.key;
}
this.$uibModalInstance.close();
}
}
......
......@@ -28,13 +28,6 @@
id="page-description"
placeholder="{{ 'Page description' | translate }}"/>
</div>
<div class="form-group" ng-if="ctrl.type.key === 'page' || ctrl.type.key === 'form'">
<label class="control-label" for="type" tranlate>Type</label>
<i id="type" class="fa fa-info-circle" uib-tooltip="{{'You can change the type to be able to use this artifact as a process form or as an application page.' | translate}}" tooltip-placement="right"></i>
<div class="radio" ng-repeat="type in ctrl.types">
<label><input type="radio" name="type" id="type-{{type.key}}" ng-model="ctrl.type" ng-value="type">{{type.value | translate}}</label>
</div>
</div>
<br/>
<h4 translate>Bonita REST API calls
<i class="fa fa-info-circle" uib-tooltip="{{'Summary of the Bonita REST API calls made by the page.' | translate}}" tooltip-placement="right"></i>
......
......@@ -3,15 +3,33 @@
'use strict';
class SaveAsPopUpController {
constructor($uibModalInstance, page) {
constructor($uibModalInstance, page, gettext) {
this.$uibModalInstance = $uibModalInstance;
this.page = page;
this.newName = page.name;
this.types = {
page: {
key: 'page',
value: gettext('Application page'),
tooltip: gettext('Linked to an application descriptor.')
},
form: {
key: 'form',
value: gettext('Process form'),
tooltip: gettext('Linked to a process instantiation or a task, using the contract')
}
};
if (this.types[page.type]) {
this.type = this.types[page.type];
}
}
ok() {
let page = angular.copy(this.page); // copy page to avoid side effects in case of creation error
page.name = this.newName;
if (this.type) {
page.type = this.type.key;
}
this.$uibModalInstance.close(page);
}
}
......
......@@ -4,6 +4,7 @@
<form class="form" name="newPage">
<div class="modal-body" id="modal-save-page-as">
<div class="form-group">
<label class="control-label" for="page-name" tranlate>Name</label>
<input
name="name"
ng-model="ctrl.newName"
......@@ -13,6 +14,16 @@
placeholder="{{ 'Page Name' | translate }}"
required>
</div>
<div class="form-group" ng-if="ctrl.type.key === 'page' || ctrl.type.key === 'form'">
<label class="control-label" for="type" tranlate>Type</label>
<i class="fa fa-info-circle" uib-tooltip="{{'You can change the type to be able to use this artifact as a process form or as an application page.' | translate}}" tooltip-placement="right"></i>
<div id="type" class="radio" ng-repeat="type in ctrl.types">
<label>
<input type="radio" name="type" id="type-{{type.key}}" ng-model="ctrl.type" ng-value="type">{{type.value | translate}}
<i class="fa fa-info-circle" uib-tooltip="{{type.tooltip | translate}}" tooltip-placement="right"></i>
</label>
</div>
</div>
</div>
<div class="modal-footer" id="modal-delete-page-controls">
<button class="btn btn-primary" ng-click="ctrl.ok()" ng-disabled="!newPage.name.$dirty || newPage.$invalid || ctrl.newName == ctrl.page.name" translate>Save</button>
......
......@@ -103,9 +103,13 @@ describe('editor menu', function() {
var newName = $('.modal-body input[name="name"]');
var submitButton = $('.modal-footer .btn-primary');
var typePage = $('.modal-body input#type-page');
var typeForm = $('.modal-body input#type-form');
// input should be filled with current page name
expect(newName.getAttribute('value')).toBe('Person');
expect(typePage.getAttribute('checked')).toBeTruthy();
expect(typeForm.getAttribute('checked')).toBeFalsy();
// button disabled when we enter a wrong page name
newName.clear();
......@@ -126,23 +130,18 @@ describe('editor menu', function() {
var displayName = $('.modal-body input[name="displayName"]');
var description = $('.modal-body textarea[name="description"]');
var typePage = $('.modal-body input#type-page');
var typeForm = $('.modal-body input#type-form');
var submitButton = $('.modal-footer .btn-primary');
// button disabled when we enter a wrong display name
displayName.clear();
expect(submitButton.isEnabled()).toBeFalsy();
expect(typePage.getAttribute('checked')).toBeTruthy();
expect(typeForm.getAttribute('checked')).toBeFalsy();
// display name and description are changed
displayName.clear();
displayName.sendKeys('new display name');
description.clear();
description.sendKeys('new description');
typeForm.click();
expect(submitButton.isEnabled()).toBeTruthy();
submitButton.click();
......@@ -153,6 +152,34 @@ describe('editor menu', function() {
expect(newDisplayName.getAttribute('value')).toBe('new display name');
var newDescription = $('.modal-body textarea[name="description"]');
expect(newDescription.getAttribute('value')).toBe('new description');
$('.modal-footer .btn-link').click();
});
it('should convert page', function() {
var editor = PageEditor.get('person-page');
editor.menu.$('button.dropdown-toggle').click();
editor.menu.$('#convert').click();
var typePage = $('.modal-body input#type-page');
var typeForm = $('.modal-body input#type-form');
var submitButton = $('.modal-footer .btn-primary');
expect(submitButton.isEnabled()).toBeTruthy();
expect(typePage.getAttribute('checked')).toBeTruthy();
expect(typeForm.getAttribute('checked')).toBeFalsy();
typeForm.click();
expect(submitButton.isEnabled()).toBeTruthy();
submitButton.click();
editor.menu.$('button.dropdown-toggle').click();
editor.menu.$('#convert').click();
var newTypeForm = $('.modal-body input#type-form');
expect(newTypeForm.getAttribute('checked')).toBeTruthy();
......
......@@ -203,5 +203,18 @@
'rows': [ [{ 'type': 'fragment', 'id': '6c959a04-a8a8-4fde-b8d8-b76323cd1629', }] ],
'inactiveAssets': [], 'data': {} });
});
it('should open convert popup', function() {
spyOn($uibModal, 'open').and.returnValue(modalInstance);
spyOn(pageRepo, 'save').and.returnValue($q.when({headers : () => {}}));
var page = { id: 'person', type: 'page'};
controller.convert(page);
expect($uibModal.open).toHaveBeenCalled();
expect($uibModal.open.calls.mostRecent().args[0].templateUrl).toEqual('js/editor/header/convert-popup.html');
expect($uibModal.open.calls.mostRecent().args[0].controller).toEqual('ConvertPopUpController');
modalInstance.close(page);
scope.$apply();
expect(pageRepo.save).toHaveBeenCalledWith(page);
});
});
})();
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment