AngularJS și Laravel începeți să construiți un CRM

Atunci când creați o aplicație de o singură pagină, ar trebui să folosim un anumit cadru pentru a face o treabă pentru noi, astfel încât să ne putem concentra asupra funcționalității reale. AngularJS se potrivește perfect aici, deoarece caracteristici cum ar fi injecția dinamică a dependenței și legarea datelor bidirecționale sunt doar minunate. Uneori avem nevoie și de un server. Dacă ați ales PHP, atunci Laravel ar putea fi cea mai bună opțiune, deoarece este ușor să lucrați și destul de puternic.

Introducere

În acest tutorial veți crea un sistem simplu de gestionare a clienților / tranzacțiilor cu capacitatea de a adăuga și elimina ambele tranzacții și clienți. Probabil că nu este genul de lucru pe care îl faci foarte des, dar arată cum să folosești caracteristicile ambelor cadre.

Înainte de a începe, trebuie să configurați o bază de date MySQL pe care o vom folosi (Laravel susține mai multe dintre ele, dar acesta este în continuare cel mai popular). Nu aveți nevoie de un server web, deoarece vom folosi sistemul PHP încorporat (dar vă rugăm să rețineți că această soluție este doar pentru dezvoltare și nu ar trebui niciodată utilizată în producție - acesta nu are multe caracteristici necesare pentru ca aplicația dvs. să funcționeze corect în public). Pentru aceasta, vom avea nevoie cel puțin de PHP versiunea 5.4.0.

preparare

Primul lucru pe care trebuie să-l facem este să instalăm Laravel. Procesul complet este descris pe site-ul Laravel. După aceea, ar trebui să aveți directorul de proiect creat cu toate fișierele lui Laravel acolo. Navigați la acel director din linia de comandă și rulați această comandă acolo:

php artisan servi

Dacă totul este OK, ar trebui să vedeți că serverul de dezvoltare locală a fost pornit locahost: 8000. Deschideți browserul și navigați acolo, ar trebui să vedeți pagina de întâmpinare a lui Laravel:


Acum putem trece la aplicația actuală.

Migrații și modele

Modelele din Laravel sunt la fel ca în orice alt cadru MVC. Utilizează ORM Eloquent pentru a ușura munca pentru tine - probabil că nu vei mai avea nevoie să mai faci o interogare SQL (dacă nu vrei ceva ce Eloquent nu suportă). Folosind migrațiile puteți modifica structura bazei de date cu posibilitatea de a schimba modificările în cazul în care ceva nu merge bine. Puteți citi mai multe despre migrațiile din documentație.

În aplicația noastră vom folosi două modele:

  • Client - va deține datele despre clienți
  • Tranzacţie - va deține informațiile despre o tranzacție

Să începem prin crearea de migrații pentru ei. Dacă nu ați făcut deja acest lucru, închideți serverul pe care l-am început mai devreme (Ctrl + C).

clienţii

Mai întâi, invoca această comandă:

php artisan migrează: face create_customers_table

Acest lucru va crea un fișier de migrare cu o structură de bază pentru dvs. Acum navigați la app / baze de date / migrări. Ar trebui să existe un fișier cu numele său care începe cu un marcaj de timp și se termină cu "create_customers_tableLaravel a creat automat această structură de bază pentru tine sus() metoda se numește atunci când se aplică migrarea și jos() când este întoarsă.

Primul apel Schema :: crea () metodă. Este nevoie de două argumente - numele schemei și o funcție de apel invers:

Schema :: create ('clienți', funcție ($ table) 

Callback-ul este executat atunci când tabela este creată. Obiectul tabel este trecut ca masă de $ variabilă și manipulăm structura tabelului folosind-o. Să adăugăm o creștere automată id camp:

 $ Table-> trepte ( 'id');

În continuare vor fi trei câmpuri de caractere pentru numele, prenumele și adresa de e-mail ale clientului:

 $ Table-> string ( 'first_name'); $ Table-> string ( 'last_name'); $ Table-> string ( 'e-mail') -> unic ();

Noi facem e-mail domeniu unic prin apelarea unic() pe ea.

Ultima metodă este pentru timbre:

 $ Table-> timestamps (); );

Acest lucru va crea două câmpuri de date în schemă: creat la și updated_at. Acestea vor fi utilizate de către Elocvent pentru a stoca momentul în care elementul a fost creat și actualizat.

În cele din urmă, codul ar trebui să arate astfel:

funcția ($ table) $ table-> increments ('id'); $ table-> șir ('first_name'); $ table-> string (' ()); $ table-> string ('email') -> unic (); $ table-> timestamps ();); 

jos() metoda este mult mai simplă - șterge doar schema:

funcția publică jos () Schema :: drop ("clienți"); 

tranzacţii

Codul de aici va fi similar cu cel al clienților. Mai întâi invoca această comandă:

php artisan migrate: face create_transactions_table

Acum localizați fișierul corespunzător în app / baze de date / migrări și deschide-o. Ca și mai devreme, începeți prin a crea schema:

Schema :: create ('transactions', function ($ table) 

Acum adăugați câmpurile pentru id, numele tranzacției, costul acesteia și id-ul clientului căruia îi aparține:

 $ Table-> trepte ( 'id'); $ Table-> string ( 'nume'); $ Table-> float ( 'valoare'); $ Table-> întreg ( 'CUSTOMER_ID');

Și, bineînțeles, timbrele:

 $ Table-> timestamps (); );

Codul final ar trebui să arate astfel:

funcția ($ table) $ table-> increments ('id'); $ table-> șir ('name'); $ table-> float (' suma '); $ table-> integer (' client_id '); $ table-> timestamps ();); 

Și acum jos() metodă:

funcția publică jos () Schema :: drop ("tranzacții"); 

Configurarea bazei de date

Acum, înainte de a aplica migrațiile, va trebui să configurați conexiunea la baza de date. Deschide app / config / database.php fișier și mergeți la linie 55. Aici sunt datele de configurare pentru MySQL (există puține altele, de exemplu, ați putea folosi SQLite sau Postgres):

'mysql' => array ('driver' => 'mysql', // driver de bază de date, nu atingeți 'host' => 'localhost', // gazdă a bazei de date, de obicei localhost, baza de date a serverului "=>" baza de date ", // numele bazei de date pe care o folosiți, trebuie să fie creată mai devreme 'username' => 'root', // username pe care scriptul îl va folosi pentru a vă conecta, Utilizarea root pentru această parolă => ", // parola pentru utilizatorul de mai sus, este mai bine să nu folosiți o caractere goale 'charset' => 'utf8', // codarea db 'collation' => 'utf8_unicode_ci ', // setarea de colaționare db' prefix '=> ", // prefixul tabelelor bazei de date, util dacă aveți mai multe scripturi utilizând aceeași bază de date),

După ce ați completat acest lucru, sunteți bine să mergeți. Asigurați-vă că ați salvat fișierul și apelați această comandă din directorul principal al aplicației dvs. (cel cu artizan fișier în el):

php artizan migrează

Si asta e. Dacă nu au existat erori, înseamnă că tabelele au fost create cu succes. Vă puteți conecta la db folosind, de exemplu, phpMyAdmin pentru a verifica manual dacă doriți.

modele

În Laravel, crearea unui model după ce ați configurat baza de date utilizând migrațiile este foarte rapidă. Navigheaza catre app / modele și ștergeți exemplul User.php fișier care este acolo. Acum creați două fișiere numite Customer.php și Transaction.php.

Sa incepem cu Customer.php. Fiecare model din Laravel trebuie să extindă Elocvent clasă:

clientul de clasă extinde elocvent 

Acum vom defini o relație între client și tranzacțiile lor. Acest lucru se face prin definirea unei metode publice în model cu numele proprietății pe care am dori să o avem în acest model (în acest caz tranzacții):

 funcțiile publice () 

Acum, în corpul funcției va exista o singură linie:

 returnați $ this-> hasMany ("Transaction"); 

Acest lucru spune Eloquent că ar trebui să furnizeze toate tranzacțiile Număr de înregistrare client a clientului sub o proprietate numită tranzacții.

Acum vom face aproape același lucru pentru tranzacții, dar vom inversa relația pentru ca proprietarul tranzacției să fie accesibil prin intermediul client proprietate:

clasa Tranzacție extinde Elocvent client funcția publică () return $ this-> belongsTo ("Client"); 

Acest lucru se face folosind $ This-> belongsTo () metoda modelului.

controlerele

Acum, pentru a folosi de fapt modelele pe care le avem pentru a crea controlori pentru ei. Deplasați-vă la app / controlere director, ștergeți HomeController.php numai - BaseController.php este importantă deoarece controlorii noștri îl vor extinde. Acum creați două fișiere: CustomerController.php și TransactionController.php.

CustomerController

Acest controler va gestiona tot ce are legătură cu clienții - adăugând, eliminând și afișând o listă a acestora. Începeți prin definirea clasei:

clasa CustomerController extinde BaseController 

Vom folosi funcția lui Laravel numită controlorii RESTful. Aceasta face ca crearea de trasee să fie mai ușoară, deoarece trebuie să definim doar URI de bază, iar Laravel se va ocupa de toate pentru noi. Acest lucru vă cere să începeți numele funcțiilor cu verbul HTTP corespunzător și apoi să continuați cu numele subrutut (folosind camelCase). Deci, de exemplu, dacă am avea o metodă numită getNames și URI de bază ar fi / clienti, atunci metoda va fi accesibilă la / clienti / nume.

getIndex (), postIndex (), deleteIndex () metode etc. vor fi mapate la ruta implicită (în acest caz / clienti).

Acum să definim prima noastră rută - obținerea clientului prin id-ul lor:

 funcția publică getIndex () 

Să obținem ID-ul din parametrii de interogare (Laravel oferă un frumos Intrare clasa de a face cu asta, deci nu trebuie să utilizați $ _GET, $ _POST și $ _FILES):

 $ id = intrare :: obține ('id');

Și căutați utilizatorul din baza de date utilizând acel id:

 return Client :: gaseste ($ id); 

Fiecare metodă a controlerului trebuie să returneze o valoare care este un șir sau are a __toString () metodă. În acest caz Client modelul care este returnat va fi convertit în JSON înainte de a trimite.

Acum permiteți întoarcerea unei liste cu toți utilizatorii (aceasta va fi accesibilă sub / Clienții / toate):

 funcția publică getAll () return Client :: all (); 

După cum puteți vedea, putem obține toți clienții care folosesc modelul toate() metodă.

Acum cea mai lungă parte, adăugând un nou client:

 funcția publică postIndex () 

Mai întâi să verificăm dacă toate informațiile necesare au fost furnizate. Putem face acest lucru folosind Intrare :: are () metodă:

 dacă (Input :: are ('first_name', 'last_name', 'email')) 

Să punem toate câmpurile de intrare în $ intrare pentru a evita apelurile Intrare :: get () peste si peste. Acest lucru se poate face folosind Intrare :: toate ():

 $ input = intrare :: toate ();

Apoi vom verifica dacă una dintre intrările este goală. Dacă da, vom returna o eroare HTTP 400 Bad Request cu un mesaj mai detaliat:

 dacă $ input ['first_name'] == "|| $ input ['last_name'] ==" || $ input ['email'] == ") return răspuns :: make (' din câmpurile de intrare ", 400);

Deoarece am vrut să returnăm un cod de stare altul decât 200, în loc să întoarcem doar mesajul ca un șir, am folosit Răspuns :: face (), care ia datele pentru a trimite ca primul parametru și codul de stare ca al doilea. Uitați-vă la docs dacă doriți să aflați mai multe despre răspunsuri.

Acum, în final, creăm un nou Client model și să-l hrăniți cu datele furnizate:

 $ client = client nou; $ client-> first_name = $ input ['first_name']; $ client-> last_name = $ input ['last_name']; $ customer-> email = $ input ['email'];

După aceasta putem salva modelul nou creat și putem răspunde cererii împreună cu acesta:

 $ De client> Salvați (); returneaza $ client;

Aici ne ocupăm de cazul în care nu s-au furnizat toate intrările:

  altceva return Response :: make ('Trebuie să completați toate câmpurile de intrare', 400); 

În cele din urmă, avem nevoie și de abilitatea de a elimina clienții. Aceasta este foarte scurtă:

 funcția publică deleteIndex () 

Începem prin a șterge id-ul clientului:

 $ id = intrare :: obține ('id');

Apoi, căutăm și ștergem clientul:

 $ client = Client :: găsi ($ id); $ De client> șterge ();

După aceasta, răspundem solicitării cu codul furnizat:

 returnați $ id; 

Acum, înainte ca rutele să poată fi accesate, trebuie să le prindem. Deschide app / routes.php fișier, ștergeți totul, dar comentariul și adăugați această linie la sfârșitul fișierului:

Route :: controller ('/ clienți', 'CustomerController');

Acest lucru îi va spune lui Laravel că va căuta toate cererile la / clienti pentru noi CustomerController. Acum poți folosi CURL pentru a te juca cu el. Mai întâi porniți serverul cu php artisan servi apoi puteți crea, de exemplu, un client:

curl -X POST -d "[email protected]" http: // localhost: 8000 / clienți

Apoi puteți obține lista tuturor clienților:

curl http: // localhost: 8000 / clienți / toți

TransactionController

Aceasta, ca și modelul, este foarte asemănătoare cu modelul CustomerController. Mai întâi creați clasa:

clasa TransactionController extinde BaseController 

Apoi, să definim metoda pentru a obține toate tranzacțiile pentru un utilizator:

 funcția publică getIndex () $ id = Input :: get ('id'); return User :: găsi ($ id) -> tranzacții; 

După cum puteți vedea, folosim relația definită mai devreme pentru a obține tranzacțiile (acum reamintește interogarea pe care a trebuit să o scrieți pentru a realiza același lucru utilizând simpla PHP și SQL).

Următorul lucru va fi crearea de tranzacții:

 funcția publică postIndex () 

Ca și mai devreme, verificăm dacă sunt furnizate toate informațiile necesare:

 dacă (Input :: are ('name', 'amount')) 

Dacă da, atribuiți-o unui $ intrare variabil:

 $ input = intrare :: toate ();

Verificați dacă una dintre valorile furnizate este goală și, dacă este cazul, returnați o eroare:

 dacă ($ input ['name'] == "|| $ input ['amount'] ==") return Response :: make ('Trebuie să completați toate câmpurile de intrare', 400); 

Acum creați tranzacția și furnizați-o cu toate informațiile furnizate:

 $ transaction = tranzacție nouă; $ transaction-> name = $ input ['nume']; $ transaction-> amount = $ input [suma];

Acum trebuie să-l adăugăm la clientul potrivit. Să le găsim după codul furnizat și să adăugăm $ tranzacție la lista lor de tranzacții:

 $ id = $ input ['client_id']; Utilizator :: găsi ($ id) -> transactions-> salvați ($ tranzacție);

Acest lucru se face folosind transactions-> Salvare () metoda oferită de Laravel. Acum putem răspunde cu tranzacția creată:

 returnați tranzacția $;

Și să se ocupe de cazul în care nu au fost furnizate sau nu toate datele:

  altceva return Response :: make ('Trebuie să completați toate câmpurile de intrare', 400); 

Apoi, există și o metodă de ștergere a tranzacției în același mod în care am șters clientul:

 funcția publică deleteIndex () $ id = Input :: get ('id'); $ transaction = Tranzacție :: găsi ($ id); $ Transaction-> șterge (); returnați $ id; 

Acum, adăugați ruta și puteți testa controlerul folosind CURL:

Route :: controler ('/ transactions', 'TransactionController');

Concluzie

În fine, acesta este sfârșitul primei părți - în partea a doua a acestui tutorial, vom crea front-end folosind AngularJS. Simțiți-vă liber să adăugați mai multe funcții în aplicația dvs. (cum ar fi modificarea clienților sau sortarea), în cazul în care nu ați găsit informațiile pe care le căutați, aruncați o privire la documentația Laravel.

Cod