记一次element 全选单选只能选一个类型的坑

68 阅读1分钟

1671605011142.jpg table 代码如下

1671672404826.png

1671605235311.png

js代码

    // 批量离职 
    handleCloseBatch(){
      this.dialogVisibleBatch = false;
    },
    batchApply(){
      if( this.ruleFormBatch.employeeIdList.length <= 0 ){ 
        this.$message.error('请选择员工');
        return
       }
      this.dialogVisibleBatch = true
      this.staffTitleBatch ? this.ruleFormBatch.leaveTime = this.$moment().format("YYYY-MM-DD") : this.ruleFormBatch.joinTime = this.$moment().format("YYYY-MM-DD")
    },
    getRowKey(row) {
      return row.employeeId
    },
    handleSelectionChange(val){
      console.log(val)
      console.log(val.length)
      this.handleSelectionChangeAry = val
      let employeeIdary = []
      if( this.handleSelectionChangeAry.length > 0){
        this.handleSelectionChangeAry[0].isWork == false ? this.staffTitleBatch = false : this.staffTitleBatch = true
        this.handleSelectionChangeAry.forEach( v => {
          if( v.isWork == this.handleSelectionChangeAry[0].isWork ){
            employeeIdary.push(v.employeeId)
          }
        })
        this.ruleFormBatch.employeeIdList = employeeIdary
        this.ruleFormBatch.isWork = !this.handleSelectionChangeAry[0].isWork
      }else{
        this.ruleFormBatch.employeeIdList = []
      }
    },
    selectable(row,index){
      console.log("this.ruleFormBatch.employeeIdList.length22222",this.ruleFormBatch.employeeIdList.length)
      if(this.ruleFormBatch.employeeIdList.length > 0){
        if( row.isWork != this.staffTitleBatch ){
          return false
        }else{
          this.DisableSelection = false && this.DisableSelection;
          return true
        }
      }else{
        this.DisableSelection = true;
        return true
      }
    },
     handleSubmitBatch(){
      this.$refs.ruleFormBatch.validate(async (valid)=>{
        if(valid){
          this.dialogVisibleBatch = false
          let obj = {}
          obj.employeeIdList = this.ruleFormBatch.employeeIdList
          obj.isWork = this.ruleFormBatch.isWork
          obj.time = this.ruleFormBatch.joinTime || this.ruleFormBatch.leaveTime
      
          let res = await batchUpdate(obj);
          if(res.code==200){
            this.$message({
              message: res.data,
              type: 'success'
            });
            this.ruleFormBatch.leaveTime = ""
            this.ruleFormBatch.joinTime = ""
            this.ruleFormBatch.employeeIdList = []
            // this.handleSelectionChangeAry = []
            // this.DisableSelection = false
            this.$refs.multipleTable.clearSelection();
            this.select();
          }

          
        }else{
          this.dialogVisibleBatch = false
          console.log('error submit!!');
        }
        
      })
    },
    //全选按钮隐藏
    cellClass(row){
      row.length
        console.log(row)
          if(this.DisableSelection){
              return 'DisableSelection'
          }   
    },

css代码

/deep/ .el-table .DisableSelection .cell .el-checkbox__inner{
          display: none;
          position: relative;
        }
/deep/ .el-table .DisableSelection .cell:before{
          content: "";
          position: absolute;
  }

  // /deep/ .el-checkbox__input.is-disabled.is-checked .el-checkbox__inner::after{
  //   transform:rotate(45deg) scaleY(0);
  // }