Merge branch 'new_web' of http://39.108.172.131:3000/Shannon_mu/SmartCommunity into new_web

operationSupport/src/router/index.js

@@ -116,6 +116,31 @@ const zRoute = [
         meta: { title: '费用报表' },
         name: 'expenseReport'
     },
+    {
+        path: '/waterChargeDetails/index',
+        component: () => import(/* webpackChunkName: "404" */ '@views/payService/statisticalReport/waterChargeDetails.vue'),
+        meta: { title: '水费明细' },
+        name: 'waterChargeDetails'
+    },
+    {
+        path: '/electricityBillDetails/index',
+        component: () => import(/* webpackChunkName: "404" */ '@views/payService/statisticalReport/electricityBillDetails.vue'),
+        meta: { title: '电费明细' },
+        name: 'electricityBillDetails'
+    },
+    {
+        path: '/propertyFeeStatistics/index',
+        component: () => import(/* webpackChunkName: "404" */ '@views/payService/statisticalReport/propertyFeeStatistics.vue'),
+        meta: { title: '物业费统计' },
+        name: 'propertyFeeStatistics'
+    },
+    {
+        path: '/chargeStatistics/index',
+        component: () => import(/* webpackChunkName: "404" */ '@views/payService/statisticalReport/chargeStatistics.vue'),
+        meta: { title: '收费统计' },
+        name: 'chargeStatistics'
+    },
+    
     // {
     //     path: '/invoiceManagement/index',
     //     component: () => import(/* webpackChunkName: "404" */ '@views/payService/invoiceManagement/index.vue'),

operationSupport/src/views/facilityInspections/popups/add.vue

@@ -21,7 +21,7 @@
             <el-cascader
                 :key="typeValueKey"
                 ref="typeValue"
-                v-model="formData.typeValue"
+                v-model="typeValueW"
                 :props="defaultProps"
                 :options="deviceArr"
                 @change="deviceArrToggle"
@@ -166,10 +166,10 @@ export default {
             defaultProps: {
                 value: 'id', // 唯一标识
                 label: 'label', // 标签显示
-                children: 'children',
-                emitPath: false
+                children: 'children'
             },
             typeValueKey: 0,
+            typeValueW: [],
             effectiveDate: []
         };
     },
@@ -206,6 +206,7 @@ export default {
             this.formData.peopleName = this.$refs.userName.getCheckedNodes()[0].label;
         },
         deviceArrToggle() {
+            this.formData.typeValue = this.typeValueW[this.typeValueW.length - 1];
             if (!!this.formData.typeValue) {
                 this.formData.type = this.$refs.typeValue.getCheckedNodes()[0].data.type;
             }
@@ -268,6 +269,7 @@ export default {
                     remark: remark,
                     id: id
                 };
+                this.typeValueW = typeValue;
                 this.effectiveDate = [data.startDate, data.endDate];
                 resolve && resolve(true);
             });

operationSupport/src/views/patrolManagement/popups/addPoint.vue

@@ -1,10 +1,10 @@
 <template>
     <div>
         <zz-form :cols="formCols" :data="formData" :rules="formRules" labelWidth="100" ref="form">
-            <el-select v-model="formData.communityId" placeholder="请选择所属社区" clearable slot="communityId">
+            <el-select v-model="formData.communityId" placeholder="请选择所属社区" clearable slot="communityId" @change="communityChange">
                 <el-option v-for="(item, index) in communityArr" :key="index" :label="item.communityName" :value="item.id"></el-option>
             </el-select>
-            <el-select v-model="formData.buildingId" placeholder="请选择楼栋" clearable slot="buildingId">
+            <el-select v-model="formData.buildingId" placeholder="请选择楼栋" clearable slot="buildingId" @change="buildingChange">
                 <el-option v-for="(item, index) in buildingArr" :key="index" :label="item.label" :value="item.id"></el-option>
             </el-select>
             <el-select v-model="formData.unit" placeholder="请选择单元" clearable slot="unit">
@@ -81,44 +81,11 @@ export default {
             communityArr: [],
             buildingArr: [],
             unitArr: [],
+            backfill: false,
             mapPopUpStatus: false //地图弹出框
         };
     },
-    watch: {
-        'formData.communityId'(e) {
-            this.communityTre.map((item) => {
-                this.buildingArr = [];
-                if (item.value == e && !!item.children) {
-                    item.children.map((itemBuilding) => {
-                        this.buildingArr.push({
-                            label: itemBuilding.name,
-                            id: itemBuilding.value,
-                            children: itemBuilding.children,
-                            type: itemBuilding.type
-                        });
-                    });
-                }
-            });
-        },
-        'formData.buildingId'(e) {
-            this.buildingArr.map((item) => {
-                this.unitArr = [];
-                if (item.id == e && !!item.children) {
-                    item.children.map((itemUnit) => {
-                        if (itemUnit.type == 'unit') {
-                            this.$nextTick(() => {
-                                this.unitArr.push({
-                                    label: itemUnit.name,
-                                    id: itemUnit.value,
-                                    type: itemUnit.type
-                                });
-                            });
-                        }
-                    });
-                }
-            });
-        }
-    },
+    watch: {},
     methods: {
         QueryClick() {
             new Promise((resolve) => {
@@ -138,6 +105,32 @@ export default {
                 this.formData.longitude = e.lng;
             });
         },
+        CheckChinese(val, name) {
+            var reg = new RegExp('[\\u4E00-\\u9FFF]+', 'g');
+            let newVal = val;
+            if (!reg.test(val)) {
+                newVal = val + name;
+            }
+            return newVal;
+        },
+        nestedLoop(arr, type, thisArr, e, resolve) {
+            let newArr = [];
+            arr.map((item) => {
+                if (item.id == e && !!item.children) {
+                    item.children.map((itemUnit) => {
+                        if (itemUnit.type == type) {
+                            newArr.push({
+                                label: this.CheckChinese(itemUnit.name, type == 'unit' ? '单元' : '楼栋'),
+                                id: type == 'unit' ? itemUnit.value : Number(itemUnit.value),
+                                type: itemUnit.type,
+                                children: itemUnit.children
+                            });
+                        }
+                    });
+                }
+            });
+            this[thisArr] = newArr;
+        },
         submit() {
             new Promise((resolve) => {
                 this.$refs.form.validate(resolve);
@@ -173,15 +166,27 @@ export default {
                         loading.close();
                     });
             });
+        },
+        communityChange(e) {
+            this.formData.buildingId = '';
+            this.formData.unit = '';
+            this.nestedLoop(this.communityTre, 'building', 'buildingArr', e);
+        },
+        buildingChange(e) {
+            this.formData.unit = '';
+            this.nestedLoop(this.buildingArr, 'unit', 'unitArr', e);
         }
     },
     created() {
         this.communityTre = this.params.communityTre;
         this.communityArr = this.params.communityArr;
         if (this.params.todo == 'edit') {
-            this.formData = JSON.parse(JSON.stringify(this.params.data));
-            this.initDot = [this.params.data.latitude, this.params.data.longitude];
-            this.formData.latitude = `${this.params.data.latitude},${this.params.data.longitude}`;
+            let newData = this.params.data;
+            this.formData = newData;
+            this.nestedLoop(this.communityTre, 'building', 'buildingArr', newData.communityId);
+            this.nestedLoop(this.buildingArr, 'unit', 'unitArr', newData.buildingId);
+            this.initDot = [newData.latitude, newData.longitude];
+            this.formData.latitude = `${newData.latitude},${newData.longitude}`;
         }
     }
 };

operationSupport/src/views/payService/statisticalReport/chargeStatistics.vue

@@ -0,0 +1,201 @@
+<template>
+    <div class="main">
+        <div class="search">
+            <el-select v-model="mixins_query.communityId" placeholder="选择社区" clearable>
+                <el-option v-for="(item, index) in communityArr" :key="index" :label="item.communityName" :value="item.id"></el-option>
+            </el-select>
+
+            <el-date-picker
+                v-model="times"
+                value-format="yyyy-MM-dd"
+                type="daterange"
+                range-separator="至"
+                start-placeholder="选择开始日期"
+                end-placeholder="选择结束日期"
+                @change="effectiveDateToggle"
+            ></el-date-picker>
+
+            <el-button type="primary" class="search-btn" @click="mixins_search" icon="el-icon-search">查询 </el-button>
+            <div class="search-icon">
+                <el-tooltip class="item" effect="light" placement="bottom" content="导出">
+                    <i class="zoniot_font zoniot-icon-daochu2" @click="exportExcel"></i>
+                </el-tooltip>
+            </div>
+        </div>
+        <zz-table
+            :cols="cols"
+            :settings="{ showIndex: true, stripe: true }"
+            :loading="mixins_onQuery"
+            :data="mixins_list"
+            :pageset="mixins_pageset"
+            @page-change="pageChange"
+        >
+        </zz-table>
+    </div>
+</template>
+
+<script>
+import list from '@utils/list.js';
+export default {
+    mixins: [list],
+    data() {
+        return {
+            cols: [
+                {
+                    label: '社区名称',
+                    prop: 'communityName'
+                },
+                {
+                    label: '房间',
+                    prop: 'assets'
+                },
+                {
+                    label: '业主',
+                    prop: 'createDate'
+                },
+                {
+                    label: '物业费标准(元/月)',
+                    prop: 'paymentMethod',
+                    format(val) {
+                        if (val == '1') {
+                            return '微信';
+                        } else if (val == '2') {
+                            return '支付宝';
+                        } else if (val == '3') {
+                            return '现金';
+                        } else if (val == '4') {
+                            return '预存';
+                        } else if (val == '5') {
+                            return '其他';
+                        }
+                    }
+                },
+                {
+                    label: '月数',
+                    prop: 'userName'
+                },
+                {
+                    label: '物业费(元)',
+                    prop: 'phone'
+                },
+                {
+                    label: '水费(元)',
+                    prop: 'amount'
+                },
+                {
+                    label: '电费(元)',
+                    prop: 'remark'
+                },
+                   {
+                    label: '车位管理费(元)',
+                    prop: 'remark'
+                },
+                   {
+                    label: '卫生费(元)',
+                    prop: 'remark'
+                },
+                   {
+                    label: '电梯维修费(元)',
+                    prop: 'remark'
+                },
+                   {
+                    label: '外墙砖维修费(元)',
+                    prop: 'remark'
+                },
+                   {
+                    label: '摩托租赁费(元)',
+                    prop: 'remark'
+                },
+                   {
+                    label: '合计',
+                    prop: 'remark'
+                }
+            ],
+            mixins_post: 'post',
+            times: [],
+            communityArr: []
+        };
+    },
+    created() {
+        this.mixins_dataUrl = '/sc-charge/payment/record/page';
+        this.mixins_query = {
+            accountType: 2,
+            paymentType: 1
+        };
+        this.getSun(1);
+        this.getSun(2);
+        this.mixins_search();
+        this.getorgTree();
+    },
+    mounted() {},
+    methods: {
+        toggle(index) {
+            this.activeIndex = index;
+            this.mixins_query.paymentType = index;
+            this.mixins_search();
+        },
+        getSun(type) {
+            this.$http
+                .post('/sc-charge/payment/record/sum/amount', { accountType: 2, paymentType: type })
+                .then(({ data, status, msg }) => {
+                    if (status == 0) {
+                        if (type == 1) {
+                            this.tabs[0].value = data;
+                        } else if (type == 2) {
+                            this.tabs[1].value = data;
+                        }
+                    } else {
+                        this.$message.error(msg);
+                    }
+                })
+                .catch(() => {});
+        },
+        exportExcel() {
+            this.__exportExcel('/sc-charge/payment/record/export/excel', this.mixins_query);
+        },
+        effectiveDateToggle(va) {
+            let arr = va;
+            if (!arr) {
+                arr = ['', ''];
+            }
+            this.mixins_query.startTime = arr[0] + ' 00:00:00';
+            this.mixins_query.endTime = arr[1] + ' 23:59:59';
+        },
+        getorgTree() {
+            this.$http
+                .get('/sc-community/assets/community/list')
+                .then((data) => {
+                    this.communityArr = data.data;
+                    this.$store.commit('setAreaSelect', data.data);
+                })
+
+                .catch(function () {});
+        }
+    }
+};
+</script>
+<style scoped lang='scss'>
+@import '@assets/css/public-style.scss';
+.search_bottom_tab {
+    height: 60px;
+    line-height: 60px;
+    background: #ffffff;
+    border-radius: 4px;
+    margin-bottom: 20px;
+    padding: 0 20px;
+    box-sizing: border-box;
+    .tab_list {
+        display: inline-block;
+        border-bottom: 1px solid transparent;
+        cursor: pointer;
+        color: #424656;
+        &:not(:last-child) {
+            margin-right: 40px;
+        }
+        &.active {
+            color: $mainTextColor;
+            border-color: $mainTextColor;
+        }
+    }
+}
+</style>

operationSupport/src/views/payService/statisticalReport/electricityBillDetails.vue

@@ -0,0 +1,229 @@
+<template>
+    <div class="main">
+        <div class="search">
+            <el-select v-model="mixins_query.communityId" placeholder="选择社区" clearable>
+                <el-option v-for="(item, index) in communityArr" :key="index" :label="item.communityName" :value="item.id"></el-option>
+            </el-select>
+
+            <el-date-picker
+                v-model="times"
+                value-format="yyyy-MM-dd"
+                type="daterange"
+                range-separator="至"
+                start-placeholder="选择开始日期"
+                end-placeholder="选择结束日期"
+                @change="effectiveDateToggle"
+            ></el-date-picker>
+
+            <el-button type="primary" class="search-btn" @click="mixins_search" icon="el-icon-search">查询 </el-button>
+            <div class="search-icon">
+                <el-tooltip class="item" effect="light" placement="bottom" content="导出">
+                    <i class="zoniot_font zoniot-icon-daochu2" @click="exportExcel"></i>
+                </el-tooltip>
+            </div>
+        </div>
+        <div class="search_bottom_tab">
+            <div
+                class="tab_list"
+                v-for="(item, index) in tabs"
+                @click="toggle(index + 1)"
+                :class="activeIndex == index + 1 ? 'active' : ''"
+                :key="index"
+            >
+                {{ item.label }}{{ item.value }}元
+            </div>
+        </div>
+        <zz-table
+            :cols="activeIndex == 1 ? cols : statusCols"
+            :settings="{ showIndex: true, stripe: true }"
+            :loading="mixins_onQuery"
+            :data="mixins_list"
+            :pageset="mixins_pageset"
+            @page-change="pageChange"
+        >
+        </zz-table>
+    </div>
+</template>
+
+<script>
+import list from '@utils/list.js';
+export default {
+    mixins: [list],
+    data() {
+        return {
+            cols: [
+                {
+                    label: '社区名称',
+                    prop: 'communityName'
+                },
+                {
+                    label: '房间',
+                    prop: 'assets'
+                },
+                {
+                    label: '充值时间',
+                    prop: 'createDate'
+                },
+                {
+                    label: '充值方式',
+                    prop: 'paymentMethod',
+                    format(val) {
+                        if (val == '1') {
+                            return '微信';
+                        } else if (val == '2') {
+                            return '支付宝';
+                        } else if (val == '3') {
+                            return '现金';
+                        } else if (val == '4') {
+                            return '预存';
+                        } else if (val == '5') {
+                            return '其他';
+                        }
+                    }
+                },
+                {
+                    label: '充值人姓名',
+                    prop: 'userName'
+                },
+                {
+                    label: '手机号',
+                    prop: 'phone'
+                },
+                {
+                    label: '充值金额(元)',
+                    prop: 'amount'
+                },
+                {
+                    label: '备注',
+                    prop: 'remark'
+                }
+            ],
+            statusCols: [
+                {
+                    label: '社区名称',
+                    prop: 'communityName'
+                },
+                {
+                    label: '房间',
+                    prop: 'assets'
+                },
+                {
+                    label: '扣费时间',
+                    prop: 'createDate'
+                },
+                {
+                    label: '上期读数',
+                    prop: 'previousReading'
+                },
+                {
+                    label: '本期读数',
+                    prop: 'currentReading'
+                },
+                {
+                    label: '用电量(度)',
+                    prop: 'volume'
+                },
+                {
+                    label: '扣费金额(元)',
+                    prop: 'amount'
+                }
+            ],
+            tabs: [
+                {
+                    label: '充值金额：',
+                    value: '0'
+                },
+                {
+                    label: '扣费金额：',
+                    value: '0'
+                }
+            ],
+            activeIndex: 1,
+            mixins_post: 'post',
+            times: [],
+            communityArr:[]
+        };
+    },
+    created() {
+        this.mixins_dataUrl = '/sc-charge/payment/record/page';
+        this.mixins_query = {
+            accountType: 3,
+            paymentType: 1
+        };
+        this.getSun(1);
+        this.getSun(2);
+        this.mixins_search();
+        this.getorgTree();
+    },
+    mounted() {},
+    methods: {
+        toggle(index) {
+            this.activeIndex = index;
+            this.mixins_query.paymentType = index;
+            this.mixins_search();
+        },
+        getSun(type) {
+            this.$http
+                .post('/sc-charge/payment/record/sum/amount', { accountType: 3, paymentType: type })
+                .then(({ data, status, msg }) => {
+                    if (status == 0) {
+                        if (type == 1) {
+                            this.tabs[0].value = data;
+                        } else if (type == 2) {
+                            this.tabs[1].value = data;
+                        }
+                    } else {
+                        this.$message.error(msg);
+                    }
+                })
+                .catch(() => {});
+        },
+        exportExcel() {
+            this.__exportExcel('/sc-charge/payment/record/export/excel', this.mixins_query);
+        },
+        effectiveDateToggle(va) {
+            let arr = va;
+            if (!arr) {
+                arr = ['', ''];
+            }
+            this.mixins_query.startTime = arr[0] + ' 00:00:00';
+            this.mixins_query.endTime = arr[1] + ' 23:59:59';
+        },
+        getorgTree() {
+            this.$http
+                .get('/sc-community/assets/community/list')
+                .then((data) => {
+                    this.communityArr = data.data;
+                    this.$store.commit('setAreaSelect', data.data);
+                })
+
+                .catch(function () {});
+        }
+    }
+};
+</script>
+<style scoped lang='scss'>
+@import '@assets/css/public-style.scss';
+.search_bottom_tab {
+    height: 60px;
+    line-height: 60px;
+    background: #ffffff;
+    border-radius: 4px;
+    margin-bottom: 20px;
+    padding: 0 20px;
+    box-sizing: border-box;
+    .tab_list {
+        display: inline-block;
+        border-bottom: 1px solid transparent;
+        cursor: pointer;
+        color: #424656;
+        &:not(:last-child) {
+            margin-right: 40px;
+        }
+        &.active {
+            color: $mainTextColor;
+            border-color: $mainTextColor;
+        }
+    }
+}
+</style>

operationSupport/src/views/payService/statisticalReport/propertyFeeStatistics.vue

@@ -0,0 +1,176 @@
+<template>
+    <div class="main">
+        <div class="search">
+            <el-select v-model="mixins_query.communityId" placeholder="选择社区" clearable>
+                <el-option v-for="(item, index) in communityArr" :key="index" :label="item.communityName" :value="item.id"></el-option>
+            </el-select>
+            <el-button type="primary" class="search-btn" @click="mixins_search" icon="el-icon-search">查询 </el-button>
+            <div class="search-icon">
+                <el-tooltip class="item" effect="light" placement="bottom" content="导出">
+                    <i class="zoniot_font zoniot-icon-daochu2" @click="exportExcel"></i>
+                </el-tooltip>
+            </div>
+        </div>
+        <zz-table
+            :cols="cols"
+            :settings="{ showIndex: false, stripe: true }"
+            :loading="mixins_onQuery"
+            :data="mixins_list"
+            :pageset="mixins_pageset"
+            @page-change="pageChange"
+        >
+        </zz-table>
+    </div>
+</template>
+
+<script>
+import list from '@utils/list.js';
+export default {
+    mixins: [list],
+    data() {
+        return {
+            cols: [
+                {
+                    label: '缴费情况',
+                    prop: 'communityName'
+                },
+                {
+                    label: '01月',
+                    prop: 'assets'
+                },
+                {
+                    label: '02月',
+                    prop: 'createDate'
+                },
+                {
+                    label: '03月',
+                    prop: 'paymentMethod',
+                    format(val) {
+                        if (val == '1') {
+                            return '微信';
+                        } else if (val == '2') {
+                            return '支付宝';
+                        } else if (val == '3') {
+                            return '现金';
+                        } else if (val == '4') {
+                            return '预存';
+                        } else if (val == '5') {
+                            return '其他';
+                        }
+                    }
+                },
+                {
+                    label: '04月',
+                    prop: 'userName'
+                },
+                {
+                    label: '05月',
+                    prop: 'phone'
+                },
+                {
+                    label: '06月',
+                    prop: 'amount'
+                },
+                {
+                    label: '07月',
+                    prop: 'remark'
+                },
+                {
+                    label: '08月',
+                    prop: 'remark'
+                },
+                {
+                    label: '09月',
+                    prop: 'remark'
+                },
+                {
+                    label: '10月',
+                    prop: 'remark'
+                },
+                {
+                    label: '11月',
+                    prop: 'remark'
+                },
+                {
+                    label: '12月',
+                    prop: 'remark'
+                },
+                {
+                    label: '合计',
+                    prop: 'remark'
+                }
+            ],
+            mixins_post: 'post',
+            communityArr: []
+        };
+    },
+    created() {
+        this.mixins_dataUrl = '/sc-charge/payment/record/page';
+        this.mixins_query = {
+            accountType: 2,
+            paymentType: 1
+        };
+        this.getSun(1);
+        this.getSun(2);
+        this.mixins_search();
+        this.getorgTree();
+    },
+    mounted() {},
+    methods: {
+        getSun(type) {
+            this.$http
+                .post('/sc-charge/payment/record/sum/amount', { accountType: 2, paymentType: type })
+                .then(({ data, status, msg }) => {
+                    if (status == 0) {
+                        if (type == 1) {
+                            this.tabs[0].value = data;
+                        } else if (type == 2) {
+                            this.tabs[1].value = data;
+                        }
+                    } else {
+                        this.$message.error(msg);
+                    }
+                })
+                .catch(() => {});
+        },
+        exportExcel() {
+            this.__exportExcel('/sc-charge/payment/record/export/excel', this.mixins_query);
+        },
+        getorgTree() {
+            this.$http
+                .get('/sc-community/assets/community/list')
+                .then((data) => {
+                    this.communityArr = data.data;
+                    this.$store.commit('setAreaSelect', data.data);
+                })
+
+                .catch(function () {});
+        }
+    }
+};
+</script>
+<style scoped lang='scss'>
+@import '@assets/css/public-style.scss';
+.search_bottom_tab {
+    height: 60px;
+    line-height: 60px;
+    background: #ffffff;
+    border-radius: 4px;
+    margin-bottom: 20px;
+    padding: 0 20px;
+    box-sizing: border-box;
+    .tab_list {
+        display: inline-block;
+        border-bottom: 1px solid transparent;
+        cursor: pointer;
+        color: #424656;
+        &:not(:last-child) {
+            margin-right: 40px;
+        }
+        &.active {
+            color: $mainTextColor;
+            border-color: $mainTextColor;
+        }
+    }
+}
+</style>

operationSupport/src/views/payService/statisticalReport/waterChargeDetails.vue

@@ -0,0 +1,229 @@
+<template>
+    <div class="main">
+        <div class="search">
+            <el-select v-model="mixins_query.communityId" placeholder="选择社区" clearable>
+                <el-option v-for="(item, index) in communityArr" :key="index" :label="item.communityName" :value="item.id"></el-option>
+            </el-select>
+
+            <el-date-picker
+                v-model="times"
+                value-format="yyyy-MM-dd"
+                type="daterange"
+                range-separator="至"
+                start-placeholder="选择开始日期"
+                end-placeholder="选择结束日期"
+                @change="effectiveDateToggle"
+            ></el-date-picker>
+
+            <el-button type="primary" class="search-btn" @click="mixins_search" icon="el-icon-search">查询 </el-button>
+            <div class="search-icon">
+                <el-tooltip class="item" effect="light" placement="bottom" content="导出">
+                    <i class="zoniot_font zoniot-icon-daochu2" @click="exportExcel"></i>
+                </el-tooltip>
+            </div>
+        </div>
+        <div class="search_bottom_tab">
+            <div
+                class="tab_list"
+                v-for="(item, index) in tabs"
+                @click="toggle(index + 1)"
+                :class="activeIndex == index + 1 ? 'active' : ''"
+                :key="index"
+            >
+                {{ item.label }}{{ item.value }}元
+            </div>
+        </div>
+        <zz-table
+            :cols="activeIndex == 1 ? cols : statusCols"
+            :settings="{ showIndex: true, stripe: true }"
+            :loading="mixins_onQuery"
+            :data="mixins_list"
+            :pageset="mixins_pageset"
+            @page-change="pageChange"
+        >
+        </zz-table>
+    </div>
+</template>
+
+<script>
+import list from '@utils/list.js';
+export default {
+    mixins: [list],
+    data() {
+        return {
+            cols: [
+                {
+                    label: '社区名称',
+                    prop: 'communityName'
+                },
+                {
+                    label: '房间',
+                    prop: 'assets'
+                },
+                {
+                    label: '充值时间',
+                    prop: 'createDate'
+                },
+                {
+                    label: '充值方式',
+                    prop: 'paymentMethod',
+                    format(val) {
+                        if (val == '1') {
+                            return '微信';
+                        } else if (val == '2') {
+                            return '支付宝';
+                        } else if (val == '3') {
+                            return '现金';
+                        } else if (val == '4') {
+                            return '预存';
+                        } else if (val == '5') {
+                            return '其他';
+                        }
+                    }
+                },
+                {
+                    label: '充值人姓名',
+                    prop: 'userName'
+                },
+                {
+                    label: '手机号',
+                    prop: 'phone'
+                },
+                {
+                    label: '充值金额(元)',
+                    prop: 'amount'
+                },
+                {
+                    label: '备注',
+                    prop: 'remark'
+                }
+            ],
+            statusCols: [
+                {
+                    label: '社区名称',
+                    prop: 'communityName'
+                },
+                {
+                    label: '房间',
+                    prop: 'assets'
+                },
+                {
+                    label: '扣费时间',
+                    prop: 'createDate'
+                },
+                {
+                    label: '上期读数',
+                    prop: 'previousReading'
+                },
+                {
+                    label: '本期读数',
+                    prop: 'currentReading'
+                },
+                {
+                    label: '用水量(吨)',
+                    prop: 'volume'
+                },
+                {
+                    label: '扣费金额(元)',
+                    prop: 'amount'
+                }
+            ],
+            tabs: [
+                {
+                    label: '充值金额：',
+                    value: '0'
+                },
+                {
+                    label: '扣费金额：',
+                    value: '0'
+                }
+            ],
+            activeIndex: 1,
+            mixins_post: 'post',
+            times: [],
+            communityArr: []
+        };
+    },
+    created() {
+        this.mixins_dataUrl = '/sc-charge/payment/record/page';
+        this.mixins_query = {
+            accountType: 2,
+            paymentType: 1
+        };
+        this.getSun(1);
+        this.getSun(2);
+        this.mixins_search();
+        this.getorgTree();
+    },
+    mounted() {},
+    methods: {
+        toggle(index) {
+            this.activeIndex = index;
+            this.mixins_query.paymentType = index;
+            this.mixins_search();
+        },
+        getSun(type) {
+            this.$http
+                .post('/sc-charge/payment/record/sum/amount', { accountType: 2, paymentType: type })
+                .then(({ data, status, msg }) => {
+                    if (status == 0) {
+                        if (type == 1) {
+                            this.tabs[0].value = data;
+                        } else if (type == 2) {
+                            this.tabs[1].value = data;
+                        }
+                    } else {
+                        this.$message.error(msg);
+                    }
+                })
+                .catch(() => {});
+        },
+        exportExcel() {
+            this.__exportExcel('/sc-charge/payment/record/export/excel', this.mixins_query);
+        },
+        effectiveDateToggle(va) {
+            let arr = va;
+            if (!arr) {
+                arr = ['', ''];
+            }
+            this.mixins_query.startTime = arr[0] + ' 00:00:00';
+            this.mixins_query.endTime = arr[1] + ' 23:59:59';
+        },
+        getorgTree() {
+            this.$http
+                .get('/sc-community/assets/community/list')
+                .then((data) => {
+                    this.communityArr = data.data;
+                    this.$store.commit('setAreaSelect', data.data);
+                })
+
+                .catch(function () {});
+        }
+    }
+};
+</script>
+<style scoped lang='scss'>
+@import '@assets/css/public-style.scss';
+.search_bottom_tab {
+    height: 60px;
+    line-height: 60px;
+    background: #ffffff;
+    border-radius: 4px;
+    margin-bottom: 20px;
+    padding: 0 20px;
+    box-sizing: border-box;
+    .tab_list {
+        display: inline-block;
+        border-bottom: 1px solid transparent;
+        cursor: pointer;
+        color: #424656;
+        &:not(:last-child) {
+            margin-right: 40px;
+        }
+        &.active {
+            color: $mainTextColor;
+            border-color: $mainTextColor;
+        }
+    }
+}
+</style>