<%@ page language= "java" contentType ="text/html; charset=UTF-8"
pageEncoding="UTF-8" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd" >
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title> OCS对接</title >
<script src="../../../resources/ext5/ext-all.js" ></script>
<script src="../../../resources/ext5/packages/ext-locale/ext-locale-zh_CN.js" ></script>
<link href="../../../resources/ext5/packages/ext-theme-access/build/resources/ext-theme-access-all.css" rel="stylesheet" />
<!-- example code -->
<link rel="stylesheet" type="text/css" href="../../../resources/ext5/warnConfig.css" >
<script src="../../../resources/ext5/treefilter.js"></script >
<script type="text/javascript" >
//
// This is the main layout definition.
//
//
// Note that these are all defined as panel configs, rather than instantiated
// as panel objects. You could just as easily do this instead:
//
// var absolute = Ext.create('Ext.Panel', { ... });
//
// However, by passing configs into the main container instead of objects, we can defer
// layout AND object instantiation until absolutely needed. Since most of these panels
// won't be shown by default until requested, this will save us some processing
// time up front when initially rendering the page.
//
// Since all of these configs are being added into a layout container, they are
// automatically assumed to be panel configs, and so the xtype of 'panel' is
// implicit. To define a config of some other type of component to be added into
// the layout, simply provide the appropriate xtype config explicitly.
//
function getBasicLayouts() {
// This is a fake CardLayout navigation function. A real implementation would
// likely be more sophisticated, with logic to validate navigation flow. It will
// be assigned next as the handling function for the buttons in the CardLayout example.
var cardNav = function(incr){
var l = Ext.getCmp('card-wizard-panel' ).getLayout();
var i = l.activeItem.id.split('card-' )[1];
var next = parseInt(i, 10) + incr;
l.setActiveItem(next);
// Ext.getCmp('card-prev').setDisabled(next===0);
// Ext.getCmp('card-next').setDisabled(next===2);
};
return {
/*
* ================ Start page config =======================
*/
// The default start page, also a simple example of a FitLayout.
start: {
id: 'mainPanel',
title: 'OCS系统点号对接配置' ,
layout: 'fit',
bodyPadding: 25
}
};
}
Ext.onReady(function(){
Ext.tip.QuickTipManager.init();
var detailsCmp;
// Gets all layouts examples
/*
var layoutExamples = [];
Ext.Object.each(getBasicLayouts(), function(name, example) {
layoutExamples.push(example);
});
*/
// Ext.Object.each(getCombinationLayouts(), function(name, example){
// layoutExamples.push(example);
// });
// Ext.Object.each(getCustomLayouts(), function(name, example){
// layoutExamples.push(example);
// });
// This is the main content center region that will contain each example layout panel.
// It will be implemented as a CardLayout since it will contain multiple panels with
// only one being visible at any given time.
<%-- var contentPanel = {--%>
<%-- id: 'content-panel',--%>
<%-- // region: 'border', // this is what makes this panel into a region within the containing layout--%>
<%-- margins: '2 5 5 0',--%>
<%-- fit:true,--%>
<%-- activeItem: 0,--%>
<%-- border: false,--%>
<%-- items: layoutExamples--%>
<%-- };--%>
var store = Ext.create( 'Ext.data.TreeStore', {
root: {
expanded: true,
text: "My Root",
children: [
{ text: "Child 1", leaf: true },
{ text: "Child 2", expanded: true, children: [
{ text: "GrandChild", leaf: true }
] }
]
}
/*
proxy: {
actionMethods: {
create: "POST", read: "POST", update: "POST", destroy: "POST"
},
type: 'ajax',
autoLoad : true,
noCache: false,
// url: '${pageContext.request.contextPath}/sysLoginAction/getTreeAction_ext.action',
extraParams:{pid:'1'}
}
*/
});
// Go ahead and create the TreePanel now so that we can use it below
var tab1 = Ext.create( 'MyTreePanel', {
id: 'tab1',
title: 'tab1',
region: 'center',
split: true,
height: 360,
minSize: 150,
rootVisible: false,
autoScroll: true,
store: store
});
var tab2 = Ext.create( 'MyTreePanel', {
id: 'tab2',
title: 'tab2',
region: 'center',
split: true,
height: 360,
minSize: 150,
rootVisible: false,
autoScroll: true
});
/*
treePanel.getSelectionModel().on('select', function(selModel, record) {
if (record.get('leaf')) {
// Ext.getCmp('content-panel').layout.setActiveItem(record.getId() + '-panel');
//
// detailsCmp = Ext.getCmp('details-panel');
// detailsCmp.body.hide().slideIn('l', {stopAnimation:true,duration: 200});
// detailsCmp.update(Ext.getDom(record.getId() + '-details').innerHTML);
// detailsCmp.doLayout();
}
});
*/
// This is the Details panel that contains the description for each example layout.
var tabs = Ext.widget('tabpanel' , {
resizeTabs: true,
enableTabScroll: true,
items: [tab1,tab2]
});
<%--{--%>
<%-- id: 'tabsPanel',--%>
<%-- region: 'center', // this is what makes this panel into a region within the containing layout--%>
<%-- border: false,--%>
<%-- layout: 'fit' ,--%>
<%-- items:tabs--%>
<%--//tabs为tab页,在items中增加fit即可--%>
<%-- // height:500,--%>
<%-- //bodyStyle: 'background:#fff;' --%>
<%--}--%>
var detailsPanel = {
id: 'main',
region: 'center',
title: 'Details',
border: false,
layout: 'fit' ,
items:tabs
};
// Finally, build the main layout once all the pieces are ready. This is also a good
// example of putting together a full-screen BorderLayout within a Viewport.
Ext.create('Ext.Viewport', {
layout: 'border',
title: 'Ext Layout Browser',
items: [
detailsPanel
]
});
<%-- var field = Ext.get('textfieldid'); --%>
<%-- field.on('keyup', function(e) { --%>
<%-- // alert(Ext.getCmp('textfieldid').getValue());--%>
<%-- treePanel.filterByText(Ext.getCmp('textfieldid').getValue()) ; --%>
<%-- }); --%>
});
</script>
</head>
<body>
</body>
</html>
- javascript面向对象——tabs实例
面向过程—>面向对象 之前在未学习面向对象时,我们都是面向过程编程的.它的优点就是简单,明了,下面就来把面向过程的tabs切换改写成面向对象的方式. html: <div class=&q ...
- 最近学习工作流 推荐一个activiti 的教程文档
全文地址:http://www.mossle.com/docs/activiti/ Activiti 5.15 用户手册 Table of Contents 1. 简介 协议 下载 源码 必要的软件 ...
- [ExtJS5学习笔记]第十一节 Extjs5MVVM模式下系统登录实例
本文地址:http://blog.csdn.net/sushengmiyan/article/details/38815923 实例代码下载地址: http://download.csdn.net/d ...
- jQuery EasyUI 选项卡面板tabs使用实例精讲
1. 对选项卡面板区域 div 设置 class=”easyui-tabs” 2. 对选项卡面板区域添加多个 div,每个 div 就是一个选项卡(每个面板一定设置 title) 3. 设置面板 fi ...
- 微信小程序实例:实现tabs选项卡效果
最近微信应用号是炒的如火如荼,热门满满,但是也可以发现搜索关键词出来,各类网站出现的还都是微信的官方文档解释.正好赶上这个热潮,这几天先把小程序技术文档看了个遍,就直接着手写案例了.很多组件微信内部已 ...
- Android应用底部导航栏(选项卡)实例
现在很多android的应用都采用底部导航栏的功能,这样可以使得用户在使用过程中随意切换不同的页面,现在我采用TabHost组件来自定义一个底部的导航栏的功能. 我们先看下该demo实例的框架图: 其 ...
- ASP.NET MVC+EF框架+EasyUI实现权限管理系列(23)-设置角色遗留问题和为权限设置角色以及EasyUI Tabs的使用
ASP.NET MVC+EF框架+EasyUI实现权限管系列 (开篇) (1):框架搭建 (2):数据库访问层的设计Demo (3):面向接口编程 (4 ):业务逻辑层的封装 ...
- 多iframe使用tab标签方式添加、删除、切换的处理实例
紧接着上一篇随笔iframe的内容增高或缩减时设置其iframe的高度的处理方案 如果采用iframe来切换显示内容的方式来展现办公Web.那么需要解决几个问题 1.tab标签需要和显示的iframe ...
- Qt StyleSheet样式表实例(转)
QT论坛看到的,收藏一下! 在涉及到Qt 美工的时候首先需要掌握CSS 级联样式表. 下面将通过几个例子来介绍一下怎样使用Qt中的部件类型设计.自定义的前台背景与后台背景的颜色: 如果需要一个文本编辑 ...
随机推荐
- Web 项目杂记(一)
1.Tomcat 多实例部署 在Tomcat下多实例部署后,发现如下问题,采用etc/init.d/tomcat start方式无法启动,而需要采用startup.sh.查找原因发现,是因为多实例部署 ...
- 基于token的多平台身份认证架构设计
基于token的多平台身份认证架构设计 1 概述 在存在账号体系的信息系统中,对身份的鉴定是非常重要的事情. 随着移动互联网时代到来,客户端的类型越来越多, 逐渐出现了 一个服务器,N个客户端的格 ...
- MapReduce剖析笔记之六:TaskTracker初始化任务并启动JVM过程
在上面一节我们分析了JobTracker调用JobQueueTaskScheduler进行任务分配,JobQueueTaskScheduler又调用JobInProgress按照一定顺序查找任务的流程 ...
- 构建Web API服务
返回总目录<一步一步使用ABP框架搭建正式项目系列教程> 构建动态Web API控制器 ABP可以自动地为应用层生成Web API 层.比如说我们之前创建的应用层: namespace N ...
- (临时)C#中,exe 单例运行
Mutex mutex = new Mutex(false, ""); , false)) { MessageBox.Show("程序已经启动"); retur ...
- xp搭建IIS出现HTTP 500错误-2147467259 (0x80004005)
安装IIS后访问localhost页面, 提示The remote procedure call failed and did not execute,再刷新变为:-2147467259 (0x800 ...
- Atitit java c# php c++ js跨语言调用matlab实现边缘检测等功能attilax总结
Atitit java c# php c++ js跨语言调用matlab实现边缘检测等功能attilax总结 1.1. 边缘检测的基本方法Canny最常用了1 1.2. 编写matlab边缘检测代码, ...
- EF操作MySql
EF的CodeFrist操作MySql的提前准备: 1.安装两个包:MySql.Data和MySql.Data.Entity,在VS中程序包管理器中添加2个包.(备注需要的VS2015,并且EF6支持 ...
- BIRCH聚类算法原理
在K-Means聚类算法原理中,我们讲到了K-Means和Mini Batch K-Means的聚类原理.这里我们再来看看另外一种常见的聚类算法BIRCH.BIRCH算法比较适合于数据量大,类别数K也 ...
- Core Java 总结(数据类型,表达式问题)
2016-10-18 整理 写一个程序判断整数的奇偶 public static boolean isOdd(int i){ return i % 2 == 1; } 百度百科定义:奇数(英文:odd ...