diff --git a/src/api/sys/model/userModel.ts b/src/api/sys/model/userModel.ts
index ce0e2819..cae50324 100644
--- a/src/api/sys/model/userModel.ts
+++ b/src/api/sys/model/userModel.ts
@@ -27,7 +27,7 @@ export interface GetUserInfoModel {
   // 名称
   name: string
   // 账号
-  username: string
+  account: string
   // 头像
   avatar: string
 }
diff --git a/src/api/sys/userAssist.ts b/src/api/sys/userAssist.ts
new file mode 100644
index 00000000..a74c2508
--- /dev/null
+++ b/src/api/sys/userAssist.ts
@@ -0,0 +1,50 @@
+import { defHttp } from '@/utils/http/axios'
+import { Result } from '#/axios'
+
+/**
+ * 账号是否被使用
+ */
+export function existsAccount(account) {
+  return defHttp.get<Result<boolean>>({
+    url: `/user/existsAccount`,
+    params: { account },
+  })
+}
+export function existsAccountNotId(account, id) {
+  return defHttp.get<Result<boolean>>({
+    url: `/user/existsAccountNotId`,
+    params: { account, id },
+  })
+}
+
+/**
+ * 手机号是否被使用
+ */
+export function existsPhone(phone) {
+  return defHttp.get<Result<boolean>>({
+    url: `/user/existsPhone`,
+    params: { phone },
+  })
+}
+export function existsPhoneNotId(phone, id) {
+  return defHttp.get<Result<boolean>>({
+    url: `/user/existsPhoneNotId`,
+    params: { phone, id },
+  })
+}
+
+/**
+ * 邮箱是否被使用
+ */
+export function existsEmail(email) {
+  return defHttp.get<Result<boolean>>({
+    url: `/user/existsEmail`,
+    params: { email },
+  })
+}
+export function existsEmailNotId(email, id) {
+  return defHttp.get<Result<boolean>>({
+    url: `/user/existsEmailNotId`,
+    params: { email, id },
+  })
+}
diff --git a/src/utils/validate.ts b/src/utils/validate.ts
new file mode 100644
index 00000000..414371b3
--- /dev/null
+++ b/src/utils/validate.ts
@@ -0,0 +1,254 @@
+/**
+ * 邮箱
+ * @param {*} s
+ */
+export function isEmail(s) {
+  return /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((.[a-zA-Z0-9_-]{2,3}){1,2})$/.test(s)
+}
+
+/**
+ * 手机号码
+ * @param {*} s
+ */
+export function isMobile(s) {
+  return /^1[0-9]{10}$/.test(s)
+}
+
+/**
+ * 电话号码
+ * @param {*} s
+ */
+export function isPhone(s) {
+  return /^([0-9]{3,4}-)?[0-9]{7,8}$/.test(s)
+}
+
+/**
+ * URL地址
+ * @param {*} s
+ */
+export function isURL(s) {
+  return /^http[s]?:\/\/.*/.test(s)
+}
+
+export function isValidUsername(str) {
+  const validMap = ['admin', 'editor']
+  return validMap.indexOf(str.trim()) >= 0
+}
+
+/* 合法uri */
+export function validateURL(textval) {
+  const urlregex =
+    /^(https?|ftp):\/\/([a-zA-Z0-9.-]+(:[a-zA-Z0-9.&%$-]+)*@)*((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[1-9][0-9]?)(\.(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[1-9]?[0-9])){3}|([a-zA-Z0-9-]+\.)*[a-zA-Z0-9-]+\.(com|edu|gov|int|mil|net|org|biz|arpa|info|name|pro|aero|coop|museum|[a-zA-Z]{2}))(:[0-9]+)*(\/($|[a-zA-Z0-9.,?'\\+&%$#=~_-]+))*$/
+  return urlregex.test(textval)
+}
+
+/* 小写字母 */
+export function validateLowerCase(str) {
+  const reg = /^[a-z]+$/
+  return reg.test(str)
+}
+
+/* 大写字母 */
+export function validateUpperCase(str) {
+  const reg = /^[A-Z]+$/
+  return reg.test(str)
+}
+
+/* 大小写字母 */
+export function validateAlphabets(str) {
+  const reg = /^[A-Za-z]+$/
+  return reg.test(str)
+}
+
+/* 验证pad还是pc */
+export const validatePc = function () {
+  const userAgentInfo = navigator.userAgent
+  const Agents = ['Android', 'iPhone', 'SymbianOS', 'Windows Phone', 'iPad', 'iPod']
+  let flag = true
+  for (let v = 0; v < Agents.length; v++) {
+    if (userAgentInfo.indexOf(Agents[v]) > 0) {
+      flag = false
+      break
+    }
+  }
+  return flag
+}
+
+/**
+ * 判断身份证号码
+ */
+export function validateCardId(code) {
+  let result = true
+  let msg = ''
+  const city = {
+    11: '北京',
+    12: '天津',
+    13: '河北',
+    14: '山西',
+    15: '内蒙古',
+    21: '辽宁',
+    22: '吉林',
+    23: '黑龙江 ',
+    31: '上海',
+    32: '江苏',
+    33: '浙江',
+    34: '安徽',
+    35: '福建',
+    36: '江西',
+    37: '山东',
+    41: '河南',
+    42: '湖北 ',
+    43: '湖南',
+    44: '广东',
+    45: '广西',
+    46: '海南',
+    50: '重庆',
+    51: '四川',
+    52: '贵州',
+    53: '云南',
+    54: '西藏 ',
+    61: '陕西',
+    62: '甘肃',
+    63: '青海',
+    64: '宁夏',
+    65: '新疆',
+    71: '台湾',
+    81: '香港',
+    82: '澳门',
+    91: '国外 ',
+  }
+  if (!validateNull(code)) {
+    if (code.length === 18) {
+      if (!code || !/(^\d{18}$)|(^\d{17}(\d|X|x)$)/.test(code)) {
+        msg = '证件号码格式错误'
+      } else if (!city[code.substr(0, 2)]) {
+        msg = '地址编码错误'
+      } else {
+        // 18位身份证需要验证最后一位校验位
+        code = code.split('')
+        // ∑(ai×Wi)(mod 11)
+        // 加权因子
+        const factor = [7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2]
+        // 校验位
+        const parity = [1, 0, 'X', 9, 8, 7, 6, 5, 4, 3, 2, 'x']
+        let sum = 0
+        let ai = 0
+        let wi = 0
+        for (let i = 0; i < 17; i++) {
+          ai = code[i]
+          wi = factor[i]
+          sum += ai * wi
+        }
+        if (parity[sum % 11] !== code[17]) {
+          msg = '证件号码校验位错误'
+        } else {
+          result = false
+        }
+      }
+    } else {
+      msg = '证件号码长度不为18位'
+    }
+  } else {
+    msg = '证件号码不能为空'
+  }
+  return { result, msg }
+}
+
+/**
+ * 邮件
+ */
+export function validateEmail(email) {
+  const isEmail = /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((.[a-zA-Z0-9_-]{2,3}){1,2})$/
+  let result = false
+  let msg = ''
+  if (!validateNull(email)) {
+    if (!isEmail.test(email)) {
+      msg = '邮箱格式不正确'
+    } else {
+      result = true
+    }
+  } else {
+    msg = '邮箱不能为空'
+  }
+  return { result, msg }
+}
+
+/**
+ * 判断手机号码是否正确
+ * @return
+ */
+export function validateMobile(phone) {
+  let result = false
+  let msg = ''
+  const isPhone = /^(1[0-9])\d{9}$/
+  if (!validateNull(phone)) {
+    if (phone.length === 11) {
+      if (!isPhone.test(phone)) {
+        msg = '手机号码格式不正确'
+      } else {
+        result = true
+      }
+    } else {
+      msg = '手机号码格式不正确'
+    }
+  } else {
+    msg = '手机号码不能为空'
+  }
+  return { result, msg }
+}
+
+/**
+ * 判断姓名是否正确
+ */
+export function validateName(name) {
+  const regName = /^[\u4e00-\u9fa5]{2,4}$/
+  return regName.test(name)
+}
+
+/**
+ * 判断是否为整数
+ */
+export function validateNum(num, type) {
+  let regName = /[^\d.]/g
+  if (type === 1) {
+    if (!regName.test(num)) return false
+  } else if (type === 2) {
+    regName = /[^\d]/g
+    if (!regName.test(num)) return false
+  }
+  return true
+}
+
+/**
+ * 判断是否为小数
+ */
+export function validateNumOrd(num, type) {
+  let regName = /[^\d.]/g
+  if (type === 1) {
+    if (!regName.test(num)) return false
+  } else if (type === 2) {
+    regName = /[^\d.]/g
+    if (!regName.test(num)) return false
+  }
+  return true
+}
+
+/**
+ * 判断是否为空
+ */
+export function validateNull(val) {
+  if (typeof val === 'boolean') {
+    return false
+  }
+  if (typeof val === 'number') {
+    return false
+  }
+  if (val instanceof Array) {
+    if (val.length === 0) return true
+  } else if (val instanceof Object) {
+    if (JSON.stringify(val) === '{}') return true
+  } else {
+    return val === 'null' || val == null || val === 'undefined' || val === undefined || val === ''
+  }
+  return false
+}
diff --git a/src/views/iam/user/User.api.ts b/src/views/iam/user/User.api.ts
new file mode 100644
index 00000000..04d411d7
--- /dev/null
+++ b/src/views/iam/user/User.api.ts
@@ -0,0 +1,136 @@
+import { defHttp } from '@/utils/http/axios'
+import { PageResult, Result } from '#/axios'
+import { BaseEntity } from '#/web'
+
+/**
+ * 分页
+ */
+export function page(params) {
+  return defHttp.get<Result<PageResult<UserInfo>>>({
+    url: '/user/admin/page',
+    params,
+  })
+}
+
+/**
+ * 获取单条
+ */
+export function get(id) {
+  return defHttp.get<Result<UserInfo>>({
+    url: '/user/admin/findById',
+    params: { id },
+  })
+}
+
+/**
+ * 添加
+ */
+export function add(obj) {
+  return defHttp.post({
+    url: '/user/admin/add',
+    data: obj,
+  })
+}
+
+/**
+ * 更新
+ */
+export function update(obj) {
+  return defHttp.post({
+    url: '/user/admin/update',
+    data: obj,
+  })
+}
+
+/**
+ * 查询全部
+ */
+export function findAll() {
+  return defHttp.get<Result<Array<UserInfo>>>({
+    url: '/user/admin/findAll',
+  })
+}
+/**
+ * 重置密码
+ */
+export function restartPassword(userId, newPassword) {
+  return defHttp.post({
+    url: '/user/admin/restartPassword',
+    params: { userId, newPassword },
+  })
+}
+
+/**
+ * 批量重置密码
+ */
+export function restartPasswordBatch(userIds, newPassword) {
+  return defHttp.post({
+    url: '/user/admin/restartPasswordBatch',
+    data: userIds,
+    params: { newPassword },
+  })
+}
+
+/**
+ * 封禁用户
+ */
+export function banUser(userId) {
+  return defHttp.post({
+    url: '/user/admin/ban',
+    params: { userId },
+  })
+}
+
+/**
+ * 封禁用户 批量
+ */
+export function banUserBatch(userIds) {
+  return defHttp.post({
+    url: '/user/admin/banUserBatch',
+    data: userIds,
+  })
+}
+
+/**
+ * 解锁用户
+ */
+export function unlockUser(userId) {
+  return defHttp.post({
+    url: '/user/admin/unlock',
+    params: { userId },
+  })
+}
+
+/**
+ * 解锁用户
+ */
+export function unlockUserBatch(userIds) {
+  return defHttp.post({
+    url: '/user/admin/unlockBatch',
+    data: userIds,
+  })
+}
+
+/**
+ * 用户信息
+ */
+export interface UserInfo extends BaseEntity {
+  // 名称
+  name: string
+  // 账号
+  account: string
+  // 密码
+  password?: string
+  // 确认密码
+  confirmPassword?: string
+  // 手机号
+  phone?: string
+  // 邮箱
+  email?: string
+  // 是否超级管理员
+  administrator?: boolean
+  // 注册时间
+  registerTime?: string
+  // 账号状态
+  status?: number
+}
diff --git a/src/views/iam/user/UserAdd.vue b/src/views/iam/user/UserAdd.vue
new file mode 100644
index 00000000..f3061eba
--- /dev/null
+++ b/src/views/iam/user/UserAdd.vue
@@ -0,0 +1,182 @@
+<template>
+  <basic-drawer
+    showFooter
+    title="添加用户"
+    v-bind="$attrs"
+    :width="modalWidth"
+    :open="visible"
+    :mask-closable="false"
+  >
+    <a-spin :spinning="confirmLoading">
+      <a-form
+        class="small-from-item"
+        ref="formRef"
+        :model="form"
+        :rules="rules"
+        :validate-trigger="['blur', 'change']"
+        :label-col="labelCol"
+        :wrapper-col="wrapperCol"
+      >
+        <a-form-item label="用户账号" name="account" validate-first>
+          <a-input v-model:value="form.account" placeholder="请输入用户账号" />
+        </a-form-item>
+        <a-form-item label="用户名称" name="name">
+          <a-input v-model:value="form.name" placeholder="请输入用户名称" />
+        </a-form-item>
+        <a-form-item label="登录密码" name="password" validate-first>
+          <strength-meter
+            v-model:value="form.password"
+            placeholder="请输入登录密码"
+            @change="validateToNextPassword"
+          />
+        </a-form-item>
+        <a-form-item label="确认密码" name="confirmPassword" validate-first>
+          <a-input-password v-model:value="form.confirmPassword" placeholder="请重新输入登录密码" />
+        </a-form-item>
+        <a-form-item label="手机号" validate-first name="phone">
+          <a-input v-model:value="form.phone" placeholder="请输入用户手机号" />
+        </a-form-item>
+        <a-form-item label="邮箱" validate-first name="email">
+          <a-input v-model:value="form.email" placeholder="请输入用户邮箱" />
+        </a-form-item>
+      </a-form>
+    </a-spin>
+    <template #footer>
+      <a-space>
+        <a-button key="cancel" @click="handleCancel">取消</a-button>
+        <a-button key="forward" :loading="confirmLoading" type="primary" @click="handleOk"
+          >保存</a-button
+        >
+      </a-space>
+    </template>
+  </basic-drawer>
+</template>
+
+<script lang="ts" setup>
+  import BasicDrawer from '@/components/Drawer/src/BasicDrawer.vue'
+  import useFormEdit from '@/hooks/bootx/useFormEdit'
+  import { FormInstance, Rule } from 'ant-design-vue/lib/form'
+  import { nextTick, reactive, ref } from 'vue'
+  import StrengthMeter from '/@/components/StrengthMeter/src/StrengthMeter.vue'
+  import { validateEmail, validateMobile } from '@/utils/validate'
+  import { existsAccount, existsEmail, existsPhone } from '@/api/sys/userAssist'
+  import { add, UserInfo } from './User.api'
+  import { useMessage } from '@/hooks/web/useMessage'
+
+  const { handleCancel, labelCol, wrapperCol, modalWidth, confirmLoading, visible } = useFormEdit()
+  const { createMessage } = useMessage()
+  const formRef = ref<FormInstance>()
+  let form = ref<UserInfo>({
+    name: '',
+    account: '',
+    phone: '',
+    email: '',
+    password: '',
+    confirmPassword: '',
+  })
+  // 校验
+  const rules = reactive({
+    name: [{ required: true, message: '请输入用户名称' }],
+    account: [
+      { required: true, message: '请输入用户账号' },
+      { validator: checkAccount, trigger: 'blur' },
+    ],
+    password: [{ required: true, message: '请输入登录密码!' }],
+    confirmPassword: [
+      { required: true, message: '请重新输入登录密码!' },
+      { validator: compareToFirstPassword },
+    ],
+    phone: [{ validator: validatePhone }, { validator: validateBindPhone, trigger: 'blur' }],
+    email: [{ validator: validateEmailRule }, { validator: validateBindEmail, trigger: 'blur' }],
+  } as Record<string, Rule[]>)
+
+  let confirmDirty = ref(false)
+
+  // 事件
+  const emits = defineEmits(['ok'])
+
+  function init() {
+    visible.value = true
+    confirmLoading.value = false
+    nextTick(() => {
+      formRef.value?.resetFields()
+    })
+  }
+
+  function handleOk() {
+    formRef.value?.validate().then(async () => {
+      confirmLoading.value = true
+      await add(form.value).finally(() => (confirmLoading.value = false))
+      createMessage.success('添加用户成功')
+      confirmLoading.value = false
+      emits('ok')
+      handleCancel()
+    })
+  }
+
+  /**
+   * 用户名检查
+   */
+  async function checkAccount() {
+    const { data } = await existsAccount(form.value.account)
+    return data ? Promise.reject('用户名已存在!') : Promise.resolve()
+  }
+  /**
+   * 密码检查
+   */
+  function validateToNextPassword() {
+    if (confirmDirty.value) {
+      formRef.value?.validateFields(['confirmPassword'])
+    }
+  }
+  function compareToFirstPassword() {
+    if (form.value.confirmPassword !== form.value.password) {
+      confirmDirty.value = true
+      return Promise.reject('密码不一致')
+    } else {
+      return Promise.resolve()
+    }
+  }
+
+  /**
+   * 校验邮箱号
+   */
+  function validateEmailRule() {
+    const { email } = form.value
+    if (!email) {
+      return Promise.resolve()
+    }
+    const { msg, result } = validateEmail(email)
+    return result ? Promise.resolve() : Promise.reject(msg)
+  }
+  /**
+   * 后台校验邮箱号是否被使用
+   */
+  async function validateBindEmail() {
+    const { email } = form.value
+    const { data } = await existsEmail(email)
+    return data ? Promise.reject('邮箱已被使用') : Promise.resolve()
+  }
+  /**
+   * 校验手机号
+   */
+  function validatePhone() {
+    const { phone } = form.value
+    if (!phone) {
+      return Promise.resolve()
+    }
+    const { msg, result } = validateMobile(phone)
+    return result ? Promise.resolve() : Promise.reject(msg)
+  }
+  /**
+   * 后台校验手机号是否被使用
+   */
+  async function validateBindPhone() {
+    const { phone } = form.value
+    const { data } = await existsPhone(phone)
+    return data ? Promise.reject('手机号已被使用') : Promise.resolve()
+  }
+  defineExpose({ init })
+</script>
+
+<style scoped></style>
diff --git a/src/views/iam/user/UserAssign.api.ts b/src/views/iam/user/UserAssign.api.ts
new file mode 100644
index 00000000..60c98882
--- /dev/null
+++ b/src/views/iam/user/UserAssign.api.ts
@@ -0,0 +1,43 @@
+import { defHttp } from '@/utils/http/axios'
+import { Result } from '#/axios'
+import { Role } from '@/views/iam/role/Role.api'
+
+/**
+ * 获取用户拥有角色id集合
+ */
+export function getRoleIds(id) {
+  return defHttp.get<Result<string[]>>({
+    url: `/user/role/findRoleIdsByUser`,
+    params: { id },
+  })
+}
+
+/**
+ * 获取用户拥有角色集合
+ */
+export function getRoles(id) {
+  return defHttp.get<Result<Role[]>>({
+    url: `/user/role/findRolesByUser`,
+    params: { id },
+  })
+}
+
+/**
+ * 添加用户角色关联关系
+ */
+export function addUserRole(data) {
+  return defHttp.post({
+    url: `/user/role/saveAssign`,
+    data: data,
+  })
+}
+
+/**
+ * 添加用户角色关联关系 批量
+ */
+export function addUserRoleBatch(data) {
+  return defHttp.post({
+    url: `/user/role/saveAssignBatch`,
+    data: data,
+  })
+}
diff --git a/src/views/iam/user/UserEdit.vue b/src/views/iam/user/UserEdit.vue
new file mode 100644
index 00000000..2a15427e
--- /dev/null
+++ b/src/views/iam/user/UserEdit.vue
@@ -0,0 +1,169 @@
+<template>
+  <basic-drawer
+    showFooter
+    title="用户信息修改"
+    v-bind="$attrs"
+    :width="modalWidth"
+    :open="visible"
+    :mask-closable="false"
+    @ok="handleOk"
+    @close="handleCancel"
+  >
+    <a-spin :spinning="confirmLoading">
+      <a-form
+        class="small-from-item"
+        ref="formRef"
+        :model="form"
+        :rules="rules"
+        :validate-trigger="['blur', 'change']"
+        :label-col="labelCol"
+        :wrapper-col="wrapperCol"
+      >
+        <a-form-item label="用户账号" validate-first name="account">
+          <a-input v-model:value="form.account" placeholder="请输入用户账号" />
+        </a-form-item>
+        <a-form-item label="用户名称" name="name">
+          <a-input v-model:value="form.name" placeholder="请输入用户名称" />
+        </a-form-item>
+        <a-form-item label="手机号" validate-first name="phone">
+          <a-input v-model:value="form.phone" placeholder="请输入用户手机号" />
+        </a-form-item>
+        <a-form-item label="邮箱" validate-first name="email">
+          <a-input v-model:value="form.email" placeholder="请输入用户邮箱" />
+        </a-form-item>
+      </a-form>
+    </a-spin>
+  </basic-drawer>
+</template>
+
+<script lang="ts" setup>
+  import BasicDrawer from '@/components/Drawer/src/BasicDrawer.vue'
+  import useFormEdit from '@/hooks/bootx/useFormEdit'
+  import { FormInstance, Rule } from 'ant-design-vue/lib/form'
+  import { computed, nextTick, ref } from 'vue'
+  import { get, update, UserInfo } from './User.api'
+  import { existsEmailNotId, existsPhoneNotId, existsAccountNotId } from '@/api/sys/userAssist'
+  import { validateEmail, validateMobile } from '@/utils/validate'
+  import { useMessage } from '@/hooks/web/useMessage'
+
+  const { handleCancel, diffForm, labelCol, wrapperCol, modalWidth, confirmLoading, visible } =
+    useFormEdit()
+  const { createMessage } = useMessage()
+
+  const formRef = ref<FormInstance>()
+  let form = ref<UserInfo>({
+    id: null,
+    name: '',
+    account: '',
+    phone: '',
+    email: '',
+  })
+  let rawForm: any = {}
+
+  // 校验
+  const rules = computed(() => {
+    return {
+      name: [{ required: true, message: '请输入名称' }],
+      account: [
+        { required: true, message: '请输入账号' },
+        { validator: checkAccount, trigger: 'blur' },
+      ],
+      phone:
+        rawForm.phone !== form.value.phone
+          ? [{ validator: validatePhone }, { validator: validateBindPhone, trigger: 'blur' }]
+          : [],
+      email:
+        rawForm.email !== form.value.email
+          ? [{ validator: validateEmailRule }, { validator: validateBindEmail, trigger: 'blur' }]
+          : [],
+    } as Record<string, Rule[]>
+  })
+  // 事件
+  const emits = defineEmits(['ok'])
+
+  /**
+   * 入口
+   */
+  function init(id) {
+    visible.value = true
+    confirmLoading.value = true
+    nextTick(() => {
+      formRef.value?.resetFields()
+    })
+    get(id).then(({ data }) => {
+      rawForm = { ...data }
+      form.value = data
+      confirmLoading.value = false
+    })
+  }
+
+  /**
+   * 更新
+   */
+  function handleOk() {
+    formRef.value?.validate().then(async () => {
+      confirmLoading.value = true
+      await update({
+        ...form.value,
+        ...diffForm(form.value, rawForm, 'password'),
+      }).finally(() => (confirmLoading.value = false))
+      createMessage.success('用户更改成功')
+      confirmLoading.value = false
+      emits('ok')
+      handleCancel()
+    })
+  }
+
+  /**
+   * 用户名检查
+   */
+  async function checkAccount() {
+    const { data } = await existsAccountNotId(form.value.account, form.value.id)
+    return data ? Promise.reject('用户名已存在!') : Promise.resolve()
+  }
+
+  /**
+   * 校验邮箱号
+   */
+  function validateEmailRule() {
+    const { email } = form.value
+    if (!email) {
+      return Promise.resolve()
+    }
+    const { msg, result } = validateEmail(email)
+    return result ? Promise.resolve() : Promise.reject(msg)
+  }
+  /**
+   * 后台校验邮箱号是否被使用
+   */
+  async function validateBindEmail() {
+    const { email, id } = form.value
+    if (rawForm.email === email) {
+      return Promise.resolve()
+    }
+    const { data } = await existsEmailNotId(email, id)
+    return data ? Promise.reject('邮箱已被使用') : Promise.resolve()
+  }
+  /**
+   * 校验手机号
+   */
+  function validatePhone() {
+    const { phone } = form.value
+    if (!phone) {
+      return Promise.resolve()
+    }
+    const { msg, result } = validateMobile(phone)
+    return result ? Promise.resolve() : Promise.reject(msg)
+  }
+  /**
+   * 后台校验手机号是否被使用
+   */
+  async function validateBindPhone() {
+    const { phone, id } = form.value
+    const { data } = await existsPhoneNotId(phone, id)
+    return data ? Promise.reject('手机号已被使用') : Promise.resolve()
+  }
+  defineExpose({ init })
+</script>
+
+<style scoped></style>
diff --git a/src/views/iam/user/UserList.vue b/src/views/iam/user/UserList.vue
new file mode 100644
index 00000000..bda2f13f
--- /dev/null
+++ b/src/views/iam/user/UserList.vue
@@ -0,0 +1,293 @@
+<template>
+  <div>
+    <div class="m-3 p-3 pt-5 bg-white">
+      <b-query
+        :query-params="model.queryParam"
+        :fields="fields"
+        @query="queryPage"
+        @reset="resetQueryParams"
+      />
+    </div>
+    <div class="m-3 p-3 bg-white">
+      <vxe-toolbar ref="xToolbar" custom :refresh="{ queryMethod: queryPage }">
+        <template #buttons>
+          <a-space>
+            <a-button type="primary" pre-icon="ant-design:plus-outlined" @click="add"
+              >新建</a-button
+            >
+            <a-dropdown v-if="batchOperateFlag">
+              <a-button post-icon="ant-design:down-outlined"> 批量操作 </a-button>
+              <template #overlay>
+                <a-menu>
+                  <a-menu-item>
+                    <a @click="assignRolesBatch()">角色分配</a>
+                  </a-menu-item>
+                  <a-menu-item>
+                    <a @click="lockUserConfirmBatch(true)">锁定账号</a>
+                  </a-menu-item>
+                  <a-menu-item>
+                    <a @click="lockUserConfirmBatch(false)">解锁账号</a>
+                  </a-menu-item>
+                  <a-menu-item>
+                    <a @click="resetPwdBatch()">重置密码</a>
+                  </a-menu-item>
+                </a-menu>
+              </template>
+            </a-dropdown>
+          </a-space>
+        </template>
+      </vxe-toolbar>
+      <vxe-table
+        ref="xTable"
+        size="medium"
+        @checkbox-all="selectAllEvent"
+        @checkbox-change="selectChangeEvent"
+        :loading="loading"
+        :data="pagination.records"
+      >
+        <vxe-column type="checkbox" width="50" />
+        <vxe-column field="name" title="姓名" />
+        <vxe-column field="account" title="账号" />
+        <vxe-column field="phone" title="手机号" />
+        <vxe-column field="email" title="邮箱" />
+        <vxe-column field="administrator" title="是否管理员">
+          <template #default="{ row }">
+            <a-tag v-if="row.administrator" color="green">是</a-tag>
+            <a-tag v-else color="red">否</a-tag>
+          </template>
+        </vxe-column>
+        <vxe-column field="status" title="用户状态">
+          <template #default="{ row }">
+            {{ dictConvert('UserStatusCode', row.status) || '无' }}
+          </template>
+        </vxe-column>
+        <vxe-column fixed="right" width="170" :showOverflow="false" title="操作">
+          <template #default="{ row }">
+            <a href="javascript:" @click="show(row)">查看</a>
+            <a-divider type="vertical" />
+            <a href="javascript:" @click="edit(row)">编辑</a>
+            <a-divider type="vertical" />
+            <a-dropdown>
+              <a> 更多 <icon icon="ant-design:down-outlined" :size="12" /> </a>
+              <template #overlay>
+                <a-menu>
+                  <a-menu-item>
+                    <a-link @click="assignRoles(row)">角色分配</a-link>
+                  </a-menu-item>
+                  <a-menu-item>
+                    <a-link @click="assignDept(row)">部门分配</a-link>
+                  </a-menu-item>
+                  <a-menu-item>
+                    <a-link @click="assignDataScope(row)">数据角色分配</a-link>
+                  </a-menu-item>
+                  <a-menu-item>
+                    <a-link @click="resetPwd(row)">重置密码</a-link>
+                  </a-menu-item>
+                  <a-menu-item v-if="[1, 3].includes(row.status)">
+                    <a-link v-if="row.status === 1" @click="lockUserConfirm(row.id, true)"
+                      >封禁账号</a-link
+                    >
+                    <a-link v-if="row.status === 3" @click="lockUserConfirm(row.id, false)"
+                      >解锁账号</a-link
+                    >
+                  </a-menu-item>
+                </a-menu>
+              </template>
+            </a-dropdown>
+          </template>
+        </vxe-column>
+      </vxe-table>
+      <vxe-pager
+        size="medium"
+        :loading="loading"
+        :current-page="pagination.current"
+        :page-size="pagination.size"
+        :total="pagination.total"
+        @page-change="handleTableChange"
+      />
+      <UserAdd ref="userAdd" @ok="queryPage" />
+      <UserEdit ref="userEdit" @ok="queryPage" />
+      <UserShow ref="userShow" />
+    </div>
+  </div>
+</template>
+
+<script lang="ts" setup>
+  import BQuery from '/@/components/Bootx/Query/BQuery.vue'
+  import useTablePage from '@/hooks/bootx/useTablePage'
+  import { useMessage } from '@/hooks/web/useMessage'
+  import { onMounted, ref } from 'vue'
+  import { QueryField, STRING } from '@/components/Bootx/Query/Query'
+  import { VxeTableInstance, VxeToolbarInstance } from 'vxe-table'
+  import { banUser, banUserBatch, page, unlockUser, unlockUserBatch } from './User.api'
+  import { useDict } from '@/hooks/bootx/useDict'
+  import { Icon } from '@/components/Icon'
+  import UserAdd from './UserAdd.vue'
+  import UserEdit from './UserEdit.vue'
+  import UserShow from './UserShow.vue'
+  import ALink from "@/components/Link/Link.vue";
+
+  // 使用hooks
+  const {
+    handleTableChange,
+    pageQueryResHandel,
+    resetQueryParams,
+    pagination,
+    pages,
+    model,
+    loading,
+    batchOperateFlag,
+  } = useTablePage(queryPage)
+  const { createConfirm } = useMessage()
+  const { dictConvert } = useDict()
+
+  // 查询条件
+  const fields = [
+    { field: 'account', type: STRING, name: '账号', placeholder: '请输入要查询的账号' },
+    { field: 'name', type: STRING, name: '姓名', placeholder: '请输入要查询的姓名' },
+  ] as QueryField[]
+  const xTable = ref<VxeTableInstance>()
+  const xToolbar = ref<VxeToolbarInstance>()
+  let userAdd = ref<any>()
+  let userEdit = ref<any>()
+  let userShow = ref<any>()
+  let userRoleAssign = ref<any>()
+  let userRoleAssignBatch = ref<any>()
+  let userDataScopeAssign = ref<any>()
+  let userDataScopeAssignBatch = ref<any>()
+  let userDeptAssign = ref<any>()
+  let userDeptAssignBatch = ref<any>()
+  let userResetPwd = ref<any>()
+  let userResetPwdBatch = ref<any>()
+
+  onMounted(() => {
+    vxeBind()
+    queryPage()
+  })
+  function vxeBind() {
+    xTable.value?.connect(xToolbar.value as VxeToolbarInstance)
+  }
+
+  // 分页查询
+  function queryPage() {
+    loading.value = true
+    page({
+      ...model.queryParam,
+      ...pages,
+    }).then(({ data }) => {
+      pageQueryResHandel(data)
+    })
+    return Promise.resolve()
+  }
+  /**
+   * 选中全部
+   */
+  function selectAllEvent() {
+    const records = xTable.value?.getCheckboxRecords()
+    batchOperateFlag.value = !!records?.length
+  }
+  /**
+   * 选中事件
+   */
+  function selectChangeEvent() {
+    const records = xTable.value?.getCheckboxRecords()
+    batchOperateFlag.value = !!records?.length
+  }
+  /**
+   * 锁定/解锁用户
+   * @param userId 用户id
+   * @param type true 锁定, false 解锁
+   */
+  function lockUserConfirm(userId, type: boolean) {
+    createConfirm({
+      iconType: 'warning',
+      title: '警告',
+      content: type ? '是否封禁选中的用户' : '是否解锁选中的用户',
+      onOk: async () => {
+        if (type) {
+          await banUser(userId)
+        } else {
+          await unlockUser(userId)
+        }
+        queryPage()
+      },
+    })
+  }
+  /**
+   * 批量锁定/解锁用户
+   * @param type true 锁定, false 解锁
+   */
+  function lockUserConfirmBatch(type) {
+    const userIds = xTable.value?.getCheckboxRecords().map((o) => o.id)
+    createConfirm({
+      iconType: 'warning',
+      title: '警告',
+      content: type ? '是否锁定选中的用户' : '是否解锁选中的用户',
+      onOk: async () => {
+        if (type) {
+          await banUserBatch(userIds)
+        } else {
+          await unlockUserBatch(userIds)
+        }
+        queryPage()
+      },
+    })
+  }
+  // 分配角色
+  function assignRoles(record) {
+    userRoleAssign.value.init(record)
+  }
+  // 批量分配角色
+  function assignRolesBatch() {
+    const userIds = xTable.value?.getCheckboxRecords().map((o) => o.id)
+    userRoleAssignBatch.value.init(userIds)
+  }
+  // 分配数据权限
+  function assignDataScope(record) {
+    userDataScopeAssign.value.init(record)
+  }
+  // 批量分配数据权限
+  function assignDataScopeBatch() {
+    const userIds = xTable.value?.getCheckboxRecords().map((o) => o.id)
+    userDataScopeAssignBatch.value.init(userIds)
+  }
+  // 分配部门
+  function assignDept(record) {
+    userDeptAssign.value.init(record.id)
+  }
+  // 批量分配部门
+  function assignDeptBatch() {
+    const userIds = xTable.value?.getCheckboxRecords().map((o) => o.id)
+    userDeptAssignBatch.value.init(userIds)
+  }
+  function add() {
+    userAdd.value.init()
+  }
+  /**
+   * 查看信息
+   */
+  function show(record) {
+    userShow.value.init(record.id)
+  }
+  /**
+   * 信息编辑
+   */
+  function edit(record) {
+    userEdit.value.init(record.id)
+  }
+  /**
+   * 重置密码
+   */
+  function resetPwd(record) {
+    userResetPwd.value.init(record.id)
+  }
+  /**
+   * 重置密码
+   */
+  function resetPwdBatch() {
+    const userIds = xTable.value?.getCheckboxRecords().map((o) => o.id)
+    userResetPwdBatch.value.init(userIds)
+  }
+</script>
+
+<style scoped></style>
diff --git a/src/views/iam/user/UserShow.vue b/src/views/iam/user/UserShow.vue
new file mode 100644
index 00000000..9f750a96
--- /dev/null
+++ b/src/views/iam/user/UserShow.vue
@@ -0,0 +1,85 @@
+<template>
+  <basic-drawer
+    show-footer
+    title="用户信息"
+    v-bind="$attrs"
+    :width="modalWidth"
+    :open="visible"
+    :mask-closable="false"
+    @close="handleCancel"
+  >
+    <a-spin :spinning="confirmLoading">
+      <a-form
+        shio
+        class="small-from-item"
+        ref="formRef"
+        :model="form"
+        :label-col="labelCol"
+        :wrapper-col="wrapperCol"
+      >
+        <a-form-item label="用户账号" name="account">
+          <a-input disabled v-model:value="form.account" />
+        </a-form-item>
+        <a-form-item label="用户名称" name="name">
+          <a-input disabled v-model:value="form.name" />
+        </a-form-item>
+        <a-form-item label="手机号" name="phone">
+          <a-input disabled v-model:value="form.phone" />
+        </a-form-item>
+        <a-form-item label="邮箱">
+          <a-input disabled v-model:value="form.email" />
+        </a-form-item>
+        <a-form-item label="管理员">
+          <a-tag v-if="form.administrator" color="green">是</a-tag>
+          <a-tag v-else>否</a-tag>
+        </a-form-item>
+        <a-form-item label="用户状态">
+          <a-tag>{{ dictConvert('UserStatusCode', form.status) || '无' }}</a-tag>
+        </a-form-item>
+        <a-form-item label="角色列表">
+          <a-tag color="green" v-for="o in roles" :key="o.id">{{ o.name }}</a-tag>
+        </a-form-item>
+      </a-form>
+    </a-spin>
+    <template #footer>
+      <a-button key="cancel" @click="handleCancel">取消</a-button>
+    </template>
+  </basic-drawer>
+</template>
+
+<script lang="ts" setup>
+  import useFormEdit from '@/hooks/bootx/useFormEdit'
+  import BasicDrawer from '/@/components/Drawer/src/BasicDrawer.vue'
+  import { get, UserInfo } from './User.api'
+  import { getRoles } from './UserAssign.api'
+  import { useDict } from '@/hooks/bootx/useDict'
+  import { ref } from 'vue'
+  import { Role } from '@/views/iam/role/Role.api'
+
+  const { handleCancel, labelCol, wrapperCol, modalWidth, confirmLoading, visible } = useFormEdit()
+  const { dictConvert } = useDict()
+
+  let form = ref<UserInfo>({
+    name: '',
+    account: '',
+  })
+  let roles = ref<Role[]>([])
+
+  async function init(id) {
+    confirmLoading.value = true
+    visible.value = true
+
+    Promise.all([
+      get(id).then((res) => {
+        form.value = res.data
+      }),
+      getRoles(id).then((res) => {
+        roles.value = res.data
+      }),
+    ]).then(() => (confirmLoading.value = false))
+  }
+
+  defineExpose({ init })
+</script>
+
+<style scoped></style>
diff --git a/types/store.d.ts b/types/store.d.ts
index 721d9533..c9d42c83 100644
--- a/types/store.d.ts
+++ b/types/store.d.ts
@@ -33,7 +33,7 @@ export interface UserInfo {
   // 名称
   name: string
   // 账号
-  username: string
+  account: string
   // 头像图片id
   avatar: string
 }