qj-happy-common-zhongjian 1.0.27

package/src/views/pc/default/top-modules/topSimple.vue

@@ -0,0 +1,248 @@
+<template>
+  <div class="common-top-bar">
+    <div class="inner w1200 m0a">
+      <div class="left">
+        <ul class="top-left-ul">
+          <li @mouseenter="enter" class="store-er" @mouseleave="leave">
+            <span>手机订货更快捷</span>
+            <i class="icon-erweima iconfont"></i>
+            <div v-if="show" class="erwm">
+              <div>
+                <img :src="myerwm" alt />
+              </div>
+            </div>
+          </li>
+          <li>客服电话：400-880-8260</li>
+        </ul>
+      </div>
+      <div class="right">
+        <ul class>
+          <li>
+            <a href="/paas/user-manager/index.html#/user">
+              <img :src="userInfor.userImg || userImg" class="user-img" alt />
+              <span>{{userInfor.userName}}</span>
+            </a>
+          </li>
+          <li v-if="isLogin">
+            <a href="javascript:;" @click="logout">[ 退出 ]</a>
+          </li>
+          <li v-if="!isLogin">
+            <a href="/paas/index/index.html#/loginPc">登录</a>
+          </li>
+        </ul>
+      </div>
+    </div>
+    <slot></slot>
+  </div>
+</template>
+
+<script>
+import { logout } from "#/api/login";
+import { getToken, removeToken } from "#/utils/auth";
+import API from "#/api/common/index.js";
+import erwm from "#/assets/newerwei.png";
+
+export default {
+  data() {
+    return {
+      gw: "暂无顾问",
+      flaggw: false,
+      myerwm: erwm,
+      show: false,
+      userImg: require("../assets/a13.png")
+    };
+  },
+  computed: {
+    isLogin() {
+      return this.getUserCookie() ? getToken(this.getUserCookie()) : false;
+    },
+    userInfor() {
+      let info =
+        this.getUserCookie() && getToken(this.getUserCookie())
+          ? JSON.parse(getToken(this.getUserCookie()))
+          : {};
+      return info;
+    }
+  },
+  mounted() {
+    window.addEventListener("click", this.gwhide);
+  },
+  methods: {
+    gwopen() {
+      API.getCustrelByEmployee().then(res => {
+        if (res) {
+          if (res.employeePhone) {
+            this.gw = res.employeePhone;
+          } else {
+            this.gw = "暂无顾问";
+          }
+        } else {
+          this.gw = "暂无顾问";
+        }
+      });
+      this.flaggw = true;
+    },
+    gwhide() {
+      this.flaggw = false;
+    },
+    enter() {
+      this.show = true;
+    },
+    leave() {
+      this.show = false;
+    },
+    logout() {
+      // 退出
+      logout().then(() => {
+        let newDomain = document.domain
+          .split(".")
+          .splice(-2)
+          .join(".");
+        removeToken("LOGININFO", newDomain, "/");
+        // removeToken("personalInfo", newDomain, "/");
+        // location.reload();
+        location.href = location.origin;
+      });
+    },
+    getUserCookie() {
+      let cookie = document.cookie;
+      let start = cookie.indexOf("saas-user-");
+      if (start > -1) {
+        let end = cookie.indexOf("=", start);
+        return cookie.substring(start, end);
+      } else {
+        return null;
+      }
+    }
+  }
+};
+</script>
+
+<style  rel="stylesheet/scss" lang="scss" scoped >
+.common-top-bar {
+  position: relative;
+  color: #191919;
+}
+.gw {
+  position: relative;
+}
+.store-er {
+  span {
+    display: inline-block;
+    margin-right: 8px;
+    float: left;
+  }
+  i {
+    font-size: 16px;
+  }
+}
+.mygw {
+  // border: 1px solid #ccc;
+  border-radius: 5px;
+  text-align: center;
+  // display: none;
+  background-color: white;
+  z-index: 999;
+  width: 200px;
+  height: 30px;
+  line-height: 30px;
+  position: absolute;
+  left: -50%;
+  top: 40px;
+  box-shadow: 0px 0px 10px #ccc;
+}
+.triangle_border_up {
+  // display: none;
+  position: absolute;
+  left: 66%;
+  top: 30px;
+  width: 0;
+  height: 0;
+  border-width: 0 10px 10px;
+  border-style: solid;
+  border-color: transparent transparent white; /*透明 透明  灰*/
+}
+.erwm {
+  text-align: center;
+  width: 220px;
+  img {
+    width: 100px;
+    height: 100px;
+    display: block;
+  }
+  div {
+    display: inline-block;
+  }
+  position: absolute;
+  right: 50%;
+  margin-right: -120px;
+  top: 40px;
+  z-index: 9999;
+}
+.top-left-con {
+  float: left;
+  // margin: 0 20px;
+}
+.top-left-ul {
+  margin-left: 9px;
+  float: left;
+  li {
+    float: left;
+    margin: 0 10px;
+    &:first-child {
+      margin-right: 42px;
+    }
+    a {
+      color: #191919;
+    }
+    position: relative;
+  }
+}
+.user-img {
+  width: 28px;
+  height: 28px;
+  border-radius: 50%;
+  margin-right: 5px;
+}
+.common-top-bar {
+  color: #191919;
+  font-size: 13px;
+  width: 100%;
+  height: 40px;
+  line-height: 40px;
+  background-color: #fff;
+  .inner {
+    .left {
+      float: left;
+    }
+    .right {
+      float: right;
+      ul {
+        margin-right: 1px;
+      }
+      ul li {
+        margin: 0 10px;
+        float: left;
+        float:left a {
+          color: #191919;
+        }
+        // &:hover a {
+        //   color: #ff9e01;
+        // }
+      }
+      .line {
+        width: 1px;
+        height: 16px;
+        background: #ccc;
+        margin: 12px 28px;
+      }
+      .item {
+        vertical-align: top;
+        height: 20px;
+        margin-top: 12px;
+        line-height: 20px;
+      }
+    }
+  }
+}
+</style>

package/src/views/pc/default/top-modules/topSimpleHy.vue

@@ -0,0 +1,256 @@
+<template>
+  <div class="common-top-bar">
+    <div class="inner w1200 m0a">
+      <div class="left">
+        <ul class="top-left-ul">
+          <li @mouseenter="enter" class="store-er" @mouseleave="leave">
+            <span>手机订货更快捷</span>
+            <i class="icon-erweima iconfont"></i>
+            <div v-if="show" class="erwm">
+              <div>
+                <img :src="myerwm" alt />
+              </div>
+            </div>
+          </li>
+          <li>订单中心电话: 0731-52757188</li>
+          <li>财务电话: 0731-52752688</li>
+          <li>客服电话: 4008801905</li>
+        </ul>
+      </div>
+      <div class="right">
+        <ul class>
+          <li>
+            <a href="/paas/user-manager/index.html#/car">
+              <!-- <img src="" class="user-img" alt /> -->
+              <span class="iconfont icon-newgwc" style="font-size: 20px"></span>
+            </a>
+          </li>
+          <li>
+            <a href="/paas/user-manager/index.html#/security">
+              <!-- <img :src="userInfor&&userInfor.userImgurl || userImg" class="user-img" alt /> -->
+              <span>{{ userInfor&&userInfor.merberCompname }}</span>
+            </a>
+          </li>
+          <li v-if="userInfor&&userInfor.userPhone">
+            <a href="javascript:;" @click="logout">[ 退出 ]</a>
+          </li>
+          <li v-if="!(userInfor&&userInfor.userPhone)">
+            <a href="/paas/index/index.html#/loginPc">登录</a>
+          </li>
+        </ul>
+      </div>
+    </div>
+    <slot></slot>
+  </div>
+</template>
+
+<script>
+import { logout } from '#/api/login';
+import { getToken, removeToken } from '#/utils/auth';
+import API from '#/api/common/index.js';
+import erwm from '#/assets/Hy.png';
+
+export default {
+  data() {
+    return {
+      userInfor:"",
+      gw: '暂无顾问',
+      flaggw: false,
+      myerwm: erwm,
+      show: false,
+      userImg: require('../assets/a13.png'),
+    };
+  },
+  // computed: {
+  //   isLogin() {
+  //     return this.getUserCookie() ? getToken(this.getUserCookie()) : false;
+  //   },
+  //   userInfor() {
+  //     let info = this.getUserCookie() && getToken(this.getUserCookie()) ? JSON.parse(getToken(this.getUserCookie())) : {};
+  //     return info;
+  //   },
+  // },
+  mounted() {
+    window.addEventListener('click', this.gwhide);
+    if (window.sessionStorage.getItem("personalInfo")) {
+      this.userInfor = JSON.parse(window.sessionStorage.getItem("personalInfo"));
+    }
+    console.log(this.userInfor,'merberCompname')
+  },
+  methods: {
+    gwopen() {
+      API.getCustrelByEmployee().then((res) => {
+        if (res) {
+          if (res.employeePhone) {
+            this.gw = res.employeePhone;
+          } else {
+            this.gw = '暂无顾问';
+          }
+        } else {
+          this.gw = '暂无顾问';
+        }
+      });
+      this.flaggw = true;
+    },
+    gwhide() {
+      this.flaggw = false;
+    },
+    enter() {
+      this.show = true;
+    },
+    leave() {
+      this.show = false;
+    },
+    logout() {
+      // 退出
+      logout().then(() => {
+        let newDomain = document.domain.split('.').splice(-2).join('.');
+        removeToken('LOGININFO', newDomain, '/');
+        sessionStorage.clear();
+        // removeToken("personalInfo", newDomain, "/");
+        // location.reload();
+        location.href = location.origin;
+      });
+    },
+    getUserCookie() {
+      let cookie = document.cookie;
+      let start = cookie.indexOf('saas-user-');
+      if (start > -1) {
+        let end = cookie.indexOf('=', start);
+        return cookie.substring(start, end);
+      } else {
+        return null;
+      }
+    },
+  },
+};
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+.common-top-bar {
+  position: relative;
+  color: #191919;
+}
+.gw {
+  position: relative;
+}
+.store-er {
+  span {
+    display: inline-block;
+    margin-right: 8px;
+    float: left;
+  }
+  i {
+    font-size: 16px;
+  }
+}
+.mygw {
+  // border: 1px solid #ccc;
+  border-radius: 5px;
+  text-align: center;
+  // display: none;
+  background-color: white;
+  z-index: 999;
+  width: 200px;
+  height: 30px;
+  line-height: 30px;
+  position: absolute;
+  left: -50%;
+  top: 40px;
+  box-shadow: 0px 0px 10px #ccc;
+}
+.triangle_border_up {
+  // display: none;
+  position: absolute;
+  left: 66%;
+  top: 30px;
+  width: 0;
+  height: 0;
+  border-width: 0 10px 10px;
+  border-style: solid;
+  border-color: transparent transparent white; /*透明 透明  灰*/
+}
+.erwm {
+  text-align: center;
+  width: 220px;
+  img {
+    width: 100px;
+    height: 100px;
+    display: block;
+  }
+  div {
+    display: inline-block;
+  }
+  position: absolute;
+  right: 50%;
+  margin-right: -120px;
+  top: 40px;
+  z-index: 9999;
+}
+.top-left-con {
+  float: left;
+  // margin: 0 20px;
+}
+.top-left-ul {
+  margin-left: 9px;
+  float: left;
+  li {
+    float: left;
+    margin: 0 10px;
+    &:first-child {
+      margin-right: 42px;
+    }
+    a {
+      color: #191919;
+    }
+    position: relative;
+  }
+}
+.user-img {
+  width: 28px;
+  height: 28px;
+  border-radius: 50%;
+  margin-right: 5px;
+}
+.common-top-bar {
+  color: #191919;
+  font-size: 13px;
+  width: 100%;
+  height: 40px;
+  line-height: 40px;
+  background-color: #fff;
+  .inner {
+    .left {
+      float: left;
+    }
+    .right {
+      float: right;
+      ul {
+        margin-right: 1px;
+      }
+      ul li {
+        margin: 0 10px;
+        float: left;
+        float:left a {
+          color: #191919;
+        }
+        // &:hover a {
+        //   color: #ff9e01;
+        // }
+      }
+      .line {
+        width: 1px;
+        height: 16px;
+        background: #ccc;
+        margin: 12px 28px;
+      }
+      .item {
+        vertical-align: top;
+        height: 20px;
+        margin-top: 12px;
+        line-height: 20px;
+      }
+    }
+  }
+}
+</style>