Extjs4.2如何实现鼠标点击统计图时弹出窗口来展示统计的具体列表信息
1 var pageSize = 20;//初始化每页数据条数 2 var winTitle = '';//初始化窗口标题 3 4 /** 5 *点击统计图时,弹出一个窗口,显示统计的详情列表信息, 6 *该方法为项目中所有的统计图共享,参数type是一个字符串,用于区分是哪个统计图调用的 7 */ 8 function showDetails(type){ 9 10 setWindowTitle(type);//设置窗口标题 11 12 var panel; 13 if (type.split("_")[0] == "stdMngStatistics") { 14 var gridStore = createStore("gridStore", type);//获取数据 15 loadGridStoreByOrgCodeAndIncludeSubOrgs(gridStore); 16 gridStore.load(function(){ 17 panel = createGrid(gridStore);//创建面板 18 showWindow(panel);//显示窗口 19 }); 20 } 21 } 22 23 //设置窗口标题 24 function setWindowTitle(type){ 25 if(type == "stdMngStatistics"){ 26 winTitle = "规范管理人员"; 27 } 28 } 29 30 //设置参数 31 function loadGridStoreByOrgCodeAndIncludeSubOrgs(gridStore){ 32 var proxy = gridStore.getProxy(); 33 proxy.setExtraParam("orgCode",selectedOrgCode);// 管理机构编码 34 proxy.setExtraParam("includeSubOrgs",selectedIncludeSubOrgs);// 是否包含下级机构 35 } 36 37 //获取数据 38 function createStore(storeId, type){ 39 return new Ext.data.JsonStore({ 40 storeId: storeId, 41 remoteSort : true, 42 pageSize : pageSize, 43 proxy: { 44 type: 'ajax', 45 url : baseUrl + '/app/report/statisticsDetails/' + encodeURI(encodeURI(type)), 46 actionMethods: { 47 read : 'POST' 48 }, 49 reader: { 50 type: 'json', 51 totalProperty : 'totalElements', 52 root: 'content' 53 }, 54 extraParams:{ 55 limit : pageSize 56 }, 57 batchActions : false 58 }, 59 fields : ['id' , 'ehrId' , 'personName', 'gender', 'birthDate', 'innerCode', 'svcFlwMental' , 'svcFlwCommonDto' , 60 'family', 'idNumber', 'homeTel', 'ehrIntegrity' , 'hasAsmYear', 'hasAsmOldS' , 'hasAsmOldA' , 'hasSvcExam1', 'mngOrgName' , 61 'dateCreated', 'ehrDetails' , 'hasFirstSoap' , 'hasFlwChronic' , 'hasAsmYear' , 'svcAsmOldS' , 'svcChronicList' , 'svcChronic','hasVSvcFlwChronicWf', 62 'grHealth', 'grHighRisk' , 'grChronicDisease' , 'grOld' , 'grMaternity' , 63 'grChildren','grMentalDisorder','grHandicapped','cdHypertension','cdDiabetesMellitus', 64 'cdCoronaryDisease','cdCerebralApoplexy','cdOther', 'curContract'] 65 }); 66 } 67 68 //创建面板 69 function createGrid(gridStore){ 70 var sm = new Ext.selection.RowModel(); 71 return Ext.create('Ext.grid.Panel', { 72 border : false, 73 xtype : 'grid', 74 store : gridStore, 75 loadMask : true, 76 stripeRows : true, 77 viewConfig: { 78 forceFit : true 79 }, 80 listeners : { 81 itemdblclick : function(a, b, c, rowindex, e){ 82 e.preventDefault(); 83 openModalDialog(baseUrl+'/app/ehr/index/'+gridStore.getAt(rowindex).get('id')); 84 gridStore.reload(); 85 } 86 } , 87 selModel : sm, 88 columns:[ 89 new Ext.grid.RowNumberer({ 90 header: '序号', 91 width: 45, //序号列宽 92 align: 'center' //序号居中 93 }), 94 {text : '姓名',dataIndex : 'personName', sortable:true }, 95 {text : '性别',dataIndex : 'gender', renderer : genderRenderer ,maxWidth : 60 , sortable:true }, 96 {text : '出生日期',dataIndex : 'birthDate', sortable:true }, 97 {text : '健康分类',dataIndex : 'ehrClassify', renderer : ehrClassifyHealthRenderer, sortable:false}, 98 {text : '人群分类',dataIndex : 'ehrClassify', renderer : ehrClassifyGrRenderer, sortable:false}, 99 {text : '慢病分类',dataIndex : 'ehrClassify', renderer : ehrClassifyCdRenderer, sortable:false}, 100 {text : '签约',dataIndex : 'curContract', maxWidth : 60, renderer : curContractRenderer, sortable:false}, 101 {text : '建档日期',dataIndex : 'dateCreated', sortable:true }, 102 {text : '档案完整度',dataIndex : 'ehrIntegrity', renderer : ehrIntegrityRenderer, sortable:true }, 103 {text : '证件类型' , dataIndex : 'ehrDetails' , hidden : true , renderer : idTypeRenderer, sortable:false}, 104 {text : '证件号码' , dataIndex : 'idNumber' , hidden : true, sortable:false}, 105 {text : '内部建档号',dataIndex : 'innerCode' , hidden : true , sortable:true }, 106 {text : '联系电话',dataIndex : 'homeTel', hidden : true, sortable:false}, 107 {text : '管理机构' , dataIndex : 'mngOrgName' , hidden : true, sortable:false} 108 ], 109 bbar : new Ext.PagingToolbar({ 110 store : gridStore, 111 displayInfo : true, 112 showUerItemsBeforeDisplayInfo: true, 113 displayMsg : "第 {0} - {1} 条 共 {2}条", 114 emptyMsg : "没有符合条件的记录" 115 }) 116 }); 117 } 118 119 //显示统计列表窗口 120 function showWindow(panel){ 121 Ext.create('Ext.window.Window', { 122 modal :true, //弹出窗口后,不能对非本窗口内容进行操作 123 title: winTitle, 124 constrainHeader:true, //所有查询统计中弹窗的拖动范围限定 125 height: 620, 126 width: 880, 127 layout : 'fit', 128 items : [panel] 129 }).show(); 130 }
Extjs4.2如何实现鼠标点击统计图时弹出窗口来展示统计的具体列表信息相关推荐
- php如何让B链接在当前页面打,javascript - 如何实现点击链接 A 弹出窗口 X,点击链接 B 继续在弹出窗口 X (刷新)打开?...
就是有很多链接,点击链接会弹出窗口,如何实现点击不同的链接,始终在同一弹出窗口中打开,而不是每次都弹出新的窗口. 用下面的代码只能每次都弹出新的窗口. $('a').click(function(){ ...
- 第12章[12.4] 鼠标移入移除时弹出和关闭窗口
需要实现功能的规格描述 鼠标进入某个区域时自动弹出一个新窗口,在该新窗口中可以做一些选择等功能 但鼠标离开新窗口时,自动关闭该新窗口. 类似菁优网在组卷时选取教材版本和年级的功能,页面如下: 框架实现 ...
- vue项目引入第三方地图插件并且随机显示坐标点(经纬度),点击坐标点弹出窗口,点击详情文字链接到其他模块
再vue中引入第三方插件-- https://www.npmjs.com/package/vue-baidu-map 一个百度地图的vue封装 上述中的内容在第三方插件的文档介绍中都有. 在具体特性 ...
- JavaScript实现鼠标点击监听---弹出社会主义核心价值观(面向对象小练习)
效果如下 <!DOCTYPE html> <html lang="en"><head><meta charset="UTF-8& ...
- Android 点击赞时弹出+1向上弹出动画
一.前言: 项目中用到的抽出来 二.具体实现: 1.MainActivity package com.merbng.zanDemo;import android.os.Bundle; import a ...
- java点击菜单项文字显示在窗体上_java点击菜单项弹出窗口怎么做啊?
程序如下,可弹不出窗口呀,高手教教我!importjava.awt.*;importjava.awt.event.*;publicclassW111extendsFrameimplementsActi ...
- php 点击文本框弹出时间,点击Input框弹出日期选项
点击text文本框弹出日期选择器 body{margin:0;padding:0;font:14px Verdana, Arial, sans-serif;line-height:200%;} #co ...
- html点击按钮弹出悬浮窗_9种实现点击一个链接弹出一个小窗口的代码
9 种实现点击一个链接弹出一个小窗口的代码 因为着是一段 javascripts 代码, 所以它们应该放在之间. 是对一些版本低的浏览器起作用,在这些老浏览器中不会将 标签中的代码作为文本显示出来.要 ...
- 谷歌浏览器设置点击链接时打开新窗口
谷歌浏览器设置点击链接时打开新窗口 首先确定自己的google版本信息,找到设置,点击关于Chrome 根据我的google版本,设置点击链接打开新窗口 点击右边的齿轮按钮,进入快捷搜索设置 点击查看 ...
- button点击后出现的边框_代码分享:原生js实现,鼠标点击按钮时,多彩粒子散射特效。...
原地址,可以在线查看演示效果,要是下面的代码复制后运行有问题,可以从原地址去复制,我试过了,OK的. 原生js实现,鼠标点击按钮时,多彩粒子散射特效.fairysoftware.com 完整代码,复 ...
最新文章
- hbuilderx代码自动补全_DL时代的代码补全利器,北大出品,效果远超语言模型
- 后盾网lavarel视频项目---4、lavarel和vue都是{{}}表示变量,如何解决冲突
- Windows核心编程 第九章 线程与内核对象的同步(上)
- Pytorch 网络模型的保存与读取
- jmeter 逻辑控制器
- 随机模块random、os模块、sys模块、shutil模块
- P4587-[FJOI2016]神秘数【主席树】
- 360——新式的流氓
- C++主要操作符重载的定义和总结
- (转)Facebook如何提高软件质量?
- 关于GO语言,这篇文章讲的很明白
- [大学回忆录-思想]找工作:也谈谈我的专业技能
- 易优(eyoucms)CMS网站搬家教程
- 定时刷新页面 html,js实现定时刷新页面的代码
- 微博转载-是时候了,也该做个了结了。
- C# 通用分页用户控件
- Oracle的学习心得和知识总结(七)|Oracle数据库Literals技术详解
- https证书怎么申请?
- 82.使用vue后怎么针对搜索引擎做SEO优化?
- Python基础教程:一次性搞定 Django Form