From b918591374485891fb6d9c049852c203974b6b4a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=AE=89=E8=99=B9=E7=9D=BF?= <297504645@qq.com> Date: Tue, 29 Aug 2023 17:30:05 +0800 Subject: [PATCH] =?UTF-8?q?=E6=8E=A5=E5=8F=A3=E7=9C=8B=E6=9D=BF=EF=BC=9Ato?= =?UTF-8?q?ken=E5=85=A8=E5=B1=80=E9=85=8D=E7=BD=AE=EF=BC=8C=E8=B7=AF?= =?UTF-8?q?=E7=94=B1=E9=87=8D=E5=86=99=EF=BC=8C=E8=8F=9C=E5=8D=95=E8=8E=B7?= =?UTF-8?q?=E5=8F=96=EF=BC=8C=E7=99=BB=E5=BD=95=EF=BC=8C=E5=AF=BC=E5=87=BA?= =?UTF-8?q?=E7=AD=89=E4=BD=BF=E7=94=A8token=E4=BD=8D=E7=BD=AE=E5=85=A8?= =?UTF-8?q?=E5=B1=80=E6=96=B9=E6=B3=95=E4=BD=BF=E7=94=A8=E5=B0=81=E8=A3=85?= =?UTF-8?q?=E5=BC=80=E5=8F=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- PC/InterFace.Dash/src/api/wms-auth.js | 40 +++- PC/InterFace.Dash/src/permission.js | 172 +++++++++--------- PC/InterFace.Dash/src/permission_old.js | 146 +++++++++++++++ PC/InterFace.Dash/src/router/index.js | 22 ++- .../src/store/modules/permission.js | 8 + PC/InterFace.Dash/src/store/modules/user.js | 36 ++-- PC/InterFace.Dash/src/views/login/index.vue | 29 +-- 7 files changed, 317 insertions(+), 136 deletions(-) create mode 100644 PC/InterFace.Dash/src/permission_old.js diff --git a/PC/InterFace.Dash/src/api/wms-auth.js b/PC/InterFace.Dash/src/api/wms-auth.js index c637c39..aa49b23 100644 --- a/PC/InterFace.Dash/src/api/wms-auth.js +++ b/PC/InterFace.Dash/src/api/wms-auth.js @@ -9,14 +9,6 @@ export function login(data) { }) } -export function token(data) { - return request({ - url: authApi + '/connect/token', - method: 'post', - data - }) -} - export function logout() { return request({ url: authApi + '/account/logout', @@ -26,6 +18,18 @@ export function logout() { // faster-new +// 获取token +export function token(data) { + return request({ + url: localStorage.getItem('authApi') + '/connect/token', + method: 'post', + headers: { + 'Content-Type': 'application/x-www-form-urlencoded' + }, + data + }) +} + // 通过用户名获取用户信息 export function getUsersByUserName(name) { return request({ @@ -34,7 +38,6 @@ export function getUsersByUserName(name) { }) } - // 获取表头zh转义数据 export function getInterfaceBoard() { return request({ @@ -65,3 +68,22 @@ export async function getApiDefinition() { params:{IncludeTypes:true} }) } + +// *************权限页面维护************* +//获取列表 +export function getPageListRoles(data) { + return request({ + url: authApi + '/identity/roles', + method: 'get', + params: data + }) +} + +//获取权限模板 +export function getpermissionsRoles(data) { + return request({ + url: authApi +'/permission-management/permissions', + method: 'get', + params: data + }) +} diff --git a/PC/InterFace.Dash/src/permission.js b/PC/InterFace.Dash/src/permission.js index 1b9f4cd..0c45d22 100644 --- a/PC/InterFace.Dash/src/permission.js +++ b/PC/InterFace.Dash/src/permission.js @@ -5,29 +5,39 @@ import NProgress from 'nprogress' // progress bar import 'nprogress/nprogress.css' // progress bar style import { getToken } from '@/utils/auth' // get token from cookie import getPageTitle from '@/utils/get-page-title' -import { asyncRoutes } from '@/router' NProgress.configure({ showSpinner: false }) // NProgress Configuration -router.beforeEach(async (to, from, next) => { - // start progress bar - NProgress.start() - // set page title - document.title = getPageTitle() +const whiteList = ['/login', '/auth-redirect', '/testForm'] // no redirect whitelist + +// 跳转登录页 +const pageToLogin = (to, from, next) => { + if (whiteList.indexOf(to.path) !== -1) { + // in the free login whitelist, go directly + next() + NProgress.done() + } else { + // other pages that do not have permission to access are redirected to the login page. + next(`/login?redirect=${to.path}`) + NProgress.done() + } +} + +// 首次进入页面加载数据处理 +const toPageInit = async (to, from, next) => { + let isFresh = false // 获取表头转义 - if(!store.getters.columZHList || store.getters.columZHList.length <= 0){ - await store.dispatch('definition/getColumZHList',()=>{ - NProgress.done() - }) + if(!store.getters.columZHList){ + await store.dispatch('definition/getColumZHList') } // 获取菜单数据 if(!store.getters.permission_routes || store.getters.permission_routes.length <= 0){ - const accessRoutes = await store.dispatch('permission/getApiColumnsNames') - router.addRoutes(accessRoutes) + isFresh = true + await store.dispatch('permission/getApiColumnsNames') } // 获取枚举数据 @@ -35,10 +45,39 @@ router.beforeEach(async (to, from, next) => { await store.dispatch('definition/getDefinitionConfig') } - // 是否已尝试过自动登录 - const alreadyTryLogin = localStorage.getItem('alreadyTryLogin') - // 是否有用户信息： - const userInfo = store.getters.currentUserInfo + // 获取用户信息 + let _username = to.query.loginName || localStorage.getItem("isLoginName") || localStorage.getItem("userNameOrEmailAddress") + if(!store.getters.currentUserInfo || store.getters.currentUserInfo.length <= 0){ + await store.dispatch('user/getUserInfo',_username) + .then(()=>{ + toNextHandle(to, from, next,isFresh) + }) + .catch(()=>{ + toNextHandle(to, from, next,isFresh) + }) + }else{ + toNextHandle(to, from, next,isFresh) + } +} + +// 跳转处理 +const toNextHandle = (to, from, next,isFresh) => { + if(isFresh){ + next({...to,replace:true}) + }else{ + next() + } + NProgress.done() +} + +router.beforeEach(async (to, from, next) => { + + // start progress bar + NProgress.start() + // set page title + document.title = getPageTitle() + + const hasToken = getToken() // 判断是否自动登录 let isAutoLogin = JSON.parse(localStorage.getItem('isAutoLogin')) // 如果路径中有isAutoLogin参数则优先，否则读取配置文件中的isAutoLogin参数 @@ -46,83 +85,42 @@ router.beforeEach(async (to, from, next) => { if( _url_isAutoLogin== 'false' || _url_isAutoLogin == 'true'){ isAutoLogin = JSON.parse(_url_isAutoLogin) } - if(to.path == '/login'){ - console.log('-------当前路由为登录页-------') - next() + + if(hasToken){ + if (to.path === '/login') { + console.log('有token，是登录页，将跳转至/') + // if is logged in, redirect to the home page + next({ + path: '/' + }) + NProgress.done() // hack: https://github.com/PanJiaChen/vue-element-admin/pull/2939 + } else { + console.log('有token，不是登录页，toPageInit') + await toPageInit(to, from, next) + } }else{ - console.log('-------当前路由不是登录页-------') - if((userInfo && userInfo.id) || alreadyTryLogin == 'true'){ - if(userInfo && userInfo.id){ - console.log('-------当前有用户信息-------',userInfo) - }else{ - console.log('-------当前没有用户信息，但是已尝试过登录-------') - } - next() - }else{ - console.log('-------当前没有用户信息-------') - if(isAutoLogin || to.query.loginName){ + if (to.path === '/login') { + console.log('没有token，是登录页，pageToLogin') + pageToLogin(to, from, next) + } else { + if(isAutoLogin){ + console.log('没有token，不是登录页，是自动登录，自动登录是否成功都将继续toPageInit') let _username = to.query.loginName || localStorage.getItem("isLoginName") || localStorage.getItem("userNameOrEmailAddress") - console.log('-------要求自动登录-------',isAutoLogin,to.query.loginName,_username) - // let loginForm= { - // userNameOrEmailAddress:localStorage.getItem("userNameOrEmailAddress"), - // password:localStorage.getItem("client_secret"), - // // rememberMe:true, - // // grant_type: 'password', - // // client_id: 'Auth_App', - // } - // // store.dispatch('user/login', loginForm).then(() => { - // login(loginForm).then(()=>{ - await store.dispatch('user/getUserInfo',_username).then(()=>{ - console.log("-------用户信息获取成功-------") - localStorage.setItem('alreadyTryLogin',true) - next(to) - NProgress.done() - // next({ - // ...to, - // query:{ - // loginName:to.query.loginName, - // isAutoLogin:to.query.isAutoLogin, - // isSinglePage:to.query.isSinglePage - // }, - // replace: true - // }) - }).catch(()=>{ - localStorage.setItem('alreadyTryLogin',true) - next() - // next({ - // path:'/login', - // query:{ - // isAutoLogin:to.query.isAutoLogin, - // isSinglePage:to.query.isSinglePage - // }, - // replace: true - // }) - // next(`/login?loginName=${to.query.loginName}&isAutoLogin=${to.query.isAutoLogin}`) - // next(`/login`) - localStorage.setItem("isLoginName",_username) - // Message.error('获取用户信息失败，请重试!') - }) - // }) - // .catch((error) => { - // console.log('登录失败') - // }) + let _password = to.query.loginPass || localStorage.getItem("client_secret") + // todo-fast:password确定 + await store.dispatch('user/login', {password:_password,username:_username}) + .then(()=>{ + toPageInit(to, from, next) + }) + .catch(()=>{ + toPageInit(to, from, next) + }) }else{ - console.log('-------不需要自动登录-------',isAutoLogin,to.query.loginName) - next({ - path:'/login', - query:{ - loginName:to.query.loginName, - isAutoLogin:to.query.isAutoLogin, - isSinglePage:to.query.isSinglePage - }, - replace: true - }) - NProgress.done() + console.log('没有token，不是登录页，不是自动登录，pageToLogin') + pageToLogin(to, from, next) } } } - - localStorage.setItem('alreadyTryLogin',false) }) router.afterEach(() => { diff --git a/PC/InterFace.Dash/src/permission_old.js b/PC/InterFace.Dash/src/permission_old.js new file mode 100644 index 0000000..0de0220 --- /dev/null +++ b/PC/InterFace.Dash/src/permission_old.js @@ -0,0 +1,146 @@ +// 加token之前版本 +import router from './router' +import store from './store' +import { Message } from 'element-ui' +import NProgress from 'nprogress' // progress bar +import 'nprogress/nprogress.css' // progress bar style +import { getToken } from '@/utils/auth' // get token from cookie +import getPageTitle from '@/utils/get-page-title' +import { asyncRoutes } from '@/router' + +NProgress.configure({ + showSpinner: false +}) // NProgress Configuration + +router.beforeEach(async (to, from, next) => { + // start progress bar + NProgress.start() + // set page title + document.title = getPageTitle() + + const hasToken = getToken() + console.log(21,'hasToken',hasToken,!hasToken) + + // 获取表头转义 + if(!store.getters.columZHList || store.getters.columZHList.length <= 0){ + await store.dispatch('definition/getColumZHList',()=>{ + NProgress.done() + }) + } + + // 获取菜单数据 + if(!store.getters.permission_routes || store.getters.permission_routes.length <= 0){ + const accessRoutes = await store.dispatch('permission/getApiColumnsNames') + router.addRoutes(accessRoutes) + console.log(35,router) + } + + // 获取枚举数据 + if(!store.getters.enumList || store.getters.enumList.length <= 0){ + await store.dispatch('definition/getDefinitionConfig') + } + + // 是否已尝试过自动登录 + const alreadyTryLogin = localStorage.getItem('alreadyTryLogin') + // 是否有用户信息： + const userInfo = store.getters.currentUserInfo + // 判断是否自动登录 + let isAutoLogin = JSON.parse(localStorage.getItem('isAutoLogin')) + // 如果路径中有isAutoLogin参数则优先，否则读取配置文件中的isAutoLogin参数 + let _url_isAutoLogin = to.query.isAutoLogin + if( _url_isAutoLogin== 'false' || _url_isAutoLogin == 'true'){ + isAutoLogin = JSON.parse(_url_isAutoLogin) + } + if(to.path == '/login'){ + console.log('-------当前路由为登录页-------') + next() + }else{ + console.log('-------当前路由不是登录页-------') + if((userInfo && userInfo.id) || alreadyTryLogin == 'true'){ + if(userInfo && userInfo.id){ + console.log('-------当前有用户信息-------',userInfo) + }else{ + console.log('-------当前没有用户信息，但是已尝试过登录-------') + } + next() + }else{ + console.log('-------当前没有用户信息-------') + if(isAutoLogin || to.query.loginName){ + let _username = to.query.loginName || localStorage.getItem("isLoginName") || localStorage.getItem("userNameOrEmailAddress") + console.log('-------要求自动登录-------',isAutoLogin,to.query.loginName,_username) + // let loginForm= { + // userNameOrEmailAddress:localStorage.getItem("userNameOrEmailAddress"), + // password:localStorage.getItem("client_secret"), + // // rememberMe:true, + // // grant_type: 'password', + // // client_id: 'Auth_App', + // } + // // store.dispatch('user/login', loginForm).then(() => { + // login(loginForm).then(()=>{ + await store.dispatch('user/getUserInfo',_username).then(()=>{ + console.log("-------用户信息获取成功-------") + localStorage.setItem('alreadyTryLogin',true) + next(to) + NProgress.done() + // next({ + // ...to, + // query:{ + // loginName:to.query.loginName, + // isAutoLogin:to.query.isAutoLogin, + // isSinglePage:to.query.isSinglePage + // }, + // replace: true + // }) + }).catch(()=>{ + localStorage.setItem('alreadyTryLogin',true) + next() + // next({ + // path:'/login', + // query:{ + // isAutoLogin:to.query.isAutoLogin, + // isSinglePage:to.query.isSinglePage + // }, + // replace: true + // }) + // next(`/login?loginName=${to.query.loginName}&isAutoLogin=${to.query.isAutoLogin}`) + // next(`/login`) + localStorage.setItem("isLoginName",_username) + // Message.error('获取用户信息失败，请重试!') + }) + // }) + // .catch((error) => { + // console.log('登录失败') + // }) + }else{ + console.log('-------不需要自动登录-------',isAutoLogin,to.query.loginName) + next({ + path:'/login', + query:{ + loginName:to.query.loginName, + isAutoLogin:to.query.isAutoLogin, + isSinglePage:to.query.isSinglePage + }, + replace: true + }) + NProgress.done() + } + } + } + + localStorage.setItem('alreadyTryLogin',false) +}) + +router.afterEach(() => { + // element-ui 使用 Tooltip 提示时候，更换页面，提示依旧存在偶现bug处理。 + const mytooltipList = document.querySelectorAll('.el-tooltip__popper') // 获取页面所有tooltip的dom集合 + setTimeout(() => { + mytooltipList.forEach((value) => { + value.style.display = 'none' + if(value.parentElement){ + value.parentElement.removeChild(value) + } + }) + }, 1000) + // finish progress bar + NProgress.done() +}) \ No newline at end of file diff --git a/PC/InterFace.Dash/src/router/index.js b/PC/InterFace.Dash/src/router/index.js index aa4880d..0b28111 100644 --- a/PC/InterFace.Dash/src/router/index.js +++ b/PC/InterFace.Dash/src/router/index.js @@ -96,6 +96,24 @@ export let constantRoutes = [ } }] }, + { + path: '/', + component: Layout, + redirect: '/RoleManage', + hidden: true, + children: [{ + path: 'RoleManage', + component: () => import('@/views/systemManage/RoleManage'), + name: 'RoleManage', + meta: { + keepAlive : true, + title: 'RoleManage', + icon: 'svg_dashboard', + outerFirst:true + // affix: true + } + }] + }, ] /** @@ -119,9 +137,9 @@ const createRouter = () => new Router({ y: 0 }), // todo-new:有token后使用去掉下一行代码 - routes: constantRoutes.concat(asyncRoutes) + // routes: constantRoutes.concat(asyncRoutes) // todo-new:有token后使打开下方代码,并检查是否有效 - // routes: constantRoutes + routes: constantRoutes }) const router = createRouter() diff --git a/PC/InterFace.Dash/src/store/modules/permission.js b/PC/InterFace.Dash/src/store/modules/permission.js index 1cbd7af..6fafc46 100644 --- a/PC/InterFace.Dash/src/store/modules/permission.js +++ b/PC/InterFace.Dash/src/store/modules/permission.js @@ -5,6 +5,7 @@ import { import Layout from '@/layout' import { getDefinitionMenu } from '@/api/wms-auth' import store from '@/store' +import router from '@/router' /** * Use meta.role to determine if the current user has permission @@ -69,6 +70,10 @@ const mutations = { SET_ROUTES: (state, routes) => { state.addRoutes = routes state.routes = constantRoutes.concat(routes) + router.addRoutes(routes) + }, + CLEAR_ROUTES: (state) => { + state.routes = constantRoutes.concat([]) }, SET_TABLESNAME: (state, data) => { state.tablesName = data @@ -159,6 +164,9 @@ export function initTreeMenusHandle(tree, list,first) { return _res } const actions = { + clearRouters({commit}){ + commit('CLEAR_ROUTES') + }, getApiColumnsNames({ commit }, userId) { diff --git a/PC/InterFace.Dash/src/store/modules/user.js b/PC/InterFace.Dash/src/store/modules/user.js index bfbd08b..b29dde2 100644 --- a/PC/InterFace.Dash/src/store/modules/user.js +++ b/PC/InterFace.Dash/src/store/modules/user.js @@ -12,6 +12,7 @@ import router, { resetRouter } from '@/router' import qs from 'qs' +import store from '@/store' const state = { token: getToken(), @@ -45,7 +46,8 @@ const mutations = { const actions = { // user login login({ - commit + commit, + dispatch }, userInfo) { const { password, @@ -65,21 +67,28 @@ const actions = { let tokenData = qs.stringify(parseData) return new Promise((resolve, reject) => { // login(loginData).then(response => { - let params = { + let params = qs.stringify({ password: password, - userNameOrEmailAddress: username - } + username: username, + client_id:'Z_App', + grant_type:'password', + scopes:'Z' + }); token(params).then(response => { const { - accessToken, - tokenType + access_token, + token_type } = response - if (accessToken == null) { + if (access_token == null) { reject() } else { - commit('SET_TOKEN', accessToken) - setToken(tokenType + ' ' + accessToken) - resolve() + commit('SET_TOKEN', access_token) + setToken(token_type + ' ' + access_token) + store.dispatch('user/getUserInfo',username).then(()=>{ + resolve() + }).catch(()=>{ + reject() + }) } }).catch(error => { reject(error) @@ -97,9 +106,10 @@ const actions = { }) { return new Promise((resolve, reject) => { // logout().then(() => { - commit('SET_TOKEN', '') - // commit('SET_USERINFO', null) - // removeToken() + commit('SET_TOKEN', null) + commit('SET_USERINFO', null) + removeToken() + store.dispatch('permission/clearRouters') // resetRouter() // reset visited views and cached views // to fixed https://github.com/PanJiaChen/vue-element-admin/issues/2485 diff --git a/PC/InterFace.Dash/src/views/login/index.vue b/PC/InterFace.Dash/src/views/login/index.vue index 68619aa..4dd1cb2 100644 --- a/PC/InterFace.Dash/src/views/login/index.vue +++ b/PC/InterFace.Dash/src/views/login/index.vue @@ -162,32 +162,11 @@ export default { handleLogin () { this.$refs.loginForm.validate(valid => { if (valid) { - // todo-new:自动登录跳转处理 - this.$store.dispatch('user/getUserInfo',this.loginForm.username).then(()=>{ - localStorage.setItem('isLoginName',this.loginForm.username) - this.$router.push({ - path:'/', - query:{ - isSinglePage:this.$route.query.isSinglePage - }, - replace: true - }) - }).catch(()=>{ - this.$message.error('获取用户信息失败，请重试!') - }) - return this.loading = true - this.loginForm.userNameOrEmailAddress = this.loginForm.username - let _zh = localStorage.getItem('columnsApiNamesZh') - login(this.loginForm).then(()=>{ - // this.$store.dispatch('user/login', this.loginForm).then(() => { - // 提前获取接口监控看板表头数据并存储 - // getUsersByUserName(localStorage.getItem("userNameOrEmailAddress")).then(res=>{ - // // store.dispatch('user/setName',res) - // localStorage.setItem("currentUserInfo", JSON.stringify(res)); - // }) - // this.$router.push({ path: '/'}) - // this.loading = false + this.$store.dispatch('user/login', this.loginForm) + .then(() => { + this.$router.push({ path: '/'}) + this.loading = false }) .catch((error) => { this.$message.error('用户名或密码错误！')