f60051068df3e0844a17eedfa2abfa98a5046f47.svn-base 995 B

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950
  1. <template>
  2. <div :style="{ padding: '0 0 32px 32px' }">
  3. <h4 :style="{ marginBottom: '20px' }">{{ title }}</h4>
  4. <v-chart :forceFit="true" :height="height" :data="dataSource" :scale="scale" :padding="padding">
  5. <v-tooltip/>
  6. <v-axis/>
  7. <v-bar position="x*y"/>
  8. </v-chart>
  9. </div>
  10. </template>
  11. <script>
  12. import { triggerWindowResizeEvent } from '@/utils/util'
  13. export default {
  14. name: 'Bar',
  15. props: {
  16. dataSource: {
  17. type: Array,
  18. required: true
  19. },
  20. yaxisText: {
  21. type: String,
  22. default: 'y'
  23. },
  24. title: {
  25. type: String,
  26. default: ''
  27. },
  28. height: {
  29. type: Number,
  30. default: 300
  31. }
  32. },
  33. data() {
  34. return { padding: ['auto', 'auto', '40', '50'] }
  35. },
  36. computed: {
  37. scale() {
  38. return [{
  39. dataKey: 'y',
  40. alias: this.yaxisText
  41. }]
  42. }
  43. },
  44. mounted() {
  45. triggerWindowResizeEvent()
  46. }
  47. }
  48. </script>