<script type="text/javascript">
//---------------------------------------
var myData1 = [
['<table border="0"><tr><td><img src=\'../../Components/Image/077_AddFile_32x32_72.png\' /></td><td style="font-size:16px" valign="middle">操作菜单1</td></tr></table>', '操作菜单1'],
['<table border="0"><tr><td><img src=\'../../Components/Image/125_FullView_32x32_72.png\' /></td><td style="font-size:16px" valign="middle">操作菜单操作菜单操作菜单操作菜单操作菜单2</td></tr></table>', '操作菜单2'],
['<img src=\'../../Components/Image/125_FullView_32x32_72.png\' />操作菜单3', '操作菜单3'],
['<img src=\'../../Components/Image/327_Options_32x32_72.png\' />操作菜单4', '操作菜单4'],
['<img src=\'../../Components/Image/replace_folder.png\' />操作菜单5', '操作菜单5'],
['<img src=\'../../Components/Image/112_RefreshArrow_Blue_32x32_72.png\' />操作菜单6', '操作菜单6'],
['<img src=\'../../Components/Image/075b_UpFolder_32x32_72.png\' />操作操作菜单操作菜单操作菜单操作菜单操作菜单7', '操作菜单'],
['<img src=\'../../Components/Image/305_Close_32x32_72.png\' />操作菜单8', '操作菜单7'],
['<img src=\'../../Components/Image/075b_UpFolder_32x32_72.png\' />操作菜单9', '操作菜单'],
['<img src=\'../../Components/Image/126_Edit_32x32_72.png\' />操作菜单10', '操作菜单'],
['<img src=\'../../Components/Image/paste_32x32.png\' />操作菜单11', '操作菜单'],
['<img src=\'../../Components/Image/paste_32x32.png\' />操作菜单12', '操作菜单'],
['<img src=\'../../Components/Image/paste_32x32.png\' />操作菜单13', '操作菜单'],
['<img src=\'../../Components/Image/paste_32x32.png\' />操作菜单14', '操作菜单'],
['<img src=\'../../Components/Image/paste_32x32.png\' />操作菜单15', '操作菜单'],
['<img src=\'../../Components/Image/075b_UpFolder_32x32_72.png\' />操作菜单16', '操作菜单']
];
var store1 = Ext.create('Ext.data.ArrayStore', {
fields: [
{ name: 'MenuName' },
{ name: 'MenuID' }
],
data: myData1
});
var grid1 = Ext.create('Ext.grid.Panel', {
store: store1,
columnLines: true, //显示列线
title: '',
hideHeaders: true, //隐藏头
autoScroll: true,
//maintainFlex: true,
height: 300,
viewConfig: { stripeRows: false }, //单双行不同颜色
columns: [
{
flex: 1,
height: 100,
tdCls: 'MenuCls',
//align: 'center',
dataIndex: 'MenuName'
},
{
hidden: true,
hideMode: 'visibility',
dataIndex: 'MenuID'
}
],
listeners: {
// selectionchange: function (model, records)
// {
// if (records[0])
// {
// alert(records[0]);
// //this.up('form').getForm().loadRecord(records[0]);
// }
// },
itemclick: function (v, record, item, index, e) {
alert(record.get('MenuID'));
}
}
});
//------------------------------------------------
var myData2 = [
['查询菜单1'],
['查询菜单2'],
['查询菜单3'],
['查询菜单4'],
['查询菜单5'],
['查询菜单6'],
['查询菜单7']
];
var store2 = Ext.create('Ext.data.ArrayStore', {
fields: [
{ name: 'MenuName' }
],
data: myData2
});
var grid2 = Ext.create('Ext.grid.Panel', {
store: store2,
columnLines: false,
title: '',
hideHeaders: true,
// height: 350,
viewConfig: { stripeRows: true },
columns: [{
width: 200,
dataIndex: 'MenuName'
}
],
listeners: {
itemclick: function (v, record, item, index, e) {
alert(record.get('MenuName'));
}
}
});
//------------------------------------------------
var myData3 = [
['退出']
];
var store3 = Ext.create('Ext.data.ArrayStore', {
fields: [
{ name: 'MenuName' }
],
data: myData3
});
var grid3 = Ext.create('Ext.grid.Panel', {
store: store3,
columnLines: false,
title: '',
hideHeaders: true,
// height: 350,
viewConfig: { stripeRows: true },
columns: [{
width: 200,
dataIndex: 'MenuName'
}
],
listeners: {
itemclick: function (v, record, item, index, e) {
alert(record.get('MenuName'));
}
}
});
//--------------------------------------------
Ext.define('MyApp.view.ui.MyPanel', {
extend: 'Ext.panel.Panel',
//renderTo: Ext.getBody(),
//height: 160,
html: '周一(12月26日)人民币兑美元汇率一度飙至17年来最高点,<br>主要归因于市场揣测决策层将容忍通胀,<br>以阻止国际资金外流。<br>\n\n中国人民银行今天将人民币兑美元汇率中间价调高0.07%,<br>至6.3167元人民币兑1美元,<br>人民币连续第2天走高。<br>\n\n中国社会科学院金融研究所研究员易宪容今天在《中国日报》评论中表示,<br>人民币贬值恐造成资金外流。\n\n招商银行驻深圳资深分析师刘东亮指出,<br>“人民币兑美元今天的中间价,<br>显示出中国央行推动人民币升值的决心。”<br>\n\n中国外汇交易中心报导,北京时间上午10时22分,<br>人民币兑美元扬升0.12%<br>,报6.3290元人民币兑1美元,<br>创下1993年底统一官方与市场汇率以来最高水平 。<br>\n\n人民币12个月无本金交割远期外汇(NDF)报6.3790元人民币兑1美元,<br>23日则报6.3835元人民币。<br>根据数据,<br>该期货比境内人民币现货价格低0.8%。<br>人民币在香港离岸市场变化不大,<br>报6.3450元人民币。<br>\n\n东方汇理银行(Credit Agricole)驻香港策略师Dariusz Kowalczyk此前在研究报告中写道,<br>以小幅、正面溢价购买离岸人民币有助人民币国际化,<br>而推进人民币国际化是人行的首要目标。<br>周一(12月26日)人民币兑美元汇率一度飙至17年来最高点,<br>主要归因于市场揣测决策层将容忍通胀,<br>以阻止国际资金外流。<br>\n\n中国人民银行今天将人民币兑美元汇率中间价调高0.07%,<br>至6.3167元人民币兑1美元,<br>人民币连续第2天走高。<br>\n\n中国社会科学院金融研究所研究员易宪容今天在《中国日报》评论中表示,<br>人民币贬值恐造成资金外流。\n\n招商银行驻深圳资深分析师刘东亮指出,<br>“人民币兑美元今天的中间价,<br>显示出中国央行推动人民币升值的决心。”\n\n中国外汇交易中心报导,<br>北京时间上午10时22分,<br>人民币兑美元扬升0.12%, ',
width: 301,
autoScroll: true,
title: 'My Panel',
initComponent: function () {
var me = this;
me.callParent(arguments);
}
});
var testPanel = new MyApp.view.ui.MyPanel();
//------------------------------------
Ext.create('Ext.data.Store', {
storeId: 'simpsonsStore',
fields: ['name', 'email', 'phone'],
data: { 'items': [
{ "name": "Lisa", "email": "lisa@simpsons.com", "phone": "555-111-1224" },
{ "name": "Bart", "email": "bart@simpsons.com", "phone": "555--222-1234" },
{ "name": "Homer", "email": "home@simpsons.com", "phone": "555-222-1244" },
{ "name": "Lisa", "email": "lisa@simpsons.com", "phone": "555-111-1224" },
{ "name": "Bart", "email": "bart@simpsons.com", "phone": "555--222-1234" },
{ "name": "Homer", "email": "home@simpsons.com", "phone": "555-222-1244" },
{ "name": "Lisa", "email": "lisa@simpsons.com", "phone": "555-111-1224" },
{ "name": "Bart", "email": "bart@simpsons.com", "phone": "555--222-1234" },
{ "name": "Homer", "email": "home@simpsons.com", "phone": "555-222-1244" },
{ "name": "Lisa", "email": "lisa@simpsons.com", "phone": "555-111-1224" },
{ "name": "Bart", "email": "bart@simpsons.com", "phone": "555--222-1234" },
{ "name": "Homer", "email": "home@simpsons.com", "phone": "555-222-1244" },
{ "name": "Lisa", "email": "lisa@simpsons.com", "phone": "555-111-1224" },
{ "name": "Bart", "email": "bart@simpsons.com", "phone": "555--222-1234" },
{ "name": "Homer", "email": "home@simpsons.com", "phone": "555-222-1244" },
{ "name": "Lisa", "email": "lisa@simpsons.com", "phone": "555-111-1224" },
{ "name": "Bart", "email": "bart@simpsons.com", "phone": "555--222-1234" },
{ "name": "Lisa", "email": "lisa@simpsons.com", "phone": "555-111-1224" },
{ "name": "Bart", "email": "bart@simpsons.com", "phone": "555--222-1234" },
{ "name": "Homer", "email": "home@simpsons.com", "phone": "555-222-1244" },
{ "name": "Lisa", "email": "lisa@simpsons.com", "phone": "555-111-1224" },
{ "name": "Bart", "email": "bart@simpsons.com", "phone": "555--222-1234" },
{ "name": "Homer", "email": "home@simpsons.com", "phone": "555-222-1244" },
{ "name": "Homer", "email": "home@simpsons.com", "phone": "555-222-1244" },
{ "name": "Marge", "email": "marge@simpsons.com", "phone": "555-222-1254" }
]
},
proxy: {
type: 'memory',
reader: {
type: 'json',
root: 'items'
}
}
});
Ext.define('MyApp.view.ui.MyPanel2', {
extend: 'Ext.panel.Panel',
//autoScroll: true,
title: 'My Panel',
autoScroll: true,
initComponent: function () {
var me = this;
Ext.applyIf(me, {
items: [
{
xtype: 'gridpanel',
title: 'My Grid Panel',
store: Ext.data.StoreManager.lookup('simpsonsStore'),
columns: [
{ header: 'Name', dataIndex: 'name' },
{ header: 'Email', dataIndex: 'email', flex: 1 },
{ header: 'Phone', dataIndex: 'phone' }
],
viewConfig: {}
}
]
});
me.callParent(arguments);
}
});
var testPanel2 = new MyApp.view.ui.MyPanel2();
//---------------------------------
var vp;
Ext.onReady(function () {
//Viewport布局面板,以下布局为南北布局方式
vp = new Ext.container.Viewport({
layout: "border", //布局方式占满整个浏览器
renderTo: Ext.getBody(), //呈现在整个body
items: [
{
//title: "",
frame: true,
region: "center", //呈现在最中间
margin: 3,
xtype: 'tabpanel',
id: 'tabPanel',
activeTab: 0,
items: [
{ title: '菜单1',
itemid: 'menu1',
xtype: "textfield",
fieldLabel: 'Name',
allowBlank: false
}
, testPanel, testPanel2
//,
// {title: 'Tab 2', text: "我是中间儿子里面的按钮1", width: 200, xtype: "button" },
// {title: 'Tab 3', text: "我是中间儿子里面的按钮2", width: 200, xtype: "button" }
// {title: '下单', html: ' <iframe name="iframeCenter" scrolling="auto" frameborder="0" width="100%" height="650" src="/Order/DoXHOrder"> </iframe>' },
// { title: '使用帮助', html: 'The first tab\'s content. Others may be added dynamically' }
]
},
{
title: "我是上面的儿子",
frame: true,
region: "north", //呈现在北边,即是上边
height: 100,
collapsible: true //是否可以收缩
},
{
title: "导航菜单",
frame: true,
region: "west", //呈现在西边,即是左边
width: 200,
margin: "3 0 3 0",
collapsible: true, //是否可以收缩
resizable: true,
stateId: 'navigation-panel',
id: 'west-panel', // see Ext.getCmp() below
split: true,
minWidth: 175,
maxWidth: 200,
animCollapse: true,
layout: 'accordion',
items: [
//{ html: ' <iframe name="iframeLeftMenu" scrolling="auto" frameborder="0" width="100%" height="600" src="/Home/LeftMenu"> </iframe>' }
{
//contentEl: 'grid-example',
title: '操作',
items: [grid1],
iconCls: 'nav' // see the HEAD section for style used
}, {
title: '查询',
items: [grid2],
//html: '<img src=\'../../Components/Image/Move.png\' />',
iconCls: 'info'
}, {
title: '系统',
items: [grid3],
//html: '<p>Some info in here.</p>',
iconCls: 'settings'
}
]
},
{
// title: "我是右边的儿子",
frame: true,
region: "east", //呈现在东边,即是右边
width: 200,
margin: "3 0 3 0",
items: [
//{ html: ' <iframe name="iframeRightMRS" scrolling="auto" frameborder="0" width="100%" height="600" src="/Home/RightMRS"> </iframe>' }
{html: '呈现在东边,即是右边' }
]
},
{
//title: "我是下面的儿子",
frame: true,
region: "south", //呈现在南边,即是下边
height: 100,
items: [
//{ html: ' <iframe name="iframeBottom" scrolling="auto" frameborder="0" width="100%" height="100" src="/Home/BottomInfo"> </iframe>' }
{html: '呈现在南边,即是下边 ' }
]
}
]
});
// grid2.getSelectionModel().select(0);
// grid2.fireEvent('itemclick', grid2, grid2.getSelectionModel().getLastSelected());
});
</script>
菜单没贴上来,将在笔记二中贴上