You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

58 lines
1.1 KiB
Vue

<template>
<div style="width: 100%; height: 100%">
<div class="chart-style" style="width: 100%; height: 100%">
<vue-chart :option="chartOption" style="width: 100%; height: 100%" />
</div>
</div>
</template>
<script lang="ts" setup>
import VueChart from "./VueChart.vue";
import { computed } from "vue";
const props = defineProps({
month_data: {
type: Array,
default: () => []
},
day_data: {
type: Array,
default: () => []
},
data: {
type: Array,
default: () => []
}
});
const name_list = computed(() => {
return props.data.map((item: any) => {
return item.name;
});
});
const value_list = computed(() => {
return props.data.map((item: any) => {
return item.value;
});
});
const chartOption = computed(() => {
return {
xAxis: {
type: "category",
data: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"]
},
yAxis: {
type: "value"
},
series: [
{
data: [820, 932, 901, 934, 1290, 1330, 1320],
type: "line",
smooth: true
}
]
};
});
</script>