qj-common 4.1.0

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

@@ -0,0 +1,265 @@
+<template>
+  <div class="common-top-bar">
+    <div class="inner w1200 m0a">
+      <div class="left">
+        <!-- <i class="el-icon-location-outline"></i> -->
+        <p class="top-left-con">
+          <span v-if="isLogin && userInfor">Hi,{{decodeURIComponent(userInfor.userName)}}</span>
+          <!-- <span v-else>Hi，欢迎来到商城！</span> -->
+        </p>
+        <ul class="top-left-ul">
+          <li class="rignt-line"></li>
+          <li v-if="!isLogin">
+            <a href="/paas/index/index.html#/loginPc">登录</a>
+          </li>
+          <li v-if="!isLogin" class="rignt-line">|</li>
+          <li v-if="!isLogin">
+            <a href="/paas/index/index.html#/regPc">注册</a>
+          </li>
+          <li v-if="isLogin">
+            <a href="javascript:;" @click="logout">退出</a>
+          </li>
+        </ul>
+      </div>
+      <div class="right">
+        <ul class>
+          <li>
+            <a href="/">首页</a>
+          </li>
+          <li>
+            <a href="/paas/pc-mall/index.html#/joinProcess">我要加盟</a>
+          </li>
+          <li>
+            <a href="/paas/shop/00000025/web/docList6/docList6/docList6.html">技术支持</a>
+          </li>
+          <li>
+            <a href="/paas/order-manager/index.html#/order">我的订单</a>
+          </li>
+          <li>
+            <a href="/paas/user-manager/index.html#/user">会员中心</a>
+          </li>
+          <li>
+            <a href="/paas/shop/00000025/web/doc2/doc2/doc2.html">关于品牌</a>
+          </li>
+          <li @mouseenter="enter" @mouseleave="leave">
+            <a href="javascript:;">移动版</a>
+            <div v-if="show" class="erwm">
+              <div>
+                <img :src="myerwm" alt />
+              </div>
+            </div>
+          </li>
+
+          <!-- <li>
+            <a href>关于品牌</a>
+          </li>
+          <li>
+            <a href>移动版</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/WeChat.png";
+
+export default {
+  data() {
+    return {
+      gw: "暂无顾问",
+      flaggw: false,
+      myerwm: erwm,
+      show: false
+    };
+  },
+  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;
+}
+.gw {
+  position: relative;
+}
+.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;
+  left: -18px;
+  top: 40px;
+  z-index: 9999;
+}
+.top-left-con {
+  float: left;
+  // margin: 0 20px;
+}
+.top-left-ul {
+  // margin: 0 20px;
+  margin-left: 9px;
+  float: left;
+  li {
+    float: left;
+    margin: 0 10px;
+    a {
+      color: #666;
+      // &:hover {
+      //   color: #ff9e01;
+      // }
+    }
+  }
+}
+.common-top-bar {
+  color: #666;
+  font-size: 13px;
+  width: 100%;
+  height: 40px;
+  line-height: 40px;
+  background-color: #fff;
+  .inner {
+    .left {
+      float: left;
+    }
+    .right {
+      float: right;
+      position: relative;
+      ul {
+        margin-right: 1px;
+      }
+      ul li {
+        margin: 0 10px;
+        float: left;
+        float:left a {
+          color: #666;
+        }
+        position: relative;
+        // &: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;
+      }
+    }
+  }
+}
+.common-top-bar .inner ul li.rignt-line {
+  // overflow: hidden;
+  // margin: 16px 20px 0;
+  // width: 1px;
+  // height: 10px;
+  // background-color: #ccc;
+}
+</style>

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

@@ -0,0 +1,112 @@
+<template>
+  <div class="bacC">
+    <div class="container">
+      <div class="topLeft" v-if="userInfo.merberCompname">
+        <p>{{userInfo.merberCompname}}</p>
+        &nbsp;
+        <p @click="outLogin()">【退出登录】</p>
+      </div>
+      <div class="topLeft" v-if="userInfo.merberCompname == undefind || userInfo.merberCompname == null">
+        <p @click="toLogin()">登录</p>
+      </div>
+      <div class="topRight">
+        <block >
+		   <img v-if="$route.path === `/order`" class="seleIcon" src="http://opttest.lbaby1998.com/paas/shop/2021122100000001/2022-07-28/717cfb99fec34ed5b6b256eb7fd3d456.png" alt="" />
+           <img v-else @click="toUser()" src="http://b2bopt-dev2021122100000001.qjclouds.com/paas/shop/2021122100000001/2022-02-17/0c3b5a19c1574307bc1fcbb0754d1ad0.png" alt="" />
+           <span @click="toIndex()" :class="[ $route.path === `/islandStore` ? 'c-theme' : '' ]">个人中心</span>
+        </block>
+        <span @click="toHelp()" :class="[ $route.path === `/helpindex` ? 'c-theme' : '' ]">帮助中心</span>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { loginOut } from '#/api/login.js'
+export default {
+  data() {
+    return {
+      userPhone: '',
+      userInfo: {},
+      hrefurl: process.env.API_ROOT,
+    }
+  },
+  created() {
+    if (window.sessionStorage.getItem('personalInfo')) {
+      this.userInfo = JSON.parse(window.sessionStorage.getItem('personalInfo'))
+    }
+  },
+  methods: {
+    toLogin() {
+      location.href = '/paas/index/index.html#/loginPc'
+    },
+    outLogin() {
+      loginOut().then((res) => {
+        if (res.success) {
+          this.$message.success('退出登陆成功')
+          localStorage.clear()
+          sessionStorage.clear()
+          this.userInfo = {}
+          location.href = '/paas/index/index.html#/loginPc'
+        }
+      })
+    },
+    toUser(){
+      location.href = '/paas/b2b-bus-pc-ayd/index.html#/order'
+    },
+    toIndex(){
+       location.href = '/paas/b2b-cli-pc-ayd/index.html#/islandStore'
+    },
+    toHelp(){
+       location.href = '/paas/b2b-cli-pc-ayd/index.html#/helpindex'
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.bacC {
+  background-color: #fff;
+  border-bottom: 1px solid #f3f3f3;
+  .container {
+    width: 1200px;
+    margin: 0 auto;
+    display: flex;
+    justify-content: space-between;
+    height: 40px;
+    align-items: center;
+    .topLeft {
+      display: flex;
+      .img {
+        width: 24px;
+      }
+      p:nth-child(1) {
+        color: #333;
+        font-size: 14px;
+      }
+      p:nth-child(2) {
+        color: #666666;
+        font-size: 13px;
+        cursor: pointer;
+      }
+      // flex-direction: column;
+    }
+    .topRight {
+      img {
+        cursor: pointer;
+      }
+	  .seleIcon{
+		width: 17px;
+		margin-right: 10px;
+	  }
+      span{
+        font-size: 12px;
+        cursor: pointer;
+      }
+	  span:hover{
+	  	color: #ed2f17;
+	  }
+    }
+  }
+}
+</style>

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

@@ -0,0 +1,299 @@
+<style lang="scss" scoped>
+/* Package By Joenix */
+
+$theme: #ffc808;
+$page: 1200px;
+$unit: 20px;
+
+$space-toper: 50px;
+
+.in {
+  @mixin flex($mode: center) {
+    display: flex;
+    justify-content: $mode;
+    align-items: center;
+  }
+
+  @mixin shadow($size: 4px) {
+    box-shadow: 0 0 $size rgba(0, 0, 0, 0.125);
+  }
+
+  &--flex {
+    @include flex(space-between);
+  }
+
+  &--shadow {
+    @include shadow(8px);
+  }
+
+  &--hand {
+    cursor: pointer;
+    transition: all 0.36s;
+  }
+
+  &--header {
+    &--container {
+      width: $page;
+      margin: 0 auto;
+    }
+
+    &--toper {
+      line-height: $space-toper;
+      background-color: $theme;
+    }
+
+    &--logo {
+      width: 180px;
+      height: 100px;
+    }
+
+    &--search {
+      &--input {
+        border-radius: 4px 0 0 4px;
+      }
+
+      &--button {
+        border-radius: 0 4px 4px 0;
+      }
+    }
+
+    &--navigator {
+      height: 100px;
+
+      span {
+        line-height: 100px;
+        margin: 0 30px;
+        display: inline-block;
+        font-size: 18px;
+        font-weight: bold;
+        position: relative;
+        color: #363636;
+
+        &:after {
+          content: "";
+          display: block;
+          height: 4px;
+          bottom: 0;
+          background-color: $theme;
+          transition: all 0.36s;
+          position: absolute;
+
+          width: 0;
+          left: 50%;
+        }
+
+        &:hover {
+          color: $theme;
+
+          &:after {
+            width: 100%;
+            left: 0;
+          }
+        }
+      }
+    }
+  }
+
+
+}
+</style>
+
+<template>
+  <div class="common-top-bar cephalosome in--header">
+    <!-- Toper -->
+    <div class="top_mod in--header--toper">
+      <div class="in--header--container in--flex">
+        <div class="left_mod">
+          <div class="button_box" >
+            <div @click="user()" style="cursor:pointer">[会员中心]</div>
+            <div style="margin-left:10px;cursor:pointer" @click="tocar()">
+              [购物车]
+            </div>
+          </div>
+        </div>
+        <div class="right_mod">
+          <!-- <i class="icon iconfont" style="cursor:pointer" @click="tocar()"
+            >&#xe753;</i
+          > -->
+          <div
+            class="user_accounts"
+            v-if="userInfo.userPhone"
+            @click="outLogin()"
+          >
+            {{ userInfo.userPhone }} [退出登录]
+          </div>
+          <div v-if="!userInfo.userPhone" class="right_mod">
+            <div @click="login()" style="cursor:pointer">[登录]</div>
+            <div class="border_line"></div>
+            <div style="cursor:pointer" @click="register()">
+                [免费注册]
+            </div>
+          </div>
+          
+          <div class="border_line"></div>
+          <div style="cursor:pointer" @click="goSupplier()">
+              [供应商中心]
+            </div>
+          <!-- <div class="border_line"></div>
+          <i class="icon iconfont" @click="user()" style="cursor:pointer"
+            >&#xe757;</i
+          > -->
+        </div>
+      </div>
+    </div>
+  
+  
+  </div>
+</template>
+
+<script>
+
+import { indexRequest, loginOut } from "#/api/login.js";
+export default {
+  data() {
+    return {
+      carouselArr: [],
+      searchValue: "",
+      userInfo: {}
+    };
+  },
+  mounted() {
+    if (window.sessionStorage.getItem("personalInfo")) {
+      this.userInfo = JSON.parse(window.sessionStorage.getItem("personalInfo"));
+    }
+    
+  },
+  methods: {
+    outLogin() {
+      loginOut().then(res => {
+        if (res.success) {
+          this.$message.success("退出登陆成功");
+          localStorage.clear();
+          sessionStorage.clear();
+          this.userInfo = {};
+          this.$router.push("/indexPc");
+        }
+      });
+    },
+    goSupplier(){
+      window.location.href="http://gys.icmold.com";
+    },
+    tocar() {
+      location.href =
+        "/paas/pc-mall/index.html#/car";
+    },
+    user() {
+      location.href =
+        "/paas/user-manager/index.html#/user";
+    },
+  
+    login() {
+      // this.$router.push("/loginYm");
+      location.href =
+        "/paas/index/index.html#/loginPc";
+    },
+    register() {
+      // this.$router.push("/register");
+      location.href =
+        "/paas/index/index.html#/regPc";
+    },
+    
+  
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.top_mod {
+  // width: 100%;
+  // height: 36px;
+  // padding: 0 18%;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  box-sizing: border-box;
+  font-size: 14px;
+  font-weight: 400;
+  color: rgba(51, 51, 51, 1);
+  //   background: #fafafa;
+}
+
+.nav_bar {
+  width: 100%;
+  height: 50px;
+  background: #ffc808;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.home_text2 {
+  margin: 0 96px;
+}
+
+.nav_bar div {
+  font-size: 18px;
+  font-weight: 500;
+  color: rgba(35, 35, 35, 1);
+  cursor: pointer;
+}
+
+.left_mod,
+.button_box {
+  display: flex;
+  align-items: center;
+}
+
+.user_accounts {
+  // margin-right: 42px;
+  cursor: pointer;
+}
+
+.border_line {
+  width: 1px;
+  height: 16px;
+  background: #222222;
+  margin: 0 20px;
+}
+
+.right_mod {
+  display: flex;
+  align-items: center;
+}
+
+.search_content input {
+  width: 360px;
+  height: 40px;
+  background: rgba(255, 255, 255, 1);
+  border: 1px solid #ffc808;
+  padding-left: 12px;
+  box-sizing: border-box;
+}
+
+.search_button {
+  width: 80px;
+  height: 40px;
+  background: #ffc808;
+  font-size: 14px;
+  font-weight: 400;
+  color: rgba(39, 39, 39, 1);
+  text-align: center;
+  line-height: 40px;
+}
+
+.search_mod {
+  box-sizing: border-box;
+  margin: 30px 0;
+}
+
+.search_mod img {
+  width: 180px;
+  height: 100px;
+}
+
+.search_mod,
+.search_content {
+  display: flex;
+  align-items: center;
+}
+</style>