From 8fc7d9393d1df0edd1a663ddc0248abfeec30b09 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=AE=B8=E7=BA=A2=E6=A2=85?= <1924913374@qq.com>
Date: Wed, 18 May 2022 16:09:19 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E9=81=AE=E7=BD=A9=E5=AF=BC?=
 =?UTF-8?q?=E8=88=AA=E5=85=BC=E5=AE=B9=E5=B0=8F=E5=B1=8F=E5=B9=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/mouseMenu/main.less |  10 +-
 src/pages/home/home.js             | 201 ++++++++++++++---------------
 src/pages/home/home.less           |  17 ++-
 3 files changed, 114 insertions(+), 114 deletions(-)

diff --git a/src/components/mouseMenu/main.less b/src/components/mouseMenu/main.less
index 6f1be9da..32a0a525 100644
--- a/src/components/mouseMenu/main.less
+++ b/src/components/mouseMenu/main.less
@@ -1,21 +1,23 @@
 .mouseMenu {
     .menuBody {
-        min-width: 40%;
-        margin-left: 320px;
-        // height: 400px;
+        width: 60vw;
+        margin-left: 287px;
         background: #f1f2f3;
         position: relative;
         .first_menu {
             display: flex;
+            width: 60vw;
             >div {
+                width: 140px;
                 .menu_items{
                     // justify-content: flex-start;
                     padding: 0;
                     font-size: 14px;
                     color: #333;
+                    width: 100%;
                     line-height: 40px;
                     &:hover{
-                        background: #f2f4f7;
+                        background: #f00;
                         color: #296bef;
                     }
 
diff --git a/src/pages/home/home.js b/src/pages/home/home.js
index 024f0ce2..e7249673 100644
--- a/src/pages/home/home.js
+++ b/src/pages/home/home.js
@@ -68,7 +68,7 @@ export default class App extends Component {
   }
   state = {
     visible: false,
-    mouseMenuMask:false,
+    mouseMenuMask: false,
     setrender: 1,
     linkshow: "系统管理",
     isShowSub: true,
@@ -157,14 +157,14 @@ export default class App extends Component {
     currentTime: new Date().getTime(),
     timeOut: 15 * 60 * 1000, //设置超时时间： 1分
   };
- //打开菜单移入遮罩
- openMouseMask(){
-  this.setState({mouseMenuMask:true});
- }
+  //打开菜单移入遮罩
+  openMouseMask() {
+    this.setState({ mouseMenuMask: true });
+  }
   componentDidMount(e) {
     Bus.addListener('closeMask', (prop) => {
-      console.log(161,this);
-      this.setState({mouseMenuMask:prop});
+      console.log(161, this);
+      this.setState({ mouseMenuMask: prop });
     })
     if (this.state.noShowSubMenu.indexOf(this.props.location.pathname) > -1) {
       this.setState({ isShowSub: false });
@@ -172,7 +172,7 @@ export default class App extends Component {
       this.setState({ isShowSub: true });
     }
   }
-  componentWillUnmount() {}
+  componentWillUnmount() { }
 
   //获取用户信息
   getUserInfuFn() {
@@ -185,17 +185,17 @@ export default class App extends Component {
             self.setState({ userInfo: response });
             sessionStorage.setItem("userInfo", JSON.stringify(response));
           },
-          (err) => {}
+          (err) => { }
         );
       })
-      .catch((err) => {});
+      .catch((err) => { });
   }
   //修改密码
   modifyFn() {
     this.setState({ visible: true });
   }
   //修改密码
-  modifyPwdFn() {}
+  modifyPwdFn() { }
   //退出登录
   exitFn() {
     let self = this;
@@ -216,7 +216,7 @@ export default class App extends Component {
               }, 1000);
             }
           })
-          .catch((err) => {});
+          .catch((err) => { });
       },
       onCancel: this.onCancel,
       className: "questModal",
@@ -251,7 +251,7 @@ export default class App extends Component {
               sessionStorage.setItem("updatetime", Date.now());
               sessionStorage.setItem("productsList", JSON.stringify(req.data));
             },
-            (err) => {}
+            (err) => { }
           );
         });
       }
@@ -309,7 +309,7 @@ export default class App extends Component {
               throw "终止循环";
             }
           });
-        } catch (e) {}
+        } catch (e) { }
         sessionStorage.setItem(
           "menulinklist",
           JSON.stringify(item[0].children)
@@ -324,11 +324,11 @@ export default class App extends Component {
     return (
       <Router>
         <div className="start dflexajc">
-        
-        {
-          this.state.mouseMenuMask?<div className="maskMenu"></div>:null
-        }
-          <div className="header dflexaj boxs">
+
+          {
+            this.state.mouseMenuMask ? <div className="maskMenu"></div> : null
+          }
+          <div className="header  boxs">
             {/* logo */}
             <div className="log">
               <img
@@ -349,94 +349,81 @@ export default class App extends Component {
                 openMouseMask={this.openMouseMask.bind(this)}
               />
             </div>
-            <div className="navicon">
-              {" "}
-              <img
-                src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/logs.svg"
-                alt=""
-              />{" "}
-              <a
-                href="https://shimo.im/docs/dPkpKZYV7yfNpqOy/"
-                target="_blank"
-                className="help"
-              >
-                更新日志
-              </a>
-            </div>
-            <div className="navicon">
-              {" "}
-              <img
-                src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/help.svg"
-                alt=""
-              />{" "}
-              <a
-                href="https://shimo.im/docs/wV3VVQP5W6I1nz3y/"
-                target="_blank"
-                className="help"
-              >
-                帮助中心
-              </a>
-            </div>
-
-            {/* 用户头像信息 */}
-            <div className="userImg dflexa">
-              {/* <Link to="https://youzan.com" target="_blank" className="mr15 helpcenter">帮助中心</Link> */}
-
-              {/* {!this.state.userInfo.head?  <Avatar   size="large"
-        src={this.state.userInfo.head}/>:
-        <Avatar   size="large"
-        src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/default.svg"/>}
-                */}
-            </div>
-            <Pop
-              className="exitPop"
-              trigger="hover"
-              position="bottom-right"
-              content={
-                <div>
-                  <div className="exit-box">
-                    <p className="exit-header dflexacsa">
-                      {this.state.userInfo.head ? (
-                        <Avatar size="large" src={this.state.userInfo.head} />
-                      ) : (
-                        <Avatar
-                          size="large"
-                          src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/default.svg"
-                        />
-                      )}
-                      <p className="exit-userInfo dflexacs">
-                        <span> 姓名:{this.state.userInfo.real_name}</span>
-                        <span> 账号:{this.state.userInfo.user_name}</span>
-                      </p>
-                    </p>
-                    <p className="dflexaj">
-                      <span
-                        onClick={() => {
-                          this.exitFn();
-                        }}
-                        className="exit-btn"
-                      >
-                        退出
-                      </span>
-                      <span
-                        onClick={() => {
-                          this.modifyFn();
-                        }}
-                        className="modify-btn"
-                      >
-                        修改密码
-                      </span>
-                    </p>
-                  </div>
-                </div>
-              }
-            >
-              {/*  */}
-              <div className="nameItem">
-                {this.state.userInfo.real_name}&nbsp;
-                <Icon type="down" className="exitIcon" />
+            <div className="nav-person">
+              <div className="navicon">
+                <img
+                  src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/logs.svg"
+                  alt=""
+                />
+                <a href="https://shimo.im/docs/dPkpKZYV7yfNpqOy/"
+                  target="_blank"
+                  className="help">
+                  更新日志
+                </a>
               </div>
-            </Pop>
+              <div className="navicon">
+                <img
+                  src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/help.svg"
+                  alt=""
+                />
+                <a
+                  href="https://shimo.im/docs/wV3VVQP5W6I1nz3y/"
+                  target="_blank"
+                  className="help"
+                >
+                  帮助中心
+                </a>
+              </div>
+              <Pop
+                className="exitPop"
+                trigger="hover"
+                position="bottom-right"
+                content={
+                  <div>
+                    <div className="exit-box">
+                      <p className="exit-header dflexacsa">
+                        {this.state.userInfo.head ? (
+                          <Avatar size="large" src={this.state.userInfo.head} />
+                        ) : (
+                            <Avatar
+                              size="large"
+                              src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/default.svg"
+                            />
+                          )}
+                        <p className="exit-userInfo dflexacs">
+                          <span> 姓名:{this.state.userInfo.real_name}</span>
+                          <span> 账号:{this.state.userInfo.user_name}</span>
+                        </p>
+                      </p>
+                      <p className="dflexaj">
+                        <span
+                          onClick={() => {
+                            this.exitFn();
+                          }}
+                          className="exit-btn"
+                        >
+                          退出
+                      </span>
+                        <span
+                          onClick={() => {
+                            this.modifyFn();
+                          }}
+                          className="modify-btn"
+                        >
+                          修改密码
+                      </span>
+                      </p>
+                    </div>
+                  </div>
+                }
+              >
+                {/*  */}
+                <div className="nameItem">
+                  {this.state.userInfo.real_name}&nbsp;
+                <Icon type="down" className="exitIcon" />
+                </div>
+              </Pop>
+            </div>
           </div>
           <Dialog
             visible={this.state.visible}
@@ -561,7 +548,7 @@ export default class App extends Component {
                 exact={true}
                 component={distributoradd}
               />
-               <Route
+              <Route
                 path="/home/distributor-edit"
                 exact={true}
                 component={distributorEdit}
diff --git a/src/pages/home/home.less b/src/pages/home/home.less
index 6a5673ff..fd152ab0 100644
--- a/src/pages/home/home.less
+++ b/src/pages/home/home.less
@@ -28,6 +28,9 @@
   top: 0;
   width: 100%;
   z-index: 33;
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
   padding: 0 20px;
 }
 .start .log{
@@ -35,7 +38,6 @@
   font-size: 20px;
   font-weight: 500;
   color: #313233;
-  width: 300px;
   display: flex;
   align-items: center;
 }
@@ -46,12 +48,21 @@
 }
 .start .log span{
   padding-left: 15px;
+  width: 200px;
   border-left: 1px solid #ccc;
 }
 .nav{
   height: 100%;
-  min-width: 300px;
-  flex:1;
+  width: 60vw;
+  // min-width: 300px;
+  // flex:1;
+}
+//导航栏个人信息
+.nav-person{
+  display: flex;  
+  min-width: 130px;
+  flex: 1;
+  justify-content: flex-end;
 }
 .start .helpcenter{
   color: #666;