Table
A simple component based table, with search and sort slots.
Summer Vibes
20.4MB
|
1080P | H264
457 view(s)
|
3m 22s
2023-07-14, 02:15 PM
Midnight Thoughts
20.4MB
|
1080P | H264
1654 view(s)
|
5m 41s
2022-11-03, 11:52 PM
Morning Routine
20.4MB
|
1080P | H264
87 view(s)
|
1m 58s
2024-01-20, 07:30 AM
Urban Jungle
20.4MB
|
1080P | H264
3 view(s)
|
4m 15s
2021-05-09, 09:45 PM
Showing 1 to 4 of 10
Installation
npx cedar-ui@latest add table
npm i @aminnausin/cedar-ui
or download the following folders to your project:
@/components/cedar-ui/table
Usage
vue
<script setup lang="ts">
import { TableBase } from '@/components/cedar-ui/hover-card'
import { ref } from 'vue';
const searchQuery = ref('')
</script>
<template>
<TableBase
:data="rows"
:row="RowComponent"
:clickAction="
() => {
toast.info('Primary Action');
}
"
:otherAction="
() => {
toast.info('Other Action');
}
"
:loading="isLoadingRows"
:useToolbar="true"
:sortAction="handleSort"
:sortingOptions="sortingOptions"
:selectedID="-1"
:startAscending="true"
:search-query="searchQuery"
:items-per-page="12"
v-model="searchQuery"
/>
</template>