From fefb39141d3a421a268f2b6c9226438551cf477d Mon Sep 17 00:00:00 2001 From: Kar Date: Tue, 23 May 2023 01:02:11 +0530 Subject: [PATCH] pagination --- src/pages/api/listUsers.js | 6 ++-- src/pages/user-list.jsx | 58 ++++++++++++++++++++------------------ 2 files changed, 35 insertions(+), 29 deletions(-) diff --git a/src/pages/api/listUsers.js b/src/pages/api/listUsers.js index bb21264..7d4dc3b 100644 --- a/src/pages/api/listUsers.js +++ b/src/pages/api/listUsers.js @@ -4,7 +4,9 @@ import sqlite3 from 'sqlite3'; export default function handler(req,res) { -console.log(req.body.school) + // const query = req.query; + const { page, limit } = req.query; +console.log(page) // const { // query: { name, keyword }, // method, @@ -52,7 +54,7 @@ console.log(req.body.school) }; async function doSomething() { try { - const returnData = await getAllRows('user',2,10); + const returnData = await getAllRows('user',page,limit); res.setHeader('Content-Type', 'application/json') res.status(200).json(returnData) // console.log(data); diff --git a/src/pages/user-list.jsx b/src/pages/user-list.jsx index af66822..df33193 100644 --- a/src/pages/user-list.jsx +++ b/src/pages/user-list.jsx @@ -1,23 +1,28 @@ import { signIn, signOut, useSession } from 'next-auth/react' import React, { useEffect, useState } from "react"; +import { useRouter } from 'next/router' + import Link from 'next/link' import NavBar from '../components/NavBar' -export default function Modal() { +export default function UserList() { + const router = useRouter(); const { data: session } = useSession() - const [user, setUser] = useState([]); - const [maxPageNumber, setMaxPageNumber] = useState([]); -const fetchData = async () => { - const response = await fetch("/api/listUsers"); + const [user, setUser] = useState([]); + const [maxPageNumber, setMaxPageNumber] = useState([]); + const fetchData = async (page) => { + const response = await fetch("/api/listUsers?page="+page+"&limit=10"); const data = await response.json(); - console.log(data) setMaxPageNumber(data.maxPageNumber); return setUser(data.data); - } -// console.log(user) + }; - useEffect(() => { - fetchData(); - },[]) + +// console.log(user) +useEffect(()=>{ if(!router.isReady) return; fetchData(4); }, [router.isReady]); + + // useEffect(() => { + // fetchData(); + // },[]) if(session) { return (
@@ -26,33 +31,33 @@ if(session) {
- + 🔍
- + ⛨ Add User
@@ -85,8 +90,7 @@ if(session) {
- - {/*

Edit

*/} + ✎