4

montei um algorítimo em php para popular 4 tabelas em html de forma uniforme.

Porém, estou achando meu código um tanto sujo e gostaria de verificar se existe uma forma mais limpa de criar este código.

O que ele faz: Ele recebe um array com nomes e números de ramal, e distribui de forma uniforme em 4 tabelas, não importa a quantidade de números e ramais, se for um número não divisível por 4, ele pega o resto e distribui.

Detalhe: O array é apenas um teste, o resultado vem de um CRUD, que possui um BD.

A utilização das propriedades HTML inline, é apenas teste, no sistema vai ser gerido pelas classes CSS responsáveis.

Então peço que dirijam a atenção exclusivamente ao algorítimo distribuidor de resultados.

Segue o meu array:

<?php
$grupos = array(
    'adm' => array(
        0 => array(
            'nome' => 'nome0',
            'ramal' => 'ramal0'
        ),
        1 => array(
            'nome' => 'nome1',
            'ramal' => 'ramal1'
        ),
        2 => array(
            'nome' => 'nome2',
            'ramal' => 'ramal2'
        ),
        3 => array(
            'nome' => 'nome3',
            'ramal' => 'ramal3'
        ),
        4 => array(
            'nome' => 'nome4',
            'ramal' => 'ramal4'
        ),
        5 => array(
            'nome' => 'nome5',
            'ramal' => 'ramal5'
        ),
        6 => array(
            'nome' => 'nome6',
            'ramal' => 'ramal6'
        ),
        7 => array(
            'nome' => 'nome7',
            'ramal' => 'ramal7'
        ),
        8 => array(
            'nome' => 'nome8',
            'ramal' => 'ramal8'
        ),
        9 => array(
            'nome' => 'nome9',
            'ramal' => 'ramal9'
        )
    )
);

Código

define("DIVISOR", 4); //Número de tabelas
$array_size = count($grupos['adm']); //quantidade de ramais
$qtd_por_tabela = (int) ($array_size / DIVISOR); //quantidade em cada tabela
$resto = ($array_size % DIVISOR); //resto a ser dividido nas tabelas
$y = 0; //contador array

for ($i = 1; $i <= DIVISOR; $i++) {
    echo "<div class=\"tables\"><table>";
    $sobra = $resto > 0 ? 1 : 0;
    for ($x = 1; ($x <= ($qtd_por_tabela + $sobra)); $x++) {
        $tag = "<tr><td>";
        $tag.=$grupos['adm'][$y]['nome'];
        $tag.="</td><td>";
        $tag.= $grupos['adm'][$y]['ramal'];
        $tag.="</td></tr>";
        echo $tag;
        $y++;
    }
    $resto = $resto > 0 ? ($resto - 1) : 0;
    echo "</table></div>";
    echo "\r\n";
}
?>

Um pouco de CSS para jogar uma tabela ao lado da outra...

<style>
    table,
    table td{
    border: 1px solid #000;
    }
    .tables{
        float: left;
        margin: 10px;
    }
</style>

O código imprime o seguinte resultado:

<div class="tables">
    <table>
        <tr>
            <td>nome0</td>
            <td>ramal0</td>
        </tr>
        <tr>
            <td>nome1</td>
            <td>ramal1</td>
        </tr>
        <tr>
            <td>nome2</td>
            <td>ramal2</td>
        </tr>
    </table>
</div>
<div class="tables">
    <table>
        <tr>
            <td>nome3</td>
            <td>ramal3</td>
        </tr>
        <tr>
            <td>nome4</td>
            <td>ramal4</td>
        </tr>
        <tr>
            <td>nome5</td>
            <td>ramal5</td>
        </tr>
    </table>
</div>
<div class="tables">
    <table>
        <tr>
            <td>nome6</td>
            <td>ramal6</td>
        </tr>
        <tr>
            <td>nome7</td>
            <td>ramal7</td>
        </tr>
    </table>
</div>
<div class="tables">
    <table>
        <tr>
            <td>nome8</td>
            <td>ramal8</td>
        </tr>
        <tr>
            <td>nome9</td>
            <td>ramal9</td>
        </tr>
    </table>
</div>

Observação: Ele não indenta assim bonitinho, mas fiz manualmente para facilitar a leitura. A idéia é alcançar este resultado, mas com um algorítimo mais "limpo".

Alguém sabe como fazer?

9
  • 1
    uma sugestão que eu faria: tirar as strings com códigos html do for e popular a tabela direto no html, via servidor mesmo ou via Ajax com JSON Commented 1/08/2014 às 14:32
  • basicamente seu código fica poluído pela injeção de dados na parte lógica (algo muito ruim no conceito de programação), o que você precisa fazer é retirar isto (como no comentário anterior, popular em um arquivo JSON ou banco de dados), se pretende continuar aconselho a deixar direto no HTML o resultado para minimizar, sem isso não vejo outra maneira =/ Commented 1/08/2014 às 14:50
  • em JSON minimiza os impactoes e podemos auxiliar facilmente nessa parte (ainda será compatível com o helper para cakephp, porque utilizaremos php para carregar o arquivo); Commented 1/08/2014 às 14:53
  • Pessoal, este array não é criado por mim, ele vem de um banco de dados, o array é apenas um teste, para facilitar o entendimento do formato que os dados são recebidos. Eu quero idéias para o algorítimo, o resto é apenas uma estrutura de testes, sem depender de BD. Commented 1/08/2014 às 14:56
  • 3
    @MarceloAymone acompanhe a discussão sobre a reabertura aqui, e dê sua opinião se achar pertinente: meta.pt.stackoverflow.com/questions/1903
    – Largato
    Commented 2/09/2014 às 2:41

1 Resposta 1

6

Existe um Design Pattern Estrutural chamado Composite que permite a você abstrair o HTML e construir uma estrutura hierárquica de informações compostas, como numa árvore.

Com o Composite você tem diversos objetos, cada um representando uma ramificação do HTML, essas ramificações podem ou não serem compostas de outros elementos.

Para a resposta não ficar maior do que já vai ficar, não vou postar os códigos aqui e sim todos juntos neste Gist. Também inclusos uma implementação bem simples de um autoloader para rodar a Aplicação e um pequeno apelo visual com CSS.

Primeiramente, a estrutura de diretórios bem como os arquivos utilizados:

|-index.php
|-Composite\Components
|   |-Composite\Components\AbstractComponent.php
|   |-Composite\Components\Component.php
|   |-Composite\Components\Drawable.php
|   \-Composite\Components\HTML
|     |-Composite\Components\HTML\Cell.php
|     |-Composite\Components\HTML\Row.php
|     \-Composite\Components\HTML\Table.php

"Vamos conhecer agora os nossos participantes":

  • AbstractComponent.php

Essa superclasse, abstrata, define uma interface para todos os objetos que comporão algum elemento, algum nó da estrutura hierárquica, e implementa um comportamento padrão para eles.

A propriedade AbstractComponent::children armazena todos os nós-filhos de cada elemento criado, desde que respeitada sua condição de existência, permitindo a renderização em níveis da estrutura.

Essa "condição de existência" é controlada pela propriedade AbstractComponent::leaf que determina se um dado objeto é uma ramificação (FALSE) ou uma folha (TRUE). Ramificações podem ser compostas de outros elementos filhos, ao passo que "folhas", não.

Nesse cenário em específico, a fim de simplificar, estarei considerando as células da tabela como folhas, mesmo que num caso real elas não o sejam.

O método AbstractComponent::add() é o que permite efetivamente a Composição ocorrer no sentido de agregar novos objetos uns aos outros.

Observe que nele é feita uma verificação para que objetos definidos como sendo uma "folha" não aceitem novos objetos, disparando uma exceção lógica.

Por fim, mas não menos importante, AbstractComponent::drawChildren() oferece aos objetos que representam as ramificações um meio de renderizar todos os elementos neles contidos. Como você poderá ver adiante, objetos "folha" são os únicos que não o utiliza.

  • Component e Drawable

Temos duas interfaces, uma para representar os componentes e outra para representar objetos renderizáveis. Na bem da verdade apenas a interface Component poderia ser utilizada, mas, por preferência, eu dividi os comportamentos em duas interfaces tornando Component um tipo.

  • Table, Row e Cell

Para este exemplo existem objetos para representar apenas três elementos HTML, porém, você pode criar outros conforme sua necessidade, bastando estender a superclasse AbstractComponent e implementar o método Drawable::draw(). E claro, caso seja necessário caracterizar um elemento como "folha", sobrescrever a propriedade protegida anteriormente descrita.

Tanto Table como Row são bem simples, apenas envolvem os nós-filhos renderizados através de AbstractComponent::drawChildren() pelas tags <table> / </table> e <tr> / </tr>, respectivamente.

Cell, no entanto, é ligeiramente diferente. Além do fato de, aqui exclusivamente, termos invertido a característica dela de não permitir outros níveis na Composição, sobrescrevemos o construtor para termos uma forma de definir o texto que será escrito na célula.

Normalmente nessa hora viria aquele aviso gigantesco num letreiro de neon dizendo para que, quando sobrescrevendo o construtor de uma superclasse, deve-se reinvocá-lo através de parent::__construct(). Porém, isso não é de todo obrigatório nessa Aplicação pois, uma vez que a flag AbstractComponent::leaf tenha sido sobrescrita, AbstractComponent::add() irá disparar a exceção lógica caso seja invocada no contexto de um objeto Cell.

Se não invocarmos o construtor, não definirmos que o objeto que sobrescreveu a superclasse é uma folha e ainda assim invocarmos AbstractComponent::add() (caramba, conseguimos errar 3 vezes :o), receberíamos um Fatal Error pois o método append() estaria sendo invocado sem um objeto. Objeto esse, um ArrayObject, definido justamente no construtor da superclasse ora sobrescrito.

Pelo sim, pelo não, deixemos ele ali. Mal não faz ^_^

Igualmente à Table e Row, Cell::draw() é bem simples, apenas insere o valor recebido pelo construtor, ora armazenado numa propriedade com visibilidade private (porque privada é feio :p) entre um par de tags <td> / </td>

Mas... E como isso se aplica ao problema?

Primeiro vamos alterar seu array de entrada para alguma coisa um pouquinho diferente apenas para demonstrar que funciona:

$groups = array(
    'Administração' => array(
        0 => array(
            'nome' => 'nome0',
            'ramal' => 'ramal0'
        ),
        1 => array(
            'nome' => 'nome1',
            'ramal' => 'ramal1'
        ),
        2 => array(
            'nome' => 'nome2',
            'ramal' => 'ramal2'
        ),
        3 => array(
            'nome' => 'nome3',
            'ramal' => 'ramal3'
        )
    ),
    'Financeiro' => array(
        4 => array(
            'nome' => 'nome4',
            'ramal' => 'ramal4'
        ),
        5 => array(
            'nome' => 'nome5',
            'ramal' => 'ramal5'
        ),
        6 => array(
            'nome' => 'nome6',
            'ramal' => 'ramal6'
        ),
        7 => array(
            'nome' => 'nome7',
            'ramal' => 'ramal7'
        ),
        8 => array(
            'nome' => 'nome8',
            'ramal' => 'ramal8'
        ),
        9 => array(
            'nome' => 'nome9',
            'ramal' => 'ramal9'
        )
    )
);

Apenas quebrei ele para considerar mais de um departamento. Antes de iterar para compor nossa estrutura, temos de definir o elemento principal da mesma, ou seja, a tabela onde cada linha e cada célula será agregada:

$tableGroup = new Composite\Components\HTML\Table;

Agora sim, vamos iterar:

foreach( $groups as $group => $persons ) {

    // Groups

    $groupRow = new Composite\Components\HTML\Row;

    $groupRow -> add( new Composite\Components\HTML\Cell( $group ) );

    $tableGroup -> add( $groupRow );

    // Persons

    foreach( $persons as $person ) {

        $nameCell = new Composite\Components\HTML\Cell( $person['nome'] );
        $dialCell = new Composite\Components\HTML\Cell( $person['ramal'] );

        $personRow = new Composite\Components\HTML\Row;

        $personRow -> add( $nameCell ) -> add( $dialCell );

        $tableGroup -> add( $personRow );
    }
}

Primeiro criamos uma linha para o Departamento. Criamos um objeto Row e adicionamos nele um objeto Cell com o texto devido. Em seguida adicionamos essa primeira composição à tabela anteriormente criada.

Agora vamos iterar a lista de nomes e telefones. Veja que dessa vez fiz de uma forma diferente. Primeiro criei as duas células e atribuí à elas os valores devidos. Só então criei a linha e efetuei a Composição.

Nada me impediria, por exemplo, de fazer assim:

$personRow = new Composite\Components\HTML\Row;

$personRow -> add( new Composite\Components\HTML\Cell( $person['nome'] ) )
           -> add( new Composite\Components\HTML\Cell( $person['ramal'] ) );

Porém, dessa forma, você engessa o fluxo e impede que as células recebam adereços adicionais (ver abaixo).

Antes de encerrar o loop mais interno, adicionamos a Composição da linha à tabela.

Resta agora renderizar tudo. Fora do loop invocamos o método Drawable::draw() no contexto de Table e o AbstractComponent::drawChildren() nele utilizado vai renderizar tudo de uma vez.

Caso você queira tabelas individuais, uma para cada departamento, basta que a tabela criada em $tableGroup seja feita logo no início do primeiro loop e, sua renderização, logo no final.

Outro ponto a ser considerado é o fato de a linha reservada para o nome do Departamento não se estender por toda a largura da tabela.

Isso foi tanto proposital quanto acidental. Proposital para simplificar a implementação desconsiderando quaisquer atributos para os elementos, como no caso, o colspan na célula das primeiras linhas.

E acidental porque na hora que escrevi esse código, não lembrava como mesclar células >.<

Mas esse tipo de aprimoramento fica agora por sua conta. Você pode, por exemplo, criar um segundo argumento no construtor de Cell, com um array de atributos os quais você inseriria na declaração da TD.

E já que implode() não trabalha com arrays associativos, pode não parecer, mas http_build_query() é fantástico para isso.

Apesar de tudo, vale salientar que, hoje, com as ferramentas de template existentes no mercado, esse tipo de implementação do Composite não é lá muito útil, afinal, é muito mais fácil você abrir e fechar algumas tags PHP e escrever o HTML direto num template, que pode inclusive ser cacheado, do que optar por essa abordagem.

2
  • Apesar de os arquivos no Gist terem me permitido incluir as barras separadoras de diretórios, assim que possível eu edito a resposta para colocar um sketch melhorado. Commented 2/09/2014 às 14:16
  • O que ocorre, no momento que fiz a pergunta, simplifiquei o problema para poder ter auxílio mais facilmente. Quanto a quebrar em camadas, isto foi feito, porém não demonstrei aqui pois utilizo um framework, e desta forma abstrai o problema para focar no algorítimo. Commented 8/09/2014 às 14:32

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .