• 根据表头排序


      1 <%--
      2   Created by IntelliJ IDEA.
      3   User: Administrator
      4   Date: 2014/6/12
      5   Time: 15:57
      6   To change this template use File | Settings | File Templates.
      7 --%>
      8 <%@ page contentType="text/html;charset=UTF-8" language="java" %>
      9 <%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
     10 <%@taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
     11 <%@taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
     12 <html>
     13 <head>
     14     <title>应用数据统计</title>
     15 
     16     <style type="text/css">
     17         div.main {
     18             /* 1400px;*/
     19             /*margin: auto;*/
     20         }
     21 
     22         table {
     23             width: 96%;
     24             font-family: verdana, arial, sans-serif;
     25             font-size: 11px;
     26             color: #333333;
     27             border: 1px #666666;
     28             border-collapse: collapse;
     29             /*table-layout: fixed;*/
     30         }
     31 
     32         th {
     33             padding: 8px;
     34             border: 1px solid #666666;
     35             background-color: #dedede;
     36             white-space: nowrap;
     37         }
     38 
     39         td {
     40             padding: 8px;
     41             border: 1px solid #666666;
     42             background-color: #ffffff;
     43             text-align: right;
     44             white-space: nowrap;
     45         }
     46 
     47         a.myService {
     48             color: red;
     49         }
     50 
     51         td.gt {
     52             color: red;
     53         }
     54 
     55         td.lt {
     56             color: green;
     57         }
     58     </style>
     59 
     60     <%--<script type="text/javascript" src="<c:url value="/js/jquery/jquery-1.8.3.min.js"/>"></script>--%>
     61     <%--<script type="text/javascript" src="<c:url value="/js/My97DatePicker/WdatePicker.js"/>"></script>--%>
     62     <script type="text/javascript" src="<c:url value="/js/util.js"/>"></script>
     63 </head>
     64 <body>
     65 <div class="main">
     66     <div style="text-align: center; font-size: 14px; font-weight: bold;">直通车汇总报表</div>
     67     <form id="form1" action="<c:url value="/queryZtcSumReport.do"/>" method="post" autocomplete="off">
     68         <div>
     69             <input type="hidden" name="order" value="${ztcData.order}">
     70             <input type="hidden" name="orderAsc" value="${ztcData.orderAsc}">
     71             开始日期:<input type="text" name="begintime"
     72                         value="<fmt:formatDate pattern="yyyy-MM-dd" value="${ztcData.begintime}"/>"
     73                         style=" 100px;" maxlength="10" onClick="WdatePicker()">
     74             结束日期:<input type="text" name="endtime"
     75                         value="<fmt:formatDate pattern="yyyy-MM-dd" value="${ztcData.endtime}"/>"
     76                         style=" 100px;" maxlength="10" onClick="WdatePicker()">
     77             <input type="radio" id="serviceType-pt" name="serviceType"
     78                    value="" ${empty ztcData.serviceType?'checked':''}><label for="serviceType-pt">普通版</label>
     79             <input type="radio" id="serviceType-pc" name="serviceType"
     80                    value="pc" ${ztcData.serviceType=='pc'?'checked':''}><label for="serviceType-pc">PC千牛版</label>
     81             <input type="radio" id="serviceType-mb" name="serviceType"
     82                    value="mb" ${ztcData.serviceType=='mb'?'checked':''}><label for="serviceType-mb">手机千牛版</label>
     83             <input type="radio" id="serviceType-all" name="serviceType"
     84                    value="all" ${ztcData.serviceType=='all'?'checked':''}><label for="serviceType-all">全部</label>
     85             <input type="submit" id="query" value=" 查 询 ">
     86         </div>
     87         <div>
     88             <input type="button" id="queryLastWeek" value=" 上 周 ">
     89             <input type="button" id="queryThisWeek" value=" 本 周 ">
     90             <input type="button" id="queryLastMonth" value=" 上 月 ">
     91             <input type="button" id="queryThisMonth" value=" 本 月 ">
     92         </div>
     93     </form>
     94     <table>
     95         <tr>
     96             <th style="30px">序号</th>
     97             <th style="200px">
     98                 <a href="javascript:void(0);" class="order" orderField="serviceName">应用名</a>
     99             </th>
    100             <th style="50px"><a href="javascript:void(0);" class="order" orderField="price">价格</a></th>
    101             <th style="50px"><a href="javascript:void(0);" class="order" orderField="grade">评分</a></th>
    102             <th style="60px"><a href="javascript:void(0);" class="order" orderField="rateCount">有效评价</a></th>
    103             <th style="50px"><a href="javascript:void(0);" class="order" orderField="userNum">使用人数</a></th>
    104             <th style="60px"><a href="javascript:void(0);" class="order" orderField="faredUse">付费使用</a></th>
    105             <th style="60px"><a href="javascript:void(0);" class="order" orderField="freeUse">免费使用</a></th>
    106             <th style="60px"><a href="javascript:void(0);" class="order" orderField="pageView">浏览数</a></th>
    107             <th style="60px">可用性</th>
    108             <th style="60px">服务态度</th>
    109             <th style="60px">稳定性</th>
    110             <%--<th style="60px">日期</th>--%>
    111             <th style="50px"><a href="javascript:void(0);" class="order" orderField="dayTrading">订单数</a></th>
    112             <th style="50px"><a href="javascript:void(0);" class="order" orderField="dayUser">账户数</a></th>
    113             <th style="50px"><a href="javascript:void(0);" class="order" orderField="monthTrading">本月累计</a></th>
    114         </tr>
    115         <c:forEach items="${ztcDataList}" var="row" varStatus="num">
    116             <c:set var="rateCount" value="${rateCount+row.rateCount}"/>
    117             <c:set var="userNum" value="${userNum+row.userNum}"/>
    118             <c:set var="faredUse" value="${faredUse+row.faredUse}"/>
    119             <c:set var="freeUse" value="${freeUse+row.freeUse}"/>
    120             <c:set var="pageView" value="${pageView+row.pageView}"/>
    121             <c:set var="dayTrading" value="${dayTrading+row.dayTrading}"/>
    122             <c:set var="dayUser" value="${dayUser+row.dayUser}"/>
    123             <c:set var="monthTrading" value="${monthTrading+row.monthTrading}"/>
    124             <tr>
    125                 <td>${num.index+1}</td>
    126                 <td style="text-align: left;">
    127                     <a name="ztcHistory" href="<c:url value="/getZtcDataHistory.do"/>?serviceCode=${row.serviceCode}"
    128                        target="_self"
    129                        <c:if test="${row.serviceCode=='FW_GOODS-1947940'}">class="myService"</c:if>>${row.serviceName}</a>
    130                 </td>
    131                 <td><fmt:formatNumber pattern="#,##0" value="${row.price}"/></td>
    132                 <td><fmt:formatNumber pattern="#,##0.0" value="${row.grade}"/></td>
    133                 <td><fmt:formatNumber pattern="#,###" value="${row.rateCount}"/></td>
    134                 <td><fmt:formatNumber pattern="#,##0" value="${row.userNum}"/></td>
    135                 <td><fmt:formatNumber pattern="#,###" value="${row.faredUse}"/></td>
    136                 <td><fmt:formatNumber pattern="#,###" value="${row.freeUse}"/></td>
    137                 <td><fmt:formatNumber pattern="#,###" value="${row.pageView}"/></td>
    138                 <td class="${fn:contains(row.usability, '高于')?'gt':(fn:contains(row.usability, '低于')?'lt':'')}">${row.usability}</td>
    139                 <td class="${fn:contains(row.serviceAttitude, '高于')?'gt':(fn:contains(row.serviceAttitude, '低于')?'lt':'')}">${row.serviceAttitude}</td>
    140                 <td class="${fn:contains(row.stability, '高于')?'gt':(fn:contains(row.stability, '低于')?'lt':'')}">${row.stability}</td>
    141                     <%--<td><fmt:formatDate pattern="yyyy-MM-dd" value="${row.tradeSumDate}"/></td>--%>
    142                 <td><fmt:formatNumber pattern="#,###" value="${row.dayTrading}"/></td>
    143                 <td><fmt:formatNumber pattern="#,###" value="${row.dayUser}"/></td>
    144                 <td><fmt:formatNumber pattern="#,###" value="${row.monthTrading}"/></td>
    145             </tr>
    146         </c:forEach>
    147         <tr>
    148             <td colspan="4" style="text-align: center">
    149                 <a name="summary" href="<c:url value="/queryZtcDataMonthReport.do"/>" target="_self">合计</a>150                 ${fn:length(ztcDataList)} 项
    151             </td>
    152             <td><fmt:formatNumber pattern="#,###" value="${rateCount}"/></td>
    153             <td><fmt:formatNumber pattern="#,##0" value="${userNum}"/></td>
    154             <td><fmt:formatNumber pattern="#,###" value="${faredUse}"/></td>
    155             <td><fmt:formatNumber pattern="#,###" value="${freeUse}"/></td>
    156             <td><fmt:formatNumber pattern="#,###" value="${pageView}"/></td>
    157             <td colspan="3"></td>
    158             <td><fmt:formatNumber pattern="#,###" value="${dayTrading}"/></td>
    159             <td><fmt:formatNumber pattern="#,###" value="${dayUser}"/></td>
    160             <td><fmt:formatNumber pattern="#,###" value="${monthTrading}"/></td>
    161         </tr>
    162     </table>
    163 </div>
    164 <script type="text/javascript">
    165     $(function () {
    166         $("a.order").click(function () {
    167             var orderField = $(this).attr("orderField");
    168             if (orderField != $("input[name=order]").val()) {
    169                 $("input[name=order]").val(orderField);
    170                 $("input[name=orderAsc]").val("desc");
    171             } else {
    172                 if ($("input[name=orderAsc]").val() == "asc") {
    173                     $("input[name=orderAsc]").val("desc");
    174                 } else {
    175                     $("input[name=orderAsc]").val("asc");
    176                 }
    177             }
    178             $("#form1").submit();
    179         });
    180 
    181         $("#query").click(function () {
    182             $("input[name=order]").val("");
    183             $("input[name=orderAsc]").val("");
    184         });
    185 
    186         $(":radio[name=serviceType]").click(function () {
    187             $("#form1").submit();
    188         });
    189 
    190         $("#queryLastWeek").click(function () {
    191 //            var date = new Date($("input[name=endtime]").val());
    192 //            if (!date) {
    193 //                date = new Date();
    194 //            }
    195             var date = new Date();
    196             date.setDate(date.getDate() - 7);
    197             var endtime = date.format("yyyy-MM-dd");
    198             date.setDate(date.getDate() - 6);
    199             var begintime = date.format("yyyy-MM-dd");
    200             $("input[name=begintime]").val(begintime);
    201             $("input[name=endtime]").val(endtime);
    202             $("#form1").submit();
    203         });
    204 
    205         $("#queryThisWeek").click(function () {
    206             var date = new Date();
    207             var endtime = date.format("yyyy-MM-dd");
    208             date.setDate(date.getDate() - 6);
    209             var begintime = date.format("yyyy-MM-dd");
    210             $("input[name=begintime]").val(begintime);
    211             $("input[name=endtime]").val(endtime);
    212             $("#form1").submit();
    213         });
    214 
    215         $("#queryLastMonth").click(function () {
    216 //            var date = new Date($("input[name=endtime]").val());
    217 //            if (!date) {
    218 //                date = new Date();
    219 //            }
    220             var date = new Date();
    221             date.setDate(0);
    222             var endtime = date.format("yyyy-MM-dd");
    223             date.setDate(1);
    224             var begintime = date.format("yyyy-MM-dd");
    225             $("input[name=begintime]").val(begintime);
    226             $("input[name=endtime]").val(endtime);
    227             $("#form1").submit();
    228         });
    229 
    230         $("#queryThisMonth").click(function () {
    231             var date = new Date();
    232             var endtime = date.format("yyyy-MM-dd");
    233             date.setDate(1);
    234             var begintime = date.format("yyyy-MM-dd");
    235             $("input[name=begintime]").val(begintime);
    236             $("input[name=endtime]").val(endtime);
    237             $("#form1").submit();
    238         });
    239 
    240         $("a[name=ztcHistory],a[name=summary]").click(function (e) {
    241             $.get($(this).attr("href"), function (data) {
    242                 $("#contentInner").html(data);
    243                 window.scrollTo(0, 0);
    244             });
    245             e.preventDefault();
    246             return false;
    247         });
    248     });
    249 </script>
    250 </body>
    251 </html>
  • 相关阅读:
    记录下IE7下的input标签bug
    CYQ.Data 轻量数据访问层(一) 概述
    网站安装打包 软件环境检测与安装[二] 上
    记录下关于调用RAR解压缩的问题
    CYQ.Data 轻量数据访问层(六) 构造数据表
    记绕过路由封杀问题
    MapXtreme 2005 学习心得 一些问题(八)
    网站安装打包 修改app.config[六]
    关于控件导出Excel格式问题的新解决方案
    CYQ.Data 轻量数据访问层(二) 构造数据单元(上)
  • 原文地址:https://www.cnblogs.com/w8104254/p/3855883.html
Copyright © 2020-2023  润新知