菜品批量删除

[TOC]

简要描述

• 菜品批量删除

前端页面和服务端交互过程

• 页面发送ajax请求，将参数(id)提交到服务端
• 服务端Controller接收页面提交的数据并调用Service删除数据
• Service调用Mapper操作数据库

触发事件

<span class="span-btn delBut non" @click="deleteHandle('批量', null)">批量删除</span>

接口调用

deleteHandle (type, id) {
  if (type === '批量' && id === null) {
    if (this.checkList.length === 0) {
      return this.$message.error('请选择删除对象')
    }
  }
  this.$confirm('确认删除该菜品, 是否继续?', '确定删除', {
    'confirmButtonText': '确定',
    'cancelButtonText': '取消',
  }).then(() => {
    deleteDish(type === '批量' ? this.checkList.join(',') : id).then(res => {
      if (res.code === 1) {
        this.$message.success('删除成功！')
        this.handleQuery()
      } else {
        this.$message.error(res.msg || '操作失败')
      }
    }).catch(err => {
      this.$message.error('请求出错了：' + err)
    })
  })
},

请求URL

• [context-path]/dish

请求方式

• DELETE

API接口

 const deleteDish = (ids) => {
  return $axios({
    url: '/dish',
    method: 'delete',
    params: { ids }
  })
}

请求参数

参数名	必选	类型	说明
id	是	bigint	菜品编号

返回示例

code: 1
data: "删除菜品成功！"
map: {}
msg: null

返回参数说明

参数名	类型	说明
code	int	返回码：1：成功 0或其他：失败
data	object	返回数据
map	map	动态数据
msg	string	错误信息

备注

• data有两种返回值

public static <T> R<T> success(T object) {
    R<T> r = new R<T>();
    r.data = object;
    r.code = 1;
    return r;
}

public static <T> R<T> error(String msg) {
    R r = new R();
    r.msg = msg;
    r.code = 0;
    return r;
}

后端接口请求参数

• 在Controller接口方法中声明数组类型参数ids

后端代码

@DeleteMapping
public R<String> deleteDish(String[] ids){
    log.info(ids.toString());
    for (String id : ids) {
        dishService.removeById(id);
    }
    return R.success("删除菜品成功！");
}