primevue-mirror/components/lib/dataview/BaseDataView.vue

<script>
import BaseComponent from 'primevue/basecomponent';

const classes = {
    root: ({ props }) => [
        'p-dataview p-component',
        {
            'p-dataview-list': props.layout === 'list',
            'p-dataview-grid': props.layout === 'grid'
        }
    ],
    header: 'p-dataview-header',
    paginatorTop: ({ instance }) => [{ 'p-paginator-top': instance.paginatorTop }],
    content: 'p-dataview-content',
    grid: 'p-grid p-nogutter grid grid-nogutter',
    column: 'p-col col',
    emptyMessage: 'p-dataview-emptymessage',
    paginatorBottom: ({ instance }) => [{ 'p-paginator-bottom': instance.paginatorBottom }],
    footer: 'p-dataview-footer'
};

const { load: loadStyle } = useStyle(styles, { id: 'primevue_dataview_style', manual: true });

export default {
    name: 'BaseDataView',
    extends: BaseComponent,
    props: {
        value: {
            type: Array,
            default: null
        },
        layout: {
            type: String,
            default: 'list'
        },
        rows: {
            type: Number,
            default: 0
        },
        first: {
            type: Number,
            default: 0
        },
        totalRecords: {
            type: Number,
            default: 0
        },
        paginator: {
            type: Boolean,
            default: false
        },
        paginatorPosition: {
            type: String,
            default: 'bottom'
        },
        alwaysShowPaginator: {
            type: Boolean,
            default: true
        },
        paginatorTemplate: {
            type: String,
            default: 'FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink RowsPerPageDropdown'
        },
        pageLinkSize: {
            type: Number,
            default: 5
        },
        rowsPerPageOptions: {
            type: Array,
            default: null
        },
        currentPageReportTemplate: {
            type: String,
            default: '({currentPage} of {totalPages})'
        },
        sortField: {
            type: [String, Function],
            default: null
        },
        sortOrder: {
            type: Number,
            default: null
        },
        lazy: {
            type: Boolean,
            default: false
        },
        dataKey: {
            type: String,
            default: null
        }
    },
    css: {
        classes,
        loadStyle
    },
    provide() {
        return {
            $parentInstance: this
        };
    }
};
</script>