完成 流水信息

CODE/smart-community/property-api/src/main/java/com/community/huiju/controller/BillStatementController.java

@@ -1,9 +1,22 @@
 package com.community.huiju.controller;
 
 
+import com.community.commom.mode.ResponseBean;
+import com.community.commom.session.UserElement;
 import com.community.huiju.common.base.BaseController;
-import org.springframework.web.bind.annotation.RequestMapping;
-import org.springframework.web.bind.annotation.RestController;
+import com.community.huiju.service.IBillStatementService;
+import io.swagger.annotations.Api;
+import io.swagger.annotations.ApiImplicitParam;
+import io.swagger.annotations.ApiImplicitParams;
+import io.swagger.annotations.ApiOperation;
+import org.apache.poi.hssf.usermodel.HSSFWorkbook;
+import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.cloud.context.config.annotation.RefreshScope;
+import org.springframework.web.bind.annotation.*;
+
+import javax.servlet.http.HttpServletResponse;
+import javax.servlet.http.HttpSession;
+import java.io.OutputStream;
 
 /**
  * <p>
@@ -14,7 +27,48 @@ import org.springframework.web.bind.annotation.RestController;
  * @since 2019-02-13
  */
 @RestController
-@RequestMapping("/tp/bill-statement")
+@RequestMapping("/")
+@RefreshScope
+@Api(value = "流水信息 API", description = "流水信息 API")
 public class BillStatementController extends BaseController {
 
+    @Autowired
+    private IBillStatementService iBillStatementService;
+
+    @ApiOperation(value = "获取流水信息", notes = "获取流水信息")
+    @ApiImplicitParams({
+            @ApiImplicitParam(dataTypeClass = String.class, paramType = "body", name = "parameter", value = "id流水编号," +
+                    "billId缴费项编号,billName缴费项名称,billInvoiceId缴费单编号,payName缴费人"),
+            @ApiImplicitParam(dataTypeClass = String.class, paramType = "header", name = "X-Auth-Token", value = "token")
+    })
+    @RequestMapping(value = "/bill/statement/all", method = RequestMethod.POST)
+    public ResponseBean getBillStatement(HttpSession session, @RequestBody String parameter) {
+        ResponseBean responseBean = new ResponseBean();
+        UserElement userElement = getUserElement(session);
+        responseBean = iBillStatementService.getBillStatement(userElement, parameter);
+        return responseBean;
+    }
+
+    @ApiOperation(value = "导出Excel", notes = "导出Excel")
+    @ApiImplicitParams({
+            @ApiImplicitParam(paramType = "header", dataTypeClass = String.class, name = "X-Auth-Token", value = "Token")
+    })
+    @RequestMapping(value = "/bill/statement/exportExcel", method = RequestMethod.GET)
+    public void exportExcel(HttpServletResponse response, HttpSession session) {
+        ResponseBean responseBean = new ResponseBean();
+        UserElement userElement = getUserElement(session);
+        HSSFWorkbook workbook = (HSSFWorkbook) iBillStatementService.exportExcel(userElement).getData();
+        this.setResponseHeader(response, "流水信息.xls");
+        //响应到客户端
+        try {
+            OutputStream os = response.getOutputStream();
+            workbook.write(os);
+            os.flush();
+            os.close();
+        } catch (Exception e) {
+            e.printStackTrace();
+        }
+    }
+
+
 }

CODE/smart-community/property-api/src/main/java/com/community/huiju/dao/BillStatementMapper.java

@@ -1,8 +1,14 @@
 package com.community.huiju.dao;
 
+import com.baomidou.mybatisplus.core.conditions.Wrapper;
 import com.baomidou.mybatisplus.core.mapper.BaseMapper;
+import com.baomidou.mybatisplus.core.metadata.IPage;
+import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
 import com.community.huiju.model.BillStatement;
 import org.apache.ibatis.annotations.Mapper;
+import org.apache.ibatis.annotations.Param;
+
+import java.util.Map;
 
 /**
  * <p>
@@ -15,4 +21,5 @@ import org.apache.ibatis.annotations.Mapper;
 @Mapper
 public interface BillStatementMapper extends BaseMapper<BillStatement> {
 
+    IPage<BillStatement> getBillStatementAll(Page page, @Param("map") Map<String, Object> map);
 }

CODE/smart-community/property-api/src/main/java/com/community/huiju/model/BillStatement.java

@@ -1,6 +1,10 @@
 package com.community.huiju.model;
 
+import com.baomidou.mybatisplus.annotation.IdType;
+import com.baomidou.mybatisplus.annotation.TableField;
+import com.baomidou.mybatisplus.annotation.TableId;
 import com.baomidou.mybatisplus.annotation.TableName;
+import javafx.scene.chart.ValueAxis;
 import lombok.Data;
 import lombok.EqualsAndHashCode;
 import lombok.experimental.Accessors;
@@ -24,6 +28,9 @@ public class BillStatement implements Serializable {
 
     private static final long serialVersionUID = 1L;
 
+    @TableId(value = "id", type = IdType.AUTO)
+    private Integer id;
+
     /**
      * 小区id
      */
@@ -62,7 +69,19 @@ public class BillStatement implements Serializable {
     /**
      * 生成流水时间
      */
-    private LocalDateTime createTime;
+    private Data createTime;
+
+    /**
+     * 收费组编号
+     */
+    @TableField(exist = false)
+    private Integer billId;
+
+    /**
+     * 收费组名称
+     */
+    @TableField(exist = false)
+    private String billName;
 
 
 }

CODE/smart-community/property-api/src/main/java/com/community/huiju/service/IBillStatementService.java

@@ -1,6 +1,8 @@
 package com.community.huiju.service;
 
 import com.baomidou.mybatisplus.extension.service.IService;
+import com.community.commom.mode.ResponseBean;
+import com.community.commom.session.UserElement;
 import com.community.huiju.model.BillStatement;
 
 /**
@@ -13,4 +15,18 @@ import com.community.huiju.model.BillStatement;
  */
 public interface IBillStatementService extends IService<BillStatement> {
 
+    /**
+     * 查询流水账单
+     * @param userElement
+     * @param parameter
+     * @return
+     */
+    ResponseBean getBillStatement(UserElement userElement, String parameter);
+
+    /**
+     * 导出Excel
+     * @param userElement
+     * @return
+     */
+    ResponseBean exportExcel(UserElement userElement);
 }

CODE/smart-community/property-api/src/main/java/com/community/huiju/service/impl/BillInvoiceServiceImpl.java

@@ -403,7 +403,7 @@ public class BillInvoiceServiceImpl extends ServiceImpl<BillInvoiceMapper, BillI
                 cell = row.createCell(11);
                 cell.setCellValue(records.get(t).getUpdateUserName());
                 cell.setCellStyle(style);
-                if (null == records.get(t).getUpdateDate()) {
+                if (null != records.get(t).getUpdateDate()) {
                     // 修改时间
                     cell = row.createCell(12);
                     cell.setCellValue(dateFormat.format(records.get(t).getUpdateDate()));

CODE/smart-community/property-api/src/main/java/com/community/huiju/service/impl/BillStatementServiceImpl.java

@@ -1,11 +1,24 @@
 package com.community.huiju.service.impl;
 
+import com.alibaba.fastjson.JSONObject;
+import com.baomidou.mybatisplus.core.metadata.IPage;
+import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
 import com.baomidou.mybatisplus.extension.service.impl.ServiceImpl;
+import com.community.commom.mode.ResponseBean;
+import com.community.commom.session.UserElement;
+import com.community.huiju.model.BillInvoice;
 import com.community.huiju.model.BillStatement;
 import com.community.huiju.dao.BillStatementMapper;
 import com.community.huiju.service.IBillStatementService;
+import com.google.common.collect.Maps;
+import org.apache.poi.hssf.usermodel.*;
+import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.stereotype.Service;
 
+import java.text.SimpleDateFormat;
+import java.util.List;
+import java.util.Map;
+
 /**
  * <p>
  * 账单流水表 服务实现类
@@ -17,4 +30,155 @@ import org.springframework.stereotype.Service;
 @Service
 public class BillStatementServiceImpl extends ServiceImpl<BillStatementMapper, BillStatement> implements IBillStatementService {
 
+    @Autowired
+    private BillStatementMapper billStatementMapper;
+
+    @Override
+    public ResponseBean getBillStatement(UserElement userElement, String parameter) {
+        ResponseBean responseBean = new ResponseBean();
+        JSONObject jsonObject = JSONObject.parseObject(parameter);
+
+        Integer pageNum = jsonObject.getInteger("pageNum");
+        Integer pageSize = jsonObject.getInteger("pageSize");
+        // 流水 id
+        Integer id = jsonObject.getInteger("id");
+        // 缴费项 id
+        Integer billId = jsonObject.getInteger("billId");
+        // 缴费项 名称
+        String billName = jsonObject.getString("billName");
+        // 缴费单 编号
+        Integer billInvoiceId = jsonObject.getInteger("billInvoiceId");
+        // 缴费人
+        String payName = jsonObject.getString("payName");
+
+        // 参数
+        Map<String, Object> map = Maps.newHashMap();
+        map.put("id", id);
+        map.put("billId", billId);
+        map.put("billName", billName);
+        map.put("billInvoiceId", billInvoiceId);
+        map.put("payName", payName);
+        map.put("communityId", userElement.getCommunityId());
+
+        Page<BillStatement> page = new Page<>();
+        page.setCurrent(pageNum);
+        page.setSize(pageSize);
+        IPage<BillStatement> billStatementIPage = billStatementMapper.getBillStatementAll(page, map);
+
+        Map<String, Object> respMap = Maps.newHashMap();
+        respMap.put("list", billStatementIPage.getRecords());
+        respMap.put("pageNum", billStatementIPage.getCurrent());
+        respMap.put("pageSize", billStatementIPage.getSize());
+        respMap.put("total", billStatementIPage.getTotal());
+
+        responseBean.addSuccess(respMap);
+        return responseBean;
+    }
+
+    @Override
+    public ResponseBean exportExcel(UserElement userElement) {
+        ResponseBean responseBean = new ResponseBean();
+        String [] title = new String[] { "流水号","收费组编号","收费组名称","收费单号","费用金额","缴费人","缴费备注","缴费方式","流水生成时间"};
+
+        HSSFWorkbook excel = excel(title, userElement,null);
+        responseBean.addSuccess(excel);
+        return responseBean;
+    }
+
+    /**
+     * 表格
+     * @param title
+     * @param workbook
+     * @return
+     */
+    private HSSFWorkbook excel(String[] title, UserElement userElement, HSSFWorkbook workbook) {
+        SimpleDateFormat dateFormat = new SimpleDateFormat("yyyy-MM-dd");
+
+        if (null == workbook) {
+            workbook = new HSSFWorkbook();
+        }
+        HSSFSheet sheet = workbook.createSheet("缴费单");
+        // 行数标记
+        int rowNum = 0;
+        // 创建一行,用作标题
+        HSSFRow row = sheet.createRow(rowNum);
+        // 创建样式
+        HSSFCellStyle style = workbook.createCellStyle();
+        // 居中
+        style.setAlignment(HSSFCellStyle.ALIGN_CENTER);
+
+        // 创建列对象
+        HSSFCell cell = null;
+
+        // 写入表头
+        for (int i = 0; i<title.length; i++) {
+            cell = row.createCell(i);
+            cell.setCellValue(title[i]);
+            cell.setCellStyle(style);
+        }
+
+        Map<String, Object> map = Maps.newHashMap();
+        map.put("communityId", userElement.getCommunityId());
+
+        Page<BillStatement> page = new Page<>();
+        page.setCurrent(1);
+        page.setSize(500);
+        IPage<BillStatement> billInvoiceIPage = billStatementMapper.getBillStatementAll(page, map);
+        List<BillStatement> records = billInvoiceIPage.getRecords();
+
+
+        // 写入内容
+        for (int i = 1; i<= billInvoiceIPage.getPages(); i++) {
+            for (int t = 0; t<records.size(); t++) {
+                row = sheet.createRow(++rowNum);
+                // 流水号
+                cell = row.createCell(0);
+                cell.setCellValue(records.get(t).getId());
+                cell.setCellStyle(style);
+                // 收费组编号
+                cell = row.createCell(1);
+                cell.setCellValue(records.get(t).getBillId());
+                cell.setCellStyle(style);
+                // 收费组名称
+                cell = row.createCell(2);
+                cell.setCellValue(records.get(t).getBillName());
+                cell.setCellStyle(style);
+                // 收费单号
+                cell = row.createCell(3);
+                cell.setCellValue(records.get(t).getBillInvoiceId());
+                cell.setCellStyle(style);
+                // 费用金额
+                cell = row.createCell(4);
+                double price = Double.valueOf(records.get(t).getPayPrice()) / 100.00;
+                cell.setCellValue(price);
+                cell.setCellStyle(style);
+                // 缴费人
+                cell = row.createCell(5);
+                cell.setCellValue(records.get(t).getPayName());
+                cell.setCellStyle(style);
+                // 缴费备注
+                cell = row.createCell(6);
+                cell.setCellValue(records.get(t).getPayRemark());
+                cell.setCellStyle(style);
+                // 缴费方式
+                cell = row.createCell(7);
+                cell.setCellValue("0".equals(records.get(t).getPayType()) ? "微信支付" : "1".equals(records.get(t).getPayType()) ? "线下缴费" : "未知");
+                cell.setCellStyle(style);
+                if (null != records.get(t).getCreateTime()) {
+                    // 生成流水时间
+                    cell = row.createCell(8);
+                    cell.setCellValue(dateFormat.format(records.get(t).getCreateTime()));
+                    cell.setCellStyle(style);
+                }
+            }
+            page.setCurrent(i);
+            page.setSize(500);
+            billInvoiceIPage = billStatementMapper.getBillStatementAll(page, map);
+            records = billInvoiceIPage.getRecords();
+
+        }
+
+        return workbook;
+    }
+
 }

CODE/smart-community/property-api/src/main/resources/mapper/BillStatementMapper.xml

@@ -2,4 +2,38 @@
 <!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
 <mapper namespace="com.community.huiju.dao.BillStatementMapper">
 
+    <select id="getBillStatementAll" resultType="com.community.huiju.model.BillStatement">
+        SELECT
+            tbs.*,
+            tb.id as billId,
+            tb.bill_name as billName
+        FROM
+            tp_bill_statement tbs
+        LEFT JOIN tp_bill_invoice tbi ON tbs.bill_invoice_id = tbi.id
+        LEFT JOIN tp_bill tb ON tbi.bill_id = tb.id
+        <where>
+            <trim prefixOverrides="and | or">
+                <if test="map.id != null">
+                    and tbs.id = #{map.id}
+                </if>
+                <if test="map.billId != null">
+                    and tb.id = #{map.billId}
+                </if>
+                <if test="map.billName != null and map.billName != ''">
+                    and tb.bill_name like CONCAT('%',#{map.billName},'%')
+                </if>
+                <if test="map.billInvoiceId != null">
+                    and tbs.id = #{map.billInvoiceId}
+                </if>
+                <if test="map.payName != null and map.payName != ''">
+                    and tbs.pay_name like CONCAT('%', #{map.payName}, '%')
+                </if>
+                <if test="map.communityId != null">
+                    and tbs.community_id = #{map.communityId}
+                </if>
+            </trim>
+        </where>
+        order by tbs.create_time DESC
+    </select>
+
 </mapper>

VUECODE/smart-property-manage/src/api/billInvoice.js

@@ -113,3 +113,12 @@ export function updateBillInvoiceIdPayPrice(data) {
     }
   })
 }
+
+// 下载excel
+export function exportExcel(billId) {
+  return request({
+    url: '/bill/invoice/exportExcel/' + billId,
+    method: 'get',
+    responseType: 'blob'
+  })
+}

VUECODE/smart-property-manage/src/api/billStatement.js

@@ -0,0 +1,28 @@
+import request from '@/utils/request'
+
+// 获取流水信息
+export function getBillStatementAll(data) {
+  return request({
+    url: '/bill/statement/all',
+    method: 'post',
+    data: {
+      id: data.id, // 流水 id
+      billId: data.billId, // 缴费项 id
+      billName: data.billName, //  缴费项 名称
+      billInvoiceId: data.billInvoiceId, // 缴费单 编号
+      payName: data.payName, //  缴费人
+      pageNum: data.pageNum,
+      pageSize: data.pageSize
+    }
+  })
+}
+
+// 下载excel
+export function exportExcel() {
+  return request({
+    url: '/bill/statement/exportExcel',
+    method: 'get',
+    responseType: 'blob'
+  })
+}
+

VUECODE/smart-property-manage/src/router/index.js

@@ -247,6 +247,12 @@ export const constantRouterMap = [
         name: 'bill-info-add',
         hidden: true,
         meta: { title: '添加更多收费单', icon: 'table' }
+      },
+      {
+        path: '/bill/management/statement/index',
+        component: () => import('@/views/bill/statement/index'),
+        name: 'bill-statement-index',
+        meta: { title: '流水信息', icon: 'table' }
       }
     ]
   },

VUECODE/smart-property-manage/src/store/index.js

@@ -15,6 +15,7 @@ import role from './modules/role'
 import billInvoice from './modules/billInvoice'
 import ticket from './modules/ticket'
 import bill from './modules/bill'
+import billStatement from './modules/billStatement'
 
 Vue.use(Vuex)
 
@@ -33,7 +34,8 @@ const store = new Vuex.Store({
     role,
     billInvoice,
     ticket,
-    bill
+    bill,
+    billStatement
   },
   getters
 })

VUECODE/smart-property-manage/src/store/modules/billInvoice.js

@@ -1,4 +1,4 @@
-import { getBillInvoiceList, updateBillNameAndBillExplainAndEndDate, getBillByIdInfo, deleteBillInvoiceById, billInvoiceOfflinePayment, updateBillInvoiceStatus, addTempBillInvoice, getTempBillInvoice, deleteTempBillInvoice, updateBillInvoiceIdPayPrice } from '@/api/billInvoice'
+import { getBillInvoiceList, updateBillNameAndBillExplainAndEndDate, getBillByIdInfo, deleteBillInvoiceById, billInvoiceOfflinePayment, updateBillInvoiceStatus, addTempBillInvoice, getTempBillInvoice, deleteTempBillInvoice, updateBillInvoiceIdPayPrice, exportExcel } from '@/api/billInvoice'
 
 const billInvoice = {
   state: {
@@ -97,6 +97,15 @@ const billInvoice = {
           reject(error)
         })
       })
+    },
+    ExportBillInvoiceExcel({ commit }, billId) { // 下载excel
+      return new Promise((resolve, reject) => {
+        exportExcel(billId).then(response => {
+          resolve(response)
+        }).catch(error => {
+          reject(error)
+        })
+      })
     }
   }
 }

VUECODE/smart-property-manage/src/store/modules/billStatement.js

@@ -0,0 +1,32 @@
+import { getBillStatementAll, exportExcel } from '@/api/billStatement'
+
+const billStatement = {
+  state: {
+
+  },
+  mutations: {
+
+  },
+  actions: {
+    GetBillStatementAll({ commit }, data) { // 获取流水信息
+      return new Promise((resolve, reject) => {
+        getBillStatementAll(data).then(response => {
+          resolve(response)
+        }).catch(error => {
+          reject(error)
+        })
+      })
+    },
+    ExportBillStatementExcel({ commit }) { // 导出 excel
+      return new Promise((resolve, reject) => {
+        exportExcel().then(response => {
+          resolve(response)
+        }).catch(error => {
+          reject(error)
+        })
+      })
+    }
+  }
+}
+
+export default billStatement

VUECODE/smart-property-manage/src/views/bill/info/index.vue

@@ -63,7 +63,7 @@
       <el-button type="primary" @click="addBillInvoice">添加更多收费单</el-button>
       <el-button type="danger" @click="deleteBeachIds">删除</el-button>
       <el-button type="primary" @click="offlinePayment">设置为已线下缴费</el-button>
-      <el-button type="success">导出数据</el-button>
+      <el-button type="success" @click="exportExcel">导出数据</el-button>
       <div style="height: 40px; line-height: 40px; margin-left: 10px; color: #99a9bf;">未缴户主费用可以直接点击 收费金额数字 修改，已缴费业主无法修改，需要线下多退少补</div>
     </div>
     <el-table
@@ -425,6 +425,19 @@ export default {
     showPayPrice(payPrice) { //  转换金额
       const price = payPrice / 100
       return price
+    },
+    exportExcel() {
+      this.$store.dispatch('ExportBillInvoiceExcel', this.formInline.billId).then(res => {
+        const url = window.URL.createObjectURL(new Blob([res]))
+        const link = document.createElement('a')
+        link.style.display = 'none'
+        link.href = url
+        link.setAttribute('download', '缴费单.xls')
+        document.body.appendChild(link)
+        link.click()
+      }).catch(() => {
+        console.log('error ExportBillInvoiceExcel')
+      })
     }
   }
 }

VUECODE/smart-property-manage/src/views/bill/statement/index.vue

@@ -0,0 +1,216 @@
+<template>
+  <div id="root">
+    <el-form :model="formInline" inline class="form-inline">
+      <el-form-item label="流水号">
+        <el-input v-model="formInline.id" placeholder="流水号"/>
+      </el-form-item>
+      <el-form-item label="缴费项目编号">
+        <el-input v-model="formInline.billId" placeholder="缴费项目编号"/>
+      </el-form-item>
+      <el-form-item label="缴费项目名">
+        <el-input v-model="formInline.billName" placeholder="缴费项目名"/>
+      </el-form-item>
+      <el-form-item label="收费单号">
+        <el-input v-model="formInline.billInvoiceId" placeholder="收费单号"/>
+      </el-form-item>
+      <el-form-item label="缴费人">
+        <el-input v-model="formInline.payName" placeholder="缴费人"/>
+      </el-form-item>
+      <el-form-item>
+        <el-button type="info" @click="clear">清空</el-button>
+        <el-button type="primary" @click="getBillStatement">搜索</el-button>
+      </el-form-item>
+    </el-form>
+    <el-button type="primary" style="margin-left: 20px; margin-bottom: 20px;" @click="exportExcel">导出数据</el-button>
+    <el-table
+      ref="multipleTable"
+      :data="list"
+      border
+      tooltip-effect="dark"
+      style="width: 100%"
+      @selection-change="handleSelectionChange">
+      <!--<el-table-column-->
+      <!--type="selection"-->
+      <!--align="center"-->
+      <!--width="55"/>-->
+      <el-table-column
+        label="流水号"
+        prop="id"
+        align="center">
+        <!--<template slot-scope="scope">{{ scope.row.date }}</template>-->
+      </el-table-column>
+      <el-table-column
+        prop="billId"
+        align="center"
+        label="收费组编号">
+        <template slot-scope="scope">
+          <span style="color: #409EFF;cursor: pointer" @click="getInfo(scope.row.billId)">{{ scope.row.billId }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column
+        prop="billName"
+        label="收费组名称"
+        align="center"
+        show-overflow-tooltip>
+        <template slot-scope="scope">
+          <span style="color: #409EFF;cursor: pointer" @click="getInfo(scope.row.billId)">{{ scope.row.billName }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column
+        prop="billInvoiceId"
+        label="收费单号"
+        align="center"
+        width="120"/>
+      <el-table-column
+        prop="payPrice"
+        align="center"
+        label="费用金额">
+        <template slot-scope="scope">{{ showPayPrice(scope.row.payPrice) }}</template>
+      </el-table-column>
+      <el-table-column
+        prop="payName"
+        align="center"
+        label="缴费人"/>
+      <el-table-column
+        prop="payRemark"
+        align="center"
+        label="缴费备注"/>
+      <el-table-column
+        prop="payType"
+        align="center"
+        label="缴费方式">
+        <template slot-scope="scope">{{ showPayType(scope.row.payType) }}</template>
+      </el-table-column>
+      <el-table-column
+        prop="createTime"
+        align="center"
+        label="流水生成时间">
+        <template slot-scope="scope">{{ formatDate(scope.row.createTime) }}</template>
+      </el-table-column>
+    </el-table>
+    <div class="foot-page">
+      <el-pagination
+        :current-page="formInline.pageNum"
+        :page-sizes="[10, 20, 40, 100]"
+        :page-size="formInline.pageSize"
+        :total="total"
+        layout="total, sizes, prev, pager, next, jumper"
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"/>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'Index',
+  data() {
+    return {
+      formInline: {
+        id: '', // 流水 id
+        billId: '', // 缴费项 id
+        billName: '', //  缴费项 名称
+        billInvoiceId: '', // 缴费单 编号
+        payName: '', //  缴费人
+        pageNum: 1,
+        pageSize: 10
+      },
+      list: [], // 数据
+      total: 0 // 总数
+    }
+  },
+  mounted() {
+    this.getBillStatement()
+  },
+  methods: {
+    handleSelectionChange(val) {
+      console.log(val)
+    },
+    handleSizeChange(val) {
+      console.log(`每页 ${val} 条`)
+      this.formInline.pageSize = val
+      this.getBillStatement()
+    },
+    handleCurrentChange(val) {
+      console.log(`当前页: ${val}`)
+      this.formInline.pageNum = val
+      this.getBillStatement()
+    },
+    getBillStatement() { //  获取流水信息
+      this.$store.dispatch('GetBillStatementAll', this.formInline).then(res => {
+        const resData = res.data
+        this.list = resData.list
+        this.formInline.pageNum = resData.pageNum
+        this.formInline.pageSize = resData.pageSize
+        this.total = resData.total
+      }).catch(() => {
+        console.log('error GetBillStatementAll')
+      })
+    },
+    showPayType(obj) {
+      let str = ''
+      switch (obj) {
+        case '0':
+          str = '微信缴费'
+          break
+        case '1':
+          str = '线下缴费'
+          break
+      }
+      return str
+    },
+    formatDate(val) {
+      var value = new Date(val)
+      var year = value.getFullYear()
+      var month = value.getMonth() + 1
+      var day = value.getDate()
+      // var hour = value.getHours()
+      // var minutes = value.getMinutes()
+      // var seconds = value.getSeconds()
+      // return year + '-' + month + '-' + day + ' ' + hour + ':' + minutes + ':' + seconds
+      return year + '-' + month + '-' + day
+    },
+    showPayPrice(payPrice) { //  转换金额
+      const price = payPrice / 100
+      return price
+    },
+    getInfo(billId) { // 跳转收费组详情
+      this.$router.push({ name: 'bill-info', params: { id: billId }})
+    },
+    clear() { // 情空
+      this.formInline.pageNum = 1
+      this.formInline.pageSize = 10
+      this.formInline.id = '' // 流水 id
+      this.formInline.billId = '' // 缴费项 id
+      this.formInline.billName = '' //  缴费项 名称
+      this.formInline.billInvoiceId = '' // 缴费单 编号
+      this.formInline.payName = '' //  缴费人
+    },
+    exportExcel() {
+      this.$store.dispatch('ExportBillStatementExcel', this.formInline.billId).then(res => {
+        const url = window.URL.createObjectURL(new Blob([res]))
+        const link = document.createElement('a')
+        link.style.display = 'none'
+        link.href = url
+        link.setAttribute('download', '流水信息.xls')
+        document.body.appendChild(link)
+        link.click()
+      }).catch(() => {
+        console.log('error ExportBillStatementExcel')
+      })
+    }
+  }
+}
+</script>
+
+<style scoped>
+.form-inline {
+  margin-top: 20px;
+  margin-right: 20px;
+  margin-left: 20px;
+}
+.foot-page {
+  display: flex;
+  justify-content: flex-end;
+}
+</style>