摘要：通過來實(shí)現(xiàn)一個基本的管理面板目前，我們還沒法使用博客的來寫新的文章，或修改評論。提供了一個即開即用的模塊，可以快速生成一個基本的管理面板。這是因?yàn)槟J(rèn)是以的輸出來得到一個模型對象的表示。在本教程的最后一章，你會學(xué)到關(guān)于本地化信息的更多東西。

目前，我們還沒法使用博客的UI來寫新的文章，或修改評論。Play提供了一個即開即用的CRUD模塊，可以快速生成一個基本的管理面板。

一個Play應(yīng)用可以由幾個模塊組裝起來。這使得你可以在不同應(yīng)用間重用組件或分割一個大應(yīng)用到幾個小的。

CRUD模塊是一個通用的應(yīng)用，可以對模型類進(jìn)行內(nèi)省生成簡單的列表和表單。

要啟動CRUD模塊，在/conf/dependencies.yml的require后面添加一行：（注意play后面的箭頭兩邊需要留空格?。?/p>

require:
    - play
    - play -> crud

現(xiàn)在運(yùn)行play dependencies命令，來解決新的模塊依賴關(guān)系。如果正用著IDE，你應(yīng)該更新項(xiàng)目配置，來包括新的模塊依賴：比如，運(yùn)行play eclipsify，在Eclipse里重新導(dǎo)入項(xiàng)目，然后按F5刷新項(xiàng)目。

然后這個模塊提供一系列現(xiàn)在就能用上的路由。要導(dǎo)入這些路由，在/yabe/conf/routes加入：

# Import CRUD routes
*      /admin              module:crud

這將導(dǎo)入所有的CRUD路由，并以/admin作為URL前綴。

你需要重啟應(yīng)用來使得新模塊的導(dǎo)入生效。

對于每個想集成到管理面板的模型，我們得聲明一個繼承自controllers.CRUD的控制器。這很簡單。

給每個模型創(chuàng)建各創(chuàng)建一個控制器。比如，對于Post類，在/yabe/app/controllers/Posts.java創(chuàng)建一個Posts控制器。

package controllers;

import play.*;
import play.mvc.*;

public class Posts extends CRUD {    
}

  
默認(rèn)控制器的命名，是其對應(yīng)的模型的復(fù)數(shù)。這樣，Play就能自動搭配每個控制器和對應(yīng)的模型。如果你需要指定特別的名字，你可以使用@CRUD.For注解。閱讀CRUD文檔。

同樣創(chuàng)建其他的控制器：

package controllers;

import play.*;
import play.mvc.*;

public class Users extends CRUD {    
}
package controllers;

import play.*;
import play.mvc.*;

public class Comments extends CRUD {    
}
package controllers;

import play.*;
import play.mvc.*;

public class Tags extends CRUD {    
}

現(xiàn)在打開http://localhost:9000/admin/，你應(yīng)該看到管理面板。

如果仔細(xì)看，你將注意到列表中對象的名字有點(diǎn)奇怪。這是因?yàn)槟J(rèn)是以toString()的輸出來得到一個模型對象的表示。

所以，通過提供定制的toString()，我們就能解決這個問題。舉個例子，對于User類：

…
public String toString() {
    return email;
}
…

通常使用管理面板的問題是，提交的表單沒有經(jīng)過恰當(dāng)?shù)尿?yàn)證。但因?yàn)镃RUD模塊可以從驗(yàn)證注解提取出驗(yàn)證規(guī)則，所以如果模型類得到正確注解，就不會有問題。

讓我們給User類添加一些注解。

package models;

import java.util.*;
import javax.persistence.*;

import play.db.jpa.*;
import play.data.validation.*;

@Entity
public class User extends Model {

    @Email
    @Required
    public String email;

    @Required
    public String password;

    public String fullname;
    public boolean isAdmin;
…

現(xiàn)在如果你來到User模型的編輯或創(chuàng)建表單，你將看到驗(yàn)證規(guī)則已經(jīng)魔法般添加進(jìn)去了。

接下來是Post類：

package models;

import java.util.*;
import javax.persistence.*;

import play.db.jpa.*;
import play.data.validation.*;

@Entity
public class Post extends Model {

    @Required
    public String title;

    @Required
    public Date postedAt;

    @Lob
    @Required
    @MaxSize(10000)
    public String content;

    @Required
    @ManyToOne
    public User author;

    @OneToMany(mappedBy="post", cascade=CascadeType.ALL)
    public List comments;

    @ManyToMany(cascade=CascadeType.PERSIST)
    public Set tags;
…

然后檢查結(jié)果：

這里你會看到一個有趣的副作用：@MaxSize驗(yàn)證規(guī)則改變了Play顯示Post表單的方式?，F(xiàn)在它給內(nèi)容域準(zhǔn)備的是textarea。

最后是給Comment和Tag類添加驗(yàn)證規(guī)則。

package models;

import java.util.*;
import javax.persistence.*;

import play.db.jpa.*;
import play.data.validation.*;

@Entity
public class Tag extends Model implements Comparable {

    @Required
    public String name;
…
package models;

import java.util.*;
import javax.persistence.*;

import play.db.jpa.*;
import play.data.validation.*;

@Entity
public class Comment extends Model {

    @Required
    public String author;

    @Required
    public Date postedAt;

    @Lob
    @Required
    @MaxSize(10000)
    public String content;

    @ManyToOne
    @Required
    public Post post; 
…

如你所見，表單標(biāo)簽有點(diǎn)奇怪。Play使用Java成員變量作為表單標(biāo)簽。要想自定義它，我們僅需在/yabe/conf/messages中提供一組標(biāo)簽名。

  
事實(shí)上，你可以用一個多帶帶的messages文件對應(yīng)應(yīng)用支持的每種語言。比如，你可以把中文信息放入/yabe/conf/messages.zh。你將會在最后一章讀到如何進(jìn)行本地化。

添加這些標(biāo)簽到messages文件：

title=Title
content=Content
postedAt=Posted at
author=Author
post=Related post
tags=Tags set
name=Common name
email=Email
password=Password
fullname=Full name
isAdmin=User is admin

然后刷新表單，你將看到新的表單標(biāo)簽：

你可以隨心所欲地自定義CRUD模塊。舉個例子，你不大可能覺得評論列表長得符合你的期望。我們還需要添加更多列，特別是“相關(guān)文章”列來幫助我們過濾評論。

事實(shí)上，由于你的應(yīng)用才是老大，你可以覆蓋掉CRUD模塊提供的任意action和模板。舉個例子，如果我們想自定義評論列表，我們僅需提供/yabe/app/views/Comments/list.html模板。

在CRUD模塊啟動后，你就能使用更多的play命令。crud:ov命令幫助你覆蓋掉任意模板。在命令行里。輸入：

$ play crud:ov --template Comments/list

現(xiàn)在你有一個新的模板/yabe/app/views/Comments/list.html：

#{extends "CRUD/layout.html" /}



    
&{"crud.list.title", type.name}

    

        #{crud.search /}
    

    

        #{crud.table /}
    

    

        #{crud.pagination /}
    

    

        &{"crud.add", type.modelName}
    

首先看看&{"crud.list.title", type.name}，這里輸出了鍵名為crud.list.title的本地化信息，使用type.name作為信息參數(shù)。CRUD模塊的conf/messages包括條目crud.list.title=&{%s}，其中的參數(shù)作為另一個參數(shù)查找時的鍵，比如這里的&{"Comments"}，因?yàn)?b>type是一個models.Comments對應(yīng)的CRUD.ObjectType。既然我們沒有定義對應(yīng)的信息文件條目，默認(rèn)會輸出信息鍵 - Comments。在本教程的最后一章，你會學(xué)到關(guān)于本地化信息的更多東西。

#{crud.table /}是生成表格的標(biāo)簽。我們可以使用fields參數(shù)添加更多列。試一下這個：

#{crud.table fields:["content", "post", "author"] /}

現(xiàn)在我們有三列信息了：

有個問題，content域可能容不下有些過長的評論。我們需要指定#{crud.table /}能夠在需要的時候截短它。

使用#{crud.custom /}標(biāo)簽，我們可以自定義每個域的展示方式：

#{crud.table fields:["content", "post", "author"]}
 #{crud.custom "content"}
  
   ${object.content.length() > 50 ? object.content[0..50] + "…" : object.content}
  
 #{/crud.custom}
#{/crud.table}

  
是的，這里撒了些Groovy的語法糖。

我們也可以自定義生成的表單。舉個例子，原本我們在Post表單中輸入標(biāo)簽并不容易。我們需要改善體驗(yàn)。讓我們來重載掉Posts/show模板：

$ play crud:ov --template Posts/show

現(xiàn)在你有了/yabe/app/views/Posts/show.html：

#{extends "CRUD/layout.html" /}



&{"crud.show.title", type.modelName}


#{form action:@save(object.id), enctype:"multipart/form-data"}
    #{crud.form /}
    

        
        
    
#{/form}


#{form @delete(object.id)}
    

        
    
#{/form}

你可以通過給#{crud.form /}標(biāo)簽添加一個crud.custom標(biāo)簽來自定義tags域：

#{crud.form}
    #{crud.custom "tags"}
        
            &{"tags"}
        
            
        

            #{list items:models.Tag.findAll(), as:"tag"}
               
                   ${tag}
                
               
            #{/list}
        
    #{/crud.custom}
#{/crud.form}

通過使用Javascript，我們實(shí)現(xiàn)了一個簡單的標(biāo)簽選擇器：

要想自定義標(biāo)簽列表的外觀，以下面的內(nèi)容創(chuàng)建public/stylesheets/tags.css：

.tags-list .tag {
     cursor: pointer;
     padding: 1px 4px;
}
.crudField .tags-list .selected {
     background: #222;
     color: #fff;
}

然后，在views/CRUD/layout.html，改變#{set "moreStyles"}塊成這樣：

#{set "moreStyles"}
    
    
#{/set}

管理面板的工作暫告一段落。