import React, { useState, useEffect } from 'react';
import { Spin } from 'antd';
import { LoadingOutlined } from '@ant-design/icons';

const antIcon = (
  <LoadingOutlined
    style={{
      fontSize: 14,
    }}
    spin
  />
);
import './index.less';

export default ({ isOpen, isAir, isLoading ,isSmall}) => {
  return (
    <div className={`switchBox ${isSmall?'small':''}`}>
      {isAir && isLoading ? (
        <Spin indicator={antIcon} className={`box-loading ${isOpen ? '' : 'box-close-loading'}`} />
      ) : null}
      <div className={`content ${isOpen ? '' : 'closeBg'}`}>
        <div className={`point  ${isOpen ? '' : 'closePt'}`}></div>
      </div>
    </div>
  );
};
