import routerUserMenu from '@/mixins/router-user-menu'
import breadcrumbComponent from '@/components/breadcrumb.vue'
import simpleSelectTree from '@/components/simple-select-tree.vue'

import {toTree} from '@/utils/util'

export default {
  name: 'ReportAccess',
  components:{ breadcrumbComponent, simpleSelectTree},
  mixins: [routerUserMenu],
  data () {
    return {
      // 报表下的kpi
      kpis: [],
      // 当前tab展示用户
      currentUser: 0,
      // 报表id
      id: '',
      // 报表名
      name: '',
      // 过滤用户名
      filterUserText: '',
      // 全部用户
      userOptions: [],

      // 报表已选用户id
      userIds:[],
      // 已选用户的全部授权信息
      kpiRelUsers: []
    }
  },
  watch: {
    userIds(val){
      let kpiRelUsers=this.kpiRelUsers
      let kpiRelUsersIds=kpiRelUsers.map(user=>user.userId)
      // 添加
      val.forEach(userId=>{
        if(kpiRelUsersIds.indexOf(userId)<0){
          let user=this.userOptions.filter(user=>user.id===userId)[0]
          let newUser={
            userId:user.id,
            nickname:user.name
          }
          newUser.kpiIds=[...this.allKpiIds]
          kpiRelUsers.push(newUser)
        }
      })
      // 删除
      this.kpiRelUsers = kpiRelUsers.filter(user=>{
        return val.indexOf(user.userId)>=0
      })
      // 同步tab
      if(val.length>0 && val.indexOf(this.currentUser)<0){
        this.currentUser=val[0]
      }
    }
  },
  computed: {
    // 全部的kpi的id
    allKpiIds: {
      get: function(){
        return this.kpis.map(kpi=>kpi.kpiId)
      }
    },

    // 用户检索过滤后的选项
    userOptionsFiltered: {
      get: function(){
        let {userOptions,filterUserText}=this
        let arr=[]
        if(filterUserText){
          arr=userOptions.filter(user=>{
            return user.name.indexOf(filterUserText)>=0
          })
        }else{
          arr=[...userOptions]
        }
        return arr
      }
    },
  },

  mounted () {
    this.init()
  },
  methods: {
    /* 保存单个操作 */
    reportRelUsers(){
      let params={
        reportId: this.id,
        kpiRelUsers: this.kpiRelUsers
      }
      this.$api.report.reportRelUsers(params).then(res=>{
        if(res.code=== '1'){
          this.$message.success(res.msg)
          this.goBack()
        }
      })
    },

    //  如果有id，则获取id对应的报表信息
    init(){
      // 获取url参数
      let params = this.$route.params
      if(params.hasOwnProperty('id')){
        // 如果有id，则加载组件对象
        this.id = params.id
        this.name=params.name
        this.getKpis();
      }
      this.getUsers()
    },

    // 获取报表已选用户
    listRelUser(){
      let params = { id: this.id }
      this.$api.report.listRelUser(params)
        .then(res => {
          if (res.code == 1) {
            res.data.forEach(u=>{
              let user=this.userOptions.filter(user=>user.id===u.userId)[0]
              u.nickname=user.name
            })
            this.kpiRelUsers=res.data
            this.userIds=res.data.map(user=>user.userId)
            this.currentUser=res.data.length>0?res.data[0].userId:''
          }
        })
    },

    getKpis(){
      let params = { id: this.id }
      let _this=this
      this.$api.report.listKpiByReportId(params)
        .then(res => {
          if (res.code == 1) {
            if(res.data){
              _this.kpis=res.data
            }
          }
        })
    },

    selectUserAll(flag){
      let {userOptionsFiltered, userIds}=this
      if(flag){
        userOptionsFiltered.forEach((current)=>{
          let index=userIds.indexOf(current.id)
          if(index<0){
            userIds.push(current.id)
          }
        })
      }else{
        userOptionsFiltered.forEach((current)=>{
          let index=userIds.indexOf(current.id)
          if(index>=0){
            userIds.splice(index,1)
          }
        })
      }
    },

    selectKpiAll(target,flag){
      if(flag){
        target.kpiIds=[...this.allKpiIds]
      }else{
        target.kpiIds=[]
      }
    },

    removeUser(arr,index){
      console.log(arr)
      arr.splice(index,1)
    },

    getUsers(){
      this.$api.report.listUser().then(res=>{
        if(res.code==1){
          this.userOptions=res.data
          if(this.id){
            this.listRelUser()
          }
        }
      })
    },
  }
}
