feat(roles): 增加角色声明管理.

apps/vben5/packages/@abp/identity/src/api/roles.ts

@@ -1,5 +1,11 @@
-import type { PagedResultDto } from '@abp/core';
+import type { ListResultDto, PagedResultDto } from '@abp/core';
 
+import type {
+  IdentityClaimCreateDto,
+  IdentityClaimDeleteDto,
+  IdentityClaimDto,
+  IdentityClaimUpdateDto,
+} from '../types/claims';
 import type {
   GetRolePagedListInput,
   IdentityRoleCreateDto,
@@ -78,3 +84,53 @@ export function removeOrganizationUnitApi(
     `/api/identity/roles/${id}/organization-units/${ouId}`,
   );
 }
+
+/**
+ * 获取角色声明列表
+ * @param id 角色id
+ */
+export function getClaimsApi(
+  id: string,
+): Promise<ListResultDto<IdentityClaimDto>> {
+  return requestClient.get<ListResultDto<IdentityClaimDto>>(
+    `/api/identity/roles/${id}/claims`,
+  );
+}
+
+/**
+ * 删除角色声明
+ * @param id 角色id
+ * @param input 角色声明dto
+ */
+export function deleteClaimApi(
+  id: string,
+  input: IdentityClaimDeleteDto,
+): Promise<void> {
+  return requestClient.delete(`/api/identity/roles/${id}/claims`, {
+    params: input,
+  });
+}
+
+/**
+ * 创建角色声明
+ * @param id 角色id
+ * @param input 角色声明dto
+ */
+export function createClaimApi(
+  id: string,
+  input: IdentityClaimCreateDto,
+): Promise<void> {
+  return requestClient.post(`/api/identity/roles/${id}/claims`, input);
+}
+
+/**
+ * 更新角色声明
+ * @param id 角色id
+ * @param input 用户角色dto
+ */
+export function updateClaimApi(
+  id: string,
+  input: IdentityClaimUpdateDto,
+): Promise<void> {
+  return requestClient.put(`/api/identity/roles/${id}/claims`, input);
+}

apps/vben5/packages/@abp/identity/src/components/roles/RoleClaimModal.vue

@@ -0,0 +1,81 @@
+<script setup lang="ts">
+import type { IdentityRoleDto } from '../../types';
+import type {
+  IdentityClaimCreateDto,
+  IdentityClaimDeleteDto,
+  IdentityClaimUpdateDto,
+} from '../../types/claims';
+
+import { defineAsyncComponent } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+import { $t } from '@vben/locales';
+
+import {
+  createClaimApi,
+  deleteClaimApi,
+  getClaimsApi,
+  updateClaimApi,
+} from '../../api/roles';
+import { IdentitRolePermissions } from '../../constants/permissions';
+
+defineOptions({
+  name: 'RoleClaimModal',
+});
+
+const ClaimTable = defineAsyncComponent(
+  () => import('../claims/ClaimTable.vue'),
+);
+
+const [Modal, modalApi] = useVbenModal({
+  draggable: true,
+  fullscreenButton: false,
+  onCancel() {
+    modalApi.close();
+  },
+  onConfirm: async () => {},
+  showCancelButton: false,
+  showConfirmButton: false,
+  title: $t('AbpIdentity.ManageClaim'),
+});
+
+async function onGet() {
+  const { id } = modalApi.getData<IdentityRoleDto>();
+  return await getClaimsApi(id);
+}
+
+async function onCreate(input: IdentityClaimCreateDto) {
+  const { id } = modalApi.getData<IdentityRoleDto>();
+  await createClaimApi(id, input);
+}
+
+async function onDelete(input: IdentityClaimDeleteDto) {
+  const { id } = modalApi.getData<IdentityRoleDto>();
+  await deleteClaimApi(id, input);
+}
+
+async function onUpdate(input: IdentityClaimUpdateDto) {
+  const { id } = modalApi.getData<IdentityRoleDto>();
+  await updateClaimApi(id, input);
+}
+
+defineExpose({
+  modalApi,
+});
+</script>
+
+<template>
+  <Modal>
+    <ClaimTable
+      :create-api="onCreate"
+      :create-policy="IdentitRolePermissions.ManageClaims"
+      :delete-api="onDelete"
+      :delete-policy="IdentitRolePermissions.ManageClaims"
+      :get-api="onGet"
+      :update-api="onUpdate"
+      :update-policy="IdentitRolePermissions.ManageClaims"
+    />
+  </Modal>
+</template>
+
+<style scoped></style>

apps/vben5/packages/@abp/identity/src/components/roles/RoleTable.vue

@@ -33,12 +33,16 @@ const MenuOutlined = createIconifyIcon('heroicons-outline:menu-alt-3');
 const ClaimOutlined = createIconifyIcon('la:id-card-solid');
 const PermissionsOutlined = createIconifyIcon('icon-park-outline:permissions');
 const RoleModal = defineAsyncComponent(() => import('./RoleModal.vue'));
+const ClaimModal = defineAsyncComponent(() => import('./RoleClaimModal.vue'));
 
 const abpStore = useAbpStore();
 const { hasAccessByCodes } = useAccess();
 const [RolePermissionModal, permissionModalApi] = useVbenModal({
   connectedComponent: PermissionModal,
 });
+const [RoleClaimModal, claimModalApi] = useVbenModal({
+  connectedComponent: ClaimModal,
+});
 
 const formOptions: VbenFormProps = {
   // 默认展开
@@ -134,6 +138,11 @@ const handleDelete = (row: IdentityRoleDto) => {
 
 const handleMenuClick = async (row: IdentityRoleDto, info: MenuInfo) => {
   switch (info.key) {
+    case 'claims': {
+      claimModalApi.setData(row);
+      claimModalApi.open();
+      break;
+    }
     case 'permissions': {
       const roles = abpStore.application?.currentUser.roles ?? [];
       permissionModalApi.setData({
@@ -233,6 +242,7 @@ const handleMenuClick = async (row: IdentityRoleDto, info: MenuInfo) => {
     </template>
   </Grid>
   <RoleEditModal @change="() => query()" />
+  <RoleClaimModal @change="query" />
   <RolePermissionModal />
 </template>
 

apps/vben5/packages/@abp/identity/src/components/users/UserTable.vue

@@ -194,7 +194,6 @@ const handleUnlock = async (row: IdentityUserDto) => {
 const handleMenuClick = async (row: IdentityUserDto, info: MenuInfo) => {
   switch (info.key) {
     case 'claims': {
-      console.log(claimModalApi);
       claimModalApi.setData(row);
       claimModalApi.open();
       break;