脚本宝典收集整理的这篇文章主要介绍了javascript代码实例教程-extjs 云资源平台 2014.2.5-Portal门户页面，脚本宝典觉得挺不错的，现在分享给大家，也给大家做个参考。

小宝典致力于为广大程序猿（媛）提供高品质的代码服务，请大家多多光顾小站，小宝典在此谢过。

玩了一下门户页面,按extjs的demo改造过来的,随机图表内容,会随机选择五个项目中的一个进行统计.每次看到统计项目可能不一样哦

<"/kf/ware/vc/" target="_blank" class="keylink">vcD4KPHA+PGJyPgo8L3A+CjxwPi8qKjxicj4KICogQGNsYXNzIEV4dC5hcHAuUG9ydGFsPGJyPgogKiBAZXh0ZW5kcyBPYmplY3Q8YnI+CiAqLzwvcD4KPHA+RXh0LmRlZMLuZSg="Ext.app.Portal', {

extend: 'Ext.container.Viewport',
//requires: [ 'Ext.diag.layout.ContextITem', 'Ext.diag.layout.Context' ],
uses: ['Ext.app.PortalPanel', 'Ext.app.PortalColumn', 'Ext.app.GridPortlet', 'Ext.app.ChartPortlet', 'Ext.app.Gridmyinfo', 'Ext.app.GridNews'],

getTools: function () {
return [{
xtyPE: 'tool',
type: 'gear',
handler: function (e, target, panelHeader, tool) {
VAR portlet = panelHeader.ownerCt;
portlet.setLoading('Loading...');
Ext.defer(function () {
portlet.setLoading(false);
}, 2000);
}
}];
},

initcomponent: function () {

var responseArray = [];
Ext.Ajax.request({
url: '../Indexpage.aspx',
async: false,
success: function (response) {
responseArray = Ext.JSON.decode(response.responseText);
},
failure: function (response) {
Ext.MessageBox.alert('错误', '请与后台服务人员联系');
}
});

Ext.apply(this, {
id: 'app-viewport',
layout: {
type: 'border',
padding: '0 5 5 5' // pad the layout From the window Edges
},
items: [{
id: 'app-header',
xtype: 'box',
region: 'north',
height: 40,
html: responseArray.dwmc
}, {
xtype: 'container',
region: 'center',
layout: 'border',
items: [{
id: 'app-options',
title: 'Portal 信息',
region: 'west',
animCollapse: true,
width: 150,
minWidth: 140,
maxWidth: 400,
split: true,
collapsible: true,
layout: {
type: 'accordion',
aniMATE: true
},
items: [{
title: '系统统计',
border: false,
autoScroll: true,
iconCls: 'nav',
html: responseArray.tjxx
}, {
title: '上载排行',
border: false,
autoScroll: true,
iconCls: 'nav',
html: responseArray.upcount
}, {
title: '积分排行',
border: false,
autoScroll: true,
iconCls: 'nav',
html: responseArray.integration
},{
title: '软件版本',
border: false,
autoScroll: true,
iconCls: 'info',
html: responseArray.copyright
}]
}, {
id: 'app-portal',
xtype: 'portalpanel',
region: 'center',
items: [{
id: 'col-1',
items: [{
id: 'portlet-1',
title: '随机资源统计表',
tools: this.getTools(),
items: Ext.create('Ext.app.GridPortlet'),
listeners: {
'close': Ext.bind(this.onPortletClose, this)
}
}, {
id: 'portlet-2',
title: '新闻平台',
tools: this.getTools(),
items: Ext.create('Ext.app.GridNews'),
listeners: {
'close': Ext.bind(this.onPortletClose, this)
}
}]
}, {
id: 'col-2',
items: [{
id: 'portlet-3',
title: '最近登陆',
tools: this.getTools(),
html: responseArray.lastlogin,
listeners: {
'close': Ext.bind(this.onPortletClose, this)
}
}, {
id: 'portlet-5',
title: '个人统计信息',
tools: this.getTools(),
items: Ext.create('Ext.app.Gridmyinfo'),
listeners: {
'close': Ext.bind(this.onPortletClose, this)
}
}, {
id: 'portlet-7',
title: '最热资源',
collapsed: true,
tools: this.getTools(),
html: responseArray.browcount,
listeners: {
'close': Ext.bind(this.onPortletClose, this)
}
}]
}, {
id: 'col-3',
items: [{
id: 'portlet-4',
title: '随机资源统计图',
tools: this.getTools(),
items: Ext.create('Ext.app.ChartPortlet'),
listeners: {
'close': Ext.bind(this.onPortletClose, this)
}
}, {
id: 'portlet-6',
title: '最新资源',
tools: this.getTools(),
html: responseArray.fileupdate,
listeners: {
'close': Ext.bind(this.onPortletClose, this)
}
}]
}]
}]
}]
});
this.callParent(arguments);
},

onPortletClose: function (portlet) {
this.showMsg('"' &#43; portlet.title + '" 被删除');
},

showMsg: function (msg) {
var el = Ext.get('app-msg'),
msgId = Ext.id();

this.msgId = msgId;
el.update(msg).show();

Ext.defer(this.clearMsg, 3000, this, [msgId]);
},

clearMsg: function (msgId) {
if (msgId === this.msgId) {
Ext.get('app-msg').hide();
}
}
});



觉得可用，就经常来吧！ 脚本宝典 欢迎评论哦！&nbsp;js脚本，巧夺天工，精雕玉琢。小宝典献丑了！

脚本宝典总结

以上是脚本宝典为你收集整理的javascript代码实例教程-extjs 云资源平台 2014.2.5-Portal门户页面全部内容，希望文章能够帮你解决javascript代码实例教程-extjs 云资源平台 2014.2.5-Portal门户页面所遇到的问题。

如果觉得脚本宝典网站内容还不错，欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。