Jump to content
  • Revista PROGRAMAR: Já está disponível a edição #60 da revista programar. Faz já o download aqui!

tenho20metros

[Resolvido] Organization Chart com Back Office em PHP

Recommended Posts

tenho20metros

Boas, a questão que venho aqui colocar é a seguinte

Tenho de desenvolver um organization chart (org chart) que seja simples de se puder alterar dados nele pois é constantemente actualizado.

O projecto ainda está em fase de idealização por isso ainda não tenho nenhum código desenvolvido só queria mesmo esclarecer a melhor maneira de abordar este projecto.

O design seria algo deste género (mais coisa menos coisa).

https://creately.com/diagram/example/hckwve0d1/PHP

Agora o que pretendia era depois ter um back office que me permitisse alterar os dados(esta parte sei que é possível e sei fazer sem problemas) que estão dentro das "caixinhas" e se possível criar novas e/ou eliminar existentes.

Duvidas:

-É possível criar um back office que crie/elimine "caixinhas"?;

-Dá para fazer um back office sem ligação a base de dados?;

-Quais as ferramentas que devo de usar?.

Espero ter esclarecido bem o meu projecto assim como as minhas duvidas.

Qualquer esclarecimento e sugestão são bem vindos,

Comprimentos,

Ricardo

Share this post


Link to post
Share on other sites
tiago.f

Olá,

-É possível criar um back office que crie/elimine "caixinhas"?;

Não sei se percebo bem a questão...

A minha sugestão seria fazeres toda a funcionaliade no front-end (browser com javascript) e simplesmente manteres o back-office actualizado com as alterações feitas no front-end.

http://stackoverflow.com/questions/3923221/are-there-any-better-javascript-org-charts-compared-with-google-org-chart-api

Refer algumas bibliotecas que podes usar (a D3 parece-me "gira")

http://jsfiddle.net/augburto/YMa2y/

-Dá para fazer um back office sem ligação a base de dados?;

Claro, podes usar qualquer solução que queiras para persistir a informação: BD, ficheiros, etc, etc

No entanto, acho que a estrutura de um org-chart se assemelha/mapeia muito bem numa BD...

-Quais as ferramentas que devo de usar?.

vê a resposta a 1ª questão.

Sugiro transferires a info entre front-end e back-end por json (e assim usas a D3.js com facilidade :) )

Share this post


Link to post
Share on other sites
tenho20metros

Desde já obrigado pela resposta. :thumbsup:

Em relação ao primeiro ponto vou me tentar explicar melhor. O que queria dizer era por exemplo tenho um org chart assim: http://i.imgur.com/JHjCeLQ.jpg

E queria saber se em back office conseguia inserir uma nova caixa de texto para ficar assim: http://i.imgur.com/zRQ1flT.jpg

Ou sejam sem ter e ir ao código fonte da página e manualmente inserir a caixa de texto.

Em relação ao ponto 2 fiquei totalmente esclarecido :)

No ponto 3 a minha pergunta era para saber se é melhor usar uma ferramenta mais pratica para fazer o back office por exemplo o code igniter ou se é melhor fazer do 0.

Share this post


Link to post
Share on other sites
tenho20metros

Gostei do exemplo, mas se depois se optar por usar uma base de dados para gerir os dados tenho de criar um ficheiro em php para fazer a ligação e depois como passo os dados para a variável root?

Share this post


Link to post
Share on other sites
tiago.f

o php tem uma funcão chamado json_encode que trata disso. Basta que lhe passes um object e ela converte-o numa String json.

http://stackoverflow.com/questions/9858448/converting-object-to-json-and-json-to-object-in-php-library-like-gson-for-java

Depois como passas isso para o javascript é contigo: desde gerar o script dinamicamente a ir buscar apenas esta info atraves de uma chamada ajax....

Por exemplo (nao testei):

<script>
var root = {};
function updateData() {
   $.ajax({
    url: 'api/orgdata',
    dataType: 'json',
    type: 'GET,
    success: function(response) {
	    root = response;
    },
    error: function(xhr, status, err) {
	    console.error(status, err.toString());
    }
   });
}
setTimeout (updateData, 2000);

</script>

Este script vai buscar os dados para a variavel "root" a cada 2 segundos, chamando o url "api/orgdata".

Se tiveres php a responder a este url com algo do tipo:

<'php
$resultado = getOrgDataFromDB();
header('Content-Type: application/json');
echo json_enconde($resultado);
exit;
?>

Deve resultar

Edited by tiago.f

Share this post


Link to post
Share on other sites
tenho20metros

Ok obrigado pela a ajuda vou implementar o código e fazer uns teste a ver como corre a coisa :cheesygrin:

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×

Important Information

By using this site you accept our Terms of Use and Privacy Policy. We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.