qj-common 4.3.0 → 4.3.2

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

@@ -1,299 +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>
+<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>