GridPanel.js 17 KB

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