feat(全局): 添加全局弹窗上下文组件并声明类型

添加 PopupContext 组件用于全局提供 message、modal 和 notification 方法
在 global.d.ts 中声明对应的 window 类型
将 analytics 页面的 notification 调用改为使用全局方法
This commit is contained in:
dap 2026-01-14 15:45:39 +08:00
parent 5776672901
commit ba65f750d4
4 changed files with 35 additions and 2 deletions

View File

@ -9,6 +9,7 @@ import { App, ConfigProvider, theme } from 'antdv-next';
import { antdLocale } from '#/locales';
import { useUploadTip } from './upload-tip';
import { PopupContext } from './utils/context';
defineOptions({ name: 'App' });
@ -38,6 +39,7 @@ useUploadTip();
<ConfigProvider :locale="antdLocale" :theme="tokenTheme" variant="outlined">
<App>
<RouterView />
<PopupContext />
</App>
</ConfigProvider>
</template>

View File

@ -0,0 +1,20 @@
import { defineComponent } from 'vue';
import { App } from 'antdv-next';
/**
*
* message, modal, notification
* @see https://ant.design/components/app-cn#global-scene-redux
*/
export const PopupContext = defineComponent({
name: 'PopupContext',
render() {
const staticFunction = App.useApp();
window.message = staticFunction.message;
window.modal = staticFunction.modal;
window.notification = staticFunction.notification;
return null;
},
});

View File

@ -15,7 +15,7 @@ import {
SvgDownloadIcon,
} from '@vben/icons';
import { Alert, notification } from 'antdv-next';
import { Alert } from 'antdv-next';
import AnalyticsTrends from './analytics-trends.vue';
import AnalyticsVisitsData from './analytics-visits-data.vue';
@ -67,7 +67,7 @@ const chartTabs: TabOption[] = [
];
function handleClick() {
notification.success({
window.notification.success({
title: '新的 notification 样式',
description: 'ant design',
});

11
apps/web-antd/types/global.d.ts vendored Normal file
View File

@ -0,0 +1,11 @@
import type { MessageInstance } from 'antdv-next/dist/message/interface';
import type { ModalStaticFunctions } from 'antdv-next/dist/modal/confirm';
import type { NotificationInstance } from 'antdv-next/dist/notification/interface';
declare global {
interface Window {
message: MessageInstance;
modal: Omit<ModalStaticFunctions, 'warn'>;
notification: NotificationInstance;
}
}