场景
效果
实现
html页面代码
页面使用的是thymeleaf模板。
下拉框代码:
<div class="form-group row col-md-6">
<label class="col-sm-2 col-form-label">退货发起方</label>
<div class="col-sm-10">
<select class="form-control" name="businessInitiator" id="businessInitiator">
<option id="yuanliaoInitiator" th:selected="${refundOrder != null && refundOrder.businessInitiator != null && refundOrder.businessInitiator == '原料立库'}" value="原料立库"><span th:text="原料立库"></span></option>
<option id="qingjieInitiator" th:selected="${refundOrder != null && refundOrder.businessInitiator != null && refundOrder.businessInitiator == '清洁车间'}" value="清洁车间"><span th:text="清洁车间"></span></option>
<option id="zhengjiInitiator" th:selected="${refundOrder != null && refundOrder.businessInitiator != null && refundOrder.businessInitiator == '正极车间'}" value="正极车间"><span th:text="正极车间"></span></option>
<option id="fujiInitiator" th:selected="${refundOrder != null && refundOrder.businessInitiator != null && refundOrder.businessInitiator == '负极车间'}" value="负极车间"><span th:text="负极车间"></span></option>
<option value="" disabled selected hidden>选择退货发起方</option>
</select>
</div>
</div>
input框代码:
<div class="form-group row col-md-6">
<label class="col-sm-2 col-form-label">退货目的地</label>
<div class="col-sm-10">
<input type="text" class="form-control" name="destination" id="destination"
readonly>
</div>
</div>
dataTables代码:
<table id="example" class="table table-striped table-bordered hover" style="width:100%">
<thead>
<tr>
<th><input type="checkbox" class="checkall" /></th>
<th>货位编号</th>
<th>货位类型</th>
<th>物料类型</th>
<th>物料状态</th>
<th>所在货架</th>
<th>备注</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
Jquery代码
$(document).ready(function() {
//选择退货方后退货目的地绑定联动
$("#businessInitiator").bind("change", function () {
//获取选中的option的value值
var selected = $("#businessInitiator option:selected").val();
//获取退货目的地Input对象
var destination = $("#destination");
switch (selected){
case '原料立库':
destination.val("原料立库退货点")
break;
case '清洁车间':
destination.val("清洁车间退货点")
break;
case '正极车间':
destination.val("正极车间退货点")
break;
case '负极车间':
destination.val("负极车间退货点")
break;
default:
destination.val("其它退货点")
}
//退货目的地联动完成
// DataTable初始化
$("#example").dataTable().fnDestroy();//还原初始化了datatable
var t = $('#example').DataTable({
"language": {
"processing": "处理中...",
"lengthMenu": "显示 _MENU_ 项结果",
"zeroRecords": "没有匹配结果",
"info": "显示第 _START_ 至 _END_ 项结果,共 _TOTAL_ 项",
"infoEmpty": "显示第 0 至 0 项结果,共 0 项",
"infoFiltered": "(由 _MAX_ 项结果过滤)",
"infoPostFix": "",
"search": "搜索:",
"searchPlaceholder": "搜索...",
"url": "",
"emptyTable": "表中数据为空",
"loadingRecords": "载入中...",
"infoThousands": ",",
"paginate": {
"first": "首页",
"previous": "上页",
"next": "下页",
"last": "末页"
},
"aria": {
paginate: {
first: '首页',
previous: '上页',
next: '下页',
last: '末页'
},
"sortAscending": ": 以升序排列此列",
"sortDescending": ": 以降序排列此列"
},
"decimal": "-",
"thousands": "."
},
"processing": true,
"searching" : false,
"pageLength": 100,
"serverSide": true,
"columnDefs": [ {
"searchable": false,
"orderable": false,
"targets": "_all",
}],
"dom": '<"top">rt<"bottom"flpi><"clear">',
columns: [
{ data: 'id' ,
"orderable" : false},
{ data: 'goodsLocationNumber' },
{ data: 'locationTypeName' ,
"orderable" : false},
{ data: 'saveMaterialTypeName' ,
"orderable" : false},
{ data: 'materielStatusName',
"orderable" : false},
{ data: 'shelveName' ,
"orderable" : false},
{ data: 'remark',
"orderable" : false }
],columnDefs: [{
// 指定第1列,从0开始,0表示第一列,1表示第二列……
"targets": 0,
"bSortable": false,
"render": function(data, type, row, meta) {
if (row.isSelected == 1){
return '<input type="checkbox" class="checkchild" onclick="childClick(this)" checked="checked" value="' + row.id + '" />'
}
return '<input type="checkbox" class="checkchild" onclick="childClick(this)" value="' + row.id + '" />'
}
}],
"ajax": function (data, callback, setting) {
data.editActionId = $("#refundOrderId").val();
data.selected=selected;
$.ajax({
type: 'POST',
url: "/busGoodsLocation/getRejectsLocationsList",
cache: false, //禁用缓存
//async: true,
data: JSON.stringify(data), //传入组装的参数
contentType: "application/json",
dataType: "json",
success: function (result) {
callback(result);
}
})
}
});
});
});
注:
1.页面加载完成后绑定下拉框 select的change事件,获取选中的option的值,通过case进行比较,进而给input进行赋值。
2.然后要还原一次dataTables的初始化,执行初始化的dataTables的初始化并请求数据。
3.将selected作为选中的值进行请求数据的参数,进而后台根据传递的值查询并返回不同的数据。
后台Controller代码
@Description("根据条件获取不良品货位列表")
@RequestMapping(value = "/getRejectsLocationsList", method = RequestMethod.POST)
@ResponseBody
public DataTablesResultJsonVO getRejectsLocationsList(@RequestBody DataTablesJsonVOExt vo) {
DataTablesResultJsonVO dataTablesResultJsonVO = new DataTablesResultJsonVO();
try {
String keyHump = vo.getColumns().get(vo.getOrder().get(0).getColumn().intValue()).getData();
String keyLine = StringUtil.humpToLine(keyHump);
String sortStr = vo.getOrder().get(0).getDir();
long currentPage = vo.getStart() / vo.getLength() + 1;
Page<WmsRefundOrder> refundOrderPage = new Page<WmsRefundOrder>(currentPage, 100);
if ("asc".equals(sortStr)) {
refundOrderPage.setAsc("location." + keyLine);
} else {
refundOrderPage.setDesc("location." + keyLine);
}
IPage<BusGoodsLocationVO> page = null;
//接收车间仓库参数,进行参数赋值
String warehourse = vo.getSelected();
//仓库车间赋值
String wareNum="A";
switch (warehourse){
case "原料立库":
wareNum="A";
break;
case "清洁车间":
wareNum="B";
break;
case "正极车间":
wareNum="C";
break;
case "负极车间":
wareNum="D";
break;
}
//当编辑操作id存在时,表明是编辑操作
if (vo.getEditActionId() != null && vo.getEditActionId() != 0) {
page = locationService.pageRejectsLocations(refundOrderPage, vo, 1,wareNum);
//查询出当前退货单下的所有明细
QueryWrapper<WmsRefundOrderDetails> refundOrderDetailsQueryWrapper = new QueryWrapper<>();
refundOrderDetailsQueryWrapper.eq("refund_id", vo.getEditActionId()).eq("deleted_flag", "0");
List<WmsRefundOrderDetails> refundOrderDetails = refundOrderDetailsService.list(refundOrderDetailsQueryWrapper);
for (BusGoodsLocationVO locationVO : page.getRecords()) {
for (WmsRefundOrderDetails details : refundOrderDetails) {
if (details.getGoodsLocationId().equals(locationVO.getId())) {
locationVO.setIsSelected(1);
break;
}
}
}
//删除非此退货单对应的货位
for (BusGoodsLocationVO locationVO : page.getRecords()) {
if (locationVO.getRefundOrderFlag() == 1 && locationVO.getIsSelected() == 0) {
page.getRecords().remove(locationVO);
}
}
} else {
page = locationService.pageRejectsLocations(refundOrderPage, vo, 0,wareNum);
}
dataTablesResultJsonVO.setData(page.getRecords());
dataTablesResultJsonVO.setDraw(vo.getDraw());
dataTablesResultJsonVO.setError("error");
dataTablesResultJsonVO.setRecordsFiltered(page.getTotal());
dataTablesResultJsonVO.setRecordsTotal(page.getSize());
Log.getInst(this).debug("getRefundList test:" + vo.getColumns().get(0).getSearch());
return dataTablesResultJsonVO;
} catch (Exception ex) {
dataTablesResultJsonVO.setData(new ArrayList<WmsRefundOrder>());
dataTablesResultJsonVO.setDraw(vo.getDraw());
dataTablesResultJsonVO.setError("error");
dataTablesResultJsonVO.setRecordsFiltered(0L);
dataTablesResultJsonVO.setRecordsTotal(0L);
Log.getInst(this).debug("getRefundList test:" + vo.getColumns().get(0).getSearch());
return dataTablesResultJsonVO;
}
}
}
其中:
DataTablesJsonVOExt:
@Data
public class DataTablesJsonVOExt extends DataTablesJsonVO {
//编辑操作的id
private Integer editActionId;
//选择要退货的车间仓库
private String selected;
}
DataTablesJsonVO:
@Data
public class DataTablesJsonVO implements Serializable{
private Long draw;
private List<DataTablesColumnsJsonVO> columns;
private List<DataTablesOrderJsobVO> order;
private Long start;
private Long length;
private DataTablesOrderJsobVO search;
}
DataTablesColumnsJsonVO:
@Data
public class DataTablesColumnsJsonVO implements Serializable {
private String data;
private String name;
private boolean searchable;
private boolean orderable;
private DataTablesSearchJsnVO search;
}
DataTablesOrderJsobVO:
@Data
public class DataTablesOrderJsobVO implements Serializable {
private Long column;
private String dir;
}
DataTablesResultJsonVO:
@Data
public class DataTablesResultJsonVO<T> implements Serializable {
private Long draw;
private Long recordsTotal;
private Long recordsFiltered;
private List<T> data;
private String error;
}
Service层代码
IPage<BusGoodsLocationVO> pageRejectsLocations(Page page, DataTablesJsonVO vo, Integer editFlag,String wareNum);
ServiceImpl代码
@Override
public IPage<BusGoodsLocationVO> pageRejectsLocations(Page page , DataTablesJsonVO vo ,Integer editFlag,String wareNum) {
BusGoodsLocationVO locationVO = new BusGoodsLocationVO();
locationVO.setEditFlag(editFlag);
//给选中传递的仓库车间赋值
locationVO.setSelected(wareNum);
List<DataTablesColumnsJsonVO> dataTablesColumnsJsonVOList= vo.getColumns();
for (DataTablesColumnsJsonVO d : dataTablesColumnsJsonVOList) {
if("locationNumber".equals(d.getData()))
locationVO.setGoodsLocationNumber(d.getSearch().getValue());
if("materielStatus".equals(d.getData()))
locationVO.setMaterielStatus(d.getSearch().getValue());
}
return baseMapper.getPageRejectsLocations(page,locationVO);
}
mapper层代码
IPage<BusGoodsLocationVO> getPageRejectsLocations(IPage page,@Param("locationVO") BusGoodsLocationVO locationVO);
mapper的xml文件代码
<select id="getPageRejectsLocations" resultMap="busGoodsLocationVOMap"
parameterType="com.ws.bus.sys.vo.BusGoodsLocationVO.BusGoodsLocationVO">
SELECT location.id,location.goods_location_number, code.code_name location_type_name,shelve.shelves_name
shelve_name,tm.materiel_name save_material_type_name ,sc.code_name materiel_status_name,lt.refund_order_flag
FROM bus_location_tray lt
LEFT JOIN bus_goods_location location on location.id = lt.location_id
LEFT JOIN sys_code code on code.code_type = 'location_type' and code.code_value = location.goods_location_type
LEFT JOIN bus_goods_shelves shelve on shelve.id = location.wh_shelves_id
LEFT JOIN sys_code sc on sc.code_type = 'materielCheckStatus' and sc.code_value = lt.materiel_check_status
LEFT JOIN (
SELECT DISTINCT tray_id,materiel_name
FROM bus_tray_materiel
WHERE deleted_flag = '0') tm on tm.tray_id = lt.tray_id
WHERE lt.materiel_check_status = 3 and lt.deleted_flag = 0
<if test="locationVO != null and locationVO.editFlag == 0">
and lt.refund_order_flag = 0
</if>
<if test="locationVO != null and locationVO.selected != null">
and location.goods_location_number like CONCAT(#{locationVO.selected},'%')
</if>
</select>
实体类代码
package com.ws.bus.sys.entity;
import com.baomidou.mybatisplus.annotation.IdType;
import com.baomidou.mybatisplus.extension.activerecord.Model;
import java.util.Date;
import com.baomidou.mybatisplus.annotation.TableId;
import com.baomidou.mybatisplus.annotation.FieldFill;
import com.baomidou.mybatisplus.annotation.TableField;
import java.io.Serializable;
import lombok.Data;
import lombok.EqualsAndHashCode;
import lombok.experimental.Accessors;
@Data
@EqualsAndHashCode(callSuper = false)
@Accessors(chain = true)
public class BusGoodsLocation extends Model<BusGoodsLocation> {
private static final long serialVersionUID = 1L;
/**
* 货位主键ID
*/
@TableId(value = "id", type = IdType.AUTO)
private Long id;
/**
* 货位编号
*/
private String goodsLocationNumber;
/**
* 货位名称
*/
private String goodsLocationName;
/**
* 货位状态
*/
private String goodsLocationStatus;
/**
* 货位类型
*/
private Long goodsLocationType;
/**
* 归属货架
*/
private Long whShelvesId;
/**
* 创建人ID
*/
@TableField(fill = FieldFill.INSERT)
private Long creatorId;
/**
* 创建时间
*/
@TableField(fill = FieldFill.INSERT)
private Date gmtCreat;
/**
* 修改人ID
*/
@TableField(fill = FieldFill.INSERT_UPDATE)
private Long modifierId;
/**
* 修改时间
*/
@TableField(fill = FieldFill.INSERT_UPDATE)
private Date gmtModified;
/**
* 是否可用(1-是,0-否)
*/
@TableField(fill = FieldFill.INSERT)
private Boolean availableFlag;
/**
* 是否删除(1-是,0-否)
*/
@TableField(fill = FieldFill.INSERT)
private Boolean deletedFlag;
/**
* 是否同步(1-是,0-否)
*/
@TableField(fill = FieldFill.INSERT)
private Boolean syncFlag;
/**
* 排序号
*/
private Long sortNum;
/**
* 保留字段1
*/
private String reserved1;
/**
* 保留字段2
*/
private String reserved2;
/**
* 保留字段3
*/
private String reserved3;
/**
* 保留字段4
*/
private String reserved4;
/**
* 保留字段5
*/
private String reserved5;
/**
* 备注
*/
private String remark;
/**
* 货位编号(真实物理地址)
*/
private String goodsLocationRealNumber;
/**
* 优先级距离
*/
private Integer distance;
/**
* 坐标点
*/
private String pointLoc;
private String warehouseNumber;
private String saveMaterialType;
private String saveMaterialTypeName;
@Override
protected Serializable pkVal() {
return this.id;
}
}
扩展实体类代码
package com.ws.bus.sys.vo.BusGoodsLocationVO;
import com.ws.bus.sys.entity.BusGoodsLocation;
import lombok.Data;
import java.util.Date;
@Data
public class BusGoodsLocationVO extends BusGoodsLocation {
private String locationTypeName;
private String shelveName;
private String materielStatus;
private String materielStatusName;
private Integer materielNum;
//是否是编辑操作
private Integer editFlag;
//选中要查询的车间仓库
private String selected;
private Integer tdNum;
private Integer trNum;
private Integer isSelected;
private Date productDate;
private String trayNumber;
private Integer maxTrayAmount;
private Integer refundOrderFlag;
}