package fan.tutorial.client.ui.grids;

import java.util.ArrayList;
import java.util.List;
import com.extjs.gxt.ui.client.data.BasePagingLoader;
import com.extjs.gxt.ui.client.data.HttpProxy;
import com.extjs.gxt.ui.client.data.JsonPagingLoadResultReader;
import com.extjs.gxt.ui.client.data.ModelData;
import com.extjs.gxt.ui.client.data.ModelType;
import com.extjs.gxt.ui.client.data.PagingLoadResult;
import com.extjs.gxt.ui.client.data.PagingLoader;
import com.extjs.gxt.ui.client.store.ListStore;
import com.extjs.gxt.ui.client.widget.ContentPanel;
import com.extjs.gxt.ui.client.widget.LayoutContainer;
import com.extjs.gxt.ui.client.widget.grid.CheckBoxSelectionModel;
import com.extjs.gxt.ui.client.widget.grid.ColumnConfig;
import com.extjs.gxt.ui.client.widget.grid.ColumnModel;
import com.extjs.gxt.ui.client.widget.grid.Grid;
import com.extjs.gxt.ui.client.widget.layout.FitLayout;
import com.extjs.gxt.ui.client.widget.toolbar.PagingToolBar;
import com.google.gwt.core.client.GWT;
import com.google.gwt.http.client.RequestBuilder;
import com.google.gwt.i18n.client.NumberFormat;
import com.google.gwt.user.client.Element;
import fan.tutorial.client.commons.PagingToolBarExtend;
import fan.tutorial.client.model.IEmployee;
import fan.tutorial.server.value.Constant;

public class GridPagingExample extends LayoutContainer {

    @Override
    protected void onRender(Element parent, int index) {
        super.onRender(parent, index);

        //创建内容面板
        ContentPanel panel = new ContentPanel();
        //设置面板标题
        panel.setHeadingHtml("Grid Paging");
        //设置面板宽度高度
        panel.setSize(600, 350);
        //设置面板布局, FitLayout 内容填充整个面板
        panel.setLayout(new FitLayout());
        panel.setFrame(true);

        //创建ModelType
        ModelType modelType = new ModelType();
        //一定要设置才能显示分页总数
        modelType.setTotalName(Constant.TOTAL);
        //设置根名称（与json数据根名称要保持一致, 否则无法正确的解析数据）
        modelType.setRoot(Constant.RESULT);
        //添加表格需要使用到的字段域, 未被添加的字段域在表格中无数据展示
        modelType.addField(IEmployee.NAME);
        modelType.addField(IEmployee.SEX);
        modelType.addField(IEmployee.SALARY);
        modelType.addField(IEmployee.BIRTHPLACE);
        modelType.addField(IEmployee.HIREDATE);

        //复选框选择模型
        CheckBoxSelectionModel<ModelData> sm = new CheckBoxSelectionModel<ModelData>();
        //表格列配置
        List<ColumnConfig> configs = new ArrayList<ColumnConfig>();
        //表格列配置信息
        configs.add(sm.getColumn());
        configs.add(new ColumnConfig(IEmployee.NAME, "姓名", 100));
        configs.add(new ColumnConfig(IEmployee.SEX, "性别", 100));
        ColumnConfig columnConfig = new ColumnConfig(IEmployee.SALARY, "薪资", 100);
        columnConfig.setNumberFormat(NumberFormat.getFormat("0.0"));
        configs.add(columnConfig);
        configs.add(new ColumnConfig(IEmployee.BIRTHPLACE, "籍贯", 100));
        configs.add(new ColumnConfig(IEmployee.HIREDATE, "入职时间", 100));

        //Spring MVC Controller 请求地址
        String url = GWT.getHostPageBaseURL() + "employee/find/page.json";
        //构建RequestBuilder
        RequestBuilder builder = new RequestBuilder(RequestBuilder.GET, url);
        //创建HttpProxy
        HttpProxy<String> proxy = new HttpProxy<String>(builder);
        //JsonPagingLoadResultReader
        JsonPagingLoadResultReader<PagingLoadResult<ModelData>> reader = new JsonPagingLoadResultReader<PagingLoadResult<ModelData>>(modelType);
        //数据加载器
        PagingLoader<PagingLoadResult<ModelData>> loader = new BasePagingLoader<PagingLoadResult<ModelData>>(proxy, reader);
        //数据存储器
        ListStore<ModelData> store = new ListStore<ModelData>(loader);
        //分页TOOLBAR
        PagingToolBar pagingToolBar = new PagingToolBarExtend(Constant.PAGE_SIZE_DEFAULT);
        pagingToolBar.bind(loader);

        //创建表格
        Grid<ModelData> grid = new Grid<ModelData>(store, new ColumnModel(configs));
        //设置显示加载标识
        grid.setLoadMask(true);
        //设置显示表格边框
        grid.setBorders(true);
        //设置选择模型
        grid.setSelectionModel(sm);
        //设置插件, 如果不设置, 全选复选框无法点击
        grid.addPlugin(sm);
        //设置宽度自动扩展的列
        grid.setAutoExpandColumn(IEmployee.HIREDATE);
        
        panel.add(grid);
        panel.setBottomComponent(pagingToolBar);
        //加载数据
        loader.load();
        
        add(panel);
        
    }
}

package fan.tutorial.server.controller;

import java.util.List;
import javax.annotation.Resource;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import fan.tutorial.client.model.Employee;
import fan.tutorial.server.commons.JsonUtil;
import fan.tutorial.server.service.DataService;
import fan.tutorial.server.value.Constant;

@Controller
@RequestMapping("/employee")
public class EmployeeController {
    
    @Resource
    private DataService service;
    
    @RequestMapping(value = "/find/page")
    public String findByPage(Model model, int offset, int limit){
        List<Employee> resultList = service.findEmplyeeByPage(offset, limit);
        int total = service.getEmplyeeCounts();
        String[] rootNames = {Constant.RESULT, Constant.TOTAL};
        Object[] objects = {resultList, total};
        String result = JsonUtil.toJson(rootNames, Constant.DATE_FORMAT_PATTENR_DEFAULT, objects);
        model.addAttribute(Constant.RESULT, result);
        return Constant.RESULT_CODE;
    }
}

package fan.tutorial.server.service;

import java.util.ArrayList;
import java.util.List;
import javax.annotation.Resource;
import org.springframework.stereotype.Service;
import fan.tutorial.client.model.Employee;
import fan.tutorial.server.value.Data;

@Service
public class DataService {
    
    @Resource
    private Data data;
    
    public List<Employee> findEmplyeeByPage(int offset, int limit){
        List<Employee> store = data.getEmployeeList();
        List<Employee> target = new ArrayList<Employee>();
        for(int i = offset; i < offset + limit && i < store.size(); i++){
            target.add(store.get(i));
        }
        return target;
    }
    
    public int getEmplyeeCounts(){
        return data.getEmployeeList().size();
    }
}