feat(vben5): 增强用户信息

- 用户Dto增加 `accessFailedCount` 字段
- 增加用户详情标签页
- 用户列表增加邮件验证标签
- 用户列表增加手机号验证标签

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

@@ -11,9 +11,12 @@ import { useAccess } from '@vben/access';
 import { useVbenModal } from '@vben/common-ui';
 import { $t } from '@vben/locales';
 
-import { useSettings } from '@abp/core';
+import { formatToDateTime, useSettings } from '@abp/core';
 import {
   Checkbox,
+  Descriptions,
+  DescriptionsItem,
+  Empty,
   Form,
   Input,
   InputPassword,
@@ -263,10 +266,7 @@ async function onLoadOuChildren(node: EventDataNode) {
           >
             <Input v-model:value="formModel.phoneNumber" />
           </FormItem>
-          <FormItem
-            :label="$t('AbpIdentity.DisplayName:LockoutEnabled')"
-            :label-col="{ span: 10 }"
-          >
+          <FormItem :label="$t('AbpIdentity.DisplayName:LockoutEnabled')">
             <Checkbox v-model:checked="formModel.lockoutEnabled">
               {{ $t('AbpIdentity.DisplayName:LockoutEnabled') }}
             </Checkbox>
@@ -285,7 +285,7 @@ async function onLoadOuChildren(node: EventDataNode) {
               width: '47%',
               height: '338px',
             }"
-            :render="(item) => item.title"
+            :render="(item: any) => item.title"
             :titles="[
               $t('AbpOpenIddict.Assigned'),
               $t('AbpOpenIddict.Available'),
@@ -300,6 +300,7 @@ async function onLoadOuChildren(node: EventDataNode) {
           :tab="$t('AbpIdentity.OrganizationUnits')"
         >
           <Tree
+            v-if="organizationUnits.length > 0"
             :checked-keys="checkedOuKeys"
             :load-data="onLoadOuChildren"
             :loaded-keys="loadedOuKeys"
@@ -309,6 +310,35 @@ async function onLoadOuChildren(node: EventDataNode) {
             checkable
             disabled
           />
+          <Empty v-else />
+        </TabPane>
+        <!-- 详细信息 -->
+        <TabPane
+          v-if="formModel.id"
+          key="details"
+          :tab="$t('AbpIdentity.Details')"
+        >
+          <Descriptions :column="1" bordered size="small">
+            <DescriptionsItem :label="$t('AbpIdentity.CreationTime')">
+              <span>{{ formatToDateTime(formModel.creationTime) }}</span>
+            </DescriptionsItem>
+            <DescriptionsItem :label="$t('AbpIdentity.ModificationTime')">
+              <span>{{
+                formatToDateTime(formModel.lastModificationTime)
+              }}</span>
+            </DescriptionsItem>
+            <DescriptionsItem :label="$t('AbpIdentity.PasswordUpdateTime')">
+              <span>{{
+                formatToDateTime(formModel.lastPasswordChangeTime)
+              }}</span>
+            </DescriptionsItem>
+            <DescriptionsItem :label="$t('AbpIdentity.FailedAccessCount')">
+              <span>{{ formModel.accessFailedCount }}</span>
+            </DescriptionsItem>
+            <DescriptionsItem :label="$t('AbpIdentity.LockoutEndTime')">
+              <span>{{ formatToDateTime(formModel.lockoutEnd) }}</span>
+            </DescriptionsItem>
+          </Descriptions>
         </TabPane>
       </Tabs>
     </Form>

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

@@ -26,7 +26,7 @@ import {
   PlusOutlined,
   UnlockOutlined,
 } from '@ant-design/icons-vue';
-import { Button, Dropdown, Menu, message, Modal } from 'ant-design-vue';
+import { Button, Dropdown, Menu, message, Modal, Tag } from 'ant-design-vue';
 
 import { useUsersApi } from '../../api/useUsersApi';
 import {
@@ -104,13 +104,20 @@ const gridOptions: VxeGridProps<IdentityUserDto> = {
       title: $t('AbpIdentity.DisplayName:UserName'),
     },
     {
+      align: 'left',
       field: 'email',
       minWidth: '120px',
+      slots: { default: 'email' },
       title: $t('AbpIdentity.DisplayName:Email'),
     },
     { field: 'surname', title: $t('AbpIdentity.DisplayName:Surname') },
     { field: 'name', title: $t('AbpIdentity.DisplayName:Name') },
-    { field: 'phoneNumber', title: $t('AbpIdentity.DisplayName:PhoneNumber') },
+    {
+      align: 'left',
+      field: 'phoneNumber',
+      slots: { default: 'phoneNumber' },
+      title: $t('AbpIdentity.DisplayName:PhoneNumber'),
+    },
     {
       field: 'lockoutEnd',
       formatter: ({ cellValue }) => {
@@ -295,6 +302,30 @@ const handleMenuClick = async (row: IdentityUserDto, info: MenuInfo) => {
         </div>
       </div>
     </template>
+    <template #email="{ row }">
+      <div class="flex flex-row">
+        <Tag v-if="row.emailConfirmed" color="success">
+          {{ $t('abp.account.settings.security.verified') }}
+        </Tag>
+        <Tag v-else color="warning">
+          {{ $t('abp.account.settings.security.unVerified') }}
+        </Tag>
+        <span>{{ row.email }}</span>
+      </div>
+    </template>
+    <template #phoneNumber="{ row }">
+      <div class="flex flex-row">
+        <div v-if="row.phoneNumber">
+          <Tag v-if="row.phoneNumberConfirmed" color="success">
+            {{ $t('abp.account.settings.security.verified') }}
+          </Tag>
+          <Tag v-else color="warning">
+            {{ $t('abp.account.settings.security.unVerified') }}
+          </Tag>
+        </div>
+        <span>{{ row.phoneNumber }}</span>
+      </div>
+    </template>
     <template #action="{ row }">
       <div class="flex flex-row">
         <div class="basis-1/3">

apps/vben5/packages/@abp/identity/src/types/users.ts

@@ -49,6 +49,8 @@ interface IdentityUserDto
     IHasExtraProperties,
     IUser {
   [key: string]: any;
+  /** 访问失败次数 */
+  accessFailedCount?: number;
   /** 邮箱已验证 */
   emailConfirmed: boolean;
   /** 已激活的用户 */