| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
| |
|
|
|
|
| import { useState, useEffect } from 'react';
|
| import { useTranslation } from 'react-i18next';
|
| import { API, showError, showSuccess } from '../../helpers';
|
| import { ITEMS_PER_PAGE } from '../../constants';
|
| import { useTableCompactMode } from '../common/useTableCompactMode';
|
|
|
| export const useUsersData = () => {
|
| const { t } = useTranslation();
|
| const [compactMode, setCompactMode] = useTableCompactMode('users');
|
|
|
|
|
| const [users, setUsers] = useState([]);
|
| const [loading, setLoading] = useState(true);
|
| const [activePage, setActivePage] = useState(1);
|
| const [pageSize, setPageSize] = useState(ITEMS_PER_PAGE);
|
| const [searching, setSearching] = useState(false);
|
| const [groupOptions, setGroupOptions] = useState([]);
|
| const [userCount, setUserCount] = useState(0);
|
|
|
|
|
| const [showAddUser, setShowAddUser] = useState(false);
|
| const [showEditUser, setShowEditUser] = useState(false);
|
| const [editingUser, setEditingUser] = useState({
|
| id: undefined,
|
| });
|
|
|
|
|
| const formInitValues = {
|
| searchKeyword: '',
|
| searchGroup: '',
|
| };
|
|
|
|
|
| const [formApi, setFormApi] = useState(null);
|
|
|
|
|
| const getFormValues = () => {
|
| const formValues = formApi ? formApi.getValues() : {};
|
| return {
|
| searchKeyword: formValues.searchKeyword || '',
|
| searchGroup: formValues.searchGroup || '',
|
| };
|
| };
|
|
|
|
|
| const setUserFormat = (users) => {
|
| for (let i = 0; i < users.length; i++) {
|
| users[i].key = users[i].id;
|
| }
|
| setUsers(users);
|
| };
|
|
|
|
|
| const loadUsers = async (startIdx, pageSize) => {
|
| setLoading(true);
|
| const res = await API.get(`/api/user/?p=${startIdx}&page_size=${pageSize}`);
|
| const { success, message, data } = res.data;
|
| if (success) {
|
| const newPageData = data.items;
|
| setActivePage(data.page);
|
| setUserCount(data.total);
|
| setUserFormat(newPageData);
|
| } else {
|
| showError(message);
|
| }
|
| setLoading(false);
|
| };
|
|
|
|
|
| const searchUsers = async (
|
| startIdx,
|
| pageSize,
|
| searchKeyword = null,
|
| searchGroup = null,
|
| ) => {
|
|
|
| if (searchKeyword === null || searchGroup === null) {
|
| const formValues = getFormValues();
|
| searchKeyword = formValues.searchKeyword;
|
| searchGroup = formValues.searchGroup;
|
| }
|
|
|
| if (searchKeyword === '' && searchGroup === '') {
|
|
|
| await loadUsers(startIdx, pageSize);
|
| return;
|
| }
|
| setSearching(true);
|
| const res = await API.get(
|
| `/api/user/search?keyword=${searchKeyword}&group=${searchGroup}&p=${startIdx}&page_size=${pageSize}`,
|
| );
|
| const { success, message, data } = res.data;
|
| if (success) {
|
| const newPageData = data.items;
|
| setActivePage(data.page);
|
| setUserCount(data.total);
|
| setUserFormat(newPageData);
|
| } else {
|
| showError(message);
|
| }
|
| setSearching(false);
|
| };
|
|
|
|
|
| const manageUser = async (userId, action, record) => {
|
|
|
| setLoading(true);
|
|
|
| const res = await API.post('/api/user/manage', {
|
| id: userId,
|
| action,
|
| });
|
|
|
| const { success, message } = res.data;
|
| if (success) {
|
| showSuccess('操作成功完成!');
|
| const user = res.data.data;
|
|
|
|
|
| const newUsers = users.map((u) => {
|
| if (u.id === userId) {
|
| if (action === 'delete') {
|
| return { ...u, DeletedAt: new Date() };
|
| }
|
| return { ...u, status: user.status, role: user.role };
|
| }
|
| return u;
|
| });
|
|
|
| setUsers(newUsers);
|
| } else {
|
| showError(message);
|
| }
|
|
|
| setLoading(false);
|
| };
|
|
|
| const resetUserPasskey = async (user) => {
|
| if (!user) {
|
| return;
|
| }
|
| try {
|
| const res = await API.delete(`/api/user/${user.id}/reset_passkey`);
|
| const { success, message } = res.data;
|
| if (success) {
|
| showSuccess(t('Passkey 已重置'));
|
| } else {
|
| showError(message || t('操作失败,请重试'));
|
| }
|
| } catch (error) {
|
| showError(t('操作失败,请重试'));
|
| }
|
| };
|
|
|
| const resetUserTwoFA = async (user) => {
|
| if (!user) {
|
| return;
|
| }
|
| try {
|
| const res = await API.delete(`/api/user/${user.id}/2fa`);
|
| const { success, message } = res.data;
|
| if (success) {
|
| showSuccess(t('二步验证已重置'));
|
| } else {
|
| showError(message || t('操作失败,请重试'));
|
| }
|
| } catch (error) {
|
| showError(t('操作失败,请重试'));
|
| }
|
| };
|
|
|
|
|
| const handlePageChange = (page) => {
|
| setActivePage(page);
|
| const { searchKeyword, searchGroup } = getFormValues();
|
| if (searchKeyword === '' && searchGroup === '') {
|
| loadUsers(page, pageSize).then();
|
| } else {
|
| searchUsers(page, pageSize, searchKeyword, searchGroup).then();
|
| }
|
| };
|
|
|
|
|
| const handlePageSizeChange = async (size) => {
|
| localStorage.setItem('page-size', size + '');
|
| setPageSize(size);
|
| setActivePage(1);
|
| loadUsers(activePage, size)
|
| .then()
|
| .catch((reason) => {
|
| showError(reason);
|
| });
|
| };
|
|
|
|
|
| const handleRow = (record, index) => {
|
| if (record.DeletedAt !== null || record.status !== 1) {
|
| return {
|
| style: {
|
| background: 'var(--semi-color-disabled-border)',
|
| },
|
| };
|
| } else {
|
| return {};
|
| }
|
| };
|
|
|
|
|
| const refresh = async (page = activePage) => {
|
| const { searchKeyword, searchGroup } = getFormValues();
|
| if (searchKeyword === '' && searchGroup === '') {
|
| await loadUsers(page, pageSize);
|
| } else {
|
| await searchUsers(page, pageSize, searchKeyword, searchGroup);
|
| }
|
| };
|
|
|
|
|
| const fetchGroups = async () => {
|
| try {
|
| let res = await API.get(`/api/group/`);
|
| if (res === undefined) {
|
| return;
|
| }
|
| setGroupOptions(
|
| res.data.data.map((group) => ({
|
| label: group,
|
| value: group,
|
| })),
|
| );
|
| } catch (error) {
|
| showError(error.message);
|
| }
|
| };
|
|
|
|
|
| const closeAddUser = () => {
|
| setShowAddUser(false);
|
| };
|
|
|
| const closeEditUser = () => {
|
| setShowEditUser(false);
|
| setEditingUser({
|
| id: undefined,
|
| });
|
| };
|
|
|
|
|
| useEffect(() => {
|
| loadUsers(0, pageSize)
|
| .then()
|
| .catch((reason) => {
|
| showError(reason);
|
| });
|
| fetchGroups().then();
|
| }, []);
|
|
|
| return {
|
|
|
| users,
|
| loading,
|
| activePage,
|
| pageSize,
|
| userCount,
|
| searching,
|
| groupOptions,
|
|
|
|
|
| showAddUser,
|
| showEditUser,
|
| editingUser,
|
| setShowAddUser,
|
| setShowEditUser,
|
| setEditingUser,
|
|
|
|
|
| formInitValues,
|
| formApi,
|
| setFormApi,
|
|
|
|
|
| compactMode,
|
| setCompactMode,
|
|
|
|
|
| loadUsers,
|
| searchUsers,
|
| manageUser,
|
| resetUserPasskey,
|
| resetUserTwoFA,
|
| handlePageChange,
|
| handlePageSizeChange,
|
| handleRow,
|
| refresh,
|
| closeAddUser,
|
| closeEditUser,
|
| getFormValues,
|
|
|
|
|
| t,
|
| };
|
| };
|
|
|