fix: 修复权限问题bug; 修复未选择案例作品展示页显示bug [2201,2202,2207]

src/api/base.js

@@ -37,3 +37,8 @@ export function getSelectCase() {
 export function getSelectRole() {
   return httpRequest.get('/api/xtraining/api/v1/role')
 }
+
+/** 获取作品完成状态 */
+export function getWorkStatus() {
+  return httpRequest.get('/api/xtraining/api/v1/show/analysis-status')
+}

src/components/base/AppMenu.vue

@@ -6,6 +6,7 @@
   </ul>
 </template>
 <script>
+import { getWorkStatus } from '@/api/base.js'
 export default {
   name: 'AppMenu',
   data() {
@@ -15,7 +16,7 @@ export default {
         { label: '产品分析', path: '/product-analysis', disabled: [0, 2, 3] },
         { label: '用户研究', path: '/user-study', disabled: [0, 1, 3] },
         { label: '营销工具使用', path: '/market-tools', disabled: [0, 1, 2] },
-        { label: '作品展示', path: '/works-show', disabled: [] }
+        { label: '作品展示', path: '/works-show', disabled: [0] }
       ]
     }
   },
@@ -28,12 +29,35 @@ export default {
     }
   },
   methods: {
-    menuSelect(item) {
-      if (item.disabled.includes(this.role)) {
+    async menuSelect(item) {
+      if (this.role === 0) {
+        this.$message.error('请选择角色')
+      } else if (item.disabled.includes(this.role)) {
         this.$message.error('您当前的角色禁止访问该页面')
       } else {
-        this.$router.push(item.path)
+        if (['/user-study', '/market-tools'].includes(item.path)) {
+          const flag = await this.fetchWorkStatus()
+          console.log(flag)
+          if (flag) {
+            this.$router.push(item.path)
+          } else {
+            this.$message.error('您先完成产品分析报告，再进行' + item.label)
+          }
+        } else {
+          this.$router.push(item.path)
+        }
       }
+    },
+    fetchWorkStatus() {
+      return new Promise((resolve) => {
+        getWorkStatus().then(res => {
+          if (res.code === 0 && res.data) {
+            resolve(true)
+          } else {
+            resolve(false)
+          }
+        }).catch(err => resolve(false))
+      })
     }
   }
 }

src/components/layout/Header.vue

@@ -8,7 +8,7 @@
 import AppMenu from '../base/AppMenu.vue'
 export default {
   name: 'AppHeader',
-  components: {AppMenu}
+  components: { AppMenu }
 }
 </script>
 

src/modules/home/views/Index.vue

 <template>
   <div class="home">
     <div class="top">
+      <el-button style="margin-left:10px;" type="primary" size="medium" plain round @click="handleLogout">退出系统</el-button>
       <el-button type="primary" size="medium" plain round @click="visible = true">切换角色</el-button>
     </div>
     <div class="inner">
@@ -8,8 +9,6 @@
         <div class="logo">金融</div>
         <app-menu />
       </div>
-      <el-button type="primary" disabled>1111</el-button>
-      <!-- <btn :attrs="{ title: '用户分析', left: '360px', top: '134px' }" @click.native="handleClick('/user-study')" disabled/> -->
       <btn v-for="(item, index) in btnList" :key="index" :attrs="{ title: item.label, left: item.left, top: item.top }" @click.native="handleClick(item)" :disabled="item.disabled.includes(role)"/>
     </div>
     <role-select :visible="visible" @roleSelect="fetchSelectRole" />
@@ -29,8 +28,8 @@ export default {
       btnList: [
         { label: '产品分析', path: '/product-analysis', disabled: [0, 2, 3], left: '960px', top: '134px' },
         { label: '用户分析', path: '/user-study', disabled: [0, 1, 3], left: '340px', top: '134px' },
-        { label: '营销工具使用', path: '/market-tools', disabled: [0, 1, 2], left: '650px', top: '344px' },
-        { label: '作品展示', path: '/works-show', disabled: [], left: '320px', top: '344px' }
+        { label: '营销工具使用', path: '/market-tools', disabled: [0, 1, 2], left: '652px', top: '343px' },
+        { label: '作品展示', path: '/works-show', disabled: [0], left: '320px', top: '343px' }
       ],
       menuMap: {}
     }
@@ -60,6 +59,11 @@ export default {
     menuSelect(item) {
       this.$router.push(item.path)
     },
+    handleLogout() {
+      this.$store.dispatch('logout').then(() => {
+        window.location.href = `${import.meta.env.VITE_LOGIN_URL}?rd=${encodeURIComponent(window.location.href)}`
+      })
+    },
     fetchSelectRole(role) {
       selectRole({ role }).then(res => {
         if (res.code === 0 && res.data && res.data.status) {
@@ -80,10 +84,10 @@ export default {
 <style scoped>
 .top{
   height:80px;
+  padding:20px 50px 0 0;
 }
 .top .el-button{
   float:right;
-  margin:20px 50px 0 0;
 }
 .inner{
   background:url('@/assets/images/home.png') no-repeat left center;

src/modules/user-study/views/Index.vue

@@ -98,6 +98,10 @@ export default {
     }
   },
   created() {
+    if (![2, 4].includes(this.$store.state.role)) {
+      this.$router.push('/home')
+      return
+    }
     this.init()
     this.status = this.$route.query.type || '0'
   },
@@ -123,7 +127,7 @@ export default {
             confirmButtonText: '回到首页',
             showClose: false,
             callback: action => {
-              this.$route.push('/home')
+              this.$router.push('/home')
             }
           })
         }

src/modules/works-show/api.js

-import httpRequest from '@/utils/axios'
-
-/** 获取作品完成状态 */
-export function getWorkStatus() {
-  return httpRequest.get('/api/xtraining/api/v1/show/analysis-status')
-}
\ No newline at end of file

src/modules/works-show/views/Index.vue

@@ -30,13 +30,13 @@
 </template>
 
 <script>
-import { getWorkStatus } from '../api'
+import { getWorkStatus } from '@/api/base'
 export default {
   data() {
     return {
-      case_status: true,
-      marketing_status: true,
-      user_analysis_status: true,
+      case_status: false,
+      marketing_status: false,
+      user_analysis_status: false,
       navMap: {
         1: '/product-analysis/report',
         2: '/product-analysis/result',
@@ -65,6 +65,8 @@ export default {
           this.marketing_status = res.data.marketing_status
           this.user_analysis_status = res.data.user_analysis_status
         }
+      }).catch(err => {
+        console.log(err)
       })
     }
   }

src/router/index.js

 import Vue from 'vue'
-import VueRouter from 'vue-router'
+import Router from 'vue-router'
 
-Vue.use(VueRouter)
+Vue.use(Router)
+
+const originalPush = Router.prototype.push
+const originalReplace = Router.prototype.replace
+// push
+Router.prototype.push = function push (location, onResolve, onReject) {
+  if (onResolve || onReject) return originalPush.call(this, location, onResolve, onReject)
+  return originalPush.call(this, location).catch(err => err)
+}
+// replace
+Router.prototype.replace = function push (location, onResolve, onReject) {
+  if (onResolve || onReject) return originalReplace.call(this, location, onResolve, onReject)
+  return originalReplace.call(this, location).catch(err => err)
+}
 
 const routes = [
   { path: '*', redirect: '/home' },
   { path: '/', redirect: '/home' }
 ]
 
-const router = new VueRouter({
+const router = new Router({
   mode: 'history',
   routes
 })

src/store/index.js

 import Vue from 'vue'
-import Vuex, { Store } from 'vuex'
+import Vuex from 'vuex'
 import { getUser, logout, getSelectCase, getSelectRole } from '@/api/base'
 
 Vue.use(Vuex)
@@ -8,7 +8,7 @@ export default new Vuex.Store({
   state: {
     user: {},
     case: {},
-    role: 0
+    role: null
   },
   mutations: {
     setUser(state, user) {
@@ -45,9 +45,9 @@ export default new Vuex.Store({
               commit('setCase', response.data.case)
             })
             // 获取用户选中的角色
-            getSelectRole().then(res => {
-              commit('setRole', res.data.role)
-            })
+            // getSelectRole().then(res => {
+            //   commit('setRole', res.data.role)
+            // })
             return true
           } else {
             commit('setUser', {})
@@ -59,6 +59,23 @@ export default new Vuex.Store({
           return false
         })
       return isLogin
+    },
+    async checkRole({ commit }) {
+      const hasRole = await getSelectRole()
+        .then(res => {
+          if (res.code === 0) {
+            commit('setRole', res.data.role)
+            return true
+          } else {
+            commit('setRole', null)
+            return false
+          }
+        })
+        .catch(() => {
+          commit('setRole', null)
+          return false
+        })
+      return hasRole
     }
   }
 })

src/utils/beforeEnter.js

 import store from '@/store'
+import router from '@/router'
 
 const UA = navigator.userAgent
 const isMobile = /iphone/i.test(UA) || (/android/i.test(UA) && /mobile/i.test(UA))
@@ -29,6 +30,11 @@ export default async function (to, from, next) {
   if (!isLogin) {
     window.location.href = `${import.meta.env.VITE_LOGIN_URL}?rd=${encodeURIComponent(window.location.href)}`
     return
+  } else {
+    const hasRole = typeof store.state.role === 'number' || (await store.dispatch('checkRole'))
+    if (hasRole && store.state.role === 0 && to.path !== '/home') {
+      router.push('/home')
+    }
   }
 
   next()