فهرست منبع

菜单样式修改

洪海涛 4 سال پیش
والد
کامیت
3a8a48d55d
3فایلهای تغییر یافته به همراه24 افزوده شده و 12 حذف شده
  1. 2 2
      src/components/header/index.js
  2. 10 10
      src/components/header/menu/index.js
  3. 12 0
      src/components/header/menu/style.less

+ 2 - 2
src/components/header/index.js

@@ -15,7 +15,7 @@ function Header(props) {
     outLogin,
     platformName,
     changePage,
-    helpPageUrl,
+    helpPageUrl = true,
     menuData,
     appList,
     onAppIdChange,
@@ -32,7 +32,7 @@ function Header(props) {
           onClick={() => goToHome()}
         />
         <span className="menu">质惠·{name}</span>
-        {appList && 
+        {appList &&
         <Select
           value={appValue || ''}
           className="headerSelectApp"

+ 10 - 10
src/components/header/menu/index.js

@@ -91,25 +91,25 @@ export default function MenuBox(props) {
   }
   return (
     <div className="menu-wrapper">
-      <div className="children-menu-wrapper borderBottom">
+      <div className="children-menu-wrapper borderBottom no-children">
         {menuBaseData.map((elm, index) => {
-          if (index < 3) {
+          if (index < 4) {
             return (
-              <div onClick={() => switchProjects(elm)} className={clsx("title", platformName === elm.key && "active")} key={elm.key}>
-                <img width="16" height="14" src={elm.iconData} style={{position: "relative", top: "-2px", marginRight: "5px",}} alt={""}/>
-                {elm.name}{!page && platformName === elm.key && (<span className="new"><NewIcon /></span>)}
+              <div onClick={() => switchProjects(elm)} style={elm.styles} className={clsx("title", platformName === elm.key && "active")} key={elm.key}>
+                <img width="16" height="14" src={elm.iconData} style={{position: "relative", top: "-2px", marginRight: "5px", ...elm.imageStyle}} alt={""}/>
+                <span className="content">{elm.name}{!page && platformName === elm.key && (<span className="new"><NewIcon /></span>)}</span>
               </div>
             );
           }
         })}
       </div>
-      <div className="children-menu-wrapper" key={menuBaseData[3].key}>
-        <div onClick={() => switchProjects(menuBaseData[3])} className={clsx("title", platformName === menuBaseData[3].key && "active")}>
-          <img width="16" height="16" src={menuBaseData[3].iconData} style={{ position: "relative", top: "-2px", marginRight: "5px" }} alt={""}/>
-          {menuBaseData[3].name}{!page && platformName === menuBaseData[3].key && (<span className="new"><NewIcon /></span>)}
+      <div className="children-menu-wrapper" key={menuBaseData[4].key}>
+        <div onClick={() => switchProjects(menuBaseData[4])} className={clsx("title", platformName === menuBaseData[4].key && "active")}>
+          <img width="16" height="16" src={menuBaseData[4].iconData} style={{ position: "relative", top: "-2px", marginRight: "5px" }} alt={""}/>
+          {menuBaseData[4].name}{!page && platformName === menuBaseData[4].key && (<span className="new"><NewIcon /></span>)}
         </div>
         <Row gutter={[24, 24]} className="box" style={{ marginTop: "5px" }}>
-          {menuBaseData[3].menuList.length > 0 && menuBaseData[3].menuList.map((t) => icon(t))}
+          {menuBaseData[4].menuList.length > 0 && menuBaseData[4].menuList.map((t) => icon(t))}
         </Row>
       </div>
     </div>

+ 12 - 0
src/components/header/menu/style.less

@@ -34,6 +34,18 @@
       }
     }
 
+    &.no-children {
+      flex-wrap: wrap;
+      padding-bottom: 10px;
+      .title{
+        margin-bottom: 10px;
+        width: 91px;
+        .content {
+          position: relative;
+        }
+      }
+    }
+
     .title {
       cursor: pointer;
       display: inline-block;