qgb-process 0.2.3 → 0.2.7

package/src/components/public/components/HeadBar.vue

@@ -1,315 +1,315 @@
-<template>
-  <div class="top-bar">
-    <div class="head-logo flex-center">
-      <div class="logo-content flex-center" @click="toPush">
-        <img class="logo" src="@/assets/public/logo.png" />
-        <span class="name">企管帮</span>
-      </div>
-      <div
-        class="collapse"
-        :class="$store.state.isCollapse?'unfold-menu':'fold-menu'"
-        @click="changeCollapse"
-      ></div>
-    </div>
-    <div class="head-nav flex-center">
-      <div class="nav-item overflow" @click="toPush">首页</div>
-      <div
-        class="nav-item overflow"
-        :class="{ 'color02':showBg === 'center'}"
-        @click="$router.push({path:'/'})"
-      >会员中心</div>
-      <div class="nav-item overflow">
-        <el-dropdown @command="handleCommand">
-          <span class="el-dropdown-link" :class="{ 'color02':showBg === 'seting'}">
-            账户设置
-            <i class="el-icon-arrow-down el-icon--right"></i>
-          </span>
-          <el-dropdown-menu slot="dropdown">
-            <el-dropdown-item command="/security">账户安全</el-dropdown-item>
-            <el-dropdown-item command="/authenticationManagement">认证中心</el-dropdown-item>
-            <!-- <el-dropdown-item command="/invoiceDetail">开票信息</el-dropdown-item> -->
-            <el-dropdown-item command="/myAddress">收货地址</el-dropdown-item>
-            <el-dropdown-item command="/electronicContract">电子合同</el-dropdown-item>
-            <el-dropdown-item command="/enterpriseInformation" v-if="$store.state.user.userRole == 1">企业信息</el-dropdown-item>
-            <el-dropdown-item command="/personnelRelease">我的简历</el-dropdown-item>
-          </el-dropdown-menu>
-        </el-dropdown>
-      </div>
-      <div
-        class="nav-item overflow"
-        :class="{ 'color02':showBg === 'message'}"
-        @click="$router.push({path:'/myMessage'})"
-      >
-        我的消息 (
-        <span class="color-orange">{{msgNum}}</span> )
-      </div>
-    </div>
-    <div class="head-user">
-      <div class="header-tel">
-        <img src="@/assets/center/telicon.png" alt />
-        <div class="tel">
-          <div class="telnumber">400-001-0051</div>
-          <div class="time">周一至周五9：00-21：00</div>
-        </div>
-      </div>
-      <div class="user">
-        <!-- <span
-          class="color02 user cursor"
-          @click="$router.push({path:'/'})"
-        >您好！{{this.$store.state.user.accountName}}</span>
-        <span class="cursor color96" @click="quit">
-          <span class="color66">&nbsp;&nbsp;|&nbsp;&nbsp;</span>退出
-        </span>-->
-        <!-- 配置用户头像 -->
-        <!-- <el-avatar size="medium" src="https://empty" @error="errorHandler"> -->
-        <el-avatar size="medium">
-          <img src="@/assets/center/admin.png" />
-        </el-avatar>
-        <el-dropdown trigger="click" @command="logout">
-          <span class="el-dropdown-link">
-            您好！
-            <span class="name">{{this.$store.state.user.accountName}}</span>
-            <i class="el-icon-arrow-down el-icon--right"></i>
-          </span>
-          <el-dropdown-menu slot="dropdown">
-            <el-dropdown-item command="out">退出</el-dropdown-item>
-          </el-dropdown-menu>
-        </el-dropdown>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script>
-import link from "@/public/link.js"
-import apiAuth from "@/api/apiAuth"
-export default {
-  name: "HeadBar",
-  data() {
-    return {
-      messNum: 0,
-      showBg: "center"
-    }
-  },
-  methods: {
-    toPush() {
-      link.blank_index()
-    },
-    toBus() {
-      link.shopBus()
-      //  window.location.href = link.index()
-    },
-    logout(e) {
-      if (e == "out") {
-        this.quit()
-      }
-    },
-    quit() {
-      // LOGIN_OUT
-      this.$confirm("确认退出？", "提示", {
-        confirmButtonText: "确定",
-        cancelButtonText: "取消",
-        type: "warning"
-      })
-        .then(async res => {
-          const { data } = await apiAuth.sendLogout()
-          if (data && data.code === 0) {
-            this.$store.commit("LOGIN_OUT")
-            localStorage.clear("menu")
-            this.$message.success(data.msg)
-          } else {
-            this.$message.error("退出失败")
-          }
-        })
-        .catch(() => {})
-    },
-    handleCommand(command) {
-      this.$router.push(command)
-    },
-    errorHandler() {
-      return true
-    },
-    changeCollapse() {
-      this.$store.commit("SET_ISCOLLAPSE")
-    },
-    showNav() {
-      switch (this.$route.path) {
-        case "/security":
-        case "/authenticationManagement":
-        case "/invoiceDetail":
-        case "/electronicContract":
-        case "/clockingIn":
-        case "/positiveShift":
-        case "/statisticsCheckTime":
-        case "/myAddress":
-          this.showBg = "seting"
-          break
-        case "/":
-          this.showBg = "center"
-          break
-        case "/myMessage":
-          this.showBg = "message"
-          break
-        default:
-          break
-      }
-    }
-  },
-  watch: {
-    navPath: {
-      handler: function() {
-        this.showNav()
-      }
-    }
-  },
-  computed: {
-    msgNum() {
-      return this.$store.state.user.msgNum
-    },
-
-    navPath() {
-      return this.$route.path
-    }
-  },
-  mounted() {},
-  created() {
-    this.showNav()
-    // this.showBg = this.$route.path !== "/myMessage";
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-//
-.top-bar {
-  display: flex;
-  background-color: white;
-  height:50px;
-  line-height: 50px;
-  border-bottom: 1px solid #e4e7ed;
-  .head-logo {
-    width: 190px;
-    padding: 10px 0 10px 10px;
-    position: relative;
-    .logo-content {
-      cursor: pointer;
-      .logo {
-        display: block;
-        width: 40px;
-        height: 40px;
-        margin-right: 6px;
-      }
-      .name {
-        font-size: 32px;
-      }
-    }
-    .collapse {
-      width: 28px;
-      height: 28px;
-      position: absolute;
-      right: 0;
-      top: 50%;
-      margin-top: -14px;
-      cursor: pointer;
-      border-width: 1px;
-      border-style: solid;
-      border-radius: 6px;
-    }
-    .unfold-menu {
-      background: #d9edfa url("../../../assets/center/open_menu.png") no-repeat
-        center;
-      background-size: 22px 22px;
-      border-color: #80c2ef;
-    }
-    .fold-menu {
-      background: #c0c4cc url("../../../assets/center/close_menu.png") no-repeat
-        center;
-      background-size: 22px 22px;
-      border-color: #e4e7ed;
-      -moz-transform: rotate(180deg);
-      -webkit-transform: rotate(180deg);
-      transform: rotate(180deg);
-      filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
-    }
-  }
-  .head-nav {
-    flex: 1;
-    > div {
-      width: 25%;
-      text-align: center;
-      cursor: pointer;
-      // overflow: hidden;
-    }
-    .nav-item {
-      // padding: 0 40px;
-      position: relative;
-      &:not(:last-child):after {
-        content: "";
-        width: 1px;
-        height: 24px;
-        position: absolute;
-        background-color: #e4e7ed;
-        top: 50%;
-        right: 0;
-        margin-top: -12px;
-      }
-
-      .el-dropdown {
-        height: 40px;
-        color: #000;
-        font-size: 16px;
-      }
-    }
-    .color02 {
-      color: #0286df;
-    }
-  }
-  .head-user {
-    padding-right: 12px;
-    display: flex;
-    .user {
-      .el-dropdown {
-        height: 40px;
-      }
-      .el-avatar {
-        vertical-align: middle;
-        margin-right: 10px;
-      }
-      .el-dropdown-link {
-        .name {
-          cursor: pointer;
-          color: #0286df;
-          padding-right: 4px;
-        }
-      }
-    }
-    .header-tel {
-      display: flex;
-      align-items: center;
-      margin-right: 80px;
-      img {
-        display: block;
-        width: 34px;
-        height: 34px;
-        margin: 16px;
-      }
-      .tel {
-        flex: 1;
-        line-height: 20px;
-        .telnumber {
-          font-size: 18px;
-          font-weight: 600;
-        }
-        .time {
-          font-size: 14px;
-          color: #666;
-        }
-      }
-    }
-  }
-  .flex-center {
-    display: flex;
-    align-items: center;
-  }
-}
-</style>
+<template>
+  <div class="top-bar">
+    <div class="head-logo flex-center">
+      <div class="logo-content flex-center" @click="toPush">
+        <img class="logo" src="@/assets/public/logo.png" />
+        <span class="name">企管帮</span>
+      </div>
+      <div
+        class="collapse"
+        :class="$store.state.isCollapse?'unfold-menu':'fold-menu'"
+        @click="changeCollapse"
+      ></div>
+    </div>
+    <div class="head-nav flex-center">
+      <div class="nav-item overflow" @click="toPush">首页</div>
+      <div
+        class="nav-item overflow"
+        :class="{ 'color02':showBg === 'center'}"
+        @click="$router.push({path:'/'})"
+      >会员中心</div>
+      <div class="nav-item overflow">
+        <el-dropdown @command="handleCommand">
+          <span class="el-dropdown-link" :class="{ 'color02':showBg === 'seting'}">
+            账户设置
+            <i class="el-icon-arrow-down el-icon--right"></i>
+          </span>
+          <el-dropdown-menu slot="dropdown">
+            <el-dropdown-item command="/security">账户安全</el-dropdown-item>
+            <el-dropdown-item command="/authenticationManagement">认证中心</el-dropdown-item>
+            <!-- <el-dropdown-item command="/invoiceDetail">开票信息</el-dropdown-item> -->
+            <el-dropdown-item command="/myAddress">收货地址</el-dropdown-item>
+            <el-dropdown-item command="/electronicContract">电子合同</el-dropdown-item>
+            <el-dropdown-item command="/enterpriseInformation" v-if="$store.state.user.userRole == 1">企业信息</el-dropdown-item>
+            <el-dropdown-item command="/personnelRelease">我的简历</el-dropdown-item>
+          </el-dropdown-menu>
+        </el-dropdown>
+      </div>
+      <div
+        class="nav-item overflow"
+        :class="{ 'color02':showBg === 'message'}"
+        @click="$router.push({path:'/myMessage'})"
+      >
+        我的消息 (
+        <span class="color-orange">{{msgNum}}</span> )
+      </div>
+    </div>
+    <div class="head-user">
+      <div class="header-tel">
+        <img src="@/assets/center/telicon.png" alt />
+        <div class="tel">
+          <div class="telnumber">400-001-0051</div>
+          <div class="time">周一至周五9：00-21：00</div>
+        </div>
+      </div>
+      <div class="user">
+        <!-- <span
+          class="color02 user cursor"
+          @click="$router.push({path:'/'})"
+        >您好！{{this.$store.state.user.accountName}}</span>
+        <span class="cursor color96" @click="quit">
+          <span class="color66">&nbsp;&nbsp;|&nbsp;&nbsp;</span>退出
+        </span>-->
+        <!-- 配置用户头像 -->
+        <!-- <el-avatar size="medium" src="https://empty" @error="errorHandler"> -->
+        <el-avatar size="medium">
+          <img src="@/assets/center/admin.png" />
+        </el-avatar>
+        <el-dropdown trigger="click" @command="logout">
+          <span class="el-dropdown-link">
+            您好！
+            <span class="name">{{this.$store.state.user.accountName}}</span>
+            <i class="el-icon-arrow-down el-icon--right"></i>
+          </span>
+          <el-dropdown-menu slot="dropdown">
+            <el-dropdown-item command="out">退出</el-dropdown-item>
+          </el-dropdown-menu>
+        </el-dropdown>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import link from "@/public/link.js"
+import apiAuth from "@/api/apiAuth"
+export default {
+  name: "HeadBar",
+  data() {
+    return {
+      messNum: 0,
+      showBg: "center"
+    }
+  },
+  methods: {
+    toPush() {
+      link.blank_index()
+    },
+    toBus() {
+      link.shopBus()
+      //  window.location.href = link.index()
+    },
+    logout(e) {
+      if (e == "out") {
+        this.quit()
+      }
+    },
+    quit() {
+      // LOGIN_OUT
+      this.$confirm("确认退出？", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(async res => {
+          const { data } = await apiAuth.sendLogout()
+          if (data && data.code === 0) {
+            this.$store.commit("LOGIN_OUT")
+            localStorage.clear("menu")
+            this.$message.success(data.msg)
+          } else {
+            this.$message.error("退出失败")
+          }
+        })
+        .catch(() => {})
+    },
+    handleCommand(command) {
+      this.$router.push(command)
+    },
+    errorHandler() {
+      return true
+    },
+    changeCollapse() {
+      this.$store.commit("SET_ISCOLLAPSE")
+    },
+    showNav() {
+      switch (this.$route.path) {
+        case "/security":
+        case "/authenticationManagement":
+        case "/invoiceDetail":
+        case "/electronicContract":
+        case "/clockingIn":
+        case "/positiveShift":
+        case "/statisticsCheckTime":
+        case "/myAddress":
+          this.showBg = "seting"
+          break
+        case "/":
+          this.showBg = "center"
+          break
+        case "/myMessage":
+          this.showBg = "message"
+          break
+        default:
+          break
+      }
+    }
+  },
+  watch: {
+    navPath: {
+      handler: function() {
+        this.showNav()
+      }
+    }
+  },
+  computed: {
+    msgNum() {
+      return this.$store.state.user.msgNum
+    },
+
+    navPath() {
+      return this.$route.path
+    }
+  },
+  mounted() {},
+  created() {
+    this.showNav()
+    // this.showBg = this.$route.path !== "/myMessage";
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+//
+.top-bar {
+  display: flex;
+  background-color: white;
+  height:50px;
+  line-height: 50px;
+  border-bottom: 1px solid #e4e7ed;
+  .head-logo {
+    width: 190px;
+    padding: 10px 0 10px 10px;
+    position: relative;
+    .logo-content {
+      cursor: pointer;
+      .logo {
+        display: block;
+        width: 40px;
+        height: 40px;
+        margin-right: 6px;
+      }
+      .name {
+        font-size: 32px;
+      }
+    }
+    .collapse {
+      width: 28px;
+      height: 28px;
+      position: absolute;
+      right: 0;
+      top: 50%;
+      margin-top: -14px;
+      cursor: pointer;
+      border-width: 1px;
+      border-style: solid;
+      border-radius: 6px;
+    }
+    .unfold-menu {
+      background: #d9edfa url("../../../assets/center/open_menu.png") no-repeat
+        center;
+      background-size: 22px 22px;
+      border-color: #80c2ef;
+    }
+    .fold-menu {
+      background: #c0c4cc url("../../../assets/center/close_menu.png") no-repeat
+        center;
+      background-size: 22px 22px;
+      border-color: #e4e7ed;
+      -moz-transform: rotate(180deg);
+      -webkit-transform: rotate(180deg);
+      transform: rotate(180deg);
+      filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
+    }
+  }
+  .head-nav {
+    flex: 1;
+    > div {
+      width: 25%;
+      text-align: center;
+      cursor: pointer;
+      // overflow: hidden;
+    }
+    .nav-item {
+      // padding: 0 40px;
+      position: relative;
+      &:not(:last-child):after {
+        content: "";
+        width: 1px;
+        height: 24px;
+        position: absolute;
+        background-color: #e4e7ed;
+        top: 50%;
+        right: 0;
+        margin-top: -12px;
+      }
+
+      .el-dropdown {
+        height: 40px;
+        color: #000;
+        font-size: 16px;
+      }
+    }
+    .color02 {
+      color: #0286df;
+    }
+  }
+  .head-user {
+    padding-right: 12px;
+    display: flex;
+    .user {
+      .el-dropdown {
+        height: 40px;
+      }
+      .el-avatar {
+        vertical-align: middle;
+        margin-right: 10px;
+      }
+      .el-dropdown-link {
+        .name {
+          cursor: pointer;
+          color: #0286df;
+          padding-right: 4px;
+        }
+      }
+    }
+    .header-tel {
+      display: flex;
+      align-items: center;
+      margin-right: 80px;
+      img {
+        display: block;
+        width: 34px;
+        height: 34px;
+        margin: 16px;
+      }
+      .tel {
+        flex: 1;
+        line-height: 20px;
+        .telnumber {
+          font-size: 18px;
+          font-weight: 600;
+        }
+        .time {
+          font-size: 14px;
+          color: #666;
+        }
+      }
+    }
+  }
+  .flex-center {
+    display: flex;
+    align-items: center;
+  }
+}
+</style>