ui(admin): make all tables searchable and sortable
This commit is contained in:
parent
8f8d66584d
commit
c0e9f1adee
27 changed files with 968 additions and 229 deletions
|
@ -1,10 +1,63 @@
|
|||
import http from '@/api/http';
|
||||
import http, { getPaginationSet, PaginatedResult } from '@/api/http';
|
||||
import { createContext, useContext } from 'react';
|
||||
import useSWR from 'swr';
|
||||
import { Egg, rawDataToEgg } from '@/api/admin/eggs/getEgg';
|
||||
|
||||
export default (nestId: number): Promise<Egg[]> => {
|
||||
return new Promise((resolve, reject) => {
|
||||
http.get(`/api/application/nests/${nestId}/eggs`)
|
||||
.then(({ data }) => resolve((data.data || []).map(rawDataToEgg)))
|
||||
.catch(reject);
|
||||
export interface Filters {
|
||||
id?: string;
|
||||
name?: string;
|
||||
}
|
||||
|
||||
interface ctx {
|
||||
page: number;
|
||||
setPage: (value: number | ((s: number) => number)) => void;
|
||||
|
||||
filters: Filters | null;
|
||||
setFilters: (filters: Filters | null) => void;
|
||||
|
||||
sort: string | null;
|
||||
setSort: (sort: string | null) => void;
|
||||
|
||||
sortDirection: boolean;
|
||||
setSortDirection: (direction: boolean) => void;
|
||||
}
|
||||
|
||||
export const Context = createContext<ctx>({
|
||||
page: 1,
|
||||
setPage: () => 1,
|
||||
|
||||
filters: null,
|
||||
setFilters: () => null,
|
||||
|
||||
sort: null,
|
||||
setSort: () => null,
|
||||
|
||||
sortDirection: false,
|
||||
setSortDirection: () => false,
|
||||
});
|
||||
|
||||
export default (nestId: number, include: string[] = []) => {
|
||||
const { page, filters, sort, sortDirection } = useContext(Context);
|
||||
|
||||
const params = {};
|
||||
if (filters !== null) {
|
||||
Object.keys(filters).forEach(key => {
|
||||
// @ts-ignore
|
||||
params['filter[' + key + ']'] = filters[key];
|
||||
});
|
||||
}
|
||||
|
||||
if (sort !== null) {
|
||||
// @ts-ignore
|
||||
params.sort = (sortDirection ? '-' : '') + sort;
|
||||
}
|
||||
|
||||
return useSWR<PaginatedResult<Egg>>([ nestId, 'eggs', page, filters, sort, sortDirection ], async () => {
|
||||
const { data } = await http.get(`/api/application/nests/${nestId}/eggs`, { params: { include: include.join(','), page, ...params } });
|
||||
|
||||
return ({
|
||||
items: (data.data || []).map(rawDataToEgg),
|
||||
pagination: getPaginationSet(data.meta.pagination),
|
||||
});
|
||||
});
|
||||
};
|
||||
|
|
|
@ -31,24 +31,57 @@ export const rawDataToNest = ({ attributes }: FractalResponseData): Nest => ({
|
|||
},
|
||||
});
|
||||
|
||||
export interface Filters {
|
||||
id?: string;
|
||||
name?: string;
|
||||
}
|
||||
|
||||
interface ctx {
|
||||
page: number;
|
||||
setPage: (value: number | ((s: number) => number)) => void;
|
||||
|
||||
filters: Filters | null;
|
||||
setFilters: (filters: Filters | null) => void;
|
||||
|
||||
sort: string | null;
|
||||
setSort: (sort: string | null) => void;
|
||||
|
||||
sortDirection: boolean;
|
||||
setSortDirection: (direction: boolean) => void;
|
||||
}
|
||||
|
||||
export const Context = createContext<ctx>({ page: 1, setPage: () => 1 });
|
||||
export const Context = createContext<ctx>({
|
||||
page: 1,
|
||||
setPage: () => 1,
|
||||
|
||||
filters: null,
|
||||
setFilters: () => null,
|
||||
|
||||
sort: null,
|
||||
setSort: () => null,
|
||||
|
||||
sortDirection: false,
|
||||
setSortDirection: () => false,
|
||||
});
|
||||
|
||||
export default (include: string[] = []) => {
|
||||
const { page } = useContext(Context);
|
||||
const { page, filters, sort, sortDirection } = useContext(Context);
|
||||
|
||||
return useSWR<PaginatedResult<Nest>>([ 'nests', page ], async () => {
|
||||
const { data } = await http.get('/api/application/nests', {
|
||||
params: {
|
||||
include: include.join(','),
|
||||
per_page: 10,
|
||||
page,
|
||||
},
|
||||
const params = {};
|
||||
if (filters !== null) {
|
||||
Object.keys(filters).forEach(key => {
|
||||
// @ts-ignore
|
||||
params['filter[' + key + ']'] = filters[key];
|
||||
});
|
||||
}
|
||||
|
||||
if (sort !== null) {
|
||||
// @ts-ignore
|
||||
params.sort = (sortDirection ? '-' : '') + sort;
|
||||
}
|
||||
|
||||
return useSWR<PaginatedResult<Nest>>([ 'nests', page, filters, sort, sortDirection ], async () => {
|
||||
const { data } = await http.get('/api/application/nests', { params: { include: include.join(','), page, ...params } });
|
||||
|
||||
return ({
|
||||
items: (data.data || []).map(rawDataToNest),
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue