From 594b345a3d20a8ff5a985200f66f89686ab00f6c Mon Sep 17 00:00:00 2001
From: colin <colin.in@foxmail.com>
Date: Wed, 12 Mar 2025 15:25:51 +0800
Subject: [PATCH 1/6] feat(vben5): add @abp/localization package

---
 apps/vben5/apps/app-antd/package.json         |   1 +
 .../app-antd/src/locales/langs/en-US/abp.json |   4 +
 .../app-antd/src/locales/langs/zh-CN/abp.json |   4 +
 .../app-antd/src/router/routes/modules/abp.ts |  20 ++
 .../views/localization/resources/index.vue    |  15 ++
 .../packages/@abp/localization/package.json   |  40 +++
 .../@abp/localization/src/api/index.ts        |   2 +
 .../src/api/useLocalizationsApi.ts            |  28 +++
 .../localization/src/api/useResourcesApi.ts   |  89 +++++++
 .../@abp/localization/src/components/index.ts |   1 +
 .../resources/LocalizationResourceModal.vue   | 125 ++++++++++
 .../resources/LocalizationResourceTable.vue   | 234 ++++++++++++++++++
 .../@abp/localization/src/constants/index.ts  |   1 +
 .../localization/src/constants/permissions.ts |  10 +
 .../packages/@abp/localization/src/index.ts   |   3 +
 .../@abp/localization/src/types/index.ts      |   1 +
 .../@abp/localization/src/types/resources.ts  |  33 +++
 .../packages/@abp/localization/tsconfig.json  |   6 +
 18 files changed, 617 insertions(+)
 create mode 100644 apps/vben5/apps/app-antd/src/views/localization/resources/index.vue
 create mode 100644 apps/vben5/packages/@abp/localization/package.json
 create mode 100644 apps/vben5/packages/@abp/localization/src/api/index.ts
 create mode 100644 apps/vben5/packages/@abp/localization/src/api/useLocalizationsApi.ts
 create mode 100644 apps/vben5/packages/@abp/localization/src/api/useResourcesApi.ts
 create mode 100644 apps/vben5/packages/@abp/localization/src/components/index.ts
 create mode 100644 apps/vben5/packages/@abp/localization/src/components/resources/LocalizationResourceModal.vue
 create mode 100644 apps/vben5/packages/@abp/localization/src/components/resources/LocalizationResourceTable.vue
 create mode 100644 apps/vben5/packages/@abp/localization/src/constants/index.ts
 create mode 100644 apps/vben5/packages/@abp/localization/src/constants/permissions.ts
 create mode 100644 apps/vben5/packages/@abp/localization/src/index.ts
 create mode 100644 apps/vben5/packages/@abp/localization/src/types/index.ts
 create mode 100644 apps/vben5/packages/@abp/localization/src/types/resources.ts
 create mode 100644 apps/vben5/packages/@abp/localization/tsconfig.json

diff --git a/apps/vben5/apps/app-antd/package.json b/apps/vben5/apps/app-antd/package.json
index adfaf25a1..b4b1336ef 100644
--- a/apps/vben5/apps/app-antd/package.json
+++ b/apps/vben5/apps/app-antd/package.json
@@ -31,6 +31,7 @@
     "@abp/core": "workspace:*",
     "@abp/features": "workspace:*",
     "@abp/identity": "workspace:*",
+    "@abp/localization": "workspace:*",
     "@abp/notifications": "workspace:*",
     "@abp/openiddict": "workspace:*",
     "@abp/permissions": "workspace:*",
diff --git a/apps/vben5/apps/app-antd/src/locales/langs/en-US/abp.json b/apps/vben5/apps/app-antd/src/locales/langs/en-US/abp.json
index 7e50c1168..c1bf002b0 100644
--- a/apps/vben5/apps/app-antd/src/locales/langs/en-US/abp.json
+++ b/apps/vben5/apps/app-antd/src/locales/langs/en-US/abp.json
@@ -45,6 +45,10 @@
       "myNotifilers": "My Notifilers",
       "groups": "Groups",
       "definitions": "Definitions"
+    },
+    "localization": {
+      "title": "Localization",
+      "resources": "Resources"
     }
   },
   "openiddict": {
diff --git a/apps/vben5/apps/app-antd/src/locales/langs/zh-CN/abp.json b/apps/vben5/apps/app-antd/src/locales/langs/zh-CN/abp.json
index 7976ea8f7..9572acc11 100644
--- a/apps/vben5/apps/app-antd/src/locales/langs/zh-CN/abp.json
+++ b/apps/vben5/apps/app-antd/src/locales/langs/zh-CN/abp.json
@@ -45,6 +45,10 @@
       "myNotifilers": "我的通知",
       "groups": "通知分组",
       "definitions": "通知定义"
+    },
+    "localization": {
+      "title": "本地化管理",
+      "resources": "资源管理"
     }
   },
   "openiddict": {
diff --git a/apps/vben5/apps/app-antd/src/router/routes/modules/abp.ts b/apps/vben5/apps/app-antd/src/router/routes/modules/abp.ts
index 3504f198a..8a8f6477a 100644
--- a/apps/vben5/apps/app-antd/src/router/routes/modules/abp.ts
+++ b/apps/vben5/apps/app-antd/src/router/routes/modules/abp.ts
@@ -175,6 +175,26 @@ const routes: RouteRecordRaw[] = [
               },
             ],
           },
+          {
+            meta: {
+              title: $t('abp.manage.localization.title'),
+              icon: 'ion:globe-outline',
+            },
+            name: 'LocalizationManagement',
+            path: '/manage/localization',
+            children: [
+              {
+                meta: {
+                  title: $t('abp.manage.localization.resources'),
+                  icon: 'grommet-icons:resources',
+                },
+                name: 'LocalizationResources',
+                path: '/manage/localization/resources',
+                component: () =>
+                  import('#/views/localization/resources/index.vue'),
+              },
+            ],
+          },
           {
             meta: {
               title: $t('abp.manage.identity.auditLogs'),
diff --git a/apps/vben5/apps/app-antd/src/views/localization/resources/index.vue b/apps/vben5/apps/app-antd/src/views/localization/resources/index.vue
new file mode 100644
index 000000000..114495512
--- /dev/null
+++ b/apps/vben5/apps/app-antd/src/views/localization/resources/index.vue
@@ -0,0 +1,15 @@
+<script lang="ts" setup>
+import { Page } from '@vben/common-ui';
+
+import { LocalizationResourceTable } from '@abp/localization';
+
+defineOptions({
+  name: 'LocalizationResources',
+});
+</script>
+
+<template>
+  <Page>
+    <LocalizationResourceTable />
+  </Page>
+</template>
diff --git a/apps/vben5/packages/@abp/localization/package.json b/apps/vben5/packages/@abp/localization/package.json
new file mode 100644
index 000000000..121edef76
--- /dev/null
+++ b/apps/vben5/packages/@abp/localization/package.json
@@ -0,0 +1,40 @@
+{
+  "name": "@abp/localization",
+  "version": "9.0.4",
+  "homepage": "https://github.com/colinin/abp-next-admin",
+  "bugs": "https://github.com/colinin/abp-next-admin/issues",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/colinin/abp-next-admin.git",
+    "directory": "packages/@abp/localization"
+  },
+  "license": "MIT",
+  "type": "module",
+  "sideEffects": [
+    "**/*.css"
+  ],
+  "exports": {
+    ".": {
+      "types": "./src/index.ts",
+      "default": "./src/index.ts"
+    }
+  },
+  "dependencies": {
+    "@abp/components": "workspace:*",
+    "@abp/core": "workspace:*",
+    "@abp/request": "workspace:*",
+    "@abp/signalr": "workspace:*",
+    "@abp/ui": "workspace:*",
+    "@ant-design/icons-vue": "catalog:",
+    "@vben/access": "workspace:*",
+    "@vben/common-ui": "workspace:*",
+    "@vben/hooks": "workspace:*",
+    "@vben/icons": "workspace:*",
+    "@vben/layouts": "workspace:*",
+    "@vben/locales": "workspace:*",
+    "ant-design-vue": "catalog:",
+    "dayjs": "catalog:",
+    "vue": "catalog:*",
+    "vxe-table": "catalog:"
+  }
+}
diff --git a/apps/vben5/packages/@abp/localization/src/api/index.ts b/apps/vben5/packages/@abp/localization/src/api/index.ts
new file mode 100644
index 000000000..d0bdf1313
--- /dev/null
+++ b/apps/vben5/packages/@abp/localization/src/api/index.ts
@@ -0,0 +1,2 @@
+export { useLocalizationsApi } from './useLocalizationsApi';
+export { useResourcesApi } from './useResourcesApi';
diff --git a/apps/vben5/packages/@abp/localization/src/api/useLocalizationsApi.ts b/apps/vben5/packages/@abp/localization/src/api/useLocalizationsApi.ts
new file mode 100644
index 000000000..bfb6975ac
--- /dev/null
+++ b/apps/vben5/packages/@abp/localization/src/api/useLocalizationsApi.ts
@@ -0,0 +1,28 @@
+import type { ApplicationLocalizationDto } from '@abp/core';
+
+import { useRequest } from '@abp/request';
+
+export function useLocalizationsApi() {
+  const { cancel, request } = useRequest();
+  /**
+   * 获取应用程序语言
+   * @returns 本地化配置
+   */
+  function getLocalizationApi(options: {
+    cultureName: string;
+    onlyDynamics?: boolean;
+  }): Promise<ApplicationLocalizationDto> {
+    return request<ApplicationLocalizationDto>(
+      '/api/abp/application-localization',
+      {
+        method: 'GET',
+        params: options,
+      },
+    );
+  }
+
+  return {
+    cancel,
+    getLocalizationApi,
+  };
+}
diff --git a/apps/vben5/packages/@abp/localization/src/api/useResourcesApi.ts b/apps/vben5/packages/@abp/localization/src/api/useResourcesApi.ts
new file mode 100644
index 000000000..a8bcd38e5
--- /dev/null
+++ b/apps/vben5/packages/@abp/localization/src/api/useResourcesApi.ts
@@ -0,0 +1,89 @@
+import type { ListResultDto } from '@abp/core';
+
+import type {
+  ResourceCreateDto,
+  ResourceDto,
+  ResourceGetListInput,
+  ResourceUpdateDto,
+} from '../types/resources';
+
+import { useRequest } from '@abp/request';
+
+export function useResourcesApi() {
+  const { cancel, request } = useRequest();
+
+  /**
+   * 查询资源列表
+   * @param input 参数
+   * @returns 资源列表
+   */
+  function getListApi(
+    input?: ResourceGetListInput,
+  ): Promise<ListResultDto<ResourceDto>> {
+    return request<ListResultDto<ResourceDto>>(
+      '/api/abp/localization/resources',
+      {
+        method: 'GET',
+        params: input,
+      },
+    );
+  }
+
+  /**
+   * 查询资源
+   * @param name 资源名称
+   * @returns 查询的资源
+   */
+  function getApi(name: string): Promise<ResourceDto> {
+    return request<ResourceDto>(`/api/localization/resources/${name}`, {
+      method: 'GET',
+    });
+  }
+
+  /**
+   * 删除资源
+   * @param name 资源名称
+   */
+  function deleteApi(name: string): Promise<void> {
+    return request(`/api/localization/resources/${name}`, {
+      method: 'DELETE',
+    });
+  }
+
+  /**
+   * 创建资源
+   * @param input 参数
+   * @returns 创建的资源
+   */
+  function createApi(input: ResourceCreateDto): Promise<ResourceDto> {
+    return request<ResourceDto>(`/api/localization/resources`, {
+      data: input,
+      method: 'POST',
+    });
+  }
+
+  /**
+   * 编辑资源
+   * @param name 资源名称
+   * @param input 参数
+   * @returns 编辑的资源
+   */
+  function updateApi(
+    name: string,
+    input: ResourceUpdateDto,
+  ): Promise<ResourceDto> {
+    return request<ResourceDto>(`/api/localization/resources/${name}`, {
+      data: input,
+      method: 'PUT',
+    });
+  }
+
+  return {
+    cancel,
+    createApi,
+    deleteApi,
+    getApi,
+    getListApi,
+    updateApi,
+  };
+}
diff --git a/apps/vben5/packages/@abp/localization/src/components/index.ts b/apps/vben5/packages/@abp/localization/src/components/index.ts
new file mode 100644
index 000000000..78dfadb28
--- /dev/null
+++ b/apps/vben5/packages/@abp/localization/src/components/index.ts
@@ -0,0 +1 @@
+export { default as LocalizationResourceTable } from './resources/LocalizationResourceTable.vue';
diff --git a/apps/vben5/packages/@abp/localization/src/components/resources/LocalizationResourceModal.vue b/apps/vben5/packages/@abp/localization/src/components/resources/LocalizationResourceModal.vue
new file mode 100644
index 000000000..5ea5f6bb9
--- /dev/null
+++ b/apps/vben5/packages/@abp/localization/src/components/resources/LocalizationResourceModal.vue
@@ -0,0 +1,125 @@
+<script setup lang="ts">
+import type { FormInstance } from 'ant-design-vue';
+
+import type { ResourceDto } from '../../types/resources';
+
+import { defineEmits, defineOptions, ref, toValue, useTemplateRef } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+import { $t } from '@vben/locales';
+
+import { Checkbox, Form, Input, message } from 'ant-design-vue';
+
+import { useResourcesApi } from '../../api/useResourcesApi';
+
+defineOptions({
+  name: 'LocalizationResourceModal',
+});
+const emits = defineEmits<{
+  (event: 'change', data: ResourceDto): void;
+}>();
+
+const FormItem = Form.Item;
+
+const defaultModel = {
+  displayName: '',
+  enable: true,
+  name: '',
+} as ResourceDto;
+
+const form = useTemplateRef<FormInstance>('form');
+const formModel = ref<ResourceDto>({ ...defaultModel });
+
+const { cancel, createApi, getApi, updateApi } = useResourcesApi();
+const [Modal, modalApi] = useVbenModal({
+  class: 'w-1/2',
+  draggable: true,
+  fullscreenButton: false,
+  onCancel() {
+    modalApi.close();
+  },
+  onClosed() {
+    cancel('LocalizationResourceModal has closed!');
+  },
+  onConfirm: onSubmit,
+  onOpenChange: async (isOpen: boolean) => {
+    if (isOpen) {
+      formModel.value = { ...defaultModel };
+      modalApi.setState({
+        title: $t('LocalizationManagement.Resource:AddNew'),
+      });
+      const { name } = modalApi.getData<ResourceDto>();
+      name && (await onGet(name));
+    }
+  },
+  title: $t('LocalizationManagement.Resource:AddNew'),
+});
+async function onGet(name: string) {
+  try {
+    modalApi.setState({ loading: true });
+    const dto = await getApi(name);
+    formModel.value = dto;
+    modalApi.setState({
+      title: `${$t('AbpLocalization.Resources')} - ${dto.name}`,
+    });
+  } finally {
+    modalApi.setState({ loading: false });
+  }
+}
+async function onSubmit() {
+  await form.value?.validate();
+  try {
+    modalApi.setState({ submitting: true });
+    const input = toValue(formModel);
+    const api = input.id ? updateApi(input.name, input) : createApi(input);
+    const dto = await api;
+    message.success($t('AbpUi.SavedSuccessfully'));
+    emits('change', dto);
+    modalApi.close();
+  } finally {
+    modalApi.setState({ submitting: false });
+  }
+}
+</script>
+
+<template>
+  <Modal>
+    <Form
+      ref="form"
+      :label-col="{ span: 6 }"
+      :model="formModel"
+      :wrapper-col="{ span: 18 }"
+    >
+      <FormItem
+        :label="$t('LocalizationManagement.DisplayName:Enable')"
+        name="enable"
+      >
+        <Checkbox v-model:checked="formModel.enable">
+          {{ $t('LocalizationManagement.DisplayName:Enable') }}
+        </Checkbox>
+      </FormItem>
+      <FormItem
+        :label="$t('AbpLocalization.DisplayName:ResourceName')"
+        name="name"
+        required
+      >
+        <Input v-model:value="formModel.name" autocomplete="off" />
+      </FormItem>
+      <FormItem
+        :label="$t('AbpLocalization.DisplayName:DisplayName')"
+        name="displayName"
+        required
+      >
+        <Input v-model:value="formModel.displayName" autocomplete="off" />
+      </FormItem>
+      <FormItem
+        :label="$t('AbpLocalization.DisplayName:Description')"
+        name="description"
+      >
+        <Input v-model:value="formModel.description" autocomplete="off" />
+      </FormItem>
+    </Form>
+  </Modal>
+</template>
+
+<style scoped></style>
diff --git a/apps/vben5/packages/@abp/localization/src/components/resources/LocalizationResourceTable.vue b/apps/vben5/packages/@abp/localization/src/components/resources/LocalizationResourceTable.vue
new file mode 100644
index 000000000..9aad82e66
--- /dev/null
+++ b/apps/vben5/packages/@abp/localization/src/components/resources/LocalizationResourceTable.vue
@@ -0,0 +1,234 @@
+<script setup lang="ts">
+import type { VbenFormProps, VxeGridListeners, VxeGridProps } from '@abp/ui';
+
+import type { ResourceDto } from '../../types/resources';
+
+import { defineAsyncComponent, h, onMounted, reactive, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+import { $t } from '@vben/locales';
+
+import {
+  useAbpStore,
+  useLocalization,
+  useLocalizationSerializer,
+} from '@abp/core';
+import { useVbenVxeGrid } from '@abp/ui';
+import {
+  DeleteOutlined,
+  EditOutlined,
+  PlusOutlined,
+} from '@ant-design/icons-vue';
+import { Button, message, Modal } from 'ant-design-vue';
+
+import { useLocalizationsApi } from '../../api/useLocalizationsApi';
+import { useResourcesApi } from '../../api/useResourcesApi';
+import { ResourcesPermissions } from '../../constants/permissions';
+
+defineOptions({
+  name: 'LocalizationResourceTable',
+});
+
+const permissionGroups = ref<ResourceDto[]>([]);
+const pageState = reactive({
+  current: 1,
+  size: 10,
+  total: 0,
+});
+
+const abpStore = useAbpStore();
+const { Lr } = useLocalization();
+const { deserialize } = useLocalizationSerializer();
+const { deleteApi, getListApi } = useResourcesApi();
+const { getLocalizationApi } = useLocalizationsApi();
+
+const formOptions: VbenFormProps = {
+  // 默认展开
+  collapsed: false,
+  handleReset: onReset,
+  async handleSubmit(params) {
+    pageState.current = 1;
+    await onGet(params);
+  },
+  schema: [
+    {
+      component: 'Input',
+      fieldName: 'filter',
+      formItemClass: 'col-span-2 items-baseline',
+      label: $t('AbpUi.Search'),
+    },
+  ],
+  // 控制表单是否显示折叠按钮
+  showCollapseButton: true,
+  // 按下回车时是否提交表单
+  submitOnEnter: true,
+};
+
+const gridOptions: VxeGridProps<ResourceDto> = {
+  columns: [
+    {
+      align: 'left',
+      field: 'name',
+      minWidth: 150,
+      title: $t('AbpFeatureManagement.DisplayName:Name'),
+    },
+    {
+      align: 'left',
+      field: 'displayName',
+      minWidth: 150,
+      title: $t('AbpFeatureManagement.DisplayName:DisplayName'),
+    },
+    {
+      field: 'action',
+      fixed: 'right',
+      slots: { default: 'action' },
+      title: $t('AbpUi.Actions'),
+      width: 220,
+    },
+  ],
+  exportConfig: {},
+  keepSource: true,
+  toolbarConfig: {
+    custom: true,
+    export: true,
+    refresh: false,
+    zoom: true,
+  },
+};
+
+const gridEvents: VxeGridListeners<ResourceDto> = {
+  pageChange(params) {
+    pageState.current = params.currentPage;
+    pageState.size = params.pageSize;
+    onPageChange();
+  },
+};
+
+const [LocalizationResourceModal, modalApi] = useVbenModal({
+  connectedComponent: defineAsyncComponent(
+    () => import('./LocalizationResourceModal.vue'),
+  ),
+});
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  formOptions,
+  gridEvents,
+  gridOptions,
+});
+
+async function onGet(input?: Record<string, string>) {
+  try {
+    gridApi.setLoading(true);
+    const { items } = await getListApi(input);
+    pageState.total = items.length;
+    permissionGroups.value = items.map((item) => {
+      const localizableString = deserialize(item.displayName);
+      return {
+        ...item,
+        displayName: Lr(localizableString.resourceName, localizableString.name),
+      };
+    });
+    onPageChange();
+  } finally {
+    gridApi.setLoading(false);
+  }
+}
+
+async function onReset() {
+  await gridApi.formApi.resetForm();
+  const input = await gridApi.formApi.getValues();
+  await onGet(input);
+}
+
+function onPageChange() {
+  const items = permissionGroups.value.slice(
+    (pageState.current - 1) * pageState.size,
+    pageState.current * pageState.size,
+  );
+  gridApi.setGridOptions({
+    data: items,
+    pagerConfig: {
+      currentPage: pageState.current,
+      pageSize: pageState.size,
+      total: pageState.total,
+    },
+  });
+}
+
+function onCreate() {
+  modalApi.setData({});
+  modalApi.open();
+}
+
+function onUpdate(row: ResourceDto) {
+  modalApi.setData(row);
+  modalApi.open();
+}
+
+function onDelete(row: ResourceDto) {
+  Modal.confirm({
+    centered: true,
+    content: `${$t('AbpUi.ItemWillBeDeletedMessageWithFormat', [row.name])}`,
+    onOk: async () => {
+      await deleteApi(row.name);
+      message.success($t('AbpUi.DeletedSuccessfully'));
+      onChange();
+    },
+    title: $t('AbpUi.AreYouSure'),
+  });
+}
+
+async function onChange() {
+  gridApi.query();
+  // 资源变化刷新本地多语言缓存
+  const cultureName = abpStore.localization!.currentCulture.cultureName;
+  const localization = await getLocalizationApi({
+    cultureName,
+  });
+  abpStore.setLocalization(localization);
+}
+
+onMounted(onGet);
+</script>
+
+<template>
+  <Grid :table-title="$t('AbpLocalization.Resources')">
+    <template #toolbar-tools>
+      <Button
+        :icon="h(PlusOutlined)"
+        type="primary"
+        v-access:code="[ResourcesPermissions.Create]"
+        @click="onCreate"
+      >
+        {{ $t('LocalizationManagement.Resource:AddNew') }}
+      </Button>
+    </template>
+    <template #action="{ row }">
+      <div class="flex flex-row">
+        <Button
+          :icon="h(EditOutlined)"
+          block
+          type="link"
+          v-access:code="[ResourcesPermissions.Update]"
+          @click="onUpdate(row)"
+        >
+          {{ $t('AbpUi.Edit') }}
+        </Button>
+        <Button
+          v-if="!row.isStatic"
+          :icon="h(DeleteOutlined)"
+          block
+          danger
+          type="link"
+          v-access:code="[ResourcesPermissions.Delete]"
+          @click="onDelete(row)"
+        >
+          {{ $t('AbpUi.Delete') }}
+        </Button>
+      </div>
+    </template>
+  </Grid>
+  <LocalizationResourceModal @change="onChange" />
+</template>
+
+<style scoped></style>
diff --git a/apps/vben5/packages/@abp/localization/src/constants/index.ts b/apps/vben5/packages/@abp/localization/src/constants/index.ts
new file mode 100644
index 000000000..c85954d3e
--- /dev/null
+++ b/apps/vben5/packages/@abp/localization/src/constants/index.ts
@@ -0,0 +1 @@
+export * from './permissions';
diff --git a/apps/vben5/packages/@abp/localization/src/constants/permissions.ts b/apps/vben5/packages/@abp/localization/src/constants/permissions.ts
new file mode 100644
index 000000000..f8efa3338
--- /dev/null
+++ b/apps/vben5/packages/@abp/localization/src/constants/permissions.ts
@@ -0,0 +1,10 @@
+/** 资源管理权限 */
+export const ResourcesPermissions = {
+  /** 新增 */
+  Create: 'LocalizationManagement.Resource.Create',
+  Default: 'LocalizationManagement.Resource',
+  /** 删除 */
+  Delete: 'LocalizationManagement.Resource.Delete',
+  /** 更新 */
+  Update: 'LocalizationManagement.Resource.Update',
+};
diff --git a/apps/vben5/packages/@abp/localization/src/index.ts b/apps/vben5/packages/@abp/localization/src/index.ts
new file mode 100644
index 000000000..314dad0cd
--- /dev/null
+++ b/apps/vben5/packages/@abp/localization/src/index.ts
@@ -0,0 +1,3 @@
+export * from './api';
+export * from './components';
+export * from './types';
diff --git a/apps/vben5/packages/@abp/localization/src/types/index.ts b/apps/vben5/packages/@abp/localization/src/types/index.ts
new file mode 100644
index 000000000..00e67e02e
--- /dev/null
+++ b/apps/vben5/packages/@abp/localization/src/types/index.ts
@@ -0,0 +1 @@
+export * from './resources';
diff --git a/apps/vben5/packages/@abp/localization/src/types/resources.ts b/apps/vben5/packages/@abp/localization/src/types/resources.ts
new file mode 100644
index 000000000..8523c0094
--- /dev/null
+++ b/apps/vben5/packages/@abp/localization/src/types/resources.ts
@@ -0,0 +1,33 @@
+import type { AuditedEntityDto } from '@abp/core';
+
+interface ResourceDto extends AuditedEntityDto<string> {
+  defaultCultureName?: string;
+  description?: string;
+  displayName: string;
+  enable: boolean;
+  name: string;
+}
+
+interface ResourceCreateOrUpdateDto {
+  defaultCultureName?: string;
+  description?: string;
+  displayName: string;
+  enable: boolean;
+}
+
+interface ResourceCreateDto extends ResourceCreateOrUpdateDto {
+  name: string;
+}
+
+type ResourceUpdateDto = ResourceCreateOrUpdateDto;
+
+interface ResourceGetListInput {
+  filter?: string;
+}
+
+export type {
+  ResourceCreateDto,
+  ResourceDto,
+  ResourceGetListInput,
+  ResourceUpdateDto,
+};
diff --git a/apps/vben5/packages/@abp/localization/tsconfig.json b/apps/vben5/packages/@abp/localization/tsconfig.json
new file mode 100644
index 000000000..ce1a891fb
--- /dev/null
+++ b/apps/vben5/packages/@abp/localization/tsconfig.json
@@ -0,0 +1,6 @@
+{
+  "$schema": "https://json.schemastore.org/tsconfig",
+  "extends": "@vben/tsconfig/web.json",
+  "include": ["src"],
+  "exclude": ["node_modules"]
+}

From f4cc428834bd27f25cfd8cf7590ffed1d85b2219 Mon Sep 17 00:00:00 2001
From: colin <colin.in@foxmail.com>
Date: Wed, 12 Mar 2025 15:45:57 +0800
Subject: [PATCH 2/6] feat(vben5): add language manage

---
 .../app-antd/src/locales/langs/en-US/abp.json |   3 +-
 .../app-antd/src/locales/langs/zh-CN/abp.json |   3 +-
 .../app-antd/src/router/routes/modules/abp.ts |  10 +
 .../views/localization/languages/index.vue    |  15 ++
 .../@abp/localization/src/api/index.ts        |   1 +
 .../localization/src/api/useLanguagesApi.ts   |  89 +++++++
 .../@abp/localization/src/components/index.ts |   1 +
 .../languages/LocalizationLanguageModal.vue   | 115 +++++++++
 .../languages/LocalizationLanguageTable.vue   | 240 ++++++++++++++++++
 .../localization/src/constants/permissions.ts |  10 +
 .../@abp/localization/src/types/index.ts      |   1 +
 .../@abp/localization/src/types/languages.ts  |  30 +++
 12 files changed, 516 insertions(+), 2 deletions(-)
 create mode 100644 apps/vben5/apps/app-antd/src/views/localization/languages/index.vue
 create mode 100644 apps/vben5/packages/@abp/localization/src/api/useLanguagesApi.ts
 create mode 100644 apps/vben5/packages/@abp/localization/src/components/languages/LocalizationLanguageModal.vue
 create mode 100644 apps/vben5/packages/@abp/localization/src/components/languages/LocalizationLanguageTable.vue
 create mode 100644 apps/vben5/packages/@abp/localization/src/types/languages.ts

diff --git a/apps/vben5/apps/app-antd/src/locales/langs/en-US/abp.json b/apps/vben5/apps/app-antd/src/locales/langs/en-US/abp.json
index c1bf002b0..5156e2b28 100644
--- a/apps/vben5/apps/app-antd/src/locales/langs/en-US/abp.json
+++ b/apps/vben5/apps/app-antd/src/locales/langs/en-US/abp.json
@@ -48,7 +48,8 @@
     },
     "localization": {
       "title": "Localization",
-      "resources": "Resources"
+      "resources": "Resources",
+      "languages": "Languages"
     }
   },
   "openiddict": {
diff --git a/apps/vben5/apps/app-antd/src/locales/langs/zh-CN/abp.json b/apps/vben5/apps/app-antd/src/locales/langs/zh-CN/abp.json
index 9572acc11..5ea364714 100644
--- a/apps/vben5/apps/app-antd/src/locales/langs/zh-CN/abp.json
+++ b/apps/vben5/apps/app-antd/src/locales/langs/zh-CN/abp.json
@@ -48,7 +48,8 @@
     },
     "localization": {
       "title": "本地化管理",
-      "resources": "资源管理"
+      "resources": "资源管理",
+      "languages": "语言管理"
     }
   },
   "openiddict": {
diff --git a/apps/vben5/apps/app-antd/src/router/routes/modules/abp.ts b/apps/vben5/apps/app-antd/src/router/routes/modules/abp.ts
index 8a8f6477a..43b422883 100644
--- a/apps/vben5/apps/app-antd/src/router/routes/modules/abp.ts
+++ b/apps/vben5/apps/app-antd/src/router/routes/modules/abp.ts
@@ -193,6 +193,16 @@ const routes: RouteRecordRaw[] = [
                 component: () =>
                   import('#/views/localization/resources/index.vue'),
               },
+              {
+                meta: {
+                  title: $t('abp.manage.localization.languages'),
+                  icon: 'cil:language',
+                },
+                name: 'LocalizationLanguages',
+                path: '/manage/localization/languages',
+                component: () =>
+                  import('#/views/localization/languages/index.vue'),
+              },
             ],
           },
           {
diff --git a/apps/vben5/apps/app-antd/src/views/localization/languages/index.vue b/apps/vben5/apps/app-antd/src/views/localization/languages/index.vue
new file mode 100644
index 000000000..b2c23dd24
--- /dev/null
+++ b/apps/vben5/apps/app-antd/src/views/localization/languages/index.vue
@@ -0,0 +1,15 @@
+<script lang="ts" setup>
+import { Page } from '@vben/common-ui';
+
+import { LocalizationLanguageTable } from '@abp/localization';
+
+defineOptions({
+  name: 'LocalizationLanguages',
+});
+</script>
+
+<template>
+  <Page>
+    <LocalizationLanguageTable />
+  </Page>
+</template>
diff --git a/apps/vben5/packages/@abp/localization/src/api/index.ts b/apps/vben5/packages/@abp/localization/src/api/index.ts
index d0bdf1313..6857e0bad 100644
--- a/apps/vben5/packages/@abp/localization/src/api/index.ts
+++ b/apps/vben5/packages/@abp/localization/src/api/index.ts
@@ -1,2 +1,3 @@
+export { useLanguagesApi } from './useLanguagesApi';
 export { useLocalizationsApi } from './useLocalizationsApi';
 export { useResourcesApi } from './useResourcesApi';
diff --git a/apps/vben5/packages/@abp/localization/src/api/useLanguagesApi.ts b/apps/vben5/packages/@abp/localization/src/api/useLanguagesApi.ts
new file mode 100644
index 000000000..3b6469063
--- /dev/null
+++ b/apps/vben5/packages/@abp/localization/src/api/useLanguagesApi.ts
@@ -0,0 +1,89 @@
+import type { ListResultDto } from '@abp/core';
+
+import type {
+  LanguageCreateDto,
+  LanguageDto,
+  LanguageGetListInput,
+  LanguageUpdateDto,
+} from '../types/languages';
+
+import { useRequest } from '@abp/request';
+
+export function useLanguagesApi() {
+  const { cancel, request } = useRequest();
+
+  /**
+   * 查询语言列表
+   * @param input 参数
+   * @returns 语言列表
+   */
+  function getListApi(
+    input?: LanguageGetListInput,
+  ): Promise<ListResultDto<LanguageDto>> {
+    return request<ListResultDto<LanguageDto>>(
+      '/api/abp/localization/languages',
+      {
+        method: 'GET',
+        params: input,
+      },
+    );
+  }
+
+  /**
+   * 查询语言
+   * @param name 语言名称
+   * @returns 查询的语言
+   */
+  function getApi(name: string): Promise<LanguageDto> {
+    return request<LanguageDto>(`/api/localization/languages/${name}`, {
+      method: 'GET',
+    });
+  }
+
+  /**
+   * 删除语言
+   * @param name 语言名称
+   */
+  function deleteApi(name: string): Promise<void> {
+    return request(`/api/localization/languages/${name}`, {
+      method: 'DELETE',
+    });
+  }
+
+  /**
+   * 创建语言
+   * @param input 参数
+   * @returns 创建的语言
+   */
+  function createApi(input: LanguageCreateDto): Promise<LanguageDto> {
+    return request<LanguageDto>(`/api/localization/languages`, {
+      data: input,
+      method: 'POST',
+    });
+  }
+
+  /**
+   * 编辑语言
+   * @param name 语言名称
+   * @param input 参数
+   * @returns 编辑的语言
+   */
+  function updateApi(
+    name: string,
+    input: LanguageUpdateDto,
+  ): Promise<LanguageDto> {
+    return request<LanguageDto>(`/api/localization/languages/${name}`, {
+      data: input,
+      method: 'PUT',
+    });
+  }
+
+  return {
+    cancel,
+    createApi,
+    deleteApi,
+    getApi,
+    getListApi,
+    updateApi,
+  };
+}
diff --git a/apps/vben5/packages/@abp/localization/src/components/index.ts b/apps/vben5/packages/@abp/localization/src/components/index.ts
index 78dfadb28..a338e40b0 100644
--- a/apps/vben5/packages/@abp/localization/src/components/index.ts
+++ b/apps/vben5/packages/@abp/localization/src/components/index.ts
@@ -1 +1,2 @@
+export { default as LocalizationLanguageTable } from './languages/LocalizationLanguageTable.vue';
 export { default as LocalizationResourceTable } from './resources/LocalizationResourceTable.vue';
diff --git a/apps/vben5/packages/@abp/localization/src/components/languages/LocalizationLanguageModal.vue b/apps/vben5/packages/@abp/localization/src/components/languages/LocalizationLanguageModal.vue
new file mode 100644
index 000000000..096a9a2f0
--- /dev/null
+++ b/apps/vben5/packages/@abp/localization/src/components/languages/LocalizationLanguageModal.vue
@@ -0,0 +1,115 @@
+<script setup lang="ts">
+import type { FormInstance } from 'ant-design-vue';
+
+import type { LanguageDto } from '../../types/languages';
+
+import { defineEmits, defineOptions, ref, toValue, useTemplateRef } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+import { $t } from '@vben/locales';
+
+import { Form, Input, message } from 'ant-design-vue';
+
+import { useLanguagesApi } from '../../api/useLanguagesApi';
+
+defineOptions({
+  name: 'LocalizationLanguageModal',
+});
+const emits = defineEmits<{
+  (event: 'change', data: LanguageDto): void;
+}>();
+
+const FormItem = Form.Item;
+
+const defaultModel = {} as LanguageDto;
+
+const form = useTemplateRef<FormInstance>('form');
+const formModel = ref<LanguageDto>({ ...defaultModel });
+
+const { cancel, createApi, getApi, updateApi } = useLanguagesApi();
+const [Modal, modalApi] = useVbenModal({
+  class: 'w-1/2',
+  draggable: true,
+  fullscreenButton: false,
+  onCancel() {
+    modalApi.close();
+  },
+  onClosed() {
+    cancel('LocalizationLanguageModal has closed!');
+  },
+  onConfirm: onSubmit,
+  onOpenChange: async (isOpen: boolean) => {
+    if (isOpen) {
+      formModel.value = { ...defaultModel };
+      modalApi.setState({
+        title: $t('LocalizationManagement.Language:AddNew'),
+      });
+      const { cultureName } = modalApi.getData<LanguageDto>();
+      cultureName && (await onGet(cultureName));
+    }
+  },
+  title: $t('LocalizationManagement.Language:AddNew'),
+});
+async function onGet(name: string) {
+  try {
+    modalApi.setState({ loading: true });
+    const dto = await getApi(name);
+    formModel.value = dto;
+    modalApi.setState({
+      title: `${$t('AbpLocalization.Languages')} - ${dto.cultureName}`,
+    });
+  } finally {
+    modalApi.setState({ loading: false });
+  }
+}
+async function onSubmit() {
+  await form.value?.validate();
+  try {
+    modalApi.setState({ submitting: true });
+    const input = toValue(formModel);
+    const api = input.id
+      ? updateApi(input.cultureName, input)
+      : createApi(input);
+    const dto = await api;
+    message.success($t('AbpUi.SavedSuccessfully'));
+    emits('change', dto);
+    modalApi.close();
+  } finally {
+    modalApi.setState({ submitting: false });
+  }
+}
+</script>
+
+<template>
+  <Modal>
+    <Form
+      ref="form"
+      :label-col="{ span: 6 }"
+      :model="formModel"
+      :wrapper-col="{ span: 18 }"
+    >
+      <FormItem
+        :label="$t('AbpLocalization.DisplayName:CultureName')"
+        name="cultureName"
+        required
+      >
+        <Input v-model:value="formModel.cultureName" autocomplete="off" />
+      </FormItem>
+      <FormItem
+        :label="$t('AbpLocalization.DisplayName:UiCultureName')"
+        name="uiCultureName"
+      >
+        <Input v-model:value="formModel.uiCultureName" autocomplete="off" />
+      </FormItem>
+      <FormItem
+        :label="$t('AbpLocalization.DisplayName:DisplayName')"
+        name="displayName"
+        required
+      >
+        <Input v-model:value="formModel.displayName" autocomplete="off" />
+      </FormItem>
+    </Form>
+  </Modal>
+</template>
+
+<style scoped></style>
diff --git a/apps/vben5/packages/@abp/localization/src/components/languages/LocalizationLanguageTable.vue b/apps/vben5/packages/@abp/localization/src/components/languages/LocalizationLanguageTable.vue
new file mode 100644
index 000000000..20862327a
--- /dev/null
+++ b/apps/vben5/packages/@abp/localization/src/components/languages/LocalizationLanguageTable.vue
@@ -0,0 +1,240 @@
+<script setup lang="ts">
+import type { VbenFormProps, VxeGridListeners, VxeGridProps } from '@abp/ui';
+
+import type { LanguageDto } from '../../types/languages';
+
+import { defineAsyncComponent, h, onMounted, reactive, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+import { $t } from '@vben/locales';
+
+import {
+  useAbpStore,
+  useLocalization,
+  useLocalizationSerializer,
+} from '@abp/core';
+import { useVbenVxeGrid } from '@abp/ui';
+import {
+  DeleteOutlined,
+  EditOutlined,
+  PlusOutlined,
+} from '@ant-design/icons-vue';
+import { Button, message, Modal } from 'ant-design-vue';
+
+import { useLanguagesApi } from '../../api/useLanguagesApi';
+import { useLocalizationsApi } from '../../api/useLocalizationsApi';
+import { LanguagesPermissions } from '../../constants/permissions';
+
+defineOptions({
+  name: 'LocalizationLanguageTable',
+});
+
+const permissionGroups = ref<LanguageDto[]>([]);
+const pageState = reactive({
+  current: 1,
+  size: 10,
+  total: 0,
+});
+
+const abpStore = useAbpStore();
+const { Lr } = useLocalization();
+const { deserialize } = useLocalizationSerializer();
+const { deleteApi, getListApi } = useLanguagesApi();
+const { getLocalizationApi } = useLocalizationsApi();
+
+const formOptions: VbenFormProps = {
+  // 默认展开
+  collapsed: false,
+  handleReset: onReset,
+  async handleSubmit(params) {
+    pageState.current = 1;
+    await onGet(params);
+  },
+  schema: [
+    {
+      component: 'Input',
+      fieldName: 'filter',
+      formItemClass: 'col-span-2 items-baseline',
+      label: $t('AbpUi.Search'),
+    },
+  ],
+  // 控制表单是否显示折叠按钮
+  showCollapseButton: true,
+  // 按下回车时是否提交表单
+  submitOnEnter: true,
+};
+
+const gridOptions: VxeGridProps<LanguageDto> = {
+  columns: [
+    {
+      align: 'left',
+      field: 'cultureName',
+      minWidth: 150,
+      title: $t('AbpLocalization.DisplayName:CultureName'),
+    },
+    {
+      align: 'left',
+      field: 'displayName',
+      minWidth: 150,
+      title: $t('AbpLocalization.DisplayName:DisplayName'),
+    },
+    {
+      align: 'left',
+      field: 'uiCultureName',
+      minWidth: 150,
+      title: $t('AbpLocalization.DisplayName:UiCultureName'),
+    },
+    {
+      field: 'action',
+      fixed: 'right',
+      slots: { default: 'action' },
+      title: $t('AbpUi.Actions'),
+      width: 220,
+    },
+  ],
+  exportConfig: {},
+  keepSource: true,
+  toolbarConfig: {
+    custom: true,
+    export: true,
+    refresh: false,
+    zoom: true,
+  },
+};
+
+const gridEvents: VxeGridListeners<LanguageDto> = {
+  pageChange(params) {
+    pageState.current = params.currentPage;
+    pageState.size = params.pageSize;
+    onPageChange();
+  },
+};
+
+const [LocalizationLanguageModal, modalApi] = useVbenModal({
+  connectedComponent: defineAsyncComponent(
+    () => import('./LocalizationLanguageModal.vue'),
+  ),
+});
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  formOptions,
+  gridEvents,
+  gridOptions,
+});
+
+async function onGet(input?: Record<string, string>) {
+  try {
+    gridApi.setLoading(true);
+    const { items } = await getListApi(input);
+    pageState.total = items.length;
+    permissionGroups.value = items.map((item) => {
+      const localizableString = deserialize(item.displayName);
+      return {
+        ...item,
+        displayName: Lr(localizableString.resourceName, localizableString.name),
+      };
+    });
+    onPageChange();
+  } finally {
+    gridApi.setLoading(false);
+  }
+}
+
+async function onReset() {
+  await gridApi.formApi.resetForm();
+  const input = await gridApi.formApi.getValues();
+  await onGet(input);
+}
+
+function onPageChange() {
+  const items = permissionGroups.value.slice(
+    (pageState.current - 1) * pageState.size,
+    pageState.current * pageState.size,
+  );
+  gridApi.setGridOptions({
+    data: items,
+    pagerConfig: {
+      currentPage: pageState.current,
+      pageSize: pageState.size,
+      total: pageState.total,
+    },
+  });
+}
+
+function onCreate() {
+  modalApi.setData({});
+  modalApi.open();
+}
+
+function onUpdate(row: LanguageDto) {
+  modalApi.setData(row);
+  modalApi.open();
+}
+
+function onDelete(row: LanguageDto) {
+  Modal.confirm({
+    centered: true,
+    content: `${$t('AbpUi.ItemWillBeDeletedMessageWithFormat', [row.cultureName])}`,
+    onOk: async () => {
+      await deleteApi(row.cultureName);
+      message.success($t('AbpUi.DeletedSuccessfully'));
+      onChange();
+    },
+    title: $t('AbpUi.AreYouSure'),
+  });
+}
+
+async function onChange() {
+  gridApi.query();
+  // 资源变化刷新本地多语言缓存
+  const cultureName = abpStore.localization!.currentCulture.cultureName;
+  const localization = await getLocalizationApi({
+    cultureName,
+  });
+  abpStore.setLocalization(localization);
+}
+
+onMounted(onGet);
+</script>
+
+<template>
+  <Grid :table-title="$t('AbpLocalization.Languages')">
+    <template #toolbar-tools>
+      <Button
+        :icon="h(PlusOutlined)"
+        type="primary"
+        v-access:code="[LanguagesPermissions.Create]"
+        @click="onCreate"
+      >
+        {{ $t('LocalizationManagement.Language:AddNew') }}
+      </Button>
+    </template>
+    <template #action="{ row }">
+      <div class="flex flex-row">
+        <Button
+          :icon="h(EditOutlined)"
+          block
+          type="link"
+          v-access:code="[LanguagesPermissions.Update]"
+          @click="onUpdate(row)"
+        >
+          {{ $t('AbpUi.Edit') }}
+        </Button>
+        <Button
+          v-if="!row.isStatic"
+          :icon="h(DeleteOutlined)"
+          block
+          danger
+          type="link"
+          v-access:code="[LanguagesPermissions.Delete]"
+          @click="onDelete(row)"
+        >
+          {{ $t('AbpUi.Delete') }}
+        </Button>
+      </div>
+    </template>
+  </Grid>
+  <LocalizationLanguageModal @change="onChange" />
+</template>
+
+<style scoped></style>
diff --git a/apps/vben5/packages/@abp/localization/src/constants/permissions.ts b/apps/vben5/packages/@abp/localization/src/constants/permissions.ts
index f8efa3338..20a7fb03a 100644
--- a/apps/vben5/packages/@abp/localization/src/constants/permissions.ts
+++ b/apps/vben5/packages/@abp/localization/src/constants/permissions.ts
@@ -8,3 +8,13 @@ export const ResourcesPermissions = {
   /** 更新 */
   Update: 'LocalizationManagement.Resource.Update',
 };
+/** 语言管理权限 */
+export const LanguagesPermissions = {
+  /** 新增 */
+  Create: 'LocalizationManagement.Language.Create',
+  Default: 'LocalizationManagement.Language',
+  /** 删除 */
+  Delete: 'LocalizationManagement.Language.Delete',
+  /** 更新 */
+  Update: 'LocalizationManagement.Language.Update',
+};
diff --git a/apps/vben5/packages/@abp/localization/src/types/index.ts b/apps/vben5/packages/@abp/localization/src/types/index.ts
index 00e67e02e..62604a6ae 100644
--- a/apps/vben5/packages/@abp/localization/src/types/index.ts
+++ b/apps/vben5/packages/@abp/localization/src/types/index.ts
@@ -1 +1,2 @@
+export * from './languages';
 export * from './resources';
diff --git a/apps/vben5/packages/@abp/localization/src/types/languages.ts b/apps/vben5/packages/@abp/localization/src/types/languages.ts
new file mode 100644
index 000000000..8fd933704
--- /dev/null
+++ b/apps/vben5/packages/@abp/localization/src/types/languages.ts
@@ -0,0 +1,30 @@
+import type { AuditedEntityDto } from '@abp/core';
+
+interface LanguageDto extends AuditedEntityDto<string> {
+  cultureName: string;
+  displayName: string;
+  twoLetterISOLanguageName?: string;
+  uiCultureName: string;
+}
+
+interface LanguageGetListInput {
+  filter?: string;
+}
+
+interface LanguageCreateOrUpdateDto {
+  displayName: string;
+}
+
+interface LanguageCreateDto extends LanguageCreateOrUpdateDto {
+  cultureName: string;
+  uiCultureName?: string;
+}
+
+type LanguageUpdateDto = LanguageCreateOrUpdateDto;
+
+export type {
+  LanguageCreateDto,
+  LanguageDto,
+  LanguageGetListInput,
+  LanguageUpdateDto,
+};

From eea3c29a247f878f78562b6b06d2fd5744505dfc Mon Sep 17 00:00:00 2001
From: colin <colin.in@foxmail.com>
Date: Wed, 12 Mar 2025 18:02:56 +0800
Subject: [PATCH 3/6] feat(vben5): add texts manage

---
 .../app-antd/src/locales/langs/en-US/abp.json |   3 +-
 .../app-antd/src/locales/langs/zh-CN/abp.json |   3 +-
 .../app-antd/src/router/routes/modules/abp.ts |   9 +
 .../src/views/localization/texts/index.vue    |  15 +
 .../@abp/localization/src/api/useTextsApi.ts  |  62 ++++
 .../@abp/localization/src/components/index.ts |   1 +
 .../languages/LocalizationLanguageTable.vue   |  40 +--
 .../resources/LocalizationResourceTable.vue   |  23 +-
 .../texts/LocalizationTextModal.vue           | 196 +++++++++++
 .../texts/LocalizationTextTable.vue           | 317 ++++++++++++++++++
 .../@abp/localization/src/types/texts.ts      |  51 +++
 11 files changed, 677 insertions(+), 43 deletions(-)
 create mode 100644 apps/vben5/apps/app-antd/src/views/localization/texts/index.vue
 create mode 100644 apps/vben5/packages/@abp/localization/src/api/useTextsApi.ts
 create mode 100644 apps/vben5/packages/@abp/localization/src/components/texts/LocalizationTextModal.vue
 create mode 100644 apps/vben5/packages/@abp/localization/src/components/texts/LocalizationTextTable.vue
 create mode 100644 apps/vben5/packages/@abp/localization/src/types/texts.ts

diff --git a/apps/vben5/apps/app-antd/src/locales/langs/en-US/abp.json b/apps/vben5/apps/app-antd/src/locales/langs/en-US/abp.json
index 5156e2b28..920c5e943 100644
--- a/apps/vben5/apps/app-antd/src/locales/langs/en-US/abp.json
+++ b/apps/vben5/apps/app-antd/src/locales/langs/en-US/abp.json
@@ -49,7 +49,8 @@
     "localization": {
       "title": "Localization",
       "resources": "Resources",
-      "languages": "Languages"
+      "languages": "Languages",
+      "texts": "Texts"
     }
   },
   "openiddict": {
diff --git a/apps/vben5/apps/app-antd/src/locales/langs/zh-CN/abp.json b/apps/vben5/apps/app-antd/src/locales/langs/zh-CN/abp.json
index 5ea364714..23c6b717a 100644
--- a/apps/vben5/apps/app-antd/src/locales/langs/zh-CN/abp.json
+++ b/apps/vben5/apps/app-antd/src/locales/langs/zh-CN/abp.json
@@ -49,7 +49,8 @@
     "localization": {
       "title": "本地化管理",
       "resources": "资源管理",
-      "languages": "语言管理"
+      "languages": "语言管理",
+      "texts": "文档管理"
     }
   },
   "openiddict": {
diff --git a/apps/vben5/apps/app-antd/src/router/routes/modules/abp.ts b/apps/vben5/apps/app-antd/src/router/routes/modules/abp.ts
index 43b422883..cd842c657 100644
--- a/apps/vben5/apps/app-antd/src/router/routes/modules/abp.ts
+++ b/apps/vben5/apps/app-antd/src/router/routes/modules/abp.ts
@@ -203,6 +203,15 @@ const routes: RouteRecordRaw[] = [
                 component: () =>
                   import('#/views/localization/languages/index.vue'),
               },
+              {
+                meta: {
+                  title: $t('abp.manage.localization.texts'),
+                  icon: 'mi:text',
+                },
+                name: 'LocalizationTexts',
+                path: '/manage/localization/texts',
+                component: () => import('#/views/localization/texts/index.vue'),
+              },
             ],
           },
           {
diff --git a/apps/vben5/apps/app-antd/src/views/localization/texts/index.vue b/apps/vben5/apps/app-antd/src/views/localization/texts/index.vue
new file mode 100644
index 000000000..ac0169dc2
--- /dev/null
+++ b/apps/vben5/apps/app-antd/src/views/localization/texts/index.vue
@@ -0,0 +1,15 @@
+<script lang="ts" setup>
+import { Page } from '@vben/common-ui';
+
+import { LocalizationTextTable } from '@abp/localization';
+
+defineOptions({
+  name: 'LocalizationTexts',
+});
+</script>
+
+<template>
+  <Page>
+    <LocalizationTextTable />
+  </Page>
+</template>
diff --git a/apps/vben5/packages/@abp/localization/src/api/useTextsApi.ts b/apps/vben5/packages/@abp/localization/src/api/useTextsApi.ts
new file mode 100644
index 000000000..d3fa49576
--- /dev/null
+++ b/apps/vben5/packages/@abp/localization/src/api/useTextsApi.ts
@@ -0,0 +1,62 @@
+import type { ListResultDto } from '@abp/core';
+
+import type {
+  GetTextByKeyInput,
+  GetTextsInput,
+  SetTextInput,
+  TextDifferenceDto,
+  TextDto,
+} from '../types/texts';
+
+import { useRequest } from '@abp/request';
+
+export function useTextsApi() {
+  const { cancel, request } = useRequest();
+
+  /**
+   * 查询文本列表
+   * @param input 参数
+   * @returns 文本列表
+   */
+  function getListApi(
+    input: GetTextsInput,
+  ): Promise<ListResultDto<TextDifferenceDto>> {
+    return request<ListResultDto<TextDifferenceDto>>(
+      '/api/abp/localization/texts',
+      {
+        method: 'GET',
+        params: input,
+      },
+    );
+  }
+
+  /**
+   * 查询文本
+   * @param input 参数
+   * @returns 查询的文本
+   */
+  function getApi(input: GetTextByKeyInput): Promise<TextDto> {
+    return request<TextDto>('/api/abp/localization/texts/by-culture-key', {
+      method: 'GET',
+      params: input,
+    });
+  }
+
+  /**
+   * 设置文本
+   * @param input 参数
+   */
+  function setApi(input: SetTextInput): Promise<void> {
+    return request('/api/localization/texts', {
+      data: input,
+      method: 'PUT',
+    });
+  }
+
+  return {
+    cancel,
+    getApi,
+    getListApi,
+    setApi,
+  };
+}
diff --git a/apps/vben5/packages/@abp/localization/src/components/index.ts b/apps/vben5/packages/@abp/localization/src/components/index.ts
index a338e40b0..378940d70 100644
--- a/apps/vben5/packages/@abp/localization/src/components/index.ts
+++ b/apps/vben5/packages/@abp/localization/src/components/index.ts
@@ -1,2 +1,3 @@
 export { default as LocalizationLanguageTable } from './languages/LocalizationLanguageTable.vue';
 export { default as LocalizationResourceTable } from './resources/LocalizationResourceTable.vue';
+export { default as LocalizationTextTable } from './texts/LocalizationTextTable.vue';
diff --git a/apps/vben5/packages/@abp/localization/src/components/languages/LocalizationLanguageTable.vue b/apps/vben5/packages/@abp/localization/src/components/languages/LocalizationLanguageTable.vue
index 20862327a..9df0786f0 100644
--- a/apps/vben5/packages/@abp/localization/src/components/languages/LocalizationLanguageTable.vue
+++ b/apps/vben5/packages/@abp/localization/src/components/languages/LocalizationLanguageTable.vue
@@ -8,11 +8,7 @@ import { defineAsyncComponent, h, onMounted, reactive, ref } from 'vue';
 import { useVbenModal } from '@vben/common-ui';
 import { $t } from '@vben/locales';
 
-import {
-  useAbpStore,
-  useLocalization,
-  useLocalizationSerializer,
-} from '@abp/core';
+import { useAbpStore } from '@abp/core';
 import { useVbenVxeGrid } from '@abp/ui';
 import {
   DeleteOutlined,
@@ -29,7 +25,7 @@ defineOptions({
   name: 'LocalizationLanguageTable',
 });
 
-const permissionGroups = ref<LanguageDto[]>([]);
+const dataSource = ref<LanguageDto[]>([]);
 const pageState = reactive({
   current: 1,
   size: 10,
@@ -37,8 +33,6 @@ const pageState = reactive({
 });
 
 const abpStore = useAbpStore();
-const { Lr } = useLocalization();
-const { deserialize } = useLocalizationSerializer();
 const { deleteApi, getListApi } = useLanguagesApi();
 const { getLocalizationApi } = useLocalizationsApi();
 
@@ -127,13 +121,7 @@ async function onGet(input?: Record<string, string>) {
     gridApi.setLoading(true);
     const { items } = await getListApi(input);
     pageState.total = items.length;
-    permissionGroups.value = items.map((item) => {
-      const localizableString = deserialize(item.displayName);
-      return {
-        ...item,
-        displayName: Lr(localizableString.resourceName, localizableString.name),
-      };
-    });
+    dataSource.value = items;
     onPageChange();
   } finally {
     gridApi.setLoading(false);
@@ -147,7 +135,7 @@ async function onReset() {
 }
 
 function onPageChange() {
-  const items = permissionGroups.value.slice(
+  const items = dataSource.value.slice(
     (pageState.current - 1) * pageState.size,
     pageState.current * pageState.size,
   );
@@ -178,20 +166,24 @@ function onDelete(row: LanguageDto) {
     onOk: async () => {
       await deleteApi(row.cultureName);
       message.success($t('AbpUi.DeletedSuccessfully'));
-      onChange();
+      onChange(row);
     },
     title: $t('AbpUi.AreYouSure'),
   });
 }
 
-async function onChange() {
-  gridApi.query();
+async function onChange(data: LanguageDto) {
+  const input = await gridApi.formApi.getValues();
+  onGet(input);
   // 资源变化刷新本地多语言缓存
-  const cultureName = abpStore.localization!.currentCulture.cultureName;
-  const localization = await getLocalizationApi({
-    cultureName,
-  });
-  abpStore.setLocalization(localization);
+  const cultureName =
+    abpStore.application!.localization.currentCulture.cultureName;
+  if (data.cultureName === cultureName) {
+    const localization = await getLocalizationApi({
+      cultureName,
+    });
+    abpStore.setLocalization(localization);
+  }
 }
 
 onMounted(onGet);
diff --git a/apps/vben5/packages/@abp/localization/src/components/resources/LocalizationResourceTable.vue b/apps/vben5/packages/@abp/localization/src/components/resources/LocalizationResourceTable.vue
index 9aad82e66..ba6ead397 100644
--- a/apps/vben5/packages/@abp/localization/src/components/resources/LocalizationResourceTable.vue
+++ b/apps/vben5/packages/@abp/localization/src/components/resources/LocalizationResourceTable.vue
@@ -8,11 +8,7 @@ import { defineAsyncComponent, h, onMounted, reactive, ref } from 'vue';
 import { useVbenModal } from '@vben/common-ui';
 import { $t } from '@vben/locales';
 
-import {
-  useAbpStore,
-  useLocalization,
-  useLocalizationSerializer,
-} from '@abp/core';
+import { useAbpStore } from '@abp/core';
 import { useVbenVxeGrid } from '@abp/ui';
 import {
   DeleteOutlined,
@@ -29,7 +25,7 @@ defineOptions({
   name: 'LocalizationResourceTable',
 });
 
-const permissionGroups = ref<ResourceDto[]>([]);
+const dataSource = ref<ResourceDto[]>([]);
 const pageState = reactive({
   current: 1,
   size: 10,
@@ -37,8 +33,6 @@ const pageState = reactive({
 });
 
 const abpStore = useAbpStore();
-const { Lr } = useLocalization();
-const { deserialize } = useLocalizationSerializer();
 const { deleteApi, getListApi } = useResourcesApi();
 const { getLocalizationApi } = useLocalizationsApi();
 
@@ -121,13 +115,7 @@ async function onGet(input?: Record<string, string>) {
     gridApi.setLoading(true);
     const { items } = await getListApi(input);
     pageState.total = items.length;
-    permissionGroups.value = items.map((item) => {
-      const localizableString = deserialize(item.displayName);
-      return {
-        ...item,
-        displayName: Lr(localizableString.resourceName, localizableString.name),
-      };
-    });
+    dataSource.value = items;
     onPageChange();
   } finally {
     gridApi.setLoading(false);
@@ -141,7 +129,7 @@ async function onReset() {
 }
 
 function onPageChange() {
-  const items = permissionGroups.value.slice(
+  const items = dataSource.value.slice(
     (pageState.current - 1) * pageState.size,
     pageState.current * pageState.size,
   );
@@ -179,7 +167,8 @@ function onDelete(row: ResourceDto) {
 }
 
 async function onChange() {
-  gridApi.query();
+  const input = await gridApi.formApi.getValues();
+  onGet(input);
   // 资源变化刷新本地多语言缓存
   const cultureName = abpStore.localization!.currentCulture.cultureName;
   const localization = await getLocalizationApi({
diff --git a/apps/vben5/packages/@abp/localization/src/components/texts/LocalizationTextModal.vue b/apps/vben5/packages/@abp/localization/src/components/texts/LocalizationTextModal.vue
new file mode 100644
index 000000000..6d7f72c8d
--- /dev/null
+++ b/apps/vben5/packages/@abp/localization/src/components/texts/LocalizationTextModal.vue
@@ -0,0 +1,196 @@
+<script setup lang="ts">
+import type { FormInstance } from 'ant-design-vue';
+
+import type { LanguageDto } from '../../types/languages';
+import type { ResourceDto } from '../../types/resources';
+import type {
+  GetTextByKeyInput,
+  TextDifferenceDto,
+  TextDto,
+} from '../../types/texts';
+
+import {
+  defineEmits,
+  defineOptions,
+  onMounted,
+  ref,
+  toValue,
+  useTemplateRef,
+} from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+import { $t } from '@vben/locales';
+
+import { Form, Input, message, Select, Textarea } from 'ant-design-vue';
+
+import { useLanguagesApi } from '../../api/useLanguagesApi';
+import { useResourcesApi } from '../../api/useResourcesApi';
+import { useTextsApi } from '../../api/useTextsApi';
+
+defineOptions({
+  name: 'LocalizationTextModal',
+});
+const emits = defineEmits<{
+  (event: 'change', data: TextDto): void;
+}>();
+
+const FormItem = Form.Item;
+
+const defaultModel = {} as TextDto;
+
+const isEditModal = ref(false);
+const form = useTemplateRef<FormInstance>('form');
+const formModel = ref<TextDto>({ ...defaultModel });
+const resources = ref<ResourceDto[]>([]);
+const languages = ref<LanguageDto[]>([]);
+
+const { getListApi: getLanguagesApi } = useLanguagesApi();
+const { getListApi: getResourcesApi } = useResourcesApi();
+const { cancel, getApi, setApi } = useTextsApi();
+
+const [Modal, modalApi] = useVbenModal({
+  class: 'w-1/2',
+  draggable: true,
+  fullscreenButton: false,
+  onCancel() {
+    modalApi.close();
+  },
+  onClosed() {
+    cancel('LocalizationTextModal has closed!');
+  },
+  onConfirm: onSubmit,
+  onOpenChange: async (isOpen: boolean) => {
+    if (isOpen) {
+      isEditModal.value = false;
+      modalApi.setState({
+        title: $t('LocalizationManagement.Text:AddNew'),
+      });
+      const modalData = modalApi.getData<TextDifferenceDto>();
+      formModel.value = { ...modalData };
+      await onGet();
+    }
+  },
+  title: $t('LocalizationManagement.Text:AddNew'),
+});
+
+async function onInit() {
+  const [languageRes, resourceRes] = await Promise.all([
+    getLanguagesApi(),
+    getResourcesApi(),
+  ]);
+  languages.value = languageRes.items;
+  resources.value = resourceRes.items;
+}
+
+async function onGet() {
+  const dto = modalApi.getData<TextDifferenceDto>();
+  if (dto.targetCultureName) {
+    isEditModal.value = true;
+    await onLoad({
+      cultureName: dto.targetCultureName,
+      key: dto.key,
+      resourceName: dto.resourceName,
+    });
+  }
+}
+
+async function onLanguageChange(value: string) {
+  const dto = modalApi.getData<TextDifferenceDto>();
+  if (dto.targetCultureName) {
+    await onLoad({
+      cultureName: value,
+      key: dto.key,
+      resourceName: dto.resourceName,
+    });
+  }
+}
+
+async function onLoad(input: GetTextByKeyInput) {
+  try {
+    modalApi.setState({ loading: true });
+    const textDto = await getApi(input);
+    formModel.value = textDto;
+    modalApi.setState({
+      title: `${$t('AbpLocalization.Texts')} - ${textDto.key}`,
+    });
+  } finally {
+    modalApi.setState({ loading: false });
+  }
+}
+
+async function onSubmit() {
+  await form.value?.validate();
+  try {
+    modalApi.setState({ submitting: true });
+    const input = toValue(formModel);
+    await setApi(input);
+    message.success($t('AbpUi.SavedSuccessfully'));
+    emits('change', input);
+    modalApi.close();
+  } finally {
+    modalApi.setState({ submitting: false });
+  }
+}
+
+onMounted(onInit);
+</script>
+
+<template>
+  <Modal>
+    <Form
+      ref="form"
+      :label-col="{ span: 6 }"
+      :model="formModel"
+      :wrapper-col="{ span: 18 }"
+    >
+      <FormItem
+        :label="$t('AbpLocalization.DisplayName:CultureName')"
+        name="cultureName"
+        required
+      >
+        <Select
+          v-model:value="formModel.cultureName"
+          :options="languages"
+          :field-names="{ label: 'displayName', value: 'cultureName' }"
+          @change="(value) => onLanguageChange(value!.toString())"
+        />
+      </FormItem>
+      <FormItem
+        :label="$t('AbpLocalization.DisplayName:ResourceName')"
+        name="resourceName"
+        required
+      >
+        <Select
+          v-model:value="formModel.resourceName"
+          :options="resources"
+          :disabled="isEditModal"
+          :field-names="{ label: 'displayName', value: 'name' }"
+        />
+      </FormItem>
+      <FormItem
+        :label="$t('AbpLocalization.DisplayName:Key')"
+        name="key"
+        required
+      >
+        <Input
+          :disabled="isEditModal"
+          v-model:value="formModel.key"
+          autocomplete="off"
+        />
+      </FormItem>
+      <FormItem
+        :label="$t('AbpLocalization.DisplayName:Value')"
+        name="value"
+        required
+      >
+        <Textarea
+          :auto-size="{ minRows: 3 }"
+          v-model:value="formModel.value"
+          autocomplete="off"
+        />
+      </FormItem>
+    </Form>
+  </Modal>
+</template>
+
+<style scoped></style>
diff --git a/apps/vben5/packages/@abp/localization/src/components/texts/LocalizationTextTable.vue b/apps/vben5/packages/@abp/localization/src/components/texts/LocalizationTextTable.vue
new file mode 100644
index 000000000..4a97a67fa
--- /dev/null
+++ b/apps/vben5/packages/@abp/localization/src/components/texts/LocalizationTextTable.vue
@@ -0,0 +1,317 @@
+<script setup lang="ts">
+import type { VbenFormProps, VxeGridListeners, VxeGridProps } from '@abp/ui';
+
+import type { LanguageDto, ResourceDto } from '../../types';
+import type { TextDifferenceDto, TextDto } from '../../types/texts';
+
+import { defineAsyncComponent, h, onMounted, reactive, ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+import { $t } from '@vben/locales';
+
+import { useAbpStore } from '@abp/core';
+import { useVbenVxeGrid } from '@abp/ui';
+import { EditOutlined, PlusOutlined } from '@ant-design/icons-vue';
+import { Button, Select } from 'ant-design-vue';
+
+import { useLanguagesApi } from '../../api/useLanguagesApi';
+import { useLocalizationsApi } from '../../api/useLocalizationsApi';
+import { useResourcesApi } from '../../api/useResourcesApi';
+import { useTextsApi } from '../../api/useTextsApi';
+import { ResourcesPermissions } from '../../constants/permissions';
+
+defineOptions({
+  name: 'LocalizationTextTable',
+});
+
+const dataSource = ref<TextDifferenceDto[]>([]);
+const resources = ref<ResourceDto[]>([]);
+const languages = ref<LanguageDto[]>([]);
+const targetValueOptions = reactive([
+  {
+    label: $t('AbpLocalization.DisplayName:Any'),
+    value: 'false',
+  },
+  {
+    label: $t('AbpLocalization.DisplayName:OnlyNull'),
+    value: 'true',
+  },
+]);
+const pageState = reactive({
+  current: 1,
+  size: 10,
+  total: 0,
+});
+
+const abpStore = useAbpStore();
+const { getListApi } = useTextsApi();
+const { getListApi: getLanguagesApi } = useLanguagesApi();
+const { getListApi: getResourcesApi } = useResourcesApi();
+const { getLocalizationApi } = useLocalizationsApi();
+
+const formOptions: VbenFormProps = {
+  // 默认展开
+  collapsed: false,
+  collapsedRows: 2,
+  commonConfig: {
+    // 所有表单项
+    componentProps: {
+      class: 'w-full',
+    },
+  },
+  compact: false,
+  handleReset: onReset,
+  async handleSubmit(params) {
+    pageState.current = 1;
+    await onGet(params);
+  },
+  schema: [
+    {
+      component: 'Input',
+      fieldName: 'cultureName',
+      formItemClass: 'items-baseline',
+      label: $t('AbpLocalization.DisplayName:CultureName'),
+      rules: 'selectRequired',
+    },
+    {
+      component: 'Input',
+      fieldName: 'targetCultureName',
+      formItemClass: 'items-baseline',
+      label: $t('AbpLocalization.DisplayName:TargetCultureName'),
+      rules: 'selectRequired',
+    },
+    {
+      component: 'Input',
+      fieldName: 'resourceName',
+      label: $t('AbpLocalization.DisplayName:ResourceName'),
+    },
+    {
+      component: 'Input',
+      fieldName: 'onlyNull',
+      label: $t('AbpLocalization.DisplayName:TargetValue'),
+    },
+    {
+      component: 'Input',
+      fieldName: 'filter',
+      formItemClass: 'col-span-2 items-baseline',
+      label: $t('AbpUi.Search'),
+    },
+  ],
+  // 控制表单是否显示折叠按钮
+  showCollapseButton: true,
+  // 按下回车时是否提交表单
+  submitOnEnter: true,
+};
+
+const gridOptions: VxeGridProps<TextDifferenceDto> = {
+  columns: [
+    {
+      align: 'left',
+      field: 'key',
+      minWidth: 150,
+      title: $t('AbpLocalization.DisplayName:Key'),
+    },
+    {
+      align: 'left',
+      field: 'value',
+      minWidth: 150,
+      title: $t('AbpLocalization.DisplayName:Value'),
+    },
+    {
+      align: 'left',
+      field: 'targetValue',
+      minWidth: 150,
+      title: $t('AbpLocalization.DisplayName:TargetValue'),
+    },
+    {
+      align: 'left',
+      field: 'resourceName',
+      minWidth: 150,
+      title: $t('AbpLocalization.DisplayName:ResourceName'),
+    },
+    {
+      field: 'action',
+      fixed: 'right',
+      slots: { default: 'action' },
+      title: $t('AbpUi.Actions'),
+      width: 220,
+    },
+  ],
+  exportConfig: {},
+  keepSource: true,
+  toolbarConfig: {
+    custom: true,
+    export: true,
+    refresh: false,
+    zoom: true,
+  },
+};
+
+const gridEvents: VxeGridListeners<TextDifferenceDto> = {
+  pageChange(params) {
+    pageState.current = params.currentPage;
+    pageState.size = params.pageSize;
+    onPageChange();
+  },
+};
+
+const [Grid, gridApi] = useVbenVxeGrid({
+  formOptions,
+  gridEvents,
+  gridOptions,
+});
+
+const [LocalizationTextModal, modalApi] = useVbenModal({
+  connectedComponent: defineAsyncComponent(
+    () => import('./LocalizationTextModal.vue'),
+  ),
+});
+
+async function onInit() {
+  const [languageRes, resourceRes] = await Promise.all([
+    getLanguagesApi(),
+    getResourcesApi(),
+  ]);
+  languages.value = languageRes.items;
+  resources.value = resourceRes.items;
+}
+
+function onFieldChange(fieldName: string, value?: string) {
+  gridApi.formApi.setFieldValue(fieldName, value);
+}
+
+async function onGet(input: Record<string, string>) {
+  try {
+    gridApi.setLoading(true);
+    const { items } = await getListApi(input as any);
+    pageState.total = items.length;
+    dataSource.value = items;
+    onPageChange();
+  } finally {
+    gridApi.setLoading(false);
+  }
+}
+
+async function onReset() {
+  await gridApi.formApi.resetForm();
+  const input = await gridApi.formApi.getValues();
+  await onGet(input);
+}
+
+function onPageChange() {
+  const items = dataSource.value.slice(
+    (pageState.current - 1) * pageState.size,
+    pageState.current * pageState.size,
+  );
+  gridApi.setGridOptions({
+    data: items,
+    pagerConfig: {
+      currentPage: pageState.current,
+      pageSize: pageState.size,
+      total: pageState.total,
+    },
+  });
+}
+
+async function onCreate() {
+  const input = await gridApi.formApi.getValues();
+  modalApi.setData({
+    cultureName: input.targetCultureName,
+    resourceName: input.resourceName,
+  });
+  modalApi.open();
+}
+
+function onUpdate(row: TextDifferenceDto) {
+  modalApi.setData(row);
+  modalApi.open();
+}
+
+async function onChange(data: TextDto) {
+  const input = await gridApi.formApi.getValues();
+  onGet(input);
+  // 资源变化刷新本地多语言缓存
+  const cultureName =
+    abpStore.application!.localization.currentCulture.cultureName;
+  if (data.cultureName === cultureName) {
+    const localization = await getLocalizationApi({
+      cultureName,
+    });
+    abpStore.setLocalization(localization);
+  }
+}
+
+onMounted(onInit);
+</script>
+
+<template>
+  <Grid :table-title="$t('AbpLocalization.Texts')">
+    <template #form-cultureName="{ modelValue }">
+      <Select
+        class="w-full"
+        allow-clear
+        :options="languages"
+        :value="modelValue"
+        :field-names="{ label: 'displayName', value: 'cultureName' }"
+        @change="(value) => onFieldChange('cultureName', value?.toString())"
+      />
+    </template>
+    <template #form-targetCultureName="{ modelValue }">
+      <Select
+        class="w-full"
+        allow-clear
+        :options="languages"
+        :value="modelValue"
+        :field-names="{ label: 'displayName', value: 'cultureName' }"
+        @change="
+          (value) => onFieldChange('targetCultureName', value?.toString())
+        "
+      />
+    </template>
+    <template #form-resourceName="{ modelValue }">
+      <Select
+        class="w-full"
+        allow-clear
+        :options="resources"
+        :value="modelValue"
+        :field-names="{ label: 'displayName', value: 'name' }"
+        @change="(value) => onFieldChange('resourceName', value?.toString())"
+      />
+    </template>
+    <template #form-onlyNull="{ modelValue }">
+      <Select
+        class="w-full"
+        allow-clear
+        :options="targetValueOptions"
+        :value="modelValue"
+        @change="(value) => onFieldChange('onlyNull', value?.toString())"
+      />
+    </template>
+    <template #toolbar-tools>
+      <Button
+        :icon="h(PlusOutlined)"
+        type="primary"
+        v-access:code="[ResourcesPermissions.Create]"
+        @click="onCreate"
+      >
+        {{ $t('LocalizationManagement.Text:AddNew') }}
+      </Button>
+    </template>
+    <template #action="{ row }">
+      <div class="flex flex-row">
+        <Button
+          :icon="h(EditOutlined)"
+          block
+          type="link"
+          v-access:code="[ResourcesPermissions.Update]"
+          @click="onUpdate(row)"
+        >
+          {{ $t('AbpUi.Edit') }}
+        </Button>
+      </div>
+    </template>
+  </Grid>
+  <LocalizationTextModal @change="onChange" />
+</template>
+
+<style scoped></style>
diff --git a/apps/vben5/packages/@abp/localization/src/types/texts.ts b/apps/vben5/packages/@abp/localization/src/types/texts.ts
new file mode 100644
index 000000000..a5369bf79
--- /dev/null
+++ b/apps/vben5/packages/@abp/localization/src/types/texts.ts
@@ -0,0 +1,51 @@
+interface GetTextByKeyInput {
+  cultureName: string;
+  key: string;
+  resourceName: string;
+}
+
+interface GetTextsInput {
+  cultureName: string;
+  filter?: string;
+  onlyNull?: boolean;
+  resourceName?: string;
+  targetCultureName: string;
+}
+
+interface SetTextInput {
+  cultureName: string;
+  key: string;
+  resourceName: string;
+  value: string;
+}
+
+interface RestoreDefaultTextInput {
+  cultureName: string;
+  key: string;
+  resourceName: string;
+}
+
+interface TextDifferenceDto {
+  cultureName: string;
+  key: string;
+  resourceName: string;
+  targetCultureName: string;
+  targetValue: string;
+  value: string;
+}
+
+interface TextDto {
+  cultureName: string;
+  key: string;
+  resourceName: string;
+  value: string;
+}
+
+export type {
+  GetTextByKeyInput,
+  GetTextsInput,
+  RestoreDefaultTextInput,
+  SetTextInput,
+  TextDifferenceDto,
+  TextDto,
+};

From a9ac465932d7f38739b038bcff7bec51b4d07d49 Mon Sep 17 00:00:00 2001
From: colin <colin.in@foxmail.com>
Date: Wed, 12 Mar 2025 18:05:30 +0800
Subject: [PATCH 4/6] feat(vben5): Remove redundant multilingual apis

---
 .../app-antd/src/api/core/useAbpConfigApi.ts  | 23 +------------------
 apps/vben5/apps/app-antd/src/locales/index.ts |  5 ++--
 2 files changed, 3 insertions(+), 25 deletions(-)

diff --git a/apps/vben5/apps/app-antd/src/api/core/useAbpConfigApi.ts b/apps/vben5/apps/app-antd/src/api/core/useAbpConfigApi.ts
index 39715ab18..4eb9c3a94 100644
--- a/apps/vben5/apps/app-antd/src/api/core/useAbpConfigApi.ts
+++ b/apps/vben5/apps/app-antd/src/api/core/useAbpConfigApi.ts
@@ -1,7 +1,4 @@
-import type {
-  ApplicationConfigurationDto,
-  ApplicationLocalizationDto,
-} from '@abp/core';
+import type { ApplicationConfigurationDto } from '@abp/core';
 
 import { useRequest } from '@abp/request';
 
@@ -23,26 +20,8 @@ export function useAbpConfigApi() {
     );
   }
 
-  /**
-   * 获取应用程序语言
-   * @returns 本地化配置
-   */
-  function getLocalizationApi(options: {
-    cultureName: string;
-    onlyDynamics?: boolean;
-  }): Promise<ApplicationLocalizationDto> {
-    return request<ApplicationLocalizationDto>(
-      '/api/abp/application-localization',
-      {
-        params: options,
-        method: 'GET',
-      },
-    );
-  }
-
   return {
     cancel,
     getConfigApi,
-    getLocalizationApi,
   };
 }
diff --git a/apps/vben5/apps/app-antd/src/locales/index.ts b/apps/vben5/apps/app-antd/src/locales/index.ts
index d9d3c867e..f1b684e67 100644
--- a/apps/vben5/apps/app-antd/src/locales/index.ts
+++ b/apps/vben5/apps/app-antd/src/locales/index.ts
@@ -14,13 +14,12 @@ import {
 import { preferences } from '@vben/preferences';
 
 import { useAbpStore } from '@abp/core';
+import { useLocalizationsApi } from '@abp/localization';
 import antdEnLocale from 'ant-design-vue/es/locale/en_US';
 import antdDefaultLocale from 'ant-design-vue/es/locale/zh_CN';
 import dayjs from 'dayjs';
 import localizedFormat from 'dayjs/plugin/localizedFormat';
 
-import { useAbpConfigApi } from '#/api/core/useAbpConfigApi';
-
 const antdLocale = ref<Locale>(antdDefaultLocale);
 
 const modules = import.meta.glob('./langs/**/*.json');
@@ -105,7 +104,7 @@ async function loadAntdLocale(lang: SupportedLanguagesType) {
  */
 async function loadAbpLocale(lang: SupportedLanguagesType) {
   const abpStore = useAbpStore();
-  const { getLocalizationApi } = useAbpConfigApi();
+  const { getLocalizationApi } = useLocalizationsApi();
   let localization = abpStore.localization;
 
   if (lang !== localization?.currentCulture.cultureName) {

From 6209d143eaa35767b2792d31795c5337cf46fa94 Mon Sep 17 00:00:00 2001
From: colin <colin.in@foxmail.com>
Date: Wed, 12 Mar 2025 18:06:28 +0800
Subject: [PATCH 5/6] feat(vben5): Remove localization constants index

---
 apps/vben5/packages/@abp/localization/src/constants/index.ts | 1 -
 1 file changed, 1 deletion(-)
 delete mode 100644 apps/vben5/packages/@abp/localization/src/constants/index.ts

diff --git a/apps/vben5/packages/@abp/localization/src/constants/index.ts b/apps/vben5/packages/@abp/localization/src/constants/index.ts
deleted file mode 100644
index c85954d3e..000000000
--- a/apps/vben5/packages/@abp/localization/src/constants/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export * from './permissions';

From bc65b830c175e164437de2ef80f6dd270d4ee543 Mon Sep 17 00:00:00 2001
From: colin <colin.in@foxmail.com>
Date: Wed, 12 Mar 2025 20:18:47 +0800
Subject: [PATCH 6/6] fix(vben5): fixed useVbenForm Component not registed

---
 apps/vben5/apps/app-antd/src/adapter/form.ts  |  49 +++++
 apps/vben5/apps/app-antd/src/bootstrap.ts     |   2 +
 .../components/audit-logs/AuditLogTable.vue   |   8 +-
 .../@abp/core/src/constants/events.ts         |   2 +
 .../features/FeatureDefinitionModal.vue       |   4 +-
 .../features/FeatureDefinitionTable.vue       |   6 +-
 .../groups/FeatureGroupDefinitionModal.vue    |   4 +-
 .../groups/FeatureGroupDefinitionTable.vue    |   6 +-
 .../@abp/gdpr/src/components/GdprTable.vue    |   2 +-
 .../src/api/useOrganizationUnitsApi.ts        |   2 +-
 .../components/claim-types/ClaimTypeModal.vue |   4 +-
 .../components/claim-types/ClaimTypeTable.vue |   6 +-
 .../src/components/claims/ClaimModal.vue      |   4 +-
 .../src/components/claims/ClaimTable.vue      |   2 +-
 .../OrganizationUnitModal.vue                 |  15 +-
 .../OrganizationUnitRoleTable.vue             |  14 +-
 .../OrganizationUnitTree.vue                  |   2 +-
 .../OrganizationUnitUserTable.vue             |   6 +-
 .../organization-units/SelectMemberModal.vue  |   4 +-
 .../organization-units/SelectRoleModal.vue    |  12 +-
 .../src/components/roles/RoleModal.vue        |   4 +-
 .../src/components/roles/RoleTable.vue        |  18 +-
 .../security-logs/SecurityLogTable.vue        |   8 +-
 .../src/components/sessions/SessionTable.vue  |   4 +-
 .../src/components/users/UserLockModal.vue    |   8 +-
 .../src/components/users/UserModal.vue        |   8 +-
 .../components/users/UserPasswordModal.vue    |   4 +-
 .../src/components/users/UserTable.vue        |   6 +-
 .../@abp/identity/src/constants/index.ts      |   1 -
 .../vben5/packages/@abp/identity/src/index.ts |   2 +-
 .../languages/LocalizationLanguageTable.vue   |   4 +-
 .../resources/LocalizationResourceTable.vue   |   4 +-
 .../texts/LocalizationTextTable.vue           |  10 +-
 .../localization/src/constants/permissions.ts |  10 +
 .../NotificationGroupDefinitionModal.vue      |   4 +-
 .../NotificationGroupDefinitionTable.vue      |  12 +-
 .../NotificationDefinitionTable.vue           |   6 +-
 .../my-notifilers/MyNotificationTable.vue     |   6 +-
 .../applications/ApplicationModal.vue         |   4 +-
 .../applications/ApplicationSecretModal.vue   |  19 +-
 .../applications/ApplicationTable.vue         |   6 +-
 .../authorizations/AuthorizationTable.vue     |   6 +-
 .../src/components/scopes/ScopeModal.vue      |   4 +-
 .../src/components/scopes/ScopeTable.vue      |   6 +-
 .../src/components/tokens/TokenTable.vue      |   6 +-
 .../@abp/openiddict/src/constants/index.ts    |   1 -
 .../packages/@abp/openiddict/src/index.ts     |   1 -
 .../groups/PermissionGroupDefinitionModal.vue |   4 +-
 .../groups/PermissionGroupDefinitionTable.vue |   6 +-
 .../permissions/PermissionDefinitionModal.vue |   4 +-
 .../permissions/PermissionDefinitionTable.vue |   6 +-
 .../permissions/PermissionModal.vue           |  17 +-
 .../@abp/permissions/src/constants/index.ts   |   1 -
 .../messages/email/EmailMessageTable.vue      |   6 +-
 .../messages/sms/SmsMessageTable.vue          |   6 +-
 .../@abp/platform/src/constants/index.ts      |   1 -
 .../vben5/packages/@abp/platform/src/index.ts |   1 -
 .../src/components/editions/EditionModal.vue  |   3 +-
 .../src/components/editions/EditionTable.vue  |   6 +-
 .../src/components/tenants/TenantTable.vue    |   6 +-
 .../packages/@abp/saas/src/constants/index.ts |   1 -
 apps/vben5/packages/@abp/saas/src/index.ts    |   1 -
 .../@abp/settings/src/api/definitions.ts      |  77 --------
 .../packages/@abp/settings/src/api/index.ts   |   4 +-
 .../@abp/settings/src/api/settings.ts         |  84 ---------
 .../settings/src/api/useDefinitionsApi.ts     |  99 ++++++++++
 .../@abp/settings/src/api/useSettingsApi.ts   | 103 +++++++++++
 .../definitions/SettingDefinitionModal.vue    |   8 +-
 .../definitions/SettingDefinitionTable.vue    |   9 +-
 .../src/components/settings/SystemSetting.vue |  15 +-
 .../src/components/settings/UserSetting.vue   |   4 +-
 .../@abp/settings/src/constants/index.ts      |   1 -
 .../vben5/packages/@abp/settings/src/index.ts |   1 -
 .../@abp/ui/src/adapter/component/index.ts    | 172 ------------------
 .../packages/@abp/ui/src/adapter/form.ts      |  47 -----
 .../packages/@abp/ui/src/adapter/vxe-table.ts |   3 +-
 apps/vben5/packages/@abp/ui/src/index.ts      |   2 -
 77 files changed, 481 insertions(+), 543 deletions(-)
 create mode 100644 apps/vben5/apps/app-antd/src/adapter/form.ts
 delete mode 100644 apps/vben5/packages/@abp/identity/src/constants/index.ts
 delete mode 100644 apps/vben5/packages/@abp/openiddict/src/constants/index.ts
 delete mode 100644 apps/vben5/packages/@abp/permissions/src/constants/index.ts
 delete mode 100644 apps/vben5/packages/@abp/platform/src/constants/index.ts
 delete mode 100644 apps/vben5/packages/@abp/saas/src/constants/index.ts
 delete mode 100644 apps/vben5/packages/@abp/settings/src/api/definitions.ts
 delete mode 100644 apps/vben5/packages/@abp/settings/src/api/settings.ts
 create mode 100644 apps/vben5/packages/@abp/settings/src/api/useDefinitionsApi.ts
 create mode 100644 apps/vben5/packages/@abp/settings/src/api/useSettingsApi.ts
 delete mode 100644 apps/vben5/packages/@abp/settings/src/constants/index.ts
 delete mode 100644 apps/vben5/packages/@abp/ui/src/adapter/component/index.ts
 delete mode 100644 apps/vben5/packages/@abp/ui/src/adapter/form.ts

diff --git a/apps/vben5/apps/app-antd/src/adapter/form.ts b/apps/vben5/apps/app-antd/src/adapter/form.ts
new file mode 100644
index 000000000..4a55850ec
--- /dev/null
+++ b/apps/vben5/apps/app-antd/src/adapter/form.ts
@@ -0,0 +1,49 @@
+import type {
+  VbenFormSchema as FormSchema,
+  VbenFormProps,
+} from '@vben/common-ui';
+
+import type { ComponentType } from './component';
+
+import { setupVbenForm, useVbenForm as useForm, z } from '@vben/common-ui';
+import { $t } from '@vben/locales';
+
+async function initVbenForm() {
+  setupVbenForm<ComponentType>({
+    config: {
+      // ant design vue组件库默认都是 v-model:value
+      baseModelPropName: 'value',
+
+      // 一些组件是 v-model:checked 或者 v-model:fileList
+      modelPropNameMap: {
+        Checkbox: 'checked',
+        Radio: 'checked',
+        Switch: 'checked',
+        Upload: 'fileList',
+      },
+    },
+    defineRules: {
+      // 输入项目必填国际化适配
+      required: (value, _params, ctx) => {
+        if (value === undefined || value === null || value.length === 0) {
+          return $t('ui.formRules.required', [ctx.label]);
+        }
+        return true;
+      },
+      // 选择项目必填国际化适配
+      selectRequired: (value, _params, ctx) => {
+        if (value === undefined || value === null) {
+          return $t('ui.formRules.selectRequired', [ctx.label]);
+        }
+        return true;
+      },
+    },
+  });
+}
+
+const useVbenForm = useForm<ComponentType>;
+
+export { initVbenForm, useVbenForm, z };
+
+export type VbenFormSchema = FormSchema<ComponentType>;
+export type { VbenFormProps };
diff --git a/apps/vben5/apps/app-antd/src/bootstrap.ts b/apps/vben5/apps/app-antd/src/bootstrap.ts
index 1967cea94..520ec1e1f 100644
--- a/apps/vben5/apps/app-antd/src/bootstrap.ts
+++ b/apps/vben5/apps/app-antd/src/bootstrap.ts
@@ -12,6 +12,7 @@ import { useTitle } from '@vueuse/core';
 import { $t, setupI18n } from '#/locales';
 
 import { initComponentAdapter } from './adapter/component';
+import { initVbenForm } from './adapter/form';
 import { initRequestClient } from './adapter/request';
 import App from './app.vue';
 import { router } from './router';
@@ -19,6 +20,7 @@ import { router } from './router';
 async function bootstrap(namespace: string) {
   // 初始化组件适配器
   await initComponentAdapter();
+  await initVbenForm();
   initRequestClient();
 
   const app = createApp(App);
diff --git a/apps/vben5/packages/@abp/auditing/src/components/audit-logs/AuditLogTable.vue b/apps/vben5/packages/@abp/auditing/src/components/audit-logs/AuditLogTable.vue
index 5c2e29ad6..0b4b4a27e 100644
--- a/apps/vben5/packages/@abp/auditing/src/components/audit-logs/AuditLogTable.vue
+++ b/apps/vben5/packages/@abp/auditing/src/components/audit-logs/AuditLogTable.vue
@@ -1,6 +1,8 @@
 <script setup lang="ts">
 import type { SortOrder } from '@abp/core';
-import type { VbenFormProps, VxeGridListeners, VxeGridProps } from '@abp/ui';
+import type { VxeGridListeners, VxeGridProps } from '@abp/ui';
+
+import type { VbenFormProps } from '@vben/common-ui';
 
 import type { AuditLogDto } from '../../types/audit-logs';
 
@@ -273,7 +275,7 @@ async function onDelete(row: AuditLogDto) {
     content: $t('AbpUi.ItemWillBeDeletedMessage'),
     onOk: async () => {
       await deleteApi(row.id);
-      message.success($t('AbpUi.SuccessfullyDeleted'));
+      message.success($t('AbpUi.DeletedSuccessfully'));
       gridApi.query();
     },
     title: $t('AbpUi.AreYouSure'),
@@ -289,7 +291,7 @@ function onBulkDelete() {
         ids: toValue(selectedKeys),
       });
       selectedKeys.value = [];
-      message.success($t('AbpUi.SuccessfullyDeleted'));
+      message.success($t('AbpUi.DeletedSuccessfully'));
       gridApi.query();
     },
     title: $t('AbpUi.AreYouSure'),
diff --git a/apps/vben5/packages/@abp/core/src/constants/events.ts b/apps/vben5/packages/@abp/core/src/constants/events.ts
index eb2360775..9ee264faf 100644
--- a/apps/vben5/packages/@abp/core/src/constants/events.ts
+++ b/apps/vben5/packages/@abp/core/src/constants/events.ts
@@ -3,6 +3,8 @@ export const Events = {
   GetNotification: 'get-notification',
   /** 新通知消息 */
   NotificationRecevied: 'sys_notifications_recevied',
+  /** 权限变更事件 */
+  PermissionChange: 'sys_permission_change',
   /** 用户登录事件 */
   UserLogin: 'sys_user_login',
   /** 用户登出事件 */
diff --git a/apps/vben5/packages/@abp/features/src/components/definitions/features/FeatureDefinitionModal.vue b/apps/vben5/packages/@abp/features/src/components/definitions/features/FeatureDefinitionModal.vue
index 4b812dfa3..0fe59c2a4 100644
--- a/apps/vben5/packages/@abp/features/src/components/definitions/features/FeatureDefinitionModal.vue
+++ b/apps/vben5/packages/@abp/features/src/components/definitions/features/FeatureDefinitionModal.vue
@@ -165,7 +165,7 @@ const [Modal, modalApi] = useVbenModal({
     const api = isEditModel.value
       ? updateApi(formModel.value.name, input)
       : createApi(input);
-    modalApi.setState({ confirmLoading: true, loading: true });
+    modalApi.setState({ submitting: true });
     api
       .then((res) => {
         message.success($t('AbpUi.SavedSuccessfully'));
@@ -173,7 +173,7 @@ const [Modal, modalApi] = useVbenModal({
         modalApi.close();
       })
       .finally(() => {
-        modalApi.setState({ confirmLoading: false, loading: false });
+        modalApi.setState({ submitting: false });
       });
   },
   onOpenChange: async (isOpen: boolean) => {
diff --git a/apps/vben5/packages/@abp/features/src/components/definitions/features/FeatureDefinitionTable.vue b/apps/vben5/packages/@abp/features/src/components/definitions/features/FeatureDefinitionTable.vue
index 2ad85a924..192d61fb1 100644
--- a/apps/vben5/packages/@abp/features/src/components/definitions/features/FeatureDefinitionTable.vue
+++ b/apps/vben5/packages/@abp/features/src/components/definitions/features/FeatureDefinitionTable.vue
@@ -1,5 +1,7 @@
 <script setup lang="ts">
-import type { VbenFormProps, VxeGridListeners, VxeGridProps } from '@abp/ui';
+import type { VxeGridListeners, VxeGridProps } from '@abp/ui';
+
+import type { VbenFormProps } from '@vben/common-ui';
 
 import type { FeatureDefinitionDto } from '../../../types/definitions';
 import type { FeatureGroupDefinitionDto } from '../../../types/groups';
@@ -263,7 +265,7 @@ function onDelete(row: FeatureDefinitionDto) {
     content: `${$t('AbpUi.ItemWillBeDeletedMessageWithFormat', [row.name])}`,
     onOk: async () => {
       await deleteApi(row.name);
-      message.success($t('AbpUi.SuccessfullyDeleted'));
+      message.success($t('AbpUi.DeletedSuccessfully'));
       onGet();
     },
     title: $t('AbpUi.AreYouSure'),
diff --git a/apps/vben5/packages/@abp/features/src/components/definitions/groups/FeatureGroupDefinitionModal.vue b/apps/vben5/packages/@abp/features/src/components/definitions/groups/FeatureGroupDefinitionModal.vue
index 5c2d49b13..4b92e6b96 100644
--- a/apps/vben5/packages/@abp/features/src/components/definitions/groups/FeatureGroupDefinitionModal.vue
+++ b/apps/vben5/packages/@abp/features/src/components/definitions/groups/FeatureGroupDefinitionModal.vue
@@ -50,7 +50,7 @@ const [Modal, modalApi] = useVbenModal({
     const api = isEditModel.value
       ? updateApi(formModel.value.name, toValue(formModel))
       : createApi(toValue(formModel));
-    modalApi.setState({ confirmLoading: true, loading: true });
+    modalApi.setState({ submitting: true });
     api
       .then((res) => {
         message.success($t('AbpUi.SavedSuccessfully'));
@@ -58,7 +58,7 @@ const [Modal, modalApi] = useVbenModal({
         modalApi.close();
       })
       .finally(() => {
-        modalApi.setState({ confirmLoading: false, loading: false });
+        modalApi.setState({ submitting: false });
       });
   },
   onOpenChange: async (isOpen: boolean) => {
diff --git a/apps/vben5/packages/@abp/features/src/components/definitions/groups/FeatureGroupDefinitionTable.vue b/apps/vben5/packages/@abp/features/src/components/definitions/groups/FeatureGroupDefinitionTable.vue
index 4534a8fd7..fb771fa26 100644
--- a/apps/vben5/packages/@abp/features/src/components/definitions/groups/FeatureGroupDefinitionTable.vue
+++ b/apps/vben5/packages/@abp/features/src/components/definitions/groups/FeatureGroupDefinitionTable.vue
@@ -1,7 +1,9 @@
 <script setup lang="ts">
-import type { VbenFormProps, VxeGridListeners, VxeGridProps } from '@abp/ui';
+import type { VxeGridListeners, VxeGridProps } from '@abp/ui';
 import type { MenuInfo } from 'ant-design-vue/es/menu/src/interface';
 
+import type { VbenFormProps } from '@vben/common-ui';
+
 import type { FeatureGroupDefinitionDto } from '../../../types/groups';
 
 import { defineAsyncComponent, h, onMounted, reactive, ref } from 'vue';
@@ -193,7 +195,7 @@ function onDelete(row: FeatureGroupDefinitionDto) {
     content: `${$t('AbpUi.ItemWillBeDeletedMessageWithFormat', [row.name])}`,
     onOk: async () => {
       await deleteApi(row.name);
-      message.success($t('AbpUi.SuccessfullyDeleted'));
+      message.success($t('AbpUi.DeletedSuccessfully'));
       onGet();
     },
     title: $t('AbpUi.AreYouSure'),
diff --git a/apps/vben5/packages/@abp/gdpr/src/components/GdprTable.vue b/apps/vben5/packages/@abp/gdpr/src/components/GdprTable.vue
index a7cd54a6b..650e2bf1a 100644
--- a/apps/vben5/packages/@abp/gdpr/src/components/GdprTable.vue
+++ b/apps/vben5/packages/@abp/gdpr/src/components/GdprTable.vue
@@ -161,7 +161,7 @@ const onDelete = (row: GdprRequestDto) => {
       gridApi.setLoading(true);
       try {
         await deleteApi(row.id);
-        message.success($t('AbpUi.SuccessfullyDeleted'));
+        message.success($t('AbpUi.DeletedSuccessfully'));
         await gridApi.query();
       } finally {
         gridApi.setLoading(false);
diff --git a/apps/vben5/packages/@abp/identity/src/api/useOrganizationUnitsApi.ts b/apps/vben5/packages/@abp/identity/src/api/useOrganizationUnitsApi.ts
index adba78017..bc8fa2011 100644
--- a/apps/vben5/packages/@abp/identity/src/api/useOrganizationUnitsApi.ts
+++ b/apps/vben5/packages/@abp/identity/src/api/useOrganizationUnitsApi.ts
@@ -30,7 +30,7 @@ export function useOrganizationUnitsApi() {
   ): Promise<OrganizationUnitDto> {
     return request<OrganizationUnitDto>('/api/identity/organization-units', {
       data: input,
-      method: 'GET',
+      method: 'POST',
     });
   }
 
diff --git a/apps/vben5/packages/@abp/identity/src/components/claim-types/ClaimTypeModal.vue b/apps/vben5/packages/@abp/identity/src/components/claim-types/ClaimTypeModal.vue
index b232f40d4..cfb760d1f 100644
--- a/apps/vben5/packages/@abp/identity/src/components/claim-types/ClaimTypeModal.vue
+++ b/apps/vben5/packages/@abp/identity/src/components/claim-types/ClaimTypeModal.vue
@@ -70,7 +70,7 @@ const [Modal, modalApi] = useVbenModal({
     const api = formModel.value.id
       ? updateApi(formModel.value.id, toValue(formModel))
       : createApi(toValue(formModel));
-    modalApi.setState({ loading: true });
+    modalApi.setState({ submitting: true });
     api
       .then((res) => {
         message.success($t('AbpUi.Success'));
@@ -78,7 +78,7 @@ const [Modal, modalApi] = useVbenModal({
         modalApi.close();
       })
       .finally(() => {
-        modalApi.setState({ loading: false });
+        modalApi.setState({ submitting: false });
       });
   },
   onOpenChange: async (isOpen: boolean) => {
diff --git a/apps/vben5/packages/@abp/identity/src/components/claim-types/ClaimTypeTable.vue b/apps/vben5/packages/@abp/identity/src/components/claim-types/ClaimTypeTable.vue
index cd76be4cb..a8c4aaebd 100644
--- a/apps/vben5/packages/@abp/identity/src/components/claim-types/ClaimTypeTable.vue
+++ b/apps/vben5/packages/@abp/identity/src/components/claim-types/ClaimTypeTable.vue
@@ -1,7 +1,9 @@
 <script setup lang="ts">
-import type { VbenFormProps, VxeGridListeners, VxeGridProps } from '@abp/ui';
+import type { VxeGridListeners, VxeGridProps } from '@abp/ui';
 import type { MenuInfo } from 'ant-design-vue/es/menu/src/interface';
 
+import type { VbenFormProps } from '@vben/common-ui';
+
 import type { IdentityClaimTypeDto } from '../../types/claim-types';
 
 import { defineAsyncComponent, h } from 'vue';
@@ -184,7 +186,7 @@ const onDelete = (row: IdentityClaimTypeDto) => {
     },
     onOk: async () => {
       await deleteApi(row.id);
-      message.success($t('AbpUi.SuccessfullyDeleted'));
+      message.success($t('AbpUi.DeletedSuccessfully'));
       query();
     },
     title: $t('AbpUi.AreYouSure'),
diff --git a/apps/vben5/packages/@abp/identity/src/components/claims/ClaimModal.vue b/apps/vben5/packages/@abp/identity/src/components/claims/ClaimModal.vue
index 029479902..dfbfc6a1f 100644
--- a/apps/vben5/packages/@abp/identity/src/components/claims/ClaimModal.vue
+++ b/apps/vben5/packages/@abp/identity/src/components/claims/ClaimModal.vue
@@ -93,7 +93,7 @@ async function initAssignableClaims() {
 /** 提交声明类型变更 */
 async function onSubmit(values: Record<string, any>) {
   try {
-    modalApi.setState({ confirmLoading: true });
+    modalApi.setState({ submitting: true });
     const claimDto = modalApi.getData<IdentityClaimDto>();
     const api = claimDto.id
       ? updateApi({
@@ -109,7 +109,7 @@ async function onSubmit(values: Record<string, any>) {
     emits('change', values as IdentityClaimDto);
     modalApi.close();
   } finally {
-    modalApi.setState({ confirmLoading: false });
+    modalApi.setState({ submitting: false });
   }
 }
 </script>
diff --git a/apps/vben5/packages/@abp/identity/src/components/claims/ClaimTable.vue b/apps/vben5/packages/@abp/identity/src/components/claims/ClaimTable.vue
index 305720e43..e52ef683d 100644
--- a/apps/vben5/packages/@abp/identity/src/components/claims/ClaimTable.vue
+++ b/apps/vben5/packages/@abp/identity/src/components/claims/ClaimTable.vue
@@ -91,7 +91,7 @@ async function onDelete(row: IdentityClaimDto) {
     claimType: row.claimType,
     claimValue: row.claimValue,
   });
-  message.success($t('AbpUi.SuccessfullyDeleted'));
+  message.success($t('AbpUi.DeletedSuccessfully'));
   query();
   emits('onDelete');
 }
diff --git a/apps/vben5/packages/@abp/identity/src/components/organization-units/OrganizationUnitModal.vue b/apps/vben5/packages/@abp/identity/src/components/organization-units/OrganizationUnitModal.vue
index 7b9fcbf2f..aa8c5b4b5 100644
--- a/apps/vben5/packages/@abp/identity/src/components/organization-units/OrganizationUnitModal.vue
+++ b/apps/vben5/packages/@abp/identity/src/components/organization-units/OrganizationUnitModal.vue
@@ -5,11 +5,9 @@ import type {
   OrganizationUnitUpdateDto,
 } from '../../types/organization-units';
 
-import { useVbenModal } from '@vben/common-ui';
+import { useVbenForm, useVbenModal } from '@vben/common-ui';
 import { $t } from '@vben/locales';
 
-import { useVbenForm } from '@abp/ui';
-
 import { useOrganizationUnitsApi } from '../../api/useOrganizationUnitsApi';
 
 defineOptions({
@@ -103,17 +101,16 @@ const [Modal, modalApi] = useVbenModal({
 async function onSubmit(input: Record<string, any>) {
   try {
     modalApi.setState({
-      confirmLoading: true,
+      submitting: true,
     });
-    const api = input.id
-      ? updateApi(input.id, input as OrganizationUnitUpdateDto)
-      : createApi(input as OrganizationUnitCreateDto);
-    const dto = await api;
+    const dto = input.id
+      ? await updateApi(input.id, input as OrganizationUnitUpdateDto)
+      : await createApi(input as OrganizationUnitCreateDto);
     emits('change', dto);
     modalApi.close();
   } finally {
     modalApi.setState({
-      confirmLoading: false,
+      submitting: false,
     });
   }
 }
diff --git a/apps/vben5/packages/@abp/identity/src/components/organization-units/OrganizationUnitRoleTable.vue b/apps/vben5/packages/@abp/identity/src/components/organization-units/OrganizationUnitRoleTable.vue
index 6d55021d2..bc501fd02 100644
--- a/apps/vben5/packages/@abp/identity/src/components/organization-units/OrganizationUnitRoleTable.vue
+++ b/apps/vben5/packages/@abp/identity/src/components/organization-units/OrganizationUnitRoleTable.vue
@@ -1,4 +1,6 @@
 <script setup lang="ts">
+import type { VxeGridListeners, VxeGridProps } from '@abp/ui';
+
 import type { IdentityRoleDto } from '../../types/roles';
 
 import { computed, defineAsyncComponent, h, nextTick, watch } from 'vue';
@@ -7,11 +9,7 @@ import { useAccess } from '@vben/access';
 import { useVbenModal } from '@vben/common-ui';
 import { $t } from '@vben/locales';
 
-import {
-  useVbenVxeGrid,
-  type VxeGridListeners,
-  type VxeGridProps,
-} from '@abp/ui';
+import { useVbenVxeGrid } from '@abp/ui';
 import { DeleteOutlined, PlusOutlined } from '@ant-design/icons-vue';
 import { Button, Modal } from 'ant-design-vue';
 
@@ -137,8 +135,7 @@ const onShowRole = () => {
 const onCreateRole = async (roles: IdentityRoleDto[]) => {
   try {
     roleModalApi.setState({
-      closable: false,
-      confirmLoading: true,
+      submitting: true,
     });
     await addRoles(props.selectedKey!, {
       roleIds: roles.map((item) => item.id),
@@ -147,8 +144,7 @@ const onCreateRole = async (roles: IdentityRoleDto[]) => {
     await query();
   } finally {
     roleModalApi.setState({
-      closable: true,
-      confirmLoading: false,
+      submitting: false,
     });
   }
 };
diff --git a/apps/vben5/packages/@abp/identity/src/components/organization-units/OrganizationUnitTree.vue b/apps/vben5/packages/@abp/identity/src/components/organization-units/OrganizationUnitTree.vue
index 99f53aca3..bedf2aadb 100644
--- a/apps/vben5/packages/@abp/identity/src/components/organization-units/OrganizationUnitTree.vue
+++ b/apps/vben5/packages/@abp/identity/src/components/organization-units/OrganizationUnitTree.vue
@@ -137,7 +137,7 @@ function onDelete(id: string) {
     maskClosable: false,
     onOk: async () => {
       await deleteApi(id);
-      message.success($t('AbpUi.SuccessfullyDeleted'));
+      message.success($t('AbpUi.DeletedSuccessfully'));
       onRefresh();
     },
     title: $t('AbpUi.AreYouSure'),
diff --git a/apps/vben5/packages/@abp/identity/src/components/organization-units/OrganizationUnitUserTable.vue b/apps/vben5/packages/@abp/identity/src/components/organization-units/OrganizationUnitUserTable.vue
index 75e5c70bf..ce69c6c82 100644
--- a/apps/vben5/packages/@abp/identity/src/components/organization-units/OrganizationUnitUserTable.vue
+++ b/apps/vben5/packages/@abp/identity/src/components/organization-units/OrganizationUnitUserTable.vue
@@ -135,8 +135,7 @@ const onShowMember = () => {
 
 const onCreateMember = (users: IdentityUserDto[]) => {
   userModalApi.setState({
-    closable: false,
-    confirmLoading: true,
+    submitting: true,
   });
   addMembers(props.selectedKey!, {
     userIds: users.map((item) => item.id),
@@ -147,8 +146,7 @@ const onCreateMember = (users: IdentityUserDto[]) => {
     })
     .finally(() => {
       userModalApi.setState({
-        closable: true,
-        confirmLoading: false,
+        submitting: false,
       });
     });
 };
diff --git a/apps/vben5/packages/@abp/identity/src/components/organization-units/SelectMemberModal.vue b/apps/vben5/packages/@abp/identity/src/components/organization-units/SelectMemberModal.vue
index c60fedc98..7e3efbc4a 100644
--- a/apps/vben5/packages/@abp/identity/src/components/organization-units/SelectMemberModal.vue
+++ b/apps/vben5/packages/@abp/identity/src/components/organization-units/SelectMemberModal.vue
@@ -1,11 +1,13 @@
 <script setup lang="ts">
 import type { VxeGridListeners, VxeGridProps } from '@abp/ui';
 
+import type { VbenFormProps } from '@vben/common-ui';
+
 import type { IdentityUserDto } from '../../types/users';
 
 import { defineEmits, defineOptions, nextTick, ref, toValue } from 'vue';
 
-import { useVbenModal, type VbenFormProps } from '@vben/common-ui';
+import { useVbenModal } from '@vben/common-ui';
 import { $t } from '@vben/locales';
 
 import { useVbenVxeGrid } from '@abp/ui';
diff --git a/apps/vben5/packages/@abp/identity/src/components/organization-units/SelectRoleModal.vue b/apps/vben5/packages/@abp/identity/src/components/organization-units/SelectRoleModal.vue
index 2ccea7392..ec5e33f3f 100644
--- a/apps/vben5/packages/@abp/identity/src/components/organization-units/SelectRoleModal.vue
+++ b/apps/vben5/packages/@abp/identity/src/components/organization-units/SelectRoleModal.vue
@@ -1,16 +1,16 @@
 <script setup lang="ts">
+import type { VxeGridListeners, VxeGridProps } from '@abp/ui';
+
+import type { VbenFormProps } from '@vben/common-ui';
+
 import type { IdentityRoleDto } from '../../types/roles';
 
 import { defineEmits, defineOptions, nextTick, ref, toValue } from 'vue';
 
-import { useVbenModal, type VbenFormProps } from '@vben/common-ui';
+import { useVbenModal } from '@vben/common-ui';
 import { $t } from '@vben/locales';
 
-import {
-  useVbenVxeGrid,
-  type VxeGridListeners,
-  type VxeGridProps,
-} from '@abp/ui';
+import { useVbenVxeGrid } from '@abp/ui';
 
 import { useOrganizationUnitsApi } from '../../api/useOrganizationUnitsApi';
 
diff --git a/apps/vben5/packages/@abp/identity/src/components/roles/RoleModal.vue b/apps/vben5/packages/@abp/identity/src/components/roles/RoleModal.vue
index a0e810397..d06394c10 100644
--- a/apps/vben5/packages/@abp/identity/src/components/roles/RoleModal.vue
+++ b/apps/vben5/packages/@abp/identity/src/components/roles/RoleModal.vue
@@ -45,7 +45,7 @@ const [Modal, modalApi] = useVbenModal({
     const api = formModel.value.id
       ? updateApi(formModel.value.id, toValue(formModel))
       : createApi(toValue(formModel));
-    modalApi.setState({ loading: true });
+    modalApi.setState({ submitting: true });
     api
       .then((res) => {
         message.success($t('AbpUi.Success'));
@@ -53,7 +53,7 @@ const [Modal, modalApi] = useVbenModal({
         modalApi.close();
       })
       .finally(() => {
-        modalApi.setState({ loading: false });
+        modalApi.setState({ submitting: false });
       });
   },
   onOpenChange: async (isOpen: boolean) => {
diff --git a/apps/vben5/packages/@abp/identity/src/components/roles/RoleTable.vue b/apps/vben5/packages/@abp/identity/src/components/roles/RoleTable.vue
index 16395b787..2ea506927 100644
--- a/apps/vben5/packages/@abp/identity/src/components/roles/RoleTable.vue
+++ b/apps/vben5/packages/@abp/identity/src/components/roles/RoleTable.vue
@@ -1,7 +1,9 @@
 <script setup lang="ts">
-import type { VbenFormProps, VxeGridListeners, VxeGridProps } from '@abp/ui';
+import type { VxeGridListeners, VxeGridProps } from '@abp/ui';
 import type { MenuInfo } from 'ant-design-vue/es/menu/src/interface';
 
+import type { VbenFormProps } from '@vben/common-ui';
+
 import type { IdentityRoleDto } from '../../types/roles';
 
 import { defineAsyncComponent, h } from 'vue';
@@ -12,7 +14,7 @@ import { createIconifyIcon } from '@vben/icons';
 import { $t } from '@vben/locales';
 
 import { AuditLogPermissions, EntityChangeDrawer } from '@abp/auditing';
-import { useAbpStore, useFeatures } from '@abp/core';
+import { Events, useAbpStore, useEventBus, useFeatures } from '@abp/core';
 import { PermissionModal } from '@abp/permissions';
 import { useVbenVxeGrid } from '@abp/ui';
 import {
@@ -39,6 +41,7 @@ const RoleModal = defineAsyncComponent(() => import('./RoleModal.vue'));
 const ClaimModal = defineAsyncComponent(() => import('./RoleClaimModal.vue'));
 
 const abpStore = useAbpStore();
+const { publish } = useEventBus();
 const { isEnabled } = useFeatures();
 const { hasAccessByCodes } = useAccess();
 const { cancel, deleteApi, getPagedListApi } = useRolesApi();
@@ -143,7 +146,7 @@ const handleDelete = (row: IdentityRoleDto) => {
     },
     onOk: async () => {
       await deleteApi(row.id);
-      message.success($t('AbpUi.SuccessfullyDeleted'));
+      message.success($t('AbpUi.DeletedSuccessfully'));
       query();
     },
     title: $t('AbpUi.AreYouSure'),
@@ -179,6 +182,13 @@ const handleMenuClick = async (row: IdentityRoleDto, info: MenuInfo) => {
     }
   }
 };
+
+function onPermissionChange(_name: string, key: string) {
+  const roles = abpStore.application?.currentUser.roles ?? [];
+  if (roles.includes(key)) {
+    publish(Events.PermissionChange);
+  }
+}
 </script>
 
 <template>
@@ -271,7 +281,7 @@ const handleMenuClick = async (row: IdentityRoleDto, info: MenuInfo) => {
   </Grid>
   <RoleEditModal @change="() => query()" />
   <RoleClaimModal @change="query" />
-  <RolePermissionModal />
+  <RolePermissionModal @change="onPermissionChange" />
   <RoleChangeDrawer />
 </template>
 
diff --git a/apps/vben5/packages/@abp/identity/src/components/security-logs/SecurityLogTable.vue b/apps/vben5/packages/@abp/identity/src/components/security-logs/SecurityLogTable.vue
index 19d65cf6d..fc3d3ae42 100644
--- a/apps/vben5/packages/@abp/identity/src/components/security-logs/SecurityLogTable.vue
+++ b/apps/vben5/packages/@abp/identity/src/components/security-logs/SecurityLogTable.vue
@@ -1,6 +1,8 @@
 <script setup lang="ts">
 import type { SortOrder } from '@abp/core';
-import type { VbenFormProps, VxeGridListeners, VxeGridProps } from '@abp/ui';
+import type { VxeGridListeners, VxeGridProps } from '@abp/ui';
+
+import type { VbenFormProps } from '@vben/common-ui';
 
 import type { SecurityLogDto } from '../../types/security-logs';
 
@@ -223,7 +225,7 @@ function onDelete(row: SecurityLogDto) {
     },
     onOk: async () => {
       await deleteApi(row.id);
-      message.success($t('AbpUi.SuccessfullyDeleted'));
+      message.success($t('AbpUi.DeletedSuccessfully'));
       gridApi.query();
     },
     title: $t('AbpUi.AreYouSure'),
@@ -239,7 +241,7 @@ function onBulkDelete() {
         ids: toValue(selectedKeys),
       });
       selectedKeys.value = [];
-      message.success($t('AbpUi.SuccessfullyDeleted'));
+      message.success($t('AbpUi.DeletedSuccessfully'));
       gridApi.query();
     },
     title: $t('AbpUi.AreYouSure'),
diff --git a/apps/vben5/packages/@abp/identity/src/components/sessions/SessionTable.vue b/apps/vben5/packages/@abp/identity/src/components/sessions/SessionTable.vue
index a111f43f7..6830f98f1 100644
--- a/apps/vben5/packages/@abp/identity/src/components/sessions/SessionTable.vue
+++ b/apps/vben5/packages/@abp/identity/src/components/sessions/SessionTable.vue
@@ -1,7 +1,9 @@
 <script setup lang="ts">
-import type { VbenFormProps, VxeGridListeners, VxeGridProps } from '@abp/ui';
+import type { VxeGridListeners, VxeGridProps } from '@abp/ui';
 import type { SelectValue } from 'ant-design-vue/es/select';
 
+import type { VbenFormProps } from '@vben/common-ui';
+
 import type { IdentityUserDto } from '../../types';
 import type { IdentitySessionDto } from '../../types/sessions';
 
diff --git a/apps/vben5/packages/@abp/identity/src/components/users/UserLockModal.vue b/apps/vben5/packages/@abp/identity/src/components/users/UserLockModal.vue
index 8ed85b1b0..cec2c39f7 100644
--- a/apps/vben5/packages/@abp/identity/src/components/users/UserLockModal.vue
+++ b/apps/vben5/packages/@abp/identity/src/components/users/UserLockModal.vue
@@ -2,11 +2,9 @@
 <script setup lang="ts">
 import type { IdentityUserDto } from '../../types/users';
 
-import { useVbenModal } from '@vben/common-ui';
+import { useVbenForm, useVbenModal } from '@vben/common-ui';
 import { $t } from '@vben/locales';
 
-import { useVbenForm } from '@abp/ui';
-
 import { useUsersApi } from '../../api/useUsersApi';
 
 defineOptions({
@@ -109,7 +107,7 @@ const [Modal, modalApi] = useVbenModal({
 async function onSubmit(input: Record<string, any>) {
   try {
     modalApi.setState({
-      confirmLoading: true,
+      submitting: true,
     });
     const lockSeconds = input.type * input.seconds;
     await lockApi(input.userId, lockSeconds);
@@ -117,7 +115,7 @@ async function onSubmit(input: Record<string, any>) {
     modalApi.close();
   } finally {
     modalApi.setState({
-      confirmLoading: false,
+      submitting: false,
     });
   }
 }
diff --git a/apps/vben5/packages/@abp/identity/src/components/users/UserModal.vue b/apps/vben5/packages/@abp/identity/src/components/users/UserModal.vue
index cdae0967c..b6b9ebd76 100644
--- a/apps/vben5/packages/@abp/identity/src/components/users/UserModal.vue
+++ b/apps/vben5/packages/@abp/identity/src/components/users/UserModal.vue
@@ -79,7 +79,7 @@ const [Modal, modalApi] = useVbenModal({
     const api = formModel.value.id
       ? updateApi(formModel.value.id, toValue(formModel))
       : createApi(toValue(formModel));
-    modalApi.setState({ confirmLoading: true });
+    modalApi.setState({ submitting: true });
     api
       .then((res) => {
         message.success($t('AbpUi.SavedSuccessfully'));
@@ -87,7 +87,7 @@ const [Modal, modalApi] = useVbenModal({
         modalApi.close();
       })
       .finally(() => {
-        modalApi.setState({ confirmLoading: false });
+        modalApi.setState({ submitting: false });
       });
   },
   onOpenChange: async (isOpen: boolean) => {
@@ -291,8 +291,8 @@ async function onLoadOuChildren(node: EventDataNode) {
             }"
             :render="(item) => item.title"
             :titles="[
-              $t('AbpIdentityServer.Assigned'),
-              $t('AbpIdentityServer.Available'),
+              $t('AbpOpenIddict.Assigned'),
+              $t('AbpOpenIddict.Available'),
             ]"
             class="tree-transfer"
           />
diff --git a/apps/vben5/packages/@abp/identity/src/components/users/UserPasswordModal.vue b/apps/vben5/packages/@abp/identity/src/components/users/UserPasswordModal.vue
index bd6a3fe6b..8f901d98a 100644
--- a/apps/vben5/packages/@abp/identity/src/components/users/UserPasswordModal.vue
+++ b/apps/vben5/packages/@abp/identity/src/components/users/UserPasswordModal.vue
@@ -70,10 +70,10 @@ const [Modal, modalApi] = useVbenModal({
   },
   onConfirm: async () => {
     try {
-      modalApi.setState({ confirmLoading: true });
+      modalApi.setState({ submitting: true });
       await formApi.validateAndSubmitForm();
     } finally {
-      modalApi.setState({ confirmLoading: false });
+      modalApi.setState({ submitting: false });
     }
   },
   onOpenChange(isOpen) {
diff --git a/apps/vben5/packages/@abp/identity/src/components/users/UserTable.vue b/apps/vben5/packages/@abp/identity/src/components/users/UserTable.vue
index f786ee42f..232b8188d 100644
--- a/apps/vben5/packages/@abp/identity/src/components/users/UserTable.vue
+++ b/apps/vben5/packages/@abp/identity/src/components/users/UserTable.vue
@@ -1,7 +1,9 @@
 <script setup lang="ts">
-import type { VbenFormProps, VxeGridListeners, VxeGridProps } from '@abp/ui';
+import type { VxeGridListeners, VxeGridProps } from '@abp/ui';
 import type { MenuInfo } from 'ant-design-vue/es/menu/src/interface';
 
+import type { VbenFormProps } from '@vben/common-ui';
+
 import type { IdentityUserDto } from '../../types/users';
 
 import { computed, defineAsyncComponent, h } from 'vue';
@@ -200,7 +202,7 @@ const handleDelete = (row: IdentityUserDto) => {
     },
     onOk: async () => {
       await deleteApi(row.id);
-      message.success($t('AbpUi.SuccessfullyDeleted'));
+      message.success($t('AbpUi.DeletedSuccessfully'));
       query();
     },
     title: $t('AbpUi.AreYouSure'),
diff --git a/apps/vben5/packages/@abp/identity/src/constants/index.ts b/apps/vben5/packages/@abp/identity/src/constants/index.ts
deleted file mode 100644
index c85954d3e..000000000
--- a/apps/vben5/packages/@abp/identity/src/constants/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export * from './permissions';
diff --git a/apps/vben5/packages/@abp/identity/src/index.ts b/apps/vben5/packages/@abp/identity/src/index.ts
index f43dbaee0..e8affa2fe 100644
--- a/apps/vben5/packages/@abp/identity/src/index.ts
+++ b/apps/vben5/packages/@abp/identity/src/index.ts
@@ -1,4 +1,4 @@
 export * from './api';
 export * from './components';
-export * from './constants';
+export { UserLookupPermissions } from './constants/permissions';
 export * from './types';
diff --git a/apps/vben5/packages/@abp/localization/src/components/languages/LocalizationLanguageTable.vue b/apps/vben5/packages/@abp/localization/src/components/languages/LocalizationLanguageTable.vue
index 9df0786f0..e70fc11fe 100644
--- a/apps/vben5/packages/@abp/localization/src/components/languages/LocalizationLanguageTable.vue
+++ b/apps/vben5/packages/@abp/localization/src/components/languages/LocalizationLanguageTable.vue
@@ -1,5 +1,7 @@
 <script setup lang="ts">
-import type { VbenFormProps, VxeGridListeners, VxeGridProps } from '@abp/ui';
+import type { VxeGridListeners, VxeGridProps } from '@abp/ui';
+
+import type { VbenFormProps } from '@vben/common-ui';
 
 import type { LanguageDto } from '../../types/languages';
 
diff --git a/apps/vben5/packages/@abp/localization/src/components/resources/LocalizationResourceTable.vue b/apps/vben5/packages/@abp/localization/src/components/resources/LocalizationResourceTable.vue
index ba6ead397..3a1c6f7d0 100644
--- a/apps/vben5/packages/@abp/localization/src/components/resources/LocalizationResourceTable.vue
+++ b/apps/vben5/packages/@abp/localization/src/components/resources/LocalizationResourceTable.vue
@@ -1,5 +1,7 @@
 <script setup lang="ts">
-import type { VbenFormProps, VxeGridListeners, VxeGridProps } from '@abp/ui';
+import type { VxeGridListeners, VxeGridProps } from '@abp/ui';
+
+import type { VbenFormProps } from '@vben/common-ui';
 
 import type { ResourceDto } from '../../types/resources';
 
diff --git a/apps/vben5/packages/@abp/localization/src/components/texts/LocalizationTextTable.vue b/apps/vben5/packages/@abp/localization/src/components/texts/LocalizationTextTable.vue
index 4a97a67fa..4b0dada4e 100644
--- a/apps/vben5/packages/@abp/localization/src/components/texts/LocalizationTextTable.vue
+++ b/apps/vben5/packages/@abp/localization/src/components/texts/LocalizationTextTable.vue
@@ -1,5 +1,7 @@
 <script setup lang="ts">
-import type { VbenFormProps, VxeGridListeners, VxeGridProps } from '@abp/ui';
+import type { VxeGridListeners, VxeGridProps } from '@abp/ui';
+
+import type { VbenFormProps } from '@vben/common-ui';
 
 import type { LanguageDto, ResourceDto } from '../../types';
 import type { TextDifferenceDto, TextDto } from '../../types/texts';
@@ -18,7 +20,7 @@ import { useLanguagesApi } from '../../api/useLanguagesApi';
 import { useLocalizationsApi } from '../../api/useLocalizationsApi';
 import { useResourcesApi } from '../../api/useResourcesApi';
 import { useTextsApi } from '../../api/useTextsApi';
-import { ResourcesPermissions } from '../../constants/permissions';
+import { TextsPermissions } from '../../constants/permissions';
 
 defineOptions({
   name: 'LocalizationTextTable',
@@ -291,7 +293,7 @@ onMounted(onInit);
       <Button
         :icon="h(PlusOutlined)"
         type="primary"
-        v-access:code="[ResourcesPermissions.Create]"
+        v-access:code="[TextsPermissions.Create]"
         @click="onCreate"
       >
         {{ $t('LocalizationManagement.Text:AddNew') }}
@@ -303,7 +305,7 @@ onMounted(onInit);
           :icon="h(EditOutlined)"
           block
           type="link"
-          v-access:code="[ResourcesPermissions.Update]"
+          v-access:code="[TextsPermissions.Update]"
           @click="onUpdate(row)"
         >
           {{ $t('AbpUi.Edit') }}
diff --git a/apps/vben5/packages/@abp/localization/src/constants/permissions.ts b/apps/vben5/packages/@abp/localization/src/constants/permissions.ts
index 20a7fb03a..38d960450 100644
--- a/apps/vben5/packages/@abp/localization/src/constants/permissions.ts
+++ b/apps/vben5/packages/@abp/localization/src/constants/permissions.ts
@@ -18,3 +18,13 @@ export const LanguagesPermissions = {
   /** 更新 */
   Update: 'LocalizationManagement.Language.Update',
 };
+/** 文本管理权限 */
+export const TextsPermissions = {
+  /** 新增 */
+  Create: 'LocalizationManagement.Text.Create',
+  Default: 'LocalizationManagement.Text',
+  /** 删除 */
+  Delete: 'LocalizationManagement.Text.Delete',
+  /** 更新 */
+  Update: 'LocalizationManagement.Text.Update',
+};
diff --git a/apps/vben5/packages/@abp/notifications/src/components/definitions/groups/NotificationGroupDefinitionModal.vue b/apps/vben5/packages/@abp/notifications/src/components/definitions/groups/NotificationGroupDefinitionModal.vue
index 0b27ec15d..40929c16c 100644
--- a/apps/vben5/packages/@abp/notifications/src/components/definitions/groups/NotificationGroupDefinitionModal.vue
+++ b/apps/vben5/packages/@abp/notifications/src/components/definitions/groups/NotificationGroupDefinitionModal.vue
@@ -51,7 +51,7 @@ const [Modal, modalApi] = useVbenModal({
     const api = isEditModel.value
       ? updateApi(formModel.value.name, input)
       : createApi(input);
-    modalApi.setState({ confirmLoading: true, loading: true });
+    modalApi.setState({ submitting: true });
     api
       .then((res) => {
         message.success($t('AbpUi.SavedSuccessfully'));
@@ -59,7 +59,7 @@ const [Modal, modalApi] = useVbenModal({
         modalApi.close();
       })
       .finally(() => {
-        modalApi.setState({ confirmLoading: false, loading: false });
+        modalApi.setState({ submitting: false });
       });
   },
   onOpenChange: async (isOpen: boolean) => {
diff --git a/apps/vben5/packages/@abp/notifications/src/components/definitions/groups/NotificationGroupDefinitionTable.vue b/apps/vben5/packages/@abp/notifications/src/components/definitions/groups/NotificationGroupDefinitionTable.vue
index 7a1dff33f..67abc62ee 100644
--- a/apps/vben5/packages/@abp/notifications/src/components/definitions/groups/NotificationGroupDefinitionTable.vue
+++ b/apps/vben5/packages/@abp/notifications/src/components/definitions/groups/NotificationGroupDefinitionTable.vue
@@ -1,7 +1,9 @@
 <script setup lang="ts">
-import type { VbenFormProps, VxeGridListeners, VxeGridProps } from '@abp/ui';
+import type { VxeGridListeners, VxeGridProps } from '@abp/ui';
 import type { MenuInfo } from 'ant-design-vue/es/menu/src/interface';
 
+import type { VbenFormProps } from '@vben/common-ui';
+
 import type { NotificationGroupDefinitionDto } from '../../../types/groups';
 
 import { defineAsyncComponent, h, onMounted, reactive, ref } from 'vue';
@@ -34,7 +36,7 @@ defineOptions({
 const MenuItem = Menu.Item;
 const DefinitionIcon = createIconifyIcon('nimbus:notification');
 
-const permissionGroups = ref<NotificationGroupDefinitionDto[]>([]);
+const dataSource = ref<NotificationGroupDefinitionDto[]>([]);
 const pageState = reactive({
   current: 1,
   size: 10,
@@ -130,7 +132,7 @@ async function onGet(input?: Record<string, string>) {
     gridApi.setLoading(true);
     const { items } = await getListApi(input);
     pageState.total = items.length;
-    permissionGroups.value = items.map((item) => {
+    dataSource.value = items.map((item) => {
       const localizableString = deserialize(item.displayName);
       return {
         ...item,
@@ -150,7 +152,7 @@ async function onReset() {
 }
 
 function onPageChange() {
-  const items = permissionGroups.value.slice(
+  const items = dataSource.value.slice(
     (pageState.current - 1) * pageState.size,
     pageState.current * pageState.size,
   );
@@ -180,7 +182,7 @@ function onDelete(row: NotificationGroupDefinitionDto) {
     content: `${$t('AbpUi.ItemWillBeDeletedMessageWithFormat', [row.name])}`,
     onOk: async () => {
       await deleteApi(row.name);
-      message.success($t('AbpUi.SuccessfullyDeleted'));
+      message.success($t('AbpUi.DeletedSuccessfully'));
       onGet();
     },
     title: $t('AbpUi.AreYouSure'),
diff --git a/apps/vben5/packages/@abp/notifications/src/components/definitions/notifications/NotificationDefinitionTable.vue b/apps/vben5/packages/@abp/notifications/src/components/definitions/notifications/NotificationDefinitionTable.vue
index 888f87ca2..96762869f 100644
--- a/apps/vben5/packages/@abp/notifications/src/components/definitions/notifications/NotificationDefinitionTable.vue
+++ b/apps/vben5/packages/@abp/notifications/src/components/definitions/notifications/NotificationDefinitionTable.vue
@@ -1,7 +1,9 @@
 <script setup lang="ts">
-import type { VbenFormProps, VxeGridListeners, VxeGridProps } from '@abp/ui';
+import type { VxeGridListeners, VxeGridProps } from '@abp/ui';
 import type { MenuInfo } from 'ant-design-vue/es/menu/src/interface';
 
+import type { VbenFormProps } from '@vben/common-ui';
+
 import type { NotificationDefinitionDto } from '../../../types/definitions';
 import type { NotificationGroupDefinitionDto } from '../../../types/groups';
 
@@ -317,7 +319,7 @@ function onDelete(row: NotificationDefinitionDto) {
     content: `${$t('AbpUi.ItemWillBeDeletedMessageWithFormat', [row.name])}`,
     onOk: async () => {
       await deleteApi(row.name);
-      message.success($t('AbpUi.SuccessfullyDeleted'));
+      message.success($t('AbpUi.DeletedSuccessfully'));
       onGet();
     },
     title: $t('AbpUi.AreYouSure'),
diff --git a/apps/vben5/packages/@abp/notifications/src/components/my-notifilers/MyNotificationTable.vue b/apps/vben5/packages/@abp/notifications/src/components/my-notifilers/MyNotificationTable.vue
index 4ff70c04f..e59bb8a3e 100644
--- a/apps/vben5/packages/@abp/notifications/src/components/my-notifilers/MyNotificationTable.vue
+++ b/apps/vben5/packages/@abp/notifications/src/components/my-notifilers/MyNotificationTable.vue
@@ -1,7 +1,9 @@
 <script setup lang="ts">
-import type { VbenFormProps, VxeGridListeners, VxeGridProps } from '@abp/ui';
+import type { VxeGridListeners, VxeGridProps } from '@abp/ui';
 import type { MenuInfo } from 'ant-design-vue/es/menu/src/interface';
 
+import type { VbenFormProps } from '@vben/common-ui';
+
 import type { Notification } from '../../types/notifications';
 
 import { defineAsyncComponent, h, ref } from 'vue';
@@ -252,7 +254,7 @@ const onDelete = (row: Notification) => {
     },
     onOk: async () => {
       await deleteMyNotifilerApi(row.id);
-      message.success($t('AbpUi.SuccessfullyDeleted'));
+      message.success($t('AbpUi.DeletedSuccessfully'));
       await gridApi.query();
     },
     title: $t('AbpUi.AreYouSure'),
diff --git a/apps/vben5/packages/@abp/openiddict/src/components/applications/ApplicationModal.vue b/apps/vben5/packages/@abp/openiddict/src/components/applications/ApplicationModal.vue
index 193422668..b53b3122c 100644
--- a/apps/vben5/packages/@abp/openiddict/src/components/applications/ApplicationModal.vue
+++ b/apps/vben5/packages/@abp/openiddict/src/components/applications/ApplicationModal.vue
@@ -159,7 +159,7 @@ const [Modal, modalApi] = useVbenModal({
     const api = formModel.value.id
       ? updateApi(formModel.value.id, toValue(formModel))
       : createApi(toValue(formModel));
-    modalApi.setState({ confirmLoading: true, loading: true });
+    modalApi.setState({ submitting: true });
     api
       .then((res) => {
         message.success($t('AbpUi.SavedSuccessfully'));
@@ -167,7 +167,7 @@ const [Modal, modalApi] = useVbenModal({
         modalApi.close();
       })
       .finally(() => {
-        modalApi.setState({ confirmLoading: false, loading: false });
+        modalApi.setState({ submitting: false });
       });
   },
   onOpenChange: async (isOpen: boolean) => {
diff --git a/apps/vben5/packages/@abp/openiddict/src/components/applications/ApplicationSecretModal.vue b/apps/vben5/packages/@abp/openiddict/src/components/applications/ApplicationSecretModal.vue
index 2582de464..f2cfc80ea 100644
--- a/apps/vben5/packages/@abp/openiddict/src/components/applications/ApplicationSecretModal.vue
+++ b/apps/vben5/packages/@abp/openiddict/src/components/applications/ApplicationSecretModal.vue
@@ -71,13 +71,18 @@ async function onGet(id: string) {
   applicationModel.value = dto;
 }
 async function onSubmit(input: Record<string, any>) {
-  const dto = await updateApi(applicationModel.value!.id, {
-    ...applicationModel.value!,
-    clientSecret: input.clientSecret,
-  });
-  message.success($t('AbpUi.SavedSuccessfully'));
-  emits('change', dto);
-  modalApi.close();
+  try {
+    modalApi.setState({ submitting: true });
+    const dto = await updateApi(applicationModel.value!.id, {
+      ...applicationModel.value!,
+      clientSecret: input.clientSecret,
+    });
+    message.success($t('AbpUi.SavedSuccessfully'));
+    emits('change', dto);
+    modalApi.close();
+  } finally {
+    modalApi.setState({ submitting: false });
+  }
 }
 </script>
 
diff --git a/apps/vben5/packages/@abp/openiddict/src/components/applications/ApplicationTable.vue b/apps/vben5/packages/@abp/openiddict/src/components/applications/ApplicationTable.vue
index b4fc12d84..9c32c2566 100644
--- a/apps/vben5/packages/@abp/openiddict/src/components/applications/ApplicationTable.vue
+++ b/apps/vben5/packages/@abp/openiddict/src/components/applications/ApplicationTable.vue
@@ -1,7 +1,9 @@
 <script setup lang="ts">
-import type { VbenFormProps, VxeGridProps } from '@abp/ui';
+import type { VxeGridProps } from '@abp/ui';
 import type { MenuInfo } from 'ant-design-vue/es/menu/src/interface';
 
+import type { VbenFormProps } from '@vben/common-ui';
+
 import type { OpenIddictApplicationDto } from '../../types/applications';
 
 import { defineAsyncComponent, h } from 'vue';
@@ -178,7 +180,7 @@ const onDelete = (row: OpenIddictApplicationDto) => {
     content: `${$t('AbpUi.ItemWillBeDeletedMessageWithFormat', [row.clientId])}`,
     onOk: async () => {
       await deleteApi(row.id);
-      message.success($t('AbpUi.SuccessfullyDeleted'));
+      message.success($t('AbpUi.DeletedSuccessfully'));
       query();
     },
     title: $t('AbpUi.AreYouSure'),
diff --git a/apps/vben5/packages/@abp/openiddict/src/components/authorizations/AuthorizationTable.vue b/apps/vben5/packages/@abp/openiddict/src/components/authorizations/AuthorizationTable.vue
index 6ac815bee..44c241b45 100644
--- a/apps/vben5/packages/@abp/openiddict/src/components/authorizations/AuthorizationTable.vue
+++ b/apps/vben5/packages/@abp/openiddict/src/components/authorizations/AuthorizationTable.vue
@@ -1,7 +1,9 @@
 <script setup lang="ts">
-import type { VbenFormProps, VxeGridProps } from '@abp/ui';
+import type { VxeGridProps } from '@abp/ui';
 import type { SelectValue } from 'ant-design-vue/es/select';
 
+import type { VbenFormProps } from '@vben/common-ui';
+
 import type { OpenIddictApplicationDto } from '../../types';
 import type { OpenIddictAuthorizationDto } from '../../types/authorizations';
 
@@ -198,7 +200,7 @@ function onDelete(row: OpenIddictAuthorizationDto) {
     content: `${$t('AbpUi.ItemWillBeDeletedMessage')}`,
     onOk: async () => {
       await deleteApi(row.id);
-      message.success($t('AbpUi.SuccessfullyDeleted'));
+      message.success($t('AbpUi.DeletedSuccessfully'));
       gridApi.query();
     },
     title: $t('AbpUi.AreYouSure'),
diff --git a/apps/vben5/packages/@abp/openiddict/src/components/scopes/ScopeModal.vue b/apps/vben5/packages/@abp/openiddict/src/components/scopes/ScopeModal.vue
index 72958c6e4..dc2892d42 100644
--- a/apps/vben5/packages/@abp/openiddict/src/components/scopes/ScopeModal.vue
+++ b/apps/vben5/packages/@abp/openiddict/src/components/scopes/ScopeModal.vue
@@ -71,7 +71,7 @@ const [Modal, modalApi] = useVbenModal({
     const api = formModel.value.id
       ? updateApi(formModel.value.id, toValue(formModel))
       : createApi(toValue(formModel));
-    modalApi.setState({ confirmLoading: true, loading: true });
+    modalApi.setState({ submitting: true });
     api
       .then((res) => {
         message.success($t('AbpUi.SavedSuccessfully'));
@@ -79,7 +79,7 @@ const [Modal, modalApi] = useVbenModal({
         modalApi.close();
       })
       .finally(() => {
-        modalApi.setState({ confirmLoading: false, loading: false });
+        modalApi.setState({ submitting: false });
       });
   },
   onOpenChange: async (isOpen: boolean) => {
diff --git a/apps/vben5/packages/@abp/openiddict/src/components/scopes/ScopeTable.vue b/apps/vben5/packages/@abp/openiddict/src/components/scopes/ScopeTable.vue
index 18b0f33d1..e86b52ab9 100644
--- a/apps/vben5/packages/@abp/openiddict/src/components/scopes/ScopeTable.vue
+++ b/apps/vben5/packages/@abp/openiddict/src/components/scopes/ScopeTable.vue
@@ -1,7 +1,9 @@
 <script setup lang="ts">
-import type { VbenFormProps, VxeGridProps } from '@abp/ui';
+import type { VxeGridProps } from '@abp/ui';
 import type { MenuInfo } from 'ant-design-vue/es/menu/src/interface';
 
+import type { VbenFormProps } from '@vben/common-ui';
+
 import type { OpenIddictScopeDto } from '../../types/scopes';
 
 import { defineAsyncComponent, h } from 'vue';
@@ -146,7 +148,7 @@ const onDelete = (row: OpenIddictScopeDto) => {
     content: `${$t('AbpUi.ItemWillBeDeletedMessageWithFormat', [row.name])}`,
     onOk: async () => {
       await deleteApi(row.id);
-      message.success($t('AbpUi.SuccessfullyDeleted'));
+      message.success($t('AbpUi.DeletedSuccessfully'));
       query();
     },
     title: $t('AbpUi.AreYouSure'),
diff --git a/apps/vben5/packages/@abp/openiddict/src/components/tokens/TokenTable.vue b/apps/vben5/packages/@abp/openiddict/src/components/tokens/TokenTable.vue
index 6e1030b72..27de1865e 100644
--- a/apps/vben5/packages/@abp/openiddict/src/components/tokens/TokenTable.vue
+++ b/apps/vben5/packages/@abp/openiddict/src/components/tokens/TokenTable.vue
@@ -1,7 +1,9 @@
 <script setup lang="ts">
-import type { VbenFormProps, VxeGridProps } from '@abp/ui';
+import type { VxeGridProps } from '@abp/ui';
 import type { SelectValue } from 'ant-design-vue/es/select';
 
+import type { VbenFormProps } from '@vben/common-ui';
+
 import type { OpenIddictApplicationDto } from '../../types';
 import type { OpenIddictTokenDto } from '../../types/tokens';
 
@@ -222,7 +224,7 @@ function onDelete(row: OpenIddictTokenDto) {
     content: `${$t('AbpUi.ItemWillBeDeletedMessage')}`,
     onOk: async () => {
       await deleteApi(row.id);
-      message.success($t('AbpUi.SuccessfullyDeleted'));
+      message.success($t('AbpUi.DeletedSuccessfully'));
       gridApi.query();
     },
     title: $t('AbpUi.AreYouSure'),
diff --git a/apps/vben5/packages/@abp/openiddict/src/constants/index.ts b/apps/vben5/packages/@abp/openiddict/src/constants/index.ts
deleted file mode 100644
index c85954d3e..000000000
--- a/apps/vben5/packages/@abp/openiddict/src/constants/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export * from './permissions';
diff --git a/apps/vben5/packages/@abp/openiddict/src/index.ts b/apps/vben5/packages/@abp/openiddict/src/index.ts
index f43dbaee0..314dad0cd 100644
--- a/apps/vben5/packages/@abp/openiddict/src/index.ts
+++ b/apps/vben5/packages/@abp/openiddict/src/index.ts
@@ -1,4 +1,3 @@
 export * from './api';
 export * from './components';
-export * from './constants';
 export * from './types';
diff --git a/apps/vben5/packages/@abp/permissions/src/components/definitions/groups/PermissionGroupDefinitionModal.vue b/apps/vben5/packages/@abp/permissions/src/components/definitions/groups/PermissionGroupDefinitionModal.vue
index 5c1b786f8..d5044eaa6 100644
--- a/apps/vben5/packages/@abp/permissions/src/components/definitions/groups/PermissionGroupDefinitionModal.vue
+++ b/apps/vben5/packages/@abp/permissions/src/components/definitions/groups/PermissionGroupDefinitionModal.vue
@@ -50,7 +50,7 @@ const [Modal, modalApi] = useVbenModal({
     const api = isEditModel.value
       ? updateApi(formModel.value.name, toValue(formModel))
       : createApi(toValue(formModel));
-    modalApi.setState({ confirmLoading: true, loading: true });
+    modalApi.setState({ submitting: true });
     api
       .then((res) => {
         message.success($t('AbpUi.SavedSuccessfully'));
@@ -58,7 +58,7 @@ const [Modal, modalApi] = useVbenModal({
         modalApi.close();
       })
       .finally(() => {
-        modalApi.setState({ confirmLoading: false, loading: false });
+        modalApi.setState({ submitting: false });
       });
   },
   onOpenChange: async (isOpen: boolean) => {
diff --git a/apps/vben5/packages/@abp/permissions/src/components/definitions/groups/PermissionGroupDefinitionTable.vue b/apps/vben5/packages/@abp/permissions/src/components/definitions/groups/PermissionGroupDefinitionTable.vue
index acf44b18f..857ad85b0 100644
--- a/apps/vben5/packages/@abp/permissions/src/components/definitions/groups/PermissionGroupDefinitionTable.vue
+++ b/apps/vben5/packages/@abp/permissions/src/components/definitions/groups/PermissionGroupDefinitionTable.vue
@@ -1,7 +1,9 @@
 <script setup lang="ts">
-import type { VbenFormProps, VxeGridListeners, VxeGridProps } from '@abp/ui';
+import type { VxeGridListeners, VxeGridProps } from '@abp/ui';
 import type { MenuInfo } from 'ant-design-vue/es/menu/src/interface';
 
+import type { VbenFormProps } from '@vben/common-ui';
+
 import type { PermissionGroupDefinitionDto } from '../../../types/groups';
 
 import { defineAsyncComponent, h, onMounted, reactive, ref } from 'vue';
@@ -193,7 +195,7 @@ function onDelete(row: PermissionGroupDefinitionDto) {
     content: `${$t('AbpUi.ItemWillBeDeletedMessageWithFormat', [row.name])}`,
     onOk: async () => {
       await deleteApi(row.name);
-      message.success($t('AbpUi.SuccessfullyDeleted'));
+      message.success($t('AbpUi.DeletedSuccessfully'));
       onGet();
     },
     title: $t('AbpUi.AreYouSure'),
diff --git a/apps/vben5/packages/@abp/permissions/src/components/definitions/permissions/PermissionDefinitionModal.vue b/apps/vben5/packages/@abp/permissions/src/components/definitions/permissions/PermissionDefinitionModal.vue
index 42439ac20..84371bfce 100644
--- a/apps/vben5/packages/@abp/permissions/src/components/definitions/permissions/PermissionDefinitionModal.vue
+++ b/apps/vben5/packages/@abp/permissions/src/components/definitions/permissions/PermissionDefinitionModal.vue
@@ -82,7 +82,7 @@ const [Modal, modalApi] = useVbenModal({
     const api = isEditModel.value
       ? updateApi(formModel.value.name, toValue(formModel))
       : createApi(toValue(formModel));
-    modalApi.setState({ confirmLoading: true, loading: true });
+    modalApi.setState({ submitting: true });
     api
       .then((res) => {
         message.success($t('AbpUi.SavedSuccessfully'));
@@ -90,7 +90,7 @@ const [Modal, modalApi] = useVbenModal({
         modalApi.close();
       })
       .finally(() => {
-        modalApi.setState({ confirmLoading: false, loading: false });
+        modalApi.setState({ submitting: false });
       });
   },
   onOpenChange: async (isOpen: boolean) => {
diff --git a/apps/vben5/packages/@abp/permissions/src/components/definitions/permissions/PermissionDefinitionTable.vue b/apps/vben5/packages/@abp/permissions/src/components/definitions/permissions/PermissionDefinitionTable.vue
index 334fa4a40..4a438e1cf 100644
--- a/apps/vben5/packages/@abp/permissions/src/components/definitions/permissions/PermissionDefinitionTable.vue
+++ b/apps/vben5/packages/@abp/permissions/src/components/definitions/permissions/PermissionDefinitionTable.vue
@@ -1,5 +1,7 @@
 <script setup lang="ts">
-import type { VbenFormProps, VxeGridListeners, VxeGridProps } from '@abp/ui';
+import type { VxeGridListeners, VxeGridProps } from '@abp/ui';
+
+import type { VbenFormProps } from '@vben/common-ui';
 
 import type { PermissionDefinitionDto } from '../../../types/definitions';
 import type { PermissionGroupDefinitionDto } from '../../../types/groups';
@@ -259,7 +261,7 @@ function onDelete(row: PermissionDefinitionDto) {
     content: `${$t('AbpUi.ItemWillBeDeletedMessageWithFormat', [row.name])}`,
     onOk: async () => {
       await deleteApi(row.name);
-      message.success($t('AbpUi.SuccessfullyDeleted'));
+      message.success($t('AbpUi.DeletedSuccessfully'));
       onGet();
     },
     title: $t('AbpUi.AreYouSure'),
diff --git a/apps/vben5/packages/@abp/permissions/src/components/permissions/PermissionModal.vue b/apps/vben5/packages/@abp/permissions/src/components/permissions/PermissionModal.vue
index ba49f6bd3..ec5ad2289 100644
--- a/apps/vben5/packages/@abp/permissions/src/components/permissions/PermissionModal.vue
+++ b/apps/vben5/packages/@abp/permissions/src/components/permissions/PermissionModal.vue
@@ -31,6 +31,10 @@ defineOptions({
   name: 'PermissionModal',
 });
 
+const emits = defineEmits<{
+  (event: 'change', name: string, key?: string): void;
+}>();
+
 const TabPane = Tabs.TabPane;
 
 interface ModalState {
@@ -92,13 +96,14 @@ const [Modal, modalApi] = useVbenModal({
     const permissions = toPermissionList(permissionTree.value);
     try {
       modalApi.setState({
-        closable: false,
-        confirmLoading: true,
+        submitting: true,
       });
+      const providerName = modelState.value!.providerName;
+      const providerKey = modelState.value!.providerKey;
       await updateApi(
         {
-          providerKey: modelState.value!.providerKey,
-          providerName: modelState.value!.providerName,
+          providerKey,
+          providerName,
         },
         {
           permissions,
@@ -106,10 +111,10 @@ const [Modal, modalApi] = useVbenModal({
       );
       message.success($t('AbpUi.SavedSuccessfully'));
       modalApi.close();
+      emits('change', providerName, providerKey);
     } finally {
       modalApi.setState({
-        closable: true,
-        confirmLoading: false,
+        submitting: false,
       });
     }
   },
diff --git a/apps/vben5/packages/@abp/permissions/src/constants/index.ts b/apps/vben5/packages/@abp/permissions/src/constants/index.ts
deleted file mode 100644
index c85954d3e..000000000
--- a/apps/vben5/packages/@abp/permissions/src/constants/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export * from './permissions';
diff --git a/apps/vben5/packages/@abp/platform/src/components/messages/email/EmailMessageTable.vue b/apps/vben5/packages/@abp/platform/src/components/messages/email/EmailMessageTable.vue
index d8a249192..f52603222 100644
--- a/apps/vben5/packages/@abp/platform/src/components/messages/email/EmailMessageTable.vue
+++ b/apps/vben5/packages/@abp/platform/src/components/messages/email/EmailMessageTable.vue
@@ -1,7 +1,9 @@
 <script setup lang="ts">
-import type { VbenFormProps, VxeGridProps } from '@abp/ui';
+import type { VxeGridProps } from '@abp/ui';
 import type { MenuInfo } from 'ant-design-vue/es/menu/src/interface';
 
+import type { VbenFormProps } from '@vben/common-ui';
+
 import type { EmailMessageDto } from '../../../types/messages';
 
 import { defineAsyncComponent, h } from 'vue';
@@ -226,7 +228,7 @@ function onDelete(row: EmailMessageDto) {
       try {
         gridApi.setLoading(true);
         await deleteApi(row.id);
-        message.success($t('AbpUi.SuccessfullyDeleted'));
+        message.success($t('AbpUi.DeletedSuccessfully'));
         gridApi.query();
       } finally {
         gridApi.setLoading(false);
diff --git a/apps/vben5/packages/@abp/platform/src/components/messages/sms/SmsMessageTable.vue b/apps/vben5/packages/@abp/platform/src/components/messages/sms/SmsMessageTable.vue
index b805b457e..e4c0ddca7 100644
--- a/apps/vben5/packages/@abp/platform/src/components/messages/sms/SmsMessageTable.vue
+++ b/apps/vben5/packages/@abp/platform/src/components/messages/sms/SmsMessageTable.vue
@@ -1,7 +1,9 @@
 <script setup lang="ts">
-import type { VbenFormProps, VxeGridProps } from '@abp/ui';
+import type { VxeGridProps } from '@abp/ui';
 import type { MenuInfo } from 'ant-design-vue/es/menu/src/interface';
 
+import type { VbenFormProps } from '@vben/common-ui';
+
 import type { SmsMessageDto } from '../../../types/messages';
 
 import { h } from 'vue';
@@ -198,7 +200,7 @@ function onDelete(row: SmsMessageDto) {
       try {
         gridApi.setLoading(true);
         await deleteApi(row.id);
-        message.success($t('AbpUi.SuccessfullyDeleted'));
+        message.success($t('AbpUi.DeletedSuccessfully'));
         gridApi.query();
       } finally {
         gridApi.setLoading(false);
diff --git a/apps/vben5/packages/@abp/platform/src/constants/index.ts b/apps/vben5/packages/@abp/platform/src/constants/index.ts
deleted file mode 100644
index c85954d3e..000000000
--- a/apps/vben5/packages/@abp/platform/src/constants/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export * from './permissions';
diff --git a/apps/vben5/packages/@abp/platform/src/index.ts b/apps/vben5/packages/@abp/platform/src/index.ts
index f43dbaee0..314dad0cd 100644
--- a/apps/vben5/packages/@abp/platform/src/index.ts
+++ b/apps/vben5/packages/@abp/platform/src/index.ts
@@ -1,4 +1,3 @@
 export * from './api';
 export * from './components';
-export * from './constants';
 export * from './types';
diff --git a/apps/vben5/packages/@abp/saas/src/components/editions/EditionModal.vue b/apps/vben5/packages/@abp/saas/src/components/editions/EditionModal.vue
index 03a5dc9a0..39277c1d4 100644
--- a/apps/vben5/packages/@abp/saas/src/components/editions/EditionModal.vue
+++ b/apps/vben5/packages/@abp/saas/src/components/editions/EditionModal.vue
@@ -3,10 +3,9 @@ import type { EditionDto } from '../../types';
 
 import { ref } from 'vue';
 
-import { useVbenModal } from '@vben/common-ui';
+import { useVbenForm, useVbenModal } from '@vben/common-ui';
 import { $t } from '@vben/locales';
 
-import { useVbenForm } from '@abp/ui';
 import { message } from 'ant-design-vue';
 
 import { useEditionsApi } from '../../api';
diff --git a/apps/vben5/packages/@abp/saas/src/components/editions/EditionTable.vue b/apps/vben5/packages/@abp/saas/src/components/editions/EditionTable.vue
index 71a8fc7a0..601b3ff8f 100644
--- a/apps/vben5/packages/@abp/saas/src/components/editions/EditionTable.vue
+++ b/apps/vben5/packages/@abp/saas/src/components/editions/EditionTable.vue
@@ -1,7 +1,9 @@
 <script setup lang="ts">
-import type { VbenFormProps, VxeGridListeners, VxeGridProps } from '@abp/ui';
+import type { VxeGridListeners, VxeGridProps } from '@abp/ui';
 import type { MenuInfo } from 'ant-design-vue/es/menu/src/interface';
 
+import type { VbenFormProps } from '@vben/common-ui';
+
 import type { EditionDto } from '../../types/editions';
 
 import { defineAsyncComponent, h } from 'vue';
@@ -142,7 +144,7 @@ const onDelete = (row: EditionDto) => {
     },
     onOk: async () => {
       await deleteApi(row.id);
-      message.success($t('AbpUi.SuccessfullyDeleted'));
+      message.success($t('AbpUi.DeletedSuccessfully'));
       query();
     },
     title: $t('AbpUi.AreYouSure'),
diff --git a/apps/vben5/packages/@abp/saas/src/components/tenants/TenantTable.vue b/apps/vben5/packages/@abp/saas/src/components/tenants/TenantTable.vue
index 3132bd7bb..7fdf41258 100644
--- a/apps/vben5/packages/@abp/saas/src/components/tenants/TenantTable.vue
+++ b/apps/vben5/packages/@abp/saas/src/components/tenants/TenantTable.vue
@@ -1,7 +1,9 @@
 <script setup lang="ts">
-import type { VbenFormProps, VxeGridListeners, VxeGridProps } from '@abp/ui';
+import type { VxeGridListeners, VxeGridProps } from '@abp/ui';
 import type { MenuInfo } from 'ant-design-vue/es/menu/src/interface';
 
+import type { VbenFormProps } from '@vben/common-ui';
+
 import type { TenantDto } from '../../types/tenants';
 
 import { defineAsyncComponent, h } from 'vue';
@@ -161,7 +163,7 @@ const onDelete = (row: TenantDto) => {
     },
     onOk: async () => {
       await deleteApi(row.id);
-      message.success($t('AbpUi.SuccessfullyDeleted'));
+      message.success($t('AbpUi.DeletedSuccessfully'));
       query();
     },
     title: $t('AbpUi.AreYouSure'),
diff --git a/apps/vben5/packages/@abp/saas/src/constants/index.ts b/apps/vben5/packages/@abp/saas/src/constants/index.ts
deleted file mode 100644
index c85954d3e..000000000
--- a/apps/vben5/packages/@abp/saas/src/constants/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export * from './permissions';
diff --git a/apps/vben5/packages/@abp/saas/src/index.ts b/apps/vben5/packages/@abp/saas/src/index.ts
index f43dbaee0..314dad0cd 100644
--- a/apps/vben5/packages/@abp/saas/src/index.ts
+++ b/apps/vben5/packages/@abp/saas/src/index.ts
@@ -1,4 +1,3 @@
 export * from './api';
 export * from './components';
-export * from './constants';
 export * from './types';
diff --git a/apps/vben5/packages/@abp/settings/src/api/definitions.ts b/apps/vben5/packages/@abp/settings/src/api/definitions.ts
deleted file mode 100644
index 65c5d0fcd..000000000
--- a/apps/vben5/packages/@abp/settings/src/api/definitions.ts
+++ /dev/null
@@ -1,77 +0,0 @@
-import type { ListResultDto } from '@abp/core';
-
-import type {
-  SettingDefinitionCreateDto,
-  SettingDefinitionDto,
-  SettingDefinitionGetListInput,
-  SettingDefinitionUpdateDto,
-} from '../types/definitions';
-
-import { requestClient } from '@abp/request';
-
-/**
- * 删除设置定义
- * @param name 设置名称
- */
-export function deleteApi(name: string): Promise<void> {
-  return requestClient.delete(
-    `/api/setting-management/settings/definitions/${name}`,
-  );
-}
-
-/**
- * 查询设置定义
- * @param name 设置名称
- * @returns 设置定义数据传输对象
- */
-export function getApi(name: string): Promise<SettingDefinitionDto> {
-  return requestClient.get<SettingDefinitionDto>(
-    `/api/setting-management/settings/definitions/${name}`,
-  );
-}
-
-/**
- * 查询设置定义列表
- * @param input 设置过滤条件
- * @returns 设置定义数据传输对象列表
- */
-export function getListApi(
-  input?: SettingDefinitionGetListInput,
-): Promise<ListResultDto<SettingDefinitionDto>> {
-  return requestClient.get<ListResultDto<SettingDefinitionDto>>(
-    `/api/setting-management/settings/definitions`,
-    {
-      params: input,
-    },
-  );
-}
-
-/**
- * 创建设置定义
- * @param input 设置定义参数
- * @returns 设置定义数据传输对象
- */
-export function createApi(
-  input: SettingDefinitionCreateDto,
-): Promise<SettingDefinitionDto> {
-  return requestClient.post<SettingDefinitionDto>(
-    '/api/setting-management/settings/definitions',
-    input,
-  );
-}
-
-/**
- * 更新设置定义
- * @param name 设置名称
- * @param input 设置定义参数
- * @returns 设置定义数据传输对象
- */
-export function updateApi(
-  name: string,
-  input: SettingDefinitionUpdateDto,
-): Promise<SettingDefinitionDto> {
-  return requestClient.put<SettingDefinitionDto>(
-    `/api/setting-management/settings/definitions/${name}`,
-    input,
-  );
-}
diff --git a/apps/vben5/packages/@abp/settings/src/api/index.ts b/apps/vben5/packages/@abp/settings/src/api/index.ts
index 523f55130..53a593578 100644
--- a/apps/vben5/packages/@abp/settings/src/api/index.ts
+++ b/apps/vben5/packages/@abp/settings/src/api/index.ts
@@ -1,2 +1,2 @@
-export * as settingDefinitionsApi from './definitions';
-export * as settingsApi from './settings';
+export { useDefinitionsApi } from './useDefinitionsApi';
+export { useSettingsApi } from './useSettingsApi';
diff --git a/apps/vben5/packages/@abp/settings/src/api/settings.ts b/apps/vben5/packages/@abp/settings/src/api/settings.ts
deleted file mode 100644
index 81d4356ba..000000000
--- a/apps/vben5/packages/@abp/settings/src/api/settings.ts
+++ /dev/null
@@ -1,84 +0,0 @@
-import type { ListResultDto } from '@abp/core';
-
-import type { SettingGroup, SettingsUpdateInput } from '../types/settings';
-
-import { requestClient } from '@abp/request';
-
-/**
- * 获取全局设置
- * @returns 设置数据传输对象列表
- */
-export function getGlobalSettingsApi(): Promise<ListResultDto<SettingGroup>> {
-  return requestClient.get<ListResultDto<SettingGroup>>(
-    `/api/setting-management/settings/by-global`,
-  );
-}
-
-/**
- * 设置全局设置
- * @returns 设置数据传输对象列表
- */
-export function setGlobalSettingsApi(
-  input: SettingsUpdateInput,
-): Promise<void> {
-  return requestClient.put(
-    `/api/setting-management/settings/change-global`,
-    input,
-  );
-}
-
-/**
- * 获取租户设置
- * @returns 设置数据传输对象列表
- */
-export function getTenantSettingsApi(): Promise<ListResultDto<SettingGroup>> {
-  return requestClient.get<ListResultDto<SettingGroup>>(
-    `/api/setting-management/settings/by-current-tenant`,
-  );
-}
-
-/**
- * 设置租户设置
- * @returns 设置数据传输对象列表
- */
-export function setTenantSettingsApi(
-  input: SettingsUpdateInput,
-): Promise<void> {
-  return requestClient.put(
-    `/api/setting-management/settings/change-current-tenant`,
-    input,
-  );
-}
-/**
- * 获取用户设置
- * @returns 设置数据传输对象列表
- */
-export function getUserSettingsApi(): Promise<ListResultDto<SettingGroup>> {
-  return requestClient.get<ListResultDto<SettingGroup>>(
-    `/api/setting-management/settings/by-current-user`,
-  );
-}
-
-/**
- * 设置用户设置
- * @returns 设置数据传输对象列表
- */
-export function setUserSettingsApi(input: SettingsUpdateInput): Promise<void> {
-  return requestClient.put(
-    `/api/setting-management/settings/change-current-user`,
-    input,
-  );
-}
-
-/**
- * 发送测试邮件
- * @param emailAddress 邮件接收方地址
- */
-export const sendTestEmailApi = (emailAddress: string) => {
-  return requestClient.post(
-    `/api/setting-management/settings/send-test-email`,
-    {
-      emailAddress,
-    },
-  );
-};
diff --git a/apps/vben5/packages/@abp/settings/src/api/useDefinitionsApi.ts b/apps/vben5/packages/@abp/settings/src/api/useDefinitionsApi.ts
new file mode 100644
index 000000000..05d6d1eab
--- /dev/null
+++ b/apps/vben5/packages/@abp/settings/src/api/useDefinitionsApi.ts
@@ -0,0 +1,99 @@
+import type { ListResultDto } from '@abp/core';
+
+import type {
+  SettingDefinitionCreateDto,
+  SettingDefinitionDto,
+  SettingDefinitionGetListInput,
+  SettingDefinitionUpdateDto,
+} from '../types';
+
+import { useRequest } from '@abp/request';
+
+export function useDefinitionsApi() {
+  const { cancel, request } = useRequest();
+  /**
+   * 删除设置定义
+   * @param name 设置名称
+   */
+  function deleteApi(name: string): Promise<void> {
+    return request(`/api/setting-management/settings/definitions/${name}`, {
+      method: 'DELETE',
+    });
+  }
+
+  /**
+   * 查询设置定义
+   * @param name 设置名称
+   * @returns 设置定义数据传输对象
+   */
+  function getApi(name: string): Promise<SettingDefinitionDto> {
+    return request<SettingDefinitionDto>(
+      `/api/setting-management/settings/definitions/${name}`,
+      {
+        method: 'GET',
+      },
+    );
+  }
+
+  /**
+   * 查询设置定义列表
+   * @param input 设置过滤条件
+   * @returns 设置定义数据传输对象列表
+   */
+  function getListApi(
+    input?: SettingDefinitionGetListInput,
+  ): Promise<ListResultDto<SettingDefinitionDto>> {
+    return request<ListResultDto<SettingDefinitionDto>>(
+      `/api/setting-management/settings/definitions`,
+      {
+        method: 'GET',
+        params: input,
+      },
+    );
+  }
+
+  /**
+   * 创建设置定义
+   * @param input 设置定义参数
+   * @returns 设置定义数据传输对象
+   */
+  function createApi(
+    input: SettingDefinitionCreateDto,
+  ): Promise<SettingDefinitionDto> {
+    return request<SettingDefinitionDto>(
+      '/api/setting-management/settings/definitions',
+      {
+        data: input,
+        method: 'POST',
+      },
+    );
+  }
+
+  /**
+   * 更新设置定义
+   * @param name 设置名称
+   * @param input 设置定义参数
+   * @returns 设置定义数据传输对象
+   */
+  function updateApi(
+    name: string,
+    input: SettingDefinitionUpdateDto,
+  ): Promise<SettingDefinitionDto> {
+    return request<SettingDefinitionDto>(
+      `/api/setting-management/settings/definitions/${name}`,
+      {
+        data: input,
+        method: 'PUT',
+      },
+    );
+  }
+
+  return {
+    cancel,
+    createApi,
+    deleteApi,
+    getApi,
+    getListApi,
+    updateApi,
+  };
+}
diff --git a/apps/vben5/packages/@abp/settings/src/api/useSettingsApi.ts b/apps/vben5/packages/@abp/settings/src/api/useSettingsApi.ts
new file mode 100644
index 000000000..502e72bbd
--- /dev/null
+++ b/apps/vben5/packages/@abp/settings/src/api/useSettingsApi.ts
@@ -0,0 +1,103 @@
+import type { ListResultDto } from '@abp/core';
+
+import type { SettingGroup, SettingsUpdateInput } from '../types';
+
+import { useRequest } from '@abp/request';
+
+export function useSettingsApi() {
+  const { cancel, request } = useRequest();
+  /**
+   * 获取全局设置
+   * @returns 设置数据传输对象列表
+   */
+  function getGlobalSettingsApi(): Promise<ListResultDto<SettingGroup>> {
+    return request<ListResultDto<SettingGroup>>(
+      `/api/setting-management/settings/by-global`,
+      {
+        method: 'GET',
+      },
+    );
+  }
+
+  /**
+   * 设置全局设置
+   * @returns 设置数据传输对象列表
+   */
+  function setGlobalSettingsApi(input: SettingsUpdateInput): Promise<void> {
+    return request(`/api/setting-management/settings/change-global`, {
+      data: input,
+      method: 'PUT',
+    });
+  }
+
+  /**
+   * 获取租户设置
+   * @returns 设置数据传输对象列表
+   */
+  function getTenantSettingsApi(): Promise<ListResultDto<SettingGroup>> {
+    return request<ListResultDto<SettingGroup>>(
+      `/api/setting-management/settings/by-current-tenant`,
+      {
+        method: 'GET',
+      },
+    );
+  }
+
+  /**
+   * 设置租户设置
+   * @returns 设置数据传输对象列表
+   */
+  function setTenantSettingsApi(input: SettingsUpdateInput): Promise<void> {
+    return request(`/api/setting-management/settings/change-current-tenant`, {
+      data: input,
+      method: 'PUT',
+    });
+  }
+  /**
+   * 获取用户设置
+   * @returns 设置数据传输对象列表
+   */
+  function getUserSettingsApi(): Promise<ListResultDto<SettingGroup>> {
+    return request<ListResultDto<SettingGroup>>(
+      `/api/setting-management/settings/by-current-user`,
+      {
+        method: 'GET',
+      },
+    );
+  }
+
+  /**
+   * 设置用户设置
+   * @returns 设置数据传输对象列表
+   */
+  function setUserSettingsApi(input: SettingsUpdateInput): Promise<void> {
+    return request(`/api/setting-management/settings/change-current-user`, {
+      data: input,
+      method: 'PUT',
+    });
+  }
+
+  /**
+   * 发送测试邮件
+   * @param emailAddress 邮件接收方地址
+   */
+  const sendTestEmailApi = (emailAddress: string) => {
+    return request(`/api/setting-management/settings/send-test-email`, {
+      data: {
+        emailAddress,
+      },
+      method: 'POST',
+    });
+  };
+
+  return {
+    cancel,
+    getGlobalSettingsApi,
+    getTenantSettingsApi,
+    getUserSettingsApi,
+    sendTestEmailApi,
+    setGlobalSettingsApi,
+    setTenantSettingsApi,
+    setUserSettingsApi,
+  };
+}
diff --git a/apps/vben5/packages/@abp/settings/src/components/definitions/SettingDefinitionModal.vue b/apps/vben5/packages/@abp/settings/src/components/definitions/SettingDefinitionModal.vue
index 475674827..c022e6fb8 100644
--- a/apps/vben5/packages/@abp/settings/src/components/definitions/SettingDefinitionModal.vue
+++ b/apps/vben5/packages/@abp/settings/src/components/definitions/SettingDefinitionModal.vue
@@ -27,7 +27,7 @@ import {
   Textarea,
 } from 'ant-design-vue';
 
-import { createApi, getApi, updateApi } from '../../api/definitions';
+import { useDefinitionsApi } from '../../api/useDefinitionsApi';
 
 defineOptions({
   name: 'SettingDefinitionModal',
@@ -55,6 +55,8 @@ const providerOptions = reactive([
   { label: $t('AbpSettingManagement.Providers:User'), value: 'U' },
 ]);
 
+const { createApi, getApi, updateApi } = useDefinitionsApi();
+
 const [Modal, modalApi] = useVbenModal({
   class: 'w-1/2',
   draggable: true,
@@ -67,7 +69,7 @@ const [Modal, modalApi] = useVbenModal({
     const api = isEditModel.value
       ? updateApi(formModel.value.name, toValue(formModel))
       : createApi(toValue(formModel));
-    modalApi.setState({ confirmLoading: true, loading: true });
+    modalApi.setState({ submitting: true });
     api
       .then((res) => {
         message.success($t('AbpUi.SavedSuccessfully'));
@@ -75,7 +77,7 @@ const [Modal, modalApi] = useVbenModal({
         modalApi.close();
       })
       .finally(() => {
-        modalApi.setState({ confirmLoading: false, loading: false });
+        modalApi.setState({ submitting: false });
       });
   },
   onOpenChange: async (isOpen: boolean) => {
diff --git a/apps/vben5/packages/@abp/settings/src/components/definitions/SettingDefinitionTable.vue b/apps/vben5/packages/@abp/settings/src/components/definitions/SettingDefinitionTable.vue
index 8cfe20b3d..c101d788b 100644
--- a/apps/vben5/packages/@abp/settings/src/components/definitions/SettingDefinitionTable.vue
+++ b/apps/vben5/packages/@abp/settings/src/components/definitions/SettingDefinitionTable.vue
@@ -1,5 +1,7 @@
 <script setup lang="ts">
-import type { VbenFormProps, VxeGridListeners, VxeGridProps } from '@abp/ui';
+import type { VxeGridListeners, VxeGridProps } from '@abp/ui';
+
+import type { VbenFormProps } from '@vben/common-ui';
 
 import type { SettingDefinitionDto } from '../../types/definitions';
 
@@ -17,7 +19,7 @@ import {
 } from '@ant-design/icons-vue';
 import { Button, message, Modal } from 'ant-design-vue';
 
-import { deleteApi, getListApi } from '../../api/definitions';
+import { useDefinitionsApi } from '../../api/useDefinitionsApi';
 import { SettingDefinitionsPermissions } from '../../constants/permissions';
 
 defineOptions({
@@ -33,6 +35,7 @@ const pageState = reactive({
 
 const { Lr } = useLocalization();
 const { deserialize } = useLocalizationSerializer();
+const { deleteApi, getListApi } = useDefinitionsApi();
 
 const formOptions: VbenFormProps = {
   // 默认展开
@@ -163,7 +166,7 @@ function onDelete(row: SettingDefinitionDto) {
     content: `${$t('AbpUi.ItemWillBeDeletedMessageWithFormat', [row.name])}`,
     onOk: async () => {
       await deleteApi(row.name);
-      message.success($t('AbpUi.SuccessfullyDeleted'));
+      message.success($t('AbpUi.DeletedSuccessfully'));
       onGet();
     },
     title: $t('AbpUi.AreYouSure'),
diff --git a/apps/vben5/packages/@abp/settings/src/components/settings/SystemSetting.vue b/apps/vben5/packages/@abp/settings/src/components/settings/SystemSetting.vue
index 0d1dd76cb..088dfacf7 100644
--- a/apps/vben5/packages/@abp/settings/src/components/settings/SystemSetting.vue
+++ b/apps/vben5/packages/@abp/settings/src/components/settings/SystemSetting.vue
@@ -10,13 +10,7 @@ import { isEmail, useAbpStore } from '@abp/core';
 import { FeatureModal } from '@abp/features';
 import { Button, Form, InputSearch, message, Modal } from 'ant-design-vue';
 
-import {
-  getGlobalSettingsApi,
-  getTenantSettingsApi,
-  sendTestEmailApi,
-  setGlobalSettingsApi,
-  setTenantSettingsApi,
-} from '../../api/settings';
+import { useSettingsApi } from '../../api/useSettingsApi';
 import SettingForm from './SettingForm.vue';
 
 defineOptions({
@@ -26,6 +20,13 @@ defineOptions({
 const FormItem = Form.Item;
 
 const abpStore = useAbpStore();
+const {
+  getGlobalSettingsApi,
+  getTenantSettingsApi,
+  sendTestEmailApi,
+  setGlobalSettingsApi,
+  setTenantSettingsApi,
+} = useSettingsApi();
 const [HostFeatureModal, featureModalApi] = useVbenModal({
   connectedComponent: FeatureModal,
 });
diff --git a/apps/vben5/packages/@abp/settings/src/components/settings/UserSetting.vue b/apps/vben5/packages/@abp/settings/src/components/settings/UserSetting.vue
index 2bb156214..1498f66f4 100644
--- a/apps/vben5/packages/@abp/settings/src/components/settings/UserSetting.vue
+++ b/apps/vben5/packages/@abp/settings/src/components/settings/UserSetting.vue
@@ -1,13 +1,15 @@
 <script setup lang="ts">
 import type { SettingsUpdateInput } from '../../types';
 
-import { getUserSettingsApi, setUserSettingsApi } from '../../api/settings';
+import { useSettingsApi } from '../../api/useSettingsApi';
 import SettingForm from './SettingForm.vue';
 
 defineOptions({
   name: 'UserSettingForm',
 });
 
+const { getUserSettingsApi, setUserSettingsApi } = useSettingsApi();
+
 async function onGet() {
   const { items } = await getUserSettingsApi();
   return items;
diff --git a/apps/vben5/packages/@abp/settings/src/constants/index.ts b/apps/vben5/packages/@abp/settings/src/constants/index.ts
deleted file mode 100644
index c85954d3e..000000000
--- a/apps/vben5/packages/@abp/settings/src/constants/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export * from './permissions';
diff --git a/apps/vben5/packages/@abp/settings/src/index.ts b/apps/vben5/packages/@abp/settings/src/index.ts
index f43dbaee0..314dad0cd 100644
--- a/apps/vben5/packages/@abp/settings/src/index.ts
+++ b/apps/vben5/packages/@abp/settings/src/index.ts
@@ -1,4 +1,3 @@
 export * from './api';
 export * from './components';
-export * from './constants';
 export * from './types';
diff --git a/apps/vben5/packages/@abp/ui/src/adapter/component/index.ts b/apps/vben5/packages/@abp/ui/src/adapter/component/index.ts
deleted file mode 100644
index 85d24d0c7..000000000
--- a/apps/vben5/packages/@abp/ui/src/adapter/component/index.ts
+++ /dev/null
@@ -1,172 +0,0 @@
-/**
- * 通用组件共同的使用的基础组件，原先放在 adapter/form 内部，限制了使用范围，这里提取出来，方便其他地方使用
- * 可用于 vben-form、vben-modal、vben-drawer 等组件使用,
- */
-
-import type { Component, SetupContext } from 'vue';
-
-import type { BaseFormComponentType } from '@vben/common-ui';
-
-import { h } from 'vue';
-
-import { ApiComponent, globalShareState, IconPicker } from '@vben/common-ui';
-import { $t } from '@vben/locales';
-
-import {
-  AutoComplete,
-  Button,
-  Checkbox,
-  CheckboxGroup,
-  DatePicker,
-  Divider,
-  Input,
-  InputNumber,
-  InputPassword,
-  InputSearch,
-  Mentions,
-  notification,
-  Radio,
-  RadioGroup,
-  RangePicker,
-  Rate,
-  Select,
-  Space,
-  Switch,
-  Textarea,
-  TimePicker,
-  TreeSelect,
-  Upload,
-} from 'ant-design-vue';
-
-const withDefaultPlaceholder = <T extends Component>(
-  component: T,
-  type: 'input' | 'select',
-) => {
-  return (props: any, { attrs, slots }: Omit<SetupContext, 'expose'>) => {
-    const placeholder = props?.placeholder || $t(`ui.placeholder.${type}`);
-    return h(component, { ...props, ...attrs, placeholder }, slots);
-  };
-};
-
-// 这里需要自行根据业务组件库进行适配，需要用到的组件都需要在这里类型说明
-export type ComponentType =
-  | 'ApiSelect'
-  | 'ApiTreeSelect'
-  | 'AutoComplete'
-  | 'Checkbox'
-  | 'CheckboxGroup'
-  | 'DatePicker'
-  | 'DefaultButton'
-  | 'Divider'
-  | 'IconPicker'
-  | 'Input'
-  | 'InputNumber'
-  | 'InputPassword'
-  | 'InputSearch'
-  | 'Mentions'
-  | 'PrimaryButton'
-  | 'Radio'
-  | 'RadioGroup'
-  | 'RangePicker'
-  | 'Rate'
-  | 'Select'
-  | 'Space'
-  | 'Switch'
-  | 'Textarea'
-  | 'TimePicker'
-  | 'TreeSelect'
-  | 'Upload'
-  | BaseFormComponentType;
-
-async function initComponentAdapter() {
-  const components: Partial<Record<ComponentType, Component>> = {
-    // 如果你的组件体积比较大，可以使用异步加载
-    // Button: () =>
-    // import('xxx').then((res) => res.Button),
-    ApiSelect: (props, { attrs, slots }) => {
-      return h(
-        ApiComponent,
-        {
-          placeholder: $t('ui.placeholder.select'),
-          ...props,
-          ...attrs,
-          component: Select,
-          loadingSlot: 'suffixIcon',
-          modelPropName: 'value',
-          visibleEvent: 'onDropdownVisibleChange',
-        },
-        slots,
-      );
-    },
-    ApiTreeSelect: (props, { attrs, slots }) => {
-      return h(
-        ApiComponent,
-        {
-          placeholder: $t('ui.placeholder.select'),
-          ...props,
-          ...attrs,
-          component: TreeSelect,
-          fieldNames: { label: 'label', value: 'value', children: 'children' },
-          loadingSlot: 'suffixIcon',
-          modelPropName: 'value',
-          optionsPropName: 'treeData',
-          visibleEvent: 'onVisibleChange',
-        },
-        slots,
-      );
-    },
-    AutoComplete,
-    Checkbox,
-    CheckboxGroup,
-    DatePicker,
-    // 自定义默认按钮
-    DefaultButton: (props, { attrs, slots }) => {
-      return h(Button, { ...props, attrs, type: 'default' }, slots);
-    },
-    Divider,
-    IconPicker: (props, { attrs, slots }) => {
-      return h(
-        IconPicker,
-        { iconSlot: 'addonAfter', inputComponent: Input, ...props, ...attrs },
-        slots,
-      );
-    },
-    Input: withDefaultPlaceholder(Input, 'input'),
-    InputNumber: withDefaultPlaceholder(InputNumber, 'input'),
-    InputPassword: withDefaultPlaceholder(InputPassword, 'input'),
-    InputSearch: withDefaultPlaceholder(InputSearch, 'input'),
-    Mentions: withDefaultPlaceholder(Mentions, 'input'),
-    // 自定义主要按钮
-    PrimaryButton: (props, { attrs, slots }) => {
-      return h(Button, { ...props, attrs, type: 'primary' }, slots);
-    },
-    Radio,
-    RadioGroup,
-    RangePicker,
-    Rate,
-    Select: withDefaultPlaceholder(Select, 'select'),
-    Space,
-    Switch,
-    Textarea: withDefaultPlaceholder(Textarea, 'input'),
-    TimePicker,
-    TreeSelect: withDefaultPlaceholder(TreeSelect, 'select'),
-    Upload,
-  };
-
-  // 将组件注册到全局共享状态中
-  globalShareState.setComponents(components);
-
-  // 定义全局共享状态中的消息提示
-  globalShareState.defineMessage({
-    // 复制成功消息提示
-    copyPreferencesSuccess: (title, content) => {
-      notification.success({
-        description: content,
-        message: title,
-        placement: 'bottomRight',
-      });
-    },
-  });
-}
-
-export { initComponentAdapter };
diff --git a/apps/vben5/packages/@abp/ui/src/adapter/form.ts b/apps/vben5/packages/@abp/ui/src/adapter/form.ts
deleted file mode 100644
index 65ff793b6..000000000
--- a/apps/vben5/packages/@abp/ui/src/adapter/form.ts
+++ /dev/null
@@ -1,47 +0,0 @@
-import type {
-  VbenFormSchema as FormSchema,
-  VbenFormProps,
-} from '@vben/common-ui';
-
-import type { ComponentType } from './component';
-
-import { setupVbenForm, useVbenForm as useForm, z } from '@vben/common-ui';
-import { $t } from '@vben/locales';
-
-setupVbenForm<ComponentType>({
-  config: {
-    // ant design vue组件库默认都是 v-model:value
-    baseModelPropName: 'value',
-
-    // 一些组件是 v-model:checked 或者 v-model:fileList
-    modelPropNameMap: {
-      Checkbox: 'checked',
-      Radio: 'checked',
-      Switch: 'checked',
-      Upload: 'fileList',
-    },
-  },
-  defineRules: {
-    // 输入项目必填国际化适配
-    required: (value, _params, ctx) => {
-      if (value === undefined || value === null || value.length === 0) {
-        return $t('ui.formRules.required', [ctx.label]);
-      }
-      return true;
-    },
-    // 选择项目必填国际化适配
-    selectRequired: (value, _params, ctx) => {
-      if (value === undefined || value === null) {
-        return $t('ui.formRules.selectRequired', [ctx.label]);
-      }
-      return true;
-    },
-  },
-});
-
-const useVbenForm = useForm<ComponentType>;
-
-export { useVbenForm, z };
-
-export type VbenFormSchema = FormSchema<ComponentType>;
-export type { VbenFormProps };
diff --git a/apps/vben5/packages/@abp/ui/src/adapter/vxe-table.ts b/apps/vben5/packages/@abp/ui/src/adapter/vxe-table.ts
index 5e694916c..ccc1c6926 100644
--- a/apps/vben5/packages/@abp/ui/src/adapter/vxe-table.ts
+++ b/apps/vben5/packages/@abp/ui/src/adapter/vxe-table.ts
@@ -2,11 +2,12 @@ import type { VxeGridProps } from '../components/vxe-table/types';
 
 import { h } from 'vue';
 
+import { useVbenForm } from '@vben/common-ui';
+
 import { Button, Image } from 'ant-design-vue';
 
 import { setupVbenVxeTable } from '../components/vxe-table';
 import { useVbenVxeGrid as useVxeGrid } from '../components/vxe-table/use-vxe-grid';
-import { useVbenForm } from './form';
 
 function useVbenVxeGrid(options: VxeGridProps) {
   setupVbenVxeTable({
diff --git a/apps/vben5/packages/@abp/ui/src/index.ts b/apps/vben5/packages/@abp/ui/src/index.ts
index 9bb756bb5..b93f10eea 100644
--- a/apps/vben5/packages/@abp/ui/src/index.ts
+++ b/apps/vben5/packages/@abp/ui/src/index.ts
@@ -1,4 +1,2 @@
-export * from './adapter/component';
-export * from './adapter/form';
 export * from './adapter/vxe-table';
 export * from './components';