Initial commit
This commit is contained in:
Senad Uka
@@ -0,0 +1,60 @@
|
||||
(function () {
|
||||
global.dashModule
|
||||
.directive('copyProcesses', copyProcessesDirective)
|
||||
.controller('copyProcessesCtrl', ['$scope', '$http', '$', '$timeout', '$translate', 'utilsService', copyProcessesCtrl]);
|
||||
|
||||
function copyProcessesDirective() {
|
||||
return {
|
||||
restrict: 'E',
|
||||
templateUrl: 'processes/html/copyProcessesTemplate'
|
||||
};
|
||||
}
|
||||
|
||||
function copyProcessesCtrl($scope, $http, $, $timeout, $translate, utilsService) {
|
||||
$scope.initPeocessCopy = initPeocessCopy;
|
||||
$scope.getSteps = getSteps;
|
||||
$scope.resetProcessSelection = resetProcessSelection;
|
||||
|
||||
function initPeocessCopy(){
|
||||
getProcessNames();
|
||||
}
|
||||
|
||||
function getProcessNames() {
|
||||
$http({
|
||||
url: 'processes/api/getProcessNames'
|
||||
}).then(setProcessNames, utilsService.onHttpError);
|
||||
}
|
||||
|
||||
function setProcessNames(response) {
|
||||
$scope.processes = response.data || [];
|
||||
}
|
||||
|
||||
function getSteps() {
|
||||
$scope.processSteps = [];
|
||||
const processSelected = $scope.processes.find(processData => {
|
||||
return processData.id === $scope.idSelectedProccess.id;
|
||||
});
|
||||
$scope.processName = processSelected.name;
|
||||
$scope.selectedCountry = processSelected.idCountry;
|
||||
$http({
|
||||
method: 'POST',
|
||||
data: $.param({
|
||||
idProcess: $scope.idSelectedProccess.id
|
||||
}),
|
||||
url: 'processes/api/getStepsForProcessSelected'
|
||||
}).then(setSteps, utilsService.onHttpError);
|
||||
}
|
||||
|
||||
function setSteps(response) {
|
||||
if (response.data) {
|
||||
$scope.availableSteps = response.data.steps || {};
|
||||
$scope.processSteps = response.data.processSteps|| [];
|
||||
}
|
||||
}
|
||||
|
||||
function resetProcessSelection() {
|
||||
$scope.idSelectedProccess = null;
|
||||
$scope.processSteps = [];
|
||||
}
|
||||
}
|
||||
})();
|
||||
@@ -0,0 +1,306 @@
|
||||
(function () {
|
||||
global.dashModule
|
||||
.directive('createProcessSteps', createProcessStepsDirective)
|
||||
.controller('createProcessStepsCtrl', ['$scope', '$http', '$', '$timeout', '$translate', 'utilsService', createProcessStepsCtrl]);
|
||||
|
||||
function createProcessStepsDirective() {
|
||||
return {
|
||||
restrict: 'E',
|
||||
templateUrl: 'processes/html/createProcessTemplate'
|
||||
};
|
||||
}
|
||||
|
||||
function createProcessStepsCtrl($scope, $http, $, $timeout, $translate, utilsService) {
|
||||
let idStepAdded;
|
||||
let isStepVisible = true;
|
||||
const messageTranslatePath = 'processes.messages.';
|
||||
$scope.packages = {};
|
||||
$scope.initProcessCreation = initProcessCreation;
|
||||
$scope.addProcessStep = addProcessStep;
|
||||
$scope.addProcess = addProcess;
|
||||
$scope.processListsTitle = getProcessTitleTranslation;
|
||||
$scope.shouldShowIcon = shouldShowIcon;
|
||||
$scope.isProcessFormValid = isProcessFormValid;
|
||||
$scope.getStepsForProcess = getStepsForProcess;
|
||||
$scope.getStepPadding = getStepPadding;
|
||||
$scope.getStepNumber = getStepNumber;
|
||||
$scope.selectedProcesses = [];
|
||||
$scope.isStepVisibleToCustomer = isStepVisibleToCustomer;
|
||||
$scope.setVisible = setVisible;
|
||||
$scope.isVisibleToCustomer = isVisibleToCustomer;
|
||||
$scope.processSteps = [];
|
||||
$scope.getExtraActionDescription = getExtraActionDescription;
|
||||
$scope.countries = [];
|
||||
$scope.selectedCountry = null;
|
||||
$scope.tinymceOptions = utilsService.getTynimceOptions();
|
||||
|
||||
function createOptions(stepPlace) {
|
||||
var options = {
|
||||
placeholder: 'create-processes-products-display',
|
||||
connectWith: '.processes-list',
|
||||
start: function () {
|
||||
if (stepPlace === 'available') {
|
||||
$('#create-processes-step-dragndrop-process').addClass('allowed-drop-zone');
|
||||
}
|
||||
},
|
||||
stop: function () {
|
||||
if (stepPlace === 'available') {
|
||||
$('#create-processes-step-dragndrop-process').removeClass('allowed-drop-zone');
|
||||
}
|
||||
}
|
||||
};
|
||||
return options;
|
||||
}
|
||||
|
||||
$scope.sortableOptionsList = {
|
||||
available: createOptions('available'),
|
||||
process: createOptions('process')
|
||||
};
|
||||
|
||||
function initProcessCreation(processSteps, onProcessCreated) {
|
||||
$scope.processSteps = processSteps || [];
|
||||
$scope.onProcessCreated = onProcessCreated;
|
||||
getCountries();
|
||||
displayProcessSteps(getStepsForProcess);
|
||||
}
|
||||
|
||||
function getCountries() {
|
||||
const params = $.param({
|
||||
getArray: true
|
||||
});
|
||||
$http({
|
||||
method: 'POST',
|
||||
data: params,
|
||||
url: 'countries/api/getAllCountries'
|
||||
}).then(setCountries, utilsService.onHttpError);
|
||||
}
|
||||
|
||||
function setCountries(response) {
|
||||
if (response.data) {
|
||||
$scope.countries = response.data;
|
||||
}
|
||||
}
|
||||
|
||||
function displayProcessSteps(successCallback) {
|
||||
$http({
|
||||
method: 'GET',
|
||||
url: 'processes/api/getProcessSteps'
|
||||
}).then(successCallback, utilsService.onHttpError);
|
||||
}
|
||||
|
||||
function getStepsForProcess(response) {
|
||||
if (!angular.equals(response.data, {})) {
|
||||
$scope.availableSteps = response.data.steps;
|
||||
if($scope.processSteps){
|
||||
$scope.availableSteps = $scope.availableSteps.filter((availableStep) => {
|
||||
return !$scope.processSteps.find((selectedStep) => {
|
||||
return selectedStep.id === availableStep.id;
|
||||
});
|
||||
});
|
||||
}
|
||||
getUserTypes();
|
||||
getExtraActionsAvailable();
|
||||
}
|
||||
}
|
||||
|
||||
function addProcessStep() {
|
||||
const params = $.param({
|
||||
shortDesc: $scope.processStepShortDesc,
|
||||
fullDesc: $scope.processStepFullDesc,
|
||||
idUserType: $scope.selectedUserTypeId,
|
||||
isStepVisible: isStepVisible ? 1 : 0,
|
||||
extraActionCode: $scope.selectedExtraAction || ''
|
||||
});
|
||||
|
||||
$http({
|
||||
method: 'POST',
|
||||
url: 'processes/api/addProcessStep',
|
||||
data: params
|
||||
}).then(addProcessStepConfirmation, utilsService.onHttpError);
|
||||
}
|
||||
|
||||
function addProcessStepConfirmation(response) {
|
||||
if (response.data.messageData) {
|
||||
const translationData = {
|
||||
stepName: $scope.processStepShortDesc
|
||||
};
|
||||
|
||||
response.data.messageData.forEach(messageInfo => {
|
||||
if (messageInfo.code === 'success') {
|
||||
idStepAdded = response.data.idInserted;
|
||||
$scope.$parent.processStepShortDesc = '';
|
||||
$scope.$parent.processStepFullDesc = '';
|
||||
isStepVisible = true;
|
||||
displayProcessSteps(updateProcessSteps);
|
||||
} else {
|
||||
if (messageInfo.type && messageInfo.limit) {
|
||||
translationData.type = messageInfo.type;
|
||||
translationData.limit = messageInfo.limit;
|
||||
}
|
||||
}
|
||||
const message = $translate.instant(messageTranslatePath + messageInfo.message, translationData);
|
||||
utilsService.displayMessage(messageInfo.code, message);
|
||||
});
|
||||
} else {
|
||||
throwServerError();
|
||||
}
|
||||
}
|
||||
|
||||
function updateProcessSteps(response) {
|
||||
if (response.data.steps.length) {
|
||||
const newStepAdded = response.data.steps.find(findAddedProcessStep);
|
||||
$scope.availableSteps.push(newStepAdded);
|
||||
$scope.availableSteps.sort(compareStepNames);
|
||||
}
|
||||
}
|
||||
|
||||
function findAddedProcessStep(stepData) {
|
||||
return parseInt(stepData.id) === idStepAdded;
|
||||
}
|
||||
|
||||
function addProcess() {
|
||||
if ($scope.processName && $scope.processSteps.length > 0) {
|
||||
const params = $.param({
|
||||
data: JSON.stringify($scope.processSteps),
|
||||
processName: $scope.processName,
|
||||
idCountry: $scope.selectedCountry
|
||||
});
|
||||
|
||||
$http({
|
||||
method: 'POST',
|
||||
url: 'processes/api/addProcess',
|
||||
data: params
|
||||
}).then(processConfirmationMessage, utilsService.onHttpError);
|
||||
} else {
|
||||
utilsService.displayMessage('error', $translate.instant(messageTranslatePath + 'PROCESS_DATA_MISSING'));
|
||||
}
|
||||
}
|
||||
|
||||
function processConfirmationMessage(response) {
|
||||
if (response.data.messageData) {
|
||||
const translationData = {
|
||||
processName: $scope.processName
|
||||
};
|
||||
response.data.messageData.forEach(messageInfo => {
|
||||
if (messageInfo.code === 'success') {
|
||||
$scope.processName = '';
|
||||
$scope.availableSteps = $scope.availableSteps.concat($scope.processSteps);
|
||||
$scope.availableSteps.sort(compareStepNames);
|
||||
$scope.processSteps = [];
|
||||
|
||||
if($scope.onProcessCreated){
|
||||
$scope.onProcessCreated();
|
||||
}
|
||||
} else {
|
||||
$('#create-processes-process-name').focus();
|
||||
if (messageInfo.type && messageInfo.limit) {
|
||||
translationData.type = messageInfo.type;
|
||||
translationData.limit = messageInfo.limit;
|
||||
}
|
||||
}
|
||||
const message = $translate.instant(messageTranslatePath + messageInfo.message, translationData);
|
||||
utilsService.displayMessage(messageInfo.code, message);
|
||||
});
|
||||
} else {
|
||||
throwServerError();
|
||||
}
|
||||
}
|
||||
|
||||
function shouldShowIcon(name) {
|
||||
return name === 'steps';
|
||||
}
|
||||
|
||||
function getProcessTitleTranslation(name) {
|
||||
return 'processes.labels.' + name.toUpperCase();
|
||||
}
|
||||
|
||||
function getUserTypes() {
|
||||
$http({
|
||||
method: 'GET',
|
||||
url: 'processes/api/getUserTypes',
|
||||
}).then(setUserTypes, utilsService.onHttpError);
|
||||
}
|
||||
|
||||
function setUserTypes(response) {
|
||||
if (response.data.length) {
|
||||
response.data.forEach(userType => {
|
||||
userType.type = userType.type.charAt(0).toUpperCase() + userType.type.slice(1);
|
||||
userType.type = userType.type.replace('_', ' ');
|
||||
});
|
||||
$scope.userTypes = response.data;
|
||||
}
|
||||
}
|
||||
|
||||
function getExtraActionsAvailable() {
|
||||
$http({
|
||||
method: 'POST',
|
||||
url: 'processes/api/getExtraActionsAvailable',
|
||||
}).then(setExtraActionsAvailable, utilsService.onHttpError);
|
||||
}
|
||||
|
||||
function setExtraActionsAvailable(response) {
|
||||
if (response.data.length) {
|
||||
response.data.forEach(extraAction => {
|
||||
extraAction.name = extraAction.actionCode.charAt(0).toUpperCase() + extraAction.actionCode.slice(1);
|
||||
extraAction.name = extraAction.name.replace('-', ' ');
|
||||
});
|
||||
$scope.extraActions = response.data;
|
||||
}
|
||||
}
|
||||
|
||||
function isProcessFormValid() {
|
||||
return $scope.processName && $scope.processSteps.length > 0;
|
||||
}
|
||||
|
||||
function getStepPadding(position) {
|
||||
return (position + 1) * 2;
|
||||
}
|
||||
|
||||
function getStepNumber(position) {
|
||||
$scope.processSteps[position].stepNumber = position + 1;
|
||||
return position + 1;
|
||||
}
|
||||
|
||||
function throwServerError() {
|
||||
const errorMessage = $translate.instant('processes.messages.SERVER_ERROR');
|
||||
utilsService.displayMessage('error', errorMessage);
|
||||
}
|
||||
|
||||
function isStepVisibleToCustomer() {
|
||||
return isStepVisible ? 'glyphicon-eye-open' : 'glyphicon-eye-close';
|
||||
}
|
||||
|
||||
function setVisible() {
|
||||
isStepVisible = !isStepVisible;
|
||||
}
|
||||
|
||||
function isVisibleToCustomer(stepVisibleInfo) {
|
||||
return stepVisibleInfo === '1' ? 'glyphicon-eye-open' : 'glyphicon-eye-close';
|
||||
}
|
||||
|
||||
function getExtraActionDescription() {
|
||||
const selectedActionObj = $scope.extraActions.filter((action) => {
|
||||
return action.idActionCode === $scope.selectedExtraAction;
|
||||
});
|
||||
|
||||
if (selectedActionObj.length) {
|
||||
const translatedName = selectedActionObj[0].actionCode.replace('-', '_');
|
||||
return $translate.instant('processes.messages.' + translatedName);
|
||||
}
|
||||
|
||||
return '';
|
||||
}
|
||||
|
||||
function compareStepNames(stepA, stepB) {
|
||||
if (stepA.shortDesc < stepB.shortDesc) {
|
||||
return -1;
|
||||
}
|
||||
|
||||
if (stepA.shortDesc > stepB.shortDesc) {
|
||||
return 1;
|
||||
}
|
||||
|
||||
return 0;
|
||||
}
|
||||
}
|
||||
})();
|
||||
@@ -0,0 +1,246 @@
|
||||
(function () {
|
||||
global.dashModule
|
||||
.directive('editProcesses', editProcessesDirective)
|
||||
.controller('editProcessesCtrl', ['$scope', '$http', '$', '$timeout', '$translate', 'utilsService', editProcessesCtrl]);
|
||||
|
||||
function editProcessesDirective() {
|
||||
return {
|
||||
restrict: 'E',
|
||||
templateUrl: 'processes/html/editProcessesTemplate'
|
||||
};
|
||||
}
|
||||
|
||||
function editProcessesCtrl($scope, $http, $, $timeout, $translate, utilsService) {
|
||||
let processStepsHeight;
|
||||
let availableStepDragged = {};
|
||||
let processStepDragged = {};
|
||||
$scope.initPRocessEdit = initPRocessEdit;
|
||||
$scope.getSteps = getSteps;
|
||||
$scope.isProcessSelected = isProcessSelected;
|
||||
$scope.getStepPadding = getStepPadding;
|
||||
$scope.startDragFromAvailableSteps = startDragFromAvailableSteps;
|
||||
$scope.endDragFromAvailableSteps = endDragFromAvailableSteps;
|
||||
$scope.availableStepDropped = availableStepDropped;
|
||||
$scope.startDragFromProcessSteps = startDragFromProcessSteps;
|
||||
$scope.endDragFromProcessSteps = endDragFromProcessSteps;
|
||||
$scope.processStepDropped = processStepDropped;
|
||||
$scope.editProcess = editProcess;
|
||||
$scope.setProcessAfterEdit = setProcessAfterEdit;
|
||||
$scope.resetProducts = resetProducts;
|
||||
$scope.isVisibleToCustomer = isVisibleToCustomer;
|
||||
|
||||
function isVisibleToCustomer(stepVisibleInfo) {
|
||||
return stepVisibleInfo === '1' ? 'glyphicon-eye-open' : 'glyphicon-eye-close';
|
||||
}
|
||||
|
||||
function initPRocessEdit(){
|
||||
getProcessNames();
|
||||
getCountries();
|
||||
}
|
||||
|
||||
function getProcessNames(isAfterEdit = false) {
|
||||
$http({
|
||||
methos: 'POST',
|
||||
url: 'processes/api/getProcessNames'
|
||||
}).then((response) => {setProcessNames(response, isAfterEdit);}, utilsService.onHttpError);
|
||||
}
|
||||
|
||||
function setProcessNames(response, isAfterEdit) {
|
||||
$scope.processes = response.data ? response.data : [];
|
||||
if(isAfterEdit){
|
||||
setProcessAfterEdit();
|
||||
}
|
||||
}
|
||||
|
||||
function getCountries() {
|
||||
const params = $.param({
|
||||
getArray: true
|
||||
});
|
||||
$http({
|
||||
method: 'POST',
|
||||
data: params,
|
||||
url: 'countries/api/getAllCountries'
|
||||
}).then(setCountries, utilsService.onHttpError);
|
||||
}
|
||||
|
||||
function setCountries(response){
|
||||
if(response.data){
|
||||
$scope.countries = response.data;
|
||||
}
|
||||
}
|
||||
|
||||
function getSteps() {
|
||||
const processSelected = $scope.processes.find(processData => {
|
||||
return processData.id === $scope.idSelectedProccess.id;
|
||||
});
|
||||
$scope.processName = processSelected.name;
|
||||
$scope.selectedCountry = processSelected.idCountry;
|
||||
$http({
|
||||
method: 'POST',
|
||||
data: $.param({
|
||||
idProcess: $scope.idSelectedProccess.id
|
||||
}),
|
||||
url: 'processes/api/getStepsForProcessSelected'
|
||||
}).then(setSteps, utilsService.onHttpError);
|
||||
}
|
||||
|
||||
function setSteps(response) {
|
||||
if (response.data) {
|
||||
$scope.availableSteps = response.data.steps ? response.data.steps : {};
|
||||
$scope.processSteps = response.data.processSteps ? response.data.processSteps : [];
|
||||
}
|
||||
|
||||
processStepsHeight = $('#process-steps-list').height();
|
||||
$('.available-steps-list').css({
|
||||
height: processStepsHeight
|
||||
});
|
||||
}
|
||||
|
||||
function isProcessSelected() {
|
||||
return $scope.idSelectedProccess && $scope.idSelectedProccess.id ? $scope.idSelectedProccess.id : $scope.idSelectedProccess;
|
||||
}
|
||||
|
||||
function getStepPadding(position) {
|
||||
return (position + 1) * 2;
|
||||
}
|
||||
|
||||
function startDragFromAvailableSteps(event, ui, idStepDragged) {
|
||||
$('#available-steps-list').css({
|
||||
height: '400px',
|
||||
overflow: 'visible'
|
||||
});
|
||||
|
||||
$('#process-steps-list').addClass('allowed-drop-zone');
|
||||
availableStepDragged = {
|
||||
idStep: idStepDragged,
|
||||
shortDesc: $scope.availableSteps[idStepDragged].shortDesc,
|
||||
isVisibleForCustomer: $scope.availableSteps[idStepDragged].isVisibleForCustomer
|
||||
};
|
||||
}
|
||||
|
||||
function endDragFromAvailableSteps() {
|
||||
$('#available-steps-list').css({
|
||||
height: processStepsHeight,
|
||||
'overflow-y': 'scroll'
|
||||
});
|
||||
|
||||
$('#process-steps-list').removeClass('allowed-drop-zone');
|
||||
}
|
||||
|
||||
function availableStepDropped(event, ui) {
|
||||
let isStepMoved = false;
|
||||
if (Object.keys(availableStepDragged).length === 0) {
|
||||
processStepDragged = JSON.parse($(ui.helper).attr('step-info'));
|
||||
if (typeof processStepDragged === 'object') {
|
||||
isStepMoved = $scope.processSteps.some(processStep => {
|
||||
return processStep.idStep === processStepDragged.idStep;
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
if (!isStepMoved) {
|
||||
$scope.processSteps.push(availableStepDragged);
|
||||
delete $scope.availableSteps[availableStepDragged.idStep];
|
||||
availableStepDragged = {};
|
||||
}
|
||||
|
||||
$(ui.helper).css({
|
||||
position: 'relative',
|
||||
left: 0,
|
||||
top: 0
|
||||
});
|
||||
}
|
||||
|
||||
function startDragFromProcessSteps(event, ui) {
|
||||
$('#process-steps-list').css({
|
||||
height: '400px',
|
||||
overflow: 'visible'
|
||||
});
|
||||
|
||||
$('#available-steps-list').addClass('allowed-drop-zone');
|
||||
$('#process-steps-list').addClass('allowed-drop-zone');
|
||||
processStepDragged = JSON.parse($(ui.helper).attr('step-info'));
|
||||
}
|
||||
|
||||
function endDragFromProcessSteps() {
|
||||
processStepsHeight = $('#process-steps-list').height();
|
||||
$('#process-steps-list').css({
|
||||
height: processStepsHeight,
|
||||
'overflow-y': 'scroll'
|
||||
});
|
||||
|
||||
$('#available-steps-list').removeClass('allowed-drop-zone');
|
||||
$('#process-steps-list').removeClass('allowed-drop-zone');
|
||||
$timeout(function () {
|
||||
$('.rearrange-steps').sortable('refreshPositions');
|
||||
});
|
||||
}
|
||||
|
||||
function processStepDropped(event, ui) {
|
||||
if (typeof processStepDragged.idStep !== 'undefined') {
|
||||
$scope.availableSteps[processStepDragged.idStep] = processStepDragged;
|
||||
$scope.processSteps = $scope.processSteps.filter(removeDroppedStep);
|
||||
}
|
||||
|
||||
processStepDragged = {};
|
||||
|
||||
$(ui.helper).css({
|
||||
position: 'relative',
|
||||
left: 0,
|
||||
top: 0
|
||||
});
|
||||
}
|
||||
|
||||
function removeDroppedStep(processStep) {
|
||||
return processStep.idStep !== processStepDragged.idStep;
|
||||
}
|
||||
|
||||
function editProcess() {
|
||||
if ($scope.processSteps.length !== 0) {
|
||||
$http({
|
||||
method: 'POST',
|
||||
url: 'processes/api/editProcess',
|
||||
data: $.param({
|
||||
idProcess: $scope.idSelectedProccess.id,
|
||||
data: {
|
||||
processName: $scope.processName,
|
||||
idCountry: $scope.selectedCountry,
|
||||
processSteps: $scope.processSteps
|
||||
}
|
||||
})
|
||||
}).then(displayEditMessage, utilsService.onHttpError);
|
||||
} else {
|
||||
const message = $translate.instant('processes.messages.NO_STEPS');
|
||||
utilsService.displayMessage('error', message);
|
||||
}
|
||||
}
|
||||
|
||||
function displayEditMessage(response) {
|
||||
if (response.data.hasOwnProperty('messageData') && response.data.messageData.length > 0) {
|
||||
response.data.messageData.forEach(messageData => {
|
||||
const message = $translate.instant('processes.messages.' + messageData.message);
|
||||
utilsService.displayMessage(messageData.code, message);
|
||||
|
||||
if (messageData.code === 'success') {
|
||||
getProcessNames(true);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function setProcessAfterEdit(idProcessUpdated = 0) {
|
||||
if (idProcessUpdated) {
|
||||
$scope.idSelectedProccess = {
|
||||
id: idProcessUpdated
|
||||
};
|
||||
getSteps();
|
||||
}
|
||||
}
|
||||
|
||||
function resetProducts() {
|
||||
getSteps();
|
||||
const message = $translate.instant('processes.messages.RESET_PROCESS');
|
||||
utilsService.displayMessage('success', message);
|
||||
}
|
||||
}
|
||||
})();
|
||||
@@ -0,0 +1,185 @@
|
||||
(function () {
|
||||
global.dashModule
|
||||
.directive('linkProcess', linkProcessDirective)
|
||||
.controller('linkProcessCtrl', ['$scope', '$http', '$', '$timeout', '$translate', 'utilsService', linkProcessCtrl]);
|
||||
|
||||
function linkProcessDirective() {
|
||||
return {
|
||||
restrict: 'E',
|
||||
templateUrl: 'processes/html/linkProcessTemplate'
|
||||
};
|
||||
}
|
||||
|
||||
function linkProcessCtrl($scope, $http, $, $timeout, $translate, utilsService) {
|
||||
$scope.packages = {};
|
||||
$scope.getPackages = getPackages;
|
||||
$scope.isPackageSelected = isPackageSelected;
|
||||
$scope.getCountries = getCountries;
|
||||
$scope.isCountrySelected = isCountrySelected;
|
||||
$scope.getProcesses = getProcesses;
|
||||
$scope.processDragStart = processDragStart;
|
||||
$scope.processDragStop = processDragStop;
|
||||
$scope.prcessDrop = prcessDrop;
|
||||
$scope.linkProcesses = linkProcesses;
|
||||
$scope.isNewStepFormVisible = isNewStepFormVisible;
|
||||
$scope.enableAddNewProcess = enableAddNewProcess;
|
||||
$scope.showProcessInfo = showProcessInfo;
|
||||
$scope.isVisibleToCustomer = isVisibleToCustomer;
|
||||
$scope.addingNewStep = false;
|
||||
$scope.processes = [];
|
||||
$scope.selectedProcesses = [];
|
||||
$scope.selectedSteps = {
|
||||
steps: [],
|
||||
processName: ''
|
||||
};
|
||||
|
||||
function isVisibleToCustomer(stepVisibleInfo) {
|
||||
return stepVisibleInfo === '1' ? 'glyphicon-eye-open' : 'glyphicon-eye-close';
|
||||
}
|
||||
|
||||
function processDragStart(event, ui) {
|
||||
const containerSelector = $(ui.helper).hasClass('available-process') ? '#available-processes' : '#selected-processes';
|
||||
const dropSelector = containerSelector === '#selected-processes' ? '#available-processes' : '#selected-processes';
|
||||
$(containerSelector).css({
|
||||
height: 'auto',
|
||||
overflow: 'visible',
|
||||
});
|
||||
|
||||
$(dropSelector).css({
|
||||
border: '2px dashed #000',
|
||||
background: 'rgba(223, 240, 216, 0.5)'
|
||||
});
|
||||
}
|
||||
|
||||
function processDragStop(event, ui) {
|
||||
const containerSelector = $(ui.helper).hasClass('available-process') ? '#available-processes' : '#selected-processes';
|
||||
const dropSelector = containerSelector === '#selected-processes' ? '#available-processes' : '#selected-processes';
|
||||
$(containerSelector).css({
|
||||
height: '360px',
|
||||
'overflow-y': 'scroll',
|
||||
'overflow-x': 'hidden',
|
||||
});
|
||||
|
||||
$(dropSelector).css({
|
||||
border: '2px solid #000',
|
||||
background: 'none'
|
||||
});
|
||||
}
|
||||
|
||||
function prcessDrop(event, ui) {
|
||||
const processKey = $(ui.helper).attr('process-key');
|
||||
if ($(ui.helper).hasClass('available-process')) {
|
||||
$scope.selectedProcesses.push($scope.processes[processKey]);
|
||||
$scope.processes.splice(processKey, 1);
|
||||
$scope.selectedProcesses.sort(utilsService.sortByAttributeName('processName'));
|
||||
} else {
|
||||
$scope.processes.push($scope.selectedProcesses[processKey]);
|
||||
$scope.selectedProcesses.splice(processKey, 1);
|
||||
$scope.processes.sort(utilsService.sortByAttributeName('processName'));
|
||||
}
|
||||
}
|
||||
|
||||
function linkProcesses() {
|
||||
const params = $.param({
|
||||
idPackage: $scope.selectedPackageId,
|
||||
selectedProcesses: JSON.stringify($scope.selectedProcesses)
|
||||
});
|
||||
|
||||
$http({
|
||||
method: 'POST',
|
||||
url: 'processes/api/linkProcessesToPackage',
|
||||
data: params
|
||||
}).then(showUpdateMessage, utilsService.onHttpError);
|
||||
}
|
||||
|
||||
function showUpdateMessage(response) {
|
||||
if (typeof response.data.messages !== 'undefined') {
|
||||
response.data.messages.forEach((messageObj) => {
|
||||
let translatedMessage = $translate.instant('processes.messages.' + messageObj.message);
|
||||
utilsService.displayMessage(messageObj.code, translatedMessage);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function getPackages() {
|
||||
const params = $.param({
|
||||
idCountry: $scope.selectedCountryId
|
||||
});
|
||||
$http({
|
||||
method: 'POST',
|
||||
url: 'processes/api/getPackagesAndProcesses',
|
||||
data: params
|
||||
}).then(setPackages, utilsService.onHttpError);
|
||||
}
|
||||
|
||||
function getProcesses() {
|
||||
if ($scope.selectedPackageId) {
|
||||
const params = $.param({
|
||||
idPackage: $scope.selectedPackageId
|
||||
});
|
||||
$http({
|
||||
method: 'POST',
|
||||
url: 'processes/api/getProcesses',
|
||||
data: params
|
||||
}).then(setProcesses, utilsService.onHttpError);
|
||||
}
|
||||
}
|
||||
|
||||
function setProcesses(response) {
|
||||
if (typeof response.data.processes !== 'undefined' && typeof response.data.steps !== 'undefined') {
|
||||
$scope.steps = response.data.steps;
|
||||
$scope.selectedProcesses = [];
|
||||
$scope.processes = [];
|
||||
response.data.processes.forEach(process => {
|
||||
if (process.isSelected === '1') {
|
||||
$scope.selectedProcesses.push(process);
|
||||
} else {
|
||||
$scope.processes.push(process);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function setPackages(response) {
|
||||
if (response.data.length) {
|
||||
$scope.packages = {};
|
||||
response.data.forEach(packageItem => {
|
||||
$scope.packages[packageItem.idPackage] = packageItem.packageName;
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function isPackageSelected() {
|
||||
return typeof $scope.selectedPackageId !== 'undefined' && $scope.selectedPackageId !== null;
|
||||
}
|
||||
|
||||
function getCountries() {
|
||||
$http({
|
||||
method: 'GET',
|
||||
url: 'countries/api/getAllCountries'
|
||||
}).then(setCountries, utilsService.onHttpError);
|
||||
}
|
||||
|
||||
function setCountries(response) {
|
||||
$scope.countries = response.data;
|
||||
}
|
||||
|
||||
function isCountrySelected() {
|
||||
return typeof $scope.selectedCountryId !== 'undefined' && $scope.selectedCountryId !== 0;
|
||||
}
|
||||
|
||||
function isNewStepFormVisible() {
|
||||
return $scope.addingNewStep;
|
||||
}
|
||||
|
||||
function enableAddNewProcess() {
|
||||
$scope.addingNewStep = !$scope.addingNewStep;
|
||||
}
|
||||
|
||||
function showProcessInfo(process) {
|
||||
$('#info-placeholder').hide();
|
||||
$scope.selectedSteps.processName = process.processName;
|
||||
$scope.selectedSteps.steps = $scope.steps[process.idProcess];
|
||||
}
|
||||
}
|
||||
})();
|
||||
@@ -0,0 +1,38 @@
|
||||
(function () {
|
||||
global.dashModule
|
||||
.controller('processesController', ['$scope', processesController])
|
||||
.directive('processes', [processesDirective]);
|
||||
|
||||
function processesDirective() {
|
||||
return {
|
||||
restrict: 'E',
|
||||
templateUrl: 'processes/html/processesTemplate'
|
||||
};
|
||||
}
|
||||
|
||||
function processesController($scope) {
|
||||
$scope.subModule = global.getParameterByName('subModule') || 'viewPackageProcesses';
|
||||
$scope.setSubModule = setSubModule;
|
||||
$scope.isSubmoduleVisible = isSubmoduleVisible;
|
||||
addUrlListener();
|
||||
|
||||
function addUrlListener() {
|
||||
window.addEventListener('popstate', function (e) {
|
||||
$scope.$evalAsync($scope => {
|
||||
$scope.subModule = e.state ? e.state.subModule : 'viewPackageProcesses';
|
||||
});
|
||||
}, false);
|
||||
}
|
||||
|
||||
function setSubModule($event) {
|
||||
$scope.subModule = $event.currentTarget.attributes.subModule.value;
|
||||
history.pushState({
|
||||
subModule: $scope.subModule
|
||||
}, null, '?subModule=' + $scope.subModule);
|
||||
}
|
||||
|
||||
function isSubmoduleVisible(subModule) {
|
||||
return subModule === $scope.subModule;
|
||||
}
|
||||
}
|
||||
})();
|
||||
219
api-wiaas/client/js/components/processes/processes.less
Normal file
219
api-wiaas/client/js/components/processes/processes.less
Normal file
@@ -0,0 +1,219 @@
|
||||
@eye-open-color: #2184be;
|
||||
@eye-close-color: #C11B17;
|
||||
@layer-background: rgba(255, 255, 255, 0.7);
|
||||
|
||||
.module-layer {
|
||||
position: relative;
|
||||
margin-top: 1%;
|
||||
background: @layer-background;
|
||||
margin-bottom: 3%;
|
||||
padding-bottom: 2%;
|
||||
}
|
||||
|
||||
#create-process-steps {
|
||||
width: 100%;
|
||||
padding: 1%;
|
||||
margin-bottom: 2%;
|
||||
|
||||
.create-process-title {
|
||||
margin-bottom: 1%;
|
||||
font-weight: bold;
|
||||
font-size: 120%;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.processes-list {
|
||||
background: #FFF;
|
||||
height: 360px;
|
||||
min-height: 360px;
|
||||
overflow-y: scroll;
|
||||
border: 1px solid #000;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.glyphicon-eye-open {
|
||||
color: @eye-open-color;
|
||||
font-size: 120%;
|
||||
}
|
||||
|
||||
.glyphicon-eye-close {
|
||||
color: @eye-close-color;
|
||||
font-size: 120%;
|
||||
}
|
||||
|
||||
.step-extra-action-radios {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.draggable-icon-steps {
|
||||
color: #3c763d;
|
||||
top: 50%;
|
||||
font-size: 200%;
|
||||
text-align: center;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.create-process-name-input, .create-process-country-select{
|
||||
height: 3rem;
|
||||
}
|
||||
|
||||
.add-process-steps {
|
||||
display: inline-block;
|
||||
margin-top: 1%;
|
||||
border-top: 2px solid #3bb9ff;
|
||||
border-bottom: 2px solid #3bb9ff;
|
||||
padding: 2%;
|
||||
background: rgba(59, 185, 255, 0.1);
|
||||
|
||||
.create-processes-description {
|
||||
display: inline-block;
|
||||
margin-top: 2%;
|
||||
width: 98%;
|
||||
|
||||
.package-label {
|
||||
width: 30%;
|
||||
}
|
||||
|
||||
.create-package-description-text {
|
||||
width: 70%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#edit-process-button {
|
||||
margin: 2%;
|
||||
}
|
||||
|
||||
#edit-processes-container {
|
||||
margin-left: 1%;
|
||||
}
|
||||
|
||||
#edit-process-and-steps-container {
|
||||
height: 400px;
|
||||
margin-bottom: 2%;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
|
||||
.draggable-icon {
|
||||
color: #3c763d;
|
||||
left: 28.5%;
|
||||
top: 50%;
|
||||
font-size: 200%;
|
||||
text-align: center;
|
||||
position: absolute;
|
||||
}
|
||||
}
|
||||
|
||||
#edit-processes {
|
||||
.module-layer;
|
||||
|
||||
.glyphicon-eye-open {
|
||||
color: @eye-open-color;
|
||||
}
|
||||
|
||||
.glyphicon-eye-close {
|
||||
color: @eye-close-color;
|
||||
}
|
||||
|
||||
.edit-processes-lists {
|
||||
display: inline-block;
|
||||
width: 95%;
|
||||
border: 1px solid #000;
|
||||
border-radius: 5px;
|
||||
height: 400px;
|
||||
overflow-y: scroll;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
#link-process-steps {
|
||||
.module-layer;
|
||||
|
||||
.glyphicon-eye-open {
|
||||
color: @eye-open-color;
|
||||
}
|
||||
|
||||
.glyphicon-eye-close {
|
||||
color: @eye-close-color;
|
||||
}
|
||||
|
||||
.processes-list {
|
||||
background: #FFF;
|
||||
height: 360px;
|
||||
min-height: 360px;
|
||||
overflow-y: scroll;
|
||||
border: 1px solid #000;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.process-selection-layer {
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 360px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.headers-col {
|
||||
margin-top: 1%;
|
||||
margin-bottom: 1%;
|
||||
vertical-align: top;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.process-draggable {
|
||||
padding: 7px 5px;
|
||||
cursor: pointer;
|
||||
border: 1px solid #ddd;
|
||||
font-weight: bold;
|
||||
padding-left: 2%;
|
||||
}
|
||||
|
||||
.process-draggable:hover {
|
||||
background: rgba(223, 240, 216, 0.5);
|
||||
}
|
||||
|
||||
.info-placeholder {
|
||||
color: rgba(124, 128, 130, 0.7);
|
||||
padding: 5%;
|
||||
}
|
||||
|
||||
.info-step {
|
||||
border: 1px solid #ddd;
|
||||
}
|
||||
|
||||
.step-position {
|
||||
display: inline-block;
|
||||
width: 10%;
|
||||
font-weight: bold;
|
||||
vertical-align: middle;
|
||||
background: rgba(59, 185, 255, 0.5);
|
||||
border-right: 2px solid rgb(59, 185, 255);
|
||||
padding: 5px 0 5px 5px;
|
||||
}
|
||||
|
||||
.step-description {
|
||||
display: inline-block;
|
||||
width: 85%;
|
||||
padding: 5px 3px;
|
||||
}
|
||||
|
||||
.link-processes-button {
|
||||
margin-top: 1%;
|
||||
margin-bottom: 3%;
|
||||
}
|
||||
|
||||
.draggable-icon {
|
||||
color: #3c763d;
|
||||
left: 31%;
|
||||
top: 50%;
|
||||
font-size: 200%;
|
||||
text-align: center;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.add-new-process{
|
||||
margin: 1% 0;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,76 @@
|
||||
(function () {
|
||||
global.dashModule
|
||||
.directive('viewPackageProcesses', viewPackageProcessesDirective)
|
||||
.controller('viewPackageProcessesController', ['$scope', '$http', '$translate', '$', 'utilsService', viewPackageProcessesCtrl]);
|
||||
|
||||
function viewPackageProcessesDirective() {
|
||||
return {
|
||||
restrict: 'E',
|
||||
templateUrl: 'processes/html/viewPackageProcessesTemplate'
|
||||
};
|
||||
}
|
||||
|
||||
function viewPackageProcessesCtrl($scope, $http, $translate, $, utilsService) {
|
||||
$scope.getAvailableProcesses = getAvailableProcesses;
|
||||
$scope.listAvailableProcesses = listAvailableProcesses;
|
||||
$scope.searchProcess = searchProcess;
|
||||
$scope.isVisibleForCustomer = isVisibleForCustomer;
|
||||
$scope.countries = [];
|
||||
|
||||
function getAvailableProcesses() {
|
||||
$http({
|
||||
method: 'GET',
|
||||
url: 'processes/api/getProcessInfo'
|
||||
}).then(setProcessData, utilsService.onHttpError);
|
||||
}
|
||||
|
||||
function setProcessData(response) {
|
||||
$scope.countries = response.data;
|
||||
}
|
||||
|
||||
function isVisibleForCustomer(visibleForCustomer){
|
||||
return visibleForCustomer === '1' ? 'glyphicon-eye-open' : 'glyphicon-eye-close';
|
||||
}
|
||||
|
||||
function listAvailableProcesses() {
|
||||
$scope.searchProcessValue = '';
|
||||
getAvailableProcesses();
|
||||
utilsService.displayMessage('success', $translate.instant('processes.messages.LIST_ALL_PROCESSES'));
|
||||
}
|
||||
|
||||
function searchProcess() {
|
||||
const params = $.param({
|
||||
name: $scope.searchProcessValue
|
||||
});
|
||||
|
||||
$http({
|
||||
method: 'POST',
|
||||
url: 'processes/api/searchProcess',
|
||||
data: params
|
||||
}).then(getSearchedProcess, utilsService.onHttpError);
|
||||
}
|
||||
|
||||
function getSearchedProcess(response) {
|
||||
if (response.data.messageData) {
|
||||
let translationDataMessages = '';
|
||||
if (response.data.messageData.status === 'success') {
|
||||
let processesFound = 0;
|
||||
$.each(response.data.data, (key, country) => {
|
||||
processesFound += Object.keys(country.processes).length;
|
||||
});
|
||||
translationDataMessages = {
|
||||
processesFound
|
||||
};
|
||||
$scope.countries = response.data.data;
|
||||
} else {
|
||||
$scope.countries = [];
|
||||
}
|
||||
|
||||
const message = $translate.instant('processes.messages.' + response.data.messageData.message, translationDataMessages);
|
||||
utilsService.displayMessage(response.data.messageData.status, message);
|
||||
} else {
|
||||
utilsService.displayMessage('error', $translate.instant('processes.messages.SERVER_ERROR'));
|
||||
}
|
||||
}
|
||||
}
|
||||
})();
|
||||
Reference in New Issue
Block a user