npm package: @pengyanqi/shared-components
Description: 一个基于 React 和 Ant Design 的权限管理组件库，提供用户、角色、菜单和组织管理等功能。
Latest version: 1.0.2

# @pengyanqi/shared-components

一个基于 React 和 Ant Design 的权限管理组件库，提供用户、角色、菜单和组织管理等功能。

## 安装

```bash
npm install @pengyanqi/shared-components
# 或
yarn add @pengyanqi/shared-components
# 或
pnpm add @pengyanqi/shared-components
```

## 使用

```tsx
import { UserManagement, RoleManagement, MenuManagement, OrganizationManagement } from '@pengyanqi/shared-components';

// 在你的组件中使用
function App() {
  return (
    <div>
      <UserManagement 
        data={{
          data: [],
          loading: false,
          pagination: {
            current: 1,
            pageSize: 10,
            total: 0
          }
        }}
        onAdd={async (values) => {
          // 处理添加用户
        }}
        onEdit={async (id, values) => {
          // 处理编辑用户
        }}
        onDelete={async (id) => {
          // 处理删除用户
        }}
        onSearch={(params) => {
          // 处理搜索
        }}
      />
    </div>
  );
}
```

## 组件

### UserManagement

用户管理组件，提供用户的增删改查功能。

#### Props

| 属性名 | 类型 | 必填 | 说明 |
|--------|------|------|------|
| data | ListData<User> | 是 | 用户列表数据 |
| onAdd | (values: User) => Promise<void> | 是 | 添加用户回调 |
| onEdit | (id: string, values: User) => Promise<void> | 是 | 编辑用户回调 |
| onDelete | (id: string) => Promise<void> | 是 | 删除用户回调 |
| onSearch | (params: any) => void | 否 | 搜索回调 |

### RoleManagement

角色管理组件，提供角色的增删改查和权限配置功能。

#### Props

| 属性名 | 类型 | 必填 | 说明 |
|--------|------|------|------|
| data | ListData<Role> | 是 | 角色列表数据 |
| onAdd | (values: Role) => Promise<void> | 是 | 添加角色回调 |
| onEdit | (id: string, values: Role) => Promise<void> | 是 | 编辑角色回调 |
| onDelete | (id: string) => Promise<void> | 是 | 删除角色回调 |
| onSearch | (params: any) => void | 否 | 搜索回调 |

### MenuManagement

菜单管理组件，提供菜单的增删改查和权限配置功能。

#### Props

| 属性名 | 类型 | 必填 | 说明 |
|--------|------|------|------|
| data | ListData<Menu> | 是 | 菜单列表数据 |
| onAdd | (values: Menu) => Promise<void> | 是 | 添加菜单回调 |
| onEdit | (id: string, values: Menu) => Promise<void> | 是 | 编辑菜单回调 |
| onDelete | (id: string) => Promise<void> | 是 | 删除菜单回调 |
| onSearch | (params: any) => void | 否 | 搜索回调 |

### OrganizationManagement

组织管理组件，提供组织的增删改查功能。

#### Props

| 属性名 | 类型 | 必填 | 说明 |
|--------|------|------|------|
| data | ListData<Organization> | 是 | 组织列表数据 |
| onAdd | (values: Organization) => Promise<void> | 是 | 添加组织回调 |
| onEdit | (id: string, values: Organization) => Promise<void> | 是 | 编辑组织回调 |
| onDelete | (id: string) => Promise<void> | 是 | 删除组织回调 |
| onSearch | (params: any) => void | 否 | 搜索回调 |

## 类型定义

### User

```typescript
interface User {
  id: string;
  username: string;
  name: string;
  email: string;
  phone: string;
  status: 'active' | 'inactive';
  roles: string[];
  createdAt: string;
  updatedAt: string;
}
```

### Role

```typescript
interface Role {
  id: string;
  name: string;
  code: string;
  description: string;
  permissions: string[];
  createdAt: string;
  updatedAt: string;
}
```

### Menu

```typescript
interface Menu {
  id: string;
  name: string;
  path: string;
  icon: string;
  parentId: string | null;
  sort: number;
  permissions: string[];
  buttons: {
    name: string;
    code: string;
    icon: string;
    sort: number;
  }[];
  apis: {
    name: string;
    code: string;
    method: string;
    path: string;
  }[];
  createdAt: string;
  updatedAt: string;
}
```

### Organization

```typescript
interface Organization {
  id: string;
  name: string;
  code: string;
  type: 'company' | 'department' | 'team';
  parentId: string | null;
  leader: string;
  description: string;
  createdAt: string;
  updatedAt: string;
}
```

## 开发

```bash
# 安装依赖
pnpm install

# 开发模式
pnpm dev

# 构建
pnpm build

# 发布
pnpm publish
```

## 许可证

MIT