CreatorCenter_OOIN/src/components/LoadingOverlay.jsx

import { Spinner } from 'react-bootstrap';

export default function LoadingOverlay({ status }) {
    if (status !== 'loading') return null;
    return (
        <div style={styles.overlay}>
            <Spinner animation='border' role='status' variant='primary' style={{ width: '3rem', height: '3rem' }}>
                <span className='visually-hidden'>Loading...</span>
            </Spinner>
        </div>
    );
}
const styles = {
    overlay: {
        position: 'absolute', // 可改为 fixed 实现全屏
        top: 0,
        left: 0,
        width: '100%',
        height: '100%',
        backgroundColor: 'rgba(255, 255, 255, 0.6)', // 半透明背景
        display: 'flex',
        justifyContent: 'center',
        alignItems: 'center',
        zIndex: 9999,
    },
};