perf: 优化引导页

src/pages/transitionalpage/index.js

@@ -8,6 +8,8 @@ import styles from './index.less';
 import SecurityLayout from '../../layouts/SecurityLayout';
 import LoginAction from '../user/login/login';
 import { actionCreators } from '../../containers/App/store';
+import i18n from '../../utils/share';
+const pages = i18n.getI18n('app');
 class WaterBox extends React.Component {
   // eslint-disable-next-line no-useless-constructor
   constructor(props) {
@@ -89,20 +91,27 @@ class ProjectBox extends React.Component {
                 item +
                 '.png')})`,
             }}
+            key={item}
           >
             <div
               className={classNames(styles.bootPagelbBox, styles.bootPageitem)}
               type={item}
-              key={item}
               onClick={event => callback(event, item)}
               style={{
-                background: `url(${require('../../assets/transitionalpage/'+item + '图.jpg')})`,
+                background: `url(${require('../../assets/transitionalpage/' +
+                  item +
+                  '图.jpg')})`,
               }}
+              onMouseEnter={e => this.mouseOveHandle(item)}
+              onMouseLeave={e => this.mouseOutHandle(item)}
             >
-               <img src={  this.state[item] ? require(`../../assets/transitionalpage/${item}图动.gif`): require(`../../assets/transitionalpage/${item}图.jpg`) }
-                    onMouseEnter={e =>  this.mouseOveHandle(item)}
-                    onMouseLeave={e =>  this.mouseOutHandle(item)}
-               />
+              <img
+                src={
+                  this.state[item]
+                    ? require(`../../assets/transitionalpage/${item}图动.gif`)
+                    : require(`../../assets/transitionalpage/${item}图.jpg`)
+                }
+              />
               <div>{item}</div>
             </div>
           </div>
@@ -148,13 +157,20 @@ class RightBox extends React.Component {
             key={item}
             onClick={event => callback(event, item)}
             style={{
-              background: `url(${require('../../assets/transitionalpage/'+item + '图.jpg')})`,
+              background: `url(${require('../../assets/transitionalpage/' +
+                item +
+                '图.jpg')})`,
             }}
+            onMouseEnter={e => this.mouseOveHandle(item)}
+            onMouseLeave={e => this.mouseOutHandle(item)}
           >
-             <img src={  this.state[item] ? require(`../../assets/transitionalpage/${item}图动.gif`): require(`../../assets/transitionalpage/${item}图.jpg`) }
-                    onMouseEnter={e =>  this.mouseOveHandle(item)}
-                    onMouseLeave={e =>  this.mouseOutHandle(item)}
-               />
+            <img
+              src={
+                this.state[item]
+                  ? require(`../../assets/transitionalpage/${item}图动.gif`)
+                  : require(`../../assets/transitionalpage/${item}图.jpg`)
+              }
+            />
             <div className={styles.bootPagebTitle}>{item}</div>
           </div>
         );
@@ -219,7 +235,7 @@ const BootPage = props => {
             />
             <div className={styles.bootPageTitle}>
               <span className={styles.bootPageZh}>
-                熊猫智慧城市监控管理解决方案
+                {pages.get('settings.bootpage.title')}
               </span>
             </div>
           </header>

src/pages/transitionalpage/index.less

@@ -119,7 +119,6 @@
               font-weight: normal;
               display: flex;
               align-items: center;
-              padding: 6px;
               width: 316px;
               height: 181px;
               position: relative;
@@ -222,7 +221,8 @@
       text-align: center;
       font-size: 14px;
       flex: none;
-      height: 100px;
+      height: 150px;
+      padding: 100px 0 0;
       a {
         color: #ffffff;
         text-decoration: none;