LineChart.vue 970 B

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950
  1. <template>
  2. <view class="data-box">
  3. <view class="headline">{{ title }} </view>
  4. <template v-if="vo">
  5. <!-- <line-chart :chartData="vo" width="100%" height="472rpx" :padding="{ right: 30 }"
  6. :legendConfig="{ position: 'top' }" :yAxisConfig="yAxisConfig" /> -->
  7. <qiun-data-charts
  8. ref="chartRef"
  9. type="line"
  10. :opts="opts"
  11. :chartData="$Props.vo"
  12. />
  13. </template>
  14. </view>
  15. </template>
  16. <script lang="ts" setup>
  17. import { ref, onMounted, watch } from "vue";
  18. import { getSevenDayApi } from "@/api/ShopContent.ts";
  19. const $Props = defineProps({
  20. vo: {
  21. type: Object,
  22. default: null,
  23. },
  24. title: {
  25. type: String,
  26. default: null,
  27. },
  28. yAxisConfig: {
  29. type: Object,
  30. default: () => {},
  31. }
  32. });
  33. const opts = ref({
  34. dataLabel: false,
  35. });
  36. </script>
  37. <style lang="scss" scoped>
  38. @import url("./index.scss");
  39. :deep(.legend-top) {
  40. padding-left: 0;
  41. padding-right: 0;
  42. box-shadow: none;
  43. }
  44. </style>