GridPanel.js 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367
  1. Ext.define('erp.view.common.vastDatalist.GridPanel',{
  2. extend: 'Ext.grid.Panel',
  3. alias: 'widget.erpVastDatalistGridPanel',
  4. layout : 'fit',
  5. id: 'grid',
  6. emptyText : '无数据',
  7. columnLines : true,
  8. autoScroll : true,
  9. store: [],
  10. columns: [],
  11. multiselected: [],
  12. bodyStyle: 'background: #f1f1f1;',
  13. BaseUtil: Ext.create('erp.util.BaseUtil'),
  14. GridUtil: Ext.create('erp.util.GridUtil'),
  15. RenderUtil:Ext.create('erp.util.RenderUtil'),
  16. selModel: Ext.create('Ext.selection.CheckboxModel',{
  17. ignoreRightMouseSelection : false,
  18. listeners:{
  19. selectionchange:function(selectionModel, selected, options){
  20. }
  21. },
  22. onRowMouseDown: function(view, record, item, index, e) {//改写的onRowMouseDown方法
  23. var me = Ext.getCmp('grid');
  24. var bool = true;
  25. var items = me.selModel.getSelection();
  26. Ext.each(items, function(item, index){
  27. if(item &&record==item&&item.index == record.index){
  28. bool = false;
  29. me.selModel.deselect(record);
  30. Ext.Array.remove(items, item);
  31. Ext.Array.remove(me.multiselected, record);
  32. }
  33. });
  34. Ext.each(me.multiselected, function(item, index){
  35. items.push(item);
  36. });
  37. me.selModel.select(items);
  38. if(bool){
  39. view.el.focus();
  40. var checkbox = item.childNodes[0].childNodes[0].childNodes[0];
  41. if(checkbox.getAttribute && checkbox.getAttribute('class') == 'x-grid-row-checker'){
  42. me.multiselected.push(record);
  43. items.push(record);
  44. me.selModel.select(items);
  45. } else {
  46. me.selModel.deselect(record);
  47. Ext.Array.remove(me.multiselected, record);
  48. }
  49. }
  50. },
  51. onHeaderClick: function(headerCt, header, e) {
  52. if (header.isCheckerHd) {
  53. e.stopEvent();
  54. var isChecked = header.el.hasCls(Ext.baseCSSPrefix + 'grid-hd-checker-on');
  55. if (isChecked) {
  56. this.deselectAll(true);
  57. var grid = Ext.getCmp('grid');
  58. this.deselect(grid.multiselected);
  59. grid.multiselected = new Array();
  60. var els = Ext.select('div[@class=x-grid-row-checker-checked]').elements;
  61. Ext.each(els, function(el, index){
  62. el.setAttribute('class','x-grid-row-checker');
  63. });
  64. header.el.removeCls(Ext.baseCSSPrefix + 'grid-hd-checker-on');//添加这个
  65. } else {
  66. var grid = Ext.getCmp('grid');
  67. this.deselect(grid.multiselected);
  68. grid.multiselected = new Array();
  69. var els = Ext.select('div[@class=x-grid-row-checker-checked]').elements;
  70. Ext.each(els, function(el, index){
  71. el.setAttribute('class','x-grid-row-checker');
  72. });
  73. this.selectAll(true);
  74. header.el.addCls(Ext.baseCSSPrefix + 'grid-hd-checker-on');//添加这个
  75. }
  76. }
  77. }
  78. }),
  79. dockedItems: [{
  80. id : 'pagingtoolbar',
  81. xtype: 'erpVastDatalistToolbar',
  82. dock: 'bottom',
  83. displayInfo: true
  84. }],
  85. plugins: [Ext.create('Ext.ux.grid.GridHeaderFilters'),
  86. Ext.create('Ext.grid.plugin.CellEditing', {
  87. clicksToEdit: 1
  88. })],
  89. BaseUtil: Ext.create('erp.util.BaseUtil'),
  90. RenderUtil: Ext.create('erp.util.RenderUtil'),
  91. initComponent : function(){
  92. this.addEvents({
  93. beforereconfigure: true
  94. });
  95. condition = this.BaseUtil.getUrlParam('urlcondition');
  96. condition = (condition == null) ? "" : condition;
  97. caller = this.BaseUtil.getUrlParam('whoami');
  98. this.getCount(caller, condition);
  99. this.callParent(arguments);
  100. Ext.getCmp("pagingtoolbar").bind(this.store);
  101. Ext.getCmp('pagingtoolbar').updateInfo();
  102. } ,
  103. _noc: 0,
  104. getColumnsAndStore: function(c, d, g, s){
  105. c = c || caller;
  106. d = d || condition;
  107. g = g || page;
  108. s = s || pageSize;
  109. var me = this;
  110. var f = d;
  111. if(me.filterCondition){
  112. if(d == null || d == ''){
  113. f = me.filterCondition;
  114. } else {
  115. f += ' AND ' + me.filterCondition;
  116. }
  117. }
  118. this.multiselected = [];
  119. me.setLoading(true);//loading...
  120. Ext.Ajax.request({//拿到grid的columns
  121. url : basePath + 'common/datalist.action',
  122. params: {
  123. caller: c,
  124. _noc:(me._noc || getUrlParam('_noc')),
  125. condition: f,
  126. page: g,
  127. pageSize: s
  128. },
  129. method : 'post',
  130. //async: false,
  131. callback : function(options,success,response){
  132. me.setLoading(false);
  133. var res = new Ext.decode(response.responseText);
  134. if(res.exception || res.exceptionInfo){
  135. showError(res.exceptionInfo);
  136. return;
  137. }
  138. var data = res.data != null ? Ext.decode(res.data.replace(/,}/g, '}').replace(/,]/g, ']')) : [];
  139. if(me.columns && me.columns.length > 2){
  140. me.store.loadData(data);
  141. //修改pagingtoolbar信息
  142. Ext.getCmp('pagingtoolbar').updateInfo();
  143. } else {
  144. var store = Ext.create('Ext.data.Store', {
  145. storeId: 'gridStore',
  146. fields: res.fields,
  147. data: data
  148. });
  149. //me.fireEvent('beforereconfigure', me, res.columns, store);
  150. Ext.each(res.columns, function(c){
  151. me.setRenderer(c);
  152. if(c.editor){
  153. // c.locked = true;
  154. c.sortable = false;
  155. }
  156. });
  157. /*me.columns = res.columns;
  158. me.store = store;*/
  159. me.reconfigure(store, res.columns);
  160. //拿到datalist对应的单表的关键词
  161. keyField = res.keyField;
  162. /*me.on('afterrender', function(){
  163. me.getButtons();
  164. });*/
  165. }
  166. //修改pagingtoolbar信息
  167. Ext.getCmp('pagingtoolbar').updateInfo();
  168. }
  169. });
  170. },
  171. getCount: function(c, d){
  172. c = c || caller;
  173. d = d || condition;
  174. var me = this;
  175. var f = d;
  176. if(me.filterCondition){
  177. if(d == null || d == ''){
  178. f = me.filterCondition;
  179. } else {
  180. f += ' AND ' + me.filterCondition;
  181. }
  182. }
  183. Ext.Ajax.request({//拿到grid的数据总数count
  184. url : basePath + '/common/datalistCount.action',
  185. params: {
  186. caller: c,
  187. condition: f
  188. },
  189. method : 'post',
  190. async: false,
  191. callback : function(options,success,response){
  192. var res = new Ext.decode(response.responseText);
  193. dataCount = res.count;
  194. me.getColumnsAndStore();
  195. }
  196. });
  197. },
  198. /**
  199. * buttons由原先在datalist里面配置改为在GridButton表配置;
  200. * 支持多个button;
  201. * 支持传递actionName
  202. */
  203. getButtons: function(){
  204. Ext.Ajax.request({
  205. url : basePath + "common/gridButton.action",
  206. params: {
  207. caller: caller
  208. },
  209. method : 'post',
  210. callback : function(options,success,response){
  211. var localJson = new Ext.decode(response.responseText);
  212. if(localJson.exceptionInfo){
  213. showError(localJson.exceptionInfo);
  214. }
  215. if(localJson.buttons){
  216. var buttons = Ext.decode(localJson.buttons);
  217. Ext.each(buttons, function(b){
  218. var btn = Ext.ComponentQuery.query(b.xtype);
  219. if(btn.length > 0){
  220. btn[0].url = b.url;
  221. btn[0].show();
  222. }
  223. });
  224. }
  225. }
  226. });
  227. },
  228. listeners: {
  229. 'beforeheaderfiltersapply': function(grid, filters) {
  230. if(this.allowFilter){
  231. var condition = null;
  232. for(var fn in filters){
  233. var value = filters[fn];
  234. if(!Ext.isEmpty(value)){
  235. if(Ext.isDate(value)){
  236. value = Ext.Date.toString(value);
  237. value = fn + "=to_date('" + value + "','yyyy-MM-dd') ";
  238. } else {
  239. var exp_t = /^(\d{4})\-(\d{2})\-(\d{2}) (\d{2}):(\d{2}):(\d{2})$/,
  240. exp_d = /^(\d{4})\-(\d{2})\-(\d{2})$/;
  241. if(exp_d.test(value)){
  242. value = fn + "=to_date('" + value + "','yyyy-MM-dd') ";
  243. } else if(exp_t.test(value)){
  244. value = fn + "=to_date('" + value + "','yyyy-MM-dd HH24:mi:ss') ";
  245. } else{
  246. value = fn + " LIKE '%" + value + "%' ";
  247. }
  248. }
  249. if(condition == null){
  250. condition = value;
  251. } else {
  252. condition = condition + " AND " + value;
  253. }
  254. }
  255. }
  256. this.filterCondition = condition;
  257. page = 1;
  258. this.getCount();
  259. } else {
  260. this.allowFilter = true;
  261. }
  262. return false;
  263. }
  264. },
  265. viewConfig: {
  266. stripeRows: true
  267. },
  268. getMultiSelected: function(){
  269. var grid = this;
  270. var records = grid.multiselected;
  271. var items = grid.selModel.getSelection();
  272. Ext.each(items, function(item, index){
  273. records.push(item);
  274. });
  275. return Ext.Array.unique(records);
  276. },
  277. getEffectData: function(){
  278. var grid = this;
  279. var items = grid.selModel.getSelection();
  280. Ext.each(items, function(item, index){
  281. if(this.data[keyField] != null && this.data[keyField] != ''
  282. && this.data[keyField] != '0' && this.data[keyField] != 0){
  283. grid.multiselected.push(item);
  284. }
  285. });
  286. var records = Ext.Array.unique(grid.multiselected);
  287. var fields = new Array();
  288. fields.push({name: keyField, type: 'number'});
  289. Ext.each(grid.columns, function(c, index){
  290. if (c.editor != null || (c.getEditor && c.getEditor() != null)) {
  291. var type = 'string';
  292. if(c.xtype == 'datecolumn'){
  293. type = 'date';
  294. } else if(c.xtype == 'datetimecolumn'){
  295. type = 'datetime';
  296. }
  297. fields.push({
  298. name: c.dataIndex,
  299. type: type
  300. });
  301. }
  302. });
  303. var data = new Array();
  304. var o = null;
  305. Ext.each(records, function(record, index){
  306. o = new Object();
  307. Ext.each(fields, function(f){
  308. var v = record.data[f.name];
  309. if(f.type == 'date'){
  310. if (Ext.isDate(v)) {
  311. v = Ext.Date.format(v, 'Y-m-d');
  312. }
  313. } else if(f.type == 'datetime'){
  314. if (Ext.isDate(v)) {
  315. v = Ext.Date.format(v, 'Y-m-d H:i:s');
  316. }
  317. }
  318. o[f.name] = v;
  319. });
  320. data.push(o);
  321. });
  322. return data;
  323. },
  324. setRenderer: function(column){
  325. var grid = this;
  326. if(!column.haveRendered && column.renderer != null && column.renderer != ""){
  327. var renderName = column.renderer;
  328. if(contains(column.renderer, ':', true)){
  329. var args = new Array();
  330. Ext.each(column.renderer.split(':'), function(a, index){
  331. if(index == 0){
  332. renderName = a;
  333. } else {
  334. args.push(a);
  335. }
  336. });
  337. if(!grid.RenderUtil.args[renderName]){
  338. grid.RenderUtil.args[renderName] = new Object();
  339. }
  340. grid.RenderUtil.args[renderName][column.dataIndex] = args;
  341. }
  342. column.renderer = grid.RenderUtil[renderName];
  343. column.haveRendered = true;
  344. }
  345. },
  346. getCondition: function(){
  347. var condition = '';
  348. if(!Ext.isEmpty(this.defaultCondition)) {
  349. condition = this.defaultCondition;
  350. }
  351. if(this.formCondition) {
  352. if(condition.length > 0)
  353. condition += ' AND (' + this.formCondition + ')';
  354. else
  355. condition = this.formCondition;
  356. }
  357. if(!Ext.isEmpty(this.filterCondition)) {
  358. if(condition == '') {
  359. condition = this.filterCondition;
  360. } else {
  361. condition = '(' + condition + ') AND (' + this.filterCondition + ')';
  362. }
  363. }
  364. return condition;// .replace(/=/g, '%3D')
  365. }
  366. });