64 lines
1.1 KiB
Vue
64 lines
1.1 KiB
Vue
<template>
|
|
|
|
<div class="mx-auto rounded-lg">
|
|
<apexchart
|
|
width="550" type="line"
|
|
:options="options" :series="this.keun">
|
|
</apexchart>
|
|
</div>
|
|
|
|
|
|
</template>
|
|
|
|
<script>
|
|
|
|
const formatter = new Intl.NumberFormat('en-US', {
|
|
minimumFractionDigits: 2
|
|
});
|
|
|
|
export default {
|
|
name: 'Chart',
|
|
props:{
|
|
kodcaw: String,
|
|
keun: Array
|
|
},
|
|
data: () => ({
|
|
options: {
|
|
chart: {
|
|
id: 'keuntungan-bulanan',
|
|
zoom: {
|
|
enabled: false
|
|
}
|
|
},
|
|
xaxis: {
|
|
categories: [
|
|
"Jan",
|
|
"Feb",
|
|
"Mar",
|
|
"Apr",
|
|
"May",
|
|
"Jun",
|
|
"Jul",
|
|
"Aug",
|
|
"Sep",
|
|
"Oct",
|
|
"Nov",
|
|
"Dec"
|
|
]
|
|
},
|
|
yaxis: {
|
|
labels: {
|
|
formatter: function (value) {
|
|
return 'RM ' + formatter.format(value);
|
|
}
|
|
},
|
|
},
|
|
},
|
|
series: [{
|
|
name: 'Keuntungan (RM)',
|
|
data: [55, 62, 89, 66, 98, 72, 101, 75, 94, 120, 117, 139]
|
|
}]
|
|
})
|
|
}
|
|
</script>
|