GridPanel.js 20 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625
  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. tempStore:new Object(),
  11. store: [],
  12. columns: [],
  13. bodyStyle: 'background-color:#f1f1f1;',
  14. dockedItems: [{xtype: 'erpToolbar', dock: 'bottom', enableAdd: false, enableDelete: false, enableCopy: false, enablePaste: false, enableUp: false, enableDown: false}],
  15. plugins: [Ext.create('Ext.grid.plugin.CellEditing', {
  16. clicksToEdit: 1
  17. }), Ext.create('erp.view.core.grid.HeaderFilter'), Ext.create('erp.view.core.plugin.CopyPasteMenu')],
  18. headerCt: Ext.create("Ext.grid.header.Container",{
  19. forceFit: false,
  20. sortable: true,
  21. enableColumnMove:true,
  22. enableColumnResize:true,
  23. enableColumnHide: true
  24. }),
  25. features : [Ext.create('Ext.grid.feature.Grouping',{
  26. //startCollapsed: true,
  27. hideGroupedHeader: true,
  28. groupHeaderTpl: '{name} (Count:{rows.length})'
  29. }),{
  30. ftype : 'summary',
  31. showSummaryRow : false,//不显示默认合计行
  32. generateSummaryData: function(){
  33. var me = this,
  34. data = {},
  35. store = me.view.store,
  36. columns = me.view.headerCt.getColumnsForTpl(),
  37. i = 0,
  38. length = columns.length,
  39. //fieldData,
  40. //key,
  41. comp, value;
  42. //将feature的data打印在toolbar上面
  43. for (i = 0, length = columns.length; i < length; ++i) {
  44. comp = Ext.getCmp(columns[i].id);
  45. data[comp.id] = me.getSummary(store, comp.summaryType, comp.dataIndex, false);
  46. var tb = Ext.getCmp(columns[i].dataIndex + '_' + comp.summaryType);
  47. if(tb){
  48. value = data[comp.id];
  49. if(comp.xtype == 'numbercolumn') {
  50. value = Ext.util.Format.number(value, (comp.format || '0,000.000'));
  51. }
  52. tb.setText(tb.text.split(':')[0] + ':' + value);
  53. }
  54. }
  55. return data;
  56. }
  57. }],
  58. selModel: Ext.create('Ext.selection.CheckboxModel',{
  59. checkOnly : true,
  60. ignoreRightMouseSelection : false,
  61. listeners:{
  62. selectionchange:function(selModel, selected, options){
  63. selModel.view.ownerCt.summary();
  64. selModel.view.ownerCt.selectall = false;
  65. }
  66. },
  67. getEditor: function(){
  68. return null;
  69. },
  70. onHeaderClick: function(headerCt, header, e) {
  71. if (header.isCheckerHd) {
  72. e.stopEvent();
  73. var isChecked = header.el.hasCls(Ext.baseCSSPrefix + 'grid-hd-checker-on');
  74. if (isChecked && this.getSelection().length > 0) {//先全选,再筛选后再全选时,无法响应的bug
  75. this.deselectAll(true);
  76. } else {
  77. this.selectAll(true);
  78. this.view.ownerCt.selectall = true;
  79. }
  80. }
  81. }
  82. }),
  83. initComponent : function(){
  84. this.GridUtil = Ext.create('erp.util.GridUtil');
  85. this.BaseUtil = Ext.create('erp.util.BaseUtil');
  86. this.RenderUtil = Ext.create('erp.util.RenderUtil');
  87. condition = this.BaseUtil.getUrlParam('urlcondition');
  88. condition = (condition == null) ? "" : condition;
  89. condition = condition.replace(/@/,"'%").replace(/@/,"%'");
  90. this.defaultCondition = condition;
  91. var gridParam = {caller: caller, condition: condition};
  92. //this.GridUtil.getGridColumnsAndStore(this, 'common/singleGridPanel.action?', gridParam, "");
  93. this.getGridColumnsAndStore(this, 'common/singleGridPanel.action?', gridParam, "",true);
  94. this.addEvents({
  95. storeloaded: true
  96. });
  97. this.callParent(arguments);
  98. this.initRecords();
  99. },
  100. sync: true,
  101. getMultiSelected: function(){
  102. var grid = this;
  103. grid.multiselected = [];
  104. var items = grid.selModel.getSelection();
  105. if(grid.selectall && items.length == grid.store.pageSize && grid.store.prefetchData) {
  106. items = grid.store.prefetchData.items;
  107. }
  108. Ext.each(items, function(item, index){
  109. if(this.data[grid.keyField] != null && this.data[grid.keyField] != ''
  110. && this.data[grid.keyField] != '0' && this.data[grid.keyField] != 0){
  111. grid.multiselected.push(item);
  112. }
  113. });
  114. return grid.multiselected;
  115. },
  116. unique: function(items) {
  117. var d = new Object();
  118. Ext.Array.each(items, function(item){
  119. d[item.id] = item;
  120. });
  121. return Ext.Object.getValues(d);
  122. },
  123. getGridColumnsAndStore: function(grid, url, param, no,sync){
  124. var me = this;
  125. me.setLoading(true);//loading...
  126. Ext.Ajax.request({//拿到grid的columns
  127. url : basePath + url,
  128. params: param,
  129. method : 'post',
  130. async: sync?false:true,
  131. callback : function(options,success,response){
  132. me.setLoading(false);
  133. var res = new Ext.decode(response.responseText);
  134. if(res.exceptionInfo){
  135. showError(res.exceptionInfo);return;
  136. }
  137. if(me.columns && me.columns.length > 2){
  138. var data = res.data != null ? Ext.decode(res.data.replace(/,}/g, '}').replace(/,]/g, ']')) : [];
  139. var sel=Ext.Object.getKeys(me.tempStore),form=Ext.getCmp('dealform');
  140. var keys=new Array();
  141. if(form.detailkeyfield){
  142. keys=form.detailkeyfield.split('#');
  143. }else{
  144. keys.push(grid.keyField);
  145. }
  146. Ext.each(data, function(d){
  147. var s='';
  148. Ext.each(keys,function(k){
  149. });
  150. if(sel.length&&Ext.Array.contains(sel,s)){
  151. d.turned='是';
  152. Ext.each(me.columns,function(col){
  153. if(col.dataIndex&&col.readOnly){
  154. me.tempStore[s][col.dataIndex]=d[col.dataIndex];
  155. }
  156. });
  157. }else
  158. d.turned='否';
  159. });
  160. me.store.loadData(data);
  161. me.setMore(data.length);
  162. //解决固定列左右不对齐的情况
  163. var lockedView = me.view.lockedView;
  164. if(lockedView){
  165. var tableEl = lockedView.el.child('.x-grid-table');
  166. if(tableEl){
  167. tableEl.dom.style.marginBottom = '7px';
  168. }
  169. }
  170. me.view.refresh();
  171. me.initRecords();
  172. grid.fireEvent('storeloaded', grid);
  173. grid.summary();
  174. } else if(res.columns){
  175. var limits = res.limits, limitArr = new Array();
  176. if(limits != null && limits.length > 0) {//权限外字段
  177. limitArr = Ext.Array.pluck(limits, 'lf_field');
  178. }
  179. var column_add=[/*{
  180. text: '是否已暂存',
  181. dataIndex: 'turned',
  182. cls: "x-grid-header-1",
  183. locked: true,
  184. width: 80,
  185. filter: {dataIndex: "turned",
  186. displayField: "display",
  187. exactSearch: false,
  188. filtertype: null,
  189. hideTrigger: false,
  190. ignoreCase: false,
  191. queryMode: "local",
  192. store: null,
  193. valueField: "value",
  194. xtype: "textfield"}
  195. }*/];
  196. res.columns=Ext.Array.merge(column_add,res.columns);
  197. res.fields.push({name: 'turned',type: "string"});
  198. Ext.each(res.columns, function(column, y){
  199. if(column.xtype=='textareatrigger'){
  200. column.xtype='';
  201. column.renderer='texttrigger';
  202. }
  203. // column有取别名
  204. if(column.dataIndex.indexOf(' ') > -1) {
  205. column.dataIndex = column.dataIndex.split(' ')[1];
  206. }
  207. //power
  208. if(limitArr.length > 0 && Ext.Array.contains(limitArr, column.dataIndex)) {
  209. column.hidden = true;
  210. }
  211. //renderer
  212. me.setRenderer(column);
  213. //logictype
  214. me.setLogicType(column, column.logic, {headerColor: res.necessaryFieldColor},y);
  215. });
  216. //data
  217. var data = [];
  218. if(!res.data || res.data.length == 2){
  219. if (grid.buffered) {
  220. me.GridUtil.add10EmptyData(grid.detno, data);
  221. me.GridUtil.add10EmptyData(grid.detno, data);//添加20条空白数据
  222. } else {
  223. grid.on('reconfigure', function(){// 改为Grid加载后再添加空行,节约200~700ms
  224. me.GridUtil.add10EmptyItems(grid, 40, false);
  225. });
  226. }
  227. } else {
  228. data = Ext.decode(res.data.replace(/,}/g, '}').replace(/,]/g, ']'));
  229. }
  230. //store
  231. var store = me.GridUtil.setStore(grid, res.fields, data, grid.groupField, grid.necessaryField);
  232. //view
  233. if(grid.selModel && grid.selModel.views == null){
  234. grid.selModel.views = [];
  235. }
  236. //dbfind
  237. if(res.dbfinds && res.dbfinds.length > 0){
  238. grid.dbfinds = res.dbfinds;
  239. }
  240. //reconfigure
  241. if(grid.sync) {//同步加载的Grid
  242. grid.reconfigure(store, res.columns);
  243. grid.on('afterrender', function(){
  244. me.GridUtil.setToolbar(grid, grid.columns, grid.necessaryField, limitArr);
  245. });
  246. } else {
  247. //toolbar
  248. if (grid.generateSummaryData === undefined) {// 改为Grid加载后再添加合计,节约60ms
  249. me.GridUtil.setToolbar(grid, res.columns, grid.necessaryField, limitArr);
  250. }
  251. grid.reconfigure(store, res.columns);
  252. }
  253. if(grid.buffered) {//缓冲数据的Grid
  254. grid.verticalScroller = Ext.create('Ext.grid.PagingScroller', {
  255. activePrefetch: false,
  256. store: store
  257. });
  258. store.guaranteeRange(0, Math.min(store.pageSize, store.prefetchData.length) - 1);
  259. }
  260. var form = Ext.ComponentQuery.query('form');
  261. if(form && form.length > 0){
  262. grid.readOnly = form[0].readOnly;//grid不可编辑
  263. }
  264. }
  265. }
  266. });
  267. },
  268. setRenderer: function(column){
  269. var grid = this;
  270. if(!column.haveRendered && column.renderer != null && column.renderer != ""){
  271. var renderName = column.renderer;
  272. if(contains(column.renderer, ':', true)){
  273. var args = new Array();
  274. Ext.each(column.renderer.split(':'), function(a, index){
  275. if(index == 0){
  276. renderName = a;
  277. } else {
  278. args.push(a);
  279. }
  280. });
  281. if(!grid.RenderUtil.args[renderName]){
  282. grid.RenderUtil.args[renderName] = new Object();
  283. }
  284. grid.RenderUtil.args[renderName][column.dataIndex] = args;
  285. }
  286. column.renderer = grid.RenderUtil[renderName];
  287. column.renderName=renderName;
  288. column.haveRendered = true;
  289. }
  290. },
  291. setLogicType: function(column, logic, headerCss,y){
  292. var grid = this;
  293. if(logic == 'detno'){
  294. grid.detno = column.dataIndex;
  295. } else if(logic == 'keyField'){
  296. grid.keyField = column.dataIndex;
  297. } else if(logic == 'mainField'){
  298. grid.mainField = column.dataIndex;
  299. } else if(logic == 'necessaryField'){
  300. grid.necessaryField = column.dataIndex;
  301. if(!grid.necessaryFields){
  302. grid.necessaryFields = new Array();
  303. }
  304. grid.necessaryFields.push(column.dataIndex);
  305. if(!column.haveRendered){
  306. column.renderer = function(val, meta, record, x, y, store, view){
  307. var c = this.columns[y];
  308. if(val != null && val.toString().trim() != ''){
  309. if(c.xtype == 'datecolumn'){
  310. val = Ext.Date.format(val, 'Y-m-d');
  311. }
  312. return val;
  313. } else {
  314. if(c.xtype == 'datecolumn'){
  315. val = '';
  316. }
  317. return '<img src="' + basePath + 'resource/images/icon/need.png" title="必填字段">' +
  318. '<span style="color:blue;padding-left:2px;" title="必填字段">' + val + '</span>';
  319. }
  320. };
  321. }
  322. if(headerCss.headerColor)
  323. column.style = 'color:#' + headerCss.headerColor;
  324. } else if(logic == 'groupField'){
  325. grid.groupField = column.dataIndex;
  326. }
  327. },
  328. setToolbar: function(columns){
  329. var grid = this;
  330. var items = [];
  331. var bool = true;
  332. Ext.each(grid.dockedItems.items, function(item){
  333. if(item.dock == 'bottom' && item.items){//bbar已存在
  334. bool = false;
  335. }
  336. });
  337. if(bool){
  338. Ext.each(columns, function(column){
  339. if(column.summaryType == 'sum'){
  340. items.push('-',{
  341. id: column.dataIndex + '_sum',
  342. itemId: column.dataIndex,
  343. xtype: 'tbtext',
  344. text: column.text + '(sum):0'
  345. });
  346. } else if(column.summaryType == 'average') {
  347. items.push('-',{
  348. id: column.dataIndex + '_average',
  349. itemId: column.dataIndex,
  350. xtype: 'tbtext',
  351. text: column.text + '(average):0'
  352. });
  353. } else if(column.summaryType == 'count') {
  354. items.push('-',{
  355. id: column.dataIndex + '_count',
  356. itemId: column.dataIndex,
  357. xtype: 'tbtext',
  358. text: column.text + '(count):0'
  359. });
  360. }
  361. });
  362. grid.addDocked({
  363. xtype: 'toolbar',
  364. dock: 'bottom',
  365. items: items
  366. });
  367. }else{
  368. var bars = Ext.ComponentQuery.query('erpToolbar');
  369. if(bars.length > 0){
  370. Ext.each(columns, function(column){
  371. if(column.summaryType == 'sum'){
  372. bars[0].add('-');
  373. bars[0].add({
  374. id: column.dataIndex + '_sum',
  375. itemId: column.dataIndex,
  376. xtype: 'tbtext',
  377. text: column.text + '(sum):0'
  378. });
  379. } else if(column.summaryType == 'average') {
  380. bars[0].add('-');
  381. bars[0].add({
  382. id: column.dataIndex + '_average',
  383. itemId: column.dataIndex,
  384. xtype: 'tbtext',
  385. text: column.text + '(average):0'
  386. });
  387. } else if(column.summaryType == 'count') {
  388. bars[0].add('-');
  389. bars[0].add({
  390. id: column.dataIndex + '_count',
  391. itemId: column.dataIndex,
  392. xtype: 'tbtext',
  393. text: column.text + '(count):0'
  394. });
  395. }
  396. });
  397. }
  398. }
  399. },
  400. setDefaultStore: function(d, f){
  401. var me = this;
  402. var data = [];
  403. if(!d || d.length == 2){
  404. me.GridUtil.add10EmptyData(me.detno, data);
  405. me.GridUtil.add10EmptyData(me.detno, data);
  406. } else {
  407. data = Ext.decode(d.replace(/,}/g, '}').replace(/,]/g, ']'));
  408. }
  409. var store = Ext.create('Ext.data.Store', {
  410. fields: f,
  411. data: data,
  412. groupField: me.groupField,
  413. getSum: function(field) {
  414. var records = me.selModel.getSelection(),
  415. total = 0,
  416. i = 0,
  417. len = records.length;
  418. for (; i < len; ++i) {
  419. total += records[i].get(field);
  420. }
  421. return total;
  422. },
  423. getCount: function() {
  424. var records = me.selModel.getSelection(),
  425. count = 0;
  426. Ext.each(records, function(item){
  427. count++;
  428. });
  429. return count;
  430. },
  431. getAverage: function(field) {
  432. var records = me.selModel.getSelection(),
  433. count = 0,
  434. sum = 0;
  435. Ext.each(records, function(item){
  436. if(item.data[me.necessaryField] != null && item.data[me.necessaryField] != ''){
  437. count++;sum += item.data[field];
  438. }
  439. });
  440. return Ext.Number.format(sum/count, '0.00');
  441. }
  442. });
  443. return store;
  444. },
  445. /**
  446. * 修改为selection改变时,summary也动态改变
  447. */
  448. summary: function(){
  449. var me = this,
  450. store = this.store, items = store.data.items, selected = me.selModel.getSelection(),
  451. value, m = me.down('erpToolbar'), n = me.down('toolbar[to=select]');
  452. Ext.each(me.columns, function(c){
  453. if(c.summaryType && !n)
  454. n = me.addDocked({
  455. xtype: 'toolbar',
  456. dock: 'bottom',
  457. to: 'select',
  458. items: [{
  459. xtype: 'tbtext',
  460. text: '已勾选',
  461. style: {
  462. marginLeft: '6px'
  463. }
  464. }]
  465. })[0];
  466. if(c.summaryType == 'sum'){
  467. me.updateSummary(c, me.getSum(items, c.dataIndex), 'sum', m);
  468. me.updateSummary(c, me.getSum(selected, c.dataIndex), 'sum', n);
  469. } else if(c.summaryType == 'count'){
  470. me.updateSummary(c, items.length, 'count', m);
  471. me.updateSummary(c, selected.length, 'count', n);
  472. }
  473. });
  474. if(n) {
  475. var count = n.down('tbtext[id=selected-count]');
  476. if(!count) {
  477. n.add('->');
  478. count = n.add({
  479. xtype: 'tbtext',
  480. id: 'selected-count'
  481. });
  482. }
  483. count.setText('共: ' + items.length + ' 条, 已选: ' + selected.length + ' 条');
  484. }
  485. },
  486. updateSummary: function(column, value, type, scope) {
  487. var id = column.dataIndex + '_' + type + (scope.to == 'select' ? '_select' : ''),
  488. b = scope.down('tbtext[id=' + id + ']');
  489. if (!b) {
  490. scope.add('-');
  491. b = scope.add({xtype: 'tbtext', id: id});
  492. }
  493. if(column.xtype == 'numbercolumn') {
  494. value = Ext.util.Format.number(value, (column.format || '0,000.000'));
  495. }
  496. b.setText(column.text + '(' + type + '):' + value);
  497. },
  498. initRecords: function(){
  499. var records = this.store.data.items;
  500. var count = 0;
  501. Ext.each(records, function(record){
  502. if(!record.index){
  503. record.index = count++;
  504. }
  505. });
  506. },
  507. getSum: function(records, field) {
  508. var total = 0,
  509. i = 0,
  510. len = records.length;
  511. (len == 0) && (records = this.store.data.items);
  512. for (; i < len; ++i) {
  513. total += records[i].get(field);
  514. }
  515. return total;
  516. },
  517. listeners: {
  518. scrollershow: function(scroller) {
  519. if (scroller && scroller.scrollEl) {
  520. scroller.clearManagedListeners();
  521. scroller.mon(scroller.scrollEl, 'scroll', scroller.onElScroll, scroller);
  522. }
  523. }
  524. },
  525. setMore : function(c) {
  526. if(c >= 1000) {
  527. var g = this, e = g.down('erpToolbar');
  528. if(!g.bigVolume) {
  529. var m = e.down('tool[name=more]');
  530. if(!m) {
  531. m = Ext.create('Ext.panel.Tool', {
  532. name: 'more',
  533. type: 'right',
  534. margin: '0 5 0 5',
  535. handler: function() {
  536. g.bigVolume = true;
  537. g.ownerCt.down('form').onQuery();
  538. m.disable();
  539. }
  540. });
  541. e.add('->');
  542. e.add(m);
  543. } else {
  544. m.show();
  545. }
  546. }
  547. }
  548. },
  549. viewConfig: {// 显示分仓库库存
  550. listeners: {
  551. render: function(view) {
  552. var prodfield = view.ownerCt.getProdField();
  553. if(prodfield && !view.tip) {
  554. view.tip = Ext.create('Ext.tip.ToolTip', {
  555. target: view.el,
  556. delegate: view.itemSelector,
  557. trackMouse: true,
  558. renderTo: Ext.getBody(),
  559. listeners: {
  560. beforeshow: function updateTipBody(tip) {
  561. var record = view.getRecord(tip.triggerElement),
  562. grid = view.ownerCt;
  563. if(record && grid.productwh) {
  564. var c = record.get(prodfield), pws = new Array();
  565. Ext.each(grid.productwh, function(d){
  566. if(d.PW_PRODCODE == c) {
  567. pws.push(d);
  568. }
  569. });
  570. tip.down('grid').setTitle(c);
  571. tip.down('grid').store.loadData(pws);
  572. }
  573. }
  574. },
  575. items: [{
  576. xtype: 'grid',
  577. width: 300,
  578. columns: [{
  579. text: '仓库编号',
  580. cls: 'x-grid-header-1',
  581. dataIndex: 'PW_WHCODE',
  582. width: 80
  583. },{
  584. text: '仓库名称',
  585. cls: 'x-grid-header-1',
  586. dataIndex: 'WH_DESCRIPTION',
  587. width: 120
  588. },{
  589. text: '库存',
  590. cls: 'x-grid-header-1',
  591. xtype: 'numbercolumn',
  592. align: 'right',
  593. dataIndex: 'PW_ONHAND',
  594. width: 90
  595. }],
  596. columnLines: true,
  597. title: '物料分仓库存',
  598. store: new Ext.data.Store({
  599. fields: ['PW_WHCODE', 'WH_DESCRIPTION', 'PW_ONHAND'],
  600. data: [{}]
  601. })
  602. }]
  603. });
  604. }
  605. }
  606. },
  607. getRowClass: function(record) {
  608. if(record.get('turned') =='是'){
  609. return 'custom-turned';//'x-grid-row-turned';
  610. }
  611. }
  612. },
  613. getProdField : function() {
  614. var f = null;
  615. switch (caller){
  616. case 'SendNotify!ToProdIN!Deal' ://通知单转出货
  617. f = 'snd_prodcode';
  618. break;
  619. case 'Sale!ToAccept!Deal' ://订单转出货
  620. f = 'sd_prodcode';
  621. break;
  622. }
  623. return f;
  624. }
  625. });