♻️ refactor(users): modularize UsersTable component into microcomponent architecture
BREAKING CHANGE: Removed standalone user edit routes (/console/user/edit, /console/user/edit/:id) - Decompose 673-line monolithic UsersTable.js into 8 specialized components - Extract column definitions to UsersColumnDefs.js with render functions - Create dedicated UsersActions.jsx for action buttons - Create UsersFilters.jsx for search and filtering logic - Create UsersDescription.jsx for description area - Extract all data management logic to useUsersData.js hook - Move AddUser.js and EditUser.js to users/modals/ folder as modal components - Create 4 new confirmation modal components (Promote, Demote, EnableDisable, Delete) - Implement pure UsersTable.jsx component for table rendering only - Create main container component users/index.jsx to compose all subcomponents - Update import paths in pages/User/index.js to use new modular structure - Remove obsolete EditUser imports and routes from App.js - Delete original monolithic files: UsersTable.js, AddUser.js, EditUser.js The new architecture follows the same modular pattern as tokens and redemptions modules: - Consistent file organization across all table modules - Better separation of concerns and maintainability - Enhanced reusability and testability - Unified modal management approach All existing functionality preserved with improved code organization.
This commit is contained in:
@@ -0,0 +1,39 @@
|
||||
import React from 'react';
|
||||
import { Modal } from '@douyinfe/semi-ui';
|
||||
|
||||
const DeleteUserModal = ({
|
||||
visible,
|
||||
onCancel,
|
||||
onConfirm,
|
||||
user,
|
||||
users,
|
||||
activePage,
|
||||
refresh,
|
||||
manageUser,
|
||||
t
|
||||
}) => {
|
||||
const handleConfirm = async () => {
|
||||
await manageUser(user.id, 'delete', user);
|
||||
await refresh();
|
||||
setTimeout(() => {
|
||||
if (users.length === 0 && activePage > 1) {
|
||||
refresh(activePage - 1);
|
||||
}
|
||||
}, 100);
|
||||
onCancel(); // Close modal after success
|
||||
};
|
||||
|
||||
return (
|
||||
<Modal
|
||||
title={t('确定是否要注销此用户?')}
|
||||
visible={visible}
|
||||
onCancel={onCancel}
|
||||
onOk={handleConfirm}
|
||||
type="danger"
|
||||
>
|
||||
{t('相当于删除用户,此修改将不可逆')}
|
||||
</Modal>
|
||||
);
|
||||
};
|
||||
|
||||
export default DeleteUserModal;
|
||||
Reference in New Issue
Block a user