rummage_phoenix Download - rummage_phoenix Quellcode herunterladen

rummage_phoenix

Anderer Quellcode

0.6.0

Herunterladen

Stöbern.Phoenix

Rummage.Phoenix ist ein Support-Framework für Phoenix , das zum Bearbeiten Phoenix -Sammlungen und Ecto Modellen mit Such-, Sortier- und Paginierungsoperationen verwendet werden kann.

Es führt die oben genannten Vorgänge aus, indem es Rummage.Ecto verwendet, um Ecto -Abfragen zu paginieren, und fügt Ansichten und Controllern Phoenix- und HTML-Unterstützung hinzu. Informationen zur Konfiguration Rummage.Ecto finden Sie auf dieser Seite.

Das Beste an stöbern ist, dass alle drei Vorgänge: Search , Sort und Paginate nahtlos integriert sind und separat konfiguriert werden können. Um sich über die nahtlose Integration zu informieren, lesen Sie bitte die folgenden Informationen.

HINWEIS: Rummage ist nicht wie Ransack und soll es auch nicht sein. Es werden keine Funktionen hinzugefügt, die auf Suchparametern basieren. Wenn Sie dies für ein Modell wünschen, können Sie Rummage jederzeit so konfigurieren, dass es Ihr Search für dieses Modell verwendet. Aus diesem Grund wurde Rummage konfigurierbar gemacht.

Suchen, sortieren und paginieren Sie nahtlos in Phoenix!

Phönix alle zusammen

Installation

Dies ist in Hex verfügbar, das Paket kann wie folgt installiert werden:

Fügen Sie rummage_phoenix zu Ihrer Abhängigkeitsliste in mix.exs hinzu:

 def deps do
  [
    { :rummage_phoenix , "~> 1.2.0" }
  ]
end

Blogs

Aktuelle Blogs:

Demo und Grundlagen zum Stöbern
Verwenden von Rummage.Ecto
Mit Rummage.Phoenix

Als nächstes kommt:

Verwendung von Rummage.Phoenix 2
Verwenden des Suchhakens „Rumge Search“.
Verwenden des Rumge Sort-Hooks
Schreiben eines benutzerdefinierten Rumage.Ecto-Hooks
Schreiben eines benutzerdefinierten Rummage.Phoenix-HTML-Helfers
Mit anderen Bibliotheken stöbern: Kerosin
Nutzung von Rumge mit anderen Bibliotheken: Scrivener

Konfiguration (Optional, nicht die bevorzugte Methode zum Festlegen von `default_per_page` )

Rumamge.Phoenix kann global mit einem default_per_page -Wert konfiguriert werden (der für ein Modell überschrieben werden kann). Dies ist NICHT die bevorzugte Methode zum Festlegen von default_per_page , da dies zu Konflikten führen kann. Es wird empfohlen, dies pro Modell durchzuführen, wie unten im Abschnitt „Ersteinrichtung“ gezeigt. Wenn Sie default_per_page für alle Modelle festlegen möchten, fügen Sie es der model in web.ex hinzu

Fügen Sie rummage_phoenix -Konfiguration zu Ihrer Konfigurationsliste in dev.exs hinzu:
```
 config :rummage_phoenix ,
  Rummage.Phoenix ,
  default_per_page: 5 
```

Verwendung (Die Screenshots entsprechen der Version 0.6.0, in Kürze wird es Screenshots für die Version 1.0.0 geben)

Ersteinrichtung

Verwenden Sie Rummage.Controller im Controller-Modul:

 defmodule MyApp.ProductController do
  use MyApp.Web , :controller
  use Rummage.Phoenix.Controller

  # More code below....
end

Ändern Sie die index im Controller:

 def index ( conn , params ) do
  { query , rummage } = Product
    |> Rummage.Ecto . rummage ( params [ "rummage" ] )

  products = Repo . all ( query )

  render conn , "index.html" ,
    products: products ,
    rummage: rummage
end

Wenn Sie die Suchfunktion verwenden, definieren Sie einen search in router.ex (die Aktion muss nicht definiert werden):

 scope "/" , MyApp do
  pipe_through :browser # Use the default browser stack

  get "/" , PageController , :index
  resources "/products" , ProductController
end

Dadurch können Sie suchen, sortieren und paginieren, indem Sie params der Anfrage aktualisieren. Weitere Informationen finden Sie in den folgenden Screenshots

Verwenden von Rummage.ViewHelpers

Verwenden Sie Rummage.View in einem Ansichtsmodul:

 defmodule MyApp.ProductView do
  use MyApp.Web , :view
  use Rummage.Phoenix.View

  # More code below...
end

Hinweis: Wenn Sie die Ausnahme „MyApp.Router.Helpers ist nicht verfügbar“ erhalten, können Sie Ihrem Router Folgendes bereitstellen:

 defmodule MyApp.ProductView do
  use MyApp.Web , :view
  use Rummage.Phoenix.View , helpers: MyApp.Web.Router.Helpers

  # More code below...
end

oder über die Konfiguration:

 config :rummage_phoenix, Rummage.Phoenix, [
  default_helpers: MyApp.Web.Router.Helpers,
]

Hinweis: Wenn der Name des Pfadhelfers falsch ist, können Sie ihn wie folgt angeben:

 defmodule MyApp.ProductView do
  use MyApp.Web , :view
  use Rummage.Phoenix.View , struct: "special_product" # will become special_product_path

  # More code below...
end

Pagination:

Fügen Sie dies am Ende von index.html.eex hinzu, um Rummage Paginierungslinks zu rendern (Stellen Sie sicher, dass Sie rummage “ von der index im Controller an die Ansichten übergeben):

 < % = pagination_link ( @ conn , @ rummage ) % >

Laden Sie es neu und so sollte Ihre Seite aussehen:

Phönix-Paginierung

Sortierung:

Ersetzen Sie Tabellenüberschriften in index.html.eex durch Sortierlinks (Stellen Sie sicher, dass es sich bei den Überschriften um tatsächliche Spalten in der Tabelle in der Datenbank handelt.)

Ersetzen Sie dies:

  < th > Name < / th >
  < th > Price < / th >
  < th > Category < / th >

Mit:

  < th > < % = sort_link @ conn , @ rummage , [ field: :name , ci: true ] % > < / th >
  < th > < % = sort_link @ conn , @ rummage , [ field: :price ] % > < /th>

ODER für Sortieren nach Assoziationen:

  < th > < % = sort_link @ conn , @ rummage , [ field: :name , name: "Category Name" , assoc: [ "category" ] ] % > < /th>

Laden Sie die Seite neu und so sollte Ihre Seite mit sortierbaren Links statt nur Tabellenüberschriften aussehen:

Phoenix-Sortierung

HINWEIS: Derzeit wird daran gearbeitet, bessere Elemente zu den Ansichten hinzuzufügen. In Kürze wird der Textpfeil in den Sortierlinks durch ein Symbol ersetzt

Suche:

Fügen Sie in index.html.eex ein Suchformular mit durchsuchbaren Feldern hinzu:

 < % = search_form ( @ conn , @ rummage , [ fields:
[
  name: % { label: "Search by Product Name" , search_type: "ilike" } ,
  price: % { label: "Search by Price" , search_type: "eq" } ,
] , button_class: "btn" ,
] ) % >

ODER für die Suche nach Assoziationen:

 < % = search_form ( @ conn , @ rummage , [ fields:
[
  name: % { label: "Search by Category Name" , search_type: "ilike" , assoc: [ "category" ] }
] , button_class: "btn" ,
] ) % >

Laden Sie es neu und Ihre Seite sollte ungefähr so aussehen: Phönix auf der Suche

ALLE ZUSAMMEN:

Das Beste an Rummage ist, dass sich alle drei Hooks/Operationen nahtlos integrieren lassen, ohne sich gegenseitig in ihrer Funktionalität zu beeinträchtigen. Daher haben Sie eine Seite, die in etwa so aussieht:

Phönix alle zusammen