PhxAdmin v0.9.1 PhxAdmin
PhxAdmin is a an auto administration tool for the PhoenixFramework, providing a quick way to create a CRUD interface for administering Ecto models with little code and the ability to customize the interface if desired.
After creating one or more Ecto models, the administration tool can be used by creating a resource model for each model. The basic resource file for model … looks like this:
# web/admin/my_model.ex
defmodule MyProject.PhxAdmin.MyModel do
use PhxAdmin.Register
register_resource MyProject.MyModel do
end
end
This file can be created manually, or by using the mix task:
mix admin.gen.resource MyModel
PhxAdmin adds a menu item for the model in the admin interface, along with the ability to index, add, edit, show and delete instances of the model.
Many of the pages in the admin interface can be customized for each model using a DSL. The following can be customized:
index
- Customize the index pageshow
- Customize the show pageform
- Customize the new and edit pagesmenu
- Customize the menu itemcontroller
- Customer the controller
Custom Ecto Types
Map Type
By default, PhxAdmin used Poison.encode! to encode Map
type. To change the
decoding, add override the protocol. For Example:
defimpl PhxAdmin.Render, for: Map do
def to_string(map) do
{:ok, encoded} = Poison.encode map
encoded
end
end
As well as handling the encoding to display the data, you will need to handle
the params decoding for the :create
and :modify
actions. You have a couple
options for handling this.
- In your changeset, you can update the params field with the decoded value
- Add a controller
before_filter
in your admin resource file.
For example:
register_resource AdminIdIssue.UserSession do
controller do
before_filter :decode, only: [:update, :create]
def decode(conn, params) do
if get_in params, [:usersession, :data] do
params = update_in params, [:usersession, :data], &(Poison.decode!(&1))
end
{conn, params}
end
end
end
Other Types
To support other Ecto Types, implement the PhxAdmin.Render protocol for the
desired type. Here is an example from the PhxAdmin code for the Ecto.Date
type:
defimpl PhxAdmin.Render, for: Ecto.Date do
def to_string(dt) do
Ecto.Date.to_string dt
end
end
Adding Custom CSS or JS to the Layout Head
A configuration item is available to add your own CSS or JS files
to the <head>
section of PhxAdmin’s layout file.
Add the following to your project’s config/config.exs
file:
config :phx_admin,
head_template: {ExAdminDemo.AdminView, "admin_layout.html"}
Where:
ExAdminDemo.AdminView
is a view in your projectadmin_layout.html
is a template inweb/templates/admin
directory
For example:
in web/templates/admin/admin_layout.html.eex
<link rel='stylesheet' href='<%= static_path(@conn, "/css/admin_custom.css") %>'>
<!--
since this is rendered into the head area, make sure to defer the loading
of your scripts with `async` to not block rendering.
-->
<script async src='<%= static_path(@conn, "/js/app.js") %>'></script>
in priv/static/css/admin_custom.css
.foo {
color: green !important;
font-weight: 600;
}
Changing the layout footer
Changing the content of the footer can be done through PhxAdmin’s configuration options.
Add the following to your project’s config/config.exs
file:
config :phx_admin,
footer: "© Project Name"
Adding SwitchUser Select Box
At times, you may want an easy way to switch between users while developing and manually testing an project. PhxAdmin supports this feature through configuration and a plug.
When enabled, a select box is displayed on the top right of each page. When a new user is selected, the existing user is logged out and the new user automatically logged in without requiring a password.
Obviously, this is not a feature you will want on a production server. So, to
configure SwitchUser for :dev
environment:
# web/router.ex
pipeline :protected do
plug :accepts, ["html"]
# ...
if Mix.env == :dev do
plug PhxAdmin.Plug.SwitchUser
end
end
# config/dev.exs
config :phx_admin,
logout_user: {Coherence.ControllerHelpers, :logout_user},
login_user: {Coherence.ControllerHelpers, :login_user}