Browse Source

feat: 修改框架

DESKTOP-USV654P\pc 6 tháng trước cách đây
mục cha
commit
ff76b41cc4
42 tập tin đã thay đổi với 196 bổ sung196 xóa
  1. 1 1
      apps/web-baicai/.env.development
  2. 7 6
      apps/web-baicai/src/components/form/components/bc-popup.vue
  3. 3 2
      apps/web-baicai/src/components/form/components/bc-popup/bc-popup-modal-ignore.vue
  4. 10 9
      apps/web-baicai/src/components/form/components/input-code.vue
  5. 1 0
      apps/web-baicai/src/components/form/components/input-code/input-code-modal-ignore.vue
  6. 3 1
      apps/web-baicai/src/components/select-card/src/select-card.vue
  7. 1 1
      apps/web-baicai/src/views/form/design/components/tools/index.vue
  8. 4 4
      apps/web-baicai/src/views/system/config/components/edit.vue
  9. 4 4
      apps/web-baicai/src/views/system/config/index.vue
  10. 4 4
      apps/web-baicai/src/views/system/department/components/edit.vue
  11. 5 5
      apps/web-baicai/src/views/system/department/index.vue
  12. 6 4
      apps/web-baicai/src/views/system/design/database/components/edit.vue
  13. 2 4
      apps/web-baicai/src/views/system/design/database/components/editColumn.vue
  14. 5 5
      apps/web-baicai/src/views/system/design/database/index.vue
  15. 5 4
      apps/web-baicai/src/views/system/design/query/components/edit.vue
  16. 1 0
      apps/web-baicai/src/views/system/design/query/components/view.vue
  17. 5 5
      apps/web-baicai/src/views/system/design/query/index.vue
  18. 5 4
      apps/web-baicai/src/views/system/design/table/components/edit.vue
  19. 2 4
      apps/web-baicai/src/views/system/design/table/components/preview.vue
  20. 6 6
      apps/web-baicai/src/views/system/design/table/index.vue
  21. 3 4
      apps/web-baicai/src/views/system/dict/item/edit.vue
  22. 5 5
      apps/web-baicai/src/views/system/dict/item/index.vue
  23. 2 4
      apps/web-baicai/src/views/system/dict/type/edit.vue
  24. 5 5
      apps/web-baicai/src/views/system/dict/type/index.vue
  25. 1 0
      apps/web-baicai/src/views/system/log/components/view.vue
  26. 11 9
      apps/web-baicai/src/views/system/log/difference/index.vue
  27. 12 10
      apps/web-baicai/src/views/system/log/exception/index.vue
  28. 12 10
      apps/web-baicai/src/views/system/log/operate/index.vue
  29. 11 9
      apps/web-baicai/src/views/system/log/visit/index.vue
  30. 2 4
      apps/web-baicai/src/views/system/menu/components/edit.vue
  31. 3 4
      apps/web-baicai/src/views/system/menu/components/editMenu.vue
  32. 4 5
      apps/web-baicai/src/views/system/menu/components/grant.vue
  33. 4 4
      apps/web-baicai/src/views/system/menu/index.vue
  34. 3 2
      apps/web-baicai/src/views/system/personal/components/update-avatar.vue
  35. 3 4
      apps/web-baicai/src/views/system/post/components/edit.vue
  36. 4 4
      apps/web-baicai/src/views/system/post/index.vue
  37. 2 4
      apps/web-baicai/src/views/system/role/components/edit.vue
  38. 5 9
      apps/web-baicai/src/views/system/role/index.vue
  39. 3 4
      apps/web-baicai/src/views/system/tenant/components/edit.vue
  40. 5 5
      apps/web-baicai/src/views/system/tenant/index.vue
  41. 3 4
      apps/web-baicai/src/views/system/user/components/edit.vue
  42. 13 14
      apps/web-baicai/src/views/system/user/index.vue

+ 1 - 1
apps/web-baicai/.env.development

@@ -4,7 +4,7 @@ VITE_PORT=5555
 VITE_BASE=/
 
 # 接口地址
-VITE_GLOB_API_URL=http://localhost:8000/api
+VITE_GLOB_API_URL=https://localhost:5001/api
 
 # 是否开启 Nitro Mock服务,true 为开启,false 为关闭
 VITE_NITRO_MOCK=true

+ 7 - 6
apps/web-baicai/src/components/form/components/bc-popup.vue

@@ -58,11 +58,12 @@ const displays = computed(() => {
 });
 
 const handleSelect = () => {
-  formQueryApi.setData({
-    multiple: props.multiple,
-    baseData: { name: props.placeholder, code: props.api },
-  });
-  formQueryApi.open();
+  formQueryApi
+    .setData({
+      multiple: props.multiple,
+      baseData: { name: props.placeholder, code: props.api },
+    })
+    .open();
 };
 
 const handleSuccess = (successData: any) => {
@@ -120,7 +121,7 @@ watch(
 
 <template>
   <div class="bc-popup w-full">
-    <FormQueryModal :close-on-click-modal="false" @success="handleSuccess" />
+    <FormQueryModal @success="handleSuccess" />
     <div
       :class="
         cn(

+ 3 - 2
apps/web-baicai/src/components/form/components/bc-popup/bc-popup-modal-ignore.vue

@@ -1,7 +1,7 @@
 <script lang="ts" setup>
 import { reactive, ref } from 'vue';
 
-import { useVbenModal } from '@vben/common-ui';
+import { alert, useVbenModal } from '@vben/common-ui';
 import { isEmpty } from '@vben/utils';
 
 import { Button, message } from 'ant-design-vue';
@@ -27,13 +27,14 @@ const tablePageRef = ref();
 const [Modal, { close, setState, getData }] = useVbenModal({
   draggable: true,
   fullscreen: false,
+  closeOnClickModal: false,
   onConfirm: async () => {
     try {
       setState({ confirmLoading: true });
 
       const selectedData = tablePageRef.value.getSelectRow();
       if (isEmpty(selectedData)) {
-        message.warning('请选择数据');
+        alert({ content: '请选择数据', icon: 'warning' });
         return;
       }
 

+ 10 - 9
apps/web-baicai/src/components/form/components/input-code.vue

@@ -51,20 +51,21 @@ const handleSuccess = (scriptCode: any) => {
 };
 
 const handleInput = () => {
-  inputCodeApi.setData({
-    baseData: {
-      scriptCode: modelValue.value,
-      name: '验证规则',
-      // language: 'javascript',
-    },
-  });
-  inputCodeApi.open();
+  inputCodeApi
+    .setData({
+      baseData: {
+        scriptCode: modelValue.value,
+        name: '验证规则',
+        // language: 'javascript',
+      },
+    })
+    .open();
 };
 </script>
 
 <template>
   <div class="w-full">
-    <InputCodeModal :close-on-click-modal="false" @success="handleSuccess" />
+    <InputCodeModal @success="handleSuccess" />
     <Input v-model:value="state.value" class="w-full">
       <template #addonAfter>
         <Icon icon="proicons:nodejs" @click="handleInput" />

+ 1 - 0
apps/web-baicai/src/components/form/components/input-code/input-code-modal-ignore.vue

@@ -77,6 +77,7 @@ const initMonacoEditor = () => {
 const [Modal, { close, setState, getData }] = useVbenModal({
   draggable: true,
   fullscreen: false,
+  closeOnClickModal: false,
   onClosed: () => {
     monacoEditor.dispose();
     monacoEditor = null;

+ 3 - 1
apps/web-baicai/src/components/select-card/src/select-card.vue

@@ -145,6 +145,8 @@ const [Form, { resetForm }] = useVbenForm({
 });
 
 const [Modal, { close, setState, getData }] = useVbenModal({
+  closeOnClickModal: false,
+  fullscreenButton: false,
   onConfirm: async () => {
     try {
       close();
@@ -221,7 +223,7 @@ const handelPageChange = async (pageIndex: number) => {
 </script>
 
 <template>
-  <Modal :title="`选择${title}`" class="w-[1000px]" :fullscreen-button="false">
+  <Modal :title="`选择${title}`" class="w-[1000px]">
     <div class="relative h-full p-4">
       <div class="card-box text-card-foreground border-border w-full border">
         <div class="flex flex-col gap-y-1.5 border-b p-2">

+ 1 - 1
apps/web-baicai/src/views/form/design/components/tools/index.vue

@@ -72,7 +72,7 @@ const handleSave = () => {
 </script>
 <template>
   <div class="flex items-center justify-between border-b px-4">
-    <InputCodeModal :close-on-click-modal="false" @success="handleSuccess" />
+    <InputCodeModal @success="handleSuccess" />
     <h3 class="text-lg">设计区域</h3>
     <div class="flex flex-wrap gap-3">
       <Icon

+ 4 - 4
apps/web-baicai/src/views/system/config/components/edit.vue

@@ -1,9 +1,7 @@
 <script lang="ts" setup>
 import { computed, ref, unref } from 'vue';
 
-import { useVbenModal } from '@vben/common-ui';
-
-import { message } from 'ant-design-vue';
+import { alert, useVbenModal } from '@vben/common-ui';
 
 import { useFormOptions, useVbenForm } from '#/adapter';
 import { ConfigApi } from '#/api';
@@ -26,6 +24,7 @@ const [Form, { validate, setValues, getValues }] = useVbenForm(
 const [Modal, { close, setState, getData, lock, unlock }] = useVbenModal({
   fullscreenButton: false,
   draggable: true,
+  closeOnClickModal: false,
   onCancel() {
     close();
   },
@@ -41,7 +40,8 @@ const [Modal, { close, setState, getData, lock, unlock }] = useVbenModal({
       await (unref(isUpdate)
         ? ConfigApi.editDetail(postParams as ConfigApi.RecordItem)
         : ConfigApi.addDetail(postParams as ConfigApi.BasicRecordItem));
-      message.success('操作成功');
+
+      alert('操作成功');
 
       emit('success');
       close();

+ 4 - 4
apps/web-baicai/src/views/system/config/index.vue

@@ -1,9 +1,9 @@
 <script lang="ts" setup>
 import type { OnActionClickParams, VxeTableGridOptions } from '#/adapter';
 
-import { Page, useVbenModal } from '@vben/common-ui';
+import { alert, Page, useVbenModal } from '@vben/common-ui';
 
-import { Button, message } from 'ant-design-vue';
+import { Button } from 'ant-design-vue';
 
 import { useTableGridOptions, useVbenVxeGrid } from '#/adapter';
 import { ConfigApi } from '#/api';
@@ -21,7 +21,7 @@ const handelSuccess = () => {
 };
 const handleDelete = async (id: number) => {
   await ConfigApi.deleteDetail(id);
-  message.success('数据删除成功');
+  alert('数据删除成功');
   handelSuccess();
 };
 
@@ -74,7 +74,7 @@ const [Grid, { reload }] = useVbenVxeGrid(
 
 <template>
   <Page auto-content-height>
-    <FormEditModal :close-on-click-modal="false" @success="handelSuccess" />
+    <FormEditModal @success="handelSuccess" />
     <Grid>
       <template #toolbar-tools>
         <Button

+ 4 - 4
apps/web-baicai/src/views/system/department/components/edit.vue

@@ -1,9 +1,7 @@
 <script lang="ts" setup>
 import { computed, ref, unref } from 'vue';
 
-import { useVbenModal } from '@vben/common-ui';
-
-import { message } from 'ant-design-vue';
+import { alert, useVbenModal } from '@vben/common-ui';
 
 import { useFormOptions, useVbenForm } from '#/adapter';
 import { DepartmentApi } from '#/api';
@@ -26,6 +24,7 @@ const [Form, { validate, setValues, getValues }] = useVbenForm(
 const [Modal, { close, setState, getData, lock, unlock }] = useVbenModal({
   fullscreenButton: false,
   draggable: true,
+  closeOnClickModal: false,
   onCancel() {
     close();
   },
@@ -41,7 +40,8 @@ const [Modal, { close, setState, getData, lock, unlock }] = useVbenModal({
       await (unref(isUpdate)
         ? DepartmentApi.editDetail(postParams as DepartmentApi.RecordItem)
         : DepartmentApi.addDetail(postParams as DepartmentApi.BasicRecordItem));
-      message.success('操作成功');
+
+      alert('操作成功');
 
       emit('success');
       close();

+ 5 - 5
apps/web-baicai/src/views/system/department/index.vue

@@ -1,9 +1,9 @@
 <script lang="ts" setup>
 import type { OnActionClickParams, VxeTableGridOptions } from '#/adapter';
 
-import { Page, useVbenModal } from '@vben/common-ui';
+import { alert, Page, useVbenModal } from '@vben/common-ui';
 
-import { Button, message } from 'ant-design-vue';
+import { Button } from 'ant-design-vue';
 
 import { useTableGridOptions, useVbenVxeGrid } from '#/adapter';
 import { DepartmentApi } from '#/api';
@@ -20,8 +20,8 @@ const handelSuccess = () => {
 
 const handleDelete = async (id: number) => {
   await DepartmentApi.deleteDetail(id);
-  message.success('数据删除成功');
-  reload();
+  alert('数据删除成功');
+  handelSuccess();
 };
 
 const handleEdit = (record: any, isUpdate: boolean) => {
@@ -79,7 +79,7 @@ const [Grid, { reload }] = useVbenVxeGrid(
 
 <template>
   <Page auto-content-height>
-    <FormEditModal :close-on-click-modal="false" @success="handelSuccess" />
+    <FormEditModal @success="handelSuccess" />
     <Grid>
       <template #toolbar-tools>
         <Button

+ 6 - 4
apps/web-baicai/src/views/system/design/database/components/edit.vue

@@ -3,9 +3,9 @@ import type { OnActionClickParams, VxeTableGridOptions } from '#/adapter';
 
 import { computed, ref, unref } from 'vue';
 
-import { useVbenModal } from '@vben/common-ui';
+import { alert, useVbenModal } from '@vben/common-ui';
 
-import { Button, message } from 'ant-design-vue';
+import { Button } from 'ant-design-vue';
 
 import {
   useFormOptions,
@@ -40,6 +40,7 @@ const [Modal, { close, setState, getData, lock, unlock }] = useVbenModal({
   // fullscreenButton: true,
   fullscreen: true,
   draggable: true,
+  closeOnClickModal: false,
   onCancel() {
     close();
   },
@@ -58,7 +59,8 @@ const [Modal, { close, setState, getData, lock, unlock }] = useVbenModal({
       await (unref(isUpdate)
         ? DatabaseApi.editDetail(postParams as DatabaseApi.RecordItem)
         : DatabaseApi.addDetail(postParams as DatabaseApi.BasicRecordItem));
-      message.success('操作成功');
+
+      alert('操作成功');
 
       emit('success');
       close();
@@ -180,7 +182,7 @@ const [Grid, gridApi] = useVbenVxeGrid(
 </script>
 <template>
   <Modal class="h-[800px] w-[1000px]" :title="getTitle">
-    <FormEditModal :close-on-click-modal="false" @success="handelSuccess" />
+    <FormEditModal @success="handelSuccess" />
     <div class="h-full">
       <div class="h-[178px]">
         <Form />

+ 2 - 4
apps/web-baicai/src/views/system/design/database/components/editColumn.vue

@@ -1,9 +1,7 @@
 <script lang="ts" setup>
 import { computed, ref, unref } from 'vue';
 
-import { useVbenModal } from '@vben/common-ui';
-
-import { message } from 'ant-design-vue';
+import { alert, useVbenModal } from '@vben/common-ui';
 
 import { useFormOptions, useVbenForm } from '#/adapter';
 
@@ -43,7 +41,7 @@ const [Modal, { close, setState, getData, lock, unlock }] = useVbenModal({
       });
       close();
     } catch {
-      message.error('操作失败');
+      alert({ content: '操作失败', icon: 'error' });
     } finally {
       unlock();
     }

+ 5 - 5
apps/web-baicai/src/views/system/design/database/index.vue

@@ -2,9 +2,9 @@
 import type { OnActionClickParams, VxeTableGridOptions } from '#/adapter';
 
 import { useAccess } from '@vben/access';
-import { Page, useVbenModal } from '@vben/common-ui';
+import { alert, Page, useVbenModal } from '@vben/common-ui';
 
-import { Button, message } from 'ant-design-vue';
+import { Button } from 'ant-design-vue';
 
 import { useTableGridOptions, useVbenVxeGrid } from '#/adapter';
 import { DatabaseApi } from '#/api';
@@ -21,13 +21,13 @@ const [FormEditModal, formEditApi] = useVbenModal({
 
 const handleDelete = async (id: number) => {
   await DatabaseApi.deleteDetail(id);
-  message.success('数据删除成功');
+  alert('数据删除成功');
   reload();
 };
 
 const handelCreate = async (id: number) => {
   await DatabaseApi.getCreate(id);
-  message.success('创建表成功');
+  alert('创建表成功');
   reload();
 };
 
@@ -89,7 +89,7 @@ const [Grid, { reload }] = useVbenVxeGrid(
 
 <template>
   <Page auto-content-height>
-    <FormEditModal :close-on-click-modal="false" @success="handelSuccess" />
+    <FormEditModal @success="handelSuccess" />
     <Grid>
       <template #toolbar-tools>
         <Button

+ 5 - 4
apps/web-baicai/src/views/system/design/query/components/edit.vue

@@ -3,9 +3,9 @@ import type { BasicOptionResult } from '#/api/model';
 
 import { computed, reactive, ref, unref } from 'vue';
 
-import { useVbenModal } from '@vben/common-ui';
+import { alert, useVbenModal } from '@vben/common-ui';
 
-import { message, Steps } from 'ant-design-vue';
+import { Steps } from 'ant-design-vue';
 
 import { QueryApi } from '#/api';
 
@@ -42,6 +42,7 @@ const [Modal, { close, getData, setState }] = useVbenModal({
   draggable: true,
   cancelText: '上一步',
   confirmText: '下一步',
+  closeOnClickModal: false,
   onCancel() {
     if (state.stepIndex === 0) {
       close();
@@ -83,13 +84,13 @@ const [Modal, { close, getData, setState }] = useVbenModal({
         await (unref(isUpdate)
           ? QueryApi.editDetail(postParams as QueryApi.RecordItem)
           : QueryApi.addDetail(postParams as QueryApi.BasicRecordItem));
-        message.success('操作成功');
+        alert('操作成功');
 
         close();
         emit('success');
       }
     } catch (error: any) {
-      message.error(error?.message || '操作失败');
+      alert({ content: error?.message || '操作失败', icon: 'error' });
     } finally {
       setState({ confirmLoading: false });
     }

+ 1 - 0
apps/web-baicai/src/views/system/design/query/components/view.vue

@@ -43,6 +43,7 @@ const [Modal, { getData, setState }] = useVbenModal({
   fullscreenButton: true,
   draggable: true,
   footer: false,
+  closeOnClickModal: false,
   onOpenChange: async (isOpen: boolean) => {
     if (isOpen) {
       setState({ loading: true });

+ 5 - 5
apps/web-baicai/src/views/system/design/query/index.vue

@@ -1,9 +1,9 @@
 <script lang="ts" setup>
 import type { OnActionClickParams, VxeTableGridOptions } from '#/adapter';
 
-import { Page, useVbenModal } from '@vben/common-ui';
+import { alert, Page, useVbenModal } from '@vben/common-ui';
 
-import { Button, message } from 'ant-design-vue';
+import { Button } from 'ant-design-vue';
 
 import { useTableGridOptions, useVbenVxeGrid } from '#/adapter';
 import { QueryApi } from '#/api';
@@ -21,7 +21,7 @@ const [FormViewModal, formViewApi] = useVbenModal({
 });
 const handleDelete = async (id: number) => {
   await QueryApi.deleteDetail(id);
-  message.success('数据删除成功');
+  alert('数据删除成功');
   reload();
 };
 
@@ -87,8 +87,8 @@ const [Grid, { reload }] = useVbenVxeGrid(
 
 <template>
   <Page auto-content-height>
-    <FormEditModal :close-on-click-modal="false" @success="handelSuccess" />
-    <FormViewModal :close-on-click-modal="false" />
+    <FormEditModal @success="handelSuccess" />
+    <FormViewModal />
     <Grid>
       <template #toolbar-tools>
         <Button

+ 5 - 4
apps/web-baicai/src/views/system/design/table/components/edit.vue

@@ -3,9 +3,9 @@ import type { BasicOptionResult } from '#/api/model';
 
 import { computed, provide, reactive, ref, unref } from 'vue';
 
-import { useVbenModal } from '@vben/common-ui';
+import { alert, useVbenModal } from '@vben/common-ui';
 
-import { message, Steps } from 'ant-design-vue';
+import { Steps } from 'ant-design-vue';
 
 import { QueryApi, TableApi } from '#/api';
 
@@ -51,6 +51,7 @@ const [Modal, { close, getData, setState }] = useVbenModal({
   draggable: true,
   cancelText: '上一步',
   confirmText: '下一步',
+  closeOnClickModal: false,
   onCancel() {
     if (state.stepIndex === 0) {
       close();
@@ -121,13 +122,13 @@ const [Modal, { close, getData, setState }] = useVbenModal({
         await (unref(isUpdate)
           ? TableApi.editDetail(postParams as TableApi.RecordItem)
           : TableApi.addDetail(postParams as TableApi.BasicRecordItem));
-        message.success('操作成功');
+        alert('操作成功');
 
         close();
         emit('success');
       }
     } catch (error: any) {
-      message.error(error?.message || '操作失败');
+      alert({ content: error?.message || '操作失败', icon: 'error' });
     } finally {
       setState({ confirmLoading: false });
     }

+ 2 - 4
apps/web-baicai/src/views/system/design/table/components/preview.vue

@@ -1,9 +1,7 @@
 <script lang="ts" setup>
 import { ref } from 'vue';
 
-import { useVbenModal } from '@vben/common-ui';
-
-import { message } from 'ant-design-vue';
+import { alert, useVbenModal } from '@vben/common-ui';
 
 import TablePage from '#/views/system/design/table/components/page.vue';
 
@@ -23,7 +21,7 @@ const [Modal, { close, setState, getData }] = useVbenModal({
       close();
       emit('success');
     } catch {
-      message.error('操作失败');
+      alert({ content: '操作失败', icon: 'error' });
     } finally {
       setState({ confirmLoading: false });
     }

+ 6 - 6
apps/web-baicai/src/views/system/design/table/index.vue

@@ -3,9 +3,9 @@ import type { OnActionClickParams, VxeTableGridOptions } from '#/adapter';
 
 import { useRouter } from 'vue-router';
 
-import { Page, useVbenModal } from '@vben/common-ui';
+import { alert, Page, useVbenModal } from '@vben/common-ui';
 
-import { Button, message } from 'ant-design-vue';
+import { Button } from 'ant-design-vue';
 
 import { useTableGridOptions, useVbenVxeGrid } from '#/adapter';
 import { TableApi } from '#/api';
@@ -31,7 +31,7 @@ const [FormPreviewModal, formPreviewApi] = useVbenModal({
 
 const handleDelete = async (id: number) => {
   await TableApi.deleteDetail(id);
-  message.success('数据删除成功');
+  alert('数据删除成功');
   reload();
 };
 
@@ -127,9 +127,9 @@ const [Grid, { reload }] = useVbenVxeGrid(
 
 <template>
   <Page auto-content-height>
-    <FormEditModal :close-on-click-modal="false" @success="handelSuccess" />
-    <FormMenuEditModal :close-on-click-modal="false" @success="handelSuccess" />
-    <FormPreviewModal :close-on-click-modal="false" />
+    <FormEditModal @success="handelSuccess" />
+    <FormMenuEditModal @success="handelSuccess" />
+    <FormPreviewModal />
     <Grid>
       <template #toolbar-tools>
         <Button

+ 3 - 4
apps/web-baicai/src/views/system/dict/item/edit.vue

@@ -1,9 +1,7 @@
 <script lang="ts" setup>
 import { computed, ref, unref } from 'vue';
 
-import { useVbenModal } from '@vben/common-ui';
-
-import { message } from 'ant-design-vue';
+import { alert, useVbenModal } from '@vben/common-ui';
 
 import { useFormOptions, useVbenForm } from '#/adapter';
 import { DictionaryApi } from '#/api';
@@ -42,7 +40,8 @@ const [Modal, { close, setState, getData, lock, unlock }] = useVbenModal({
         : DictionaryApi.addItemDetail(
             postParams as DictionaryApi.BasicRecordItem,
           ));
-      message.success('操作成功');
+
+      alert('操作成功');
 
       emit('success');
       close();

+ 5 - 5
apps/web-baicai/src/views/system/dict/item/index.vue

@@ -5,9 +5,9 @@ import type { OnActionClickParams, VxeTableGridOptions } from '#/adapter';
 
 import { watch } from 'vue';
 
-import { useVbenModal } from '@vben/common-ui';
+import { alert, useVbenModal } from '@vben/common-ui';
 
-import { Button, message } from 'ant-design-vue';
+import { Button } from 'ant-design-vue';
 
 import { useTableGridOptions, useVbenVxeGrid } from '#/adapter';
 import { DictionaryApi } from '#/api';
@@ -36,13 +36,13 @@ const handelSuccess = () => {
 
 const handleDelete = async (id: number) => {
   await DictionaryApi.deleteItemDetail(id);
-  message.success('数据删除成功');
+  alert('数据删除成功');
   reload();
 };
 
 const handleEdit = (record: any, isUpdate: boolean) => {
   if (!isUpdate && !props.type) {
-    message.warning('请先选择字典类型');
+    alert({ content: '请先选择字典类型', icon: 'warning' });
     return;
   }
   formEditApi
@@ -113,7 +113,7 @@ watch(
 </script>
 <template>
   <div class="h-full">
-    <FormEditModal :close-on-click-modal="false" @success="handelSuccess" />
+    <FormEditModal @success="handelSuccess" />
     <Grid>
       <template #toolbar-tools>
         <Button

+ 2 - 4
apps/web-baicai/src/views/system/dict/type/edit.vue

@@ -1,9 +1,7 @@
 <script lang="ts" setup>
 import { computed, ref, unref } from 'vue';
 
-import { useVbenModal } from '@vben/common-ui';
-
-import { message } from 'ant-design-vue';
+import { alert, useVbenModal } from '@vben/common-ui';
 
 import { useFormOptions, useVbenForm } from '#/adapter';
 import { DictionaryApi } from '#/api';
@@ -39,7 +37,7 @@ const [Modal, { close, setState, getData, lock, unlock }] = useVbenModal({
         : DictionaryApi.addTypeDetail(
             postParams as DictionaryApi.BasicRecordItem,
           ));
-      message.success('操作成功');
+      alert('操作成功');
 
       emit('success');
       close();

+ 5 - 5
apps/web-baicai/src/views/system/dict/type/index.vue

@@ -5,9 +5,9 @@ import type {
   VxeTableGridOptions,
 } from '#/adapter';
 
-import { useVbenModal } from '@vben/common-ui';
+import { alert, useVbenModal } from '@vben/common-ui';
 
-import { Button, message } from 'ant-design-vue';
+import { Button } from 'ant-design-vue';
 
 import { useTableGridOptions, useVbenVxeGrid } from '#/adapter';
 import { DictionaryApi } from '#/api';
@@ -30,7 +30,7 @@ const handelSuccess = () => {
 
 const handleDelete = async (id: number) => {
   await DictionaryApi.deleteTypeDetail(id);
-  message.success('数据删除成功');
+  alert('数据删除成功');
   reload();
 };
 
@@ -60,7 +60,7 @@ const handleActionClick = async ({
 };
 
 const gridEvents: VxeGridListeners<DictionaryApi.RecordItem> = {
-  currentChange: ({ row }) => {
+  currentRowChange: ({ row }: { row: DictionaryApi.RecordItem }) => {
     emit('change', row.code);
   },
 };
@@ -94,7 +94,7 @@ const [Grid, { reload }] = useVbenVxeGrid(
 </script>
 <template>
   <div class="h-full">
-    <FormEditModal :close-on-click-modal="false" @success="handelSuccess" />
+    <FormEditModal @success="handelSuccess" />
     <Grid>
       <template #toolbar-tools>
         <Button

+ 1 - 0
apps/web-baicai/src/views/system/log/components/view.vue

@@ -10,6 +10,7 @@ const modelRef = ref<Record<string, any>>({});
 
 const [Modal, { setState, getData }] = useVbenModal({
   footer: false,
+  closeOnClickModal: false,
   onOpenChange: async (isOpen: boolean) => {
     if (isOpen) {
       setState({ loading: true });

+ 11 - 9
apps/web-baicai/src/views/system/log/difference/index.vue

@@ -1,9 +1,9 @@
 <script lang="ts" setup>
 import type { VxeTableGridOptions } from '#/adapter';
 
-import { Page } from '@vben/common-ui';
+import { alert, confirm, Page } from '@vben/common-ui';
 
-import { Button, message, Modal } from 'ant-design-vue';
+import { Button } from 'ant-design-vue';
 
 import { useTableGridOptions, useVbenVxeGrid } from '#/adapter';
 import { LogApi } from '#/api';
@@ -34,15 +34,17 @@ const [Grid, { reload }] = useVbenVxeGrid(
 );
 
 const handelClear = () => {
-  Modal.confirm({
-    iconType: 'info',
+  confirm({
     title: '删除提示',
     content: `确定要清空日志记录吗?`,
-    cancelText: `关闭`,
-    onOk: async () => {
-      await LogApi.clearLog('logdifference');
-      message.success('数据删除成功');
-      reload();
+    icon: 'question',
+    beforeClose: async ({ isConfirm }: { isConfirm: boolean }) => {
+      if (isConfirm) {
+        await LogApi.clearLog('logdifference');
+        alert('数据删除成功');
+        reload();
+        return true;
+      } else return false;
     },
   });
 };

+ 12 - 10
apps/web-baicai/src/views/system/log/exception/index.vue

@@ -1,9 +1,9 @@
 <script lang="ts" setup>
 import type { OnActionClickParams, VxeTableGridOptions } from '#/adapter';
 
-import { Page, useVbenModal } from '@vben/common-ui';
+import { alert, confirm, Page, useVbenModal } from '@vben/common-ui';
 
-import { Button, message, Modal } from 'ant-design-vue';
+import { Button } from 'ant-design-vue';
 
 import { useTableGridOptions, useVbenVxeGrid } from '#/adapter';
 import { LogApi } from '#/api';
@@ -60,15 +60,17 @@ const [Grid, { reload }] = useVbenVxeGrid(
 );
 
 const handelClear = () => {
-  Modal.confirm({
-    iconType: 'info',
+  confirm({
     title: '删除提示',
     content: `确定要清空日志记录吗?`,
-    cancelText: `关闭`,
-    onOk: async () => {
-      await LogApi.clearLog('logException');
-      message.success('数据删除成功');
-      reload();
+    icon: 'question',
+    beforeClose: async ({ isConfirm }: { isConfirm: boolean }) => {
+      if (isConfirm) {
+        await LogApi.clearLog('logException');
+        alert('数据删除成功');
+        reload();
+        return true;
+      } else return false;
     },
   });
 };
@@ -76,7 +78,7 @@ const handelClear = () => {
 
 <template>
   <Page auto-content-height>
-    <FormViewModel :close-on-click-modal="false" />
+    <FormViewModel />
     <Grid>
       <template #toolbar-tools>
         <Button

+ 12 - 10
apps/web-baicai/src/views/system/log/operate/index.vue

@@ -1,9 +1,9 @@
 <script lang="ts" setup>
 import type { OnActionClickParams, VxeTableGridOptions } from '#/adapter';
 
-import { Page, useVbenModal } from '@vben/common-ui';
+import { alert, confirm, Page, useVbenModal } from '@vben/common-ui';
 
-import { Button, message, Modal } from 'ant-design-vue';
+import { Button } from 'ant-design-vue';
 
 import { useTableGridOptions, useVbenVxeGrid } from '#/adapter';
 import { LogApi } from '#/api';
@@ -57,15 +57,17 @@ const [Grid, { reload }] = useVbenVxeGrid(
 );
 
 const handelClear = () => {
-  Modal.confirm({
-    iconType: 'info',
+  confirm({
     title: '删除提示',
     content: `确定要清空日志记录吗?`,
-    cancelText: `关闭`,
-    onOk: async () => {
-      await LogApi.clearLog('logOperate');
-      message.success('数据删除成功');
-      reload();
+    icon: 'question',
+    beforeClose: async ({ isConfirm }: { isConfirm: boolean }) => {
+      if (isConfirm) {
+        await LogApi.clearLog('logOperate');
+        alert('数据删除成功');
+        reload();
+        return true;
+      } else return false;
     },
   });
 };
@@ -73,7 +75,7 @@ const handelClear = () => {
 
 <template>
   <Page auto-content-height>
-    <FormViewModel :close-on-click-modal="false" />
+    <FormViewModel />
     <Grid>
       <template #toolbar-tools>
         <Button

+ 11 - 9
apps/web-baicai/src/views/system/log/visit/index.vue

@@ -1,9 +1,9 @@
 <script lang="ts" setup>
 import type { VxeTableGridOptions } from '#/adapter';
 
-import { Page } from '@vben/common-ui';
+import { alert, confirm, Page } from '@vben/common-ui';
 
-import { Button, message, Modal } from 'ant-design-vue';
+import { Button } from 'ant-design-vue';
 
 import { useTableGridOptions, useVbenVxeGrid } from '#/adapter';
 import { LogApi } from '#/api';
@@ -35,15 +35,17 @@ const [Grid, { reload }] = useVbenVxeGrid(
 );
 
 const handelClear = () => {
-  Modal.confirm({
-    iconType: 'info',
+  confirm({
     title: '删除提示',
     content: `确定要清空日志记录吗?`,
-    cancelText: `关闭`,
-    onOk: async () => {
-      await LogApi.clearLog('logVisit');
-      message.success('数据删除成功');
-      reload();
+    icon: 'question',
+    beforeClose: async ({ isConfirm }: { isConfirm: boolean }) => {
+      if (isConfirm) {
+        await LogApi.clearLog('logVisit');
+        alert('数据删除成功');
+        reload();
+        return true;
+      } else return false;
     },
   });
 };

+ 2 - 4
apps/web-baicai/src/views/system/menu/components/edit.vue

@@ -1,9 +1,7 @@
 <script lang="ts" setup>
 import { computed, ref, unref } from 'vue';
 
-import { useVbenDrawer } from '@vben/common-ui';
-
-import { message } from 'ant-design-vue';
+import { alert, useVbenDrawer } from '@vben/common-ui';
 
 import { useFormOptions, useVbenForm } from '#/adapter';
 import { MenuApi } from '#/api';
@@ -46,7 +44,7 @@ const [Drawer, { close, setState, getData, lock, unlock }] = useVbenDrawer({
       await (unref(isUpdate)
         ? MenuApi.editDetail(postParams as MenuApi.RecordItem)
         : MenuApi.addDetail(postParams as MenuApi.BasicRecordItem));
-      message.success('操作成功');
+      alert('操作成功');
 
       emit('success');
       close();

+ 3 - 4
apps/web-baicai/src/views/system/menu/components/editMenu.vue

@@ -1,9 +1,7 @@
 <script lang="ts" setup>
 import { computed, ref, unref } from 'vue';
 
-import { useVbenModal } from '@vben/common-ui';
-
-import { message } from 'ant-design-vue';
+import { alert, useVbenModal } from '@vben/common-ui';
 
 import { useFormOptions, useVbenForm } from '#/adapter';
 import { MenuApi } from '#/api';
@@ -27,6 +25,7 @@ const [Form, { validate, setValues, getValues }] = useVbenForm(
 const [Modal, { close, setState, getData, lock, unlock }] = useVbenModal({
   fullscreen: false,
   draggable: true,
+  closeOnClickModal: false,
   onCancel() {
     close();
   },
@@ -43,7 +42,7 @@ const [Modal, { close, setState, getData, lock, unlock }] = useVbenModal({
       await (unref(isUpdate)
         ? MenuApi.editDetail(postParams as MenuApi.RecordItem)
         : MenuApi.addDetail(postParams as MenuApi.BasicRecordItem));
-      message.success('操作成功');
+      alert('操作成功');
 
       emit('success');
       close();

+ 4 - 5
apps/web-baicai/src/views/system/menu/components/grant.vue

@@ -7,9 +7,9 @@ import type { RelationRequest } from '#/api/model';
 
 import { onMounted, reactive, ref, unref } from 'vue';
 
-import { useVbenDrawer, VbenTree } from '@vben/common-ui';
+import { alert, useVbenDrawer, VbenTree } from '@vben/common-ui';
 
-import { message, Spin } from 'ant-design-vue';
+import { Spin } from 'ant-design-vue';
 
 import { useVbenForm } from '#/adapter';
 import { MenuApi, RoleApi, TenantApi } from '#/api';
@@ -53,6 +53,7 @@ const getRoleDetailData = async () => {
 };
 
 const [Drawer, { close, setState, getData, lock, unlock }] = useVbenDrawer({
+  closeOnClickModal: false,
   onConfirm: async () => {
     const { valid } = await validate();
     if (!valid) return;
@@ -67,11 +68,9 @@ const [Drawer, { close, setState, getData, lock, unlock }] = useVbenDrawer({
       modelRef.value.type === 'tenant'
         ? await TenantApi.updateGrant(postData)
         : await RoleApi.updateGrant(postData);
-      message.success('操作成功');
+      alert('操作成功');
       close();
       emit('success');
-    } catch {
-      message.error('操作失败');
     } finally {
       unlock();
     }

+ 4 - 4
apps/web-baicai/src/views/system/menu/index.vue

@@ -1,10 +1,10 @@
 <script lang="ts" setup>
 import type { OnActionClickParams, VxeTableGridOptions } from '#/adapter/';
 
-import { Page, useVbenDrawer } from '@vben/common-ui';
+import { alert, Page, useVbenDrawer } from '@vben/common-ui';
 import { IconifyIcon } from '@vben/icons';
 
-import { Button, message } from 'ant-design-vue';
+import { Button } from 'ant-design-vue';
 
 import { useTableGridOptions, useVbenVxeGrid } from '#/adapter';
 import { MenuApi } from '#/api';
@@ -22,7 +22,7 @@ const handelSuccess = () => {
 
 const handleDelete = async (id: number) => {
   await MenuApi.deleteDetail(id);
-  message.success('数据删除成功');
+  alert('数据删除成功');
   reload();
 };
 
@@ -87,7 +87,7 @@ const [Grid, { reload }] = useVbenVxeGrid(
 
 <template>
   <Page auto-content-height>
-    <FormEditModal :close-on-click-modal="false" @success="handelSuccess" />
+    <FormEditModal @success="handelSuccess" />
     <Grid>
       <template #toolbar-tools>
         <Button

+ 3 - 2
apps/web-baicai/src/views/system/personal/components/update-avatar.vue

@@ -3,9 +3,10 @@ import type { UploadChangeParam } from 'ant-design-vue';
 
 import { computed } from 'vue';
 
+import { alert } from '@vben/common-ui';
 import { useAccessStore, useUserStore } from '@vben/stores';
 
-import { Avatar, message, Upload } from 'ant-design-vue';
+import { Avatar, Upload } from 'ant-design-vue';
 
 import { Icon } from '#/components/icon';
 
@@ -31,7 +32,7 @@ const handleChange = (info: UploadChangeParam) => {
       avatar: info.file.response.data.url,
     } as any);
   } else if (info.file.status === 'error') {
-    message.error(`${info.file.name} file upload failed.`);
+    alert({ content: `${info.file.name} file upload failed.`, icon: 'error' });
   }
 };
 </script>

+ 3 - 4
apps/web-baicai/src/views/system/post/components/edit.vue

@@ -1,9 +1,7 @@
 <script lang="ts" setup>
 import { computed, ref, unref } from 'vue';
 
-import { useVbenModal } from '@vben/common-ui';
-
-import { message } from 'ant-design-vue';
+import { alert, useVbenModal } from '@vben/common-ui';
 
 import { useFormOptions, useVbenForm } from '#/adapter';
 import { PostApi } from '#/api';
@@ -26,6 +24,7 @@ const [Form, { validate, setValues, getValues }] = useVbenForm(
 const [Modal, { close, setState, getData, lock, unlock }] = useVbenModal({
   fullscreenButton: false,
   draggable: true,
+  closeOnClickModal: false,
   onCancel() {
     close();
   },
@@ -40,7 +39,7 @@ const [Modal, { close, setState, getData, lock, unlock }] = useVbenModal({
       await (unref(isUpdate)
         ? PostApi.editDetail(postParams as PostApi.RecordItem)
         : PostApi.addDetail(postParams as PostApi.BasicRecordItem));
-      message.success('操作成功');
+      alert('操作成功');
 
       emit('success');
       close();

+ 4 - 4
apps/web-baicai/src/views/system/post/index.vue

@@ -1,9 +1,9 @@
 <script lang="ts" setup>
 import type { OnActionClickParams, VxeTableGridOptions } from '#/adapter';
 
-import { Page, useVbenModal } from '@vben/common-ui';
+import { alert, Page, useVbenModal } from '@vben/common-ui';
 
-import { Button, message } from 'ant-design-vue';
+import { Button } from 'ant-design-vue';
 
 import { useTableGridOptions, useVbenVxeGrid } from '#/adapter';
 import { PostApi } from '#/api';
@@ -20,7 +20,7 @@ const handelSuccess = () => {
 };
 const handleDelete = async (id: number) => {
   await PostApi.deleteDetail(id);
-  message.success('数据删除成功');
+  alert('数据删除成功');
   handelSuccess();
 };
 
@@ -86,7 +86,7 @@ const [Grid, { reload }] = useVbenVxeGrid(
 
 <template>
   <Page auto-content-height>
-    <FormEditModal :close-on-click-modal="false" @success="handelSuccess" />
+    <FormEditModal @success="handelSuccess" />
     <Grid>
       <template #toolbar-tools>
         <Button

+ 2 - 4
apps/web-baicai/src/views/system/role/components/edit.vue

@@ -1,9 +1,7 @@
 <script lang="ts" setup>
 import { computed, ref, unref } from 'vue';
 
-import { useVbenModal } from '@vben/common-ui';
-
-import { message } from 'ant-design-vue';
+import { alert, useVbenModal } from '@vben/common-ui';
 
 import { useFormOptions, useVbenForm } from '#/adapter';
 import { RoleApi } from '#/api';
@@ -40,7 +38,7 @@ const [Modal, { close, setState, getData, lock, unlock }] = useVbenModal({
       await (unref(isUpdate)
         ? RoleApi.editDetail(postParams as RoleApi.RecordItem)
         : RoleApi.addDetail(postParams as RoleApi.BasicRecordItem));
-      message.success('操作成功');
+      alert('操作成功');
 
       emit('success');
       close();

+ 5 - 9
apps/web-baicai/src/views/system/role/index.vue

@@ -1,7 +1,7 @@
 <script lang="ts" setup>
 import type { OnActionClickParams, VxeTableGridOptions } from '#/adapter';
 
-import { Page, useVbenDrawer, useVbenModal } from '@vben/common-ui';
+import { alert, Page, useVbenDrawer, useVbenModal } from '@vben/common-ui';
 
 import { Button, message } from 'ant-design-vue';
 
@@ -15,7 +15,7 @@ import { useColumns, useSearchSchema } from './data.config';
 
 const handleDelete = async (id: number) => {
   await RoleApi.deleteDetail(id);
-  message.success('数据删除成功');
+  alert('数据删除成功');
   reload();
 };
 const handleActionClick = async ({
@@ -140,13 +140,9 @@ const handelUserSuccess = async (data: any) => {
 
 <template>
   <Page auto-content-height>
-    <FormEditModal :close-on-click-modal="false" @success="handelSuccess" />
-    <MenuGrantModal :close-on-click-modal="false" />
-    <SelectCardModal
-      :close-on-click-modal="false"
-      title="用户"
-      @success="handelUserSuccess"
-    />
+    <FormEditModal @success="handelSuccess" />
+    <MenuGrantModal />
+    <SelectCardModal title="用户" @success="handelUserSuccess" />
     <Grid>
       <template #toolbar-tools>
         <Button

+ 3 - 4
apps/web-baicai/src/views/system/tenant/components/edit.vue

@@ -1,9 +1,7 @@
 <script lang="ts" setup>
 import { computed, ref, unref } from 'vue';
 
-import { useVbenModal } from '@vben/common-ui';
-
-import { message } from 'ant-design-vue';
+import { alert, useVbenModal } from '@vben/common-ui';
 
 import { useFormOptions, useVbenForm } from '#/adapter';
 import { TenantApi } from '#/api';
@@ -27,6 +25,7 @@ const [Form, { validate, setValues, getValues }] = useVbenForm(
 const [Modal, { close, setState, getData, lock, unlock }] = useVbenModal({
   fullscreenButton: false,
   draggable: true,
+  closeOnClickModal: false,
   onCancel() {
     close();
   },
@@ -41,7 +40,7 @@ const [Modal, { close, setState, getData, lock, unlock }] = useVbenModal({
       await (unref(isUpdate)
         ? TenantApi.editDetail(postParams as TenantApi.RecordItem)
         : TenantApi.addDetail(postParams as TenantApi.BasicRecordItem));
-      message.success('操作成功');
+      alert('操作成功');
 
       emit('success');
       close();

+ 5 - 5
apps/web-baicai/src/views/system/tenant/index.vue

@@ -1,9 +1,9 @@
 <script lang="ts" setup>
 import type { OnActionClickParams, VxeTableGridOptions } from '#/adapter';
 
-import { Page, useVbenModal } from '@vben/common-ui';
+import { alert, Page, useVbenModal } from '@vben/common-ui';
 
-import { Button, message } from 'ant-design-vue';
+import { Button } from 'ant-design-vue';
 
 import { useTableGridOptions, useVbenVxeGrid } from '#/adapter';
 import { TenantApi } from '#/api';
@@ -17,12 +17,12 @@ const [FormEditModal, formEditApi] = useVbenModal({
 
 const handleCreateDb = async (id: number) => {
   await TenantApi.createDb(id);
-  message.success('创建/更新租户数据库成功');
+  alert('创建/更新租户数据库成功');
 };
 
 const handleDelete = async (id: number) => {
   await TenantApi.deleteDetail(id);
-  message.success('数据删除成功');
+  alert('数据删除成功');
   reload();
 };
 
@@ -87,7 +87,7 @@ const [Grid, { reload }] = useVbenVxeGrid(
 
 <template>
   <Page auto-content-height>
-    <FormEditModal :close-on-click-modal="false" @success="handelSuccess" />
+    <FormEditModal @success="handelSuccess" />
     <Grid>
       <template #toolbar-tools>
         <Button

+ 3 - 4
apps/web-baicai/src/views/system/user/components/edit.vue

@@ -1,9 +1,7 @@
 <script lang="ts" setup>
 import { computed, ref, unref } from 'vue';
 
-import { useVbenModal } from '@vben/common-ui';
-
-import { message } from 'ant-design-vue';
+import { alert, useVbenModal } from '@vben/common-ui';
 
 import { useFormOptions, useVbenForm } from '#/adapter';
 import { UserApi } from '#/api';
@@ -28,6 +26,7 @@ const [Form, { validate, setValues, getValues, updateSchema }] = useVbenForm(
 const [Modal, { close, setState, getData, lock, unlock }] = useVbenModal({
   fullscreenButton: false,
   draggable: true,
+  closeOnClickModal: false,
   onCancel() {
     close();
   },
@@ -46,7 +45,7 @@ const [Modal, { close, setState, getData, lock, unlock }] = useVbenModal({
       await (unref(isUpdate)
         ? UserApi.editDetail(postParams as UserApi.RecordItem)
         : UserApi.addDetail(postParams as UserApi.BasicRecordItem));
-      message.success('操作成功');
+      alert('操作成功');
 
       emit('success');
       close();

+ 13 - 14
apps/web-baicai/src/views/system/user/index.vue

@@ -3,10 +3,10 @@ import type { OnActionClickParams, VxeTableGridOptions } from '#/adapter';
 
 import { reactive } from 'vue';
 
-import { BcPage, useVbenModal } from '@vben/common-ui';
+import { alert, BcPage, confirm, useVbenModal } from '@vben/common-ui';
 
 import { useClipboard } from '@vueuse/core';
-import { Button, message, Modal } from 'ant-design-vue';
+import { Button, message } from 'ant-design-vue';
 
 import { useTableGridOptions, useVbenVxeGrid } from '#/adapter';
 import { DepartmentApi, RoleApi, UserApi } from '#/api';
@@ -29,20 +29,23 @@ const [SelectCardModal, selectCardApi] = useVbenModal({
 
 const handelResetPassword = async (id: number) => {
   const data = await UserApi.resetPassword([id]);
-  Modal.success({
+  confirm({
     title: '重置成功',
     content: `新密码为:${data}`,
-    okText: `复制密码`,
-    onOk: () => {
-      copy(data);
-      message.success('密码复制成功!');
+    confirmText: '复制密码',
+    beforeClose: ({ isConfirm }: { isConfirm: boolean }) => {
+      if (isConfirm) {
+        copy(data);
+        alert('密码复制成功!');
+      }
+      return true;
     },
   });
 };
 
 const handleDelete = async (id: number) => {
   await UserApi.deleteDetail(id);
-  message.success('数据删除成功');
+  alert('数据删除成功');
   reload();
 };
 
@@ -162,12 +165,8 @@ const handleDepartmentChange = (keys: any[]) => {
         @change="handleDepartmentChange"
       />
     </template>
-    <FormEditModal :close-on-click-modal="false" @success="handelSuccess" />
-    <SelectCardModal
-      :close-on-click-modal="false"
-      title="角色"
-      @success="handelRoleSuccess"
-    />
+    <FormEditModal @success="handelSuccess" />
+    <SelectCardModal title="角色" @success="handelRoleSuccess" />
     <Grid>
       <template #toolbar-tools>
         <Button