2025-03-30 16:42:51 -03:00
|
|
|
import React from 'react';
|
|
|
|
import { View, Text, TouchableOpacity, StyleSheet } from 'react-native';
|
2025-03-30 17:32:22 -03:00
|
|
|
|
2025-03-30 16:42:51 -03:00
|
|
|
|
|
|
|
interface DataTablePaginationProps {
|
|
|
|
page: number;
|
|
|
|
setPage: (page: number) => void;
|
|
|
|
rowsPerPage: number;
|
|
|
|
setRowsPerPage: (rowsPerPage: number) => void;
|
|
|
|
totalItems: number;
|
|
|
|
}
|
|
|
|
|
|
|
|
export const DataTablePagination: React.FC<DataTablePaginationProps> = ({
|
|
|
|
page,
|
|
|
|
setPage,
|
|
|
|
rowsPerPage,
|
|
|
|
setRowsPerPage,
|
|
|
|
totalItems,
|
|
|
|
}) => {
|
|
|
|
const totalPages = Math.ceil(totalItems / rowsPerPage);
|
|
|
|
|
|
|
|
return (
|
|
|
|
<View style={styles.container}>
|
|
|
|
<Text>{}</Text>
|
|
|
|
<View style={styles.navigation}>
|
|
|
|
<TouchableOpacity onPress={() => setPage(0)} disabled={page === 0}>
|
2025-03-30 17:32:22 -03:00
|
|
|
|
2025-03-30 16:42:51 -03:00
|
|
|
</TouchableOpacity>
|
|
|
|
<TouchableOpacity onPress={() => setPage(page - 1)} disabled={page === 0}>
|
2025-03-30 17:32:22 -03:00
|
|
|
|
2025-03-30 16:42:51 -03:00
|
|
|
</TouchableOpacity>
|
|
|
|
<Text>{}</Text>
|
|
|
|
<TouchableOpacity onPress={() => setPage(page + 1)} disabled={page === totalPages - 1}>
|
2025-03-30 17:32:22 -03:00
|
|
|
|
2025-03-30 16:42:51 -03:00
|
|
|
</TouchableOpacity>
|
|
|
|
<TouchableOpacity onPress={() => setPage(totalPages - 1)} disabled={page === totalPages - 1}>
|
2025-03-30 17:32:22 -03:00
|
|
|
|
2025-03-30 16:42:51 -03:00
|
|
|
</TouchableOpacity>
|
|
|
|
</View>
|
|
|
|
</View>
|
|
|
|
);
|
|
|
|
};
|
|
|
|
|
|
|
|
const styles = StyleSheet.create({
|
|
|
|
container: {
|
|
|
|
flexDirection: 'row',
|
|
|
|
justifyContent: 'space-between',
|
|
|
|
alignItems: 'center',
|
|
|
|
padding: 10,
|
|
|
|
borderTopWidth: 1,
|
|
|
|
borderTopColor: '#ccc',
|
|
|
|
},
|
|
|
|
navigation: {
|
|
|
|
flexDirection: 'row',
|
|
|
|
alignItems: 'center',
|
|
|
|
},
|
|
|
|
});
|