策略管理
需求说明
策略管理主要涉及到二个功能模块,业务流程如下:
- 新增策略: 允许管理员定义新的策略,包括策略的具体内容和参数(如折扣率)
- 策略分配: 将策略分配给一个或多个售货机。
对于策略和其他管理数据,下面是示意图:
- 关系字段:policy_id
生成基础代码
需求
使用若依代码生成器,生成策略管理前后端基础代码,并导入到项目中:
步骤
创建目录菜单
创建策略管理目录菜单
配置代码生成信息
导入策略表
配置策略表(参考原型)
下载代码并导入项目
选中策略表生成下载
解压ruoyi.zip
得到前后端代码和动态菜单sql
代码导入
策略管理改造
列表展示改造
在policy/index.vue视图组件中修改
<el-table v-loading="loading" :data="policyList" @selection-change="handleSelectionChange">
<!-- <el-table-column type="selection" width="55" align="center" /> -->
<el-table-column label="序号" align="center" prop="policyId" />
<el-table-column label="策略名称" align="center" prop="policyName" />
<el-table-column label="策略方案" align="center" prop="discount" >
<template #default="scope">
<span>{{ scope.row.discount }}%</span>
</template>
</el-table-column>
<el-table-column label="创建日期" align="center" prop="createTime" width="180">
<template #default="scope">
<span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d}') }}</span>
</template>
</el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template #default="scope">
<el-button link type="primary" @click="getPolicyInfo(scope.row)" v-hasPermi="['manage:policy:list']">查看详情</el-button>
<el-button link type="primary" @click="handleUpdate(scope.row)" v-hasPermi="['manage:policy:edit']">修改</el-button>
<el-button link type="primary" @click="handleDelete(scope.row)" v-hasPermi="['manage:policy:remove']">删除</el-button>
</template>
</el-table-column>
</el-table>
添加或修改对话框改造
将策略方案改为数字输入框:
<el-form-item label="策略方案" prop="discount">
<el-input-number min="1" max="100" :precision="0" v-model="form.discount" placeholder="请输入策略方案" />
</el-form-item>
</el-form>
查看详情改造
需求
点击查看详情,展示策略名称和该策略下的设备列表
设备表需要的信息:
代码实现
在policy/index.vue视图组件中修改
<el-button link type="primary" @click="getPolicyInfo(scope.row)" v-hasPermi="['manage:vm:list']">查看详情</el-button>
<!-- 策略详情对话框 -->
<el-dialog v-model="policyOpen" title="策略详情" width="500px">
<el-form-item label="策略名称" prop="policyName">
<el-input v-model="form.policyName" placeholder="请输入策略名称" disabled />
</el-form-item>
<label>包含设备:</label>
<el-table :data="vmList">
<el-table-column label="序号" type="index" width="80" align="center" prop="id" />
<el-table-column label="点位地址" align="left" prop="addr" show-overflow-tooltip />
<el-table-column label="设备编号" align="center" prop="innerCode" />
</el-table>
</el-dialog>
<script setup name="Policy">
import { listVm } from "@/api/manage/vm";
import { loadAllParams } from "@/api/page";
/* 查看策略详情 */
const policyOpen = ref(false);
const vmList = ref([]);
function getPolicyInfo(row) {
//1. 获取策略信息
form.value = row;
//2. 根据策略id,查询设备列表
loadAllParams.policyId = row.policyId;
listVm(loadAllParams).then(response => {
vmList.value = response.rows;
policyOpen.value = true;
});
}
</script>
SQL语句修改:
在VendingMachineMapper.xml文件中添加policy_id的查询条件:
<sql id="selectVendingMachineVo">
select id, inner_code, channel_max_capacity, node_id, addr, last_supply_time, business_type, region_id, partner_id, vm_type_id, vm_status, running_status, longitudes, latitude, client_id, policy_id, create_time, update_time from tb_vending_machine
</sql>
<select id="selectVendingMachineList" parameterType="VendingMachine" resultMap="VendingMachineResult">
<include refid="selectVendingMachineVo"/>
<where>
<if test="innerCode != null and innerCode != ''"> and inner_code = #{innerCode}</if>
<if test="policyId != null and policyId != ''"> and policy_id = #{policyId}</if>
</where>
</select>
设备策略分配
需求
在设备管理页面中点击策略,对设备设置一个固定折扣,用于营销作用
代码实现
在vm/index.vue视图组件中修改
<el-button link type="primary" @click="handleUpdatePolicy(scope.row)" v-hasPermi="['manage:vm:edit']">策略</el-button>
<!-- 策略管理对话框 -->
<el-dialog title="策略管理" v-model="policyOpen" width="500px" append-to-body>
<el-form ref="vmRef" :model="form" label-width="80px">
<el-form-item label="策略" prop="policyId">
<el-select v-model="form.policyId" placeholder="请选择策略">
<el-option v-for="item in policyList" :key="item.policyId" :label="item.policyName"
:value="item.policyId"></el-option>
</el-select>
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</template>
</el-dialog>
<script setup name="Vm">
import { listPolicy } from '@/api/manage/policy';
// 取消按钮
function cancel() {
open.value = false;
policyOpen.value=false; // 关闭策略对话框
reset();
}
/** 提交按钮 */
function submitForm() {
proxy.$refs["vmRef"].validate(valid => {
if (valid) {
if (form.value.id != null) {
updateVm(form.value).then(response => {
proxy.$modal.msgSuccess("修改成功");
open.value = false;
getList();
});
} else {
addVm(form.value).then(response => {
proxy.$modal.msgSuccess("新增成功");
open.value = false;
getList();
});
}
}
});
}
/* 设备策略分配 */
const policyList = ref([]);
const policyOpen = ref(false);
function handleUpdatePolicy(row) {
//1. 为表单赋值设备id和策略id,只需要更新这两个字段的值,其他值不需要更新,要通过表单信息发送给后端。
form.value.id = row.id;
form.value.policyId = row.policyId;
//2. 查询策略列表
listPolicy(loadAllParams).then((response) => {
policyList.value = response.rows;
policyOpen.value = true;
});
}
</script>
前端返回的修改信息只有vm_id和policy_id也就是表单赋值的信息,并没有node_id,所以需要增加非空判断,当没有node_id时只是简单更新策略信息,不影响点位信息的更新。
在VendingMachineServiceImpl中修改:
/**
* 修改设备管理
*
* @param vendingMachine 设备管理
* @return 结果
*/
@Override
public int updateVendingMachine(VendingMachine vendingMachine)
{
if (vendingMachine.getNodeId()!=null) {
// 查询点位表,补充:区域、点位、合作商等信息
Node node = nodeService.selectNodeById(vendingMachine.getNodeId());
BeanUtil.copyProperties(node,vendingMachine,"id");// 商圈类型、区域、合作商
vendingMachine.setAddr(node.getAddress());// 设备地址
}
vendingMachine.setUpdateTime(DateUtils.getNowDate());// 更新时间
return vendingMachineMapper.updateVendingMachine(vendingMachine);
}