DigitaleAgentur___ALT
/
digitaleagenturnc
5
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Organigramm klickbar

This commit is contained in:
holger.trampe 2019-12-12 16:15:19 +01:00
parent 1073e9d8a9
commit fbb71e556d
1 changed files with 53 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

68
orga/templates/orga/orga_main.html
View File

@ -11,7 +11,7 @@
<script type="text/javascript">
var data = [
{ 'id': 'parent', 'role': "", 'name': 'Agentur {{request.user.profile.agency.name}}', 'color': '#71AF17', "imageUrl": "{{ request.user.profile.agency.agencypic.url }}"},
{ 'id': 'parent', 'role': "", 'name': 'Agentur {{request.user.profile.agency.name}}', 'color': '#71AF17', "imageUrl": ""},
{% for u in agencyuser %}
{% if u.profile.parent == u %}
{ 'id': '{{u.pk}}' , 'name': "{{u.first_name}} {{u.last_name}}",'role': '{{u.profile.get_func_display}}\n{{u.profile.compfunc}}', 'manager': 'parent', 'color': '#1859B7', "imageUrl": "{{u.profile.image.url}}", 'userid' : '{{u.pk}}' },
@ -24,8 +24,8 @@ var data = [
var items = new ej.data.DataManager(data);
var diagram = new ej.diagrams.Diagram({
width: "1400px", height: "800px",
tool: ej.diagrams.DiagramTools.ZoomPan,
width: "1000px", height: "600px",
/*tool: ej.diagrams.DiagramTools.ZoomPan,*/
dataSourceSettings: {
// set the unique field from data source
id: 'id',
@ -45,6 +45,24 @@ var diagram = new ej.diagrams.Diagram({
});
diagram.appendTo('#diagram');
diagram.selectionChange = goToUser
function goToUser(){
if(diagram.selectedItems['nodes'][0] != undefined){
selected_id = diagram.selectedItems['nodes'][0]['properties']['data']['id'];
if(selected_id != 'parent'){
$("#diagram").hide();
window.location.href = "/orga/single/"+selected_id;
}
else{
$("#diagram").hide();
window.location.href = "/orga/";
}
}
}
//Define the common settings for connectors.
function connectorDefaults(connector) {
connector.targetDecorator.shape = 'None';
@ -61,7 +79,7 @@ function setNodeTemplate(obj, diagram) {
content.orientation = 'Horizontal';
content.style.strokeColor = 'gray';
content.padding = { left: 5, right: 10, top: 5, bottom: 5 };
// create the image element to map the image data from the data source
var image = new ej.diagrams.ImageElement();
@ -82,18 +100,37 @@ function setNodeTemplate(obj, diagram) {
innerStack.margin = { left: 5, right: 0, top: 0, bottom: 0 };
innerStack.id = obj.id + '_innerstack';
if(obj['properties']['data']['id'] == 'parent'){
var text = new ej.diagrams.TextElement();
text.style.bold = true;
text.style.fontSize = 24;
text.id = obj.id + '_name';
text.content = obj.data.name;
}
else{
var text = new ej.diagrams.TextElement();
text.style.bold = true;
text.style.fontSize = 18;
text.id = obj.id + '_name';
text.content = obj.data.name;
}
// create the text element to map the name data from the data source
var text = new ej.diagrams.TextElement();
text.style.bold = true;
text.style.fontSize = 18;
text.id = obj.id + '_name';
text.content = obj.data.name;
if(obj['properties']['data']['id'] == 'parent'){
var desigText = new ej.diagrams.TextElement();
desigText.id = obj.id + '_desig';
desigText.style.fontSize = 0;
desigText.content = obj.data.role;
}
else{
var desigText = new ej.diagrams.TextElement();
desigText.id = obj.id + '_desig';
desigText.style.fontSize = 16;
desigText.content = obj.data.role;
}
// create the text element to map the role data from the data source
var desigText = new ej.diagrams.TextElement();
desigText.id = obj.id + '_desig';
desigText.style.fontSize = 16;
desigText.content = obj.data.role;
// append the text elements
innerStack.children = [text, desigText];
@ -103,7 +140,7 @@ function setNodeTemplate(obj, diagram) {
return content;
}
/*
$(document).ready(function(){
@ -121,5 +158,6 @@ $(document).ready(function(){
function clickme(id){
console.log(id);
}
*/
</script>
{% endblock content %}