feat(vben5): Personal Settings component

- Personal Settings Add components to enable configuration items
- It is allowed to revoke my session

apps/vben5/packages/@abp/account/src/components/MySetting.vue

@@ -2,7 +2,7 @@
 import type { ProfileDto, UpdateProfileDto } from '../types/profile';
 import type { UserInfo } from '../types/user';
 
-import { computed, defineAsyncComponent, onMounted, reactive, ref } from 'vue';
+import { computed, defineAsyncComponent, onMounted, ref } from 'vue';
 import { useRoute } from 'vue-router';
 
 import { useVbenModal } from '@vben/common-ui';
@@ -13,6 +13,19 @@ import { Card, Menu, message, Modal } from 'ant-design-vue';
 
 import { useProfileApi } from '../api/useProfileApi';
 
+interface MenuItem {
+  key: string;
+  label: string;
+}
+
+const props = defineProps<{
+  disableAuthenticator?: boolean;
+  disableBind?: boolean;
+  disableNotice?: boolean;
+  disablePersonalData?: boolean;
+  disableSecurity?: boolean;
+  disableSession?: boolean;
+}>();
 const AuthenticatorSettings = defineAsyncComponent(
   () => import('./components/AuthenticatorSettings.vue'),
 );
@@ -40,7 +53,7 @@ const { query } = useRoute();
 
 const selectedMenuKeys = ref<string[]>(['basic']);
 const myProfile = ref({} as ProfileDto);
-const menuItems = reactive([
+const basicMenuItems: MenuItem[] = [
   {
     key: 'basic',
     label: $t('abp.account.settings.basic.title'),
@@ -69,7 +82,19 @@ const menuItems = reactive([
     key: 'personal-data',
     label: $t('abp.account.settings.personalDataSettings'),
   },
-]);
+];
+const getEnabledMenus = computed(() => {
+  return basicMenuItems.filter((x) => {
+    if (x.key === 'basic') return true;
+    if (x.key === 'authenticator') return !props.disableAuthenticator;
+    if (x.key === 'bind') return !props.disableBind;
+    if (x.key === 'notice') return !props.disableNotice;
+    if (x.key === 'personal-data') return !props.disablePersonalData;
+    if (x.key === 'security') return !props.disableSecurity;
+    if (x.key === 'session') return !props.disableSession;
+    return true; // default case for any unexpected keys
+  });
+});
 const getUserInfo = computed((): null | UserInfo => {
   if (!userStore.userInfo) {
     return null;
@@ -155,7 +180,7 @@ onMounted(async () => {
         <div class="basis-1/6">
           <Menu
             v-model:selected-keys="selectedMenuKeys"
-            :items="menuItems"
+            :items="getEnabledMenus"
             mode="inline"
           />
         </div>

apps/vben5/packages/@abp/identity/src/components/sessions/UserSessionTable.vue

@@ -24,17 +24,20 @@ const DescriptionItem = Descriptions.Item;
 
 const { hasAccessByCodes } = useAccess();
 const abpStore = useAbpStore();
-/** 获取登录用户会话Id */
+/** 获取登录用户 */
-const getMySessionId = computed(() => {
+const getCurrentUser = computed(() => {
-  return abpStore.application?.currentUser.sessionId;
+  return abpStore.application?.currentUser;
 });
 /** 获取是否允许撤销会话 */
 const getAllowRevokeSession = computed(() => {
   return (session: IdentitySessionDto) => {
-    if (getMySessionId.value === session.sessionId) {
+    if (getCurrentUser.value?.sessionId === session.sessionId) {
       return false;
     }
-    return hasAccessByCodes([IdentitySessionPermissions.Revoke]);
+    return (
+      getCurrentUser.value?.id === session.userId ||
+      hasAccessByCodes([IdentitySessionPermissions.Revoke])
+    );
   };
 });
 
@@ -106,7 +109,10 @@ function onDelete(session: IdentitySessionDto) {
       <div class="flex flex-row">
         <span>{{ row.device }}</span>
         <div class="pl-[5px]">
-          <Tag v-if="row.sessionId === getMySessionId" color="#87d068">
+          <Tag
+            v-if="row.sessionId === getCurrentUser?.sessionId"
+            color="#87d068"
+          >
             {{ $t('AbpIdentity.CurrentSession') }}
           </Tag>
         </div>