fix table and list toolbar on Manage Menu
- add button search for not debounce searching - set if condition parent to `id_parent` === null
This commit is contained in:
@ -1,10 +1,22 @@
|
|||||||
import { DefaultTooltip, KeenIcon, useDataGrid } from '@/components';
|
import { DefaultTooltip, KeenIcon, useDataGrid } from '@/components';
|
||||||
import { useManageMenusContext } from '../hooks/useManageMenusContext';
|
import { useManageMenusContext } from '../hooks/useManageMenusContext';
|
||||||
import { Button } from '@/components/ui/button';
|
import { Button } from '@/components/ui/button';
|
||||||
|
import React, { useState } from 'react';
|
||||||
|
|
||||||
const ListToolbar = () => {
|
const ListToolbar = () => {
|
||||||
const { table, reload } = useDataGrid();
|
const { table, reload } = useDataGrid();
|
||||||
const { handleAddDialog } = useManageMenusContext();
|
const { handleAddDialog } = useManageMenusContext();
|
||||||
|
const [searchValue, setSearchValue] = useState('');
|
||||||
|
|
||||||
|
const handleKeyDown = (event: React.KeyboardEvent) => {
|
||||||
|
if (event.key === 'Enter') {
|
||||||
|
handleSearch();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleSearch = () => {
|
||||||
|
table.getColumn('name')?.setFilterValue(searchValue);
|
||||||
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="card-header flex-wrap gap-2 border-b-0 px-5">
|
<div className="card-header flex-wrap gap-2 border-b-0 px-5">
|
||||||
@ -16,10 +28,16 @@ const ListToolbar = () => {
|
|||||||
<input
|
<input
|
||||||
type="text"
|
type="text"
|
||||||
placeholder="Search Menu"
|
placeholder="Search Menu"
|
||||||
value={(table.getColumn('name')?.getFilterValue() as string) ?? ''}
|
value={searchValue}
|
||||||
onChange={(event) => table.getColumn('name')?.setFilterValue(event.target.value)}
|
onChange={(event) => setSearchValue(event.target.value)}
|
||||||
|
onKeyDown={handleKeyDown}
|
||||||
/>
|
/>
|
||||||
</label>
|
</label>
|
||||||
|
<DefaultTooltip title={'Search'} placement={'top'}>
|
||||||
|
<Button variant="outline" className="h-7.5" onClick={handleSearch}>
|
||||||
|
<KeenIcon icon="magnifier" />
|
||||||
|
</Button>
|
||||||
|
</DefaultTooltip>
|
||||||
{/* <DefaultTooltip title={'Filter'} placement={'top'}>
|
{/* <DefaultTooltip title={'Filter'} placement={'top'}>
|
||||||
<Button
|
<Button
|
||||||
variant="outline"
|
variant="outline"
|
||||||
|
|||||||
@ -191,7 +191,7 @@ const ManageMenusContextProvider = ({ children }: { children: React.ReactNode })
|
|||||||
const flattenChildren = (parent: any, parentIdx: number, depth = 0, parentName = '') => {
|
const flattenChildren = (parent: any, parentIdx: number, depth = 0, parentName = '') => {
|
||||||
let result: any[] = [];
|
let result: any[] = [];
|
||||||
|
|
||||||
if (parent.link === '/') {
|
if (parent.id_parent === null) {
|
||||||
if (!parents.find((el: any) => el.id === parent.id))
|
if (!parents.find((el: any) => el.id === parent.id))
|
||||||
setParents((el: any) => [...el, { id: parent.id, name: parent.name }]);
|
setParents((el: any) => [...el, { id: parent.id, name: parent.name }]);
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user