#

luxiaotao1123

2024-10-09 2d78f1c6801e757e5bc747854426be89c8fcf84d

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
import React, { createContext, useContext, useState, useCallback } from 'react';
import { Snackbar, Alert, Portal, Slide } from '@mui/material';
 
const NotificationContext = createContext();
 
const SlideTransition = (props) => {
    return <Slide {...props} direction="up" />;
}
 
export const NotificationProvider = ({ children }) => {
    const [notification, setNotification] = useState({
        open: false,
        message: '',
        severity: 'info',
    });
 
    const showNotification = useCallback((message, severity = 'info') => {
        setNotification({ open: true, message, severity });
    }, []);
 
    const handleClose = () => {
        setNotification({ ...notification, open: false });
    };
 
    return (
        <NotificationContext.Provider value={showNotification}>
            {children}
            <Portal>
                <Snackbar
                    open={notification.open}
                    autoHideDuration={4000}
                    onClose={handleClose}
                    TransitionComponent={SlideTransition}
                    anchorOrigin={{ vertical: 'bottom', horizontal: 'center' }}
                    sx={{
                        // mt: 12,
                        zIndex: 2000,
                    }}
                >
                    <Alert onClose={handleClose} severity={notification.severity} sx={{ width: '300px', zIndex: 2000 }}>
                        {notification.message}
                    </Alert>
                </Snackbar>
            </Portal>
        </NotificationContext.Provider>
    );
};
 
export const useNotification = () => {
    return useContext(NotificationContext);
};