報表頁數(shù)據(jù)顯示

本項目中以商品采購信息為例，統(tǒng)計采購指定時間，指定供應(yīng)商對應(yīng)的采購報表信息，并以數(shù)據(jù)加圖片的形式展示。

2.基于頁面結(jié)構(gòu)，設(shè)置采購鏈接對應(yīng)的顯示信息頁面

• 當(dāng)前僅制作根據(jù)商品名進行報表統(tǒng)計，也可以根據(jù)采購人員進行報表統(tǒng)計，由于每個報表頁的顯示格式均不相同，此處點擊銷售人員后，應(yīng)該重新跳轉(zhuǎn)到全新的頁面，而不是當(dāng)前頁面更換數(shù)據(jù)。
• 報表不對應(yīng)全新的數(shù)據(jù)，是對其他數(shù)據(jù)的統(tǒng)計，因此無需設(shè)置Model，但是需要設(shè)置查詢模型，封裝查詢條件
• 查詢條件在設(shè)置時根據(jù)頁面結(jié)構(gòu)進行設(shè)計，無需設(shè)置為模型結(jié)構(gòu)的條件
  查詢模型設(shè)計如下：

package org.sihai.qualitycontrol.invoice.bill.vo;import org.sihai.qualitycontrol.util.base.BaseQueryModel;public class BillQueryModel implements BaseQueryModel{// TODO 添加自定義查詢條件private Integer type;private Long supplierUuid;private Long start;private Long end;private Long goodsUuid;private Integer orderType;public Integer getOrderType() {return orderType;}public void setOrderType(Integer orderType) {this.orderType = orderType;}public Integer getType() {return type;}public void setType(Integer type) {this.type = type;}public Long getSupplierUuid() {return supplierUuid;}public void setSupplierUuid(Long supplierUuid) {this.supplierUuid = supplierUuid;}public Long getStart() {return start;}public void setStart(Long start) {this.start = start;}public Long getEnd() {return end;}public void setEnd(Long end) {this.end = end;}public Long getGoodsUuid() {return goodsUuid;}public void setGoodsUuid(Long goodsUuid) {this.goodsUuid = goodsUuid;}}

3.設(shè)置進入頁面的數(shù)據(jù)加載

• Action

public String buyBillList(){//查詢所有的供應(yīng)商List<SupplierModel> supplierList = supplierEbi.getAll();put("supplierList", supplierList);//加載符合條件的報表信息List<Object[]> billList = billEbi.getAllByBill(bqm);put("billList", billList);return "buyBillList";}

• Ebo
  添加固定查詢條件為采購類訂單。項目中的采購報表與銷售報表從入口鏈接中已經(jīng)進行了區(qū)分，此處可以制作獨立的方法，如果制作通用方法，則通過表現(xiàn)層傳遞參數(shù)完成，業(yè)務(wù)層加載參數(shù)進行設(shè)置，可以進行有效的合并。但是基于業(yè)務(wù)層方法名應(yīng)該展現(xiàn)業(yè)務(wù)名稱，可以考慮制作成獨立的方法分門別類進行管理書寫。或者抽象出私有方法進行間接訪問。

public List<OrderDetailModel> getBillByGoods(BillQueryModel bqm) {bqm.setOrderType(OrdersModel.ORDER_ORDERTYPE_OF_BUY);return billDao.getBillByGoods(bqm);}

• Impl
  根據(jù)報表所要展示的數(shù)據(jù)，首先拼寫SQL語句，建議先將語句寫好，然后轉(zhuǎn)化為QBC查詢。根據(jù)頁面展示的內(nèi)容為商品名稱與對應(yīng)的數(shù)據(jù)得知報表最終顯示數(shù)據(jù)對應(yīng)訂單明細（子單）數(shù)據(jù)。
  A. 設(shè)置查詢投影為商品信息與統(tǒng)計信息
  B. 顯示的內(nèi)容為相同的商品累加在一起，需要對商品進行分組，添加分組條件
  C. 根據(jù)查詢條件，完成查詢內(nèi)容的設(shè)計

/*select od.goodsUuid, g.name, sum(od.num)fromtbl_orderdetail od,tbl_goods gwhereg.uuid = od.goodsUuidgroup byod.goodsUuid*/hql：select gm,sum(num) from OrderDetailModel group by gm.uuid

• 對上述查詢內(nèi)容實現(xiàn)QBC查詢設(shè)置
• 投影設(shè)置
• 查詢條件設(shè)置

public List<Object[]> getAllByBill(BillQueryModel bqm) {DetachedCriteria dc = DetachedCriteria.forClass(OrderDetailModel.class);//設(shè)置一條查詢的查詢結(jié)果內(nèi)容為多個內(nèi)容ProjectionList plist = Projections.projectionList();//分組(HQL,SQL中使用分組采用group by來完成，QBC中分組是使用投影完成的)plist.add(Projections.groupProperty("gm"));//select的內(nèi)容plist.add(Projections.sum("num"));// select gm,sum(num) from ...... group by gmdc.setProjection(plist);//條件dc.createAlias("om", "o");if(bqm.getType() != null && bqm.getType() != -1){dc.add(Restrictions.eq("o.type", bqm.getType()));}if(bqm.getSupplierUuid() != null && bqm.getSupplierUuid() != -1){dc.createAlias("o.sm", "s");dc.add(Restrictions.eq("s.uuid", bqm.getSupplierUuid()));}return this.getHibernateTemplate().findByCriteria(dc);}

4.將數(shù)據(jù)返回到頁面進行展示，重啟服務(wù)器，測試結(jié)果

• 頁面使用迭代數(shù)組的格式進行

<s:iterator value="billList" var="objs"><tr align="center" bgcolor="#FFFFFF"><td colspan="2" width="30%" height="30">${objs[0].name}</td><td colspan="2">${objs[1]}</td><td><a href="javascript:void(0)" class="xiu info" value="1">詳情</a></td></tr></s:iterator>

5.為任意數(shù)據(jù)添加明細數(shù)據(jù)查看功能

詳情設(shè)置可以使用各種各樣的格式，例如彈出DIV，刷新該頁面等等。此處為加強jquery對象的操作能力，設(shè)置為當(dāng)前頁面數(shù)據(jù)下方添加顯示內(nèi)容。

6.為詳情鏈接綁定事件
7.添加ajax請求獲取數(shù)據(jù)

• 獲取數(shù)據(jù)需求分析：
  此處點擊后展示指定商品所有的明細數(shù)據(jù)，條件為頁面輸入條件。供應(yīng)商數(shù)據(jù)已經(jīng)沒有使用意義，畢竟商品具體化后，供應(yīng)商是不可能發(fā)生概念的。
• 設(shè)置ajax查詢對應(yīng)的json格式參數(shù)

$(".info").click(function(){var jsonParam = {"bqm.goodsUuid":$(this).attr("value")};//jsonParam["bqm.time"]= $("[name='bqm.time']").val();//jsonParam["bqm.time2"]= $("[name='bqm.time2']").val();jsonParam["bqm.type"]= $("[name='bqm.type']").val();

8.設(shè)置ajax提交請求

$.post("bill_ajaxGetBillByGoods.action",jsonParam,function(data){

9.后臺根據(jù)查詢條件獲取對應(yīng)的訂單明細全數(shù)據(jù)

• Action

//根據(jù)商品獲取報表明細public String ajaxGetBillByGoods(){billGoodsList = billEbi.getBillByGoods(bqm);return "ajaxGetBillByGoods";}

• Ebo

public List<OrderDetailModel> getBillByGoods(BillQueryModel bqm) {bqm.setOrderType(OrdersModel.ORDER_ORDERTYPE_OF_BUY);return billDao.getBillByGoods(bqm);}

• Impl
  數(shù)據(jù)層中設(shè)置訂單類別為固定查詢條件，貨物為固定查詢條件

public List<OrderDetailModel> getBillByGoods(BillQueryModel bqm) {//goodsUuid，type，DetachedCriteria dc = DetachedCriteria.forClass(OrderDetailModel.class);dc.createAlias("om", "o");//設(shè)置訂單類型為進貨dc.add(Restrictions.eq("o.orderType", bqm.getOrderType()));//設(shè)置動態(tài)條件if(bqm.getGoodsUuid() != null && bqm.getGoodsUuid() != -1){dc.createAlias("gm", "g");dc.add(Restrictions.eq("g.uuid", bqm.getGoodsUuid()));}if(bqm.getType() != null && bqm.getType() != -1){dc.add(Restrictions.eq("o.type", bqm.getType()));}return this.getHibernateTemplate().findByCriteria(dc);}

strut.xml設(shè)置ajax映射數(shù)據(jù)模型，所需數(shù)據(jù)一定是頁面展示數(shù)據(jù)或頁面展示計算相關(guān)的數(shù)據(jù)，例如價格數(shù)據(jù)，用于計算總價格，而不直接顯示

<!-- Bill --><action name="bill_*" class="billAction" method="{1}"><result name="buyBillList">/WEB-INF/jsps/bill/buyBillList.jsp</result><!-- ajax --><result name="ajaxGetBillByGoods" type="json"><param name="root">action</param><param name="includeProperties">billGoodsList\[\d+\]\.om\.orderNum,billGoodsList\[\d+\]\.om\.createTimeView,billGoodsList\[\d+\]\.num,billGoodsList\[\d+\]\.price</param></result></action>

10.將ajax獲取json數(shù)據(jù)拼成指定格式，進行顯示
拼裝顯示表頭，該格式可從靜態(tài)頁面中點擊后生成的數(shù)據(jù)中直接獲取，靜態(tài)頁面并不直接顯示該數(shù)據(jù)。
- 拼裝顯示數(shù)據(jù)
- 拼裝顯示表尾統(tǒng)計信息

11.當(dāng)前顯示的明細信息數(shù)據(jù)量過于大，顯示其中一個后，其他的顯示空間基本上沒有了

為所有的動態(tài)生成行對象添加class，當(dāng)顯示某一個明細信息時，將其他動態(tài)生成的行對象刪除

12.最后設(shè)置查看的信息點擊后隱藏，與用戶進行友好的UI交互

<script type="text/javascript">$(function() {$("#query").click(function() {$("form:first").submit();});$(".ajaxMsg").live("click",function(){$(".ajaxMsg").empty();});$(".info").click(function(){var jsonParam = {"bqm.goodsUuid":$(this).attr("value")};//jsonParam["bqm.time"]= $("[name='bqm.time']").val();//jsonParam["bqm.time2"]= $("[name='bqm.time2']").val();jsonParam["bqm.type"]= $("[name='bqm.type']").val();var $tt = $(this).parent().parent();//將制定標(biāo)記tr刪除$('.ajaxMsg').empty();//每個tr對象都帶有一個class="ajaxMsg",用于后期操作刪除標(biāo)記//動態(tài)添加一個tr行,用于做標(biāo)題欄//創(chuàng)建tr組件var $trHead = $("<tr align='center' class='ajaxMsg' style='background:url(images/table_bg.gif) repeat-x;'></tr>");var $td1 = $("<td height='30'>訂單號</td>");$trHead.append($td1);var $td2 = $("<td>訂單時間</td>");$trHead.append($td2);var $td3 = $("<td>數(shù)量</td>");$trHead.append($td3);var $td4 = $("<td>單價</td>");$trHead.append($td4);var $td5 = $("<td>合計</td>");$trHead.append($td5);$tt.after($trHead);$tt=$trHead;//--------------------------------------------------------------------------$.post("bill_ajaxGetBillByGoods.action",jsonParam,function(data){//billGoodsList[num,om,price]var sum = 0;var billGoodsList = data.billGoodsList;for(var i = 0;i<billGoodsList.length;i++){var billGoods = billGoodsList[i];for(var j = 0; j<billGoods.length; j++){var om = billGoods[j];alert(billGoods.num);var $tr = $("<tr align='center' class='ajaxMsg'></tr>");//共計5列var $td1 = $("<td height='30'>"+om.orderNum+"</td>");$tr.append($td1);var $td2 = $("<td>"+om.createTimeView+"</td>");$tr.append($td2);var $td3 = $("<td>"+billGoods.num+"</td>");$tr.append($td3);var $td4 = $("<td align='right'>"+billGoods.price+"&nbsp;元</td>");$tr.append($td4);var $td5 = $("<td align='right'>"+billGoods.num*billGoods.price+"&nbsp;元</td>");$tr.append($td5);$tt.after($tr);$tt=$tr;}sum = sum + billGoods.num*billGoods.price;}//--------------------------------------------------------------------------var $trFoot = $("<tr align='center' class='ajaxMsg'></tr>");var $td1 = $("<td align='right' colspan='4' height='30'>總計：</td>");$trFoot.append($td1);var $td2 = $("<td align='right'>"+intToFloat(sum)+"&nbsp;元</td>");$trFoot.append($td2);$tt.after($trFoot);$tt=$trHead;});});function intToFloat(val){return new Number(val).toFixed(2);}});

總結(jié)

以上是生活随笔為你收集整理的【struts2+hibernate+spring项目实战】ajax+jquery报表数据显示（ssh）的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。