feat：增加 user 用户的分配角色、重置密码

apps/web-antd/src/views/system/user/index.vue

@@ -1,26 +1,37 @@
 <script lang="ts" setup>
-import type {
-  OnActionClickParams,
-  VxeTableGridOptions,
-} from '#/adapter/vxe-table';
+import type { OnActionClickParams, VxeTableGridOptions } from '#/adapter/vxe-table';
 import type { SystemUserApi } from '#/api/system/user';
 
 import { Page, useVbenModal } from '@vben/common-ui';
-import { Button, message } from 'ant-design-vue';
+import { Button, message, Modal } from 'ant-design-vue';
 import { Plus, Download } from '@vben/icons';
 import Form from './modules/form.vue';
+import ResetPasswordForm from './modules/reset-password-form.vue';
+import AssignRoleForm from './modules/assign-role-form.vue';
 
 import { $t } from '#/locales';
 import { useVbenVxeGrid } from '#/adapter/vxe-table';
-import { getUserPage, deleteUser, exportUser } from '#/api/system/user';
-import { useGridColumns, useGridFormSchema } from './data';
+import { getUserPage, deleteUser, exportUser, updateUserStatus } from '#/api/system/user';
 import { downloadByData } from '#/utils/download';
+import { DICT_TYPE, getDictLabel } from '#/utils/dict';
+
+import { useGridColumns, useGridFormSchema } from './data';
 
 const [FormModal, formModalApi] = useVbenModal({
   connectedComponent: Form,
   destroyOnClose: true,
 });
 
+const [ResetPasswordModal, resetPasswordModalApi] = useVbenModal({
+  connectedComponent: ResetPasswordForm,
+  destroyOnClose: true,
+});
+
+const [AssignRoleModal, assignRoleModalApi] = useVbenModal({
+  connectedComponent: AssignRoleForm,
+  destroyOnClose: true,
+});
+
 /** 刷新表格 */
 function onRefresh() {
   gridApi.query();
@@ -61,6 +72,45 @@ async function onDelete(row: SystemUserApi.SystemUser) {
   }
 }
 
+/** 重置密码 */
+function onResetPassword(row: SystemUserApi.SystemUser) {
+  resetPasswordModalApi.setData(row).open();
+}
+
+/** 分配角色 */
+function onAssignRole(row: SystemUserApi.SystemUser) {
+  assignRoleModalApi.setData(row).open();
+}
+
+// TODO @芋艿：后续怎么简化一下 confirm 的实现。
+/** 更新用户状态 */
+async function onStatusChange(newStatus: number, row: SystemUserApi.SystemUser): Promise<boolean | undefined> {
+  return new Promise((resolve, reject) => {
+    Modal.confirm({
+      title: '切换状态',
+      content: `你要将${row.username}的状态切换为【${getDictLabel(DICT_TYPE.COMMON_STATUS, newStatus)}】吗？`,
+      onCancel() {
+        reject(new Error('已取消'));
+      },
+      onOk() {
+        // 更新用户状态
+        updateUserStatus(row.id as number, newStatus)
+          .then(() => {
+            // 提示并返回成功
+            message.success({
+              content: $t('ui.actionMessage.operationSuccess'),
+              key: 'action_process_msg',
+            });
+            resolve(true);
+          })
+          .catch((error) => {
+            reject(error);
+          });
+      },
+    });
+  });
+}
+
 /** 表格操作按钮的回调函数 */
 function onActionClick({
   code,
@@ -75,6 +125,14 @@ function onActionClick({
       onDelete(row);
       break;
     }
+    case 'reset-password': {
+      onResetPassword(row);
+      break;
+    }
+    case 'assign-role': {
+      onAssignRole(row);
+      break;
+    }
   }
 }
 
@@ -83,7 +141,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
     schema: useGridFormSchema(),
   },
   gridOptions: {
-    columns: useGridColumns(onActionClick),
+    columns: useGridColumns(onActionClick, onStatusChange),
     height: 'auto',
     keepSource: true,
     proxyConfig: {
@@ -111,6 +169,8 @@ const [Grid, gridApi] = useVbenVxeGrid({
 <template>
   <Page auto-content-height>
     <FormModal @success="onRefresh" />
+    <ResetPasswordModal @success="onRefresh" />
+    <AssignRoleModal @success="onRefresh" />
     <Grid table-title="用户列表">
       <template #toolbar-tools>
         <Button type="primary" @click="onCreate">