|
|
@@ -1,33 +1,15 @@
|
|
|
<template>
|
|
|
<div class="index-nav" :class="{'index-nav-top':isActive}">
|
|
|
<nav class="side-navigator-wrap">
|
|
|
- <div class="nav-item-wrap">
|
|
|
- <div class="nav-item-content" :class="{ active: employeeDynamics }">
|
|
|
- <router-link to="/home/employeeDynamics" class="nav-item">
|
|
|
- <i class="el-icon-s-home"></i>
|
|
|
- <span class="nav-item-text">首页</span>
|
|
|
- </router-link>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- <div class="nav-item-wrap">
|
|
|
- <div class="nav-item-content" :class="{ active: pointsMall }">
|
|
|
- <router-link to="/home/pointsMall" class="nav-item">
|
|
|
- <i class="el-icon-s-home"></i>
|
|
|
- <span class="nav-item-text">积分商城</span>
|
|
|
- </router-link>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="nav-item-wrap">
|
|
|
- <div class="nav-item-content" :class="{ active: festiveEvents }">
|
|
|
- <router-link to="/home/festiveEvents" class="nav-item">
|
|
|
+ <div v-for="(item,index) in sideBarList" :key="index" class="nav-item-wrap">
|
|
|
+ <div class="nav-item-content" :class="{ active: item.checked }">
|
|
|
+ <router-link :to="item.path" class="nav-item">
|
|
|
<i class="el-icon-s-home"></i>
|
|
|
- <span class="nav-item-text">福利领取</span>
|
|
|
+ <span class="nav-item-text">{{ item.name }}</span>
|
|
|
</router-link>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
-
|
|
|
- </nav>
|
|
|
+ </nav>
|
|
|
</div>
|
|
|
|
|
|
</template>
|
|
|
@@ -36,8 +18,35 @@ export default {
|
|
|
name: 'AppSidebar',
|
|
|
data() {
|
|
|
return {
|
|
|
+ sideBarList:[
|
|
|
+ {
|
|
|
+ value:'employeeDynamics',
|
|
|
+ name:'首页',
|
|
|
+ path:'/home/employeeDynamics',
|
|
|
+ checked:false,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value:'pointsMall',
|
|
|
+ name:'积分商城',
|
|
|
+ path:'/home/pointsMall',
|
|
|
+ checked:false,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value:'welfareList',
|
|
|
+ name:'福利领取',
|
|
|
+ path:'/home/welfareList',
|
|
|
+ checked:false,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value:'festiveEvents',
|
|
|
+ name:'个人中心',
|
|
|
+ path:'/home/festiveEvents',
|
|
|
+ checked:false,
|
|
|
+ }
|
|
|
+ ],
|
|
|
employeeDynamics: false,
|
|
|
pointsMall: false,
|
|
|
+ welfareList: false,
|
|
|
festiveEvents: false,
|
|
|
scrollTop: 0,
|
|
|
isActive:false,
|
|
|
@@ -46,24 +55,13 @@ export default {
|
|
|
methods:{
|
|
|
getRoute(){
|
|
|
var path = this.$route.path;
|
|
|
-
|
|
|
- if(path.indexOf("pointsMall") != -1){
|
|
|
- this.employeeDynamics = false;
|
|
|
- this.pointsMall = true;
|
|
|
- this.festiveEvents = false;
|
|
|
- }
|
|
|
-
|
|
|
- if(path.indexOf("employeeDynamics") != -1){
|
|
|
- this.employeeDynamics = true;
|
|
|
- this.pointsMall = false;
|
|
|
- this.festiveEvents = false;
|
|
|
- }
|
|
|
-
|
|
|
- if(path.indexOf("festiveEvents") != -1){
|
|
|
- this.employeeDynamics = false;
|
|
|
- this.pointsMall = false;
|
|
|
- this.festiveEvents = true;
|
|
|
- }
|
|
|
+ this.sideBarList.forEach(item => {
|
|
|
+ if(path.indexOf(item.value) != -1){
|
|
|
+ item.checked = true;
|
|
|
+ } else{
|
|
|
+ item.checked = false;
|
|
|
+ }
|
|
|
+ });
|
|
|
},
|
|
|
// 保存滚动值,这是兼容的写法
|
|
|
handleScroll () {
|