GridPanel.js 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438
  1. Ext.define('erp.view.scm.reserve.setBarcode.GridPanel',{
  2. extend: 'Ext.grid.Panel',
  3. alias: 'widget.erpSetBarcodeGridPanel',
  4. requires: ['erp.view.core.grid.HeaderFilter', 'erp.view.core.toolbar.Toolbar', 'erp.view.core.plugin.CopyPasteMenu'],
  5. id: 'setBarcodeGridPanel',
  6. emptyText : $I18N.common.grid.emptyText,
  7. columnLines : true,
  8. autoScroll : true,
  9. height: 280,
  10. multiselected: [],
  11. store: [],
  12. columns: [],
  13. bodyStyle: 'background-color:#f1f1f1;',
  14. FormUtil: Ext.create('erp.util.FormUtil'),
  15. dockedItems: [{xtype: 'erpToolbar', dock: 'bottom', enableAdd: false, enableDelete: true, enableCopy: true, enablePaste: true, enableUp: false, enableDown: false}],
  16. plugins: [Ext.create('Ext.grid.plugin.CellEditing', {
  17. clicksToEdit: 1
  18. }), Ext.create('erp.view.core.grid.HeaderFilter'), Ext.create('erp.view.core.plugin.CopyPasteMenu')],
  19. headerCt: Ext.create("Ext.grid.header.Container",{
  20. forceFit: true,
  21. sortable: true,
  22. enableColumnMove:true,
  23. enableColumnResize:true,
  24. enableColumnHide: true
  25. }),
  26. features : [Ext.create('Ext.grid.feature.Grouping',{
  27. //startCollapsed: true,
  28. hideGroupedHeader: true,
  29. groupHeaderTpl: '{name} (Count:{rows.length})'
  30. }),{
  31. ftype : 'summary',
  32. showSummaryRow : false,//不显示默认合计行
  33. generateSummaryData: function(){
  34. var me = this,
  35. data = {},
  36. store = me.view.store,
  37. columns = me.view.headerCt.getColumnsForTpl(),
  38. i = 0,
  39. length = columns.length,
  40. //fieldData,
  41. //key,
  42. comp;
  43. //将feature的data打印在toolbar上面
  44. for (i = 0, length = columns.length; i < length; ++i) {
  45. comp = Ext.getCmp(columns[i].id);
  46. data[comp.id] = me.getSummary(store, comp.summaryType, comp.dataIndex, false);
  47. var tb = Ext.getCmp(columns[i].dataIndex + '_' + comp.summaryType);
  48. if(tb){
  49. tb.setText(tb.text.split(':')[0] + ':' + data[comp.id]);
  50. }
  51. }
  52. return data;
  53. }
  54. }],
  55. selModel: Ext.create('Ext.selection.CheckboxModel',{
  56. ignoreRightMouseSelection : false,
  57. listeners:{
  58. selectionchange:function(selModel, selected, options){
  59. selModel.view.ownerCt.selectall = false;
  60. }
  61. },
  62. getEditor: function(){
  63. return null;
  64. },
  65. onRowMouseDown: function(view, record, item, index, e) {//改写的onRowMouseDown方法
  66. var me = view.ownerCt;
  67. var bool = true;
  68. var items = me.selModel.getSelection();
  69. Ext.each(items, function(item, index){
  70. if(item && item.internalId == record.internalId){
  71. bool = false;
  72. me.selModel.deselect(record);
  73. Ext.Array.remove(items, item);
  74. }
  75. });
  76. if(bool){
  77. view.el.focus();
  78. var checkbox = item.childNodes[0].childNodes[0].childNodes[0];
  79. if(checkbox.getAttribute && checkbox.getAttribute('class') == 'x-grid-row-checker'){
  80. items.push(record);
  81. me.selModel.select(items);
  82. } else {
  83. me.selModel.deselect(record);
  84. }
  85. }
  86. me.multiselected = me.selModel.getSelection();
  87. me.summary();
  88. },
  89. onHeaderClick: function(headerCt, header, e) {
  90. if (header.isCheckerHd) {
  91. e.stopEvent();
  92. var isChecked = header.el.hasCls(Ext.baseCSSPrefix + 'grid-hd-checker-on');
  93. if (isChecked) {
  94. this.deselectAll(true);
  95. var grid = Ext.getCmp('setBarcodeGridPanel');
  96. this.deselect(grid.multiselected);
  97. grid.multiselected = new Array();
  98. var els = Ext.select('div[@class=x-grid-row-checker-checked]').elements;
  99. Ext.each(els, function(el, index){
  100. el.setAttribute('class','x-grid-row-checker');
  101. });
  102. header.el.removeCls(Ext.baseCSSPrefix + 'grid-hd-checker-on');//添加这个
  103. } else {
  104. var grid = Ext.getCmp('setBarcodeGridPanel');
  105. this.deselect(grid.multiselected);
  106. grid.multiselected = new Array();
  107. var els = Ext.select('div[@class=x-grid-row-checker-checked]').elements;
  108. Ext.each(els, function(el, index){
  109. el.setAttribute('class','x-grid-row-checker');
  110. });
  111. this.selectAll(true);
  112. this.view.ownerCt.selectall = true;
  113. header.el.addCls(Ext.baseCSSPrefix + 'grid-hd-checker-on');//添加这个
  114. }
  115. }
  116. Ext.getCmp('setBarcodeGridPanel').summary();
  117. }
  118. }),
  119. initComponent : function(){
  120. this.GridUtil = Ext.create('erp.util.GridUtil');
  121. this.BaseUtil = Ext.create('erp.util.BaseUtil');
  122. this.RenderUtil = Ext.create('erp.util.RenderUtil');
  123. condition = this.BaseUtil.getUrlParam('gridCondition');
  124. condition = (condition == null) ? "" : condition.replace(/IS/g,"=");
  125. this.defaultCondition = condition;
  126. var gridParam = {caller: caller, condition: condition};
  127. this.GridUtil.getGridColumnsAndStore(this, 'common/singleGridPanel.action?', gridParam, "");
  128. this.addEvents({
  129. storeloaded: true
  130. });
  131. this.callParent(arguments);
  132. this.initRecords();
  133. this.addKeyBoardEvents();
  134. },
  135. sync: true,
  136. getMultiSelected: function(){
  137. var grid = this;
  138. grid.multiselected = [];
  139. var items = grid.selModel.getSelection();
  140. if(grid.selectall && items.length == grid.store.pageSize) {
  141. items = grid.store.prefetchData.items;
  142. }
  143. Ext.each(items, function(item, index){
  144. if(this.data[grid.keyField] != null && this.data[grid.keyField] != ''
  145. && this.data[grid.keyField] != '0' && this.data[grid.keyField] != 0){
  146. grid.multiselected.push(item);
  147. }
  148. });
  149. return grid.multiselected;
  150. },
  151. unique: function(items) {
  152. var d = new Object();
  153. Ext.Array.each(items, function(item){
  154. d[item.id] = item;
  155. });
  156. return Ext.Object.getValues(d);
  157. },
  158. getGridColumnsAndStore: function(grid, url, param, no,sync){
  159. var me = this;
  160. me.setLoading(true);//loading...
  161. Ext.Ajax.request({//拿到grid的columns
  162. url : basePath + url,
  163. params: param,
  164. method : 'post',
  165. async: sync?false:true,
  166. callback : function(options,success,response){
  167. me.setLoading(false);
  168. var res = new Ext.decode(response.responseText);
  169. if(res.exceptionInfo){
  170. showError(res.exceptionInfo);return;
  171. }
  172. if(me.columns && me.columns.length > 2){
  173. var data = res.data != null ? Ext.decode(res.data.replace(/,}/g, '}').replace(/,]/g, ']')) : [];
  174. me.store.loadData(data);
  175. me.setMore(data.length);
  176. //解决固定列左右不对齐的情况
  177. var lockedView = me.view.lockedView;
  178. if(lockedView){
  179. var tableEl = lockedView.el.child('.x-grid-table');
  180. if(tableEl){
  181. tableEl.dom.style.marginBottom = '7px';
  182. }
  183. }
  184. me.view.refresh();
  185. me.initRecords();
  186. grid.fireEvent('storeloaded', grid);
  187. grid.summary();
  188. } else {
  189. if(res.columns){
  190. Ext.each(res.columns, function(column, y){
  191. me.setRenderer(column);
  192. var logic = column.logic;
  193. if(logic != null){
  194. me.setLogicType(column, logic, y);
  195. }
  196. });
  197. //store
  198. me.store = me.setDefaultStore(res.data, res.fields);
  199. //view
  200. if(me.selModel.views == null){
  201. me.selModel.views = [];
  202. }
  203. if(res.dbfinds.length > 0){
  204. me.dbfinds = res.dbfinds;
  205. }
  206. //toolbar
  207. me.setToolbar(res.columns);
  208. //reconfigure store&columns
  209. me.columns = res.columns;
  210. me.view.doLayout();
  211. }
  212. }
  213. }
  214. });
  215. },
  216. setRenderer: function(column){
  217. var grid = this;
  218. if(!column.haveRendered && column.renderer != null && column.renderer != ""){
  219. var renderName = column.renderer;
  220. if(contains(column.renderer, ':', true)){
  221. var args = new Array();
  222. Ext.each(column.renderer.split(':'), function(a, index){
  223. if(index == 0){
  224. renderName = a;
  225. } else {
  226. args.push(a);
  227. }
  228. });
  229. if(!grid.RenderUtil.args[renderName]){
  230. grid.RenderUtil.args[renderName] = new Object();
  231. }
  232. grid.RenderUtil.args[renderName][column.dataIndex] = args;
  233. }
  234. column.renderer = grid.RenderUtil[renderName];
  235. column.haveRendered = true;
  236. }
  237. },
  238. setLogicType: function(column, logic, y){
  239. var grid = this;
  240. if(logic == 'detno'){
  241. grid.detno = column.dataIndex;
  242. } else if(logic == 'keyField'){
  243. grid.keyField = column.dataIndex;
  244. } else if(logic == 'mainField'){
  245. grid.mainField = column.dataIndex;
  246. } else if(logic == 'necessaryField'){
  247. grid.necessaryField = column.dataIndex;
  248. if(!grid.necessaryFields){
  249. grid.necessaryFields = new Array();
  250. }
  251. grid.necessaryFields.push(column.dataIndex);
  252. if(!column.haveRendered){
  253. column.renderer = function(val, meta, record, x, y, store, view){
  254. var c = this.columns[y];
  255. if(val != null && val.toString().trim() != ''){
  256. if(c.xtype == 'datecolumn'){
  257. val = Ext.Date.format(val, 'Y-m-d');
  258. }
  259. return val;
  260. } else {
  261. if(c.xtype == 'datecolumn'){
  262. val = '';
  263. }
  264. return '<img src="' + basePath + 'resource/images/icon/need.png" title="必填字段">' +
  265. '<span style="color:blue;padding-left:2px;" title="必填字段">' + val + '</span>';
  266. }
  267. };
  268. }
  269. } else if(logic == 'groupField'){
  270. grid.groupField = column.dataIndex;
  271. }
  272. },
  273. setToolbar: function(columns){
  274. var grid = this;
  275. var items = [];
  276. Ext.each(columns, function(column){
  277. if(column.summaryType == 'sum'){
  278. items.push('-',{
  279. id: column.dataIndex + '_sum',
  280. itemId: column.dataIndex,
  281. xtype: 'tbtext',
  282. text: column.text + '(sum):0'
  283. });
  284. } else if(column.summaryType == 'average') {
  285. items.push('-',{
  286. id: column.dataIndex + '_average',
  287. itemId: column.dataIndex,
  288. xtype: 'tbtext',
  289. text: column.text + '(average):0'
  290. });
  291. } else if(column.summaryType == 'count') {
  292. items.push('-',{
  293. id: column.dataIndex + '_count',
  294. itemId: column.dataIndex,
  295. xtype: 'tbtext',
  296. text: column.text + '(count):0'
  297. });
  298. }
  299. });
  300. grid.bbar = {
  301. xtype: 'toolbar',
  302. dock: 'bottom',
  303. items: items
  304. };
  305. },
  306. setDefaultStore: function(d, f){
  307. var me = this;
  308. var data = [];
  309. if(!d || d.length == 2){
  310. me.GridUtil.add10EmptyData(me.detno, data);
  311. me.GridUtil.add10EmptyData(me.detno, data);
  312. } else {
  313. data = Ext.decode(d.replace(/,}/g, '}').replace(/,]/g, ']'));
  314. }
  315. var store = Ext.create('Ext.data.Store', {
  316. fields: f,
  317. data: data,
  318. groupField: me.groupField,
  319. getSum: function(field) {
  320. var records = me.selModel.getSelection(),
  321. total = 0,
  322. i = 0,
  323. len = records.length;
  324. for (; i < len; ++i) {
  325. total += records[i].get(field);
  326. }
  327. return total;
  328. },
  329. getCount: function() {
  330. var records = me.selModel.getSelection(),
  331. count = 0;
  332. Ext.each(records, function(item){
  333. count++;
  334. });
  335. return count;
  336. },
  337. getAverage: function(field) {
  338. var records = me.selModel.getSelection(),
  339. count = 0,
  340. sum = 0;
  341. Ext.each(records, function(item){
  342. if(item.data[me.necessaryField] != null && item.data[me.necessaryField] != ''){
  343. count++;sum += item.data[field];
  344. }
  345. });
  346. return Ext.Number.format(sum/count, '0.00');
  347. }
  348. });
  349. return store;
  350. },
  351. /**
  352. * 修改为selection改变时,summary也动态改变
  353. */
  354. summary: function(){
  355. var me = this,
  356. store = this.store, items = store.data.items, selected = me.selModel.getSelection(),
  357. value, m = me.down('erpToolbar');
  358. b = me.down('tbtext[id=selected-count]');
  359. if (!b) {
  360. m.add('-');
  361. b = m.add({xtype: 'tbtext', id: 'selected-count'});
  362. }
  363. b.setText('共: ' + items.length + ' 条, 已选: ' + selected.length + ' 条');
  364. },
  365. initRecords: function(){
  366. var records = this.store.data.items;
  367. var count = 0;
  368. Ext.each(records, function(record){
  369. if(!record.index){
  370. record.index = count++;
  371. }
  372. });
  373. },
  374. getSum: function(records, field) {
  375. var total = 0,
  376. i = 0,
  377. len = records.length;
  378. (len == 0) && (records = this.store.data.items);
  379. for (; i < len; ++i) {
  380. total += records[i].get(field);
  381. }
  382. return total;
  383. },
  384. listeners: {
  385. scrollershow: function(scroller) {
  386. if (scroller && scroller.scrollEl) {
  387. scroller.clearManagedListeners();
  388. scroller.mon(scroller.scrollEl, 'scroll', scroller.onElScroll, scroller);
  389. }
  390. }
  391. },
  392. setMore : function(c) {
  393. if(c >= 1000) {
  394. var g = this, e = g.down('erpToolbar');
  395. if(!g.bigVolume) {
  396. var m = e.down('tool[name=more]');
  397. if(!m) {
  398. m = Ext.create('Ext.panel.Tool', {
  399. name: 'more',
  400. type: 'right',
  401. margin: '0 5 0 5',
  402. handler: function() {
  403. g.bigVolume = true;
  404. g.ownerCt.down('form').onQuery();
  405. m.disable();
  406. }
  407. });
  408. e.add('->')
  409. e.add(m);
  410. } else {
  411. m.show();
  412. }
  413. }
  414. }
  415. },
  416. addKeyBoardEvents: function(){
  417. var me = this;
  418. if(Ext.isIE){
  419. document.body.attachEvent('onkeydown', function(){//ie的事件名称不同,也不支持addEventListener
  420. if(window.event.altKey && window.event.ctrlKey && window.event.keyCode == 83){
  421. me.FormUtil.onAdd('form' + caller, 'Form配置维护(' + caller + ')', "jsps/ma/multiform.jsp?whoami=" + caller+"&formParam=''");
  422. }
  423. });
  424. } else {
  425. document.body.addEventListener("keydown", function(e){
  426. if(Ext.isFF5){//firefox不支持window.event
  427. e = e || window.event;
  428. }
  429. if(e.altKey && e.ctrlKey && e.keyCode == 83){
  430. me.FormUtil.onAdd('form' + caller, 'Form配置维护(' + caller + ')', "jsps/ma/multiform.jsp?whoami=" + caller+"&formParam=''");
  431. }
  432. });
  433. }
  434. }
  435. });