用户启用禁用功能——单个和批量

最新推荐文章于 2024-06-19 15:46:35 发布

Elon_王艺龙

最新推荐文章于 2024-06-19 15:46:35 发布

阅读量409

点赞数

文章标签： vue.js javascript

本文链接：https://blog.csdn.net/Yilong18/article/details/128228747

版权

el-switch：

        <el-switch
                  @change="switchChange1(scope.row)"
                  v-model="scope.row.IsAdmin"
                  class="ml-2"
                  style="--el-switch-on-color: #f69675; --el-switch-off-color: #e2e2e3"
                />&nbsp;&nbsp;&nbsp;<span v-if="scope.row.IsAdmin">启用</span
                ><span v-if="!scope.row.IsAdmin">已禁用</span>
              </template>
            </el-table-column>
            <el-table-column prop="updateTime" label="用户状态">
              <template #default="scope">
                <el-switch
                  @change="switchChange2(scope.row)"
                  :value ="scope.row.EntityState===1?true:false"
                  class="ml-2"
                  style="--el-switch-on-color: #13c75b; --el-switch-off-color: #e2e2e3"
                />&nbsp;&nbsp;&nbsp;<span
                  v-if="scope.row.EntityState===1"
                  >启用</span
                ><span v-if="scope.row.EntityState===3">已禁用</span>
              </template>
            </el-table-column>
          </el-table>
            <el-switch
                  @change="switchChange3"
                  v-model="isall"
                  class="ml-2"
                  style="--el-switch-on-color: #13c75b; --el-switch-off-color: #e2e2e3;margin-top:10px"
                />&nbsp;&nbsp;&nbsp;<span v-if="isall===false">用户状态批量启用</span><span v-if="isall">用户状态批量禁用</span>

数据初始化：

export default {
  data() {
    return {
      ids:[],//接口传递的参数
      isall:false,//控制批量
    };
  },

方法体：

switchChange1(val) {
      gruanUserAdministrator({
        id: val.Id,
        userBp: val.UserBP,
        isAdmin: val.IsAdmin,
        
      }).then((res) => {
        if (res.AntsCode === 200) {
          ElMessage({
            message: '操作成功',
            type: "success",
          });
        } else {
          ElMessage.error("操作失败");
        }
      });
    },
    switchChange2(val) {
    console.log('vvv',val.EntityState)
      if(val.EntityState ===1){
        this.isVisiable = false
        
      }else{
        this.isVisiable = true
       
      }，

 switchChange3(){
      
      let data ={
        
        ids: this.ids,
        userBp: sessionStorage.getItem("UserBp") ，
        isVisiable: this.isall?true:false,
      }