# vue-dataset

A set of Vue.js components to display datasets (lists) with filtering, paging, and sorting capabilities!
Created with reusability in mind, so that one doesn't have to recreate the same functionality for lists over and over again.

vue-dataset does not impose any structure or layout limitations on your HTML, you can use divs, tables or anything you like to present your data.

# Features

  • Highly customizable DOM structure
  • Custom filtering based on the row values from all or specific data keys
  • "Search as" feature allows for searching using a custom search method
  • Multi "column" searching, search data keys are configurable
  • "Sort as" feature allows for sorting using a custom sorting method
  • Multi "column" sorting, sortable data keys are configurable
  • Pagination
  • Global search with debounce setting
  • Easy to extend with custom components

vue-dataset contains 6 components

Component Description
dataset Responsible for distributing data/methods to children (wrapper/data provider)
dataset-item Renders the dataset items
dataset-info Renders the paging information
dataset-pager Renders the paging buttons
dataset-search Renders the search input field
dataset-show Renders the "items per page" dropdown select

Example using cards

Aaron Brock
semper.dui.lectus@sociis.net

6026

1997-07-30

Aaron Franks
Duis.gravida.Praesent@vulputatenisisem.com

75619

1945-07-21

Aaron Puckett
nibh.Phasellus@tristique.net

19293

1950-03-15

Abbot Boyd
quis.arcu.vel@libero.ca

94799

1980-08-30

Abbot Donaldson
ipsum@Sednunc.net

36420

1982-02-07

Showing 1 to 5 of 5000 entries