Commit 76b82545 authored by D’jalmar Gutierrez Titirico's avatar D’jalmar Gutierrez Titirico 🚲
Browse files

se agrego la opcion de modificar el orden del organigrama

parent de1fea12
......@@ -228,9 +228,9 @@ input[type=checkbox].with-font:checked ~ label:before {
@import 'tiposEntidad/tiposEntidad.scss';
@import '../components/footer/footer.scss';
@import '../components/modal/modal.scss';
@import '../components/organigrama/framework/angular-treant-js/Treant.scss';
@import '../components/organigrama/framework/angular-treant-js/collapsable.scss';
@import '../components/organigrama/framework/angular-treant-js/custom-colored.scss';
@import '../components/organigrama/framework/angular-treant-js/vendor/perfect-scrollbar/perfect-scrollbar.scss';
@import '../components/organigrama/framework/jquery.orgchart.scss';
@import '../components/organigrama/framework/treant-js/Treant.scss';
@import '../components/organigrama/framework/treant-js/collapsable.scss';
@import '../components/organigrama/framework/treant-js/custom-colored.scss';
@import '../components/organigrama/framework/treant-js/vendor/perfect-scrollbar/perfect-scrollbar.scss';
// endinjector
......@@ -34,6 +34,11 @@
tiposCargo: {
method: 'GET',
url: appConfig.serverAddress + '/api/entidades/:id/tiposCargo'
},
ordenarUnidades: {
method: 'PUT',
isArray: true,
url: appConfig.serverAddress + '/api/entidades/:id/ordenarUnidades'
}
})
}
......@@ -48,7 +53,7 @@
return this.resource.get(parametros).$promise;
}
getOrganigrama(id) {
organigrama(id) {
return this.resource.organigrama({id: id}).$promise;
}
......@@ -82,6 +87,10 @@
return this.resource.tiposCargo({id: id}).$promise;
}
ordenarUnidades(id, parametros) {
return this.resource.ordenarUnidades({id: id}, parametros).$promise;
}
}
angular.module('moduloPersonalApp')
......
......@@ -12,15 +12,31 @@
</div>
</div>
<!--<div class="container-fluid">-->
<!--<div class="row">-->
<!--<div id="chart" class="orgchart-primary">-->
<!--</div>-->
<!--</div>-->
<!--<div class="row">-->
<!--<div id="chart" class="orgchart-primary">-->
<!--</div>-->
<!--</div>-->
<!--</div>-->
<!--<br>-->
<div class="container-fluid">
<div class="row">
<div class="chart" id="collapsable-example"></div>
</div>
</div>
</div>
<div class="row">
<button class="btn btn-primary-outline" ng-click="vm.borrar()">Borrar</button>
</div>
<div class="row">
<span uib-dropdown on-toggle="toggled(open)">
<a href id="simple-dropdown" uib-dropdown-toggle>
<span class="caret"></span>
</a>
<ul class="dropdown-menu" uib-dropdown-menu aria-labelledby="simple-dropdown">
<li>
asdasd
</li>
<li>asdasd</li>
</ul>
</span>
</div>
</div>
......@@ -40,8 +40,6 @@
});
}
}
}
angular.module('moduloPersonalApp')
.controller('UnidadOrganizacionalEditarModalCtrl', UnidadOrganizacionalEditarModalController);
......
......@@ -5,7 +5,12 @@
constructor($resource, appConfig) {
this.resource = $resource(appConfig.serverAddress + '/api/unidadesOrganizacional/:id', {id: '@_id'}, {
update: {method: 'PUT'},
query: {isArray: false}
query: {isArray: false},
ordenarCargos: {
method: 'PUT',
isArray: true,
url: appConfig.serverAddress + '/api/unidadesOrganizacional/:id/ordenarCargos'
}
});
}
......@@ -23,9 +28,12 @@
}
editarUnidad(id, unidad) {
console.log(id);
return this.resource.update({id: id}, unidad).$promise;
}
ordenarCargos(id, parametros) {
return this.resource.ordenarCargos({id: id}, parametros).$promise;
}
}
angular.module('moduloPersonalApp')
......
/* required LIB STYLES */
/* .Treant se automatski dodaje na svaki chart conatiner */
.Treant {
position: relative;
overflow: hidden;
padding: 0 !important;
}
.Treant > .node,
.Treant > .pseudo {
position: absolute;
display: block;
visibility: hidden;
}
.Treant.Treant-loaded .node,
.Treant.Treant-loaded .pseudo {
visibility: visible;
}
.Treant > .pseudo {
width: 0;
height: 0;
border: none;
padding: 0;
}
.Treant .collapse-switch {
width: 3px;
height: 3px;
display: block;
border: 1px solid $brand-primary;
position: absolute;
top: 1px;
right: 1px;
cursor: pointer;
}
.Treant .collapsed .collapse-switch {
background-color: #868DEE;
}
.Treant > .node img {
border: none;
float: left;
}
// import {UTIL} from '../utils/Util';
//
// class NodeDB {
// constructor(nodeStructure, tree) {
// this.db = [];
// var self = this;
//
// function itterateChildren(node, parentId) {
//
// var newNode = self.createNode(node, parentId, tree, null);
//
// if (node.children) {
//
// newNode.children = [];
//
// // pseudo node is used for descending children to the next level
// if (node.childrenDropLevel && node.childrenDropLevel > 0) {
// while (node.childrenDropLevel--) {
// // pseudo node needs to inherit the connection style from its parent for continuous connectors
// var connStyle = UTIL.cloneObj(newNode.connStyle);
// newNode = self.createNode('pseudo', newNode.id, tree, null);
// newNode.connStyle = connStyle;
// newNode.children = [];
// }
// }
//
// var stack = (node.stackChildren && !self.hasGrandChildren(node)) ? newNode.id : null;
//
// // svildren are position on separate leves, one beneeth the other
// if (stack !== null) {
// newNode.stackChildren = [];
// }
//
// for (var i = 0, len = node.children.length; i < len; i++) {
//
// if (stack !== null) {
// newNode = self.createNode(node.children[i], newNode.id, tree, stack);
// if ((i + 1) < len) newNode.children = []; // last node cant have children
// } else {
// itterateChildren(node.children[i], newNode.id);
// }
// }
// }
// }
//
// if (tree.CONFIG.animateOnInit) nodeStructure.collapsed = true;
// itterateChildren(nodeStructure, -1); // root node
// this.createGeometries(tree);
// }
//
// createGeometries(tree) {
// var i = this.db.length, node;
// while (i--) {
// this.get(i).createGeometry(tree);
// }
// }
//
// get(nodeId) {
// return this.db[nodeId]; // get node by ID
// }
//
// createNode(nodeStructure, parentId, tree, stackParentId) {
//
// var node = new TreeNode(nodeStructure, this.db.length, parentId, tree, stackParentId);
//
// this.db.push(node);
// if (parentId >= 0) this.get(parentId).children.push(node.id); //skip root node
//
// if (stackParentId) {
// this.get(stackParentId).stackParent = true;
// this.get(stackParentId).stackChildren.push(node.id);
// }
//
// return node;
// }
//
// getMinMaxCoord(dim, parent, MinMax) { // used for getting the dimensions of the tree, dim = 'X' || 'Y'
// // looks for min and max (X and Y) within the set of nodes
// var parent = parent || this.get(0),
// i = parent.childrenCount(),
// MinMax = MinMax || { // start with root node dimensions
// min: parent[dim],
// max: parent[dim] + ((dim == 'X') ? parent.width : parent.height)
// };
//
// while (i--) {
//
// var node = parent.childAt(i),
// maxTest = node[dim] + ((dim == 'X') ? node.width : node.height),
// minTest = node[dim];
//
// if (maxTest > MinMax.max) {
// MinMax.max = maxTest;
//
// }
// if (minTest < MinMax.min) {
// MinMax.min = minTest;
// }
//
// this.getMinMaxCoord(dim, node, MinMax);
// }
// return MinMax;
// }
//
// static hasGrandChildren(nodeStructure) {
// var i = nodeStructure.children.length;
// while (i--) {
// if (nodeStructure.children[i].children) return true;
// }
// }
// }
//
// export {NodeDB}
// import {TreeStore} from '../treeStore/treeStore';
//
// class Treant {
// static JSONconfig = {
// make: function (configArray) {
//
// var i = configArray.length, node;
//
// this.jsonStructure = {
// chart: null,
// nodeStructure: null
// };
// //fist loop: find config, find root;
// while (i--) {
// node = configArray[i];
// if (node.hasOwnProperty('container')) {
// this.jsonStructure.chart = node;
// continue;
// }
//
// if (!node.hasOwnProperty('parent') && !node.hasOwnProperty('container')) {
// this.jsonStructure.nodeStructure = node;
// node.myID = this.getID();
// }
// }
//
// this.findChildren(configArray);
//
// return this.jsonStructure;
// },
//
// findChildren: function (nodes) {
// var parents = [0]; // start witha a root node
//
// while (parents.length) {
// var parentId = parents.pop(),
// parent = this.findNode(this.jsonStructure.nodeStructure, parentId),
// i = 0, len = nodes.length,
// children = [];
//
// for (; i < len; i++) {
// var node = nodes[i];
// if (node.parent && (node.parent.myID == parentId)) { // skip config and root nodes
//
// node.myID = this.getID();
//
// delete node.parent;
//
// children.push(node);
// parents.push(node.myID);
// }
// }
//
// if (children.length) {
// parent.children = children;
// }
// }
// },
//
// findNode: function (node, nodeId) {
// var childrenLen, found;
//
// if (node.myID === nodeId) {
// return node;
// } else if (node.children) {
// childrenLen = node.children.length;
// while (childrenLen--) {
// found = this.findNode(node.children[childrenLen], nodeId);
// if (found) {
// return found;
// }
// }
// }
// },
//
// getID: (function () {
// var i = 0;
// return function () {
// return i++;
// };
// })()
// };
//
// constructor(jsonConfig, callback) {
// if (jsonConfig instanceof Array) {
// jsonConfig = Treant.JSONconfig.make(jsonConfig);
// }
//
// var newTree = TreeStore.createTree(jsonConfig);
// newTree.positionTree(callback);
//
// this.tree_id = newTree.id;
// }
//
// destroy() {
// TreeStore.destroy(this.tree_id);
// };
// }
//
// export {Treant};
// import {UTIL} from '../utils/Util';
// import {TreeStore} from '../treeStore/treeStore';
// class TreeNode {
// static CONFIG = {
// nodeHTMLclass: 'node',
//
// textClass: {
// name: 'node-name',
// title: 'node-title',
// desc: 'node-desc',
// contact: 'node-contact'
// }
// };
//
// constructor(nodeStructure, id, parentId, tree, stackParentId) {
// this.id = id;
// this.parentId = parentId;
// this.treeId = tree.id;
// this.prelim = 0;
// this.modifier = 0;
//
// this.stackParentId = stackParentId;
//
// // pseudo node is a node with width=height=0, it is invisible, but necessary for the correct positiong of the tree
// this.pseudo = nodeStructure === 'pseudo' || nodeStructure['pseudo'];
//
// this.image = nodeStructure.image;
//
// this.link = UTIL.createMerge(tree.CONFIG.node.link, nodeStructure.link);
//
// this.connStyle = UTIL.createMerge(tree.CONFIG.connectors, nodeStructure.connectors);
//
// this.drawLineThrough = nodeStructure.drawLineThrough === false ? false : nodeStructure.drawLineThrough || tree.CONFIG.node.drawLineThrough;
//
// this.collapsable = nodeStructure.collapsable === false ? false : nodeStructure.collapsable || tree.CONFIG.node.collapsable;
// this.collapsed = nodeStructure.collapsed;
//
// this.text = nodeStructure.text;
//
// // '.node' DIV
// this.nodeInnerHTML = nodeStructure.innerHTML;
// this.nodeHTMLclass = (tree.CONFIG.node.HTMLclass ? tree.CONFIG.node.HTMLclass : '') + // globaly defined class for the nodex
// (nodeStructure.HTMLclass ? (' ' + nodeStructure.HTMLclass) : ''); // + specific node class
//
// this.nodeHTMLid = nodeStructure.HTMLid;
// }
//
// Tree() {
// return TreeStore.get(this.treeId);
// }
//
// dbGet(nodeId) {
// return this.Tree().nodeDB.get(nodeId);
// }
//
// size() { // returns the width of the node
// var orient = this.Tree().CONFIG.rootOrientation;
//
// if (this.pseudo) return -this.Tree().CONFIG.subTeeSeparation; // prevents of separateing the subtrees
//
// if (orient == 'NORTH' || orient == 'SOUTH')
// return this.width;
//
// else if (orient == 'WEST' || orient == 'EAST')
// return this.height;
// }
//
// childrenCount() {
// return (this.collapsed || !this.children) ? 0 : this.children.length;
// }
//
// childAt(i) {
// return this.dbGet(this.children[i]);
// }
//
// firstChild() {
// return this.childAt(0);
// }
//
// lastChild() {
// return this.childAt(this.children.length - 1);
// }
//
// parent() {
// return this.dbGet(this.parentId);
// }
//
// leftNeighbor() {
// if (this.leftNeighborId) return this.dbGet(this.leftNeighborId);
// }
//
// rightNeighbor() {
// if (this.rightNeighborId) return this.dbGet(this.rightNeighborId);
// }
//
// leftSibling() {
// var leftNeighbor = this.leftNeighbor();
//
// if (leftNeighbor && leftNeighbor.parentId == this.parentId) return leftNeighbor;
// }
//
// rightSibling() {
// var rightNeighbor = this.rightNeighbor();
//
// if (rightNeighbor && rightNeighbor.parentId == this.parentId) return rightNeighbor;
// }
//
// childrenCenter(tree) {
// var first = this.firstChild(),
// last = this.lastChild();
// return first.prelim + ((last.prelim - first.prelim) + last.size()) / 2;
// }
//
// // find out if one of the node ancestors is collapsed
// collapsedParent() {
// var parent = this.parent();
// if (!parent) return false;
// if (parent.collapsed) return parent;
// return parent.collapsedParent();
// }
//
// leftMost(level, depth) { // returns the leftmost child at specific level, (initaial level = 0)
//
// if (level >= depth) return this;
// if (this.childrenCount() === 0) return;
//
// for (var i = 0, n = this.childrenCount(); i < n; i++) {
//
// var leftmostDescendant = this.childAt(i).leftMost(level + 1, depth);
// if (leftmostDescendant)
// return leftmostDescendant;
// }
// }
//
// // returns start or the end point of the connector line, origin is upper-left
// connectorPoint(startPoint) {
// var orient = this.Tree().CONFIG.rootOrientation, point = {};
//
// if (this.stackParentId) { // return different end point if node is a stacked child
// if (orient == 'NORTH' || orient == 'SOUTH') {
// orient = 'WEST';
// }
// else if (orient == 'EAST' || orient == 'WEST') {
// orient = 'NORTH';
// }
// }
// // if pseudo, a virtual center is used
// if (orient == 'NORTH') {
//
// point.x = (this.pseudo) ? this.X - this.Tree().CONFIG.subTeeSeparation / 2 : this.X + this.width / 2;
// point.y = (startPoint) ? this.Y + this.height : this.Y;
//
// } else if (orient == 'SOUTH') {
//
// point.x = (this.pseudo) ? this.X - this.Tree().CONFIG.subTeeSeparation / 2 : this.X + this.width / 2;
// point.y = (startPoint) ? this.Y : this.Y + this.height;
//
// } else if (orient == 'EAST') {
//
// point.x = (startPoint) ? this.X : this.X + this.width;
// point.y = (this.pseudo) ? this.Y - this.Tree().CONFIG.subTeeSeparation / 2 : this.Y + this.height / 2;
//
// } else if (orient == 'WEST') {
//
// point.x = (startPoint) ? this.X + this.width : this.X;
// point.y = (this.pseudo) ? this.Y - this.Tree().CONFIG.subTeeSeparation / 2 : this.Y + this.height / 2;
// }
// return point;
// }
//
// pathStringThrough() { // get the geometry of a path going through the node
// var startPoint = this.connectorPoint(true),
// endPoint = this.connectorPoint(false);
//
// return ["M", startPoint.x + "," + startPoint.y, 'L', endPoint.x + "," + endPoint.y].join(" ");
// }
//
// drawLineThroughMe(hidePoint) { // hidepoint se proslijedjuje ako je node sakriven zbog collapsed
//
// var pathString = hidePoint ? this.Tree().getPointPathString(hidePoint) : this.pathStringThrough();
//
// this.lineThroughMe = this.lineThroughMe || this.Tree()._R.path(pathString);
//
// var line_style = UTIL.cloneObj(this.connStyle.style);
//
// delete line_style['arrow-start'];
// delete line_style['arrow-end'];
//
// this.lineThroughMe.attr(line_style);
//
// if (hidePoint) {
// this.lineThroughMe.hide();
// this.lineThroughMe.hidden = true;
// }
// }
//
// addSwitchEvent(my_switch) {
// var self = this;
// UTIL.addEvent(my_switch, 'click', function (e) {
// e.preventDefault();
// self.toggleCollapse();