-- bug 登出

2025-12-10 11:26:45 +08:00 · 2022-12-03 18:53:38 +08:00
parent 16aec52764
commit db610d81c1
4 changed files with 151 additions and 119 deletions
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,27 +1,27 @@
 <template>
  <div id="container" v-if="!isLogin">
-    <nav-top />
+    <nav-top/>
    <div style="display: flex">
-      <nav-left />
+      <nav-left/>
      <div style="flex: 1; display: flex; flex-direction: column; width: 0">
-        <open-pages />
-        <bread-crumb />
+        <open-pages/>
+        <bread-crumb/>
        <main>
          <a-config-provider :locale="zhCN">
-            <router-view />
+            <router-view/>
          </a-config-provider>
        </main>
      </div>
    </div>
  </div>
  <div id="container" v-if="isLogin">
-    <router-view />
+    <router-view/>
  </div>
 </template>
 <script>
-import { computed, defineComponent, ref, watch } from "vue";
-import { useRouter, useRoute } from "vue-router";
-import { useStore } from "vuex";
+import {computed, defineComponent, ref, watch} from "vue";
+import {useRouter, useRoute} from "vue-router";
+import {useStore} from "vuex";
 import NavLeft from "@/components/NavLeft";
 import NavTop from "@/components/NavTop";
 import OpenPages from "@/components/OpenPages";
@@ -29,6 +29,7 @@ import BreadCrumb from "@/components/BreadCrumb";
 import zhCN from "ant-design-vue/es/locale/zh_CN";
 import * as api from "./api/index1";
 import * as api1 from "@/api/index1";
+import * as api2 from "@/api/index";

 export default defineComponent({
  components: {
@@ -49,16 +50,17 @@ export default defineComponent({
    });

    watch(
-      () => route.path,
-      () => {
-        route.path === "/login" && (isLogin.value = true);
-      }
+        () => route.path,
+        () => {
+          route.path === "/login" && (isLogin.value = true);
+        }
    );

    const currentRouteName = computed(() => route.name);

    function init() {
      console.log(store);
+      getUserInfo();
      initDict("faceclassPic");
      initDict("faceclassClass");
      initDict("faceclassScene");
@@ -70,25 +72,30 @@ export default defineComponent({
      getOrgTree();
    }

+    async function getUserInfo() {
+      const userInfo = await api2.userInfo()
+      store.commit("SET_USER", userInfo);
+    }
+
    async function initDict(key) {
      let list = localStorage.getItem(key);
      if (list) {
-        store.commit("SET_DICT", { key, data: JSON.parse(list) });
+        store.commit("SET_DICT", {key, data: JSON.parse(list)});
        return;
      }
      list = await getDictList(key);
      localStorage.setItem(key, JSON.stringify(list));
-      store.commit("SET_DICT", { key, data: list });
+      store.commit("SET_DICT", {key, data: list});
    }

    const getDictList = (param) =>
-      api1
-        .getDict({
-          pageNo: 1,
-          pageSize: 20,
-          setCode: param,
-        })
-        .then((res) => res.data.data.rows);
+        api1
+            .getDict({
+              pageNo: 1,
+              pageSize: 20,
+              setCode: param,
+            })
+            .then((res) => res.data.data.rows);

    //获取组织树
    const getOrgTree = () => {
@@ -104,18 +111,18 @@ export default defineComponent({
        pageSize: 20,
      };
      api
-        .getOrgInfo(obj)
-        .then((res) => {
-          console.log("组织树获取成功", res);
-          if (res.data.code === 200) {
-            // state.treeData = res.data.data;
-            localStorage.setItem("orgtreeList", JSON.stringify(res.data.data));
-            store.commit("getOrgtreeList", res.data.data);
-          }
-        })
-        .catch((err) => {
-          console.log("组织树获取失败", err);
-        });
+          .getOrgInfo(obj)
+          .then((res) => {
+            console.log("组织树获取成功", res);
+            if (res.data.code === 200) {
+              // state.treeData = res.data.data;
+              localStorage.setItem("orgtreeList", JSON.stringify(res.data.data));
+              store.commit("getOrgtreeList", res.data.data);
+            }
+          })
+          .catch((err) => {
+            console.log("组织树获取失败", err);
+          });
    };

    init();
@@ -134,7 +141,7 @@ export default defineComponent({
  // font-family: MicrosoftYaHei, Microsoft YaHei, Avenir, Helvetica, Arial,
  // sans-serif;
  font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB,
-    Microsoft YaHei, Arial, sans-serif;
+  Microsoft YaHei, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: #2c3e50;
--- a/src/api/index.js
+++ b/src/api/index.js
@@ -18,28 +18,28 @@ import http from "./config";
 *     name: user
 *  }
 * }).then(res => console.log(res))
- * 
+ *
 * 接口传参三种方式（post/put/patch）
- * 
+ *
 * 1.'Content-Type'= 'multipart/form-data'，传参格式为 formData。
 * （全局请求头:'Content-Type'= 'application/x-www-form-urlencoded'）
 * （request的Header:'Content-Type'= 'multipart/form-data'）
 * var formData=new FormData();
 * formData.append('user',123456);formData.append('pass',12345678);
 * axios.post("/notice",formData).then()
- * 
+ *
 * 2.'Content-Type'= 'application/x-www-form-urlencoded'，传参格式为 query 形式,使用$qs.stringify。
 * （全局请求头:'Content-Type'= 'application/x-www-form-urlencoded'）
 * （request的Header:'Content-Type'= 'application/x-www-form-urlencoded'）
 * let data = {"code":"1234","name":"yyyy"};
 * axios.post(`${this.$url}/test/testRequest`,qs.stringify({data})).then()
- * 
+ *
 * 3.'Content-Type'= 'application/json，传参格式为 raw (JSON格式)。
 * （全局请求头:'Content-Type'= 'application/x-www-form-urlencoded'）
 * （request的Header:'Content-Type'= 'application/json;charset=UTF-8'）
 * let data = {"code":"1234","name":"yyyy"}
 * axios.post(`${this.$url}/test/testRequest`,data).then()
- * 
+ *
 */


@@ -52,7 +52,7 @@ export const createProject = (obj) => http.post('/admin/project/edit', obj)
 export const getProjectList = (obj) => http.post('/admin/project/list', obj)

 // 获取项目详情信息（包含阶段及任务列表）
-export const getProjectDetail = (obj) => http.get('/admin/project/detail', { params: obj })
+export const getProjectDetail = (obj) => http.get('/admin/project/detail', {params: obj})
 //发布项目
 export const releaseProject = (obj) => http.post('/admin/project/publish', obj)
 //获取项目学员
@@ -70,10 +70,11 @@ export const getDiscussDetail = (obj) => http.post('/discuss/getDiscussDetail',
 //获取模版列表
 export const getTemplate = (obj) => http.post('/admin/project/template/list', obj)
 //获取模版详细信息
-export const getTemplateDetail = (obj) => http.get('/admin/project/template/detail', { params: obj })
+export const getTemplateDetail = (obj) => http.get('/admin/project/template/detail', {params: obj})

 //获取项目统计
-export const getProjectCount = (projectId) => http.get('/admin/project/projectCount', { params: { projectId: projectId } })
+export const getProjectCount = (projectId) => http.get('/admin/project/projectCount', {params: {projectId: projectId}})

 export const login = (obj) => http.post('/admin/CheckUser/userLogin', obj)
+export const userInfo = () => http.get('/admin/CheckUser/userInfo')

--- a/src/components/NavTop.vue
+++ b/src/components/NavTop.vue
@@ -2,8 +2,8 @@
  <div class="navTop">
    <div class="navTopMain">
      <img
-        style="width: 205px; height: 29px; margin-left: 37px; margin-top: 22px"
-        src="../assets/images/navtop/logo.png"
+          style="width: 205px; height: 29px; margin-left: 37px; margin-top: 22px"
+          src="../assets/images/navtop/logo.png"
      />
      <div class="navTopRight">
        <div class="role">
@@ -11,10 +11,10 @@
          <div class="roleArrow"></div>
          <div class="roleItems">
            <div
-              v-for="(value, index) in roleList"
-              :key="index"
-              class="roleItem"
-              @click="changeRole(value)"
+                v-for="(value, index) in roleList"
+                :key="index"
+                class="roleItem"
+                @click="changeRole(value)"
            >
              {{ value.name }}
            </div>
@@ -22,14 +22,14 @@
        </div>
        <div class="user">
          <img
-            style="
+              style="
              width: 40px;
              height: 40px;
              margin-left: 8px;
              border-radius: 15px;
              margin-right: 10px;
            "
-            :src="avatar"
+              :src="avatar"
          />
          <div style="margin-right: 20px">{{ username }}</div>
        </div>
@@ -47,20 +47,21 @@
        </div> -->
        <div class="signOutMain" @click="logOut">
          <img
-            style="width: 27px; height: 27px"
-            src="../assets/images/navtop/signout.png"
+              style="width: 27px; height: 27px"
+              src="../assets/images/navtop/signout.png"
          />
          <span class="signOut">登出</span>
        </div>
      </div>
    </div>
  </div>
-  <down-load v-model:downloadVisible="visible" />
+  <down-load v-model:downloadVisible="visible"/>
 </template>
 <script>
-import { reactive, toRefs } from "vue";
+import {reactive, toRefs} from "vue";
 import DownLoad from "../components/drawers/DownLoad";
 import * as api from "../api/index1";
+
 export default {
  name: "NavTop",
  components: {
@@ -100,24 +101,32 @@ export default {
    };
    const getUser = () => {
      api
-        .getUser()
-        .then((res) => {
-          console.log("获取登录信息成功", res);
-          if (res.data.code === 200) {
-            state.username = res.data.data.realName;
-            // state.avatar = res.data.data.avatar
-            //   ? res.data.data.avatar
-            //   : require("../assets/images/avatar.png");
-            state.avatar = require("../assets/images/avatar.png");
-          }
-        })
-        .catch((err) => {
-          console.log("获取登录信息失败", err);
-        });
+          .getUser()
+          .then((res) => {
+            console.log("获取登录信息成功", res);
+            if (res.data.code === 200) {
+              state.username = res.data.data.realName;
+              // state.avatar = res.data.data.avatar
+              //   ? res.data.data.avatar
+              //   : require("../assets/images/avatar.png");
+              state.avatar = require("../assets/images/avatar.png");
+            }
+          })
+          .catch((err) => {
+            console.log("获取登录信息失败", err);
+          });
    };
    getUser();

    const logOut = () => {
+      localStorage.removeItem('faceclassPic');
+      localStorage.removeItem('faceclassClass');
+      localStorage.removeItem('faceclassScene');
+      localStorage.removeItem('projectLevel');
+      localStorage.removeItem('projectSys');
+      localStorage.removeItem('pathmapPic');
+      localStorage.removeItem('projectClass');
+      localStorage.removeItem('projectPic');
      window.open("https://u-pre.boe.com/web/", "_self");
    };
    return {
@@ -142,9 +151,11 @@ export default {
    display: flex;
    justify-content: space-between;
    background-color: rgba(255, 255, 255, 1);
+
    .navTopRight {
      display: flex;
    }
+
    .role {
      display: flex;
      align-items: center;
@@ -154,6 +165,7 @@ export default {
      line-height: 36px;
      cursor: pointer;
      position: relative;
+
      .roleArrow {
        width: 13px;
        height: 7px;
@@ -161,6 +173,7 @@ export default {
        background-image: url(../assets/images/navtop/down.png);
        background-size: 100%;
      }
+
      .roleItems {
        width: 109px;
        height: 90px;
@@ -174,22 +187,27 @@ export default {
        display: none;
        z-index: 100;
      }
+
      .roleItem {
        font-size: 14px;
        font-weight: 400;
        color: rgba(79, 81, 86, 1);
        line-height: 36px;
      }
+
      .roleItem:hover {
        color: #4ea6ff;
      }
    }
+
    .role:hover .roleItems {
      display: block;
    }
+
    .role:hover .roleArrow {
      background-image: url(../assets/images/navtop/up.png);
    }
+
    .user {
      margin-left: 37px;
      display: flex;
@@ -199,12 +217,14 @@ export default {
      color: #b3bdc4;
      line-height: 36px;
    }
+
    .signOutMain {
      cursor: pointer;
      margin-right: 29px;
      display: flex;
      align-items: center;
    }
+
    .signOut {
      font-size: 16px;
      font-weight: 400;
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -6,60 +6,64 @@
 * @FilePath: /fe-manage/src/store/index.js
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 */
-import { createStore } from "vuex";
+import {createStore} from "vuex";
 // import * as api from '../api/index1'
 export default createStore({
-  state: {
-    openpages: localStorage.getItem("openpages")
-      ? JSON.parse(localStorage.getItem("openpages"))
-      : [
-        {
-          pagename: "学习路径图",
-          href: "/learningpath",
-          active: true,
+    state: {
+        openpages: localStorage.getItem("openpages")
+            ? JSON.parse(localStorage.getItem("openpages"))
+            : [
+                {
+                    pagename: "学习路径图",
+                    href: "/learningpath",
+                    active: true,
+                },
+            ],
+
+        assessmentName: "",
+        routerId: null,
+        projectTemplateId: null,
+        userInfo: {},
+        orgtreeList: [],
+        faceclassPic: null,
+        faceclassClass: [],
+        faceclassScene: [],
+        projectLevel: [],//项目级别
+        projectSys: [],//培训分类
+        pathmapPic: [],//学习路径背景图
+    },
+    getters: {},
+    mutations: {
+        chengeOpenpages(state, list) {
+            // console.log('list', list)
+            state.openpages = list;
+        },
+        chengeRouterId(state, routerId) {
+            // console.log('list', list)
+            state.routerId = routerId;
        },
-      ],

-    assessmentName: "",
-    routerId: null,
-    projectTemplateId: null,
-    orgtreeList: [],
-    faceclassPic: null,
-    faceclassClass: [],
-    faceclassScene: [],
-    projectLevel: [],//项目级别
-    projectSys: [],//培训分类
-    pathmapPic: [],//学习路径背景图
-  },
-  getters: {},
-  mutations: {
-    chengeOpenpages(state, list) {
-      // console.log('list', list)
-      state.openpages = list;
-    },
-    chengeRouterId(state, routerId) {
-      // console.log('list', list)
-      state.routerId = routerId;
-    },
-
-    SET_assessmentName(state, name) {
-      state.assessmentName = name;
-      console.log("state.assessmentName");
-      console.log(state.assessmentName);
-    },
-    //获取组织树
-    getOrgtreeList(state, data) {
-      state.orgtreeList = data
-    },
-    SET_DICT(state, { key, data }) {
-      state[key] = data
-    },
-    SET_projectTemplateId(state, projectTemplateId) {
-      state.projectTemplateId = projectTemplateId;
-    }
+        SET_assessmentName(state, name) {
+            state.assessmentName = name;
+            console.log("state.assessmentName");
+            console.log(state.assessmentName);
+        },
+        //获取组织树
+        getOrgtreeList(state, data) {
+            state.orgtreeList = data
+        },
+        SET_DICT(state, {key, data}) {
+            state[key] = data
+        },
+        SET_USER(state, userInfo) {
+            state.userInfo = userInfo
+        },
+        SET_projectTemplateId(state, projectTemplateId) {
+            state.projectTemplateId = projectTemplateId;
+        }


-  },
-  actions: {},
-  modules: {},
+    },
+    actions: {},
+    modules: {},
 });