Skip to content

C
CivWeb
Commit 560c0159 authored by 崔佳豪's avatar 崔佳豪
Browse files
Options

fix: 引导页调整

parent e9b28734
Pipeline #57318 waiting for manual action with stages
          Hide whitespace changes
          Inline Side-by-side
          Showing with 441 additions and 389 deletions
          src/pages/bootpage/index.js
          View file @ 560c0159
          import React, { useCallback, useEffect, useMemo, useState } from 'react';
          import { Space, Spin } from 'antd';
          import classNames from 'classnames';
          import { connect } from 'react-redux';
          import { useIntl } from '@wisdom-utils/components';
          import { useDocumentTitle } from '@ant-design/pro-utils';
          import { useHistory } from '@wisdom-utils/runtime';
          import defaultSetting from '@wisdom-utils/components/lib/AppLayout/layouts/defaultSettings';
          import { actionCreators } from '../../containers/App/store';
          import SecurityLayout from '../../layouts/SecurityLayout';
          import LoginAction from '../user/login/login';
          import styles from './index.less';
          import { defaultApp } from '@/micro';
          import usingIcon from '@/assets/bootPage/using-icon.png';
          import React, { useEffect, useMemo, useState } from 'react';
          import { Empty, Spin, notification } from 'antd';
          import SecurityLayout from '@/layouts/SecurityLayout';
          import { appService } from '@/api';
          import { SERVICE_INTERFACE_SUCCESS_CODE } from '@/constants';
          import PandaBootPage from './panda';
          const industries = [
          { name: '供水', type: '供水', subTitle: 'WATER SUPPLY' },
          { name: '农饮水', type: '农饮水', subTitle: 'RURAL POTABLE WATER' },
          { name: '排水', type: '排水', subTitle: 'DRAINAGE' },
          { name: '水利', type: '水利', subTitle: 'WATER CONSERVANCY' },
          { name: '能源', type: '能源', subTitle: 'ENERGY SOURCES' },
          { name: '高品质水', type: '高品质水', subTitle: 'HIGH QUALITY WATER' },
          // { name: '水资源', type: '水资源', subTitle: 'WATER RESOURCES' },
          { name: '熊猫智能实验室', type: '实验室', subTitle: 'PANDA AI. LAB' },
          { name: '水务大数据', type: '大数据', subTitle: 'WATER BIG DATA' },
          { name: '熊猫新产品', type: '熊猫新产品', subTitle: "PANDA'S NEW PRODUCT" },
          { name: '项目案例', type: '项目案例', subTitle: 'PROJECT CASE' },
          ];
          const renderIndustries = (config, callback) =>
          industries.map(item => {
          if (
          config &&
          config.userInfo &&
          config.userInfo.Industries &&
          config.userInfo.Industries instanceof Array &&
          config.userInfo.Industries.indexOf(item.type) > -1
          ) {
          return (
          <li className={styles.bootPageLi} key={item.type} onClick={event => callback(event, item.type)}>
          <div className={styles.bootPageList}>
          <div className={styles.listMain}>
          <img src={require(`../../assets/bootPage/${item.type}.png`)} alt="" />
          <span className={styles.bootPageName}>{item.name}</span>
          <span className={styles.bootPageNameEng}>{item.subTitle}</span>
          </div>
          </div>
          </li>
          );
          }
          });
          // let loginAction = null;
          const BootPage = props => {
          const [loadding, setLoadding] = useState(false);
          const [hasRole, setHasRole] = useState(false);
          const [scale, setScale] = useState(1);
          const [loginAction, setAction] = useState(() => new LoginAction(props));
          // const history = useHistory();
          useDocumentTitle(
          { title: defaultSetting.title, id: '', pageName: '行业切换' },
          props.global.title || defaultSetting.title,
          );
          const handlePage = useCallback(
          (event, type) => {
          event.persist();
          event.preventDefault();
          const system_item_name = '引导页模板'; // 系统配置项名称
          // 新增熊猫新产品引导页
          if(type === '熊猫新产品') {
          props.history.push(`/cloud/introduction/newproducts`);
          return;
          }
          setLoadding(true);
          const config = props.global;
          // const loginAction = new LoginAction(props);
          config.uiwidgets = [];
          config.widgets = [];
          config.allWidgets = [];
          props.instance && props.instance.updateConfig(config);
          // props.instance && props.instance.getUserInfoAndConfig('', true, type);
          loginAction && loginAction.getUserInfoAndConfig('', true, type);
          },
          [loginAction, props.global.token, props.instance],
          );
          useEffect(() => {
          // eslint-disable-next-line no-use-before-define
          handleResize();
          }, []);
          const handleResize = () => {
          const width = document.documentElement.clientWidth;
          const height = document.documentElement.clientHeight;
          // eslint-disable-next-line no-shadow
          const scale = width / 1920;
          setScale(scale);
          };
          useEffect(() => {
          window.addEventListener('resize', handleResize);
          const BootPageTemplate = {
          default: PandaBootPage,
          };
          const handleToggleIndustry = event => {
          setLoadding(false);
          props.history.push(`/?client=${props.global.client}`);
          defaultApp();
          // window.share.event.emit('triggerMicro', props.global);
          props.updateCurrentIndex(0);
          };
          loginAction.events.on('toggleIndustry', handleToggleIndustry);
          return () => {
          window.removeEventListener('resize', handleResize);
          loginAction.events.removeListener('toggleIndustry', handleToggleIndustry);
          };
          }, [loginAction.events, props]);
          const [IndustryNum, setIndustryNum] = useState(0);
          const renderIndustr = useMemo(() => renderIndustries(props.global, handlePage), [handlePage, props.global.token]);
          useEffect(() => {
          const NewIndustryNum =
          props.global && props.global.userInfo && props.global.userInfo.Industries
          ? props.global.userInfo.Industries.filter(item => !!industries.find(d => d.type === item)).length
          : 0;
          setIndustryNum(NewIndustryNum);
          }, [handlePage, props.global.token]);
          const intl = useIntl();
          const toOMSUsingAnalysis = e => {
          e && e.stopPropagation();
          props.history.push(`/cloud/analysis/using`);
          };
          const BootPage = () => {
          const [info, setInfo] = useState({
          first: true,
          loading: true,
          error: false,
          });
          const [template, setTemplate] = useState('default');
          const RenderComponent = useMemo(() => BootPageTemplate[template] || BootPageTemplate.default, [template]);
          useEffect(() => {
          appService
          .getUserInfo({
          token: props.global.token,
          subOID: 'subOID',
          site: 'cloud',
          ignoreSite: true,
          .sysConfiguration({
          moduleName: system_item_name,
          })
          .then(res => {
          const roles = res && !res.errMsg ? res.roles : null;
          const _hasRole = roles && Array.isArray(roles) && roles.filter(r => r.name == '客户运维管理员').length;
          setHasRole(!!_hasRole);
          const { code, data } = res;
          if (code != SERVICE_INTERFACE_SUCCESS_CODE) {
          notification.error({ message: '提示', duration: 3, description: '系统引导页配置错误' });
          setInfo({ first: false, loading: false, error: true });
          return;
          }
          if (data === null) notification.info({ message: '提示', duration: 3, description: '未配置系统引导页' });
          setTemplate(data);
          setInfo({ first: false, loading: false, error: false });
          })
          .catch(err => {
          notification.error({ message: '提示', duration: 3, description: '系统引导页配置错误' });
          setInfo({ first: false, loading: false, error: true });
          });
          }, [props.global.token]);
          }, []);
          return (
          <SecurityLayout>
          <div className={styles.bootPage}>
          <div className={styles.bootPageMain}>
          <header className={styles.bootPageHead}>
          {/* eslint-disable-next-line jsx-a11y/alt-text */}
          <img src="https://panda-water.cn/web4/assets/images/bootPage/熊猫图标.png" />
          <div className={styles.bootPageTitle}>
          <span className={styles.bootPageZh}>{'熊猫智慧水务一体化解决方案'}</span>
          <span className={styles.bootPageEn}>Panda Smart Water Integration Platform & Solution</span>
          </div>
          </header>
          <section
          className={classNames(styles.bootPageSection, 'animate__fadeInDown', 'animate__animated', 'duration-500ms')}
          // style={{
          // width: `${scale < 1 ? 1280 : Math.ceil(1280 * scale)}px`,
          // }}
          >
          <ul
          className={classNames(styles.bootPageUl, 'animate__animated', styles[`bootPageUl_${IndustryNum}`])}
          style={{
          transform: `scale(${scale})`,
          left: '300px',
          bottom: '105px',
          opacity: 1,
          }}
          >
          {renderIndustr}
          </ul>
          </section>
          <Space className={styles.abs}>
          <Spin spinning={loadding} size="large" />
          </Space>
          </div>
          {hasRole ? (
          <div className={styles.cloudMonitorBtns}>
          <div className="cloud-using-anaylysis-btn" onClick={toOMSUsingAnalysis}>
          <img src={usingIcon} alt="" title="点击查看平台使用监控" />
          <span>平台使用分析</span>
          </div>
          </div>
          ) : null}
          </div>
          { info.loading ? <Spin/> : info.error ? <Empty/> : <RenderComponent/> }
          </SecurityLayout>
          );
          };
          const mapStateToProps = state => ({
          global: state.getIn(['global', 'globalConfig']),
          instance: state.getIn(['global', 'instance']),
          });
          const mapDispatchToProps = dispatch => ({
          updateConfig(config) {
          dispatch(actionCreators.getConfig(config));
          },
          createContext(data) {
          dispatch(actionCreators.createContext(data));
          },
          updateCurrentIndex(index) {
          dispatch(actionCreators.updateCurrentIndex(index));
          },
          });
          export default connect(
          mapStateToProps,
          mapDispatchToProps,
          )(BootPage);
          export default BootPage;
          src/pages/bootpage/index.less
          View file @ 560c0159
          @import '~antd/es/style/themes/default.less';
          .bootPage {
          width: 100%;
          height: 100%;
          position: relative;
          overflow: hidden;
          background: url('https://panda-water.cn/web4/assets/images/bootPage/背景.jpg')
          no-repeat top center;
          background-size: cover;
          .bootPageMain {
          display: flex;
          align-items: center;
          flex-direction: column;
          height: 100%;
          width: 100%;
          .bootPageHead {
          height: 150px;
          display: flex;
          align-items: center;
          justify-content: center;
          color: #ffffff;
          flex: none;
          padding-top: 50px;
          .bootPageTitle {
          display: flex;
          flex-direction: column;
          margin-left: 20px;
          .bootPageZh,
          .bootPageEn {
          font-weight: 500;
          }
          .bootPageZh {
          font-size: 34px;
          letter-spacing: 5px;
          }
          .bootPageEn {
          font-size: 16px;
          font-family: -webkit-body;
          letter-spacing: 1px;
          }
          }
          }
          .bootPageSection {
          display: flex;
          align-items: center;
          justify-content: center;
          flex: 1;
          height: calc(100% - 160px);
          margin: 20px 0;
          &::-webkit-scrollbar {
          width: 0px;
          height: 0px;
          }
          .bootPageUl {
          display: flex;
          width: 1280px;
          flex-wrap: wrap;
          justify-content: center;
          list-style: none;
          transition: all .5s ease-out;
          padding-top: 10px;
          .bootPageLi {
          width: 298px;
          height: 268.8px;
          margin: 10px;
          .bootPageList {
          width: 100%;
          height: 100%;
          border-radius: 4px;
          transition: all .2s ease-out;
          display: flex;
          align-items: center;
          justify-content: center;
          flex-direction: column;
          font-size: 24px;
          cursor: pointer;
          position: relative;
          &:hover {
          .listMain {
          transform: scale(1.1);
          }
          }
          span {
          margin-top: 20px;
          font-weight: 500;
          color: #fff;
          }
          .listMain {
          transition: all 0.2s ease-out;
          display: flex;
          align-items: center;
          flex-direction: column;
          img {
          width: 298px;
          height: 269px;
          border-radius: 20px;
          vertical-align: middle;
          }
          span {
          font-weight: 500;
          color: #fff;
          }
          .bootPageName {
          position: absolute;
          bottom: 31px;
          font-weight: 500;
          }
          .bootPageNameEng {
          font-size: 14px;
          position: absolute;
          bottom: 11px;
          }
          }
          }
          }
          &.bootPageUl_5 {
          width: 960px;
          }
          &.bootPageUl_9,
          &.bootPageUl_10 {
          width: 1600px;
          }
          }
          }
          }
          .abs {
          position: absolute;
          top: 50%;
          left: 50%;
          transform: translate(-50%, -50%);
          }
          .cloudMonitorBtns {
          position: fixed;
          height: 120px;
          width: 100%;
          bottom: 0px;
          padding: 0 20px;
          display: flex;
          justify-content: end;
          :global {
          .cloud-using-anaylysis-btn {
          cursor: pointer;
          width: 100px;
          display: flex;
          flex-direction: column;
          justify-content: center;
          & > img {
          width: 50px;
          margin: 0 25px;
          }
          & > span {
          color: #fff;
          font-size: 14px;
          width: 100%;
          text-align: center;
          }
          }
          }
          }
          :global {
          .@{ant-prefix}-spin-nested-loading,
          .@{ant-prefix}-spin-container {
          height: 100%;
          }
          }
          }
          @media screen and (max-width: 1440px) {
          .bootPage {
          .bootPageHead {
          .bootPageZh {
          font-size: 26px;
          }
          .bootPageEn {
          font-size: 12px;
          }
          }
          }
          }
          @media screen and (min-width: 1440px) and (max-width: 1600px) {
          .bootPage {
          .bootPageHead {
          .bootPageZh {
          font-size: 30px;
          }
          .bootPageEn {
          font-size: 14px;
          }
          }
          }
          }
          src/pages/bootpage/panda/index.js 0 → 100644
          View file @ 560c0159
          // 云平台引导页
          import React, { useCallback, useEffect, useMemo, useState } from 'react';
          import { Space, Spin } from 'antd';
          import classNames from 'classnames';
          import { connect } from 'react-redux';
          import { useIntl } from '@wisdom-utils/components';
          import { useDocumentTitle } from '@ant-design/pro-utils';
          import { useHistory } from '@wisdom-utils/runtime';
          import defaultSetting from '@wisdom-utils/components/lib/AppLayout/layouts/defaultSettings';
          import { actionCreators } from '@/containers/App/store';
          import LoginAction from '@/pages/user/login/login';
          import styles from './index.less';
          import { defaultApp } from '@/micro';
          import usingIcon from '@/assets/bootPage/using-icon.png';
          import { appService } from '@/api';
          const industries = [
          { name: '供水', type: '供水', subTitle: 'WATER SUPPLY' },
          { name: '农饮水', type: '农饮水', subTitle: 'RURAL POTABLE WATER' },
          { name: '排水', type: '排水', subTitle: 'DRAINAGE' },
          { name: '水利', type: '水利', subTitle: 'WATER CONSERVANCY' },
          { name: '能源', type: '能源', subTitle: 'ENERGY SOURCES' },
          { name: '高品质水', type: '高品质水', subTitle: 'HIGH QUALITY WATER' },
          // { name: '水资源', type: '水资源', subTitle: 'WATER RESOURCES' },
          { name: '熊猫智能实验室', type: '实验室', subTitle: 'PANDA AI. LAB' },
          { name: '水务大数据', type: '大数据', subTitle: 'WATER BIG DATA' },
          { name: '熊猫新产品', type: '熊猫新产品', subTitle: "PANDA'S NEW PRODUCT" },
          { name: '项目案例', type: '项目案例', subTitle: 'PROJECT CASE' },
          ];
          const renderIndustries = (config, callback) =>
          industries.map(item => {
          if (
          config &&
          config.userInfo &&
          config.userInfo.Industries &&
          config.userInfo.Industries instanceof Array &&
          config.userInfo.Industries.indexOf(item.type) > -1
          ) {
          return (
          <li className={styles.bootPageLi} key={item.type} onClick={event => callback(event, item.type)}>
          <div className={styles.bootPageList}>
          <div className={styles.listMain}>
          <img src={require(`@/assets/bootPage/${item.type}.png`)} alt="" />
          <span className={styles.bootPageName}>{item.name}</span>
          <span className={styles.bootPageNameEng}>{item.subTitle}</span>
          </div>
          </div>
          </li>
          );
          }
          });
          // let loginAction = null;
          const BootPage = props => {
          const [loadding, setLoadding] = useState(false);
          const [hasRole, setHasRole] = useState(false);
          const [scale, setScale] = useState(1);
          const [loginAction, setAction] = useState(() => new LoginAction(props));
          // const history = useHistory();
          useDocumentTitle(
          { title: defaultSetting.title, id: '', pageName: '行业切换' },
          props.global.title || defaultSetting.title,
          );
          const handlePage = useCallback(
          (event, type) => {
          event.persist();
          event.preventDefault();
          // 新增熊猫新产品引导页
          if(type === '熊猫新产品') {
          props.history.push(`/cloud/introduction/newproducts`);
          return;
          }
          setLoadding(true);
          const config = props.global;
          // const loginAction = new LoginAction(props);
          config.uiwidgets = [];
          config.widgets = [];
          config.allWidgets = [];
          props.instance && props.instance.updateConfig(config);
          // props.instance && props.instance.getUserInfoAndConfig('', true, type);
          loginAction && loginAction.getUserInfoAndConfig('', true, type);
          },
          [loginAction, props.global.token, props.instance],
          );
          useEffect(() => {
          // eslint-disable-next-line no-use-before-define
          handleResize();
          }, []);
          const handleResize = () => {
          const width = document.documentElement.clientWidth;
          const height = document.documentElement.clientHeight;
          // eslint-disable-next-line no-shadow
          const scale = width / 1920;
          setScale(scale);
          };
          useEffect(() => {
          window.addEventListener('resize', handleResize);
          const handleToggleIndustry = event => {
          setLoadding(false);
          props.history.push(`/?client=${props.global.client}`);
          defaultApp();
          // window.share.event.emit('triggerMicro', props.global);
          props.updateCurrentIndex(0);
          };
          loginAction.events.on('toggleIndustry', handleToggleIndustry);
          return () => {
          window.removeEventListener('resize', handleResize);
          loginAction.events.removeListener('toggleIndustry', handleToggleIndustry);
          };
          }, [loginAction.events, props]);
          const [IndustryNum, setIndustryNum] = useState(0);
          const renderIndustr = useMemo(() => renderIndustries(props.global, handlePage), [handlePage, props.global.token]);
          useEffect(() => {
          const NewIndustryNum =
          props.global && props.global.userInfo && props.global.userInfo.Industries
          ? props.global.userInfo.Industries.filter(item => !!industries.find(d => d.type === item)).length
          : 0;
          setIndustryNum(NewIndustryNum);
          }, [handlePage, props.global.token]);
          const intl = useIntl();
          const toOMSUsingAnalysis = e => {
          e && e.stopPropagation();
          props.history.push(`/cloud/analysis/using`);
          };
          useEffect(() => {
          appService
          .getUserInfo({
          token: props.global.token,
          subOID: 'subOID',
          site: 'cloud',
          ignoreSite: true,
          })
          .then(res => {
          const roles = res && !res.errMsg ? res.roles : null;
          const _hasRole = roles && Array.isArray(roles) && roles.filter(r => r.name == '客户运维管理员').length;
          setHasRole(!!_hasRole);
          });
          }, [props.global.token]);
          return (
          <div className={styles.bootPage}>
          <div className={styles.bootPageMain}>
          <header className={styles.bootPageHead}>
          {/* eslint-disable-next-line jsx-a11y/alt-text */}
          <img src="https://panda-water.cn/web4/assets/images/bootPage/熊猫图标.png" />
          <div className={styles.bootPageTitle}>
          <span className={styles.bootPageZh}>{'熊猫智慧水务一体化解决方案'}</span>
          <span className={styles.bootPageEn}>Panda Smart Water Integration Platform & Solution</span>
          </div>
          </header>
          <section
          className={classNames(styles.bootPageSection, 'animate__fadeInDown', 'animate__animated', 'duration-500ms')}
          // style={{
          // width: `${scale < 1 ? 1280 : Math.ceil(1280 * scale)}px`,
          // }}
          >
          <ul
          className={classNames(styles.bootPageUl, 'animate__animated', styles[`bootPageUl_${IndustryNum}`])}
          style={{
          transform: `scale(${scale})`,
          left: '300px',
          bottom: '105px',
          opacity: 1,
          }}
          >
          {renderIndustr}
          </ul>
          </section>
          <Space className={styles.abs}>
          <Spin spinning={loadding} size="large" />
          </Space>
          </div>
          {hasRole ? (
          <div className={styles.cloudMonitorBtns}>
          <div className="cloud-using-anaylysis-btn" onClick={toOMSUsingAnalysis}>
          <img src={usingIcon} alt="" title="点击查看平台使用监控" />
          <span>平台使用分析</span>
          </div>
          </div>
          ) : null}
          </div>
          );
          };
          const mapStateToProps = state => ({
          global: state.getIn(['global', 'globalConfig']),
          instance: state.getIn(['global', 'instance']),
          });
          const mapDispatchToProps = dispatch => ({
          updateConfig(config) {
          dispatch(actionCreators.getConfig(config));
          },
          createContext(data) {
          dispatch(actionCreators.createContext(data));
          },
          updateCurrentIndex(index) {
          dispatch(actionCreators.updateCurrentIndex(index));
          },
          });
          export default connect(
          mapStateToProps,
          mapDispatchToProps,
          )(BootPage);
          src/pages/bootpage/panda/index.less 0 → 100644
          View file @ 560c0159
          @import '~antd/es/style/themes/default.less';
          .bootPage {
          width: 100%;
          height: 100%;
          position: relative;
          overflow: hidden;
          background: url('https://panda-water.cn/web4/assets/images/bootPage/背景.jpg')
          no-repeat top center;
          background-size: cover;
          .bootPageMain {
          display: flex;
          align-items: center;
          flex-direction: column;
          height: 100%;
          width: 100%;
          .bootPageHead {
          height: 150px;
          display: flex;
          align-items: center;
          justify-content: center;
          color: #ffffff;
          flex: none;
          padding-top: 50px;
          .bootPageTitle {
          display: flex;
          flex-direction: column;
          margin-left: 20px;
          .bootPageZh,
          .bootPageEn {
          font-weight: 500;
          }
          .bootPageZh {
          font-size: 34px;
          letter-spacing: 5px;
          }
          .bootPageEn {
          font-size: 16px;
          font-family: -webkit-body;
          letter-spacing: 1px;
          }
          }
          }
          .bootPageSection {
          display: flex;
          align-items: center;
          justify-content: center;
          flex: 1;
          height: calc(100% - 160px);
          margin: 20px 0;
          &::-webkit-scrollbar {
          width: 0px;
          height: 0px;
          }
          .bootPageUl {
          display: flex;
          width: 1280px;
          flex-wrap: wrap;
          justify-content: center;
          list-style: none;
          transition: all .5s ease-out;
          padding-top: 10px;
          .bootPageLi {
          width: 298px;
          height: 268.8px;
          margin: 10px;
          .bootPageList {
          width: 100%;
          height: 100%;
          border-radius: 4px;
          transition: all .2s ease-out;
          display: flex;
          align-items: center;
          justify-content: center;
          flex-direction: column;
          font-size: 24px;
          cursor: pointer;
          position: relative;
          &:hover {
          .listMain {
          transform: scale(1.1);
          }
          }
          span {
          margin-top: 20px;
          font-weight: 500;
          color: #fff;
          }
          .listMain {
          transition: all 0.2s ease-out;
          display: flex;
          align-items: center;
          flex-direction: column;
          img {
          width: 298px;
          height: 269px;
          border-radius: 20px;
          vertical-align: middle;
          }
          span {
          font-weight: 500;
          color: #fff;
          }
          .bootPageName {
          position: absolute;
          bottom: 31px;
          font-weight: 500;
          }
          .bootPageNameEng {
          font-size: 14px;
          position: absolute;
          bottom: 11px;
          }
          }
          }
          }
          &.bootPageUl_5 {
          width: 960px;
          }
          &.bootPageUl_9,
          &.bootPageUl_10 {
          width: 1600px;
          }
          }
          }
          }
          .abs {
          position: absolute;
          top: 50%;
          left: 50%;
          transform: translate(-50%, -50%);
          }
          .cloudMonitorBtns {
          position: fixed;
          height: 120px;
          width: 100%;
          bottom: 0px;
          padding: 0 20px;
          display: flex;
          justify-content: end;
          :global {
          .cloud-using-anaylysis-btn {
          cursor: pointer;
          width: 100px;
          display: flex;
          flex-direction: column;
          justify-content: center;
          & > img {
          width: 50px;
          margin: 0 25px;
          }
          & > span {
          color: #fff;
          font-size: 14px;
          width: 100%;
          text-align: center;
          }
          }
          }
          }
          :global {
          .@{ant-prefix}-spin-nested-loading,
          .@{ant-prefix}-spin-container {
          height: 100%;
          }
          }
          }
          @media screen and (max-width: 1440px) {
          .bootPage {
          .bootPageHead {
          .bootPageZh {
          font-size: 26px;
          }
          .bootPageEn {
          font-size: 12px;
          }
          }
          }
          }
          @media screen and (min-width: 1440px) and (max-width: 1600px) {
          .bootPage {
          .bootPageHead {
          .bootPageZh {
          font-size: 30px;
          }
          .bootPageEn {
          font-size: 14px;
          }
          }
          }
          }
          Markdown is supported
          0% or
          You are about to add 0 people to the discussion. Proceed with caution.
          Finish editing this message first!
          Please register or to comment