Vue - Chart JS | Laravel

Hi. I need help!

I found something like this: https://vue-chartjs.org/guide/#chart-with-props Everything works with the example of local data.

The problem is with the API. I don't know what data to throw by PHP to capture my data in ChartsJS.

My code:

PHP Controller:

public function charts($id)
{

    $post_data = array(
            'date' => '2020-09-19', // labels
            'in' => '1024', // datasets
            'out' => '1024', // datasets
    );

    return response()->json($post_data);
}

ChartsComponent.vue

<template>
        <line-chart
                v-if="loaded"
                :chartdata="chartdata"
                :options="options"/>
            </div>
</template>

<script>
    import LineChart from './Chart.vue'

    export default {
        name: 'LineChartContainer',
        components: { LineChart },
        data: () => ({
            loaded: false,
            chartdata: null
        }),
        async mounted () {
            this.loaded = false
            try {
                const { stats } = await fetch('/dedicated/server/142/charts')
                this.chartdata = stats
                this.loaded = true
            } catch (e) {
                console.error(e)
            }
        }
    }
</script>

Chart.vue

<script>
    import { Line } from 'vue-chartjs'

    export default {
        extends: Line,
        props: {
            chartdata: {
                type: Object,
                default: null
            },
            options: {
                type: Object,
                default: null
            }
        },
        mounted () {
            this.renderChart(this.chartdata, this.options)
        }
    }
</script>