From 433112b25f5874d0957fbfbda39c7325d3117aa6 Mon Sep 17 00:00:00 2001 From: luxiaotao1123 <t1341870251@163.com> Date: 星期五, 11 十月 2024 10:19:27 +0800 Subject: [PATCH] # --- zy-acs-flow/src/map/Notification.jsx | 33 +++++++++++++++++++++++++-------- 1 files changed, 25 insertions(+), 8 deletions(-) diff --git a/zy-acs-flow/src/map/Notification.jsx b/zy-acs-flow/src/map/Notification.jsx index ecfb3e7..de65c06 100644 --- a/zy-acs-flow/src/map/Notification.jsx +++ b/zy-acs-flow/src/map/Notification.jsx @@ -1,4 +1,4 @@ -import React, { createContext, useContext, useState, useCallback } from 'react'; +import React, { createContext, useContext, useState, useCallback, useMemo } from 'react'; import { Snackbar, Alert, Portal, Slide } from '@mui/material'; const NotificationContext = createContext(); @@ -18,12 +18,21 @@ setNotification({ open: true, message, severity }); }, []); - const handleClose = () => { - setNotification({ ...notification, open: false }); - }; + const handleClose = useCallback(() => { + setNotification((prev) => ({ ...prev, open: false })); + }, []); + + const notify = useMemo(() => ({ + info: (msg) => showNotification(msg, 'info'), + success: (msg) => showNotification(msg, 'success'), + warning: (msg) => showNotification(msg, 'warning'), + error: (msg) => showNotification(msg, 'error'), + // Optional: If you prefer 'warn' instead of 'warning', uncomment the line below + // warn: (msg) => showNotification(msg, 'warning'), + }), [showNotification]); return ( - <NotificationContext.Provider value={showNotification}> + <NotificationContext.Provider value={notify}> {children} <Portal> <Snackbar @@ -33,11 +42,15 @@ TransitionComponent={SlideTransition} anchorOrigin={{ vertical: 'bottom', horizontal: 'center' }} sx={{ - // mt: 12, zIndex: 2000, }} > - <Alert onClose={handleClose} severity={notification.severity} sx={{ width: '300px', zIndex: 2000 }}> + <Alert + onClose={handleClose} + severity={notification.severity} + sx={{ width: '300px', zIndex: 2000 }} + variant="filled" // Optional: Use filled variant for better visibility + > {notification.message} </Alert> </Snackbar> @@ -47,5 +60,9 @@ }; export const useNotification = () => { - return useContext(NotificationContext); + const context = useContext(NotificationContext); + if (!context) { + throw new Error('useNotification must be used within a NotificationProvider'); + } + return context; }; -- Gitblit v1.9.1