Fiecare dezvoltator de web știe că crearea unei interfețe de administrare pentru proiectele sale este o sarcină incredibil de plictisitoare. Din fericire, există instrumente care fac această sarcină considerabil mai simplă. În acest tutorial, vă vom arăta cum să utilizați Active Admin, un cadru de administrare lansat recent pentru aplicațiile Ruby on Rails.
Puteți utiliza funcția Administrator activ pentru a adăuga o interfață de administrare la proiectul dvs. curent sau puteți chiar să o utilizați pentru a crea o aplicație web complet de la zero - rapid și ușor.
Astăzi vom face acest lucru, creând un sistem de management de proiect destul de simplu. S-ar putea suna ca un pic de muncă, dar Active Admin va face cea mai mare parte a lucrării pentru noi!
Voi presupune că aveți cunoștințe anterioare privind Ruby on Rails, în special implicând validări ale modelului, deoarece restul interfeței de aplicații vor fi luate în considerare de Active Admin. În afară de asta, ar trebui să aveți un mediu de dezvoltare pentru Ruby on Rails 3.1 deja înființat, inclusiv Ruby 1.9.2.
Consultați acest articol dacă aveți nevoie de asistență pentru a instala Ruby și Rails.
Creați aplicația pe care vom lucra, executând următoarea comandă în terminalul dvs.:
șine noi active_admin
Apoi, deschide-ți Gemfile
și adăugați următoarele rânduri:
gem 'activeadmin' gem 'meta_search', '> = 1.1.0.pre'
Ultima gem este necesară pentru ca Active Admin să lucreze cu Rails 3.1, așa că nu uitați. După ce sa terminat, rulați instalare pachet
comanda pentru a instala pietre. Acum, trebuie să terminăm instalarea administratorului activ, executând următoarea comandă:
șinele generează active_admin: install
Acest lucru va genera toate inițialele și migrațiile necesare pentru funcționarea activă a Administratorului. De asemenea, va crea un AdminUser
model pentru autentificare, așa că alerga rake db: migrați
pentru a crea toate tabelele de baze de date necesare. În afară de asta, trebuie să adăugați o linie la dvs. config / medii / development.rb
dosar, astfel încât trimiterea de e-mailuri funcționează:
config.action_mailer.default_url_options = : host => 'localhost: 3000'
Odată ce sa terminat, fugi rails server
și punctul browser-ul dvs. la localhost: 3000 / admin. Veți fi întâmpinat cu un formular de autentificare frumos. Doar tastați? [email protected]? ca e-mail și parola? ca parola, și a lovit? Login ?. Ar trebui să vedeți acum o interfață de administrare frumoasă.
După cum puteți vedea din pagina web pe care tocmai ați generat-o, nu puteți face încă multe lucruri. Vom avea nevoie de o modalitate de a edita utilizatorii noștri și putem face acest lucru folosind Active Admin. Cadrul folosește ceea ce numește "Resurse". Resursele modelelor harta pentru panouri de administrare. Trebuie să le generați folosind o comandă în terminalul dvs., astfel încât Administratorul activ poate cunoaște existența lor, deci mergeți mai departe și rulați:
șinele generează active_admin: resource AdminUser
Sintaxa pentru comanda respectivă este simplă: trebuie doar să scrieți numele modelului bazei de date la sfârșit. Aceasta va genera un fișier în interiorul app / admin
dosarul, numit admin_users.rb
. Acum, dacă actualizați browserul, veți vedea un nou link în bara de sus, numit "Utilizatori Admin" ?. Dacă faceți clic pe aceasta, veți ajunge în panoul de administrare al utilizatorului de administrare. Acum, probabil că ar fi cam prea aglomerat, deoarece, în mod prestabilit, Active Admin afișează toate coloanele modelului, și având în vedere că cadrul utilizează Devise pentru autentificare, veți vedea o grămadă de coloane care nu sunt cu adevărat necesare. Acest lucru ne duce la prima parte a personalizării noastre: pagina index.
Personalizarea resurselor Active Admin este destul de ușoară (și amuzantă dacă mă întrebați). Deschis app / admin / admin_users.rb
pe editorul dvs. de text preferat și faceți ca acesta să arate astfel:
ActiveAdmin.register AdminUser indexează coloana: coloana de e-mail: coloana curentă_sign_in_at: coloana last_sign_in_at: sign_in_count default_actions sfârșitul final
Să examinăm codul:
index
ne permite să personalizăm vizualizarea index, care este tabelul care arată toate rândurile.index
metodă, specificați care dintre coloane sunteți do doriți să apară pe masă, adică. scris coloană: e-mail
va avea Active Admin să afișeze coloana din vizualizare.default_actions
este o metodă convenabilă care creează o ultimă coloană cu legături către detaliu, ediție și ștergere a rândului.Un ultim pas pentru această viziune este personalizarea formularului. Dacă faceți clic pe "Utilizator nou administrator"? linkul din partea dreaptă sus, veți vedea că formularul conține, de asemenea, toate coloanele din model, ceea ce, evident, nu este foarte util. Deoarece Active Admin utilizează Devise, trebuie să introduceți doar o adresă de e-mail pentru a crea un utilizator, iar restul ar trebui să fie luate în considerare de gem autentificare. Pentru a personaliza formularele afișate de Administratorul activ, există o metodă numită (ați ghicit-o) formă
:
ActiveAdmin.register AdminUser face indicele # #? forma finală nu | f | f.inputs "Detalii administrator" fa f.input: sfârșitul e-mailului f.buttons sfârșitul final
Dacă codul vă arată familiar, ați folosit probabil bijuteria Formtastic înainte. Să aruncăm o privire la cod:
formă
metodă și trecând un bloc cu un argument (f
în acest caz).f.inputs
creează un set de câmpuri. Cuvant de sfat: tu avea pentru a adăuga cel puțin un set de câmpuri. Câmpurile din afara unuia nu vor apărea pur și simplu în vizualizare.f.input
și treceți un simbol cu numele coloanei modelului, în acest caz, "e-mail"?.f.buttons
creează "Trimiteți"? și? Anulați? butoane.Puteți personaliza și mai mult formularele utilizând formatul DSL (Domain Specific Language) oferit de Formtastic, deci aruncați o privire la tutoriale despre această bijuterie.
Un ultim pas pentru ca acest formular să funcționeze: deoarece nu furnizăm o parolă, Devise nu ne va permite să creăm înregistrarea, așa că trebuie să adăugăm un cod la AdminUser
model:
după_create | admin | admin.send_reset_password_instructions def parola_required? un nou record? ? fals: super-sfârșit
after_create
inversarea apelurilor asigură faptul că Devise trimite utilizatorului o legătură pentru a crea o nouă parolă și password_required?
metoda ne va permite să creăm un utilizator fără a ne oferi o parolă.
Du-te și încercați. Creați un utilizator și apoi verificați e-mailul pentru un link, care vă va permite să creați o nouă parolă și să vă conectați la sistem.
Vom crea un simplu sistem de management al proiectelor. Nu este ceva prea complicat, ci doar ceva care ne va permite să gestionăm proiectele și sarcinile pentru proiect și să atribuim sarcini anumitor utilizatori. Primul lucru este de a crea un model de proiect:
șinele generează un model Titlul proiectului: șir
Active Admin se bazează pe modelele Rails pentru validare și nu vrem proiecte fără titlu, deci adăugăm câteva validări modelului generat:
# șine validează: titlu,: prezență => adevărat
Acum, trebuie să generăm o resursă Active Admin, executând:
șinele generează activ_admin: resource Project
Pentru moment, asta e tot ce avem nevoie pentru proiecte. După migrarea bazei dvs. de date, aruncați o privire la interfața pe care tocmai ați creat-o. Crearea unui proiect fără titlu nu reușește, ceea ce ne-am așteptat. Vedeți cât de mult ați realizat cu doar câteva rânduri de cod?
Proiectele nu sunt foarte utile fără a avea dreptate? Să adăugăm că:
șine genera modelul Task project_id: integer admin_user_id: nume întreg: string is_done: boolean due_date: date
Acest lucru creează un model de activitate pe care îl putem asocia cu proiectele și utilizatorii. Ideea este că o sarcină este atribuită unei persoane și aparține unui proiect. Trebuie să stabilim aceste relații și validări în model:
clasa Task < ActiveRecord::Base belongs_to :project belongs_to :admin_user validates :title, :project_id, :admin_user_id, :presence => validează valid: is_done,: inclusion => : in => [true, false] sfârșit
Nu uitați să adăugați relațiile la modelele Project și AdminUser:
clasa AdminUser < ActiveRecord::Base has_many :tasks #? end
clasă < ActiveRecord::Base has_many :tasks #? end
Migrați baza de date și înregistrați modelul de activitate cu Active Admin:
șinele generează activ_admin: resursă Activitate
Acum, mergeți și aruncați o privire la panoul de sarcini din browserul dvs. Tocmai ați creat un sistem de management de proiect! Bună treabă.
Sistemul pe care tocmai l-am creat nu este prea sofisticat. Din fericire, Active Admin nu are doar rolul de a crea un sistem frumos de schele, ci vă oferă mult mai multă putere decât asta. Să începem cu secțiunea Proiecte. Nu avem nevoie de adevărat id
, creată
și la curent
coloane acolo, și cu siguranță nu trebuie să putem căuta utilizând coloanele respective. Să facem acest lucru:
index face coloana: titlu nu | proiect | link_to project.title, admin_project_path (project) sfârșitul default_actions end # Filtrați numai după filtrul de titlu: titlu
Câteva note aici:
filtru
pentru fiecare coloană cu care doriți să filtrați.Pagina detaliilor proiectului este un pic plictisitor, nu crezi? Nu avem nevoie de ele Data
coloanele și id
aici, și am putea arăta mai direct o listă a sarcinilor. Particularizarea paginii cu detalii se realizează prin utilizarea funcției spectacol
metodă în app / admin / projects.rb
fişier:
arată: title =>: panoul de titlu "Sarcini" nu face table_for project.tasks do | t | t.column ("Stare") | task status_tag (task.is_done? "Done": "În așteptare"), (task.is_done ?: ok:: error) t.column ("Title" link_to task.title, admin_task_path (task) t.column ("Atribuit la") | task | task.admin_user.email t.column ("Data expirării") | task | task.due_date? ? l (task.due_date,: format =>: lung): '-' end end end
Să mergem prin cod:
arată: titlu =>: titlu
specifică titlul pe care îl va avea pagina. Al doilea :titlu
specifică coloana modelului care va fi utilizată.panoul "Sarcini"
vom crea un panou cu titlul dat. În cadrul acestuia, vom crea o tabelă personalizată pentru sarcinile proiectului, folosind table_for
.status_tag
este o metodă care face ca cuvântul să treacă cu un stil foarte frumos și puteți defini culoarea prin trecerea unui al doilea argument cu oricare dintre acestea : O.K
, :avertizare
și :eroare
pentru culorile verde, portocaliu și roșu.Ce zici de o modalitate ușoară de a filtra sarcinile care se datorează în această săptămână? Sau sarcini care sunt întârziate? Asta e ușor! Utilizați doar un domeniu de aplicare. În tasks.rb
fișier, adăugați aceasta:
domeniu: toate,: implicit => adevărat domeniu de aplicare: due_this_week do | tasks tasks.where ("due_date>? and due_date < ?', Time.now, 1.week.from_now) end scope :late do |tasks| tasks.where('due_date < ?', Time.now) end scope :mine do |tasks| tasks.where(:admin_user_id => current_admin_user.id) sfârșit
Să examinăm codul respectiv:
domeniul de aplicare: toate
definește domeniul de aplicare implicit, afișând toate rândurile.domeniu
acceptă un simbol pentru nume și puteți trece un bloc cu un argument. În interiorul blocului puteți rafina o căutare în funcție de ceea ce aveți nevoie. De asemenea, puteți defini domeniul de aplicare al modelului și pur și simplu îl numiți la fel ca în acest fișier.current_admin_user
.Verifică! Chiar deasupra tabelului, veți vedea câteva linkuri, care vă vor arăta rapid câte sarcini există pe domeniu și vă permit să filtrați rapid lista. Ar trebui să personalizați în continuare tabelele și filtrele de căutare, dar vă voi lăsa acea sarcină.
Acum vom schimba un detaliu al detaliilor sarcinii, deoarece pare destul de aglomerat:
a se vedea panoul "Detalii de sarcină" nu face attributes_table_for sarcina do row ("Stare") status_tag (task.is_done? "Done": "În așteptare"), (task.is_done?: ok: ) rând task.title ("Proiect") link_to task.project.title, admin_project_path (task.project) rând ("Atribuit la") link_to task.admin_user.email, admin_admin_user_path (task.admin_user) ("Data la termen") task.due_date? ? l (task.due_date,: format =>: lung): '-' end end activ_admin_comments sfarsit
Aceasta va arăta un tabel pentru atributele modelului (de aici numele metodei, attributes_table_for
). Specificați modelul, în acest caz sarcină
, iar în blocul trecut ați definit rândurile pe care doriți să le afișați. Este aproximativ același lucru pe care l-am definit pentru pagina de detaliu a proiectului, numai pentru sarcină. S-ar putea să vă întrebați: Ce este asta? Active_admin_comments? metoda de apel pentru? Ei bine, Active Admin oferă un sistem simplu de comentare pentru fiecare model. L-am activat aici pentru că comentarea unei sarcini ar putea fi foarte utilă pentru a discuta despre funcționalitate sau ceva similar. Dacă nu numiți această metodă, comentariile vor fi ascunse.
Mai este un lucru pe care aș dori să-l arăt atunci când văd detaliile unei sarcini, și asta e restul sarcinilor cesionarului pentru acel proiect. Acest lucru este ușor de făcut folosind bare laterale!
bara laterala "Alte sarcini pentru acest utilizator",: only =>: show do table_for current_admin_user.tasks.where (: project_id => task.project) nu | t.column ("Stare") | task status_tag (task.is_done? "Done": "În așteptare"), (task.is_done ?: ok:: error) t.column ("Title" link_to task.title, admin_task_path (task) capăt sfârșit
Acest lucru creează un panou de bara laterală, intitulat? Alte sarcini pentru acest utilizator ?, care este afișat numai pe "show"? pagină. Acesta va arăta un tabel pentru curentadminutilizatorul și toate sarcinile în care proiectul este același cu proiectul prezentat (vedeți, sarcină
aici se va face referire la sarcina afișată, deoarece este o pagină de detaliu pentru unu sarcină). Restul este mai mult sau mai puțin același ca înainte: unele coloane cu detalii despre sarcină.
S-ar putea să fi observat, când ați lansat pentru prima oară browserul dvs. și v-ați conectat la aplicația dvs., că a existat un tablou de bord? secțiune. Aceasta este o pagină complet personalizabilă unde puteți afișa aproape orice: tabele, statistici, orice. Vom adăuga lista de sarcini a utilizatorului ca exemplu. Deschideți dashboards.rb
fișier și revizuiți-l, după cum urmează:
ActiveAdmin :: Dashboards.build do secțiunea "Sarcinile dvs. pentru această săptămână" face table_for current_admin_user.tasks.where ("due_date>? And due_date < ?', Time.now, 1.week.from_now) do |t| t.column("Status") |task| status_tag (task.is_done ? "Done" : "Pending"), (task.is_done ? :ok : :error) t.column("Title") |task| link_to task.title, admin_task_path(task) t.column("Assigned To") |task| task.admin_user.email t.column("Due Date") |task| task.due_date? ? l(task.due_date, :format => : long): '-' capăt capăt secțiunea "Sarcini care sunt târziu" face table_for current_admin_user.tasks.where ('due_date < ?', Time.now) do |t| t.column("Status") |task| status_tag (task.is_done ? "Done" : "Pending"), (task.is_done ? :ok : :error) t.column("Title") |task| link_to task.title, admin_task_path(task) t.column("Assigned To") |task| task.admin_user.email t.column("Due Date") |task| task.due_date? ? l(task.due_date, :format => : long): '-' sfârșitul capătului final
Codul ar trebui să vă fie destul de familiar. Creează, în esență, două secțiuni (folosind secțiune
metoda și un titlu), fiecare cu câte un tabel, care afișează sarcinile actuale și cele târzii.
Am creat o aplicație extinsă în câțiva pași. S-ar putea să fiți surprins să aflați că există mult mai multe caracteristici pe care Active Admin le poate oferi, dar nu este posibil să le acoperiți pe toate într-un singur tutorial, desigur. Dacă sunteți interesat să aflați mai multe despre această bijuterie, vizitați activadmin.info.
De asemenea, ați putea dori să verificați proiectul meu, numit activ_invoices pe GitHub, care este o aplicație completă de facturare realizată în întregime cu Active Admin. Dacă aveți întrebări, nu ezitați să le întrebați în comentarii sau trimiteți-mi un tweet.