菜品批量起售/停售
<p>[TOC]</p>
<h5>简要描述</h5>
<ul>
<li>菜品批量起售/停售</li>
</ul>
<h5>前端页面和服务端交互过程</h5>
<ul>
<li>在DishController添加status方法,通过数组保存ids,实现批量起售停售</li>
</ul>
<h5>触发事件</h5>
<pre><code><span class="span-btn blueBug non" @click="statusHandle('1')">批量启售</span>
<span style="border:none;" class="span-btn delBut non" @click="statusHandle('0')">批量停售</span></code></pre>
<h5>接口调用</h5>
<pre><code>statusHandle (row) {
let params = {}
if (typeof row === 'string' ) {
if (this.checkList.length === 0) {
this.$message.error('批量操作,请先勾选操作菜品!')
return false
}
params.id = this.checkList.join(',')
params.status = row
} else {
params.id = row.id
params.status = row.status ? '0' : '1'
}
this.dishState = params
this.$confirm('确认更改该菜品状态?', '提示', {
'confirmButtonText': '确定',
'cancelButtonText': '取消',
'type': 'warning'
}).then(() => {
// 起售停售---批量起售停售接口
dishStatusByStatus(this.dishState).then(res => {
if (res.code === 1) {
this.$message.success('菜品状态已经更改成功!')
this.handleQuery()
} else {
this.$message.error(res.msg || '操作失败')
}
}).catch(err => {
this.$message.error('请求出错了:' + err)
})
})
},</code></pre>
<h5>请求URL</h5>
<ul>
<li><code>[context-path]/dish/status/${params.status}</code></li>
</ul>
<h5>请求方式</h5>
<ul>
<li>POST </li>
</ul>
<h5>API接口</h5>
<pre><code>const dishStatusByStatus = (params) => {
return $axios({
url: `/dish/status/${params.status}`,
method: 'post',
params: { ids: params.id }
})
}</code></pre>
<h5>参数</h5>
<table>
<thead>
<tr>
<th style="text-align: left;">参数名</th>
<th style="text-align: left;">必选</th>
<th style="text-align: left;">类型</th>
<th>说明</th>
</tr>
</thead>
<tbody>
<tr>
<td style="text-align: left;">id</td>
<td style="text-align: left;">是</td>
<td style="text-align: left;">bigint</td>
<td>菜品编号</td>
</tr>
</tbody>
</table>
<h5>返回示例</h5>
<pre><code>code: 1
data: "状态修改成功!"
map: {}
msg: null
</code></pre>
<h5>返回参数说明</h5>
<table>
<thead>
<tr>
<th style="text-align: left;">参数名</th>
<th style="text-align: left;">类型</th>
<th>说明</th>
</tr>
</thead>
<tbody>
<tr>
<td style="text-align: left;">code</td>
<td style="text-align: left;">int</td>
<td>返回码:1:成功 0或其他:失败</td>
</tr>
<tr>
<td style="text-align: left;">data</td>
<td style="text-align: left;">object</td>
<td>返回数据</td>
</tr>
<tr>
<td style="text-align: left;">map</td>
<td style="text-align: left;">map</td>
<td>动态数据</td>
</tr>
<tr>
<td style="text-align: left;">msg</td>
<td style="text-align: left;">string</td>
<td>错误信息</td>
</tr>
</tbody>
</table>
<h5>备注</h5>
<ul>
<li>data有两种返回值</li>
</ul>
<pre><code>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;
}</code></pre>
<h5>后端接口请求参数</h5>
<ul>
<li>在Controller接口方法中声明数组类型参数ids</li>
<li>通过 @PathVariable 将 URL 中占位符参数status绑定到控制器处理入参</li>
</ul>
<h5>后端代码</h5>
<pre><code>@PostMapping("/status/{status}")
public R<String> status(@PathVariable Integer status,String[] ids){
log.info(ids.toString());
for (String id : ids) {
Dish dish = dishService.getById(id);
dish.setStatus(status);
dishService.updateById(dish);
}
return R.success("状态修改成功!");
}</code></pre>