bar-chart.js 1.3 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647
  1. (function () {
  2. Vue.component('bar-chart', {
  3. template: '<div class="chart_box" >\
  4. <div :id="chartid" class="chart_box"></div>\
  5. </div>',
  6. props: ['config'],
  7. data: function () {
  8. return {
  9. chartid: _.uniqueId("chart_"),
  10. chart: null,
  11. }
  12. },
  13. mounted: function () {
  14. var that =this;
  15. this.$nextTick(function () {
  16. that.chart = echarts.init(document.getElementById(that.chartid));
  17. if (that.config) {
  18. that.chart.setOption(that.setOption( that.config));
  19. }
  20. })
  21. },
  22. methods: {
  23. setOption: function (options) {
  24. var vm = this;
  25. if(!options)return
  26. var options = $.extend({}, defaults, options);
  27. vm.chart.on('click', function (param){
  28. vm.$emit('click-item', {param:param});
  29. });
  30. return options
  31. }
  32. },
  33. watch: {
  34. config: function (data) {
  35. if (data) {
  36. this.chart.setOption(this.setOption(data));
  37. }
  38. }
  39. }
  40. })
  41. var defaults = {
  42. }
  43. })()