ext4 grid 分页前台后台源码

来源：互联网发布：c语言入门材料编辑：程序博客网时间：2024/05/20 00:15

---------------------------------------------前台jsp页面---------------------------------------------

<%@page contentType="text/html; charset=UTF-8"%>

<%@ include file="/WEB-INF/include/taglib.jsp"%>
<html>
<head>
<title>主界面</title>
<script type="text/javascript" src="ext-4.2.0/examples/shared/include-ext.js"></script>
<script type="text/javascript" src="ext-4.2.0/ext-lang-zh_CN.js"></script>
<script type="text/javascript">


var division_code=null;
var employee_type_name=null;
Ext.Loader.setConfig({
enabled: true
});
Ext.Loader.setPath('Ext.ux', 'ext-4.2.0/examples/ux');
Ext.require([
'Ext.data.*',
'Ext.grid.*',
'Ext.util.*',
'Ext.tip.QuickTipManager',
'Ext.ux.data.PagingMemoryProxy',
'Ext.ux.ProgressBarPager'
]);

Ext.onReady(function() {
Ext.BLANK_IMAGE_URL = 'ext-4.2.0/resources/images/s.gif';
Ext.QuickTips.init();
var date = new Date().getTime();

//科室数据模型
Ext.define('Year', {
extend: 'Ext.data.Model',
fields: [
{name: 'label', type: 'string'},
{name: 'value', type: 'string'}
]
});

//科室数据
var myStoreDep = Ext.create('Ext.data.Store', {
model: 'Year',
proxy: {
type: 'ajax',
url : 'staffInformation!getDep.action',
reader: {
type: 'json',
root: 'users'
}
},
autoLoad:true
});

//员工类型数据
var myStoreType = Ext.create('Ext.data.Store', {
model: 'Year',
proxy: {
type: 'ajax',
url : 'staffInformation!getEmployee.action',
reader: {
type: 'json',
root: 'users'
}
},
autoLoad:true
});
//表格数据
Ext.define('Task', {
extend: 'Ext.data.Model',
fields: [
{name: 'page.id', type: 'string'},
{name: 'page.task', type: 'string'},
{name: 'page.sum1', type: 'string'},
{name: 'page.sum2', type: 'string'},
{name: 'page.sum3', type: 'string'},
{name: 'page.sum4', type: 'string'}
]
});

var storetable = Ext.create('Ext.data.ArrayStore', {
model: 'Task',
remoteSort: true,
pageSize:23,
proxy: {
type: 'ajax',
url: 'staffInformation!getTreegrid.action?division_code='+division_code,
reader: {
type: 'json',
root:'items',
totalProperty:'total'
}
},
autoLoad:true
});

storetable.on('beforeload', function (store, options) {
var new_params = {
division_code : Ext.getCmp("multiCombo").getValue(),
employee_type_name : Ext.getCmp("multiComboType").getValue()
};
Ext.apply(store.proxy.extraParams, new_params);
});
//ext3
//store.on('beforeload', function () {
// store.baseParams = {
// name: '5555555',
// intss: '666666666'
// };
//});

var multiCombo = Ext.create('Ext.form.field.ComboBox', {
fieldLabel: '科室名称',
multiSelect: true,
margin:'0 0 0 10',
id:'multiCombo',
valueField: 'value',
displayField: 'label',
hiddenName:'division_code',
width: 250,
labelWidth: 60,
store: myStoreDep,
queryMode: 'remote'
});

var multiComboType = Ext.create('Ext.form.field.ComboBox', {
fieldLabel: '员工类型',
multiSelect: true,
id:'multiComboType',
margin:'0 0 0 10',
valueField: 'value',
displayField: 'label',
hiddenName:'employee_type_name',
width: 250,
labelWidth: 60,
store: myStoreType,
queryMode: 'remote'
});



var tablepanel;
var button = Ext.create('Ext.Button', {
text: ' 查询 ',
margin:'0 0 0 10',
handler: function() {
division_code = Ext.getCmp("multiCombo").getValue();
employee_type_name = Ext.getCmp("multiComboType").getValue();
storetable.loadPage(1,{params:{division_code:division_code,employee_type_name:employee_type_name}});
}
});
//查询条件
var simpleForm = Ext.create('Ext.form.Panel', {
id:'simpleForm',
name:'simpleForm',
width: '980',
border:0,
margin:'10 0 0 5',
layout: 'hbox',
defaults: {
anchor: '100%'
},
items: [multiCombo,multiComboType,button],
renderTo: 'form'
});
//表格显示
tablepanel = Ext.create('Ext.grid.Panel', {
store: storetable,
columns: [
{ text: '科室名称', style:{lineHeight: '18px',textAlign:'center'},dataIndex: 'page.task',width:170},
{ text: '职务级别', style:{lineHeight: '18px',textAlign:'center'},dataIndex: 'page.sum1',width:170},
{ text: '员工类型', style:{lineHeight: '18px',textAlign:'center'},dataIndex: 'page.sum2',width:170},
{ text: '员工姓名', style:{lineHeight: '18px',textAlign:'center'},dataIndex: 'page.sum3',width:170},
{ text: '占比', style:{lineHeight: '18px',textAlign:'center'},dataIndex: 'page.sum4',width:170}
],
height:Ext.getBody().getHeight()-50,
width:900,
bbar: Ext.create('Ext.PagingToolbar', {
pageSize: 23,
store: storetable,
displayInfo: true,
plugins: Ext.create('Ext.ux.ProgressBarPager', {})
}),
margin:'15 0 0 5',
renderTo: 'tree-example'
});
});

</script>

</head>
<body>
<div id="form"></div>
<div id="tree-example"></div>
</body>

</html>

----------------------------------------struts2 配置---------------------------------------------

<package name="StaffInformationAction" extends="jdt-default" namespace="/">
<action name="staffInformation!list" class="StaffInformationAction" method="list">
<result name="success">
/dcp/bstaffInformation/bstaffInformation_list.jsp
</result>
</action>
<action name="staffInformation!treegrid" class="StaffInformationAction" method="treegrid">
<result name="success">
/dcp/bstaffInformation/bstaffInformation_treegrid.jsp
</result>
</action>
<action name="staffInformation!getDep" class="StaffInformationAction" method="getDep"></action>
<action name="staffInformation!getEmployee" class="StaffInformationAction" method="getEmployee"></action>
<action name="staffInformation!getTreegrid" class="StaffInformationAction" method="getTreegrid"></action>
</package>

---------------------------------------------java后台响应代码---------------------------------------------

public class StaffInformationAction extends Jdt2BaseAction{
@Autowired
StaffInformationServiceImp staffInformationServiceImp;
private String division_code;
private String employee_type_name;
public String list() {
return SUCCESS;
}
public String treegrid() {
return SUCCESS;
}
public void getTreegrid() {
List<Treegrid> treegridList = new ArrayList<Treegrid>();
treegridList = staffInformationServiceImp.getInHospital(division_code,employee_type_name);
renderJsonPage(treegridList, start, 23);
}

public void getDep() {
List<LabelValueBean> treegridList = new ArrayList<LabelValueBean>();
treegridList = staffInformationServiceImp.getAllDeps();
renderJson(treegridList);
}

public void getEmployee() {
List<LabelValueBean> treegridList = new ArrayList<LabelValueBean>();
treegridList = staffInformationServiceImp.getAllEmployeeTypes();
renderJson(treegridList);
}

public String getDivision_code() {
return division_code;
}
public void setDivision_code(String division_code) {
this.division_code = division_code;
}
public String getEmployee_type_name() {
return employee_type_name;
}
public void setEmployee_type_name(String employee_type_name) {
this.employee_type_name = employee_type_name;
}

protected String render(String text, String contentType) {
try {
// HttpServletResponse response = ServletActionContext.getResponse();
// response.setContentType(contentType);
// response.getWriter().write(text);
Web2Utils.setNoCacheHeader(ServletActionContext.getResponse());
HttpServletResponse response = ServletActionContext.getResponse();
response.setContentType(contentType);
response.getWriter().write(text);
response.getWriter().close();
} catch (IOException e) {
e.printStackTrace();
}

return null;
}

/**
* 直接输出字符串.
*/
protected String renderText(String text) {
return render(text, "text/plain;charset=UTF-8");
}

/**
* 直接输出HTML.
*/
protected String renderHtml(String html) {
return render(html, "text/html;charset=UTF-8");
}
/**
* javascript
* @param jsText
*/
protected void renderJs(String jsText) {
render(jsText, "application/x-javascript;charset=utf-8");
}

/**
* 直接输出XML.
*/
protected String renderXML(String xml) {
return render(xml, "text/xml;charset=UTF-8");
}
/**
* json
* @param json
* @return
*/
protected String renderJson(String json) {
return render(json, "text/json;charset=UTF-8");
}
/**
*
* @param allList 所有记录
* @param start 起始页
* @param pageSize 每页记录数
*/
protected void renderJsonPage(List<?> allList,Integer start,Integer pageSize) {
Integer total = start+pageSize;
Integer totalLast = Integer.valueOf(allList.size());
Integer end = total>allList.size()?totalLast:total;
List<?> pageList = allList.subList(start,end) ;
Map<String, Object> jsonMap = new HashMap<String, Object>();
jsonMap.put("items",JsonUtils.toMapList(pageList, "page"));
jsonMap.put("total", allList.size());
JsonConfig config = new JsonConfig();
JSONObject jsonObject = JSONObject.fromObject(jsonMap,config);
render(jsonObject.toString(), "text/json;charset=UTF-8");
}

protected void renderJson(Object object,JsonConfig config){
JSONObject jsonObject = JSONObject.fromObject(object,config);
renderJson(jsonObject.toString());
}

protected void renderJson(Map<String, Object> jsonMap){
JSONObject jsonObject = JSONObject.fromObject(jsonMap,JsonUtils.configJson("yyyy-MM-dd"));
renderJson(jsonObject.toString());
}
protected void renderJson(Map<String, Object> jsonMap,JsonConfig config){
JSONObject jsonObject = JSONObject.fromObject(jsonMap,config);
renderJson(jsonObject.toString());
}
protected void renderJson(List list){
JSONArray JSONArray = net.sf.json.JSONArray.fromObject(list, JsonUtils.configJson("yyyy-MM-dd"));
renderJson(JSONArray.toString());
}

}