- 优化新产品导航图界面

src/layouts/BasicLayout.js

@@ -35,6 +35,7 @@ import {
   store,
   event
 } from '@wisdom-utils/utils';
+import { Storeage as Store } from '@wisdom-utils/utils/lib/helpers';
 
 import { waterMark } from '../utils/mark';
 import layoutStyles from './BasicLayout.less';
@@ -246,6 +247,8 @@ const transformFloatMenu = (routes, homepage) => {
 };
 
 const Layout = (props) => {
+  const currentProduct = new Store(`__global__recent_productIndex__micro_${window.location.hostname}`);
+  const menuState = sessionStorage.getItem('menuState') || 'open';
   const [cityData, setCityData] = useState({});
   const [siteLoading, setSiteLoading] = useState(false);
   const [siteAction, setSiteAction] = useState(() => new Site(props, setSiteLoading));
@@ -410,7 +413,7 @@ const Layout = (props) => {
           // onLoadingChange: (loading) => setMenuLoading(loading)
         }}
         logo={logo}
-        topMenuActiveKey={props.currentMenuIndex < 0 ? 0 : props.currentMenuIndex}
+        topMenuActiveKey={currentProduct.get('currentMenuIndex') || 0}
         rightContentRender={() => <RightContent />}
         onPageChange={() => {
           // if(!props.global.token) {

src/pages/cloud/introduction/newproducts/Card.js

@@ -2,17 +2,11 @@ import React from 'react';
 import classnames from 'classnames';
 import styles from './index.less';
 import cover from './images/default.png';
-import tagHot from './images/hot.png';
-import tagNew from './images/new.png';
 
-import desc from './images/副标题.png';
-import descActive from './images/副标题_active.png';
+import { chunk } from 'lodash-es';
 
 const assetPath = `${window.location.origin}/PandaWorkFlow/WorkFlow/AccountManage/DownloadFiles`;
-const tags = {
-  'New': tagNew,
-  'Hot': tagHot,
-}
+
 const Card = ({onCardClick, ...props}) => {
   const {  config } = props;
 
@@ -24,8 +18,6 @@ const Card = ({onCardClick, ...props}) => {
     config['系统特点'] = config['系统特点'] + ',';
   }
 
-
-
   return (
     <div className={styles.card} onClick={e => onCardClick(e, props)}>
       <div className={classnames(styles['card-title'], styles['nowrap-text'])}>
@@ -54,15 +46,21 @@ const Card = ({onCardClick, ...props}) => {
           <div className={classnames(styles['card-tags'])}>
             <div className={classnames(styles['card-list'])}>
               {
-                config && config['系统特点'] && config['系统特点'].split(',').map((item, index) => {
+                config && config['系统特点'] && chunk(config['系统特点'].split(',') , 2).map((item, index) => {
+                  return <div key={index} className={classnames(styles['card-list-content'])}>
+                    {
+                      item.map((child, key) => {
                         return <div className={classnames(styles['card-tag'])}
                                     style={{
                                       height: config['系统特点'].split(',').length <= 6 ? 44 : 40,
                                       lineHeight: config['系统特点'].split(',').length <= 6 ? '44px' : '40px',
                                       marginTop: config['系统特点'].split(',').length <= 8 ? 10 : 0
-                              }} key={index}>
+                                    }} key={key + index}>
                           <i className={classnames(styles['card-tag-icon'])} />
-                    {item}
+                          {child}
+                        </div>
+                      })
+                    }
                   </div>
                 })
               }

src/pages/cloud/introduction/newproducts/index.less

@@ -177,7 +177,7 @@
     left: 4%;
     font-size: 1.5rem;
     font-weight: 400;
-    color: #000000;
+    color: #262626;
     font-family: "zihun";
   }
   .back {
@@ -229,6 +229,10 @@
       background-image: url(./images/副标题_active.png);
       color: #000000;
     }
+
+    .card-title{
+      color: #000;
+    }
   }
 
   .card-content{
@@ -262,12 +266,19 @@
 
       .card-list {
 
+        .card-list-content {
+          border-bottom: 1px solid #2781A8;
+
           &::after{
             content: "";
             display: block;
             clear: both;
           }
 
+          &:last-child {
+            border-bottom: none;
+          }
+
           .card-tag{
             float: left;
             width: 50%;
@@ -284,7 +295,13 @@
               width: 5px;
               height: 5px;
               background: #E1F4FD;
-            opacity: 0.53
+              opacity: 0.53;
+              -webkit-transform:rotate(45deg) ;  //Webkit / Safari / Chrome
+              -moz-transform:rotate(45deg) ;  //Firefox
+              -ms-transform:rotate(45deg) ;  //Internet Explorer
+              -o-transform:rotate(45deg) ;  //Opera
+              transform:rotate(45deg) ;
+            }
           }
         }
       }