feat: 用户信息

apps/web-antd/src/views/system/user/info.tsx

@@ -0,0 +1,127 @@
+import type { DescItem } from '#/components/description';
+
+import { DictEnum } from '@vben/constants';
+
+import { Tag } from 'ant-design-vue';
+import dayjs from 'dayjs';
+import duration from 'dayjs/plugin/duration';
+
+import { renderDict } from '#/utils/render';
+
+dayjs.extend(duration);
+
+function renderTags(list: string[]) {
+  return (
+    <div class="flex flex-row flex-wrap gap-0.5">
+      {list.map((item) => (
+        <Tag key={item}>{item}</Tag>
+      ))}
+    </div>
+  );
+}
+
+export const descSchema: DescItem[] = [
+  {
+    field: 'userId',
+    label: '用户ID',
+  },
+  {
+    field: 'status',
+    label: '用户状态',
+    render(value) {
+      return renderDict(value, DictEnum.SYS_NORMAL_DISABLE);
+    },
+  },
+  {
+    field: 'nickName',
+    label: '用户信息',
+    render(_, data) {
+      const { deptName = '暂无部门信息', nickName, userName } = data;
+      // 为了兼容新版本和旧版本
+      let currentDept = deptName;
+      if (data.dept && data.dept.deptName) {
+        currentDept = data.dept.deptName;
+      }
+      return `${userName} / ${nickName} / ${currentDept}`;
+    },
+  },
+  {
+    field: 'phonenumber',
+    label: '手机号',
+    render(value) {
+      return value || '未设置手机号码';
+    },
+  },
+  {
+    field: 'email',
+    label: '邮箱',
+    render(value) {
+      return value || '未设置邮箱地址';
+    },
+  },
+  {
+    field: 'postNames',
+    label: '岗位',
+    render(value) {
+      if (Array.isArray(value) && value.length === 0) {
+        return '暂无信息';
+      }
+      return renderTags(value);
+    },
+  },
+  {
+    field: 'roleNames',
+    label: '权限',
+    render(value) {
+      if (Array.isArray(value) && value.length === 0) {
+        return '暂无信息';
+      }
+      return renderTags(value);
+    },
+  },
+  {
+    field: 'createTime',
+    label: '创建时间',
+  },
+  {
+    field: 'loginIp',
+    label: '上次登录IP',
+    render(value) {
+      return value || <span class="text-orange-500">从未登录过</span>;
+    },
+  },
+  {
+    field: 'loginDate',
+    label: '上次登录时间',
+    render(value) {
+      if (!value) {
+        return <span class="text-orange-500">从未登录过</span>;
+      }
+      // 默认en显示
+      dayjs.locale('zh-cn');
+      // 计算相差秒数
+      const diffSeconds = dayjs(new Date()).diff(dayjs(value), 'second');
+      /**
+       * 转为时间显示(x月 x天)
+       * https://dayjs.fenxianglu.cn/category/duration.html#%E4%BA%BA%E6%80%A7%E5%8C%96
+       *
+       */
+      const diffText = dayjs.duration(diffSeconds, 'seconds').humanize();
+      return (
+        <div class="flex gap-2">
+          {value}
+          <Tag bordered={false} color="cyan">
+            {diffText}前
+          </Tag>
+        </div>
+      );
+    },
+  },
+  {
+    field: 'remark',
+    label: '备注',
+    render(value) {
+      return value || '无';
+    },
+  },
+];