feat 添加token、退出登录

src/api/http.js

@@ -11,10 +11,11 @@ const service = axios.create({
 
 //添加request拦截器
 service.interceptors.request.use(config => {
+  let token = localStorage.getItem('token')
   config.headers = {
     ...config.headers,
     // 设置全局请求头
-    'token': 'cedebb6e872f539bef8c3f919874e9d7',
+    'token': token,
     'aliasId': '',
     'platformType': 'pc',
     // 'content-type': params.method == "GET" ? 'application/x-www-form-urlencoded' : 'application/json;charset=utf-8',

src/components/orderComponents/orderAMap.vue

@@ -60,10 +60,11 @@ export default {
         }
       )
         .then((res) => {
+          console.log('res1',res);
           return res.json();
         })
         .then((result) => {
-          console.log(result);
+          console.log('res',result);
           fetch(
             `https://restapi.amap.com/v3/geocode/geo?key=4940f0a9fdc717ab27dd37fa0497c771&address=${result.tips[0].district}${result.tips[0].address}${result.tips[0].name}`,
             {
@@ -93,7 +94,7 @@ export default {
         ((data.receiptLng * 1 + data.sendLng * 1) / 2).toFixed(6),
         ((data.receiptLat * 1 + data.sendLat * 1) / 2).toFixed(6),
       ];
-      console.log(this.center);
+      console.log('center',this.center);
       this.markers = [sendM, receiptM];
       this.dialogTableVisible = true;
     },

src/router/index.js

@@ -1,8 +1,6 @@
 import Vue from 'vue'
 import Router from 'vue-router'
 
-import { message } from 'element-ui'
-
 Vue.use(Router)
 
 // 解决ElementUi导航栏中的vue-router在3.0版本以上重复点菜单报错问题
@@ -51,7 +49,7 @@ const router = new Router({
           title: '我的账户',
           component: () => import('../components/shopAccount.vue')
         },
-        
+
       ]
     },
     {
@@ -73,20 +71,15 @@ const router = new Router({
 
 router.beforeEach((to, from, next) => {
   console.log(to)
-  if ( to.path === '/login' ) {
+  if (to.path === '/login') {
     next()
-  }else {
+  } else {
     const token = localStorage.getItem('token') || null;
-    if ( token ) {
+    if (token) {
       next()
-    }else if ( to.path !== '/resetPassword' ){
-      message({
-        message: '请先登录',
-        type: 'error',
-        duration: 1.5 * 1000
-      })
+    } else if (to.path !== '/resetPassword') {
       router.push('/login')
-    }else {
+    } else {
       next()
     }
   }

src/views/home.vue

@@ -11,7 +11,7 @@
             <i class="el-icon-arrow-down el-icon--right"></i>
           </span>
           <el-dropdown-menu slot="dropdown">
-            <el-dropdown-item>退出登录</el-dropdown-item>
+            <el-dropdown-item @click.native="loginOut">退出登录</el-dropdown-item>
           </el-dropdown-menu>
         </el-dropdown>
       </el-header>
@@ -23,81 +23,90 @@
 </template>
 
 <script>
-  import sidebar from '../common/sider.vue';
-  import headerVue from '../common/header.vue';
-  import { mapState } from 'vuex';
-  export default {
-    data() {
-      return {
-
-      }
-    },
-    computed: {
-      ...mapState(['userInfo'])
-    },
-    components: {
-      sidebar,
-      headerVue
+import sidebar from "../common/sider.vue";
+import headerVue from "../common/header.vue";
+import { mapState } from "vuex";
+export default {
+  data() {
+    return {};
+  },
+  computed: {
+    ...mapState(["userInfo"]),
+  },
+  components: {
+    sidebar,
+    headerVue,
+  },
+  created() {},
+  methods: {
+    loginOut() {
+      this.$confirm("此操作将退出当前登录用户, 是否继续?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      }).then(() => {
+        localStorage.clear("token");
+        this.$router.push({
+          path: "/login",
+        });
+      });
     },
-    created() {},
-    methods: {
-      
-    }
-  }
+  },
+};
 </script>
 
 <style lang="scss" scoped="scoped">
-  .el-header {
-    position: relative;
-    width: 100%;
-    height: 80px;
-  }
+.el-header {
+  position: relative;
+  width: 100%;
+  height: 80px;
+}
 
-  .el-main {
-    position: absolute;
-    left: 254px;
-    right: 0;
-    top: 80px;
-    bottom: 0;
-    overflow-y: auto;
-    background-color: #F1F2F5;
-    padding: 10px;
-    min-width: 550px;
-  }
+.el-main {
+  position: absolute;
+  left: 254px;
+  right: 0;
+  top: 80px;
+  bottom: 0;
+  overflow-y: auto;
+  background-color: #f1f2f5;
+  padding: 10px;
+  min-width: 550px;
+}
 
-  .header-button {
-    font-size: 16px;
-    font-family: PingFang SC;
-    font-weight: 400;
-    color: #777777;
-    cursor: pointer;
-    margin-right: 40px;
-  }
+.header-button {
+  font-size: 16px;
+  font-family: PingFang SC;
+  font-weight: 400;
+  color: #777777;
+  cursor: pointer;
+  margin-right: 40px;
+}
 
-  .header-button {
-    font-size: 16px;
-    font-family: PingFang SC;
-    font-weight: 400;
-    color: #777777;
-    cursor: pointer;
-    margin-right: 40px;
-  }
+.header-button {
+  font-size: 16px;
+  font-family: PingFang SC;
+  font-weight: 400;
+  color: #777777;
+  cursor: pointer;
+  margin-right: 40px;
+}
 
-  .home-content {
-    display: flex;
+.home-content {
+  display: flex;
 
-    .side-box {
-      // width: 200px;
-      position: relative;
-    }
+  .side-box {
+    // width: 200px;
+    position: relative;
+  }
 
-    .content {
-      flex: 1;
-      flex-shrink: 1;
-    }
+  .content {
+    flex: 1;
+    flex-shrink: 1;
+  }
 
-    .title {
-      color: #0074D9;
-    }
+  .title {
+    color: #0074d9;
   }
+}
 </style>