TIMOR-TELECOM/revenue-fe
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add search button for searching

Browse Source
This commit is contained in:
Wikzyy
2025-04-16 13:34:40 +07:00
parent d281ff0a9f
commit 95af177099
5 changed files with 61 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
src/pages/master/aldeias/blocks/ListToolbar.tsx
View File

@ -1,10 +1,22 @@
import { DefaultTooltip, KeenIcon, useDataGrid } from '@/components';
import { Button } from '@/components/ui/button';
import { useManageAldeiasContext } from '../hooks/useManageAldeiasContext';
import React, { useState } from 'react';
const ListToolbar = () => {
const { table, reload } = useDataGrid();
const { handleAddDialog, handleSearchDialog } = useManageAldeiasContext();
const [searchValue, setSearchValue] = useState('');
const handleKeyDown = (event: React.KeyboardEvent) => {
if (event.key === 'Enter') {
handleSearch();
}
};
const handleSearch = () => {
table.getColumn('name')?.setFilterValue(searchValue);
};
return (
<div className="card-header flex-wrap gap-2 border-b-0 px-5">
@ -16,10 +28,16 @@ const ListToolbar = () => {
<input
type="text"
placeholder="Search Aldeia"
value={(table.getColumn('name')?.getFilterValue() as string) ?? ''}
onChange={(event) => table.getColumn('name')?.setFilterValue(event.target.value)}
value={searchValue}
onChange={(event) => setSearchValue(event.target.value)}
onKeyDown={handleKeyDown}
/>
</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'}>
<Button
variant="outline"

21
src/pages/master/municipios/blocks/ListToolbar.tsx
View File

@ -9,6 +9,7 @@ const ListToolbar = () => {
const { handleAddDialog, handleSearchDialog } = useManageMunicipiosContext();
const [searchName, setSearchName] = useState('');
const [isLoading, setIsLoading] = useState(false);
const [searchValue, setSearchValue] = useState('');
const handleFilterData = useCallback(() => {
try {
@ -19,6 +20,16 @@ const ListToolbar = () => {
}
}, [searchName, table]);
const handleKeyDown = (event: React.KeyboardEvent) => {
if (event.key === 'Enter') {
handleSearch();
}
};
const handleSearch = () => {
table.getColumn('name')?.setFilterValue(searchValue);
};
return (
<div className="card-header flex-wrap gap-2 border-b-0 px-5">
<div className="flex flex-wrap gap-2 lg:gap-5 w-full">
@ -29,10 +40,16 @@ const ListToolbar = () => {
<input
type="text"
placeholder="Search Municipio"
value={(table.getColumn('name')?.getFilterValue() as string) ?? ''}
onChange={(event) => table.getColumn('name')?.setFilterValue(event.target.value)}
value={searchValue}
onChange={(event) => setSearchValue(event.target.value)}
onKeyDown={handleKeyDown}
/>
</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'}>
<Button
variant="outline"

1
src/pages/master/postoadms/blocks/ListToolbar.tsx
View File

@ -8,7 +8,6 @@ const ListToolbar = () => {
const { table, reload } = useDataGrid();
const { handleAddDialog, handleSearchDialog } = useManagePostoAdmsContext();
const [searchPosto, setSearchPosto] = useState('');
const [searchMunicipio, setSearchMunicipio] = useState('');
const handleKeyDown = (event: React.KeyboardEvent) => {
if (event.key === 'Enter') {

24
src/pages/master/sucos/blocks/ListToolbar.tsx
View File

@ -1,10 +1,22 @@
import { DefaultTooltip, KeenIcon, useDataGrid } from '@/components';
import { Button } from '@/components/ui/button';
import { useManageSucosContext } from '../hooks/useManageSucosContext';
import React, { useState } from 'react';
const ListToolbar = () => {
const { table, reload } = useDataGrid();
const { handleAddDialog, handleSearchDialog } = useManageSucosContext();
const [searchValue, setSearchValue] = useState('');
const handleKeyDown = (event: React.KeyboardEvent) => {
if (event.key === 'Enter') {
handleSearch();
}
};
const handleSearch = () => {
table.getColumn('sucos_name')?.setFilterValue(searchValue);
};
return (
<div className="card-header flex-wrap gap-2 border-b-0 px-5">
@ -16,12 +28,16 @@ const ListToolbar = () => {
<input
type="text"
placeholder="Search Sucos"
value={String(table.getColumn(`sucos_name`)?.getFilterValue() ?? '')}
onChange={(event) =>
table.getColumn('sucos_name')?.setFilterValue(event.target.value)
}
value={searchValue}
onChange={(event) => setSearchValue(event.target.value)}
onKeyDown={handleKeyDown}
/>
</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'}>
<Button
variant="outline"

4
src/pages/master/sucos/hooks/ManageSucosContext.tsx
View File

@ -86,7 +86,7 @@ const ManageSucosContextProvider = ({ children }: { children: React.ReactNode })
const columns = useMemo<ColumnDef<any>[]>(
() => [
{
accessorFn: (row) => row.sucos_name,
accessorFn: (row) => row.name,
id: 'sucos_name',
filterFn: (row, columnId, filterValue) => {
const value = row.getValue<string>(columnId);
@ -100,7 +100,7 @@ const ManageSucosContextProvider = ({ children }: { children: React.ReactNode })
}
},
{
accessorKey: 'posto_name',
accessorKey: 'posto.name',
id: 'posto_name',
filterFn: (row, columnId, filterValue) => {
const value = row.getValue<string>(columnId);