ai-coding/deploy-ease-platform
0
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

可用版本

Browse Source
This commit is contained in:
戚辰先生 2024-11-30 18:13:37 +08:00
parent 5cc0deb917
commit 445766b458
1 changed files with 356 additions and 356 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

86
frontend/src/pages/System/User/index.tsx
View File

@ -1,11 +1,11 @@
import React, { useEffect, useState } from 'react'; import React, {useEffect, useState} from 'react';
import { Table, Button, Modal, Form, Input, Space, message, Switch, TreeSelect } from 'antd'; import {Table, Button, Modal, Form, Input, Space, message, Switch, TreeSelect} from 'antd';
import { PlusOutlined, EditOutlined, DeleteOutlined, KeyOutlined, TeamOutlined } from '@ant-design/icons'; import {PlusOutlined, EditOutlined, DeleteOutlined, KeyOutlined, TeamOutlined} from '@ant-design/icons';
import type { UserResponse, Role } from './types'; import type {UserResponse, Role} from './types';
import type { DepartmentDTO } from '../Department/types'; import type {DepartmentDTO} from '../Department/types';
import { getUsers, createUser, updateUser, deleteUser, resetPassword } from './service'; import {getUsers, createUser, updateUser, deleteUser, resetPassword} from './service';
import { useTableData } from '@/hooks/useTableData'; import {useTableData} from '@/hooks/useTableData';
import type { FixedType, AlignType } from 'rc-table/lib/interface'; import type {FixedType, AlignType} from 'rc-table/lib/interface';
const UserPage: React.FC = () => { const UserPage: React.FC = () => {
const { const {
@ -117,26 +117,26 @@ const UserPage: React.FC = () => {
title: 'ID', title: 'ID',
dataIndex: 'id', dataIndex: 'id',
key: 'id', key: 'id',
width: 80, width: 60,
fixed: 'left' as FixedType fixed: 'left' as FixedType
}, },
{ {
title: '用户名', title: '用户名',
dataIndex: 'username', dataIndex: 'username',
key: 'username', key: 'username',
width: 120, width: 100,
}, },
{ {
title: '昵称', title: '昵称',
dataIndex: 'nickname', dataIndex: 'nickname',
key: 'nickname', key: 'nickname',
width: 120, width: 100,
}, },
{ {
title: '邮箱', title: '邮箱',
dataIndex: 'email', dataIndex: 'email',
key: 'email', key: 'email',
width: 200, width: 180,
ellipsis: true, ellipsis: true,
}, },
{ {
@ -149,7 +149,7 @@ const UserPage: React.FC = () => {
title: '角色', title: '角色',
dataIndex: 'roles', dataIndex: 'roles',
key: 'roles', key: 'roles',
width: 150, width: 120,
ellipsis: true, ellipsis: true,
render: (roles: Role[]) => roles?.map(role => role.name).join(', ') || '-' render: (roles: Role[]) => roles?.map(role => role.name).join(', ') || '-'
}, },
@ -157,35 +157,35 @@ const UserPage: React.FC = () => {
title: '创建时间', title: '创建时间',
dataIndex: 'createTime', dataIndex: 'createTime',
key: 'createTime', key: 'createTime',
width: 180, width: 150,
}, },
{ {
title: '更新时间', title: '更新时间',
dataIndex: 'updateTime', dataIndex: 'updateTime',
key: 'updateTime', key: 'updateTime',
width: 180, width: 150,
}, },
{ {
title: '状态', title: '状态',
dataIndex: 'enabled', dataIndex: 'enabled',
key: 'enabled', key: 'enabled',
width: 80, width: 60,
align: 'center' as AlignType, align: 'center' as AlignType,
render: (enabled: boolean) => ( render: (enabled: boolean) => (
<Switch checked={enabled} disabled size="small" /> <Switch checked={enabled} disabled size="small"/>
), ),
}, },
{ {
title: '操作', title: '操作',
key: 'action', key: 'action',
width: 180, width: 240,
fixed: 'right' as FixedType, fixed: 'right' as FixedType,
render: (_: any, record: UserResponse) => ( render: (_: any, record: UserResponse) => (
<Space size="small"> <Space size={0}>
<Button <Button
type="link" type="link"
size="small" size="small"
icon={<EditOutlined />} icon={<EditOutlined/>}
onClick={() => handleEdit(record)} onClick={() => handleEdit(record)}
> >
编辑 编辑
@ -193,7 +193,7 @@ const UserPage: React.FC = () => {
<Button <Button
type="link" type="link"
size="small" size="small"
icon={<KeyOutlined />} icon={<KeyOutlined/>}
onClick={() => handleResetPassword(record)} onClick={() => handleResetPassword(record)}
> >
重置密码 重置密码
@ -202,7 +202,7 @@ const UserPage: React.FC = () => {
type="link" type="link"
size="small" size="small"
danger danger
icon={<DeleteOutlined />} icon={<DeleteOutlined/>}
onClick={() => handleDelete(record.id)} onClick={() => handleDelete(record.id)}
disabled={record.username === 'admin'} disabled={record.username === 'admin'}
> >
@ -214,9 +214,9 @@ const UserPage: React.FC = () => {
]; ];
return ( return (
<div style={{ padding: '24px' }}> <div style={{padding: '24px'}}>
<div style={{ marginBottom: 16 }}> <div style={{marginBottom: 16}}>
<Button type="primary" icon={<PlusOutlined />} onClick={handleAdd}> <Button type="primary" icon={<PlusOutlined/>} onClick={handleAdd}>
新增用户 新增用户
</Button> </Button>
</div> </div>
@ -226,7 +226,7 @@ const UserPage: React.FC = () => {
columns={columns} columns={columns}
dataSource={users} dataSource={users}
rowKey="id" rowKey="id"
scroll={{ x: 1500 }} scroll={{x: 1500}}
pagination={{ pagination={{
...pagination, ...pagination,
showSizeChanger: true, showSizeChanger: true,
@ -265,9 +265,9 @@ const UserPage: React.FC = () => {
<Form.Item <Form.Item
name="username" name="username"
label="用户名" label="用户名"
rules={[{ required: true, message: '请输入用户名' }]} rules={[{required: true, message: '请输入用户名'}]}
> >
<Input placeholder="请输入用户名" disabled={!!editingUser} /> <Input placeholder="请输入用户名" disabled={!!editingUser}/>
</Form.Item> </Form.Item>
{!editingUser && ( {!editingUser && (
@ -275,11 +275,11 @@ const UserPage: React.FC = () => {
name="password" name="password"
label="密码" label="密码"
rules={[ rules={[
{ required: true, message: '请输入密码' }, {required: true, message: '请输入密码'},
{ min: 6, message: '密码长度不能小于6位' } {min: 6, message: '密码长度不能小于6位'}
]} ]}
> >
<Input.Password placeholder="请输入密码" /> <Input.Password placeholder="请输入密码"/>
</Form.Item> </Form.Item>
)} )}
@ -287,20 +287,20 @@ const UserPage: React.FC = () => {
name="nickname" name="nickname"
label="昵称" label="昵称"
> >
<Input placeholder="请输入昵称" /> <Input placeholder="请输入昵称"/>
</Form.Item> </Form.Item>
<Form.Item <Form.Item
name="email" name="email"
label="邮箱" label="邮箱"
rules={[{ type: 'email', message: '请输入正确的邮箱格式' }]} rules={[{type: 'email', message: '请输入正确的邮箱格式'}]}
> >
<Input placeholder="请输入邮箱" /> <Input placeholder="请输入邮箱"/>
</Form.Item> </Form.Item>
<Form.Item <Form.Item
name="phone" name="phone"
label="手机号" label="手机号"
> >
<Input placeholder="请输入手机号" /> <Input placeholder="请输入手机号"/>
</Form.Item> </Form.Item>
<Form.Item <Form.Item
name="deptId" name="deptId"
@ -311,7 +311,7 @@ const UserPage: React.FC = () => {
placeholder="请选择所属部门" placeholder="请选择所属部门"
allowClear allowClear
treeDefaultExpandAll treeDefaultExpandAll
style={{ width: '100%' }} style={{width: '100%'}}
/> />
</Form.Item> </Form.Item>
<Form.Item <Form.Item
@ -320,7 +320,7 @@ const UserPage: React.FC = () => {
valuePropName="checked" valuePropName="checked"
initialValue={true} initialValue={true}
> >
<Switch /> <Switch/>
</Form.Item> </Form.Item>
</Form> </Form>
</Modal> </Modal>
@ -358,19 +358,19 @@ const UserPage: React.FC = () => {
name="password" name="password"
label="新密码" label="新密码"
rules={[ rules={[
{ required: true, message: '请输入新密码' }, {required: true, message: '请输入新密码'},
{ min: 6, message: '密码长度不能小于6位' } {min: 6, message: '密码长度不能小于6位'}
]} ]}
> >
<Input.Password placeholder="请输入新密码" /> <Input.Password placeholder="请输入新密码"/>
</Form.Item> </Form.Item>
<Form.Item <Form.Item
name="confirmPassword" name="confirmPassword"
label="确认密码" label="确认密码"
dependencies={['password']} dependencies={['password']}
rules={[ rules={[
{ required: true, message: '请确认新密码' }, {required: true, message: '请确认新密码'},
({ getFieldValue }) => ({ ({getFieldValue}) => ({
validator(_, value) { validator(_, value) {
if (!value || getFieldValue('password') === value) { if (!value || getFieldValue('password') === value) {
return Promise.resolve(); return Promise.resolve();
@ -380,7 +380,7 @@ const UserPage: React.FC = () => {
}), }),
]} ]}
> >
<Input.Password placeholder="请确认新密码" /> <Input.Password placeholder="请确认新密码"/>
</Form.Item> </Form.Item>
</Form> </Form>
</Modal> </Modal>