完善登录

src/components/Marqueebox/index.vue

@@ -12,9 +12,9 @@
    <el-menu class="message-box" mode="horizontal">
      <div class="marquee_box">
        <span class="tit">系统公告：</span>
        <div ref="rollul" class="marquee_text" :class="{anim:animate}">
          {{formNotice.desc}}
        </div>
        <el-tooltip :content="formNotice.desc" placement="bottom-end" effect="dark">
          <div class="marquee_text">{{formNotice.desc}}</div>
        </el-tooltip>
        <span class="btn-span" v-if="isShow" @click="openNoticeDialog">设置</span>
      </div>
    </el-menu>
@@ -46,7 +46,6 @@ export default {
  },
  created() {
    this.getNotice()
    setInterval(this.scroll, 3000)
  },
  methods: {
    getNotice() {
@@ -75,16 +74,6 @@ export default {
          return false
        }
      })
    },
    scroll() {
      // const con1 = this.$refs.rollul
      // con1.style.marginTop = '0px'
      // this.animate = !this.animate
      // var that = this
      // setTimeout(() => {
      //   con1.style.marginTop = '-50px'
      //   that.animate = !that.animate
      // }, 1000)
    }
  }
}
@@ -109,10 +98,12 @@ export default {
      line-height: 50px;
      position:absolute;
      top:0;
      padding-left:68px;
      padding-right: 80px;
      width:100%;
      padding-left: 0;
      left:68px;
      right:80px;
      box-sizing: border-box;
      text-overflow: ellipsis;
      white-space:nowrap;
      overflow: hidden;
    }
    .btn-span{

src/permission.js

@@ -3,49 +3,51 @@ import store from './store'
import NProgress from 'nprogress' // Progress 进度条
import 'nprogress/nprogress.css'// Progress 进度条样式
import { Message } from 'element-ui'
import { getSession, getIfLoginUser } from '@/utils/auth' // 验权
import { getCookiesName } from '@/utils/auth' // 验权
NProgress.configure({ showSpinner: false })// NProgress Configuration
function hasPermission(roles, permissionRoles) {
  if (roles.indexOf('1') >= 0) return true // admin permission passed directly
  if (!permissionRoles) return true
  return roles.some(role => permissionRoles.indexOf(role) >= 0)
}
const whiteList = ['/login', '/findPwd'] // 不重定向白名单
getIfLoginUser()
router.beforeEach((to, from, next) => {
  NProgress.start()
  setTimeout(() => {
    console.log(getSession())
    console.log(store.getters.logins)
    if (store.getters.logins) {
    if (getCookiesName()) {
      if (to.path === '/login') {
        console.log(3333)
        next({ path: '/' })
        NProgress.done()
        console.log(1111)
      } else {
        if (store.getters.roles.length === 0) {
          console.log(2222)
          store.dispatch('GetUserInfo').then(res => { // 拉取用户信息
            const dataS = res.data
            const roles = [dataS.type.toString()]
        if (store.getters.roles.length === 0) { // 判断当前用户是否已拉取完user_info信息
          store.dispatch('GetUserInfo').then(res => { // 拉取user_info
            const roles = [res.data.type.toString()]
            store.dispatch('GenerateRoutes', { roles }).then(() => { // 根据roles权限生成可访问的路由表
              router.addRoutes(store.getters.addRouters) // 动态添加可访问路由表
              next({ ...to, replace: true })
              next({ ...to, replace: true }) // hack方法 确保addRoutes已完成
            })
          }).catch(() => {
          }).catch((err) => {
            store.dispatch('FedLogOut').then(() => {
              Message.error('登录状态超时，请重新登录')
              Message.error(err || '登录状态失效，请重新登录')
              next({ path: '/' })
            })
          })
        } else {
          console.log(33333)
          next()
          if (hasPermission(store.getters.roles, to.meta.roles)) {
            next()//
          } else {
            next({ path: '/401', replace: true, query: { noGoBack: true }})
          }
        }
      }
    } else {
      if (whiteList.indexOf(to.path) !== -1) {
        console.log(444444)
        next()
      } else {
        console.log(55555)
        next('/login')
        NProgress.done()
      }

src/router/index.js

@@ -53,15 +53,15 @@ export const constantRouterMap = [
    path: '',
    component: Layout,
    name: 'bridgesConsole',
    meta: {
      noCache: true
    },
    // meta: {
    //   noCache: true
    // },
    children: [
      {
        path: 'bridgeDetail',
        name: 'bridgeDetail',
        component: () => import('@/views/bridgesConsole/bridgeDetail/index'),
        meta: { noCache: true }
        component: () => import('@/views/bridgesConsole/bridgeDetail/index')
        // meta: { noCache: true }
      },
      {
        path: 'danger',
@@ -80,7 +80,7 @@ export const constantRouterMap = [
            path: 'dangerDetail',
            name: 'dangerDetail',
            component: () => import('@/views/bridgesConsole/bridgeDanger/dangerDetail'),
            meta: { title: '报警信息浏览', noCache: true }
            meta: { title: '报警信息浏览' }
          }
        ]
      },
@@ -91,7 +91,21 @@ export const constantRouterMap = [
        meta: { title: '历史监测信息查询', noCache: true }
      }
    ]
  },
  }
]
// 实例化vue的时候只挂载constantRouter
export default new Router({
  // mode: 'history', //后端支持可开
  scrollBehavior: () => ({ y: 0 }),
  routes: constantRouterMap
})
// 异步挂载的路由
// 动态需要根据权限加载的路由表
export const asyncRouterMap = [
  {
    path: '',
    component: Layout,
@@ -148,78 +162,7 @@ export const constantRouterMap = [
        meta: { title: '传感器配置', noCache: true }
      }
    ]
  }
]
// 实例化vue的时候只挂载constantRouter
export default new Router({
  // mode: 'history', //后端支持可开
  scrollBehavior: () => ({ y: 0 }),
  routes: constantRouterMap
})
// 异步挂载的路由
// 动态需要根据权限加载的路由表
export const asyncRouterMap = [
  // {
  //   path: '',
  //   component: Layout,
  //   name: 'peoplesManage',
  //   meta: {
  //     title: '用户系统管理',
  //     icon: 'peoples',
  //     roles: ['1'],
  //     noCache: true
  //   },
  //   alwaysShow: true,
  //   children: [
  //     {
  //       path: 'infoManage',
  //       name: 'infoManage',
  //       component: () => import('@/views/peoplesManage/infoManage/index'),
  //       meta: { title: '用户信息管理', noCache: true }
  //     }
  //   ]
  // },
  // {
  //   path: '',
  //   component: Layout,
  //   name: 'BaseInfoManage',
  //   meta: {
  //     title: '基础信息管理',
  //     icon: 'list',
  //     roles: ['1'],
  //     noCache: true
  //   },
  //   children: [
  //     {
  //       path: 'bridgesInfo',
  //       name: 'BridgesInfo',
  //       component: () => import('@/views/baseInfoManage/bridgesInfo/index'),
  //       meta: { title: '桥梁信息管理', noCache: true }
  //     },
  //     {
  //       path: 'serversConfig',
  //       name: 'ServersConfig',
  //       component: () => import('@/views/baseInfoManage/serversConfig/index'),
  //       meta: { title: '采集服务器配置', noCache: true }
  //     },
  //     {
  //       path: 'boxesConfig',
  //       name: 'BoxesConfig',
  //       component: () => import('@/views/baseInfoManage/boxesConfig/index'),
  //       meta: { title: '采集盒配置', noCache: true }
  //     },
  //     {
  //       path: 'sensorsConfig',
  //       name: 'SensorsConfig',
  //       component: () => import('@/views/baseInfoManage/sensorsConfig/index'),
  //       meta: { title: '传感器配置', noCache: true }
  //     }
  //   ]
  // },
  },
  { path: '*', redirect: '/404', hidden: true }
]

src/store/modules/user.js

@@ -1,5 +1,5 @@
import { login, logout, getInfo } from '@/api/login'
import { getSession, removeSession } from '@/utils/auth'
import { getCookiesName, setCookiesName, removeCookiesName } from '@/utils/auth'
const user = {
  state: {
@@ -8,7 +8,7 @@ const user = {
    name: '',
    roles: [],
    logins: '',
    session: getSession()
    session: getCookiesName()
  },
  mutations: {
    SET_ACCOUNT: (state, account) => {
@@ -47,6 +47,7 @@ const user = {
                commit('SET_USERID', dataS.id)
                commit('SET_ROLES', [dataS.type.toString()])
                commit('SET_NAME', dataS.name)
                setCookiesName(dataS.name)
              }
            }
          }
@@ -61,7 +62,6 @@ const user = {
    GetUserInfo({ commit, state }) {
      return new Promise((resolve, reject) => {
        getInfo().then(response => {
          commit('SET_LOGIN', response.success)
          if (response.success) {
            if (response.data) {
              const dataS = response.data
@@ -89,7 +89,7 @@ const user = {
          commit('SET_ROLES', [])
          commit('SET_NAME', '')
          commit('SET_SESSION', '')
          removeSession()
          removeCookiesName()
          resolve()
        }).catch(error => {
          reject(error)
@@ -101,7 +101,7 @@ const user = {
    FedLogOut({ commit }) {
      return new Promise(resolve => {
        commit('SET_SESSION', '')
        removeSession()
        removeCookiesName()
        resolve()
      })
    }

src/utils/auth.js

@@ -1,15 +1,13 @@
import store from '@/store'
import Cookies from 'js-cookie'
export function getSession() {
  return Cookies.get('JSESSIONID')
export function getCookiesName() {
  return Cookies.get('nameKey')
}
export function removeSession() {
  return Cookies.remove('JSESSIONID')
export function setCookiesName(name) {
  return Cookies.set('nameKey', name)
}
export function getIfLoginUser() {
  store.dispatch('GetUserInfo').then(res => { // 判断是否有登录用户
  })
export function removeCookiesName() {
  return Cookies.remove('nameKey')
}

src/views/dashboard/admin/index.vue

@@ -13,7 +13,7 @@ export default {
  },
  methods: {
    toPath() {
      this.$router.push({ path: '/infoManage' })
      this.$router.push({ name: 'infoManage' })
    }
  }
}

src/views/layout/components/TopNavbar.vue

@@ -1,13 +1,17 @@
<template>
  <el-menu class="topnavbar" mode="horizontal">
    <div class="logo-container">
      <img class="logo-wrapper" src="/static/touchwave.png" alt="">
      <el-dropdown v-if="roles.indexOf('1')<0" trigger="click" style="cursor: pointer;margin-left:20px">
      <div class="logo-wrapper">
        <img width="100%" src="/static/touchwave.png" alt="">
      </div>
      <el-dropdown v-if="roles.indexOf('1')<0" trigger="click" class="drop-menu">
        <span class="el-dropdown-link">
          {{showName}}<i class="el-icon-arrow-down el-icon--right"></i>
        </span>
        <el-dropdown-menu style="min-width:120px;" slot="dropdown">
          <el-dropdown-item v-for="item in dataList" :key="item.index"@click.native="goToDashboardC(item.id, item.shortName)">{{item.shortName}}</el-dropdown-item>
        <el-dropdown-menu class="drop-menu-list" style="min-width:120px;" slot="dropdown">
          <el-dropdown-item v-for="(item,index) in dataList" :key="item.index" :disabled="item.disab" @click.native="goToDashboardC(index, item.id, item.shortName)">{{item.shortName}}
            <i v-if="item.disab" class="el-icon-check"></i>
          </el-dropdown-item>
        </el-dropdown-menu>
      </el-dropdown>
    </div>
@@ -68,15 +72,23 @@ export default {
      }
      getBridgeList(param).then(res => {
        if (res.success) {
          for (let i = 0; i < res.data.data.length; i++) {
            if (res.data.data[i].id === this.bridgeId) {
              res.data.data[i].disab = true
            } else {
              res.data.data[i].disab = false
            }
          }
          this.dataList = res.data.data
        }
      })
    },
    goToDashboardC(id, name) {
    goToDashboardC(index, id, name) {
      this.$router.push({
        path: '/bridgeDetail',
        query: { id: id, name: name }
      })
      this.dataList[index].disab = true
      this.showName = name
    }
  }
@@ -98,9 +110,17 @@ export default {
    display: inline-block;
    position: absolute;
    left:10px;
    overflow: hidden;
    .logo-wrapper {
      float:left;
      width:260px;
      margin:14px 20px;
      margin:10px 12px;
    }
    .drop-menu{
      float:left;
      cursor: pointer;
      margin:0;
      margin-left:20px;
    }
  }
  .avatar-container {
@@ -126,5 +146,18 @@ export default {
    }
  }
}
.drop-menu-list{
  .el-dropdown-menu__item{
    display: flex;
    align-items: center;
    justify-content: space-between;
    &.is-disabled{
      background: #f3f5f7;
    }
    .el-icon-check{
      font-weight: bold;
    }
  }
}
</style>

src/views/login/index.vue

@@ -95,6 +95,7 @@ export default {
                this.$router.push({ path: '/' })
              } else {
                Message.error('登录账号与密码不匹配，请检查后重试')
                this.changeImgVc()
                return
              }
            } else {
@@ -114,6 +115,7 @@ export default {
              for (let i = 0; i < errorCode.length; i++) {
                if (response.code === errorCode[i].code) {
                  Message.error(errorCode[i].msg)
                  this.changeImgVc()
                  return
                }
              }