账单推送相关页面

src/api/business/billPush.js

@@ -0,0 +1,12 @@
+import request from '@/utils/request'
+import constant from '@/constant'
+
+function pageList(formData){
+  return request.post(constant.serverUrl + "/business/billPush/pageList", formData);
+}
+
+
+
+export default {
+    pageList
+  }

src/routers/modules/business.js

@@ -51,6 +51,19 @@ var routers = [
                         title: '请假记录'
                 }
         },
+        {
+                //账单推送管理
+                path: '/business/billPush/list',
+                name: 'business-billPush-list',
+                // route level code-splitting
+                // this generates a separate chunk (about.[hash].js) for this route
+                // which is lazy-loaded when the route is visited.
+                component: () => import('@/views/business/billPush-list.vue'),
+                meta: {
+                        roles: ["admin"],
+                        title: '账单推送管理'
+                }
+        },
 ]
 
 export default routers;

src/views/business/billPush-list.vue

@@ -0,0 +1,178 @@
+<template>
+    <div>
+        <el-breadcrumb separator=">">
+            <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
+            <el-breadcrumb-item>
+                <a href="#">系统管理</a>
+            </el-breadcrumb-item>
+            <el-breadcrumb-item>
+                <a href="#">账单推送管理</a>
+            </el-breadcrumb-item>
+            </el-breadcrumb>
+        <el-divider></el-divider>
+        <el-form ref="queryForm" :model="queryModel" inline class="demo-form-inline">
+            <el-form-item label="账单名称" prop="name">
+                <el-input type="text" size="mini" v-model="queryModel.name"></el-input>
+            </el-form-item>
+            <el-form-item>
+                <el-button
+                type="primary"
+                size="mini"
+                icon="ios-search"
+                @click="changePage(1)"
+                :loading="loading"
+                >查询</el-button>&nbsp;
+                <el-button
+                type="info"
+                size="mini"
+                style="margin-left: 8px"
+                @click="handleReset('queryForm')"
+                >重置</el-button>&nbsp;
+            </el-form-item>
+        </el-form>
+        <el-divider></el-divider>
+        <el-row class="button-group">
+            <el-button
+                type="primary"
+                size="small"
+                plain
+                icon="el-icon-circle-plus"
+                @click="handleAdd"
+                >创建账单</el-button
+            >
+        </el-row>
+        <el-table :data="tableData" style="min-height:400px;" v-loading="loading" stripe>
+            <el-table-column type="index" label="序号" :index="indexMethod" width="50"></el-table-column>
+            <el-table-column prop="name" label="账单名称" width="120"></el-table-column>
+            <el-table-column prop="bak" label="账单备注" width="120"></el-table-column>
+            <el-table-column prop="collectionAccount" label="收款账户" width="120"></el-table-column>
+            <el-table-column prop="payService" label="收费项目" width="120"></el-table-column>
+            <el-table-column prop="pushTime" label="账单推送时间" width="120"></el-table-column>
+            <el-table-column label="账单推送情况" width="180">
+                <template slot-scope="{row}">
+                    <div>应发送人数：{{row.totalPushNumber}}</div>
+                    <div>实发送人数：{{row.actualPushNumber}}</div>
+                    <div>未通知人数：{{row.notYetPushNumber}}<span class="span-view"><el-link type="primary"><i class="el-icon-view"></i></el-link></span></div>
+                    
+                </template>
+            </el-table-column>
+            <el-table-column label="账单收缴情况" width="180">
+                <template slot-scope="{row}">
+                    <div>应收：{{row.totalReceivable}}元</div>
+                    <div>实收：{{row.netReceipts}}元</div>
+                    <div>未收：{{row.notReceived}}元<span class="span-view"><el-link type="primary"><i class="el-icon-view"></i></el-link></span></div>
+                </template>
+            </el-table-column>
+            <el-table-column prop="payee" label="收款方" width="80"></el-table-column>
+            <el-table-column label="操作">
+                <template slot-scope="{row}">
+                    <div>
+                        <span class="link-span"><el-link  type="success" @click="handleEdit(row)">导入名单</el-link></span>
+                        <el-link  type="primary" @click="handleDelete(row)">查看详情</el-link>
+                    </div>
+                    <div>
+                        <span class="link-span"><el-link  type="primary" @click="handleDelete(row)">推送账单</el-link></span>
+                        <el-link  type="warning" @click="handleDelete(row)">关闭账单</el-link>
+                    </div>
+                    <el-link  type="danger" @click="handleDelete(row)">删除账单</el-link>
+                </template>
+            </el-table-column>
+        </el-table>
+        <el-pagination
+        :current-page.sync="pageIndex"
+        :total="totalElements"
+        :page-sizes="pageSizeList"
+        @current-change="changePage"
+        @size-change="pageSizeChange"
+        layout="total, sizes, prev, pager, next, jumper"
+        ></el-pagination>
+    </div>
+</template>
+<script>
+import Constant from "@/constant";
+import billPushApi from "@/api/business/billPush";
+export default {
+    name: "businessBillPushList",
+    data() {
+        var self = this;
+
+        return {
+            queryModel: {
+                personName: "",
+                status: "",
+                requestTimeRange: ['',''],
+            },
+            loading: false,
+            tableData: [],
+            pageIndex: 1,
+            pageSize: 10,
+            totalPages: 0,
+            totalElements: 0,
+            pageSizeList: [10, 20, 30],
+            multipleSelection: [],
+            showModal: false,
+        }
+    },
+    methods: {
+        changePage(pageIndex) {
+            var self = this;
+
+            self.loading = true;
+
+            self.pageIndex = pageIndex;
+            var formData = new FormData();
+
+            formData.append("pageIndex", self.pageIndex);
+            formData.append("pageSize", self.pageSize);
+
+
+            billPushApi.pageList(formData)
+                .then(function(response) {
+                    self.loading = false;
+
+                    var jsonData = response.data.data;
+
+                    self.tableData = jsonData.data;
+                    self.totalPages = jsonData.totalPages;
+                    self.totalElements = jsonData.recordsTotal;
+                })
+                .catch(error => {
+                    self.loading = false;
+                    // self.$message.error(error + "");
+                });
+        },
+        pageSizeChange(pageSize) {
+            this.pageSize = pageSize;
+        },
+    },
+    mounted: function() {
+        this.changePage(1);
+    }
+}
+</script>
+<style lang="scss" scoped>
+.el-breadcrumb {
+  margin: 10px;
+  line-height: 20px;
+}
+
+.el-divider {
+  margin: 5px 0;
+}
+
+.demo-form-inline {
+  margin-left: 10px;
+  text-align: left;
+}
+
+.button-group {
+  margin-left: 10px;
+  text-align: left;
+}
+.link-span{
+    margin-right: 30px;
+}
+.span-view{
+    margin-left: 10px;
+}
+</style>