批量删除 set集合方式

一、前端代码

 1  <el-table
 2         ref="multipleTable"
 3         :data="tableData"
 4         stripe
 5         style=" 99%;margin-bottom: 10px;"
 6         border
 7         :height="$publicjs.tableHeight"
 8         @selection-change="changeCheckBoxValue"
 9       >
10         <el-table-column type="selection" width="55" />
11         <el-table-column type="index" label="序号" width="60px" />
12         <el-table-column prop="jobName" label="任务名称" />
13         <el-table-column show-overflow-tooltip prop="beanName" label="Bean名称" width="260px" />
14         <el-table-column show-overflow-tooltip prop="methodName" label="执行方法" />
15         <el-table-column prop="jarName" label="jar包名称" />
16         <el-table-column show-overflow-tooltip prop="cronExpression" label="cron表达式" />
17         <el-table-column label="异常详情" width="100px">
18           <template slot-scope="scope">
19             <el-button v-show="scope.row.exceptionDetail" size="mini" type="text" @click="info(scope.row.exceptionDetail)">查看详情</el-button>
20           </template>
21         </el-table-column>
22         <el-table-column prop="time" label="耗时(毫秒)" />
23         <el-table-column prop="isPause" label="状态" width="100px">
24           <template slot-scope="scope">
25             <el-tag :type="scope.row.isSuccess ? 'success' : 'warning'">{{ scope.row.isSuccess ? '成功' : '失败' }}</el-tag>
26           </template>
27         </el-table-column>
28         <el-table-column show-overflow-tooltip prop="createTime" :formatter="dateFormatter" label="创建日期" />
29       </el-table>

二、前端js方法

 changeCheckBoxValue(val) {
      if(val.length >0){
       val.forEach(element => {
         this.ids.push(element.logId);
       });

      }
    },
    // 删除功能
    handleDel() {
      let _this = this;
      // 判断是否选择记录
      if( _this.ids.length <= 0){
          _this.$message({message:'请至少选择一条记录进行删除',type:'warning'});
      }else{
         _this.$confirm("此操作将删除操作日志记录, 是否继续?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        })
        .then(() => {
          delLog(_this.ids).then(res => {
            if (res.code == 200) {
              _this.$message({
                message: res.message,
                type: "success"
              });
              _this.currentPage = 1;
              //更新表格
              _this.loadList(_this.currentPage, _this.pageCount);
            } else {
              _this.$message({
                message: res.message,
                type: "error"
              });
            }
          });
        })
        .catch(() => {});
      }
    },

三、调用后台方法js

1 // 批量删除执行日志
2 export function delLog(ids) {
3   return request({
4     url: 'api/quartzLog',
5     method: 'delete',
6     data: ids
7   })
8 }

四、后台服务端接收前端参数进行数据库操作

 1 @Slf4j
 2 @RestController
 3 @RequiredArgsConstructor
 4 @RequestMapping("/quartzLog")
 5 @Api(tags = "系统:执行日志管理")
 6 public class QuartzLogController {
 7 
 8     private final QuartzLogService quartzLogService;
 9 
10     @ApiOperation(value = "删除")
11     @DeleteMapping
12     public Response<Integer> delete(@RequestBody Set<Long> ids){
13         int re = quartzLogService.delete(ids);
14         if (re > 0) {
15             return new Response<>(ErrorCode.SUCESS_CODE, "删除成功", re);
16         } else {
17             return new Response<>(ErrorCode.INTERNAL, "删除失败，未知错误", null);
18         }
19     }
20 }

五、服务层操作

1     @Override
2     public int delete(Set<Long> ids) {
3         Map<String, Object> map = new HashMap<>();
4         map.put("ids", ids);
5         mapper.deletes(map);
6         return 1;
7     }

六、具体方法执行

1    <!--批量删除-->
2     <delete id="deletes">
3         delete FROM sys_quartz_log WHERE log_id in
4         <foreach item="item" index="index" collection="ids" open="(" separator="," close=")">
5             #{item}
6         </foreach>
7     </delete>