#

luxiaotao1123

2024-02-26 935d9aaad81c56d920c2a2a56c908141e72995db

#

 zy-asrs-flow/src/App.jsx

@@ -1,5 +1,5 @@
import React from 'react';
import { Footer, Question, SelectLang, AvatarDropdown, AvatarName, Brightness, LayoutSwitch } from '@/components';
import { Footer, Question, SelectLang, AvatarDropdown, AvatarName, Brightness, LayoutSwitch, FullScreen } from '@/components';
import { LinkOutlined } from '@ant-design/icons';
import { SettingDrawer } from '@ant-design/pro-components';
import { history, Link } from '@umijs/max';
@@ -92,6 +92,7 @@
    return JSON.parse(localStorage.getItem('layoutMode')) || true;
  });

  const [fullScreen, setFullScreen] = React.useState(false);

  React.useEffect(() => {
    localStorage.setItem('darkMode', JSON.stringify(darkMode));
@@ -100,6 +101,7 @@

  return {
    actionsRender: () => [
      <FullScreen fullScreen={fullScreen} setFullScreen={setFullScreen} />,
      <LayoutSwitch layoutMode={layoutMode} setLayoutMode={setLayoutMode} />,
      <Brightness darkMode={darkMode} setDarkMode={setDarkMode} />,
      // <Question key="doc" />,

 zy-asrs-flow/src/components/RightContent/index.jsx

@@ -1,7 +1,14 @@
import { QuestionCircleOutlined } from '@ant-design/icons';
import { SelectLang as UmiSelectLang } from '@umijs/max';
import React from 'react';
import { MoonOutlined, BulbOutlined, InsertRowAboveOutlined, InsertRowLeftOutlined } from '@ant-design/icons';
import { 
  MoonOutlined, 
  BulbOutlined, 
  InsertRowAboveOutlined, 
  InsertRowLeftOutlined,
  FullscreenOutlined,
  FullscreenExitOutlined
} from '@ant-design/icons';

export const SelectLang = () => {
  return (
@@ -62,3 +69,57 @@
    </div>
  );
};

export const FullScreen = ({ fullScreen, setFullScreen }) => {
  const handleClick = () => {
    setFullScreen(!fullScreen);
  };
  // //调用事件
  // const fullScreen = () => {
  //   let isFullScreen = document.webkitIsFullScreen;
  //   if (!isFullScreen) {
  //     requestFullScreen();
  //   } else {
  //     exitFullscreen();
  //   }
  //   setIsFullScreen(isFullScreen);
  // };
  // //进入全屏
  // const requestFullScreen = () => {
  //   var de = document.documentElement;
  //   if (de.requestFullscreen) {
  //     de.requestFullscreen();
  //   } else if (de.mozRequestFullScreen) {
  //     de.mozRequestFullScreen();
  //   } else if (de.webkitRequestFullScreen) {
  //     de.webkitRequestFullScreen();
  //   } else if (de.msRequestFullscreen) {
  //     de.webkitRequestFullScreen();
  //   }
  // };
  // //退出全屏
  // const exitFullscreen = () => {
  //   var de = document;
  //   if (de.exitFullScreen) {
  //     de.exitFullScreen();
  //   } else if (de.mozExitFullScreen) {
  //     de.mozExitFullScreen();
  //   } else if (de.webkitExitFullscreen) {
  //     de.webkitExitFullscreen();
  //   } else if (de.msExitFullscreen) {
  //     de.msExitFullscreen();
  //   }
  // };

  return (
    <div
      style={{
        display: 'flex',
        height: 26,
      }}
      onClick={handleClick}
    >
      {fullScreen ? <FullscreenExitOutlined /> : <FullscreenOutlined />}
    </div>
  );
};

 zy-asrs-flow/src/components/index.ts

@@ -6,7 +6,7 @@
 * 布局组件
 */
import Footer from './Footer';
import { Question, SelectLang, Brightness, LayoutSwitch } from './RightContent';
import { Question, SelectLang, Brightness, LayoutSwitch, FullScreen } from './RightContent';
import { AvatarDropdown, AvatarName } from './RightContent/AvatarDropdown';

export { Footer, Question, SelectLang, AvatarDropdown, AvatarName, Brightness, LayoutSwitch };
export { Footer, Question, SelectLang, AvatarDropdown, AvatarName, Brightness, LayoutSwitch, FullScreen };