/*
 * @Author: code4eat awesomedema@gmail.com
 * @Date: 2025-04-07 17:34:56
 * @LastEditors: code4eat awesomedema@gmail.com
 * @LastEditTime: 2025-04-08 14:33:52
 * @FilePath: /KC-MiddlePlatform/src/pages/platform/setting/indicatorMana/frameContainer/index.tsx
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 */
import React, { useState } from 'react';

const FrameComponent = ({ link }:{link:string}) => {
  const [loading, setLoading] = useState(true);

  const handleLoad = () => {
    setLoading(false);
  };

  return (
    <div style={{ position: 'relative', width: '100%', height: '100%',borderRadius:4,overflow:'hidden' }}>
      {loading && (
        <div
          style={{
            position: 'absolute',
            top: 0,
            left: 0,
            width: '100%',
            height: '100%',
            display: 'flex',
            alignItems: 'center',
            justifyContent: 'center',
            background: '#fff',
            zIndex: 1,
          }}
        >
          加载中...
        </div>
      )}
      <iframe
        src={link}
        title="Dynamic Frame"
        width="100%"
        height="100%"
        style={{ border: 'none' }}
        onLoad={handleLoad}
      />
    </div>
  );
};

export default FrameComponent;
