Ext.onReady(function() {
// 开启提示功能
Ext.QuickTips.init();
Ext.get("loading").show();
// -------------------------- 创建树形面板 ------------------------------------------------
var treepanel = new Ext.tree.TreePanel({
title : '编码分类导航',
padding : "10px",
region : 'west',
layout : 'fit',
width : 180,
split: true,
collapsible : true, // 允许收缩
trackMouseOver : true,
autoScroll : true,
rootVisible : true,
tbar : [{
text : "刷新",
iconCls : "refresh",
handler : function() {
window.location.reload();
}
}],
loader : new Ext.tree.TreeLoader({ // 加载解析树
autoLoad : true,
url : "/zzc/zzc/bmzd!list.shtml",
baseParams:{view_code:""},
processResponse : function(response, node, callback) {
var json = Ext.util.JSON.decode(response.responseText);
try {
var o = json.bmzds;
node.beginUpdate();
var l = this;
Ext.each(o, function(item) {
item.text = item.name;
var n = l.createNode(item);
if (n) {
node.appendChild(n);
}
});
node.endUpdate();
this.runCallback(callback,scope || node,[node]);
} catch (e) {
this.handleFailure(response);
}
},
listeners : {
beforeload : function(l, n, c) {
if (n.attributes.id == "rootNode") {
l.url = '/zzc/zzc/bmzd!list.shtml';
l.baseParams = {
view_code : "",
needEnabled : false
}
} else {
l.url = '/zzc/zzc/bmzd!list.shtml';
l.baseParams = {
view_code : n.attributes.view_code,
needEnabled : false
}
}
c.call();
}
}
}),
root : new Ext.tree.AsyncTreeNode({ // 根节点
text : "编码字典",
id : 'rootNode',
expanded : true
})
});
// --------------------------------管理面板--------------------------------------------------
// var limit = 20;
// 表单
var bmzdForm = new Ext.form.FormPanel({
baseCls : 'x-plain',
border : false,
autoScroll : true,
labelWidth : 80,
defaultType : "textfield",
defaults : {
anchor : '90%',
msgTarget : 'side'
},
padding : "10",
items : [{
xtype : "hidden",
name : "bmzd.id",
id : "id"
}, {
xtype : "hidden",
name : "bmzd.enabled",
id : "enabledhidden"
}, {
xtype : "hidden",
name : "bmzd.parent",
id : "parent"
}, {
allowBlank : false,
fieldLabel : "名称",
name : "bmzd.name",
id : "name"
}, {
fieldLabel : "简码",
name : "bmzd.simple_code",
id : "simple_code"
}, {
xtype : "numberfield",
fieldLabel : "序号",
name : "bmzd.sort",
id : "sort"
}, {
xtype : "checkbox",
fieldLabel : "状态",
boxLabel : "启用",
id : "enabled",
listeners : {
check : function(f, b) {
Ext.getCmp("enabledhidden").setValue(b);
}
}
}, {
fieldLabel : "备注",
name : "bmzd.remark",
id : "remark"
}, {
xtype : "displayfield",
fieldLabel : "级次码",
name : "view_code",
id : "view_code"
}, {
xtype : "displayfield",
fieldLabel : "编码等级",
name : "lvs",
id : "lvs"
}, {
xtype : "displayfield",
fieldLabel : "创建时间",
id : "in_date",
setValue : function(v) {
if (this.rendered) {
if (Ext.isEmpty(v)) {
this.el.dom.innerHTML = "";
} else {
if (Ext.isDate(v)) {
this.el.dom.innerHTML = v.format("Y-m-d H:i:s");
} else
this.el.dom.innerHTML = v;
}
} else
this.value = v;
}
}],
buttonAlign : 'center',
buttons:[
{
text : '提交',
handler : subForm
},
{
text : '关闭',
handler : function(){
window.hide();
}
}
]
});
//window
var window = new Ext.Window({
layout : 'fit',
closeAction : 'hide',
width : 400,
height : 300,
resizable : false,
shadow : true, //在面板后显示投影效果
modal :true,
closable:true,
//plain : true,
animCollapse:true, //面板闭合过程附有动画效果
items : [bmzdForm]
});
function add(){
var node = treepanel.getSelectionModel().getSelectedNode();
if (node == null) {
Ext.MessageBox.show({
title : '操作窗口',
msg : '请先选择编码分类!',
buttons : Ext.MessageBox.OK,
icon : Ext.MessageBox.WARNING
});
return;
}
Ext.Ajax.request({
url : '/zzc/zzc/bmzd!show.shtml',
method : "POST",
success : function(response, opt) {
var bmzd = Ext.util.JSON.decode(response.responseText);
var m = bmzd.bmzd;
m.parent = node.attributes.view_code;//父级码
//alert(m.parent);
bmzdForm.form.reset();
bmzdForm.form.setValues(m);
bmzdForm.isAdd = true;
window.setTitle("添加编码分类");
window.show();
},
failure : function(response, otp) {
Ext.Msg.alert("error", response);
}
});
}
function edit(record){
bmzdForm.form.reset();
bmzdForm.isAdd = false;
bmzdForm.getForm().loadRecord(record);
window.setTitle("修改编码分类");
window.show();
}
function subForm(){
var bForm = bmzdForm.form;
if(bmzdForm.isAdd){ //新增信息
if(bForm.isValid()){
bForm.submit({
waitMsg : '正在提交数据请稍后',
waitTitle : '提示',
url : '/zzc/zzc/bmzd!save.shtml',
method:'POST',
success:function(form,action){
window.hide();
var node = treepanel.getSelectionModel().getSelectedNode();
var param = {
view_code : node.attributes['view_code'],
needEnabled : false
};
Ext.apply(store.baseParams, param);
store.load();
},
failure:function(form,action){
Ext.Msg.alert('提示','添加失败'+action.result.msg);
}
});
}
}else{
if(bForm.isValid()){
bForm.submit({
waitMsg : '正在提交数据请稍后',
waitTitle : '提示',
url : '/zzc/zzc/bmzd!update.shtml',
method:'POST',
success:function(form,action){
window.hide();
var node = treepanel.getSelectionModel().getSelectedNode();
var param = {
view_code : node.attributes['view_code'],
needEnabled : false
};
Ext.apply(store.baseParams, param);
store.load();
},
failure:function(form,action){
Ext.Msg.alert('提示','修改失败'+action.result.msg);
}
});
}
}
}
function remove(id) {
Ext.Ajax.request({
url : '/zzc/zzc/bmzd!remove.shtml',
method : "POST",
success : function(response, opt) {
var rt = Ext.util.JSON.decode(response.responseText);
if (rt.success)
store.reload();
else
Ext.Msg.alert("error", rt.msg);
},
failure : function(response, otp) {
Ext.Msg.alert("error", response);
},
params : {
"bmzd.id" : id
}
});
}
var fields =["id","view_code","name","simple_code","sort","enabled","leaf","lvs",{
name : "in_date",
type : "date",
dateFormat : "Y-m-d\\TH:i:s"
},"remark"];
// 创建数据源
var store = new Ext.data.JsonStore({
autoDestroy : true,
// autoLoad : true,
url : '/zzc/zzc/bmzd!list.shtml',
baseParams : {
view_code : '',
needEnabled : false
},
root : 'bmzds',
idProperty : 'id',
fields : fields
});
var sm = new Ext.grid.RowSelectionModel({
singleSelect : true
});
var bmzdgrid = new Ext.grid.GridPanel({
region : 'center',
id : 'bmzd-grid',
stateful : true, // 防止控件错位
stripeRows : true,// 隔行换色
store : store,
// trackMouseOver : false,
// disableSelection : true,
// loadMask : true,
sm : sm,
defaults : {
"sortable" : true
},
listeners : {
celldblclick : function(grid, rowIndex, columnIndex, e) {
edit(bmzdgrid.getStore().getAt(rowIndex));
}
},
//autoExpandColumn : "name_column",
columns : [new Ext.grid.RowNumberer(), {
id : "name_column",
sortable : true,
dataIndex : "name",
header : "名称"
}, {
sortable : true,
autoWidth : true,
dataIndex : "simple_code",
header : "简码"
}, {
align : "right",
sortable : true,
dataIndex : "sort",
header : "序号"
}, {
sortable : true,
dataIndex : "view_code",
header : "级别码"
}, {
align : "right",
sortable : true,
dataIndex : "lvs",
header : "等级"
}, {
align : "center",
renderer : function(val) {
return val
? "<span style='color:green'>√</span>"
: "<span style='color:red'>×</span>";
},
sortable : true,
dataIndex : "enabled",
header : "状态"
}, {
align : "center",
renderer : function(val) {
return val
? "<span style='color:green'>√</span>"
: "<span style='color:red'>×</span>";
},
sortable : true,
dataIndex : "leaf",
header : "叶"
}, {
renderer : Ext.util.Format.dateRenderer('Y-m-d H:i:s'),
sortable : true,
dataIndex : "in_date",
header : "创建时间"
}],
// 添加按钮
tbar : ['-', {
xtype : "button",
iconCls : "add",
text : "添加",
handler : add
}, '-',{
text : "编辑",
iconCls : "edit",
handler : function() {
var p = this.ownerCt.ownerCt;
var sm = p.getSelectionModel();
if (sm.getCount() > 0) {
var r = sm.getSelected();
//edit(r.get("id"));
edit(r);
}
}
},'-',{
text : "删除",
iconCls : "delete",
handler : function() {
var p = this.ownerCt.ownerCt;
var sm = p.getSelectionModel();
if (sm.getCount() > 0) {
var r = sm.getSelected();
var id = r.get("id");
Ext.MessageBox.confirm('提示', '确认删除?',
function(btn) {
if (btn == 'yes') {
remove(id);
}
});
}
}
}],
// 自定义视图的配置
viewConfig : {
forceFit : true,
enableRowBody : true,
showPreview : true,
getRowClass : function(record, rowIndex, p, store) {
if (this.showPreview) {
p.body = '<p style=" border: 1px dotted #AAAAAA; padding: 1px 6px 1px 6px; margin:5px; font:14px Arial;}"><font color="#15428B"><b>备注:</b></font>' + record.data.remark + '</p>';
return 'x-grid3-row-expanded';
}
return 'x-grid3-row-collapsed';
}
}
/*
* , bbar : { xtype : 'pageinfobar', pageSize : limit, store :
* store }
*/
});
// 创建右侧面板
var mainpanel = new Ext.Panel({
id : 'main_panel',
region : 'center',
margins : '0 5 5 0',
border:false,
layout:'fit',
autoScroll : true,
items : {
id : 'main-view',
layout : 'fit',
title : '编码管理',
items : [bmzdgrid]
}
});
// 为导航树添加点击事件
treepanel.on("click", function(node) {
//if (!node.isLeaf()) {
if(node.attributes['name'])
Ext.getCmp("main-view").setTitle('编码管理[父级:'+node.attributes['name']+']');
else
Ext.getCmp("main-view").setTitle('编码管理[父级:根节点]');
var param = {
view_code : node.attributes['view_code'],
needEnabled : false
};
Ext.apply(store.baseParams, param);
store.load();
//}
});
// 边框布局
new Ext.Viewport({
layout : "border",
items : [treepanel, mainpanel]
});
Ext.get("loading").hide();
});
extjs 增删改
最新推荐文章于 2019-01-19 09:56:28 发布