gdy_qywx_pc/src/views/layout/components/Navbar.vue

<template>
  <div>
    <div class="nav_background">
      <div class="nav_width">
        <el-menu class="navbar topnavbar" mode="horizontal" text-color="white" active-text-color="white" :default-active="activeIndex" >
          <div class="logo float-left">
            <span class="company_name" @click="$router.push({ path: '/' })">{{site_info.name}}</span>
          </div>
            <el-menu-item v-for="(item,index) in menu" :key="index" :index="item.meta.title">
              <router-link  :to="{path: item.path }">{{item.meta.title}}</router-link>
            </el-menu-item>

          <div class="right-menu" style="color:#eee; cursor: pointer;">
            <span style="display: inline-block;margin-right:20px;" v-if="experience_data">
              <span style="color:#fff">切换角色</span>
              <el-select v-model="experiencevalue" placeholder="请选择" size="medium">
                <el-option
                  v-for="item in experienceoptions"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
                </el-option>
              </el-select>
            </span>
            <div class="right-menu" style="color:#eee; cursor: pointer;">
              <!-- <i class="el-icon-tickets"></i> -->
              <span class="PCtutorials" v-if="!this.$authoritys('dept_manager') && !this.$authoritys('employee')" @click="strategys">
                <el-popover
                  placement="bottom-start"
                  width="200"
                  trigger="manual"
                  v-model="tutorialsvisible">
                  <p>点击此图标可查看“使用帮助”</p>
                  <div style="text-align: right; margin: 0">
                    <el-button type="primary" size="mini" @click="tutorialsvisible = false">我知道了</el-button>
                  </div>
                  <svg-icon slot="reference" icon-class="PCtutorial" style="margin-bottom:8px;"/>
                </el-popover>
              </span>
              <userImage class="user_img" :id="profile.id" width="40px" height="40px" fontSize="14" :user_name="profile.name"
                :img_url="profile.img_url"></userImage>
              <!-- <el-dropdown @command="handleCommand">
                <span class="el-dropdown-link">
                  <userImage class="user_img" :id="profile.id" width="40px" height="40px" fontSize="14" :user_name="profile.name"
                    :img_url="profile.img_url"></userImage>
                </span>
                <el-dropdown-menu slot="dropdown">
                  切换公司或退出账号
                  <el-dropdown-item v-for="(group,index) in companyList" :key="index" :label="group.label" :divided="group.id == 1"
                    :class="{active:group.isSelect}" :command="group">
                    {{group.name}}<i v-if="group.isSelect" class="el-icon-check" style="margin-left: 10px;"></i>
                  </el-dropdown-item>
                </el-dropdown-menu>
              </el-dropdown> -->
            </div>
          </div>

        </el-menu>
      </div>
    </div>
    <!-- <el-dialog
      title="使用攻略"
      :visible.sync="usingTheStrategy"
      width="616px">
      <span style="color:#909399;font-size:14px">轻松5步，让你快速上手功道云</span>
      <div style="display:flex;flex-wrap:wrap;justify-content: space-between;">
        <div v-for="(item,index) in pushUsingTheStrategy" :key="index" class="strategyOfThe" @click="openPage(item.key)" style="">
          <p style="">
            <b style="">{{item.name}}</b><br>
            <span style="">{{item.value}}</span>
          </p>
        </div>
      </div>
    </el-dialog> -->
    
		<el-dialog title="设置向导" :visible.sync="usingTheStrategy" width="600px">
      <div v-for="(item,index) in routers_one" :key="index">
				<div class="wn-title fontColorF">{{item.name}}</div>
				<div class="flex-box flex-v-ce wn-box">
					<div v-for="(arr,att) in item.item" :key="att" class="flex-1 flex-box-v flex-v-ce"  @click="usingTheStrategy= false;$router.push({ path: arr.push })">
						<!-- <div><span class="iconfont " :class="arr.icon"></span></div> -->
						<div><svg-icon slot="reference" :icon-class="arr.icon" /></div>
						<div>{{arr.name}}</div>
					</div>
				</div>
			</div>
		</el-dialog>

  <!-- 老-导航 -->
    <!-- <el-dialog
      title="轻松四步落地积分+绩效管理体系"
      :visible.sync="usingTheStrategy"
      width="680px">
          <el-row :gutter="0" class="set_role_div" style="border-top:1px solid rgb(234 234 234);">
            <el-col :span="8" style="padding:20px 0 20px 0;">
              <el-menu default-active="0" class="el-menu-vertical-demo" style="border: none">
                <el-menu-item :index="index.toString()" v-for="(item,index) in activeName" :key="index" @click="open_right(item)" style="margin-bottom:20px;position: relative;height:40px;line-height:40px;">
                  <b style="display: inline-block;font-size:16px;text-align:center;">{{index+1}}&nbsp;&nbsp;</b>
                  <span slot="title">{{item.name}}</span>
                  <span v-if="index<activeName.length-1" style="width:1px;height:15px;border:1px solid rgb(224 224 224);position: absolute;bottom:-17px;left:23px;"></span>
                </el-menu-item>
              </el-menu>
            </el-col>
            <el-col :span="1" style="height:370px;border-right:1px solid rgb(234 234 234);">
            </el-col>
            <el-col :span="15" style="padding:20px 0 20px 0;">
              <div>
                <el-row>
                  <div style="text-align:center;margin-top:25px;color: #35353a;font-size:16px;">{{activeNameRig.name}}</div>
                  <div v-if="activeNameRig.code=='0'|| activeNameRig.code=='1'" :style="'display:flex;justify-content: space-around;margin:75px auto 0;width:'+usingwidth+'px;flex-wrap:wrap;'">
                    <div v-for="(item,index) in activeNameRig.item" :key="index" >
                      <div style="text-align:center;display:flex;">
                        <div @click="strategyClick(item.push)" style="cursor: pointer;">
                          <img :src="item.image" alt="" style="width:50px;">
                          <p style="margin:0;padding:0;padding-top:10px;">{{item.name}}</p>
                          <p style="margin:0;padding:0;font-size:13px;color:#2ba5ec;padding-top:8px;cursor: pointer;">{{item.conf}}</p>
                        </div>
                        <svg-icon icon-class="rightArrows" :style="'font-size:30px;margin-top:57px;margin-left:'+usingmarginL+'px;'" v-if="index<activeNameRig.item.length-1"/>
                      </div>
                    </div>
                  </div>
                  <div v-if="activeNameRig.code=='2' || activeNameRig.code=='3'" :style="'display:flex;justify-content: space-around;margin:20px auto 0;width:'+usingwidth+'px;flex-wrap:wrap;'">
                    <el-col :span="activeNameRig.code=='2'?14:24" style="display:flex;flex-wrap:wrap;justify-content: space-around;text-align:center;margin-left:20px;position: relative;">
                      <svg-icon icon-class="add" style="font-size:30px;position: absolute;top:45%;" />
                      <div v-for="(item,index) in activeNameRig.item" :key="index" style="width:49%;margin-top:20px;">
                          <div style="cursor: pointer;" v-if="index!=4" @click="strategyClick(item.push)">
                              <img :src="item.image" alt="" style="width:50px;">
                              <p style="margin:0;padding:0;padding-top:10px;">{{item.name}}</p>
                              <p style="margin:0;padding:0;font-size:13px;color:#2ba5ec;padding-top:8px;cursor: pointer;">{{item.conf}}</p>
                          </div>
                      </div>
                    </el-col>
                    <el-col :span="8"  v-if="activeNameRig.code=='2'">
                      <div v-for="(item,index) in activeNameRig.item" :key="index">
                            <div style="text-align:center;display:flex;margin-top:60px;" v-if="index==4">
                              <svg-icon icon-class="rightArrows" style="font-size:30px;margin-top:57px;" />
                              <div style="margin-left:25px;cursor: pointer;" @click="strategyClick(item.push)">
                                <img :src="item.image" alt="" style="width:50px;">
                                <p style="margin:0;padding:0;padding-top:10px;">{{item.name}}</p>
                                <p style="margin:0;padding:0;font-size:13px;color:#2ba5ec;padding-top:8px;cursor: pointer;">{{item.conf}}</p>
                              </div>
                            </div>
                      </div>
                    </el-col>
                  </div>
                </el-row>
              </div>
            </el-col>
          </el-row>
    </el-dialog> -->

    <el-dialog
      title="创建新企业"
      :visible.sync="StartAnewBusiness"
      width="30%"
      :before-close="handleClose">
      
      <el-form :model="rejectForm" ref="rejectForm" label-width="80px" v-loading="rejectLoading">
        <el-form-item label="企业名称" prop="StartAnewBusinessName"
          :rules="[
            { required: true, message: '请输入企业名称', trigger: 'blur' },
            {
              min: 3,
              max: 30,
              message: '长度在 3 到 30 个字符',
              trigger: 'blur'
            }
          ]"
        >
          <el-input
            type="textarea"
            placeholder="公司名/组织名称"
            v-model="rejectForm.StartAnewBusinessName"
            maxlength="30"
            show-word-limit
          >
          </el-input>
        </el-form-item>
        <el-form-item label="企业规模" prop="remark">
          <el-select v-model="rejectForm.StartAnewBusinessVal" placeholder="请选择">
            <el-option
              v-for="item in StartAnewBusinessPeople"
              :key="item.value"
              :label="item.label"
              :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button @click="adoptClose">取 消</el-button>
          <el-button type="primary" @click="StartAnewBuY('rejectForm')">创建完成</el-button>
        </el-form-item>
      </el-form>

    </el-dialog>

    
    <el-dialog
      title="完善个人信息"
      :visible.sync="amendMessage "
      width="500px"
		  :close-on-click-modal="false"
      :before-close="amendMessageClose">
      
      <el-form :model="changeInformation" ref="changeInformation" label-width="80px" style="margin-top:20px;" v-loading="amendMessageLoading">
        <el-form-item label="姓名" prop="name"
          :rules="[
            { required: true, message: '请填写真实姓名', trigger: 'blur' },
            {
              min: 0,
              max: 50,
              message: '长度不能大于 50 个字符',
              trigger: 'blur'
            }
          ]"
        >
          <el-input
            name="name"
            v-model="changeInformation.name"
            placeholder="请填写真实姓名"
            show-word-limit
          />
        </el-form-item>
          
        <el-form-item label="密码" prop="password"
          :rules="[
            { required: true, message: '请设置新密码(默认密码为手机号后六位)', trigger: 'blur' },
            {
              min: 6,
              max: 20,
              message: '长度在 6 到 20 个字符',
              trigger: 'blur'
            }
          ]">
          <el-input
            v-model="changeInformation.password"
            placeholder="请设置登录密码"
          />
        </el-form-item>

        <el-form-item>
          <div style="display: flex;justify-content: flex-end;margin:5px 10px 0 0">
            <!-- <el-button @click="adoptClose" style="margin-right:16px;">取 消</el-button> -->
            <el-button type="primary" @click="amendMessageAchieve('changeInformation')">完 成</el-button>
          </div>
        </el-form-item>
      </el-form>
    </el-dialog>
  </div>
</template>

<script>
  import qs from 'qs'
  import {
    mapGetters,
    mapState
  } from 'vuex'
  
  // import request from '@/utils/request'
  import request_user from '@/utils/request-user'
  import {
    setToken
  } from '@/utils/auth'
  export default {
    data() {
      let site_id = this.$store.getters.user_info.site_id
      // let companeyListMap = {}
      // companeyListMap[site_id.toString()] = ''
      return {
        routers_one: [
          {
            name: '三步轻松搭建积分管理体系：定人员、分责权、建制度',
            item: [
              {icon: 'employee_table_icon',name: '1、确定组织架构',push: '/employee_table'},
              {icon: 'set_role_icon',name: '2、分配角色权限',push: '/set_role'},
              {icon: 'rule_manage_icon',name: '3、建立积分规则',push: '/rule_manage'},
            ],
          },
          {
            name: '更有效地做好积分激励和认可，你还可以设置以下2项',
            item: [
              {icon: 'set_basics_icon',name: '基础设置',push: '/set_basics'},
              // {icon: '',name: '考勤积分',push: ''},
              {icon: 'fixed_integral_icon',name: '自动积分',push: '/fixed_integral'},
            ],
          }
        ],
        tutorialsvisible:false,
        usingmarginL:'26',
        usingwidth:'220',
        activeNameRig:{
          name:'员工积极参与，管理者权责分明',
          code:'0',
          item:[
            {image:'static/images/guild_dept_pic.png',name:'组织架构',conf:'去配置',push:'/employee_table'},
            {image:'static/images/role_manage.png',name:'角色权限',conf:'去配置',push:'/set_role'}
          ]
        },
        activeName: [{name:'完善部门人员信息及授权',code:'0',},{name:'建立积分奖扣制度',code:'1',},{name:'积分执行与实施',code:'2',},{name:'积分排名统计与分析',code:'3',}],
        rejectLoading:false,
        rejectForm:{
          StartAnewBusinessName:'',
          StartAnewBusinessVal:'1-10人',
        },
        StartAnewBusinessPeople: [{value:'1-10人',lable:0}, {value:'10-50人',lable:1}, {value:'50-200人',lable:2}, {value:'200-500人',lable:3}, {value:'500-1000人',lable:4}, {value:'1000人以上',lable:5}],
        StartAnewBusiness:false,
        experience_data:false,//是否体验账号
         experienceoptions: [{
          value: 1,
          label: '创始人'
        }, {
          value: 2,
          label: '管理员'
        }],
        experiencevalue: JSON.parse(localStorage.getItem("Experience_data"))?JSON.parse(localStorage.getItem("Experience_data")).name== "creator"?'创始人':'管理员':'',
        // deptManagerRoutersNav:false,
        usingTheStrategy:false,//使用攻略弹窗
        pushUsingTheStrategy:[//使用攻略数据
          {
            name:'第一步：完善企业与个人信息',
            value:'完善企业信息，做好使用第一步',
            key:1
          },
          {
            name:'第二步：完善基础设置',
            value:'在开始使用功道云前完善基础设置',
            key:2
          },
          {
            name:'第三步：完善组织架构',
            value:'建立部门再批量导入员工或逐个添加员工',
            key:3
          },
          {
            name:'第四步：完善积分规则',
            value:'积分规则类似于公司的规章制度',
            key:4
          },
          {
            name:'第五步：开始使用',
            value:'考勤用于日常打卡',
            key:5
          },
        ],
        // companyList: [],
        // companeyListMap: companeyListMap,
        totalScore: '',
        profile: this.$store.getters.user_info,
        company_info: {},
        cpmpanyId: this.$store.getters.user_info.site_id,
        firstId: 0,
        secrt_types: 0,
        manager_type: 4,
        secrt_type: [{
            id: 0,

            label: '新版'
          },
          {
            id: 1,

            label: '旧版'
          }
        ],
        rolelist: [{
            value: 0,
            label: '普通员工'
          },
          {
            value: 1,
            label: '部门管理者'
          },
          {
            value: 2,
            label: '公司管理员'
          },
          {
            value: 3,
            label: '积分专员'
          },
          {
            value: 4,
            label: '超级管理员'
          }
        ],
        concent: [{
          id: 2,
          name: '创建新企业'
        },{
          id: 1,
          name: '退出账号'
        }],
        logoImgUrl: 'static/images/logo.png',
        logoImgUrlMini: 'static/images/logo_icon.png',
        menu: [],
        activeIndex:'',//默认头部导航点击
        //权限
        dept_manager:false,//是否只是部门管理者
        creator:false,//是否是创始人
        user_infos:this.$store.getters.user_info.employee_detail.role_list,//当前登录账号的权限


        amendMessage:false,
        changeInformation : {
          password: '',
          name: ''
        },
        rawPassword:'',
        amendMessageLoading:false,
        authoritys:{},
      }
    },
    watch: {
      "$route"(val) {
         this.setDefaultRouter();
      },
      experiencevalue(val){
        this.experienceCompany(val)
      },
    },
    computed: {
      ...mapGetters(['sidebar', 'name', 'avatar']),
      ...mapState({
        site_info: state => state.user.site_info
      }),
    },
    created() {
      
      // let list = [0,1,1,1,0]
      // for(let i in list){
      //   debugger
      //   if(list[i] == 1){
      //     list.splice(i,1)
      //   }
      // }
      // console.log(list)


      // let arr = [{item:0},{item:1},{item:1},{item:1},{item:0}]
      // let list = [0,1,1,1,0]
      //现在我要删除等于1的
      // for(let i = 0 ; i < list.length ; i++){
      //   debugger
      //   if(list[i] == 1){
      //     list.splice(i,1)
      //     i--
      //   }
      // }
      // list.forEach((item,index)=>{
      //   debugger
      //   if(item == 1){
      //     list.splice(index,1)
      //     index--
      //   }
      // })
      // for(let i in list){
      //   debugger
      //   if(list[i] == 1){
      //     list.splice(i,1)
      //     i--
      //   }
      // }
      // console.log(list)
      console.log(this.$authoritys('employee'))
      if(JSON.parse(localStorage.getItem("amendMessage_none"))){
        if(this.$route.query.user){
          if(window.atob(this.$route.query.user).split(",").length>1){
            if(window.atob(this.$route.query.user).split(",")[1]){
              setTimeout(()=>{this.amendMessage = true},500)
              this.rawPassword = window.atob(this.$route.query.user).split(",")[1]
              this.changeInformation.password = window.atob(this.$route.query.user).split(",")[1]
            }
          }else{}
        }
        window.location.href = this.removeURLParameter(window.location.href,'user')
        localStorage.setItem('amendMessage_none',false)
      }else{
        localStorage.setItem('amendMessage_none',false)
      }


      // for(let i in this.user_infos){
      //   if(this.user_infos[i].name == "admin" || this.user_infos[i].name == "point_manager" || this.user_infos[i].name == "creator"){//是否只是部门管理者
      //     this.dept_manager = true
      //   }
      //   if(this.user_infos[i].name == "creator"){//是否是创始人
      //     this.creator = true
      //   }
      // }

      
      // console.log(this.$supremeAuthority())
      
      const addRouters = [];
      let mo_list = []
      let permission_list = []
      // 动态添加router路由
      for (let i in mo_list) {
        permission_list.push(mo_list[i].code)
      }
      // console.log(permission_list)
        // console.log(this.$store.getters.addRouters)
      for (const item in this.$store.getters.addRouters) {
        let obj = [];
        for (const ritem in this.$store.getters.addRouters[item].children) {
          // if (
          //   permission_list.indexOf(
          //     this.$store.getters.addRouters[item].children[ritem].name
          //   ) >= 0 ||
          //   this.$store.getters.addRouters[item].children[ritem].hidden ===
          //   true ||
          //   this.$store.getters.addRouters[item].children[ritem].common === true
          // ) {
          //   obj.push(this.$store.getters.addRouters[item].children[ritem]);
          // }
          obj.push(this.$store.getters.addRouters[item].children[ritem]);
        };
        // obj = this.filtration(obj)
        if (obj.length > 0) {
          const _R = this.$store.getters.addRouters[item];
          _R["children"] = obj;
          this.authoritys = _R
          this.returnRoutersArrs(this.authoritys)
          if(this.authoritys){
            addRouters.push(_R);
          }
        }
      }
      for(let i in addRouters){
        if(addRouters[i].redirect == '/award_punish'){
          if(this.$authoritys('employee')){
            addRouters[i].redirect = '/apply_list'
            addRouters[i].path = '/apply_list'
          }
        }
      }

      // if(this.creator){//是创始人权限，存localStorage在界面中隐藏或增加模块。VUEX有时会拿不到数据
      //     localStorage.setItem("creatorJurisdiction", true);
      // }else{
      //     localStorage.setItem("creatorJurisdiction", false);
      // }
      // if(this.dept_manager == false){//是部门管理者时，存localStorage在界面中隐藏或增加模块。VUEX有时会拿不到数据
        // let deptRouters = []
          // this.$store.getters.user_info.deptManagerRouters = false
          // localStorage.setItem("deptManagerRouters", false);
          // this.deptManagerRoutersNav = false
          // for(let i in addRouters){
          //   if(addRouters[i].redirect != '/attendance_classnew' && addRouters[i].redirect != '/employee_table'){//隐藏主要的根路由
          //       deptRouters.push(addRouters[i])
          //   }
          // }
          // this.menu = deptRouters;
      // }else{
        // localStorage.setItem("deptManagerRouters", true);
        // this.$store.getters.user_info.deptManagerRouters = true
        // this.deptManagerRoutersNav = true
        // this.menu = addRouters
      // }
      
        this.menu = addRouters

      this.$nextTick(() => {
        try {
          this.$refs.xiu.open("", "");
        } catch (e) {}
      });
    },
    mounted() {
      if(JSON.parse(localStorage.getItem("Experience_data"))){
        if(JSON.parse(localStorage.getItem("Experience_data")).if){
          if(JSON.parse(localStorage.getItem("ExperienceOne_none"))){
            setTimeout(()=>{
              this.usingTheStrategy = true
            },500)
          }
          localStorage.setItem('ExperienceOne_none',false)
        }
        this.experience_data = JSON.parse(localStorage.getItem("Experience_data")).if
      }
      this.setDefaultRouter();//设置默认路由样式
      // this.getUserScore()

      // this.$nextTick(() => {
      //   this.getCompany()
      // })
    },
    methods: {

      returnRoutersArrs(auth){//过滤路由
        // debugger
        let supAuthority = this.$supremeAuthority()
        if(auth.forEach){
          // auth.forEach((item,index)=>{
          //   if(item.meta.jurisdiction){
          //     if(item.meta.jurisdiction.indexOf(supAuthority)==-1){
          //       if(item.children){this.returnRoutersArrs(item.children)}
          //     }else{auth.splice(index,1,0)}
          //   }else{if(item.children){this.returnRoutersArrs(item.children)}}
          // })
          for(let i=0;i<auth.length;i++){//用普通for循环是因为循环内部会更改下标i
            if(auth[i].meta.jurisdiction){
              if(auth[i].meta.jurisdiction.indexOf(supAuthority)==-1){
                if(auth[i].children){this.returnRoutersArrs(auth[i].children)}
              }else{auth.splice(i,1);i--}
            }else{if(auth[i].children){this.returnRoutersArrs(auth[i].children)}}
          }
        }else{
          if(auth.meta.jurisdiction){
            if(auth.meta.jurisdiction.indexOf(supAuthority)==-1){
              if(auth.children){this.returnRoutersArrs(auth.children)}
              }else{this.authoritys = null}
          }else{if(auth.children){this.returnRoutersArrs(auth.children)}}
        }
      },

      // returnRoutersArr(str,bool){
      //   var routers = this.$router.options.routes[0].children;
      //   var routersArr=[];
      //   routers.forEach(item=>{
      //     if(item.meta.groupCode==str){
      //       routersArr.push(item);
      //     }
      //   })
      //   if(bool){
      //     return routersArr;
      //   }
      //   return this.routerAstrict(routersArr);
      // },

      removeURLParameter(url, parameter) {
        var urlparts = url.split('?');
        if(urlparts.length >= 2) {
          //参数名前缀
          var prefix = encodeURIComponent(parameter) + '=';
          var pars = urlparts[1].split(/[&;]/g);
          //循环查找匹配参数
          for(var i = pars.length; i-- > 0;) {
            if(pars[i].lastIndexOf(prefix, 0) !== -1) {
              //存在则删除
              pars.splice(i, 1);
            }
          }
          return urlparts[0] + (pars.length > 0 ? '?' + pars.join('&') : '');
        }
        return url;
      },
      strategys(){
        this.usingTheStrategy = true
        this.tutorialsvisible = false
      },
      amendMessageAchieve(formName){//修改信息确定
        this.$refs[formName].validate(valid => {
          if (valid) {
            this.amendMessageLoading = true
            this.performName()
          }
        })
      },
      performName(){
        this.$http_user({
          url: '/api/account/edit',
          method: 'post',
          data:{name:this.changeInformation.name}
        }).then((res)=>{
          if(res.data.code == 1){
            this.performPass()
          }
        }).catch(()=>{
          this.amendMessageLoading = false
        })
      },
      performPass(){
        let data = {
          old_password:this.rawPassword,
          password:this.changeInformation.password,
          password_confirmation:this.changeInformation.password,
        }
        this.$http_user({
          url: '/api/account/reset',
          method: 'post',
          data: data
        }).then((res)=>{
          if(res.data.code == 1){
            this.$message({
              message: '修改成功',
              type: 'success'
            });
            this.amendMessage = false
            setTimeout(()=>{
              this.tutorialsvisible = true
              this.amendMessageLoading = false
            },200)
          }
        }).catch(()=>{
          this.amendMessageLoading = false
        })
      },
      //关闭 修改个人信息 弹窗
      amendMessageClose(done) {
        done();
        this.tutorialsvisible = true
      },
      strategyClick(item){
        this.usingTheStrategy = false
        this.$router.push({ path: item })
      },
      open_right(item){
        if(item.code=='0'){
          this.usingmarginL = '26'
          this.usingwidth = '220'
          this.activeNameRig = {
            name:'员工积极参与，管理者权责分明',
            code:'0',
            item:[
              {image:'static/images/guild_dept_pic.png',name:'组织架构',conf:'去配置',push:'/employee_table'},
              {image:'static/images/role_manage.png',name:'角色权限',conf:'去配置',push:'/set_role'}
            ]
          }
        }else if(item.code=='1'){
          this.usingmarginL = '14'
          this.usingwidth = '300'
          this.activeNameRig = {
            name:'健全企业规章制度，建立公平的奖扣分体系',
            code:'1',
            item:[
              {image:'static/images/rule.png',name:'积分规则',conf:'去配置',push:'/rule_manage'},
              {image:'static/images/length_point.png',name:'基础设置',conf:'去配置',push:'/set_basics'},
              {image:'static/images/base_point.png',name:'自动积分',conf:'去配置',push:'/fixed_integral'},
            ]
          }
        }else if(item.code=='2'){
          this.usingwidth = '380'
          this.activeNameRig = {
            name:'员工积极挣分，管理者奖罚分明',
            code:'2',
            item:[
              {image:'static/images/entry_list.png',name:'奖分/扣分',conf:'去奖扣',push:'/award_punish'},
              {image:'static/images/my_publish.png',name:'任务',conf:'去发布',push:'/my_issue'},
              {image:'static/images/performance1.png',name:'绩效',conf:'去发布',push:'/team_performance'},
              {image:'static/images/attendance_application.png',name:'考勤  ',conf:'去配置',push:'/attendancenew'},
              {image:'static/images/att_review.png',name:'审批打分',conf:'去审批',push:'/approval_list'}
            ],
          }
        }else if(item.code=='3'){
          this.usingwidth = '380'
          this.activeNameRig = {
            name:'提高管理执行力，让优秀员工不吃亏',
            code:'3',
            item:[
              {image:'static/images/add_ticket.png',name:'积分排名',conf:'去查看',push:'/dept_rank'},
              {image:'static/images/role_manage.png',name:'管理者执行力',conf:'去查看',push:'/manager_statistics'},
              {image:'static/images/data_team.png',name:'部门分析',conf:'去查看',push:'/department_statistics'},
              {image:'static/images/length_point.png',name:'个人分析',conf:'去查看',push:'/individual_statistics'}
            ]
          }
        }
      },
      //-隐藏子路由 -
      filtration(obj){
        let data = []
        if(this.dept_manager == false){//只是部门管理者  
          data = this.filtra(obj,["balanceA"])//部门管理者 --隐藏-- A分权限
        }else if(this.creator){//创始人 - 
          data = this.filtra(obj,['apply_list','my_task','my_performance'])//创始人 --隐藏-- 我的申请、我的绩效、我的任务
        }else{
          data = obj
        }
        return data
      },
      filtra(obj,filtname){//待优化
        let child = []
        for(let n in filtname){
          for(let i in obj){
            if(obj[i].name!=filtname[n]){
              child.push(obj[i])
            }
          }
          for(let i in child){
            let datas = []
            for(let a in child[i].children){
              if(child[i].children[a].name != filtname[n]){
                datas.push(child[i].children[a])
              }
            }
            child[i].children = datas
          }
          obj = child
        }
        return Array.from(new Set(obj))
      },


      //攻略跳转
      // openPage(index) {
      //   this.usingTheStrategy = false
      //   switch (index) {
      //     case 1:
      //       this.$router.push({
      //         path: '/company_info'
      //       })
      //       break;
      //     case 2:
      //       this.$router.push({
      //         path: '/set_basics'
      //       })
      //       break;
      //     case 3:
      //       this.$router.push({
      //         path: '/employee_table'
      //       })
      //       break;
      //     case 4:
      //       this.$router.push({
      //         path: '/rule_manage'
      //       })
      //       break;
      //     case 5:
      //       this.$router.push({
      //         path: '/attendance_classnew'
      //       })
      //       break;
      //   }
      // },
      // traverse(obj){
      //     for (var a in obj) {
      //       if (obj[a].children) {
      //         this.traverse(obj[a].children); //递归遍历
      //       } else {
      //         if(obj[a].name == 'apply_list'){
      //           obj[a].meta.noCache=false
      //           obj[a].meta.show=false
      //           console.log(obj[a])
      //         }
      //       }
      //     }
      // },
      setDefaultRouter(){
        var routerTitle=this.$route.meta.title;
        var routerMatched=this.$route.matched;
        if(routerTitle=="首页"||routerTitle=="工作台"||routerTitle=="考勤"||routerTitle=="统计"||routerTitle=="设置"){
          this.activeIndex=routerTitle;
        }else{
          this.activeIndex=routerMatched[0].meta.title
        }
      },
      handleCommand(item) {
        if (item.id !== 1 && item.id !== 2 && !item.isSelect) {
          this.cpmpanyId = item.id
          this.checkCompany()
        }else if(item.id == 1 && item.name == "退出账号"){
          this.logout()
        }else if(item.id == 2 && item.name == "创建新企业"){
         this.rejectForm = {
          StartAnewBusinessName:'',
          StartAnewBusinessVal:'1-10人',
         }
          this.StartAnewBusiness = true
        }
      },
      wacthCourse() {
        if (this.cpmpanyId == 0 || this.cpmpanyId == 1) {} else {
          this.firstId = this.cpmpanyId;
        }

        if (this.cpmpanyId == 0) {
          this.cpmpanyId = this.firstId;

          this.returnBack()
        } else if (this.cpmpanyId == 1) {
          this.cpmpanyId = this.firstId;

          this.logout()
        } else {
          this.checkCompany();
        }
      },
      returnBack() {
        if (this.manager_type == 4) {
          window.open("https://www.kancloud.cn/jian-18/mw-th/908166", '_blank')
        } else if (this.manager_type == 2 || this.manager_type == 3) {
          window.open("https://www.kancloud.cn/jian-18/mw-th2/891065", '_blank')
        } else if (this.manager_type == 1) {
          window.open("https://www.kancloud.cn/jian-18/mw-th5/892680", '_blank')
        } else if (this.manager_type == 0) {
          window.open("https://www.kancloud.cn/jian-18/mw-th4/892587", '_blank')
        }
      },
      // 切换体验角色
      experienceCompany(item) {
        let self = this
        let num = 112
        let jurisdiction = "creator"
        if(item==1){
          jurisdiction = "creator"
        }else{
          jurisdiction = 'dept_manager'
        }
        request_user({
          url: '/api/try/employees',
          method: 'get',
          params: {site_id: num}
        }).then((res) => {
          if (res.data.code == 1) {
            if (res.data.code == 1) {
              let login_index = ''
              for(let i in res.data.data){
                let role_list = res.data.data[i].role_list
                for (let j in role_list) {
                  if (jurisdiction == role_list[j].name) {
                    login_index = i
                  }
                }
              }
              if (login_index != '') {
                setToken(res.data.data[login_index].token)
                if(jurisdiction == 'dept_manager'){
                  localStorage.setItem('ExperienceOne_none',false)
                }else{
                  localStorage.setItem('ExperienceOne_none',true)
                }
                localStorage.setItem('Experience_data',JSON.stringify({if:true,name:jurisdiction}))
                self.$store.commit('SET_TOKEN', res.data.data[login_index].token)
                // localStorage.setItem('site_list_temp', JSON.stringify(data.data.account_site))
              }
              self.$router.push({path: '/'})
              localStorage.removeItem('SET_EMPLOYEE_MAP')
              localStorage.removeItem('site_info')
              localStorage.removeItem('dept_tree')
              sessionStorage.removeItem('current_time');
              window.location.reload()
            } else {
              self.$message.error(res.data.data.msg)
            }
          }
        })
      },
      StartAnewBuY(formName){
        this.$refs[formName].validate(valid => {
          if (valid) {
            // let params = {
            //   name:this.rejectForm.StartAnewBusinessName,
            //   scale:this.rejectForm.StartAnewBusinessVal,
            //   industry: '互联网',
            //   tel: '',
            //   employee_name: ''
            // }
            // request_user('post','/api/site/create',params,).then((res)=>{
            request_user({
              url: '/api/site/create',
              method: 'post',
              data: {
                name:this.rejectForm.StartAnewBusinessName,
                scale:this.rejectForm.StartAnewBusinessVal,
                industry: '互联网',
                tel: '',
                employee_name: ''
              },
            }).then((res)=>{
                this.cpmpanyId = res.data.data.id
                this.checkCompany()
                localStorage.setItem('Experience_data',JSON.stringify({if:false,name:''}))
            }).finally(()=>{
              this.StartAnewBusiness = false
            })
          }
        })

      },
      adoptClose(){
        this.StartAnewBusiness = false,
        setTimeout(()=>{
         this.rejectForm = {
          StartAnewBusinessName:'',
          StartAnewBusinessVal:'1-10人',
         }
        },200)
      },
      //关闭 创建新企业 弹窗
      handleClose(done) {
        done();
        this.rejectForm = {
          StartAnewBusinessName:'',
          StartAnewBusinessVal:'1-10人',
        }
      },
      // 切换公司
      checkCompany() {
        let self = this
        request_user({
          url: '/api/employee-login',
          method: 'post',
          data: {
            site_id: this.cpmpanyId
          }
        }).then((res) => {
          if (res.data.code == 1) {
            setToken(res.data.data.token)
            // let manager = res.data.data.user.employee_detail.role_list.findIndex((item) => {
            //   return item.name == "creator" || item.name == "admin" || item.name == "point_manager" || item.name == "dept_manager"
            // })
            // if (parseInt(manager) < 0) {
            //   self.$confirm('电脑版暂未开放【员工】的使用，请使用功道云APP', '提示', {
            //     confirmButtonText: '确定',
            //     type: 'warning'
            //   }).then(() => {
            //     self.logout()
            //   }).catch(() => {
            //     self.logout()
            //   });
            // } else {
              self.$router.push({
                path: '/'
              })
              self.$store.commit('SET_TOKEN', res.data.data.token)
              localStorage.removeItem('overdueToken');
              localStorage.removeItem('SET_EMPLOYEE_MAP')
              localStorage.removeItem('site_info')
              localStorage.removeItem('dept_tree')
              sessionStorage.removeItem('current_time');
              window.location.reload()
            // }
          } else {
            self.$message.error(res.data.data.msg)
          }
        })
      },
      // 获取公司列表
      // getCompany() {
      //   let self = this;
      //   request_user({
      //     url: '/api/account/site',
      //     method: 'get'
      //   }).then(res => {
      //     if (res.data.code == 1) {
      //       let site_list = []
      //       let site_map = {}
      //       if(res.data.data.list && res.data.data.list.length == 0){
      //           self.companyList = [...this.concent];
      //       }else{
      //         for (let i in res.data.data) {
      //           site_list.push({
      //             id: res.data.data[i].site.id,
      //             name: res.data.data[i].site.name,
      //             isSelect: res.data.data[i].site.id == this.site_info.id ? true : false
      //           })
      //           site_map[res.data.data[i].site.id] = res.data.data[i].site.name
      //         }
      //         self.companeyListMap = site_map;
      //         self.$nextTick(() => {
      //           self.companyList = [...site_list, ...this.concent];
      //           if(site_list.length == 0){
      //             self.companyList = [...this.concent];
      //           }
      //           self.cpmpanyId = self.profile.site_id
      //           self.firstId = self.cpmpanyId
      //         })
      //       }
      //     }
      //   })
      // },
      changerole() {
        const self = this
        this.$http('get','/integral.php/ajax_request_common/get_user_by_role.html?type=' + this.manager_type).then(ret => {
            if (ret.status == 200) {
              self.$router.replace({name: 'dashboard'})
              if (ret.data.code == 1) {
                setTimeout(() => {
                  window.location.reload()
                }, 20)
              } else {
                self.$message.error('切换失败')
              }
            }
          })
      },
      toggleSideBar() {
        this.$store.dispatch('toggleSideBar')
      },
      logout() {
        const self = this
        self.$http_user({
          url: '/api/logout',
          method: 'post',
        }).then((res) => {
          if (res.data.code == 1 || res.data.code == 999) {
            // 清除缓存在localStorage的相关数据
            localStorage.removeItem('ExperienceOne_none')
            localStorage.removeItem('Experience_data')
            localStorage.removeItem('SET_EMPLOYEE_MAP')
            localStorage.removeItem('site_list_temp')
            localStorage.removeItem('site_info')
            localStorage.removeItem('dept_tree')
            localStorage.removeItem('user_token_temp')
            self.$store.dispatch('LogOut');
            sessionStorage.removeItem('current_time');
          }
        }).catch((e) => {
          self.$message.error(e.data.msg)
        }).finally(() => {
          self.loading = false
        })
      },
      getUserScore() {
        return
        this.$http('get','/integral.php/point_data/get_point_by_employee')
          .then(res => {
            if (res.status === 200) {
              if (res.data.code === 1) {
                this.totalScore = res.data.data.sum
              } else {
                this.$message.error('积分获取失败')
              }
            }
          })
      }
    }
  }
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
  /deep/ .el-dialog__body{
    padding:10px 20px 30px;
  }
  .routerActive {
    background-color: #199afb !important;
  }

  .active {
    color: #26A2FF;
    background-color: rgba(38, 162, 255, 0.1);
  }

  .totalScore {
    padding-left: 25px;
    background: url('static/images/totalScore.png') no-repeat left center;
    background-size: 18px 17px;
  }

  .course {
    padding-left: 25px;
    background: url('static/images/book.png') no-repeat left center;
    background-size: 20px 18px;
  }

  .navbar {
    height: 60px;
    line-height: 60px;
    border-radius: 0px !important;

    .hamburger-container {
      line-height: 68px;
      height: 60px;
      float: left;
      padding: 0 0px 0 20px;
    }

    .commit-comment-btn {
      display: inline-block;
      padding-left: 30px;
      background-image: url(static/images/comment.png);
      background-repeat: no-repeat;
      background-position: left center;
      color: #fff;
      margin-right: 30px;
    }

    .logout-btn {
      display: inline-block;
      padding-left: 30px;
      background-image: url(static/images/logout.png);
      background-repeat: no-repeat;
      background-position: left center;
      color: #fff;
      margin-right: 30px;
    }

    .breadcrumb-container {
      float: left;
    }

    .errLog-container {
      display: inline-block;
      vertical-align: top;
    }

    .right-menu {
      float: right;
      height: 100%;
      display:flex;
      align-items: center;

      &:focus {
        outline: none;
      }

      .right-menu-item {
        display: inline-block;
        margin: 0 8px;
      }

      .screenfull {
        height: 20px;
      }

      .international {
        vertical-align: top;
      }

      .theme-switch {
        vertical-align: 15px;
      }

      .avatar-container {
        height: 60px;
        margin-right: 30px;

        .avatar-wrapper {
          cursor: pointer;
          margin-top: 5px;
          position: relative;

          .user-avatar {
            width: 40px;
            height: 40px;
            border-radius: 10px;
          }

          .el-icon-caret-bottom {
            position: absolute;
            right: -20px;
            top: 25px;
            font-size: 12px;
          }
        }
      }
    }
  }

  .float-left {
    float: left;
  }

  .topnavbar {
    background-color: #26A2FF;
    border-bottom: 0;
  }

  .logout-btn:hover {
    color: #f1f1f1;
  }

  .commit-comment-btn:hover {
    color: #f1f1f1;
  }

  .demotip {
    color: #fff;
  }

  .demotip a {
    color: #eab81e;
  }

  .demotip a:hover {
    color: #F6FF00;
  }

  .nav_background {
    background-color: #26A2FF;
    border-bottom: solid 1px #e6e6e6;
    z-index: 1000;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
  }

  .nav_width {
    width: 1200px;
    margin: 0 auto;
    .el-menu-item a{
      font-size:18px;
      font-weight:bold;
    }
    .is-active{
       background:#2785c7c9 !important;
    }
    .is-active a{
      font-size:18px;
      font-weight:bold;
    }
    // .el-menu-item:hover{
    //   background-color:#199afb !important;
    // }
    // .el-menu-item:active a{
    //   font-weight:bold;
    //   background-color:#199afb !important;
    // }
  }

  .changeRole .el-icon-arrow-up:before {
    content: "123";
    width: 12px;
    height: 12px;
    background: url(static/images/angle.png) no-repeat center;
    background-size: 12px;
    color: rgba(0, 0, 0, 0)
  }

  .logo {
    margin-right: 20px;
    max-width: 400px;
    min-width: 200px;
    background-repeat: no-repeat;
    background-position: center;
    display: flex;
    color: #fff;

    .company_img {
      height: 100%;
      cursor: pointer;
    }

    .company_name {
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
      // padding-left: 10px;
      font-size: 20px;
    }
  }

  .user_img {
    display: inline-block;
    vertical-align: sub;
    padding: 0 5px;
    padding-top: 11px;
    height: 100%;
    /deep/ img{
      // border: 1px #fff solid;
    }
    /deep/ .user_img_bg{
      border: 1px #fff solid;
    }
  }

  .el-menu-item {
    padding: 0;

    a {
      padding: 0 20px;
      display: inline-block;
    }
  }

  #dropdown-menu-3459 {
    li {
      color: #606266;
    }

    li:hover {
      font-weight: bold;
      background: none;
    }
  }
  .el-dropdown{
    height: 100%;
  }

  .company_name{
    cursor:pointer
  }

  .PCtutorials{
    height:40px;
    width:40px;
    display: inline-block;
    border-radius:50%;
    text-align:center;
    // margin-bottom:10px;
    margin-right:7px;
    font-size: 20px;
    -webkit-transition: all .3s; 
    -moz-transition: all .3s; 
    -ms-transition: all .3s; 
    -o-transition: all .3s; 
    transition: all .3s;
  }
  .PCtutorials:hover{
    background-color:#50b3ff;
  }


  .strategyOfThe{
    width:274px;
    height:91px;
    border:1px solid #DCDFE6;
    margin-top:20px;
    cursor:pointer;
    -webkit-transition: all .3s; 
    -moz-transition: all .3s; 
    -ms-transition: all .3s; 
    -o-transition: all .3s; 
    transition: all .3s;
    p{
      margin:20px 0 0 20px;
      b{
        color:#303133;
        font-size:16px;
        transition: all .3s;
      }
      span{
        color:#aaacb1;
        font-size:12px;
        padding-top:12px;
        display: inline-block;
        transition: all .3s;
      }
    }
  }
  .strategyOfThe:hover{
    border:1px solid #73c1fc;
    background-color: #fcfcfc;
    box-shadow:1px 1px 5px #c1e4ff;
    p{
      b{
        color: #58b7ff;
      };
      span{
        color:rgb(98, 104, 121);
      }
    }
  }
  
  /deep/ .el-dialog__title{
    padding-left:8px;
    border-left:2px solid #3caaff;
  }
  
  .fontColorF {
    color: #606266;
  }
  
.wn-box{
	padding: 20px 0;
}
.wn-box .flex-1{
	cursor: pointer;
}
.wn-box .flex-1 div:nth-child(1){
	width: 55px;
	height: 55px;
	border-radius: 50%;
	text-align: center;
	line-height: 55px;
	background-color: #E0F2FF;
	color: #26A2FF;
	margin-bottom: 20px;
}
.wn-box .flex-1 div:nth-child(2){
	width: 140px;
	border-radius: 25px;
	border: 1px solid #26A2FF;
	padding:7px 10px;
	text-align: center;
	color: #26A2FF;
}
.wn-box .flex-1:hover div:nth-child(1){
	color: #fff;
	background-color: #26A2FF;
}

.wn-box .flex-1:hover div:nth-child(2){
	color: #fff;
	background-color: #26A2FF;
}
.wn-box .svg-icon{
  font-size: 22px;
  margin-top: 16px;
}
</style>