source: trunk/workflow/js/userinterface/orgchart.js @ 1245

Revision 1245, 16.3 KB checked in by rodsouza, 15 years ago (diff)

Ticket #589 - itens (doc. anexo ao ticket) 1, 2, 3, 4 e 5 integralmente e item 6 parcialmente.
Line 
1var workflowUserInterfaceEmployeeInfoTimer = null;
2var workflowUserInterfaceAreaInfoTimer = null;
3var workflowUserInterfaceCurrentAreaID = 0;
4
5String.prototype.repeat = function(l)
6{
7        return new Array(l+1).join(this);
8};
9
10/* define the orgchart layout */
11function createOrgchartLayout()
12{
13        var content = '<div id="orgchartMenu"></div>';
14        content += '<div class="orgchartAreas" id="orgchartAreas"></div>';
15        content += '<div class="orgchartEmployees" id="orgchartEmployees"></div>';
16        content += '<div class="orgchartFooter" id="orgchartFooter"></div>';
17        content += '<div id="employeeInfo" class="employeeInfo" style="display: none;"></div>';
18        content += '<div id="areaInfo" class="employeeInfo" style="display: none;"></div>';
19
20        var div = $('content_id_4');
21        div.innerHTML = content;
22
23        draw_orgchart_folder();
24}
25
26/* generates the orgchart menu */
27function createOrgchartMenu(organizationID, imagemURL)
28{
29        var enderecoImagem = '';
30        if ((imagemURL != null) && (imagemURL != ''))
31                enderecoImagem = imagemURL;
32        else
33                enderecoImagem = '../index.php?menuaction=workflow.ui_orgchart.graph&organizationID=' + organizationID;
34
35        var content = '<ul class="horizontalMenu">';
36        content += '<li style="margin: 5px 5px 0 5px">Visualizar : <select>'
37        content += '<option>-- Selecione uma opção de visualização --</option>'
38        content += '<option onclick="">Alfabética</option>'
39        content += '<option onclick="getHierarchicalArea( );">Áreas</option>'
40        content += '<option onclick="">Lotação</option>'
41        content += '<option onclick="getUsefulPhones( );">Telefones Úteis</option>'
42        content += '<option onclick="getAreaWithSubtituteBoss( )">Substituição de Chefia</option>'
43        content += '<option onclick="getCostCenters( );">Centros de Custo</option>'
44        content += '<option onclick="">Vínculos</option>'
45        content += '</select></li>';
46        content += '<li><a href="#" onclick="window.open(\'' + enderecoImagem + '\', \'extwindow\'); return false;"><img src="templateFile.php?file=images/Process.gif">&nbsp;&nbsp;Gráfico</a></li>';
47        //content += '<li><a href="#" onclick="getCostCenters(); return false;"><img src="templateFile.php?file=images/coins.png">&nbsp;Centros de Custo</a></li>';
48        //content += '<li><a href="#" onclick="getHierarchicalArea(); return false;"><img src="templateFile.php?file=images/orgchart_tree.png">Lista Hierárquica</a></li>';
49        //content += '<li><a href="#" onclick="getAreaList(); return false;"><img src="templateFile.php?file=images/orgchart_list.png">&nbsp;&nbsp;Lista Alfabética</a></li>';
50        //content += '<li><a href="#" onclick="getCategoriesList(); return false;"><img src="templateFile.php?file=images/folder_green.png">&nbsp;&nbsp;Listar Vínculos</a></li>';
51        content += '<li><a href="#" onclick="printArea(); return false;"><img src="templateFile.php?file=images/imprimir.png" width="16">&nbsp;&nbsp;Imprimir</a></li>';
52        content += '<li><a><input type="text" name="search_term" id="search_term" onkeypress="if (((event.which) ? event.which : event.keyCode) == 13) $(\'search_span\').onclick(); return true;" /><span id="search_span" style="cursor: pointer;" onclick="tmp = $$(\'div#orgchartAreas a.destaque\'); if (tmp[0]) tmp[0].removeClassName(\'destaque\'); orgchartSearchEmployee($F(\'search_term\')); return false;">&nbsp;busca</span></a></li>';
53        content += '</ul>';
54        content += '<br/>';
55        content += '<br/>';
56
57        $('orgchartMenu').innerHTML = content;
58}
59
60/* load the initial data */
61function draw_orgchart_folder()
62{
63        $('orgchartMenu').innerHTML = '';
64        $('orgchartAreas').innerHTML = '';
65        $('orgchartEmployees').innerHTML = '<br/><br/><br/><br/><center><i>&nbsp;&nbsp;carregando...<br/><img src="templateFile.php?file=images/loading.gif"></i></center>';
66        $('orgchartFooter').innerHTML = '';
67        $('orgchartMenu').innerHTML = '';
68
69        cExecute("$this.bo_userinterface.orgchart", orgchart, "");
70}
71
72/* process the initial data */
73function orgchart(data)
74{
75        if (_checkError(data))
76                return;
77
78        /* in case of any warning */
79        if (data['warning'])
80        {
81                $('content_id_4').innerHTML = '<br/><br/><center><strong>' + data['warning'] + '</strong></center><br/><br/>';
82                return;
83        }
84
85        if (data['areas'].length == 0)
86        {
87                $('content_id_4').innerHTML = "<br/><br/><center><strong>Nenhuma área cadastrada.</strong></center><br/><br/>";
88                return;
89        }
90
91        /* continue displaying the data */
92        displayHierarchicalAreas(data['areas']);
93        createOrgchartMenu(data['organizacao_id'], data['url_imagem']);
94        $('orgchartEmployees').innerHTML = '<br/><br/><br/><br/><center><i>faça uma busca ou clique em uma área para ver a lista de funcionários</i></center>';
95}
96
97function displayCostCenters(data)
98{
99        if (_checkError(data))
100                return;
101
102        var div = $('orgchartEmployees');
103        if (data.length == 0)
104        {
105                div.innerHTML = '<br/><br/><center><strong>Nenhum registro encontrado</strong></center>';
106                return;
107        }
108
109        var content = '<center><h3>CENTROS DE CUSTO</strong></h3>';
110        content += '<table class="employeeList">';
111        content += '<tr><th>Nome</th><th>Número</th><th>Grupo</th></tr>';
112        var current;
113        var costCentersCount = data.length;
114        for (var i = 0; i < costCentersCount; i++)
115        {
116                current = data[i];
117                content += '<tr class="linha'+ i%2 + '">';
118                content += '<td>' + current['descricao'] + '</td>';
119                content += '<td>' + current['nm_centro_custo'] + '</td>';
120                content += '<td>' + current['grupo'] + '</td>';
121                content += '</tr>';
122        }
123        content += '</table>';
124        div.innerHTML = content;
125}
126
127function displayUsefulPhones( data )
128{
129        if ( _checkError( data ) )
130                return;
131
132        var div = $('orgchartEmployees');
133        if (data.length == 0)
134        {
135                div.innerHTML = '<br/><br/><center><strong>Nenhum registro encontrado</strong></center>';
136                return;
137        }
138
139        var content = '<center><h3>TELEFONES ÚTEIS</strong></h3>';
140        content += '<table class="employeeList">';
141        content += '<tr><th>Localidade</th><th>Número</th></tr>';
142        var current;
143        var usefulPhoneCount = data.length;
144        for (var i = 0; i < usefulPhoneCount; i++)
145        {
146                current = data[i];
147                content += '<tr class="linha'+ i%2 + '">';
148                content += '<td>' + current[ 'descricao' ] + '</td>';
149                content += '<td>' + current[ 'numero' ] + '</td>';
150                content += '</tr>';
151        }
152        content += '</table>';
153        div.innerHTML = content;
154}
155
156function displayAreaWithSubtituteBoss( data )
157{
158        if ( _checkError( data ) )
159                return;
160
161        var div = $('orgchartEmployees');
162        if (data.length == 0)
163        {
164                div.innerHTML = '<br/><br/><center><strong>Nenhum registro encontrado</strong></center>';
165                return;
166        }
167
168        var content = '<center><h3>Áreas com Substituição de Chefia</strong></h3>';
169        content += '<table class="employeeList">';
170        content += '<tr><th>Área</th><th>Titular</th><th>Substituto</th></tr>';
171        var current;
172        var usefulPhoneCount = data.length;
173        for (var i = 0; i < usefulPhoneCount; i++)
174        {
175                current = data[i];
176                content += '<tr class="linha'+ i%2 + '">';
177                content += '<td>' + current['area'] + '</td>';
178                content += '<td>' + current['titular'] + '</td>';
179                content += '<td>' + current['substituto'] + '</td>';
180                content += '</tr>';
181        }
182        content += '</table>';
183        div.innerHTML = content;
184}
185
186function displayHierarchicalAreas(data)
187{
188        if (_checkError(data))
189                return;
190
191        function recursivePrint(subdata)
192        {
193                for (var i = 0; i < subdata.length; i++)
194                {
195                        div.innerHTML += '<br />' + '&nbsp;&nbsp;&nbsp;&nbsp;'.repeat(subdata[i]['depth']) + '<a href="javascript:void(0)" id="area_' + subdata[i]['area_id'] + '" onmouseover="getAreaInfoTimer(event, ' + subdata[i]['area_id'] + '); return false;" onmouseout="hideAreaInfo(); return false;" onclick="tmp = $$(\'div#orgchartAreas a.destaque\'); if (tmp[0]) tmp[0].removeClassName(\'destaque\'); this.addClassName(\'destaque\'); loadAreaEmployees(' + subdata[i]['area_id'] + ')">' + subdata[i]['sigla'] + '</a>';
196                        if (subdata[i]['children'].length > 0)
197                                recursivePrint(subdata[i]['children']);
198                }
199        }
200
201        var div = $('orgchartAreas');
202        div.innerHTML = "<center><strong>ÁREAS</strong></center>";
203        recursivePrint(data);
204}
205
206function getUsefulPhones( )
207{
208        cExecute("$this.bo_userinterface.getUsefulPhones", displayUsefulPhones, "");
209}
210
211function getAreaWithSubtituteBoss( )
212{
213        cExecute("$this.bo_userinterface.getAreaWithSubtituteBoss", displayAreaWithSubtituteBoss, "");
214}
215
216function getCostCenters()
217{
218        cExecute("$this.bo_userinterface.getCostCenters", displayCostCenters, "");
219}
220
221function getHierarchicalArea()
222{
223        cExecute("$this.bo_userinterface.getHierarchicalArea", displayHierarchicalAreas, "");
224}
225
226function getAreaList()
227{
228        cExecute("$this.bo_userinterface.getAreaList", displayHierarchicalAreas, "");
229}
230
231function getCategoriesList()
232{
233        function resultGetCategoriesList(data)
234        {
235                if (_checkError(data))
236                        return;
237
238                var content = '<center><strong>VÍNCULOS</strong></center>';
239                for (var i = 0; i < data.length; i++)
240                        content += '<br/>' + '&nbsp;&nbsp;<a href="javascript:void(0)" id="categoria_' + data[i]['funcionario_categoria_id'] + '" onclick="tmp = $$(\'div#orgchartAreas a.destaque\'); if (tmp[0]) tmp[0].removeClassName(\'destaque\'); this.addClassName(\'destaque\'); loadCategoryEmployees(' + data[i]['funcionario_categoria_id'] + ')">' + data[i]['descricao'] + ' (' + data[i]['contagem'] + ')</a>';
241                content += '<br/><br/>';
242                $('orgchartAreas').innerHTML = content;
243        }
244
245        cExecute("$this.bo_userinterface.getCategoriesList", resultGetCategoriesList, "");
246}
247
248function printEmployeesHandler(data)
249{
250        /* check for errors */
251        if (_checkError(data))
252                return;
253
254        var div = $('orgchartEmployees');
255
256        /* no employee to list */
257        if (data['employees'].length == 0)
258        {
259                div.innerHTML = '<br/><br/><center><strong>Nenhum registro encontrado</strong></center>';
260                return;
261        }
262
263        /* initialize varivables */
264        var content = '';
265        var employees = data['employees'];
266        var useCategories = false;
267        var useArea = false;
268
269        /* check the informations that will be displayed */
270        if (data['categories'])
271                if (data['categories'].length > 1)
272                        useCategories = true;
273        if (employees[0]['area'])
274                useArea = true;
275
276        /* build the display table (headers)*/
277        content += '<table id="employeeList" class="employeeList" style="clear: both">';
278        content += '<tr>';
279        content += '<th>Funcionário</th>';
280        if (useArea)
281                content += '<th>Área</th>';
282        content += '<th>Telefone</th>';
283        content += '</tr>';
284
285        /* if available, insert a menu to filter the categories */
286        if (useCategories)
287        {
288                content += '<tr><td colspan="' + (useArea ? '3' : '2') + '">';
289                content += '<ul class="horizontalMenu">';
290                for (var i = 0; i < data['categories'].length; i++)
291                        content += '<li><a href="#" style="height: 2em; line-height: 2em;" onclick="highlightCategory(' + data['categories'][i]['funcionario_categoria_id'] + '); return false;">' + data['categories'][i]['descricao'] + ' (' + data['categories'][i]['contagem'] + ')</a></li>';
292                content += '</ul>';
293                content += '</td></tr>';
294        }
295
296        /* list the employees */
297        var complement = '';
298        for (var i = 0; i < employees.length; i++)
299        {
300                if (employees[i]['chief'])
301                        complement = ' <strong>(' + ((employees[i]['chief'] == 1) ? 'Titular' : 'Substituto') + ')</strong>';
302                else
303                        complement = '';
304                if (employees[i]['removed'])
305                        complement += ' <font color="red">(excluído)</font>';
306                content += '<tr class="linha'+ i%2 + (useCategories ? ' categoria_' + employees[i]['funcionario_categoria_id'] : '') + '">';
307                content += '<td><a href="javascript:void(0);" onmouseover="getEmployeeInfoTimer(event, ' + employees[i]['funcionario_id'] + '); return false;" onmouseout="hideEmployeeInfo(); return false;">' + employees[i]['cn'] + complement + '</a></td>';
308                if (useArea)
309                        content += '<td>' + employees[i]['area'] + '</td>';
310                content += '<td align="center">' + employees[i]['telephoneNumber'] + '</td>';
311                content += '</tr>';
312        }
313        content += '</table>';
314
315        /* display the employees list and go to the top of the page */
316        div.innerHTML = content;
317        window.scrollTo(0,0);
318}
319
320function highlightCategory(categoryID)
321{
322        var rows = $('employeeList').childNodes[0].childNodes;
323        var categoryClass = 'categoria_' + categoryID;
324
325        var highlightClass = '';
326        var row;
327        for (var i = 1; i < rows.length; i++)
328        {
329                row = $(rows[i]);
330                /* in case alternated color rows are needed, just change the second 'highlight0' to something else (e.g. 'highlight1' which is alread defined) */
331                highlightClass = row.hasClassName('linha0') ? 'highlight0' : 'highlight0';
332                if (row.hasClassName(categoryClass))
333                        row.addClassName(highlightClass);
334                else
335                        row.removeClassName(highlightClass);
336        }
337}
338
339function loadAreaEmployees(areaID)
340{
341        workflowUserInterfaceCurrentAreaID = areaID;
342        cExecute('$this.bo_userinterface.getAreaEmployees', printEmployeesHandler, 'areaID=' + areaID);
343}
344
345function loadCategoryEmployees(categoryID)
346{
347        workflowUserInterfaceCurrentAreaID = 0;
348        cExecute('$this.bo_userinterface.getCategoryEmployees', printEmployeesHandler, 'categoryID=' + categoryID);
349}
350
351function orgchartSearchEmployee(searchTerm)
352{
353        workflowUserInterfaceCurrentAreaID = 0;
354        cExecute('$this.bo_userinterface.searchEmployee', printEmployeesHandler, 'searchTerm=' + searchTerm);
355}
356
357function printArea()
358{
359        if (workflowUserInterfaceCurrentAreaID == 0)
360                if (!confirm('Tem certeza de que deseja imprimir todo o Organograma?'))
361                        return false;
362        var endereco = '../index.php?menuaction=workflow.ui_userinterface.printArea&areaID=' + workflowUserInterfaceCurrentAreaID;
363        window.open(endereco, 'extwindow');
364}
365
366function getEmployeeInfoTimer(e, employeeID)
367{
368        var div = $('employeeInfo');
369        div.style.left = (Event.pointerX(e) + 20) + 'px';
370        div.style.top = (Event.pointerY(e) + 14) + 'px';
371
372        if (workflowUserInterfaceEmployeeInfoTimer != null)
373        {
374                workflowUserInterfaceEmployeeInfoTimer = clearTimeout(workflowUserInterfaceEmployeeInfoTimer);
375                workflowUserInterfaceEmployeeInfoTimer = null;
376        }
377
378        workflowUserInterfaceEmployeeInfoTimer = setTimeout('getEmployeeInfo(' + employeeID + ')', 500);
379}
380
381function getEmployeeInfo(employeeID)
382{
383        function resultGetEmployeeInfo(data)
384        {
385                if (workflowUserInterfaceEmployeeInfoTimer == null)
386                        return;
387
388                workflowUserInterfaceEmployeeInfoTimer = clearTimeout(workflowUserInterfaceEmployeeInfoTimer);
389                workflowUserInterfaceEmployeeInfoTimer = null;
390
391                var content = '';
392                content += '<table><tr><td valign="top">';
393                content += '<img src="showUserPicture.php?userID=' + employeeID + '"/>';
394                content += '</td><td valign="top" style="padding-left: 12px;">';
395                for (var i = 0; i < data['info'].length; i++)
396                        content += '<strong>' + data['info'][i]['name'] + '</strong>: ' + data['info'][i]['value'] + '<br/>';
397
398                content += '</td></tr></table>';
399                var pageYLimit = document.body.scrollTop + document.body.clientHeight;
400                var div = $('employeeInfo');
401                div.innerHTML = content;
402
403                if ((parseInt(div.style.top.replace(/px/g, '')) + div.getHeight()) > pageYLimit)
404                        div.style.top = (parseInt(div.style.top.replace(/px/g, '')) - (div.getHeight())) + 'px';
405                div.show();
406        }
407        cExecute('$this.bo_userinterface.getEmployeeInfo', resultGetEmployeeInfo, 'funcionario_id=' + employeeID);
408}
409
410function hideEmployeeInfo()
411{
412        if (workflowUserInterfaceEmployeeInfoTimer != null)
413        {
414                workflowUserInterfaceEmployeeInfoTimer = clearTimeout(workflowUserInterfaceEmployeeInfoTimer);
415                workflowUserInterfaceEmployeeInfoTimer = null;
416        }
417        $('employeeInfo').hide();
418}
419
420function getAreaInfoTimer(e, areaID)
421{
422        var div = $('areaInfo');
423        div.style.left = (Event.pointerX(e) + 20) + 'px';
424        div.style.top = (Event.pointerY(e) + 14) + 'px';
425
426        if (workflowUserInterfaceAreaInfoTimer != null)
427        {
428                workflowUserInterfaceAreaInfoTimer = clearTimeout(workflowUserInterfaceAreaInfoTimer);
429                workflowUserInterfaceAreaInfoTimer = null;
430        }
431
432        workflowUserInterfaceAreaInfoTimer = setTimeout('getAreaInfo(' + areaID + ')', 500);
433}
434
435function getAreaInfo(areaID)
436{
437        function resultGetAreaInfo(data)
438        {
439                if (workflowUserInterfaceAreaInfoTimer == null)
440                        return;
441
442                workflowUserInterfaceAreaInfoTimer = clearTimeout(workflowUserInterfaceAreaInfoTimer);
443                workflowUserInterfaceAreaInfoTimer = null;
444
445                var content = '';
446                content += '<table><tr>';
447                content += '<td valign="top" style="padding-left: 12px;">';
448                for (var i = 0; i < data['info'].length; i++)
449                        content += '<strong>' + data['info'][i]['name'] + '</strong>: ' + data['info'][i]['value'] + '<br/>';
450
451                content += '</td></tr></table>';
452                var pageYLimit = document.body.scrollTop + document.body.clientHeight;
453                var div = $('areaInfo');
454                div.innerHTML = content;
455
456                if ((parseInt(div.style.top.replace(/px/g, '')) + div.getHeight()) > pageYLimit)
457                        div.style.top = (parseInt(div.style.top.replace(/px/g, '')) - (div.getHeight())) + 'px';
458                div.show();
459        }
460        cExecute('$this.bo_userinterface.getAreaInfo', resultGetAreaInfo, 'area_id=' + areaID);
461}
462
463function hideAreaInfo()
464{
465        if (workflowUserInterfaceAreaInfoTimer != null)
466        {
467                workflowUserInterfaceAreaInfoTimer = clearTimeout(workflowUserInterfaceAreaInfoTimer);
468                workflowUserInterfaceAreaInfoTimer = null;
469        }
470        $('areaInfo').hide();
471}
Note: See TracBrowser for help on using the repository browser.