Shiro_项目_采购单

1 采购订单的模型分析

如果是下拉列表：一般是多对一，一对一
如果是复选框：一般是多对多,一对多
组合关系
1.整体和部分,整体和部分不能分割，本质还是双向一对多

2 代码实现

2.1 一方(主表)

@Entity
@Table(name = "purchasebill")
public class Purchasebill extends BaseDomain {
    //交易时间  前台传过来的
    private Date  vdate;
    //订单总金额----后台计算出来的
    private BigDecimal totalAmount;
    //订单数量----后台计算出来的
    private BigDecimal totalNum;
    //采购单录入时间---后台生成的
    private Date inputTime = new Date();
    //审核时间---后台生成的
    private Date auditorTime;
    //单据状态  0代表待审核   1代表已审核  -1代表审核失败，作废
    private Integer status = 0;
    //供应商
    @ManyToOne(fetch = FetchType.LAZY,optional = false)
    @JoinColumn(name = "supplier_id")
    private Supplier supplier;
    //审核人  录入的时候可以为空
    @ManyToOne(fetch = FetchType.LAZY)
    @JoinColumn(name = "auditor_id")
    private Employee auditor;
    //录入人  不能为空
    @ManyToOne(fetch = FetchType.LAZY,optional = false)
    @JoinColumn(name = "inputUser_id")
    private Employee inputUser;
    //采购员
    @ManyToOne(fetch = FetchType.LAZY,optional = false)
    @JoinColumn(name = "buyer_id")
    private Employee buyer;
    //明细   ALL 强级联
    //orphanRemoval  一方解除关系  去删除
    @OneToMany(cascade = CascadeType.ALL,fetch = FetchType.LAZY,mappedBy = "bill",orphanRemoval = true)
    private List<Purchasebillitem> items = new ArrayList<>();
    get()/set()方法

2.2 多方(从表)

@Entity
@Table(name = "purchasebillitem")
public class Purchasebillitem extends BaseDomain {
    //产品价格
    private BigDecimal price;
    //产品数量
    private BigDecimal num;
    //产品小计金额
    private BigDecimal amount;
    //产品描述
    private String descs;
    //产品
    @ManyToOne(fetch = FetchType.LAZY)
    @JoinColumn(name = "product_id")
    private Product product;
    //订单
    @ManyToOne(fetch = FetchType.LAZY)
    @JoinColumn(name = "bill_id")
    @JsonIgnore  //生成json数据的时候忽略这个属性
    private Purchasebill bill;

2.3 Purchasebill 日期处理

@JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss",timezone = "GMT+8")
public Date getVdate() {
    return vdate;
}

@DateTimeFormat(pattern = "yyyy-MM-dd")
public void setVdate(Date vdate) {
    this.vdate = vdate;
}

3 订单查询列表

3.1 purchasebill.jsp

<th width="20"  field="vdate">交易时间</th>
<th width="20"  field="supplier" data-options="formatter:formatObj">供应商</th>
<th width="20"  field="buyer"  data-options="formatter:formatEmp">采购员</th>
<th width="20"  field="totalNum">总数量</th>
<th width="20"  field="totalAmount" >总金额</th>
<th width="20"  field="status" data-options="formatter:formatStatus" >状态</th>

3.2 purchasebill.js

function formatObj(data) {
    if(data){
        return data.name;
    }
}
function formatEmp(data) {
    if(data){
        return data.username;
    }
}
function formatStatus(action) {
    var data = {
        0:"<div style='color:red;'>待审</div>",
        1:"<div style='color: green'>已审</div>",
        "-1":"<div><s>作废</s></div>"
    };
    return data[action];
}

效果图

3.3 查询条件的添加

<form id="searchForm" action="/purchasebill/download" method="post">
    日期 ： <input name="beginDate" class="easyui-datebox" style="height:32px" sharedCalendar="#cc">
    - <input name="endDate" class="easyui-datebox" style="height:32px" sharedCalendar="#cc">

    状态 ：<select class="easyui-combobox" name="status"
                data-options="panelHeight:'auto'"
     >
    <option value="">--请选择--</option>
    <option value="0">待审</option>
    <option value="-1">作废</option>
    <option value="1">已审</option>
</select>

purchasebillQuery.java

public class PurchasebillQuery extends BaseQuery {

    //SpringMVC接收日期的格式设置(建议写在setter上)
    @DateTimeFormat(pattern = "yyyy-MM-dd")
[SpringMVC接收日期需要加入相应的注解支持]    private Date beginDate;
    @DateTimeFormat(pattern = "yyyy-MM-dd")
    private Date endDate;
    private Integer status;
    @Override
    public Specification createSpecification(){
        //根据条件把数据返回即可
        Specification<Purchasebill> spec = Specifications.<Purchasebill>and()
                .eq(status!=null,"status",status )//等于
                .ge(beginDate!=null, "vdate",beginDate) //大于等于
                .le(endDate!=null, "vdate",endDate) //小于等于
                .build();

        return spec;
    }
    //getter,setter略…
}

4 添加修改 弹出对话框

<!-- 弹出相应的功能框 -->
<div id="purchasebillDialog" class="easyui-dialog" title="数据操作" data-options="closed:true,modal:true"  style="width:800px;padding:10px">
    <form id="purchasebillForm" method="post">
        <input id="purchasebillId" type="hidden" name="id">
        <table cellpadding="5">
            <tr>
                <td>交易时间:</td>
                <td><input class="easyui-datebox" type="text" name="vdate"></input></td>
            </tr>

            <tr>
                <td>供应商:</td>
                <td><input class="easyui-combobox" type="text" name="supplier.id"
                           data-options="panelHeight:'auto',valueField:'id',textField:'name',url:'/util/findAllSupplier'"
                ></input></td>
            </tr>
            <tr>
                <td>采购员:</td>
                <td><input class="easyui-combobox" type="text" name="buyer.id"  data-options="valueField:'id',textField:'username',url:'/util/findAllEmployee'"></input></td>
            </tr>
        </table>

        <!-- 明细表格-->
        <table id="gridItem"  title="明细编辑" style="width:100%;height:300px"></table>
        <!-- 采购单明细的按钮准备 -->
        <div id="itemBtns">
            <a href="javascript:;" id="btnInsert" class="easyui-linkbutton"
               data-options="iconCls:'icon-add',plain:true">添加</a>
            <a href="javascript:;" id="btnRemove" class="easyui-linkbutton"
               data-options="iconCls:'icon-remove',plain:true">删除</a>
        </div>
        <div style="text-align:center;padding:5px">
            <a href="javascript:void(0)" class="easyui-linkbutton" data-method="save">提交</a>
            <a href="javascript:void(0)" class="easyui-linkbutton" onclick="$('#purchasebillDialog').dialog('close')">取消</a>
        </div>
    </form>
</div>

4.1 采购明细单

//明细表格
    var dg = $("#gridItem"),
        //默认的行
        defaultRow = { productId:"", color: "", smallpic: "", num: "0", price: "0", amout: "0" ,descs:""},
        //插入的位置   bottom  底部插入
        insertPosition = "bottom";
    //表格初始化
    var dgInit = function () {
        //得到所有的列
        var getColumns = function () {
            //定义一个数组
            var result = [];
            //具体列的配置
            var normal = [
                {
                    field:'productId',title: '产品', width: 80,
                    editor: {
                        type:"combobox",
                        options:{
                            valueField:'id',
                            textField:'name',
                            panelHeight:'auto',
                            url:'/util/findAllProduct',
                            required: true
                        }
                    },
                    formatter:function(value,row){
                        return value.name;
                    }
                },
                {
                    field: 'color', title: '颜色', width: 100,
                    formatter:function (value, row) {
                        if (row){
                            return "<div style='width:20px;height:20px;background-color:"+row.productId.color+"'></div>";
                        }
                    }
                },
                {
                    field: 'smallpic', title: '图片', width: 100,
                    formatter:function (value, row) {
                        if (row && row.productId.smallpic){
                            return "<img src='"+row.productId.smallpic+"' style='width: 50px;height: 50px' />";
                        }
                    }
                },
                {
                    field: 'num', title: '产品数量', width: 80,
                    editor: {
                        type: "numberbox",
                        options: {
                            required: true
                        }
                    }
                },
                {
                    field: 'price', title: '价格', width: 80,
                    editor: {
                        type: "numberbox",
                        options: {
                            required: false
                        }
                    }
                },
                {
                    field: 'amout', title: '小计', width: 80,
                    formatter:function (value, row) {
                        if (row.num && row.price){
                            return row.num * row.price;
                        }
                    }
                },
                {
                    field: 'descs', title: '备注', width: 160,
                    editor: {
                        type: "textbox",
                        options: {
                            readonly: false
                        }
                    }
                }
            ];
            result.push(normal);

            return result;
        };
        //设置表格配置
        var options = {
            idField: "productId",
            rownumbers: true,
            fitColumns: true,
            fit: true,
            border: true,
            singleSelect: true,
            toolbar:"#itemBtns",
            columns: getColumns(),//得到所有列
            //表示开启单元格编辑功能
            enableCellEdit: true
        };
        //创建编辑表格
        dg.datagrid(options);

    };
    //定义方法  得到插入行的索引
    var getInsertRowIndex = function () {
        return insertPosition == "top" ? 0 : dg.datagrid("getRows").length;
    }
    //button绑定时间
    var buttonBindEvent = function () {
        //插入行的按钮
        $("#btnInsert").click(function () {
            //获取插入表格的位置  最末尾
            var targetIndex = getInsertRowIndex(), targetRow = $.extend({}, defaultRow, { ID: $.util.guid() });
            //在表格里面添加一行
            dg.datagrid("insertRow", { index: targetIndex, row: targetRow });
            //插入一行之后  定义到第一个单元格
            dg.datagrid("editCell", { index: 0, field: "productId" });
        });

        $("#btnRemove").click(function () {
            //得到选中的行
            var row = dg.datagrid("getSelected");
            if (row){
                //得到行索引
                var index = dg.datagrid("getRowIndex",row);
                //根据索引删除
                dg.datagrid("deleteRow",index);
            }
        });
    };

    //调用方法  初始化表格  创建表格
    dgInit();
    //绑定事件
    buttonBindEvent();

});

4.2 明细单保存

4.2.1 提交额外参数

onSubmit: function(param){
    //提交 封装items
    //得到明细表格里面的数据
    var rows = $("#gridItem").datagrid("getRows");
    for (var i = 0; i < rows.length; i++) {
        var rowData = rows[i];
        param["items["+i+"].descs"] = rowData.descs;
        param["items["+i+"].price"] = rowData.price;
        param["items["+i+"].num"] = rowData.num;
        param["items["+i+"].product.id"] = rowData.productId.id;
    }

    // 提交之前的验证
    return purchasebillForm.form('validate');
}

4.3 解决修改回显问题

edit:function(){
    //选择一条数据进行修改
    var row = purchasebillGrid.datagrid('getSelected');
    if(row){
        //弹出对话框
        purchasebillDialog.dialog('center').dialog('open');
        //供货商
        if (row.supplier){
            row["supplier.id"] = row.supplier.id;
        }
        //采购员
        if (row.buyer){
            row["buyer.id"] = row.buyer.id;
        }

        //明细表格回显
        //加载相应的数据(要看product的名称是否可以对应上)
        for (var i = 0; i < row.items.length; i++) {
            var item = row.items[i];
            item["productId"] = item.product;
        }
        var items = $.extend([], row.items);
        $("#gridItem").datagrid("loadData", items);
        //修改 -- 回显示数据
        purchasebillForm.form('load',row);
    }else{
        //提示用户
        $.messager.alert('温馨提示：','请选中一条数据进行修改','info');
        return;
    }

}

5 解决n-to-n问题

设置所有关联对象为null

purchasebill.setBuyer(null);
purchasebill.setSupplier(null);
purchasebill.getItems().clear();