diff --git a/src/pages/AdminPanel/UserController/index.jsx b/src/pages/AdminPanel/UserController/index.jsx
index dc5f87e..8fc4ccc 100644
--- a/src/pages/AdminPanel/UserController/index.jsx
+++ b/src/pages/AdminPanel/UserController/index.jsx
@@ -1,6 +1,7 @@
-import { Button, Tag } from 'antd'
+import { Button, Input, Tag } from 'antd'
import { UserSwitchOutlined } from '@ant-design/icons'
-import { memo, useEffect, useState } from 'react'
+import { memo, useCallback, useEffect, useState } from 'react'
+import { BehaviorSubject, debounceTime, distinctUntilChanged, filter, map } from 'rxjs'
import {
EditableTable,
@@ -23,23 +24,65 @@ import { arrayOrDefault } from '@utils'
import RoleTag from './RoleTag'
+const SEARCH_TIMEOUT = 400
export const UserController = memo(() => {
const [users, setUsers] = useState([])
+ const [filteredUsers, setFilteredUsers] = useState([])
+ const [searchValue, setSearchValue] = useState('')
const [showLoader, setShowLoader] = useState(false)
+ const [isSearching, setIsSearching] = useState(false)
const [columns, setColumns] = useState([])
const [selectedUser, setSelectedUser] = useState(null)
+ const [subject, setSubject] = useState(null)
- const additionalButtons = (record, editingKey) => (
+ useEffect(() => invokeWebApiWrapperAsync(
+ async () => {
+ const filteredUsers = users.filter((user) => user && [
+ user.login ?? '',
+ user.name ?? '',
+ user.surname ?? '',
+ user.partonymic ?? '',
+ user.email ?? '',
+ user.phone ?? '',
+ user.position ?? '',
+ user.company?.caption ?? '',
+ ].join(' ').toLowerCase().includes(searchValue))
+ setFilteredUsers(filteredUsers)
+ },
+ setIsSearching,
+ `Не удалось произвести поиск пользователей`
+ ), [users, searchValue])
+
+ useEffect(() => {
+ if (!subject) {
+ const sub = new BehaviorSubject('')
+ setSubject(sub)
+ } else {
+ const observable = subject.pipe(
+ debounceTime(SEARCH_TIMEOUT),
+ map(s => s.trim().toLowerCase() ?? ''),
+ distinctUntilChanged(),
+ filter(s => s.length <= 0 || s.length >= 2),
+ ).subscribe(value => setSearchValue(value))
+
+ return () => {
+ observable.unsubscribe()
+ subject.unsubscribe()
+ }
+ }
+ }, [subject])
+
+ const additionalButtons = useCallback((record, editingKey) => (
}
onClick={() => setSelectedUser(record)}
title={'Сменить пароль'}
disabled={editingKey !== ''}
/>
- )
+ ), [])
- const updateTable = () => invokeWebApiWrapperAsync(
+ const updateTable = useCallback(() => invokeWebApiWrapperAsync(
async() => {
const users = await AdminUserService.getAll()
setUsers(arrayOrDefault(users))
@@ -47,7 +90,7 @@ export const UserController = memo(() => {
setShowLoader,
`Не удалось загрузить список пользователей`,
'Получение списка пользователей'
- )
+ ), [])
useEffect(() => invokeWebApiWrapperAsync(
async () => {
@@ -150,14 +193,23 @@ export const UserController = memo(() => {
onComplete: updateTable,
}
+ const onSearchTextChange = useCallback((e) => subject?.next(e?.target?.value), [subject])
+
return (
<>
+