登录加载

src/components/PanThumb/index.vue

@@ -1,140 +0,0 @@
<template>
  <div class="pan-item" :style="{zIndex:zIndex,height:height,width:width}">
    <div class="pan-info">
      <div class="pan-info-roles-container">
        <slot></slot>
      </div>
    </div>
    <img class="pan-thumb" :src="image">
  </div>
</template>
<script>
export default {
  name: 'PanThumb',
  props: {
    image: {
      type: String,
      required: true
    },
    zIndex: {
      type: Number,
      default: 1
    },
    width: {
      type: String,
      default: '150px'
    },
    height: {
      type: String,
      default: '150px'
    }
  }
}
</script>
<style scoped>
.pan-item {
  width: 200px;
  height: 200px;
  border-radius: 50%;
  display: inline-block;
  position: relative;
  cursor: default;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}
.pan-info-roles-container {
  padding: 20px;
  text-align: center;
}
.pan-thumb {
  width: 100%;
  height: 100%;
  background-size: 100%;
  border-radius: 50%;
  overflow: hidden;
  position: absolute;
  transform-origin: 95% 40%;
  transition: all 0.3s ease-in-out;
}
.pan-thumb:after {
  content: '';
  width: 8px;
  height: 8px;
  position: absolute;
  border-radius: 50%;
  top: 40%;
  left: 95%;
  margin: -4px 0 0 -4px;
  background: radial-gradient(ellipse at center, rgba(14, 14, 14, 1) 0%, rgba(125, 126, 125, 1) 100%);
  box-shadow: 0 0 1px rgba(255, 255, 255, 0.9);
}
.pan-info {
  position: absolute;
  width: inherit;
  height: inherit;
  border-radius: 50%;
  overflow: hidden;
  box-shadow: inset 0 0 0 5px rgba(0, 0, 0, 0.05);
}
.pan-info h3 {
  color: #fff;
  text-transform: uppercase;
  position: relative;
  letter-spacing: 2px;
  font-size: 18px;
  margin: 0 60px;
  padding: 22px 0 0 0;
  height: 85px;
  font-family: 'Open Sans', Arial, sans-serif;
  text-shadow: 0 0 1px #fff, 0 1px 2px rgba(0, 0, 0, 0.3);
}
.pan-info p {
  color: #fff;
  padding: 10px 5px;
  font-style: italic;
  margin: 0 30px;
  font-size: 12px;
  border-top: 1px solid rgba(255, 255, 255, 0.5);
}
.pan-info p a {
  display: block;
  color: #333;
  width: 80px;
  height: 80px;
  background: rgba(255, 255, 255, 0.3);
  border-radius: 50%;
  color: #fff;
  font-style: normal;
  font-weight: 700;
  text-transform: uppercase;
  font-size: 9px;
  letter-spacing: 1px;
  padding-top: 24px;
  margin: 7px auto 0;
  font-family: 'Open Sans', Arial, sans-serif;
  opacity: 0;
  transition: transform 0.3s ease-in-out 0.2s, opacity 0.3s ease-in-out 0.2s, background 0.2s linear 0s;
  transform: translateX(60px) rotate(90deg);
}
.pan-info p a:hover {
  background: rgba(255, 255, 255, 0.5);
}
.pan-item:hover .pan-thumb {
  transform: rotate(-110deg);
}
.pan-item:hover .pan-info p a {
  opacity: 1;
  transform: translateX(0px) rotate(0deg);
}
</style>

src/permission.js

@@ -8,7 +8,7 @@ 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 (roles.indexOf('1') >= 0) return true
  if (!permissionRoles) return true
  return roles.some(role => permissionRoles.indexOf(role) >= 0)
}
@@ -37,10 +37,9 @@ router.beforeEach((to, from, next) => {
            })
          })
        } else {
          console.log(4444)
          if (hasPermission(store.getters.roles, to.meta.roles)) {
            next()//
          } else {
            next({ path: '/401', replace: true, query: { noGoBack: true }})
            next()
          }
        }
      }

src/styles/index.scss

@@ -6,6 +6,7 @@
body {
  height: 100%;
  min-width:600px;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;

src/views/404.vue

@@ -8,10 +8,10 @@
        <img class="pic-404__child right" :src="img_404_cloud" alt="404">
      </div>
      <div class="bullshit">
        <div class="bullshit__oops">OOPS!</div>
        <!-- <div class="bullshit__oops">OOPS!</div>
        <div class="bullshit__info">版权所有
          <a class='link-type' href='https://wallstreetcn.com' target='_blank'>华尔街见闻</a>
        </div>
        </div> -->
        <div class="bullshit__headline">{{ message }}</div>
        <div class="bullshit__info">请检查您输入的网址是否正确，请点击以下按钮返回主页或者发送错误报告</div>
        <a href="" class="bullshit__return-home">返回首页</a>
@@ -34,7 +34,7 @@ export default {
  },
  computed: {
    message() {
      return '网管说这个页面你不能进......'
      return '管理员说这个页面你不能进......'
    }
  }
}

src/views/dashboard/admin/index.vue

@@ -1,6 +1,6 @@
<template>
  <div class="dashboard-editor-container">
    超级管理员，欢迎您
    <p class="plat-tit">欢迎使用声脉桥梁云监控平台</p>
  </div>
</template>
@@ -9,24 +9,20 @@
export default {
  name: 'dashboard-admin',
  created() {
    this.toPath()
    // this.toPath()
  },
  methods: {
    toPath() {
      this.$router.push({ name: 'infoManage' })
    }
    // toPath() {
    //   this.$router.push({ name: 'infoManage' })
    // }
  }
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.dashboard-editor-container {
  padding: 32px;
  background-color: rgb(240, 242, 245);
  .chart-wrapper {
    background: #fff;
    padding: 16px 16px 0;
    margin-bottom: 32px;
  .plat-tit{
    font-size: 34px;
  }
}
</style>