Merge branch 'dev' of https://git.point-dev.net/Karimaldeen/Quiz_dashboard into dev
This commit is contained in:
commit
98473e250b
|
|
@ -2,6 +2,7 @@ import React, { useState, useEffect, useRef } from "react";
|
|||
import { useTranslation } from "react-i18next";
|
||||
import { useFilterStateState } from "../../zustand/Filter";
|
||||
import { useDebounce } from "../../utils/useDebounce";
|
||||
import { PaginationParams } from "../../api/utils/PaginationParams";
|
||||
|
||||
interface Props {
|
||||
placeholder: string;
|
||||
|
|
@ -14,12 +15,16 @@ const SearchField: React.FC<Props> = ({ placeholder, searchBy }) => {
|
|||
const inputRef = useRef<HTMLInputElement>(null);
|
||||
|
||||
const { setFilter,Filter } = useFilterStateState();
|
||||
const { page } = PaginationParams(location);
|
||||
|
||||
const handleInputChange = (value: string) => {
|
||||
setSearchQuery(value);
|
||||
};
|
||||
|
||||
const handleInputChangeWithDebounce = useDebounce((value: string) => {
|
||||
if(Number(page) > 1){
|
||||
|
||||
}
|
||||
setFilter({
|
||||
[searchBy]: value,
|
||||
});
|
||||
|
|
|
|||
|
|
@ -3,13 +3,20 @@ import { useTranslation } from "react-i18next";
|
|||
import { Divider, Select } from "antd";
|
||||
import usePagination from "../../Layout/Dashboard/usePagination";
|
||||
import { useNavigate } from "react-router-dom";
|
||||
import { useFilterStateState } from "../../zustand/Filter";
|
||||
|
||||
const PaginationColumn = () => {
|
||||
const { t } = useTranslation();
|
||||
const navigate = useNavigate();
|
||||
const { Filter ,setFilter } = useFilterStateState();
|
||||
|
||||
|
||||
const handleChange = (value: string) => {
|
||||
navigate(`?per_page=${value}`);
|
||||
|
||||
setFilter({
|
||||
per_page:value
|
||||
})
|
||||
};
|
||||
|
||||
return (
|
||||
|
|
|
|||
|
|
@ -22,9 +22,10 @@ const PageTitleComponent = () => {
|
|||
return (
|
||||
<div className='PageTitle'>
|
||||
{(Array.isArray(PageTitle) ? PageTitle : [])?.map((item,index)=>{
|
||||
const lastItem = PageTitle?.length - 1 === index
|
||||
return (
|
||||
<div key={index} className='PageTitleItems' onClick={()=>handleNavigate(item?.path)}>
|
||||
{item?.name} /
|
||||
<div key={index} className={`PageTitleItems ${lastItem ? "PageTitleLastItem" : ""} `} onClick={()=>handleNavigate(item?.path)}>
|
||||
{item?.name} {lastItem ? "" : "/"}
|
||||
</div>
|
||||
)
|
||||
})}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
import { useState, useEffect } from "react";
|
||||
import { useLocation, useNavigate } from "react-router-dom";
|
||||
import { PaginationAntd, PaginationMeta } from "../../types/Table";
|
||||
import { useFilterStateState } from "../../zustand/Filter";
|
||||
|
||||
interface Data {
|
||||
meta: PaginationMeta;
|
||||
|
|
@ -9,6 +10,7 @@ interface Data {
|
|||
const usePagination = (data: Data) => {
|
||||
const navigate = useNavigate();
|
||||
const location = useLocation();
|
||||
const { Filter ,setFilter } = useFilterStateState();
|
||||
|
||||
const [pagination, setPagination] = useState<PaginationAntd>({
|
||||
current: data?.meta?.current_page || 1,
|
||||
|
|
@ -27,7 +29,11 @@ const usePagination = (data: Data) => {
|
|||
}, [data]);
|
||||
|
||||
const handlePageChange = (page: number) => {
|
||||
navigate(`?page=${page}`);
|
||||
// navigate(`?page=${page}`);
|
||||
setFilter({
|
||||
...Filter,
|
||||
page:page
|
||||
})
|
||||
};
|
||||
|
||||
return { pagination, handlePageChange };
|
||||
|
|
|
|||
|
|
@ -14,6 +14,7 @@ const App: React.FC = () => {
|
|||
console.log(filterState,"filterState");
|
||||
|
||||
const response = useGetAllQuestion({
|
||||
nullable_parent:"null",
|
||||
pagination: true,
|
||||
...filterState,
|
||||
content:Filter?.content,
|
||||
|
|
|
|||
|
|
@ -15,6 +15,7 @@ const App: React.FC = () => {
|
|||
const content = Filter?.content ;
|
||||
|
||||
const response = useGetAllQuestion({
|
||||
nullable_parent:"null",
|
||||
lessonsIds: [lesson_id],
|
||||
pagination: true,
|
||||
...filterState,
|
||||
|
|
|
|||
|
|
@ -48,16 +48,18 @@
|
|||
outline: none;
|
||||
border: none;
|
||||
min-width: 120px;
|
||||
border-radius: 10px;
|
||||
padding: 10px;
|
||||
border-radius: 6px;
|
||||
padding: 6px 10px;
|
||||
font-weight: bold;
|
||||
background: var(--primary);
|
||||
color: var(--white);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 5px;
|
||||
gap: 7px;
|
||||
font-size: 14px;
|
||||
svg {
|
||||
font-size: 16px;
|
||||
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -24,7 +24,13 @@
|
|||
.PageTitle{
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
margin-block: 10px;
|
||||
.PageTitleItems{
|
||||
cursor: pointer;
|
||||
color: #6A7287;
|
||||
}
|
||||
}
|
||||
|
||||
.PageTitleLastItem{
|
||||
color: #202C4B !important;
|
||||
}
|
||||
|
|
@ -3,6 +3,7 @@ import useAxios from "./useAxios";
|
|||
import { useLocation } from "react-router-dom";
|
||||
import { PaginationParams } from "../utils/PaginationParams";
|
||||
import { filterParams } from "../utils/filterParams";
|
||||
import { useFilterStateState } from "../../zustand/Filter";
|
||||
function useGetQuery(
|
||||
KEY: string | string[],
|
||||
url: string,
|
||||
|
|
@ -13,10 +14,11 @@ function useGetQuery(
|
|||
const { show, pagination, ...remainingParams } = params;
|
||||
|
||||
const location = useLocation();
|
||||
|
||||
const { page, per_page } = PaginationParams(location);
|
||||
const { Filter ,setFilter } = useFilterStateState();
|
||||
const page = Filter?.page ;
|
||||
const per_page = Filter?.per_page ;
|
||||
// const { per_page } = PaginationParams(location);
|
||||
|
||||
console.log(remainingParams)
|
||||
const paramToSend = pagination
|
||||
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user