<template>
    <div class="leftSideTitle sidebar-wrapper">
      <el-scrollbar style="height:100%">
    <el-menu
      router
      :collapse="collapse"
      :default-active="onRoutes"
      class="el-menu-vertical-demo"
      unique-opened
    >
      <el-menu-item index="/home" v-if="menuList.home135||menuList.home136">
        <i class="el-icon-s-home"></i>
        <span>首页</span>
      </el-menu-item>

      <!-- <el-menu-item index="/data">
        <i class="el-icon-s-data"></i>
        <span>企业大数据</span>
      </el-menu-item> -->

      <el-menu-item index="project" v-if="menuList.Project55">
        <i class="el-icon-s-grid"></i>
        <span>项目管理</span>
      </el-menu-item>
      <el-submenu index="1" v-if="menuList.Maintenance63">
        <template slot="title">
          <i class="el-icon-menu"></i>
          <span>维保管理</span>
          
        </template>
        <el-menu-item index="LiftMaintenancePlan" v-if="Maintenance.Maintenance64">维保计划</el-menu-item>
        <el-menu-item index="Maintenance" v-if="Maintenance.Maintenance71">日常保养</el-menu-item>
        <!-- <el-menu-item index="StopMaintenancePlan">停保管理</el-menu-item> -->
      </el-submenu>
      
      <el-submenu index="2" v-if="menuList.EmergencyRepair104">
        <template slot="title">
          <i class="el-icon-brush"></i>
          <span>急修管理</span>
          
        </template>
        <el-menu-item v-if="EmergencyRepair.EmergencyRepair105" index="Emergency" :route="{path:'/Emergency'}">急修派工</el-menu-item>
        <el-menu-item v-if="EmergencyRepair.EmergencyRepair106" index="UrgentRepair">急修中</el-menu-item>
        <el-menu-item  index="Repair" v-if="EmergencyRepair.EmergencyRepair109">急修记录</el-menu-item>
        
      </el-submenu>
    
      <el-menu-item index="CapitalRepair"  v-if="menuList.CapitalRepair134">
        <i class="el-icon-s-grid"></i>
        <span>大修管理</span>
      </el-menu-item>

      <el-submenu index="6" v-if="menuList.Lift77">
        <template slot="title">
          <i class="el-icon-menu"></i>
          <span>电梯管理</span>
          
        </template>
        <!-- <el-menu-item index="Lift">物联设备</el-menu-item> -->
        <el-menu-item index="Lift">电梯档案</el-menu-item>
      </el-submenu>
      <el-menu-item index="Inspection" v-if="menuList.Inspection118">
        <i class="el-icon-finished"></i>
        <span>年检管理</span>
      </el-menu-item>
      
       <el-submenu index="contractManagement" v-if="menuList.Contract87">
        <template slot="title">
          <i class="el-icon-s-cooperation"></i>
          <span>合同管理</span>
        </template>
        <el-menu-item index="contractManagement" v-if="Contract.Contract88">合同管理</el-menu-item>
        <el-menu-item index="collect" v-if="Contract.Contract94">收款管理</el-menu-item>
      </el-submenu>



      <el-submenu index="3" v-if="menuList.office123">
        <template slot="title">
          <i class="el-icon-s-goods"></i>
          <span>办公OA</span>
          
        </template> 
        <el-menu-item index="Liftcertificate" v-if="office.office124">操作证管理</el-menu-item>
        <el-menu-item index="Attendance" v-if="office.office129">签到管理</el-menu-item>
        <el-menu-item index="Announcement"  v-if="office.office131">公司公告</el-menu-item>
       
      </el-submenu>
      <el-submenu index="4" v-if="menuList.Enterprise6">
        <template slot="title">
          <i class="el-icon-s-tools"></i>
          <span>企业设置</span> 
        </template>
        <el-menu-item index="Userapplication" v-if="Enterprise.Enterprise7||Enterprise.Enterprise11">申请管理</el-menu-item>
        <el-menu-item index="MTCompanyUserPower" v-if="Enterprise.Enterprise14">成员管理</el-menu-item>
        <el-menu-item index="Region" v-if="Enterprise.Enterprise22">区域设置</el-menu-item>
        <el-menu-item index="MTCompanyUser" v-if="Enterprise.Enterprise26">组织管理</el-menu-item>
        <el-menu-item index="Global" v-if="Enterprise.Enterprise28">全局设置</el-menu-item>
        <el-menu-item index="Members" v-if="Enterprise.Enterprise19">角色管理</el-menu-item>
        <el-menu-item index="MOptionCustom" v-if="Enterprise.Enterprise30">保养单增项</el-menu-item>
      </el-submenu>
      <el-menu-item index="property" v-if="menuList.property34">
        <i class="el-icon-user-solid"></i>
        <span>客户管理</span>
      </el-menu-item>
      <el-menu-item index="user" v-if="menuList.user1">
        <i class="el-icon-s-custom"></i>
        <span>用户管理</span>
      </el-menu-item>

      <el-menu-item index="CommonProblem" v-if="menuList.CommonProblem41">
        <i class="el-icon-question"></i>
        <span>常见问题</span>
      </el-menu-item>

      <el-menu-item index="NewList" v-if="menuList.NewList49">
        <i class="el-icon-s-comment"></i>
        <span>新闻公告</span>
      </el-menu-item>
      <!---------------------------- we ----------------------------------->
      <el-menu-item index="/monitoring-center/index" v-if="menuList.monitoringCenter">
          <template slot="title">
              <i class="iconfont iconjiankongzhongxin"></i>
              <span class="sClass">监控中心</span>
          </template>
      </el-menu-item>
                <el-submenu index="/data-bank/index" v-if="menuList.dataBank">
                    <template slot="title">
                        <i class="iconfont iconziliaoku"></i>
                        <span class="sClass">资料库</span>
                    </template>
                    <el-menu-item index="/data-bank/index">官方文件管理</el-menu-item>
                    <el-menu-item index="/brand/index">品牌管理</el-menu-item>
                    <el-menu-item index="/data-bank/classify">资料分类拓展</el-menu-item>
                    <el-menu-item index="/data-bank/accessory">资料附件管理</el-menu-item>
                    <el-menu-item index="/data-bank/code">故障代码管理</el-menu-item>
                    <el-menu-item index="/data-bank/operation">操作系统管理</el-menu-item>
                    <el-menu-item index="/data-bank/operation-accessory">操作系统附件管理</el-menu-item>
                </el-submenu>

                <el-submenu index="/school/index" v-if="menuList.school">
                    <template slot="title">
                        <i class="iconfont iconpost_video"></i>
                        <span class="sClass">学堂管理</span>
                    </template>
                    <el-menu-item index="/school/index">视频管理</el-menu-item>
                    <el-menu-item index="/school/video-approve">视频审批</el-menu-item>
                </el-submenu>

                <el-submenu index="/recruitment/index" v-if="menuList.recruitment">
                    <template slot="title">
                        <i class="iconfont iconqidongzhaopinshenpi"></i>
                        <span class="sClass">招聘管理</span>
                    </template>
                    <el-menu-item index="/recruitment/index">招聘管理</el-menu-item>
                    <el-menu-item index="/recruitment/recruitment-approval">招聘审核</el-menu-item>
                    <el-menu-item index="/recruitment/recruitment-application">求职信息管理</el-menu-item>
                </el-submenu>
                <el-submenu index="/template-library" v-if="menuList.templateLibrary">
                    <template slot="title">
                        <i class="iconfont iconmobanguanli"></i>
                        <span class="sClass">模板库</span>
                    </template>
                    <el-menu-item index="/template-library/maintenance">维保项管理</el-menu-item>
                    <el-menu-item index="/template-library/template">系统模板管理</el-menu-item>
                    <el-menu-item index="/template-library/enterprise">企业模板管理</el-menu-item>
                </el-submenu>
                <el-menu-item index="/state-bank/index" v-if="menuList.state">
                    <template slot="title">
                        <i class="iconfont iconyijianfankui"></i>
                        <span class="sClass">申诉管理</span>
                    </template>
                </el-menu-item>
                <el-submenu index="/question-bank" v-if="menuList.question">
                    <template slot="title">
                        <i class="iconfont icontikuguanli"></i>
                        <span class="sClass">题库管理</span>
                    </template>
                    <el-menu-item index="/question-bank/index">题库管理</el-menu-item>
                    <el-menu-item index="/question-bank/approval">题库审批</el-menu-item>
                </el-submenu>
                <el-menu-item index="/comment/index" v-if="menuList.comment">
                    <template slot="title">
                        <i class="iconfont iconpinglun"></i>
                        <span class="sClass">评论管理</span>
                    </template>
                </el-menu-item>
                <el-menu-item index="/dialogue-bank/index" v-if="menuList.dialogue">
                    <template slot="title">
                        <i class="iconfont iconxiaoxi"></i>
                        <span class="sClass">会话管理</span>
                    </template>
                </el-menu-item>
                <el-submenu index="/card-bank" v-if="menuList.card">
                    <template slot="title">
                        <i class="iconfont iconyouhuiquan"></i>
                        <span class="sClass">卡券管理</span>
                    </template>
                    <el-menu-item index="/card-bank/index">卡券管理</el-menu-item>
                    <el-menu-item index="/card-bank/card-approve">卡券审批</el-menu-item>
                </el-submenu>
                <el-submenu index="/expert-database" v-if="menuList.expert">
                    <template slot="title">
                        <i class="iconfont iconwo"></i>
                        <span class="sClass">专家库</span>
                    </template>
                    <el-menu-item index="/expert-database/index">专家管理</el-menu-item>
                    <el-menu-item index="/expert-database/approval">专家审批</el-menu-item>
                    <el-menu-item index="/expert-database/agreement">协议管理</el-menu-item>
                    <el-menu-item index="/expert-database/punishment">处罚记录</el-menu-item>
                </el-submenu>

                <el-submenu index="/operation" v-if="menuList.operation">
                    <template slot="title">
                        <i class="iconfont iconzongheyunyingfenxi"></i>
                        <span class="sClass">运营设置</span>
                    </template>
                    <el-menu-item index="/operation/index">用户管理</el-menu-item>
                    <!-- <el-menu-item index="/operation/privilege">用户特权</el-menu-item> -->
                    <!-- <el-menu-item index="/operation/privilege-approval">用户特权审批</el-menu-item> -->
                    <el-menu-item index="/operation/rule">用户规则设置</el-menu-item>
                    <!-- <el-menu-item index="/operation/rule-approval">用户规则审核</el-menu-item> -->
                    <el-menu-item index="/operation/member-fee">会费管理</el-menu-item>
                    <el-menu-item index="/operation/fee-approve">会费审核</el-menu-item>
                    <el-menu-item index="/operation/reward">赏金管理</el-menu-item>
                    <el-menu-item index="/operation/rebate-rule">返利规则管理</el-menu-item>
                    <el-menu-item index="/operation/rebate-rule-approve">返利规则审核</el-menu-item>
                    <el-menu-item index="/operation/commission">抽成设置</el-menu-item>
                    <el-menu-item index="/operation/commission-approval">抽成审核</el-menu-item>
                    <el-menu-item index="/operation/expert-upgrade-rule">专家升级规则</el-menu-item>
                    <el-menu-item index="/operation/expert-upgrade-rule-approval">专家升级规则审核</el-menu-item>
                    <el-menu-item index="/operation/tax-rate">税率设置</el-menu-item>
                    <el-menu-item index="/operation/tax-rate-approval">税率审核</el-menu-item>
                    <el-menu-item index="/operation/other-settings">其他设置</el-menu-item>
                    <el-menu-item index="/operation/other-settings-approval">其他设置审核</el-menu-item>
                </el-submenu>

                <el-menu-item index="/banner/index" v-if="menuList.banner">
                    <template slot="title">
                        <i class="iconfont iconhtmal5icon12"></i>
                        <span class="sClass">banner管理</span>
                    </template>
                </el-menu-item>

                <el-submenu index="/payment" v-if="menuList.expert">
                    <template slot="title">
                        <i class="iconfont icondaizhifu"></i>
                        <span class="sClass">支付体系</span>
                    </template>
                    <el-menu-item index="/payment/index">用户账户管理</el-menu-item>
                    <el-menu-item index="/payment/withdraw-approve">用户提现审批</el-menu-item>
                    <el-menu-item index="/payment/platform-account">平台账户管理</el-menu-item>
                    <el-menu-item index="/payment/audit-invoice">发票审核</el-menu-item>
                </el-submenu>

                <el-menu-item index="/Sensitive-word-library/index" v-if="menuList.sensitiveWord">
                    <template slot="title">
                        <i class="iconfont iconguolvqi"></i>
                        <span class="sClass">敏感词汇管理</span>
                    </template>
                </el-menu-item>

                <el-menu-item index="/shop/index" v-if="menuList.shop">
                    <template slot="title">
                        <i class="iconfont iconshangpin"></i>
                        <span class="sClass">商品管理</span>
                    </template>
                </el-menu-item>

                <el-submenu index="/authority" v-if="menuList.authority">
                    <template slot="title">
                        <i class="el-icon-s-check"></i>
                        <span style="font-size: 16px;">权限管理</span>
                    </template>
                    <el-menu-item index="/authority/app-menu">app菜单管理</el-menu-item>
                    <el-menu-item index="/authority/web-menu">web菜单管理</el-menu-item>
                    <!-- <el-menu-item index="/authority/backstage-menu">后台菜单管理</el-menu-item> -->
                </el-submenu>

                <el-menu-item index="/personnel/index" v-if="menuList.personnel">
                    <template slot="title">
                        <i class="iconfont iconwo"></i>
                        <span class="sClass">人员轨迹</span>
                    </template>
                </el-menu-item>

                <el-menu-item index="/personnel/team" v-if="menuList.personnel">
                    <template slot="title">
                        <i class="iconfont iconwo"></i>
                        <span class="sClass">团队最新定位</span>
                    </template>
                </el-menu-item>
      </el-menu>
    </el-scrollbar>
  </div>
</template>

<script>
import bus from "./bus";
export default {
  data() {
    return {
      collapse: false,
      menuList:{
        user1:false,
        Project55:false,
        Maintenance63:false,
        EmergencyRepair104:false,
        Lift77:false,
        Inspection118:false,
        Contract87:false,
        office123:false,
        Enterprise6:false,
        property34:false,
        CommonProblem41:false,
        NewList49:false,
        CapitalRepair134:false,
        home135:false,
        home136:false,
        //udream menus
        monitoringCenter: true,
        dataBank: true,
        school: true,
        recruitment: true,
        templateLibrary: true,
        state: true,
        question: true,
        comment: true,
        dialogue: true,
        card: true,
        expert: true,
        operation: true,
        banner: true,
        payment: true,
        sensitiveWord: true,
        shop: true,
        authority: true,
        personnel: true
      },
      Enterprise:{
        Enterprise7:false,
        Enterprise11:false,
        Enterprise14:false,
        Enterprise22:false,
        Enterprise26:false,
        Enterprise28:false,
        Enterprise19:false,
        Enterprise30:false,
      },
      Maintenance:{
        Maintenance64:false,
        Maintenance71:false,
      },
      EmergencyRepair:{
        EmergencyRepair105:false,
        EmergencyRepair106:false,
        EmergencyRepair109:false,
      },
      Contract:{
        Contract88:false,
        Contract94:false,
      },
      office:{
        office124:false,
        office129:false,
        office131:false,
      }
    };
  },
  created() {
    this.showMenuList()
    this.aBtn();
  },
  computed: {
    onRoutes() {
      return this.$route.path.replace("/", "");
    },
    
  },
  methods : {
    aBtn() {
      var that = this;
      bus.$on("funCol", message => {
        that.collapse = message;
      });
      console.log(that.collapse)
    },
    showMenuList(){
      var menu = JSON.parse(sessionStorage.getItem('menus'))!=null?JSON.parse(JSON.parse(sessionStorage.getItem('menus'))):''
      menu?menu.map((item)=>{
        if(item.id==55){
          this.menuList.Project55=true
        }else if(item.id==63){
          this.menuList.Maintenance63=true
          item.children?item.children.map((a)=>{
            if(a.id==64){
              this.Maintenance.Maintenance64=true
            }else if(a.id==71){
              this.Maintenance.Maintenance71=true
            }
          }):''
        }else if(item.id==104){
          this.menuList.EmergencyRepair104=true
          item.children?item.children.map((a)=>{
            if(a.id==105){
              this.EmergencyRepair.EmergencyRepair105=true
            }else if(a.id==106){
              this.EmergencyRepair.EmergencyRepair106=true
            }else if(a.id==109){
              this.EmergencyRepair.EmergencyRepair109=true
            }
          }):''
        }else if(item.id==77){
          this.menuList.Lift77=true
        }else if(item.id==118){
          this.menuList.Inspection118=true
        }else if(item.id==87){
          this.menuList.Contract87=true
          item.children?item.children.map((a)=>{
            if(a.id==88){
              this.Contract.Contract88=true
            }else if(a.id==94){
              this.Contract.Contract94=true
            }
          }):''
        }else if(item.id==123){
          this.menuList.office123=true
          item.children?item.children.map((a)=>{
            if(a.id==124){
              this.office.office124=true
            }else if(a.id==129){
              this.office.office129=true
            }else if(a.id==131){
              this.office.office131=true
            }
          }):''
        }else if(item.id==6){
          this.menuList.Enterprise6=true
          item.children?item.children.map((a)=>{
            if(a.id==7){
              this.Enterprise.Enterprise7=true
            }else if(a.id==11){
              this.Enterprise.Enterprise11=true
            }else if(a.id==14){
              this.Enterprise.Enterprise14=true
            }else if(a.id==22){
              this.Enterprise.Enterprise22=true
            }else if(a.id==26){
              this.Enterprise.Enterprise26=true
            }else if(a.id==19){
              this.Enterprise.Enterprise19=true
            }else if(a.id==28){
              this.Enterprise.Enterprise28=true
            }else if(a.id==30){
              this.Enterprise.Enterprise30=true
            }
          }):''
        }else if(item.id==34){
          this.menuList.property34=true
        }else if(item.id==41){
          this.menuList.CommonProblem41=true
        }else if(item.id==49){
          this.menuList.NewList49=true
        }else if(item.id==1){
          this.menuList.user1=true
        }else if(item.id==134){
          this.menuList.CapitalRepair134=true
        }else if(item.id==135){
          this.menuList.home135=true
        }else if(item.id==136){
          this.menuList.home136=true
        } else if (item.id == 1000) {
          this.menuList.sensitiveWord = true;
        } else {
          console.log('---------- Todo -------------');
        }
      }):''
      console.log(this.menuList)

    }
  }
};
</script>
<style lang="stylus">
.el-menu-vertical-demo:not(.el-menu--collapse) {
  width: 200px;
  min-height: 400px;
}

$fontColor = #909399;

.leftSideTitle {
  display: inline-block;
  padding-left: 2%;
  height: calc(100vh - 80px);
.el-scrollbar__wrap {
    overflow-x: hidden;
 }
.el-menu-item{
  // i{
  //   margin:0px;
  //   width:18px;
  //   height:20px;
  // }
  >.iconfangzi01-copy{
    padding-left:3px;
    margin-right:3px;
  }
  >.icongongzuoon{
    padding-left:3px;
    margin-right:3px;
  }
  >.iconnavicon-jgda{
    padding-left:3px;
    margin-right:4px;
  }
}
  >.el-menu {
    height: 100%;
  }

  .el-icon-user-solid {
    color: $fontColor;
  }

  .el-submenu__title {
    .iconoabangong-copy {
      font-size: 16px;
      padding-left:2px;
      margin-right:2px;
    }
  }

  .el-menu-item {
    font-size 16px
    .iconnavicon-jgda {
      font-size: 16px;
    }
  }

  .iconfont {
    color: $fontColor;
    font-size: 18px;
  }
}
.el-submenu__title{
  font-size: 16px;
}

.el-menu-item [class^=el-icon-] , .el-submenu [class^=el-icon-] {
    font-size: 20px;
}
.sClass {
  font-size:16px;
    margin-left: 10px;
}
</style>

<style scope>
.sidebar-wrapper {
    /* position: fixed; */
    top: 72px;
    left: 0;
    bottom: 0;
    width: 220px;
    background-color: #fff;
}
.el-scrollbar {
    height: 100%;
}
.el-scrollbar__wrap {
    overflow-x: hidden !important;
    background-color: #fff;
}
</style>
