Condividi con:

Sviluppo moduli per Prestashop 1.6 e 1.7

Nell’articolo precedente abbiamo discusso di come Prestashop ci metta a disposizione degli hook per poter modificare la tabella dei controller del BackOffice senza toccare il core di prestashop.

In questo articolo vedremo come sfruttare questi strumenti per creare un modulo che visualizzi una colonna aggiuntiva nella tabella del controller degli Ordini.

La tabella classica ha questa struttura:

Mentre dopo l’installazione del modulo ci sarà una colonna aggiuntiva dopo il codice dell’ordine, con il tracking della spedizione, se esiste, che quando cliccata apre una nuova finestra con le informazioni della spedizione.

Il modulo fa uso dei due hook trattati nell’articolo precedente e di un altro che serve a caricare un CSS personalizzato per la visualizzazione del tracking, cioè

  • actionAdminOrdersListingResultsModifier
  • actionAdminOrdersListingFieldsModifier
  • backOfficeHeader

Lo scopo di questo modulo è intercettare la preparazione della query e modificarne la struttura per aggiungere il campo tracking_number preso dalla tabella order_carrier e aggiungere la colonna alla tabella per visualizzare il contenuto.

La query è modificata nella funzione hookActionAdminOrdersListingResultsModifier in questo modo:

La funzione viene chiamata due volte, una volta per modificare la query prima di eseguirla e una volta prima di visualizzare la tabella. La prima volta in $params sono contenuti gli elementi per modificare la query che sono:

  • select
  • join
  • where
  • group_by
  • order_by
  • order_way
  • fields

Questi campi contengono parti della query, per es. quando viene chiamata la prima volta la funzione i valori contenuti nella variabile $params sono:

Mentre nell’array fields sono contentute le definizioni delle colonne della tabella:

Quindi, per poter inserire la colonna del tracking delle spedizioni occorre aggiungere il campo nella query e una colonna nelle definizioni.

Impostazione della query di ricerca

La prima parte della funzione si occupa di inserire il campo nella query, controlla infatti se nella variabile $params, esiste la voce select, e quindi aggiunge all’elenco dei select i campi tracking_number e url_carrier. Il primo contiene il tracking vero e proprio, il secondo invece è il parametro che impostate durante la configurazione del corriere, e serve a Prestashop per visualizzare la pagina della spedizione sul sito del corriere. Questi due parametri uniti, daranno l’url finale che serve al modulo per visualizzare la pagina delle informazioni della spedizione. La Query ha bisogno anche dei Join corretti per trovare i campi, quindi si aggiunge all’elemento join, le chiamate alle due LEFT JOIN delle tabelle.

Aggiunta della definizione della colonna alla tabella

La seconda parte della funzione serve ad aggiungere all’array fields, la definizione della colonna. La nuova definizione sarà aggiunta dopo l’id dell’ordine, quindi alla colonna con indice 1 dalla funzione insertValueAtPosition

Per definire la colonna, non basta una cella di testo dove inserire il tracking della spedizione ma bisogna aggiungere altri parametri. La chiave dell’array sarà il nome del campo poco prima definito, quindi tracking_number. È un campo di testo che permette la ricerca, quindi saranno impostati le chiavi filter_key e order_key.

La cella quando sarà cliccata, non deve entrare nell’ordine, ma portarci alla pagina del corriere dove mostra le informazioni della spedizione. Per fare ciò bisogna aggiungere la chiave remove_onclick che disabilita il click predefinito di Prestashop, e dire al controller che si occupa di creare la tabella (helperlist) che il contenuto della cella ha dei tag html, con la chiave float impostata a true.

La definizione appena creata è inserita nell’array fields alla seconda posizione tramite la funzione già citata insertValueAtPosition.

Visualizzazione del tracking

Per visualizzare correttamente il tracking della spedizione, in modo che abbia una colorazione diversa e la possibilità di essere cliccato, bisogna cambiare il valore che restituirà la query, e nello specifico, il valore dell’array tracking_number.

A questo ci pensa l’altro hook messo a disposizione da Prestashop

Questa funzione si occupa di scorrere il contenuto del risultato della query presente in $params['list'] e modificare il campo tracking_number in modo che visualizzi del codice html. Per fare questo abbiamo bisogno di ricorrere alla classe Smarty che si occupa di generare html dal php tramite un template.

La variabile $template infatti punta al file contente il codice tpl che servirà a generare il contenuto della cella. Alla classe Smarty si passano due valori, url e tracking, uno contiene il link alla pagina del corriere, l’altro il valore del tracking della spedizione.

il file tpl è così strutturato:

e genera un campo cliccabile che porta alla pagine del corriere.

Abbellimenti

l’ultimo hook trattato in questo articolo, permette a Prestashop di caricare CSS, JS e Plugin nell’header della pagina. Qui è stato usato per caricare il CSS che permette la visualizzazione della cella e il cambio del colore quando ci si passa con il mouse

il CSS in questione ha questa struttura:

Conclusioni

Alla fine di tutte queste operazioni, una volta installato il modulo, quando si aprirà la pagina degli ordini, la tabella avrà un campo aggiuntivo, ordinabile e di ricerca con il valore del tracking della spedizione.

Con queste poche operazioni, si può fare a meno di toccare il codice nativo di Prestashop e comunque personalizzare al massimo il contenuto delle pagine.

Condividi con:

Condividi con:

Per inserire il compnente tinyMCE in un modulo di Prestashop (v1.6) ci sono due modi diversi:

  • Utilizzando Un template:

Per prima cosa definiamo il componente nella funzione getContent()

Poi creiamo il componente nel template smarty

Condividi con: