MonthPurchase.js 1.8 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364
  1. Ext.define('saas.view.home.charts.MonthPurchase', {
  2. extend: 'saas.view.core.chart.ChartBase',
  3. xtype: 'month-purchase',
  4. id: 'month-purchase',
  5. initComponent: function() {
  6. var me = this;
  7. Ext.apply(me, {
  8. items: [{
  9. xtype: 'cartesian',
  10. colors: [
  11. '#34BAF6'
  12. ],
  13. bind: {
  14. store: '{month_purchase}',
  15. captions: {
  16. title: {
  17. text: '本月采购额(万元):{month_purchase_amount}',
  18. style: {
  19. 'font-size': '14px',
  20. 'color': '#485465',
  21. 'letter-spacing': '-0.07px'
  22. },
  23. align: 'left'
  24. }
  25. },
  26. },
  27. axes: [{
  28. type: 'category',
  29. fields: [
  30. 'x'
  31. ],
  32. position: 'bottom'
  33. },{
  34. type: 'numeric',
  35. fields: [
  36. 'y'
  37. ],
  38. position: 'left'
  39. }],
  40. series: [{
  41. type: 'bar',
  42. xField: 'x',
  43. yField: [
  44. 'y'
  45. ],
  46. tooltip: {
  47. trackMouse: true,
  48. renderer: me.onBarTipRender
  49. }
  50. }]
  51. }]
  52. });
  53. me.callParent(arguments);
  54. },
  55. onBarTipRender: function (tooltip, record, item) {
  56. tooltip.setHtml(record.get('x') + ': ' + record.get('y') + '万元');
  57. },
  58. });