Merge branch 'master' of http://49.4.49.126:3000/shilin/sisweb

# Conflicts:
#	src/api/axios.js

src/store/getters.js

@@ -1,7 +1,7 @@
 const getters = {
   authToken: state => state.user.authToken,  //建立token的快捷访问   user 是因为index.js中导入的时候名称定义为user
   submitDDTag: state => state.submitDDTag,
-  loading:state =>state.loading,
+  loading: state => state.loading,
   username: state => state.user.username,
   themeName: state => state.themeName,
 }

src/store/index.js

@@ -7,7 +7,7 @@ Vue.use(Vuex)
 const state = {
   submitDDTag: false,   //提交 - 防抖动 - 针对快速请求问题的拦截机制
   loading: false,   //全局 - 加载中....
-  themeName:"light",
+  themeName: "light",
 };
 //改变状态的方法
 const mutations = {
@@ -17,12 +17,12 @@ const mutations = {
   loadingStore(state, tag) {
     state.loading = tag;
   },
-changeTheme (state, tag) {
+  changeTheme(state, tag) {
     state.themeName = tag;
   },
 };
 var vuexStore = new Vuex.Store({
-  modules:{
+  modules: {
     user//调用this['user/login']()  引用 ...mapActions(['user/login']),
   },
   getters,

src/store/modules/user.js

@@ -1,16 +1,28 @@
 // import {getToken,setToken,removeToken} from '@/utils/auth'
+import { Message } from 'element-ui';
 const state = {
-  authToken:localStorage.getItem('authToken') ? localStorage.getItem('authToken'):'', //设置token为共享状态   初始化vuex的时候 就先从缓存中读取
-  username:'',
+  authToken: localStorage.getItem('authToken') ? localStorage.getItem('authToken') : '', //设置token为共享状态   初始化vuex的时候 就先从缓存中读取
+  username: '',
 }
 const mutations = {
-  REMOVE_TOKEN(state){
+  REMOVE_TOKEN(state) {
     localStorage.removeItem('authToken');
+    localStorage.removeItem('username');
+    state.authToken = "";
+    state.username = "";
+    Message({
+      message: '退出成功',
+      type: 'success'
+    });
+    setTimeout(() => {
+      window.location.reload();
+    }, 1000);
+
   },
   SET_TOKEN: (state, token_name) => {
     state.authToken = token_name.token;
     state.username = token_name.username;
-	  localStorage.setItem('authToken', token_name.token);
+    localStorage.setItem('authToken', token_name.token);
     localStorage.setItem('username', token_name.username);
   },
   SET_NAME: (state, name) => {
@@ -18,16 +30,16 @@ const mutations = {
   },
 }
 const actions = {
-  async login(context,data){
+  async login(context, data) {
     const result = await login(data)
-    if(result.data.sucess){
+    if (result.data.sucess) {
       //调用vuex中setToken方法
-      context.commit('setToken',result.data.data)
+      context.commit('setToken', result.data.data)
     }
   }
 }
 export default {
-  namespaced:true,
+  namespaced: true,
   state,
   mutations,
   actions,

src/views/headPortrait.vue

@@ -1,45 +1,72 @@
 <template>
-<div class="head">
-  <el-popover
-  placement="right"
-  width="400"
-  trigger="click">
-  <div >
-    <p>你好{{name}}</p>
-    <el-divider></el-divider>
+  <div class="head">
+    <el-popover placement="bottom" width="200" trigger="click">
+      <div class="border">
+        <p id="character">你好:</p>
+        <p id="character-yh">{{ name }}</p>
+      </div>
+      <el-divider></el-divider>
+      <div class="btn">
+        <el-link icon="el-icon-unlock" @click="loginout"
+          >退出登录<i class="-icon--right"></i>
+        </el-link>
+      </div>
+
+      <el-button
+        style="border-radius: 50px"
+        icon="el-icon-user-solid"
+        type="info"
+        slot="reference"
+      ></el-button>
+    </el-popover>
   </div>
-  
-  <el-button style="border-radius:50px;" icon="el-icon-user-solid" type="info"  slot="reference"></el-button>
-</el-popover>
-</div>
 </template>
 
 <script>
-import { mapGetters } from 'vuex'
+import { mapGetters, mapMutations } from "vuex";
 
 export default {
-  
-  data () {
+  data() {
     return {
-      name:this.username,
-
-    }
+      name: "",
+    };
   },
   computed: {
-  // 使用对象展开运算符将 getter 混入 computed 对象中
-    ...mapGetters([
-      'username',
-    ])
+    // 使用对象展开运算符将 getter 混入 computed 对象中
+    ...mapGetters(["username"]),
   },
   created() {
-    this.name = this.username?this.username:localStorage.getItem('username');
+    this.name = this.username
+      ? this.username
+      : localStorage.getItem("username");
   },
   methods: {
-
-  }
-
+    ...mapMutations("user", ["REMOVE_TOKEN"]),
+    loginout() {
+      this.REMOVE_TOKEN();
+    },
+  },
 };
 </script>
 
 <style>
+.border {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+#character {
+  display: flex;
+
+  font-size: 16px;
+}
+#character-yh {
+  font-size: 25px;
+  margin-left: 6px;
+}
+.btn {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
 </style>