微信前台WEUI前台实例+EXCEL导出，SSM框架完整流程

最新推荐文章于 2022-09-16 11:06:33 发布

linsa_pursuer

最新推荐文章于 2022-09-16 11:06:33 发布

阅读量4.5k

点赞数

分类专栏： JSP应用 Java常用API及工具类文章标签： SSM框架 EXCEL导出微信页面设计表格横向滑动 WEUI使用

本文链接：https://blog.csdn.net/linsa_pursuer/article/details/80693608

版权

Java常用API及工具类同时被 2 个专栏收录

24 篇文章 0 订阅

订阅专栏

JSP应用

9 篇文章 0 订阅

订阅专栏

此博客引用css和js下载地址：

https://download.csdn.net/download/linsa_pursuer/10479055

1.EXCEL工具类（导入jar包poi）

package com.taxsearch.entity;

import java.util.Date;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.apache.poi.hssf.usermodel.HSSFCell;
import org.apache.poi.hssf.usermodel.HSSFCellStyle;
import org.apache.poi.hssf.usermodel.HSSFFont;
import org.apache.poi.hssf.usermodel.HSSFSheet;
import org.apache.poi.hssf.usermodel.HSSFWorkbook;
import org.springframework.web.servlet.view.document.AbstractExcelView;

/**
* 导入到EXCEL
* 类名称：ObjectExcelView.java
* 类描述： 
* @author FH
* 作者单位： 
* 联系方式：
* @version 1.0
 */
public class ObjectExcelView extends AbstractExcelView{

	@Override
	protected void buildExcelDocument(Map<String, Object> model,
			HSSFWorkbook workbook, HttpServletRequest request,
			HttpServletResponse response) throws Exception {
		// TODO Auto-generated method stub
		Date date = new Date();
		String file = (String) model.get("NSRMC");
		String filename = file+Tools.date2Str(date, "yyyyMMddHHmmss");
		HSSFSheet sheet;
		HSSFCell cell;
		response.setContentType("application/octet-stream");
		response.setHeader("Content-Disposition", "attachment;filename="+java.net.URLEncoder.encode(filename, "UTF-8")+".xls");
		sheet = workbook.createSheet("sheet1");
		
		List<String> titles = (List<String>) model.get("titles");
		int len = titles.size();
		HSSFCellStyle headerStyle = workbook.createCellStyle(); //标题样式
		headerStyle.setAlignment(HSSFCellStyle.ALIGN_CENTER);
		headerStyle.setVerticalAlignment(HSSFCellStyle.VERTICAL_CENTER);
		HSSFFont headerFont = workbook.createFont();	//标题字体
		headerFont.setBoldweight(HSSFFont.BOLDWEIGHT_BOLD);
		headerFont.setFontHeightInPoints((short)11);
		headerStyle.setFont(headerFont);
		short width = 20,height=25*20;
		sheet.setDefaultColumnWidth(width);
		for(int i=0; i<len; i++){ //设置标题
			String title = titles.get(i);
			cell = getCell(sheet, 0, i);
			cell.setCellStyle(headerStyle);
			setText(cell,title);
		}
		sheet.getRow(0).setHeight(height);
		
		HSSFCellStyle contentStyle = workbook.createCellStyle(); //内容样式
		contentStyle.setAlignment(HSSFCellStyle.ALIGN_CENTER);
		List<HashMap> varList = (List<HashMap>) model.get("varList");
		int varCount = varList.size();
		for(int i=0; i<varCount; i++){
			HashMap vpd = varList.get(i);
			for(int j=0;j<len;j++){
				String varstr = vpd.get("var"+(j+1)).toString() != null ? vpd.get("var"+(j+1)).toString() : "";
				cell = getCell(sheet, i+1, j);
				cell.setCellStyle(contentStyle);
				setText(cell,varstr);
			}
			
		}
		
	}

}

package com.taxsearch.entity;

import java.text.SimpleDateFormat;
import java.util.Date;

public class Tools {
	/**
	 * 按照参数format的格式，日期转字符串
	 * @param date
	 * @param format
	 * @return
	 */
	public static String date2Str(Date date,String format){
		if(date!=null){
			SimpleDateFormat sdf = new SimpleDateFormat(format);
			return sdf.format(date);
		}else{
			return "";
		}
	}
}

2.台账mapper——>dao——>service——>controller——>jsp（导入jar包pagehelper）

a）EXCEL处理了前后端请求数据交互的编码问题

b）

c）JSP处理了弹出框问题

搜索数据异步刷新问题，不刷新页面，刷新json到页面，改变页面一部分

overflow-y:auto;子页面内容溢出，高度不变，子页面增加滑动条

（注意，用了父页面，若不用删除js部分父页面代码即可）

1）CreateCountMapper.xml（mapper）

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.taxsearch.dao.CreateCountMapper">
	<!-- 包含所有字段的SQL片段 -->
	<sql id="showAll">
		s.FPDM,s.FPHM,to_char(s.KPRQ,'yyyy-mm-dd') RQ,s.JE,s.SE,s.KPYF,to_char(G.RZSJ,'yyyy-mm-dd') RZSJ,s.XFMC
	</sql>
	
	<select id="createCountList" resultType="HashMap" parameterType="HashMap">
		select <include refid="showAll"/>,G.CHBZ SFCH,G.ETCBZ SFTXF,nullif(r.FPDM,'') SFRZ
		from DZFPGXRZ G
		LEFT JOIN DZDZ_FPXX_DZFP s ON s.FPDM = G .FPDM
      	AND G .FPHM = s.FPHM
		LEFT JOIN DZDZ_DHX_FPXX r ON r.FPDM = s .FPDM
      	AND s .FPHM = r.FPHM
		WHERE
      	(G.SHXYDM = #{SHXYDM,jdbcType=VARCHAR}
      	or
      	G.NSRSBH = #{NSRSBH,jdbcType=VARCHAR})
      	AND G.RZSJ IS  NOT NULL
		<if test="begin != null and begin != ''">
			AND G.RZSJ >= to_date(#{begin},'yyyy-mm-dd')
		</if>
		<if test="end != null and end != ''">
			AND to_char(G.RZSJ,'yyyy-mm-dd') <= #{end,jdbcType=VARCHAR}
		</if>
		<if test="fpdm != null and fpdm != ''">
			AND G.FPDM=#{fpdm,jdbcType=VARCHAR}
		</if>
		<if test="fphm != null and fphm != ''">
			AND G.FPHM=#{fphm,jdbcType=VARCHAR}
		</if>
		ORDER BY G.RZSJ
	</select>
	
	<select id="searchByList" resultType="HashMap"  parameterType="HashMap">
		select <include refid="showAll"/>
		from DZFPGXRZ G
		LEFT JOIN DZDZ_FPXX_DZFP s ON s.FPDM = G .FPDM
      	AND G .FPHM = s.FPHM
		WHERE
      	(G.SHXYDM = #{SHXYDM,jdbcType=VARCHAR}
      	or
      	G.NSRSBH = #{NSRSBH,jdbcType=VARCHAR})
      	AND G.RZSJ IS  NOT NULL
		AND to_char(G.RZSJ,'yyyy-MM')=#{kpyf,jdbcType=VARCHAR}
		ORDER BY G.RZSJ
	</select>
</mapper>

2）CreateCountMapper.java（dao）

package com.taxsearch.dao;

import java.util.HashMap;
import java.util.List;

/**
 * 
 * @Title:CreateCount
 * @Description: 台账自动生成接口
 * @author linsa
 * @version V1.0
 * @date 2018年5月10日
 */
public interface CreateCountMapper {
	/**
	 * 查询台账列表
	 * @param data
	 */
	public List<HashMap> createCountList(HashMap data);
	
	/**
	 * 查询导出EXCEL信息
	 * @param data
	 */
	public List<HashMap> searchByList(HashMap data);
}

3）CreateCountService.java（service）

package com.taxsearch.service;

import java.util.HashMap;
import java.util.List;

import javax.annotation.Resource;

import org.springframework.stereotype.Service;

import com.taxsearch.dao.CreateCountMapper;


/**
 * 
 * @Title:CreateCount
 * @Description: 台账自动生成业务逻辑
 * @author linsa
 * @version V1.0
 * @date 2018年5月10日
 */
@Service
public class CreateCountService {
	@Resource
	CreateCountMapper createCountMapper;
	
	/**
	 * 查询台账列表
	 * @param data
	 */
	public List<HashMap> createCountList(HashMap data){
		return createCountMapper.createCountList(data);
	}
	
	/**
	 * 查询导出EXCEL信息
	 * @param data
	 */
	public List<HashMap> searchByList(HashMap data){
		return createCountMapper.searchByList(data);
	}
}

4）CreateCountController.java（controller）

package com.taxsearch.controller.sj;

import java.text.SimpleDateFormat;
import java.util.ArrayList;
import java.util.Calendar;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

import javax.annotation.Resource;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.servlet.ModelAndView;

import com.github.pagehelper.PageHelper;
import com.github.pagehelper.PageInfo;
import com.taxsearch.commons.BaseController;
import com.taxsearch.entity.ObjectExcelView;
import com.taxsearch.entity.PageData;
import com.taxsearch.entity.base.Json;
import com.taxsearch.service.CreateCountService;

/**
 * 
 * @Title:CreateCount
 * @Description: 台账自动生成控制器
 * @author linsa
 * @version V1.0
 * @date 2018年5月10日
 */
@Controller
@RequestMapping("/createCount")
public class CreateCountController extends BaseController{
	@Resource
	private CreateCountService createCountService;
	/**
     * 页面展示
     * @param page
     * @return
     */
    @RequestMapping("/list")
    @ResponseBody
    public ModelAndView list(@RequestParam(required=false,defaultValue="1",value="page")Integer page,
    		String begin,String end,String NSRSBH,String SHXYDM,String fpdm,String fphm){
    	 ModelAndView mav = this.getModelAndView();
    	 try {
    		//在查询之前传入当前页，然后多少记录 
    		PageHelper.startPage(page,7);
    		//默认数据为当月
    		Calendar calendar = Calendar.getInstance();
    		int year = calendar.get(Calendar.YEAR);
    		//获取月 注意：月从零开始
    		int month = calendar.get(Calendar.MONTH)+1;
    		int day = calendar.get(Calendar.DATE);
    		String beginTime="";
    		String endTime="";
    		if(month<10){
    			begin = year+"-"+"0"+month+"-"+"01";
    			end = year+"-"+"0"+month+"-"+day;
    			beginTime = year+"/"+"0"+month+"/"+"01";
    			endTime = year+"/"+"0"+month+"/"+day;
    		}else{
    			begin = year+"-"+month+"-"+"01";
    			end = year+"-"+month+"-"+day;
    			beginTime = year+"/"+month+"/"+"01";
    			endTime = year+"/"+month+"/"+day;
    		}
    		HashMap data = new HashMap();
    		data.put("begin", begin);
    		data.put("end", end);
    		data.put("fpdm", fpdm);
    		data.put("fphm", fphm);
    		data.put("NSRSBH", NSRSBH);
    		data.put("SHXYDM", SHXYDM);
         	//获得当前页面列表的所有值
            List<HashMap> createCountList = createCountService.createCountList(data);
            //使用PageInfo包装查询结果，只需要将pageInfo交给页面就可以  
            PageInfo<HashMap> pageInfo = new PageInfo(createCountList,7);
            //pageINfo封装了分页的详细信息，也可以指定连续显示的页数
            mav.addObject("createCountList",pageInfo.getList());
            mav.addObject("total",pageInfo.getTotal());
            mav.addObject("pages",pageInfo.getPages());
            mav.addObject("page",page);
            mav.addObject("begin",beginTime);
            mav.addObject("end",endTime);
            mav.addObject("fpdm",fpdm);
            mav.addObject("fphm",fphm);
            //给页面返回列表页面
            mav.setViewName("sj/createCount");
         } catch (Exception e) {
             e.printStackTrace();
         }
         return mav;
    }
    
    
    /**
	 * 导出台账数据到excel
	 * @return
	 * @throws Exception
	 */
	@RequestMapping("excel")
	@ResponseBody
	public ModelAndView excel() throws Exception{
		 ModelAndView mv = this.getModelAndView();  
	     SimpleDateFormat sdf=new SimpleDateFormat("yyyy-MM");
	     PageData pd = this.getPageData();
	     HashMap data = new HashMap();
	     String KPRQ = pd.getString("kpyf");
	     String SHXYDM = pd.getString("SHXYDM");
	     String NSRSBH = pd.getString("NSRSBH");
	     if(null != KPRQ && !"".equals(KPRQ)){
	    	KPRQ = KPRQ.trim();
			//Date kpyf=sdf.parse(KPRQ);
			data.put("kpyf", KPRQ);
	     }
	     data.put("SHXYDM", SHXYDM);
	     data.put("NSRSBH", NSRSBH);
	     Map<String,Object> dataMap = new HashMap<String,Object>();
	     String NSRMC = new String(pd.getString("NSRMC").getBytes("ISO8859-1"), "UTF-8");
	     NSRMC = java.net.URLDecoder.decode(NSRMC,"UTF-8");
	     //String NSRMC = pd.getString("NSRMC");
	     //NSRMC = java.net.URLDecoder.decode(NSRMC, "UTF-8");
	     dataMap.put("NSRMC", NSRMC);
	     List<String> titles = new ArrayList<String>();  
	     titles.add("序号");
	     titles.add("发票代码");
	     titles.add("发票号码");
	     titles.add("开票日期");
	     titles.add("确定勾选日期");
	     titles.add("发票金额");
	     titles.add("发票税额");
	     titles.add("销方名称");
	     dataMap.put("titles", titles);  
	     //根据条件数据得到数据
	     List<HashMap> createCountList = createCountService.searchByList(data); 
	     List<HashMap> varList = new ArrayList<HashMap>();  
	     
	     if(createCountList!=null&&createCountList.size()>0){
	    	 Integer n=1;
	    	 for (HashMap p:createCountList){
	    		 HashMap sheetData = new HashMap();
	    		 sheetData.put("var1", n.toString()); n++;
	         	 sheetData.put("var2", p.get("FPDM").toString());
	         	 sheetData.put("var3", p.get("FPHM").toString());
	         	 sheetData.put("var4", p.get("RQ").toString());
	         	 sheetData.put("var5", p.get("RZSJ").toString());
	         	 sheetData.put("var6", p.get("JE").toString());
	         	 sheetData.put("var7", p.get("SE").toString());
	         	 sheetData.put("var8", p.get("XFMC").toString());
	    		 varList.add(sheetData);
	     }
	}
	     dataMap.put("varList", varList);  
	     ObjectExcelView erv = new ObjectExcelView();  
	     mv = new ModelAndView(erv,dataMap);  
	     return mv;   
	}
	
	/**
     * 页面展示
     * @param page
     * @return
     */
    @RequestMapping("/search")
    @ResponseBody
    public Json search(@RequestParam(required=false,defaultValue="1",value="page")Integer page,
    		String begin,String end,String NSRSBH,String SHXYDM,String fpdm,String fphm){
    	Json json = new Json();
    	 try {
    		//在查询之前传入当前页，然后多少记录 
    		PageHelper.startPage(page,7);
    		HashMap data = new HashMap();
    		data.put("begin", begin);
    		if(end!=null&&end!=""){
    			String endTime = end.replace("/", "-");
    			data.put("end", endTime);
    		}else{
    			data.put("end", end);
    		}
    		data.put("fpdm", fpdm);
    		data.put("fphm", fphm);
    		data.put("NSRSBH", NSRSBH);
    		data.put("SHXYDM", SHXYDM);
         	//获得当前页面列表的所有值
            List<HashMap> createCountList = createCountService.createCountList(data);
            //使用PageInfo包装查询结果，只需要将pageInfo交给页面就可以  
            PageInfo<HashMap> pageInfo = new PageInfo(createCountList,7);
            
            //pageINfo封装了分页的详细信息，也可以指定连续显示的页数
            Map<String, Object> map = new HashMap<>();
            map.put("createCountList", pageInfo.getList());
            map.put("total", pageInfo.getTotal());
            map.put("pages", pageInfo.getPages());
            map.put("page", page);
            json.setSuccess(true);
            json.setMsg("搜索成功");
            json.setObj(map);
         } catch (Exception e) {
             e.printStackTrace();
             json.setMsg("搜索失败");
             json.setSuccess(false);
         }
         return json;
    }
}

5）createCount.jsp（jsp）

<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://www.springframework.org/tags/form" prefix="fm" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<!DOCTYPE html>
<html>
<head>
<base href="<%=basePath%>">
<title>确定勾选信息</title>
<link rel="stylesheet" href="<%=basePath%>static/weui/JAC/weui.min.css">
<link rel="stylesheet" href="<%=basePath%>static/weui/JAC/jquery-weui.min.css">
<link rel="stylesheet" href="<%=basePath%>static/weui/JAC/swiper.min.css">
<meta charset="utf-8">
<meta name="viewport"
	content="width=device-width, initial-scale=1, user-scalable=no">
<meta name="viewport"
	content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
	<style>
		#conut_page{
			font-size: 4vw;
			height:6vw;
			text-align: center;
			line-height: 6vw;
			color: #657180;
			margin-top:5vw;
			margin-bottom:5vw;
		}
		#conut_newPage{
			border:1px solid #b2b2b2;
			outline:none;
			width: 10vw;
			height:6vw;
			font-size: 4vw;
			-webkit-border-radius:2vw;//适配以webkit为核心的浏览器(chrome、safari等)
			-moz-border-radius:2vw;//适配firefox浏览器
			-ms-border-radius:2vw;//适配IE浏览器
			-o-border-radius:2vw;//适配opera浏览器
			border-radius:2vw;//适配所有浏览器(需要放在最后面，类似于if..else if..else..)	
			transition: border-color .2s ease-in-out;
			text-align: center;
		}
		#conut_newPage:hover{
			border-color: #39f;
		}
		#conut_pageSum{
			font-size: 4vw;
			margin: 0 5vw 0 0;
		}
	</style>
<style type="text/css">
html,body {
	position: relative;
	height: 100%;
}

body {
	background: #019fe9;
	font-family: "Microsoft YaHei";
	font-size: 14px;
	color: #000;
	margin: -0.3vw 0 0 0;
	padding: 0;
	text-align:center;
}
.weui-cell:before{
	border:0;
}
.weui-cell{
	padding:5px 5px;
}
#xiangqing>.weui-cell{
	padding:1.5px;
}
.weui-cell>a{
	background:#3478f6;
}
.search{
	padding: 2vw 2vw;
}
.weui-picker-calendar{
	position:fixed;
	top:70vw;
}
.weui-dialog, .weui-toast{
	top:50vw;
}
#date-wrapper{
	top:30vw;
}
.c1{
	border-bottom:1vw solid #019fe9;
}
.weui-dialog__btn{
	color:#019fe9;
}
.picker-calendar-day.picker-calendar-day-selected span {
    background: #019fe9;
    color: #fff;
}
i.icon.icon-prev {
    background-image: url(<%=basePath%>static/img/left.png);
}
i.icon.icon-next {
    background-image: url(<%=basePath%>static/img/right.png);
}
.weui-dialog__btn.default{
	display:none;
}
#hidebg { position:absolute;left:0px;top:0px;
      background-color:#000;
      width:100%;  /*宽度设置为100%，这样才能使隐藏背景层覆盖原页面*/
      filter:alpha(opacity=60);  /*设置透明度为60%*/
      opacity:0.6;  /*非IE浏览器下设置透明度为60%*/
      display:none; /* http://www.jb51.net */
      position: fixed;
      top:0;
      bottom:0;
      left:0;
      right:0;
      z-Index:2;}
#hidebox { 
	position:absolute;
	width:70vw;
	top:10vw;left:15%;
	background-color:#fff;
	color:#999;
	display:none;cursor:pointer;
	z-Index:3;font-size:15px;
	text-align:center;
}
#hidebox #a24 {
	position:absolute;
	width:70vw;
	color:#019fe9;
	bottom:2%;
	padding:2vw 0;
	font-size: 18px;
	border-top: 1px solid #e1e1e1;
}
#deta { 
	text-align:center;
	cursor:pointer;
	z-Index:1;
}
</style>
</head>
<body>
	<div id="page-content" style="margin: 0;">
		<div class="weui-cells_form" style="background:#019fe9;margin: 0 auto;width:90%;">
			<!-- <div style="background:#fff;border:none;border-radius:1vw;">
			<p style="padding:1.5vw 0;color: #019fe9;font-weight:bold;font-size: 4vw;width: 90%;margin: 0.5vw auto 0;">
				勾选查询
			</p>
			</div>
			<div style="border-bottom:1vw solid #019fe9;">
			</div> -->
			
			<div style="border-bottom:1vw solid #019fe9;">
			</div>
			<div style="background:#fff;border:none;border-radius:1vw;">
			<div class="weui-cell" style="font-size: 4vw;padding: 2vw 2vw;">
				<p style="width: 90%;color:#019fe9;">
					
					<input id="ay" type="radio" name="a" checked style="width: 5%;display: inline-block;text-align: center;position: relative;left:-5%;"/>
					<span id="ay1" style="position: relative;left:-5%;">
						搜索条件
					</span>
					<input id="ar" type="radio" name="a" style="width: 5%;display: inline-block;text-align: center;position: relative;right:-22%;"/>
					<span id="ar1" style="position: relative;right:-22%;">
						导出EXCEL
					</span>
					
				</p>
			</div>
			</div>
			<div id="c1" class="c1">
			</div>
			
			<div id="a2">
			<div style="background:#fff;border:none;border-radius:1vw;">
			<div class="weui-cell" style="font-size: 4vw;padding:0;">
				<p class="search" style="width: 90%;">
					<span style="width: 45%;display: inline-block;text-align: center;"><strong>发票代码</strong></span>
					<span style="position: relative;left:7vw;width: 45%;display: inline-block;text-align: center;"><strong>发票号码</strong></span>
				</p>
			</div>

			<div class="weui-cell" style="font-size: 4vw;padding:0;color:#019fe9;">
					<input class="weui-input" value="${fpdm}" placeholder="请输入发票代码" id="conut_fpdm" style="text-align:center;padding: 1vw 1vw;">
					<input class="weui-input" value="${fphm}" placeholder="请输入发票号码" id="conut_fphm" style="text-align:center;padding: 1vw 1vw;">
			</div>
			</div>
			<div style="border-bottom:1vw solid #019fe9;">
			</div>
			
			<div style="background:#fff;border:none;border-radius:1vw;">
			<div class="weui-cell" style="font-size: 4vw;padding:0;">
				<p class="search" style="width: 100%;">
					<span style="width: 100%;display: inline-block;text-align: center;">确定勾选日期</span>
				</p>
			</div>

			<div class="weui-cell" style="font-size: 4vw;padding:0;color:#019fe9;">
					<input class="weui-input" value="${begin }" placeholder="请选择起始日期" id="conut_biginTime" style="text-align:center;padding: 1vw 1vw;">
					<span>
						<img alt="" src="<%=basePath%>static/img/xiangyou.png" style="width:5vw;display: inline-block; vertical-align: middle;">
					</span>
					<input class="weui-input" value="${end }" placeholder="请选择结束日期" id="conut_endTime" style="text-align:center;padding: 1vw 1vw;">
			</div>
			</div>
			
			<div class="weui-cell" style="font-size: 4vw;padding:0;background:#019fe9;">
				<span style="display: inline-block;text-align: center;position: relative;left:10vw;background:#1068bf;padding: 1vw 8vw;margin:1vw 0;border-radius:1vw;">
					<input id="reseta" onclick="CheckSet();" type="button" width="35vw" height="35vw" value="重置" style="border:none;background:none;cursor:pointer;color:#fff;">
				</span>
				<span style="display: inline-block;text-align: center;position: relative;left:33vw;background:#1068bf;padding: 1vw 8vw;margin:1vw 0;border-radius:1vw;">
					<input id="save" onclick="CheckPost();" type="button" width="35vw" height="35vw" value="搜索" style="border:none;background:none;cursor:pointer;color:#fff;">
				</span>
			</div>
			</div>
			
			<div id="a1">
				<div style="background:#019fe9;">
				<div class="weui-cell" style="font-size: 4vw;padding: 2vw 30vw;">
					<input type="text" class="weui-input" width:10vw; value="生成EXCEL" id="test3" style="border:none;border-radius:1vw;text-align:center;padding: 1vw 4vw;background-color: #1068bf;color: #fff;font-size: 4vw;height:8vw;" readonly="readonly" data-options="{'type':'YYYY-MM'}">
				</div>
				</div>
			</div>
			
		</div>
<div style="margin: 0 auto;width:90%;background:#019fe9;">
	<div style="background:#fff;border:none;border-radius:1vw;padding:1vw 0 0 0;position:relative;top:-1vw;color: #019fe9;font-weight:bold;font-size: 4vw;margin: 0.5vw auto 0;">
			<p style="">
				发票列表
			</p>
	</div>
	<div class="weui-cells" style="margin: 0 auto;">
		<div style="background:#019fe9;">
			
			<div class="weui-cell" style="font-size: 16px;background: #efeff4;border:none;border-radius:0;">
				<div class="weui-cell__bd">
					<p><strong>序号</strong></p>
				</div>
				<div class="weui-cell__bd">
					<p><strong>发票号码</strong></p>
				</div>
				<div class="weui-cell__bd">
					<p><strong>发票金额</strong></p>
				</div>
				<div class="weui-cell__bd">
					<p><strong>发票税额</strong></p>
				</div>
				<div class="weui-cell">
					<p><strong>详情</strong></p>
				</div>
			</div>
		</div>
		
		<div id="zibody">
		<c:forEach items="${createCountList}" var="createCount" varStatus="vs">
		<div class="weui-cell" style="border-top:1px solid #efeff4;">
			<div class="weui-cell__bd">
				<p>${vs.index+1}</p>
			</div>
			<div class="weui-cell__bd">
				<p>${createCount.FPHM}</p>
			</div>
			<div class="weui-cell__bd">
				<p>${createCount.JE}<p>
			</div>
			<div class="weui-cell__bd">
				<p>${createCount.SE}</p>
			</div>
			<input id="deta" onclick="detail('${createCount.FPDM}','${createCount.FPHM}','${createCount.RQ}','${createCount.RZSJ}','${createCount.XFMC}','${createCount.JE}','${createCount.SE}','${createCount.SFCH}','${createCount.SFTXF}','${createCount.SFRZ}');" type="image" width="25vw" height="25vw" src="<%=basePath%>static/img/xiangqing3.png" style="border:none;background:none;cursor:pointer">
		</div>
		</c:forEach>
		</div>
	
	<div id="conut_page">
			<span id="conut_pageSum">共<strong style="color:#019fe9">${total}</strong>条</span>
			<span id="conut_upPage"><strong style="color:#019fe9">〈〈</strong></span>   
			<input id="conut_newPage" type="number" value="${page}" style="color:#019fe9;">  <strong style="color:#019fe9">/</strong>  
			<span id="conut_allPage" style="color:#019fe9;">${pages}</span>   
			<span id="conut_downPage"><strong style="color:#019fe9">〉〉</strong></span> 
	</div>
	</div>
	</div>
	<div id="hidebg"></div>
    <div id="hidebox">
		<div id="a22">
			<div style="height:12vw; padding: 1.3em 1.6em .5em;color:#000;font-size:18px;">发票详情</div>
		</div>
		<div id="a24" style="height:8vw;" onClick="hide();">确定</div>
	</div>
	</div>
</body>
<script type="text/javascript" src="<%=basePath%>static/weui/JAC/jquery-2.1.4.js"></script>
<script type="text/javascript" src="<%=basePath%>static/weui/JAC/jquery-weui.min.js"></script>
<script type="text/javascript" src="<%=basePath%>static/weui/JAC/swiper.min.js"></script>
<script type="text/javascript" src="<%=basePath%>static/weui/JAC/jquery.date.js"></script>
<script type="text/javascript" src="<%=basePath%>static/weui/JAC/iscroll.js"></script>
<script type="text/javascript">
//获取纳税人识别号 社会信息代码
var Index_NSRSBH = parent.$("#Index_NSRSBH").val();
var Index_SHXYDM = parent.$("#Index_SHXYDM").val();
var Index_NSRMC = parent.$("#index_picker").val();

$.date('#test3');
parent.hideZzCeng();
$("div").delegate("#test3", "click", function(){
	parent.showZzCeng();
});

$("div").delegate("#d-cancel", "click", function(){
	parent.hideZzCeng();
});

$("div").delegate("#ay1", "click", function(){
	$("#ay").click();
});
$("div").delegate("#ar1", "click", function(){
	$("#ar").click();
});
$("#a1").hide();
$("#a2").show();
$("div").delegate("#ay", "click", function(){
	$("#a2").show();
	$("#a1").hide();
	$("#c1").addClass("c1");
});
$("div").delegate("#ar", "click", function(){
	$("#a1").show();
	$("#a2").hide();
	$("#c1").removeClass("c1");
});

//设置子页面的高度
var heightParent = parent.$("body").outerHeight(true);
var heightParentHeader = parent.$("#headerDiv").outerHeight(true);
$("body").height(heightParent-heightParentHeader+"px");
$(window).load(function(){parent.$("#myiframe").css("height","0");parent.$("#myiframe").css("height",$("body").scrollHeight())});

/* $("body").click(function(){
	 parent.slideout.close();
 }); */
 
 $(function(){
	 //更换背景色需将之前的背景色取消掉，重新设置背景色
     $('#date-wrapper h3').css('background','none');
     $('#date-wrapper h3').css('background','#1068bf');
     $('#d-confirm').css('background','none');
     $('#d-confirm').css('background','#1068bf');
});
 
 function hide() //去除隐藏层和弹出层
 {
	 parent.hideZzCeng();
     document.getElementById("hidebg").style.display = "none";
     document.getElementById("hidebox").style.display = "none";
     $('#xiangqing').remove();
 };
 
 //重置
function CheckSet(){
	$("#conut_fpdm").val("");
	$("#conut_fphm").val("");
	$("#conut_biginTime").val("");
	$("#conut_endTime").val("");
	var Index_NSRSBH = parent.$("#Index_NSRSBH").val();
	var Index_SHXYDM = parent.$("#Index_SHXYDM").val();
	parent.sessionLive(); 
	$.ajax({
        url: "<%=basePath%>createCount/list.do?NSRSBH=" + Index_NSRSBH+"&SHXYDM=" + Index_SHXYDM,
 		type: "post",
        dataType: "html",
        success: function (result) {
        	$.toast.prototype.defaults.duration='1000';
        	$.toast("数据加载中","text");
        	$("#page-content").html(result);
        }
    });
}

//搜索
function CheckPost(){
	parent.sessionLive(); 
	var Index_NSRSBH = parent.$("#Index_NSRSBH").val();
	var Index_SHXYDM = parent.$("#Index_SHXYDM").val();
	var begin = $("#conut_biginTime").val();
	var end = $("#conut_endTime").val();
	var fpdm = $("#conut_fpdm").val();
	var fphm = $("#conut_fphm").val();
	if(begin == ""&&end == ""){
		$.toast.prototype.defaults.duration='1000';
		$.toast("请选择日期！","text");
		return false;
	}
	if(begin != ""&&end == ""){
		$.toast.prototype.defaults.duration='1000';
		$.toast("请选择结束日期！","text");
		return false;
	}
	if(begin == ""&&end != ""){
		$.toast.prototype.defaults.duration='1000';
		$.toast("请选择开始日期！","text");
		return false;
	}
	if(begin != "" && end != ""){  
		  
        var startTmp=begin.split("/");  
        var endTmp=end.split("/");  
        var sd=new Date(startTmp[0],startTmp[1],startTmp[2]);  
        var ed=new Date(endTmp[0],endTmp[1],endTmp[2]);  
          
        if(sd.getTime()>ed.getTime()){  
        	$.toast.prototype.defaults.duration='1000';
        	$.toast("结束日期不能早于开始日期！","text");
            $("#conut_biginTime").val("");
        	$("#conut_endTime").val("");
            return false;   
        }  
    }
	var dataS={
			"begin":begin,
			"end":end,
			"fphm":fphm,
			"fpdm":fpdm,
			"NSRSBH":Index_NSRSBH,
			"SHXYDM":Index_SHXYDM
	};
	$.ajax({
        url: "<%=basePath%>createCount/search.do",
        data:dataS,  
 		type: "post",
        dataType: "json",
        success: function (result) {
        	$.toast.prototype.defaults.duration='1000';
        	$.toast("数据加载中","text");
        	createHtml(result);
        }
    });
}


//导出EXCEL
//调弹出输入框
$("div").delegate("#d-confirm", "click", function(){
	parent.sessionLive(); 
	parent.showZzCeng();
	var Index_NSRSBH = parent.$("#Index_NSRSBH").val();
	var Index_SHXYDM = parent.$("#Index_SHXYDM").val();
	var Index_NSRMC = parent.$("#index_picker").val();
	$.confirm({
		  title: '确定导出EXCEL？',
		  onOK: function () {
		    //点击确认
		    $.toast("正在导出EXCEL", "text");
		    parent.hideZzCeng();
			var kpyf = $("#test3").val();
			  window.location.href=
				'<%=basePath%>createCount/excel.do?'+
				'kpyf='+kpyf+"&NSRSBH="+Index_NSRSBH
		        +"&SHXYDM="+Index_SHXYDM+"&NSRMC="+encodeURI(encodeURI(Index_NSRMC));
				$("#test3").val("生成EXCEL");
		  },
		  onCancel: function () {
			  parent.hideZzCeng();
			  $("#test3").val("生成EXCEL");
		  }
	});
});

//调日历框
$("#conut_biginTime").calendar();
$("#conut_endTime").calendar();

</script>
<script type="text/javascript">
//弹出详情列表
function detail(fpdm,fphm,kprq,rzsj,xfmc,je,se,sfch,sftxf,sfrz){
	parent.sessionLive(); 
	parent.showZzCeng();
	if(sfch==1){
		sfch='已冲红';
	}else{
		sfch='未冲红';
	}
	if(sftxf==0){
		sftxf='否';
	}else if(sftxf==1){
		sftxf='是';
	}
	if(sfrz!=null&&sfrz!=''){
		sfrz='已认证';
	}else{
		sfrz='未认证';
	}
	var xq = '';
	if(je>0&&sftxf=='是'){
		var hidebox = document.getElementById("hidebox");
		hidebox.style.height = "110vw"; 
		xq = "<div id='xiangqing' style='width:56vw;position:absolute;top:15vw;overflow-y:auto;height:71vw;padding: 0 1.6em .8em;font-size:16px;text-align:left'>"+
		  "发票代码："+fpdm+"<br>"+
		  "发票号码："+fphm+"<br>"+
		  "开票日期："+kprq+"<br>"+
		  "确定勾选日期："+rzsj+"<br>"+
		  "发票金额："+je+"<br>"+
		  "发票税额："+se+"<br>"+
		  "是否冲红："+sfch+"<br>"+
		  "是否认证："+sfrz+"<br>"+
		  "是否通行费："+sftxf+"<br>"+
		  "销方名称："+xfmc+"<br></div>";
	}else if(je>0&&sftxf=='否'){
		var hidebox = document.getElementById("hidebox");
		hidebox.style.height = "103vw"; 
		xq = "<div id='xiangqing' style='width:56vw;position:absolute;top:15vw;overflow-y:auto;height:64vw;padding: 0 1.6em .8em;font-size:16px;text-align:left'>"+
		  "发票代码："+fpdm+"<br>"+
		  "发票号码："+fphm+"<br>"+
		  "开票日期："+kprq+"<br>"+
		  "确定勾选日期："+rzsj+"<br>"+
		  "发票金额："+je+"<br>"+
		  "发票税额："+se+"<br>"+
		  "是否冲红："+sfch+"<br>"+
		  "是否通行费："+sftxf+"<br>"+
		  "销方名称："+xfmc+"<br></div>";
	}else{
		var hidebox = document.getElementById("hidebox");
		hidebox.style.height = "95vw"; 
		xq = "<div id='xiangqing' style='width:56vw;position:absolute;top:15vw;overflow-y:auto;height:58vw;padding: 0 1.6em .8em;font-size:16px;text-align:left'>"+
		  "发票代码："+fpdm+"<br>"+
		  "发票号码："+fphm+"<br>"+
		  "开票日期："+kprq+"<br>"+
		  "确定勾选日期："+rzsj+"<br>"+
		  "发票金额："+je+"<br>"+
		  "发票税额："+se+"<br>"+
		  "是否通行费："+sftxf+"<br>"+
		  "销方名称："+xfmc+"<br></div>";
	}
    var hidebg = document.getElementById("hidebg");
    hidebg.style.display = "block"; //显示隐藏层
    //hidebg.style.height = heightParent-heightParentHeader+"px"; //设置隐藏层的高度为当前页面高度
    document.getElementById("hidebox").style.display = "block"; //显示弹出层
    $('#a22').append(xq);
	
	/* $.confirm({
		title: '电子发票详情',
		text: xq,
		onOK: function () {
		//点击确认
		parent.hideZzCeng();
		}
	}); */
	
	
}

function createHtml(result){
	//删除所有内容
	$("#zibody div").remove();
	for(var i=0;i<result.obj.createCountList.length;i++){
		$("#zibody").append(
			'<div class="weui-cell" style="border-top:1px solid #efeff4;">'+
			'<div class="weui-cell__bd">'+
				'<p>'+(i+1)+'</p>'+
			'</div>'+
			'<div class="weui-cell__bd">'+
				'<p>'+result.obj.createCountList[i].FPHM+'</p>'+
			'</div>'+
			'<div class="weui-cell__bd">'+
				'<p>'+result.obj.createCountList[i].JE+'<p>'+
			'</div>'+
			'<div class="weui-cell__bd">'+
				'<p>'+result.obj.createCountList[i].SE+'</p>'+
			'</div>'+
			"<input id=\"deta\" onclick=\"detail('"+result.obj.createCountList[i].FPDM+"','"+result.obj.createCountList[i].FPHM+"','"+result.obj.createCountList[i].RQ+"','"+result.obj.createCountList[i].RZSJ+"','"+result.obj.createCountList[i].XFMC+"','"+result.obj.createCountList[i].JE+"','"+result.obj.createCountList[i].SE+"','"+result.obj.createCountList[i].SFCH+"','"+result.obj.createCountList[i].SFTXF+"','"+result.obj.createCountList[i].SFRZ+"');\" type=\"image\" width=\"25vw\" height=\"25vw\" src=\"<%=basePath%>static/img/xiangqing2.png\" style=\"border:none;background:none;cursor:pointer\">"+
		'</div>'
		);
	}
	//修改页码
	var pageSum = result.obj.total;
	var pageNum = result.obj.page;
	var pages = result.obj.pages;
	$("#conut_pageSum").html('共<strong style="color:#019fe9">'+pageSum+'</strong>条');
	$("#conut_newPage").val(pageNum);
	$("#conut_allPage").html(pages);
	initPage = pageNum;
	//$("#allQt").attr("checked",false);
	//数据加载隐藏
	setTimeout(function() {
		$.hideLoading();
	}, 300);
}

</script>
<script type="text/javascript">

		/*********输入改变页码*********/

		//获取初始页 避免重复请求一个页面
		var initPage = $("#conut_newPage").val();
		//获取输入框的数字 判断是否有效
		$("#conut_newPage").bind("input propertychange change onpropertychange",this,function(event){
			//输入的内容
			var InputNum = $(this).val();
			//判断输入的内容是不是数字
			var reg=/^\d+$/;
			//是数字
			if(reg.test(InputNum)==true){
				if(InputNum == 0){
					$(this).val(initPage);
				}else{
					//去掉首数字为0
					InputNum= parseInt(InputNum);
					//总页数
					var allPage = parseInt($("#conut_allPage").html());
					if(InputNum>allPage){
						//大于总页数不请求
						$(this).val(initPage);
						InputNum = initPage;
					}
					//判断是否是重复输入
					if(initPage == InputNum){
						//不需要进行请求
					}else{
						//进行AJAX请求
						console.log(InputNum+","+allPage);
						initPage = InputNum;
						var Index_NSRSBH = parent.$("#Index_NSRSBH").val();
						var Index_SHXYDM = parent.$("#Index_SHXYDM").val();
						var begin = $("#conut_biginTime").val();
						var end = $("#conut_endTime").val();
						var fpdm = $("#conut_fpdm").val();
						var fphm = $("#conut_fphm").val();
						var dataS={
								"page":InputNum,
								"begin":begin,
								"end":end,
								"fphm":fphm,
								"fpdm":fpdm,
								"NSRSBH":Index_NSRSBH,
								"SHXYDM":Index_SHXYDM
						};
						parent.sessionLive(); 
						$.ajax({
					        url: "<%=basePath%>createCount/search.do",
					        data:dataS,  
					 		type: "post",
					        dataType: "json",
					        success: function (result) {
					        	$.toast.prototype.defaults.duration='1000';
					        	$.toast("数据加载中","text");
					        	createHtml(result);
					        }
					    });
					}
				}
			}else{
				//不是数字 清空
				$(this).val("");
			}
    	});

    	/*************点击上一页下一页*************/
    	//点击上一页
    	$("#conut_upPage").click(function(){
    		var nowPage = parseInt($("#conut_newPage").val());
    		if(nowPage > 1){
    			$("#conut_newPage").val(nowPage-1);
    			$("#conut_newPage").change();
    		}
    	});
    	//点击下一页
    	$("#conut_downPage").click(function(){
    		var nowPage = parseInt($("#conut_newPage").val());
    		var allPages = parseInt($("#conut_allPage").html());
    		if(nowPage <= allPages){
    			$("#conut_newPage").val(nowPage+1);
    			$("#conut_newPage").change();
    		}
    	});
	</script>
</html>

3.汇总页面表格横向滑动

a）HuiZong.xml（一对多，避免重复用子查询）

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.taxsearch.dao.HuiZongMapper">
	<select id="huiZongygxHP" resultType="HashMap"  parameterType="HashMap">
		select count(s.FPDM) HPFS,COALESCE(sum(s.JE),0) HPJE,COALESCE(sum(s.SE),0) HPSE from DZDZ_FPXX_DZFP s
		LEFT JOIN DZFPGXRZ G on s.FPDM=G.FPDM and s.FPHM=G.FPHM
		LEFT JOIN DJ_NSRXX b ON s.GFSH = b.NSRSBH OR s.GFSH = b.SHXYDM
		WHERE 
		(b.SHXYDM = #{SHXYDM,jdbcType=VARCHAR}
		or b.NSRSBH = #{NSRSBH,jdbcType=VARCHAR}) and s.JE < 0 and G.RZSJ IS not NULL 
		<if test="begin != null and begin != ''">
			AND G.RZSJ >= to_date(#{begin},'yyyy-mm-dd')
		</if>
		<if test="end != null and end != ''">
			AND to_char(G.RZSJ,'yyyy-mm-dd') <= #{end,jdbcType=VARCHAR}
		</if>
	</select>
	
	<select id="huiZongygxLP" resultType="HashMap"  parameterType="HashMap">
		select count(s.FPDM) LPFS,COALESCE(SUM(s.JE),0) LPJE,COALESCE(SUM(s.SE),0) LPSE from DZDZ_FPXX_DZFP s
		LEFT JOIN DZFPGXRZ G on s.FPDM=G.FPDM and s.FPHM=G.FPHM
		LEFT JOIN DJ_NSRXX b ON s.GFSH = b.NSRSBH OR s.GFSH = b.SHXYDM
		WHERE (b.SHXYDM = #{SHXYDM,jdbcType=VARCHAR}
		or b.NSRSBH = #{NSRSBH,jdbcType=VARCHAR}) and JE > 0 and G.RZSJ IS not NULL 
		<if test="begin != null and begin != ''">
			AND G.RZSJ >= to_date(#{begin},'yyyy-mm-dd')
		</if>
		<if test="end != null and end != ''">
			AND to_char(G.RZSJ,'yyyy-mm-dd') <= #{end,jdbcType=VARCHAR}
		</if>
	</select>
	
	<select id="huiZongygxHPTXF" resultType="HashMap"  parameterType="HashMap">
		select count(s.FPDM) HPTXFFS,COALESCE(sum(s.JE),0) HPTXFJE,COALESCE(sum(s.SE),0) HPTXFSE from DZDZ_FPXX_DZFP s
		LEFT JOIN DZFPGXRZ G on s.FPDM=G.FPDM and s.FPHM=G.FPHM
		LEFT JOIN DJ_NSRXX d ON s.GFSH = d.NSRSBH OR s.GFSH = d.SHXYDM
		WHERE s.JE < 0 and G.ETCBZ='1' AND G.RZSJ IS not NULL and (d.SHXYDM = #{SHXYDM,jdbcType=VARCHAR}
		or d.NSRSBH = #{NSRSBH,jdbcType=VARCHAR})
		<if test="begin != null and begin != ''">
			AND G.RZSJ >= to_date(#{begin},'yyyy-mm-dd')
		</if>
		<if test="end != null and end != ''">
			AND to_char(G.RZSJ,'yyyy-mm-dd') <= #{end,jdbcType=VARCHAR}
		</if>
	</select>
	
	<select id="huiZongygxLPTXFRZ" resultType="HashMap"  parameterType="HashMap">
		select count(s.FPDM) LPTXFRZFS,COALESCE(sum(s.JE),0) LPTXFRZJE,COALESCE(sum(s.SE),0) LPTXFRZSE from DZDZ_FPXX_DZFP s 
		LEFT JOIN (SELECT X.FPDM FPDM,X.FPHM FPHM,X.SPBM SPBM,X.SL FROM DZDZ_HWXX_DZFP X
                 INNER JOIN DZDZ_FPXX_DZFP Y ON X.FPDM=Y.FPDM AND X.FPHM=Y.FPHM
                 WHERE X.SPBM='3040502020301000000') D ON s.FPDM=D.FPDM AND s.FPHM=D.FPHM
		LEFT JOIN DZDZ_DHX_FPXX r ON r.FPDM = D .FPDM
      	AND D .FPHM = r.FPHM
		LEFT JOIN DZFPGXRZ G on s.FPDM=G.FPDM and s.FPHM=G.FPHM
		LEFT JOIN DJ_NSRXX b ON s.GFSH = b.NSRSBH OR s.GFSH = b.SHXYDM
		WHERE (b.SHXYDM = #{SHXYDM,jdbcType=VARCHAR}
		or b.NSRSBH = #{NSRSBH,jdbcType=VARCHAR})
		and s.JE > 0 and D.SPBM is not null and r.FPDM is not null and G.RZSJ IS not NULL
		<if test="begin != null and begin != ''">
			AND G.RZSJ >= to_date(#{begin},'yyyy-mm-dd')
		</if>
		<if test="end != null and end != ''">
			AND to_char(G.RZSJ,'yyyy-mm-dd') <= #{end,jdbcType=VARCHAR}
		</if>
	</select>
	
	<select id="huiZongygxLPTXF" resultType="HashMap"  parameterType="HashMap">
		select count(s.FPDM) LPTXFFS,COALESCE(sum(s.JE),0) LPTXFJE,COALESCE(sum(s.SE),0) LPTXFSE from DZDZ_FPXX_DZFP s 
		LEFT JOIN DZFPGXRZ G on s.FPDM=G.FPDM and s.FPHM=G.FPHM
		LEFT JOIN DJ_NSRXX b ON s.GFSH = b.NSRSBH OR s.GFSH = b.SHXYDM
		WHERE (b.SHXYDM = #{SHXYDM,jdbcType=VARCHAR}
		or b.NSRSBH = #{NSRSBH,jdbcType=VARCHAR})
		and s.JE > 0 and G.RZSJ IS not NULL and G.ETCBZ='1'
		<if test="begin != null and begin != ''">
			AND G.RZSJ >= to_date(#{begin},'yyyy-mm-dd')
		</if>
		<if test="end != null and end != ''">
			AND to_char(G.RZSJ,'yyyy-mm-dd') <= #{end,jdbcType=VARCHAR}
		</if>
	</select>
	
	
	
	<select id="huiZongwgxHP" resultType="HashMap" parameterType="HashMap">
		select count(s.FPDM) HPFS,COALESCE(sum(s.JE),0) HPJE,COALESCE(sum(s.SE),0) HPSE from DZDZ_FPXX_DZFP s
		LEFT JOIN DZFPGXRZ G on s.FPDM=G.FPDM and s.FPHM=G.FPHM
		LEFT JOIN DJ_NSRXX b ON s.GFSH = b.NSRSBH OR s.GFSH = b.SHXYDM
		WHERE (b.SHXYDM = #{SHXYDM,jdbcType=VARCHAR}
		or b.NSRSBH = #{NSRSBH,jdbcType=VARCHAR})
		and s.JE < 0 and G.RZSJ IS NULL 
		<if test="begin != null and begin != ''">
			AND s.KPRQ >= to_date(#{begin},'yyyy-mm-dd')
		</if>
		<if test="end != null and end != ''">
			AND to_char(s.KPRQ,'yyyy-mm-dd') <= #{end,jdbcType=VARCHAR}
		</if>
	</select>
	
	<select id="huiZongwgxLP" resultType="HashMap" parameterType="HashMap">
		select count(s.FPDM) LPFS,COALESCE(SUM(s.JE),0) LPJE,COALESCE(SUM(s.SE),0) LPSE from DZDZ_FPXX_DZFP s
		LEFT JOIN DZFPGXRZ G on s.FPDM=G.FPDM and s.FPHM=G.FPHM
		LEFT JOIN DJ_NSRXX b ON s.GFSH = b.NSRSBH OR s.GFSH = b.SHXYDM
		WHERE (b.SHXYDM = #{SHXYDM,jdbcType=VARCHAR}
		or b.NSRSBH = #{NSRSBH,jdbcType=VARCHAR})
		and JE > 0 and G.RZSJ IS NULL 
		<if test="begin != null and begin != ''">
			AND s.KPRQ >= to_date(#{begin},'yyyy-mm-dd')
		</if>
		<if test="end != null and end != ''">
			AND to_char(s.KPRQ,'yyyy-mm-dd') <= #{end,jdbcType=VARCHAR}
		</if>
	</select>
	
	<select id="huiZongwgxHPTXF" resultType="HashMap" parameterType="HashMap">
		select count(b.HFPDM) HPTXFFS,COALESCE(sum(b.HJE),0) HPTXFJE,COALESCE(sum(b.HSE),0) HPTXFSE from (select a.FPDM,a.FPHM,c.FPDM HFPDM,c.FPHM HFPHM,c.JE HJE,c.SE HSE,c.GFSH HGFSH,c.KPRQ HKPRQ,ZSFPDM,ZSFPHM from DZDZ_FPXX_DZFP a 
		LEFT JOIN 
		(select c.FPDM,c.FPHM,c.JE,c.SE,c.BZ,c.KPRQ,c.GFSH,SUBSTR(c.BZ, INSTR(c.BZ, '代码:')+3, 12) ZSFPDM,SUBSTR(c.BZ, INSTR(c.BZ, '号码:')+3, 8) ZSFPHM
		from DZDZ_FPXX_DZFP c
		where c.JE < 0) c ON ZSFPDM = a .FPDM AND a .FPHM = ZSFPHM
		where ZSFPHM is not null) b
		LEFT JOIN (SELECT X.FPDM FPDM,X.FPHM FPHM,X.SPBM SPBM,X.SL FROM DZDZ_HWXX_DZFP X
                 INNER JOIN DZDZ_FPXX_DZFP Y ON X.FPDM=Y.FPDM AND X.FPHM=Y.FPHM
                 WHERE X.SPBM='3040502020301000000'
        <if test="begin != null and begin != ''">
			AND Y.KPRQ >= to_date(#{begin},'yyyy-mm-dd')
		</if>
		<if test="end != null and end != ''">
			AND to_char(Y.KPRQ,'yyyy-mm-dd') <= #{end,jdbcType=VARCHAR}
		</if>
                 and (Y.GFSH=#{SHXYDM,jdbcType=VARCHAR} OR Y.GFSH=#{NSRSBH,jdbcType=VARCHAR})
                 ) D ON b.FPDM=D.FPDM AND b.FPHM=D.FPHM
		LEFT JOIN DZFPGXRZ G on b.HFPDM=G.FPDM and b.HFPHM=G.FPHM
		LEFT JOIN DJ_NSRXX d ON b.HGFSH = d.NSRSBH OR b.HGFSH = d.SHXYDM
		WHERE (d.SHXYDM = #{SHXYDM,jdbcType=VARCHAR}
		or d.NSRSBH = #{NSRSBH,jdbcType=VARCHAR})
		and D.SPBM is not null and G.RZSJ IS NULL 
		<if test="begin != null and begin != ''">
			AND b.HKPRQ >= to_date(#{begin},'yyyy-mm-dd')
		</if>
		<if test="end != null and end != ''">
			AND to_char(b.HKPRQ,'yyyy-mm-dd') <= #{end,jdbcType=VARCHAR}
		</if>
	</select>
	
	<select id="huiZongwgxLPTXFRZ" resultType="HashMap" parameterType="HashMap">
		select count(s.FPDM) LPTXFRZFS,COALESCE(sum(s.JE),0) LPTXFRZJE,COALESCE(sum(s.SE),0) LPTXFRZSE from DZDZ_FPXX_DZFP s 
		LEFT JOIN (SELECT X.FPDM FPDM,X.FPHM FPHM,X.SPBM SPBM,X.SL FROM DZDZ_HWXX_DZFP X
                 INNER JOIN DZDZ_FPXX_DZFP Y ON X.FPDM=Y.FPDM AND X.FPHM=Y.FPHM
                 WHERE X.SPBM='3040502020301000000'
        <if test="begin != null and begin != ''">
			AND Y.KPRQ >= to_date(#{begin},'yyyy-mm-dd')
		</if>
		<if test="end != null and end != ''">
			AND to_char(Y.KPRQ,'yyyy-mm-dd') <= #{end,jdbcType=VARCHAR}
		</if>
                 and (Y.GFSH=#{SHXYDM,jdbcType=VARCHAR} OR Y.GFSH=#{NSRSBH,jdbcType=VARCHAR})
                 ) D ON s.FPDM=D.FPDM AND s.FPHM=D.FPHM
		LEFT JOIN DZDZ_DHX_FPXX r ON r.FPDM = D .FPDM
      	AND D .FPHM = r.FPHM
		LEFT JOIN DZFPGXRZ G on s.FPDM=G.FPDM and s.FPHM=G.FPHM
		LEFT JOIN DJ_NSRXX b ON s.GFSH = b.NSRSBH OR s.GFSH = b.SHXYDM
		WHERE (b.SHXYDM = #{SHXYDM,jdbcType=VARCHAR}
		or b.NSRSBH = #{NSRSBH,jdbcType=VARCHAR})
		and s.JE > 0 and D.SPBM is not null and r.FPDM is not null and G.RZSJ IS NULL
		<if test="begin != null and begin != ''">
			AND s.KPRQ >= to_date(#{begin},'yyyy-mm-dd')
		</if>
		<if test="end != null and end != ''">
			AND to_char(s.KPRQ,'yyyy-mm-dd') <= #{end,jdbcType=VARCHAR}
		</if>
	</select>
	
	<select id="huiZongwgxLPTXF" resultType="HashMap" parameterType="HashMap">
		select count(s.FPDM) LPTXFFS,COALESCE(sum(s.JE),0) LPTXFJE,COALESCE(sum(s.SE),0) LPTXFSE from DZDZ_FPXX_DZFP s 
		LEFT JOIN (SELECT X.FPDM FPDM,X.FPHM FPHM,X.SPBM SPBM,X.SL FROM DZDZ_HWXX_DZFP X
                 INNER JOIN DZDZ_FPXX_DZFP Y ON X.FPDM=Y.FPDM AND X.FPHM=Y.FPHM
                 WHERE X.SPBM='3040502020301000000'
        <if test="begin != null and begin != ''">
			AND Y.KPRQ >= to_date(#{begin},'yyyy-mm-dd')
		</if>
		<if test="end != null and end != ''">
			AND to_char(Y.KPRQ,'yyyy-mm-dd') <= #{end,jdbcType=VARCHAR}
		</if>
                 and (Y.GFSH=#{SHXYDM,jdbcType=VARCHAR} OR Y.GFSH=#{NSRSBH,jdbcType=VARCHAR})
                 ) D ON s.FPDM=D.FPDM AND s.FPHM=D.FPHM
		LEFT JOIN DZFPGXRZ G on s.FPDM=G.FPDM and s.FPHM=G.FPHM
		LEFT JOIN DJ_NSRXX b ON s.GFSH = b.NSRSBH OR s.GFSH = b.SHXYDM
		WHERE (b.SHXYDM = #{SHXYDM,jdbcType=VARCHAR}
		or b.NSRSBH = #{NSRSBH,jdbcType=VARCHAR})
		and s.JE > 0 and D.SPBM is not null and G.RZSJ IS NULL
		<if test="begin != null and begin != ''">
			AND s.KPRQ >= to_date(#{begin},'yyyy-mm-dd')
		</if>
		<if test="end != null and end != ''">
			AND to_char(s.KPRQ,'yyyy-mm-dd') <= #{end,jdbcType=VARCHAR}
		</if>
	</select>
	
</mapper>

b）huiZong.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://www.springframework.org/tags/form" prefix="fm" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<!DOCTYPE html>
<html>
<head>
<base href="<%=basePath%>">
<title>汇总查询信息</title>
<link rel="stylesheet" href="<%=basePath%>static/weui/JAC/weui.min.css">
<link rel="stylesheet" href="<%=basePath%>static/weui/JAC/jquery-weui.min.css">
<link rel="stylesheet" href="<%=basePath%>static/weui/JAC/swiper.min.css">
<meta charset="utf-8">
<meta name="viewport"
	content="width=device-width, initial-scale=1, user-scalable=no">
<meta name="viewport"
	content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
<style type="text/css">
html,body {
	position: relative;
	height: 100%;
}

body {
	background: #019fe9;
	font-family: "Microsoft YaHei";
	font-size: 14px;
	color: #000;
	margin: -0.3vw 0 0 0;
	padding: 0;
	text-align:center;
}
.weui-cell:before{
	border:0;
}
.weui-cell{
	padding:5px 5px;
}
.weui-cell>a{
	background:#3478f6;
}
.search{
	padding: 2vw 2vw;
}
.weui-picker-calendar{
	position:fixed;
	top:70vw;
}
.weui-dialog, .weui-toast{
	top:50vw;
}
table{
    width: 90vw;
    margin: 0 auto;
}
.weui-dialog__btn{
	color:#019fe9;
}
.picker-calendar-day.picker-calendar-day-selected span {
    background: #019fe9;
    color: #fff;
}
i.icon.icon-prev {
    background-image: url(<%=basePath%>static/img/left.png);
}
i.icon.icon-next {
    background-image: url(<%=basePath%>static/img/right.png);
}
</style>
</head>
<body>
	<div id="page-content" style="margin: 0;">
		<div class="weui-cells_form" style="background:#019fe9;margin: 0 auto;width:90%;">
			<!-- <div style="background:#fff;border:none;border-radius:1vw;">
			<p style="padding:1.5vw 0;color: #019fe9;font-weight:bold;font-size: 4vw;margin: 0.5vw auto 0;">
				搜索条件
			</p>
			</div>
			<div style="border-bottom:1vw solid #019fe9;">
			</div> -->
			
			<div style="border-bottom:1vw solid #019fe9;">
			</div>
			<div style="background:#fff;border:none;border-radius:1vw;">
			<div class="weui-cell" style="font-size: 4vw;padding: 2vw 2vw;">
				<p style="width: 100%;color:#019fe9;">
					
					<input id="ay" type="radio" name="a" checked style="width: 5%;display: inline-block;text-align: center;position: relative;left:-5%;"/>
					<span id="ay1" style="position: relative;left:-5%;">
						已确定勾选查询
					</span>
					<input id="ar" type="radio" name="a" style="width: 5%;display: inline-block;text-align: center;position: relative;right:-5%;"/>
					<span id="ar1" style="position: relative;right:-5%;">
						未确定勾选查询
					</span>
					
				</p>
			</div>
			</div>
			<div style="border-bottom:1vw solid #019fe9;">
			</div>
			
			<div id="a1">
			<div style="background:#fff;border:none;border-radius:1vw;">
			<div class="weui-cell" style="font-size: 4vw;padding:0;">
				<p class="search" style="width: 100%;">
					<span style="width: 100%;display: inline-block;text-align: center;">开票日期</span>
				</p>
			</div>

			<div class="weui-cell" style="font-size: 4vw;padding:0;color:#019fe9;">
					<input class="weui-input" value="${beginkp }" placeholder="请选择起始时间" id="count_biginTimekp" style="text-align:center;padding: 2vw 2vw;">
					<span>
						<img alt="" src="<%=basePath%>static/img/xiangyou.png" style="width:5vw;display: inline-block; vertical-align: middle;">
					</span>
					<input class="weui-input" value="${endkp }" placeholder="请选择结束时间" id="count_endTimekp" style="text-align:center;padding: 2vw 2vw;">
			</div>
			</div>
			
			<div class="weui-cell" style="font-size: 4vw;padding:0;background:#019fe9;">
				<span style="display: inline-block;text-align: center;position: relative;left:10vw;background:#1068bf;padding: 1vw 8vw;margin:1vw 0;border-radius:1vw;">
					<input id="reseta" onclick="CheckSetkp();" type="button" width="35vw" height="35vw" value="重置" style="border:none;background:none;cursor:pointer;color:#fff;">
				</span>
				<span style="display: inline-block;text-align: center;position: relative;left:33vw;background:#1068bf;padding: 1vw 8vw;margin:1vw 0;border-radius:1vw;">
					<input id="save" onclick="CheckPostkp();" type="button" width="35vw" height="35vw" value="搜索" style="border:none;background:none;cursor:pointer;color:#fff;">
				</span>
			</div>
			</div>
			
			<div id="a2">
			<div style="background:#fff;border:none;border-radius:1vw;">
			<div class="weui-cell" style="font-size: 4vw;padding:0;">
				<p class="search" style="width: 100%;">
					<span style="width: 100%;display: inline-block;text-align: center;">确定勾选日期</span>
				</p>
			</div>

			<div class="weui-cell" style="font-size: 4vw;padding:0;color:#019fe9;">
					<input class="weui-input" value="${begin }" placeholder="请选择起始时间" id="count_biginTimeqd" style="text-align:center;padding: 2vw 2vw;">
					<span>
						<img alt="" src="<%=basePath%>static/img/xiangyou.png" style="width:5vw;display: inline-block; vertical-align: middle;">
					</span>
					<input class="weui-input" value="${end }" placeholder="请选择结束时间" id="count_endTimeqd" style="text-align:center;padding: 2vw 2vw;">
			</div>
			</div>
			
			<div class="weui-cell" style="font-size: 4vw;padding:0;background:#019fe9;">
				<span style="display: inline-block;text-align: center;position: relative;left:10vw;background:#1068bf;padding: 1vw 8vw;margin:1vw 0;border-radius:1vw;">
					<input id="reseta" onclick="CheckSetqd();" type="button" width="35vw" height="35vw" value="重置" style="border:none;background:none;cursor:pointer;color:#fff;">
				</span>
				<span style="display: inline-block;text-align: center;position: relative;left:33vw;background:#1068bf;padding: 1vw 8vw;margin:1vw 0;border-radius:1vw;">
					<input id="save" onclick="CheckPostqd();" type="button" width="35vw" height="35vw" value="搜索" style="border:none;background:none;cursor:pointer;color:#fff;">
				</span>
			</div>
			</div>
			<div style="border-bottom:1vw solid #019fe9;">
			</div>
		</div>
	
	<div style="margin: 0 auto;width:90%;background:#019fe9;">
		<div id="b2" style="position:relative;top:-1vw;font-weight:bold;background:#fff;border:none;border-radius:1vw;padding: 1vw 4vw;color: #1068bf;font-size: 4vw;">
		<p style="">
			电子发票已确定勾选统计表
		</p>
		</div>
		<div id="b1" style="position:relative;top:-1vw;font-weight:bold;background:#fff;border:none;border-radius:1vw;padding: 1vw 4vw;color: #1068bf;font-size: 4vw;">
		<p style="">
			电子发票未确定勾选统计表
		</p>
		</div>
	<div class="weui-cells" style="margin: 0 auto;padding:0;">
		
<div id="wrapper" style="height:80vw;position:relative;top:3vw;background:#fff;">	
<div class="scroll">	
<table id="gdtable" width="100%" cellspacing="0" border="1vw" style="position:relative;top:2vw;margin:0 2vw;text-align:center;font-size: 4vw;" bordercolor="#1068bf">

  <thead bgcolor="#efeff4";>
  <tr height="45vw" width="100%">
	<th width="25%"></th>
    <th width="25%">份数</th>
    <th width="25%">金额</th>
	<th width="25%">税额</th>
  </tr>
  </thead>
  
  <tbody>
  <tr height="45vw" width="100vw">
    <td width="25%" style="color:#019fe9;"><一>蓝票</td>
    <td width="25%"></td>
    <td width="25%"></td>
	<td width="25%"></td>
  </tr>
  <tr height="45vw">
    <td width="25%">通行费发票</td>
    <td width="25%"></td>
    <td width="25%"></td>
	<td width="25%"></td>
  </tr>
  <tr height="45vw">
	<td width="25%">通行费已认证发票</td>
    <td width="25%"></td>
    <td width="25%"></td>
	<td width="25%"></td>
  </tr>
  <tr height="45vw">
	<td width="25%" style="color:#fa4659;"><二>红票</td>
    <td width="25%"></td>
    <td width="25%"></td>
	<td width="25%"></td>
  </tr>
  <tr height="45vw">
	<td width="25%">通行费发票</td>
    <td width="25%"></td>
    <td width="25%"></td>
	<td width="25%"></td>
  </tr>
  </tbody>
 
</table>
</div>
</div>			
	</div>
	</div>
	</div>
</body>
<script type="text/javascript" src="<%=basePath%>static/weui/JAC/jquery-2.1.4.js"></script>
<script type="text/javascript" src="<%=basePath%>static/weui/JAC/jquery-weui.min.js"></script>
<script type="text/javascript" src="<%=basePath%>static/weui/JAC/swiper.min.js"></script>
<script type="text/javascript" src="<%=basePath%>static/weui/JAC/iscroll.js"></script>
<script type="text/javascript">
$(window).load(function(){parent.$("#myiframe").css("height","0");parent.$("#myiframe").css("height",$("body").scrollHeight())});
//获取纳税人识别号 社会信息代码
var Index_NSRSBH = parent.$("#Index_NSRSBH").val();
var Index_SHXYDM = parent.$("#Index_SHXYDM").val();

//设置子页面的高度
var heightParent = parent.$("body").outerHeight(true);
var heightParentHeader = parent.$("#headerDiv").outerHeight(true);
$("body").height(heightParent-heightParentHeader+"px");

/* $("body").click(function(){
	 parent.slideout.close();
 }); */
parent.showZzCeng();
$.alert({
	  title: '查询说明',
	  text: '收到${all}张发票<br>已确定勾选：蓝票${yalll}张 红票${yallh}张<br>未确定勾选：蓝票${walll}张 红票${wallh}张<br><br>其中未确定勾选红票当日00:00:00自动确认勾选',
	  onOK: function () {
	    //点击确认
		parent.hideZzCeng();
	  }
});
 
$("#a1").hide();
$("#a2").show();
$("#b1").hide();
$("#b2").show();
$("div").delegate("#ay1", "click", function(){
	$("#ay").click();
});
$("div").delegate("#ar1", "click", function(){
	$("#ar").click();
});
$("div").delegate("#ay", "click", function(){
	$("#a2").show();
	$("#a1").hide();
	$("#b2").show();
	$("#b1").hide();
});
$("div").delegate("#ar", "click", function(){
	$("#a1").show();
	$("#a2").hide();
	$("#b1").show();
	$("#b2").hide();
});
 
var Scroll = new iScroll('wrapper',{hScroll: true, vScroll: false,hScrollbar:false, vScrollbar:false});
 
//调日历框
$("#count_biginTimekp").calendar();
$("#count_endTimekp").calendar();
$("#count_biginTimeqd").calendar();
$("#count_endTimeqd").calendar();

</script>

<script type="text/javascript">
//重置
function CheckSetqd(){
	parent.sessionLive(); 
	$("#count_biginTimeqd").val("");
	$("#count_endTimeqd").val("");
	initHtml();
}

//已确定勾选汇总查询信息搜索
function CheckPostqd(){
	parent.sessionLive(); 
	var Index_NSRSBH = parent.$("#Index_NSRSBH").val();
	var Index_SHXYDM = parent.$("#Index_SHXYDM").val();
	var begin = $("#count_biginTimeqd").val();
	var end = $("#count_endTimeqd").val();
	if(begin == ""&&end == ""){
		$.toast.prototype.defaults.duration='1000';
		$.toast("请选择日期！","text");
		return false;
	}
	if(begin != ""&&end == ""){
		$.toast.prototype.defaults.duration='1000';
		$.toast("请选择结束日期！","text");
		return false;
	}
	if(begin == ""&&end != ""){
		$.toast.prototype.defaults.duration='1000';
		$.toast("请选择开始日期！","text");
		return false;
	}
	if(begin != "" && end != ""){  
		  
        var startTmp=begin.split("/");  
        var endTmp=end.split("/");  
        var sd=new Date(startTmp[0],startTmp[1],startTmp[2]);  
        var ed=new Date(endTmp[0],endTmp[1],endTmp[2]);  
          
        if(sd.getTime()>ed.getTime()){
        	$.toast.prototype.defaults.duration='1000';
        	$.toast("结束日期不能早于开始日期！","text");
            $("#count_biginTimeqd").val("");
        	$("#count_endTimeqd").val("");
            return false;   
        }  
    }  
	var dataS={
			"begin":begin,
			"end":end,
			"NSRSBH":Index_NSRSBH,
			"SHXYDM":Index_SHXYDM
	};
	$.ajax({
		url: "<%=basePath%>huiZong/search.do",
        data:dataS,  
 		type: "post",
        dataType: "json",
        success: function (result) {
        	$.toast.prototype.defaults.duration='1000';
        	$.toast("数据加载中","text");
        	createHtml(result);
        }
    });
}

 //重置
function CheckSetkp(){
	parent.sessionLive(); 
	$("#count_biginTimekp").val("");
	$("#count_endTimekp").val("");
	initHtml();
}

//未确定勾选汇总查询信息搜索
function CheckPostkp(){
	parent.sessionLive(); 
	var Index_NSRSBH = parent.$("#Index_NSRSBH").val();
	var Index_SHXYDM = parent.$("#Index_SHXYDM").val();
	var begin = $("#count_biginTimekp").val();
	var end = $("#count_endTimekp").val();
	if(begin == ""&&end == ""){
		$.toast.prototype.defaults.duration='1000';
		$.toast("请选择日期！","text");
		return false;
	}
	if(begin != ""&&end == ""){
		$.toast.prototype.defaults.duration='1000';
		$.toast("请选择结束日期！","text");
		return false;
	}
	if(begin == ""&&end != ""){
		$.toast.prototype.defaults.duration='1000';
		$.toast("请选择开始日期！","text");
		return false;
	}
	if(begin != "" && end != ""){  
		  
        var startTmp=begin.split("/");  
        var endTmp=end.split("/");  
        var sd=new Date(startTmp[0],startTmp[1],startTmp[2]);  
        var ed=new Date(endTmp[0],endTmp[1],endTmp[2]);  
          
        if(sd.getTime()>ed.getTime()){ 
        	$.toast.prototype.defaults.duration='1000';
        	$.toast("结束日期不能早于开始日期！","text");
            $("#count_biginTimekp").val("");
        	$("#count_endTimekp").val("");
            return false;   
        }  
    }
	var dataS={
			"begin":begin,
			"end":end,
			"NSRSBH":Index_NSRSBH,
			"SHXYDM":Index_SHXYDM
	};
	$.ajax({
        url: "<%=basePath%>huiZong/wsearch.do",
        data:dataS,  
 		type: "post",
        dataType: "json",
        success: function (result) {
        	$.toast.prototype.defaults.duration='1000';
        	$.toast("数据加载中","text");
            createHtml(result);
        }
    });
}

function createHtml(result){
	//删除所有内容
	$("tbody tr").remove();
	$('tbody').append(
	'<tr height="45vw" width="100vw">'+
    '<td width="25%" style="color:#019fe9;"><一>蓝票</td>'+
    '<td width="25%">'+result.obj.huiZongLP.LPFS+'</td>'+
    '<td width="25%">'+result.obj.huiZongLP.LPJE+'</td>'+
	'<td width="25%">'+result.obj.huiZongLP.LPSE+'</td>'+
  '</tr>'+
  '<tr height="45vw">'+
    '<td width="25%">通行费发票</td>'+
    '<td width="25%">'+result.obj.huiZongLPTXF.LPTXFFS+'</td>'+
    '<td width="25%">'+result.obj.huiZongLPTXF.LPTXFJE+'</td>'+
	'<td width="25%">'+result.obj.huiZongLPTXF.LPTXFSE+'</td>'+
  '</tr>'+
  '<tr height="45vw">'+
	'<td width="25%">通行费已认证发票</td>'+
    '<td width="25%">'+result.obj.huiZongLPTXFRZ.LPTXFRZFS+'</td>'+
    '<td width="25%">'+result.obj.huiZongLPTXFRZ.LPTXFRZJE+'</td>'+
	'<td width="25%">'+result.obj.huiZongLPTXFRZ.LPTXFRZSE+'</td>'+
  '</tr>'+
  '<tr height="45vw">'+
	'<td width="25%" style="color:#fa4659;"><二>红票</td>'+
    '<td width="25%">'+result.obj.huiZongHP.HPFS+'</td>'+
    '<td width="25%">'+result.obj.huiZongHP.HPJE+'</td>'+
	'<td width="25%">'+result.obj.huiZongHP.HPSE+'</td>'+
  '</tr>'+
  '<tr height="45vw">'+
	'<td width="25%">通行费发票</td>'+
    '<td width="25%">'+result.obj.huiZongHPTXF.HPTXFFS+'</td>'+
    '<td width="25%">'+result.obj.huiZongHPTXF.HPTXFJE+'</td>'+
	'<td width="25%">'+result.obj.huiZongHPTXF.HPTXFSE+'</td>'+
  '</tr>'
	);
}

function initHtml(){
	//删除所有内容
	$("tbody tr").remove();
	$('tbody').append(
	'<tr height="45vw" width="100vw">'+
    '<td width="25%" style="color:#019fe9;"><一>蓝票</td>'+
    '<td width="25%"></td>'+
    '<td width="25%"></td>'+
	'<td width="25%"></td>'+
  '</tr>'+
  '<tr height="45vw">'+
    '<td width="25%">通行费发票</td>'+
    '<td width="25%"></td>'+
    '<td width="25%"></td>'+
	'<td width="25%"></td>'+
  '</tr>'+
  '<tr height="45vw">'+
	'<td width="25%">通行费已认证发票</td>'+
    '<td width="25%"></td>'+
    '<td width="25%"></td>'+
	'<td width="25%"></td>'+
  '</tr>'+
  '<tr height="45vw">'+
	'<td width="25%" style="color:#fa4659;"><二>红票</td>'+
    '<td width="25%"></td>'+
    '<td width="25%"></td>'+
	'<td width="25%"></td>'+
  '</tr>'+
  '<tr height="45vw">'+
	'<td width="25%">通行费发票</td>'+
    '<td width="25%"></td>'+
    '<td width="25%"></td>'+
	'<td width="25%"></td>'+
  '</tr>'
	);
}
</script>
</html>