vue-app-tools

Datatable (var-datatable)

compatible with fraravel and laravel.

configuration

(file:dt_conf.js)
export default {
    config: {
        path: "product_color",
    },
    header: [
        {
            text: "Id",
            key: "id",
            useFilter: true,
            style: {
                width: "50px",
                "justify-content": "center"
            }
        },

        {
            text: "Name",
            key: "name",
            useFilter: true,
            style: {
                width: "100%",
            }
        }
    ]
}

include in vue component

<template>
    <div class="app-home-template">
        <p>List of product colors</p>
        <vat-datatable ref="datatable" class="dt"/>
    </div>
</template>

<script>
    export default {
        mounted() {
            //import config and set datatable using vue refs.
            import("./dt_conf.js").then(r => { this.$refs["datatable"].setConfig(r.default); });
        }
    };
</script>