From 9631081b658428819be0ce9afd71944925f58385 Mon Sep 17 00:00:00 2001 From: moonrailgun Date: Tue, 28 Jun 2022 17:51:41 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E6=9D=83=E9=99=90=E5=88=97=E8=A1=A8?= =?UTF-8?q?=E7=9A=84=E5=88=9B=E5=BB=BA=E4=B8=8E=E4=BF=9D=E5=AD=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- shared/index.tsx | 5 + shared/model/__all__.ts | 8 + shared/model/group.ts | 66 ++++++ .../modals/GroupDetail/Role/const.ts | 10 + .../modals/GroupDetail/Role/index.tsx | 207 +++++++++--------- .../GroupDetail/Role/useModifyPermission.ts | 10 +- .../modals/GroupDetail/Role/useRoleActions.ts | 34 +++ web/src/init.tsx | 1 - 8 files changed, 239 insertions(+), 102 deletions(-) create mode 100644 shared/model/__all__.ts create mode 100644 web/src/components/modals/GroupDetail/Role/const.ts create mode 100644 web/src/components/modals/GroupDetail/Role/useRoleActions.ts diff --git a/shared/index.tsx b/shared/index.tsx index f7dae6f7..d4aee9a5 100644 --- a/shared/index.tsx +++ b/shared/index.tsx @@ -90,6 +90,7 @@ export { } from './manager/ui'; // model +export * as model from './model/__all__'; export { fetchAvailableServices } from './model/common'; export { fetchGlobalConfig } from './model/config'; export { @@ -118,6 +119,10 @@ export { createGroupPanel, modifyGroupPanel, deleteGroupPanel, + createGroupRole, + deleteGroupRole, + updateGroupRoleName, + updateGroupRolePermission, } from './model/group'; export type { GroupPanel, diff --git a/shared/model/__all__.ts b/shared/model/__all__.ts new file mode 100644 index 00000000..915ec61a --- /dev/null +++ b/shared/model/__all__.ts @@ -0,0 +1,8 @@ +export * as common from './common'; +export * as config from './config'; +export * as converse from './converse'; +export * as friend from './friend'; +export * as group from './group'; +export * as message from './message'; +export * as plugin from './plugin'; +export * as user from './user'; diff --git a/shared/model/group.ts b/shared/model/group.ts index 807dfcdf..192c4f05 100644 --- a/shared/model/group.ts +++ b/shared/model/group.ts @@ -250,3 +250,69 @@ export async function deleteGroupPanel(groupId: string, panelId: string) { panelId, }); } + +/** + * 创建群组身份组 + * @param groupId 群组id + * @param roleName 群组名 + * @param permission 初始权限 + */ +export async function createGroupRole( + groupId: string, + roleName: string, + permission: string[] +) { + await request.post('/api/group/createGroupRole', { + groupId, + roleName, + permission, + }); +} + +/** + * 删除群组身份组 + * @param groupId 群组Id + * @param roleId 身份组Id + */ +export async function deleteGroupRole(groupId: string, roleId: string) { + await request.post('/api/group/deleteGroupRole', { + groupId, + roleId, + }); +} + +/** + * 删除群组身份组 + * @param groupId 群组Id + * @param roleId 身份组Id + * @param roleName 新身份组名 + */ +export async function updateGroupRoleName( + groupId: string, + roleId: string, + roleName: string +) { + await request.post('/api/group/updateGroupRoleName', { + groupId, + roleId, + roleName, + }); +} + +/** + * 删除群组身份组 + * @param groupId 群组Id + * @param roleId 身份组Id + * @param permissions 全量权限列表 + */ +export async function updateGroupRolePermission( + groupId: string, + roleId: string, + permissions: string[] +) { + await request.post('/api/group/updateGroupRolePermission', { + groupId, + roleId, + permissions, + }); +} diff --git a/web/src/components/modals/GroupDetail/Role/const.ts b/web/src/components/modals/GroupDetail/Role/const.ts new file mode 100644 index 00000000..8e41b2bf --- /dev/null +++ b/web/src/components/modals/GroupDetail/Role/const.ts @@ -0,0 +1,10 @@ +import { t } from 'tailchat-shared'; + +export const permissionList = [ + { + key: 'core.message', + title: t('发送消息'), + desc: t('允许成员在文字频道发送消息'), + default: true, + }, +]; diff --git a/web/src/components/modals/GroupDetail/Role/index.tsx b/web/src/components/modals/GroupDetail/Role/index.tsx index 5838b848..99723edd 100644 --- a/web/src/components/modals/GroupDetail/Role/index.tsx +++ b/web/src/components/modals/GroupDetail/Role/index.tsx @@ -3,24 +3,18 @@ import { FullModalField, } from '@/components/FullModal/Field'; import { IconBtn } from '@/components/IconBtn'; +import { Loading } from '@/components/Loading'; import { PillTabPane, PillTabs } from '@/components/PillTabs'; import { UserListItem } from '@/components/UserListItem'; import { Button, Input } from 'antd'; import React, { useCallback, useMemo, useState } from 'react'; import { Icon } from 'tailchat-design'; import { t, useGroupInfo, useSearch, useUserInfoList } from 'tailchat-shared'; +import { permissionList } from './const'; import { PermissionItem } from './PermissionItem'; import { RoleItem } from './RoleItem'; import { useModifyPermission } from './useModifyPermission'; - -const permissionList = [ - { - key: 'core.message', - title: t('发送消息'), - desc: t('允许成员在文字频道发送消息'), - default: true, - }, -]; +import { useRoleActions } from './useRoleActions'; interface GroupPermissionProps { groupId: string; @@ -43,115 +37,130 @@ export const GroupRole: React.FC = React.memo((props) => { }); const currentRoleInfo = useMemo( () => roles.find((r) => r._id === roleId), - [roleId] + [roles, roleId] ); const currentRolePermissions = useMemo( () => currentRoleInfo?.permissions ?? [], - [roleId] + [currentRoleInfo] ); - const { isEditing, editingPermission, handleSwitchPermission } = - useModifyPermission(currentRolePermissions); - - const handleAddMember = useCallback(() => {}, []); + const { + loading, + handleCreateRole, + handleSavePermission, + handleChangeRoleName, + } = useRoleActions(groupId, roleId); - const handleResetPermission = useCallback(() => {}, []); + const { + isEditing, + editingPermission, + setEditingPermission, + handleSwitchPermission, + } = useModifyPermission(currentRolePermissions); - const handleSavePermission = useCallback(() => {}, []); + const handleAddMember = useCallback(() => {}, []); - const handleChangeRoleName = useCallback((text) => { - console.log('text', text); + const handleResetPermission = useCallback(() => { + setEditingPermission( + permissionList.filter((p) => p.default === true).map((p) => p.key) + ); }, []); return ( -
-
- {/* 角色列表 */} - setRoleId('')}> - {t('所有人')} - - - {roles.map((r) => ( - setRoleId(r._id)} - > - {r.name} + +
+
+ {/* 角色列表 */} + setRoleId('')}> + {t('所有人')} - ))} - {t('添加角色')} -
+ {roles.map((r) => ( + setRoleId(r._id)} + > + {r.name} + + ))} -
- - - {/* 权限概述 */} - {currentRoleInfo && ( -
- + + {t('添加角色')} + +
+ +
+ + + {/* 权限概述 */} + {currentRoleInfo && ( +
+ +
+ )} + + +
+ +
- )} - - -
- - -
- {/* 权限详情 */} - {permissionList.map((p) => ( - handleSwitchPermission(p.key, checked)} - /> - ))} - - - {/* 管理成员 */} -
- } - value={searchText} - onChange={(e) => setSearchText(e.target.value)} - /> + {/* 权限详情 */} + {permissionList.map((p) => ( + handleSwitchPermission(p.key, checked)} + /> + ))} + + + {/* 管理成员 */} +
+ + } + value={searchText} + onChange={(e) => setSearchText(e.target.value)} + /> - -
+ +
- {(isSearching ? filterMembers : userInfoList).map((m) => ( - ]} - /> - ))} - - + {(isSearching ? filterMembers : userInfoList).map((m) => ( + ]} + /> + ))} + + +
-
+ ); }); GroupRole.displayName = 'GroupRole'; diff --git a/web/src/components/modals/GroupDetail/Role/useModifyPermission.ts b/web/src/components/modals/GroupDetail/Role/useModifyPermission.ts index f6a712ec..ce30cf4b 100644 --- a/web/src/components/modals/GroupDetail/Role/useModifyPermission.ts +++ b/web/src/components/modals/GroupDetail/Role/useModifyPermission.ts @@ -2,6 +2,7 @@ import { useCallback, useEffect, useMemo, useState } from 'react'; import _isEqual from 'lodash/isEqual'; import _uniq from 'lodash/uniq'; import _without from 'lodash/without'; +import { useAsyncFn } from 'tailchat-shared'; /** * 权限编辑 @@ -9,7 +10,7 @@ import _without from 'lodash/without'; export function useModifyPermission(originPermission: string[]) { const [editingPermission, setEditingPermission] = useState([]); const isEditing = useMemo( - () => _isEqual(new Set(originPermission), new Set(editingPermission)), + () => !_isEqual(new Set(originPermission), new Set(editingPermission)), [originPermission, editingPermission] ); @@ -28,5 +29,10 @@ export function useModifyPermission(originPermission: string[]) { [editingPermission] ); - return { isEditing, editingPermission, handleSwitchPermission }; + return { + isEditing, + editingPermission, + setEditingPermission, + handleSwitchPermission, + }; } diff --git a/web/src/components/modals/GroupDetail/Role/useRoleActions.ts b/web/src/components/modals/GroupDetail/Role/useRoleActions.ts new file mode 100644 index 00000000..27f49edc --- /dev/null +++ b/web/src/components/modals/GroupDetail/Role/useRoleActions.ts @@ -0,0 +1,34 @@ +import { model, t, useAsyncRequest } from 'tailchat-shared'; +import { permissionList } from './const'; + +export function useRoleActions(groupId: string, roleId: string) { + const [{ loading: loading1 }, handleCreateRole] = + useAsyncRequest(async () => { + await model.group.createGroupRole( + groupId, + t('新身份组'), + permissionList.filter((p) => p.default).map((p) => p.key) + ); + }, [groupId]); + + const [{ loading: loading2 }, handleSavePermission] = useAsyncRequest( + async (permissions: string[]) => { + await model.group.updateGroupRolePermission(groupId, roleId, permissions); + }, + [groupId, roleId] + ); + + const [{ loading: loading3 }, handleChangeRoleName] = useAsyncRequest( + async (newRoleName: string) => { + await model.group.updateGroupRoleName(groupId, roleId, newRoleName); + }, + [groupId, roleId] + ); + + return { + loading: loading1 || loading2 || loading3, + handleCreateRole, + handleSavePermission, + handleChangeRoleName, + }; +} diff --git a/web/src/init.tsx b/web/src/init.tsx index df918290..2f78c01e 100644 --- a/web/src/init.tsx +++ b/web/src/init.tsx @@ -20,7 +20,6 @@ import { import { getPopupContainer } from './utils/dom-helper'; import { getUserJWT } from './utils/jwt-helper'; import _get from 'lodash/get'; -import _debounce from 'lodash/debounce'; if (isDevelopment) { import('source-ref-open-vscode');