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,19 +91,26 @@ 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')})`,
               }}
-            >
-               <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>
@@ -148,12 +157,19 @@ 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')})`,
             }}
-          >
-             <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;