Project-Annex/operationSupport/src/views/payService/call/index.vue

<template>
    <div class="main">
        <template v-if="isShowStatus === 'list'">
            <div class="search">
                <el-input placeholder="订单编号/业主/房间号" class="search-input" clearable v-model="mixins_query.name"></el-input>
                <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-input placeholder="欠费天数（大于）" class="search-input" clearable v-model="mixins_query.arrearageDays"></el-input>
                <el-button type="primary" class="search-btn" @click="mixins_search" icon="el-icon-search">查询 </el-button>
                <div class="search-icon">
                    <el-tooltip effect="light" placement="bottom" content="催缴设置">
                        <i class="zoniot_font zoniot-icon-cuijiaoshezhi" @click="toPageSet"></i>
                    </el-tooltip>
                    <el-tooltip effect="light" placement="bottom" content="全部通知">
                        <i class="zoniot_font zoniot-icon-quanbucuijiao" @click="allNotice"></i>
                    </el-tooltip>
                    <el-tooltip effect="light" placement="bottom" content="批量通知">
                        <i class="zoniot_font zoniot-icon-piliangcuijiao" @click="batchNotice"></i>
                    </el-tooltip>
                    <el-tooltip effect="light" placement="bottom" content="催缴记录">
                        <i class="zoniot_font zoniot-icon-cuijiaojilu" @click="toPageRecord"></i>
                    </el-tooltip>
                </div>
            </div>
            <div class="roles-wrap">
                <zz-table
                    :cols="cols"
                    :settings="{ showCheckbox: true, stripe: true }"
                    :loading="mixins_onQuery"
                    :data="mixins_list"
                    :pageset="mixins_pageset"
                    @page-change="pageChange"
                    @selection-change="selectionChange"
                >
                </zz-table>
            </div>
        </template>
        <call-record v-if="isShowStatus === 'record'"></call-record>
        <call-set v-if="isShowStatus === 'set'"></call-set>
    </div>
</template>

<script>
import list from '@utils/list.js';
import callRecord from './callRecord.vue';
import callSet from './callSet.vue';
export default {
    mixins: [list],
    components: { callRecord, callSet },
    data() {
        return {
            isShowStatus: 'list',
            selectRow: [],
            cols: [
                {
                    label: '订单号',
                    prop: 'billNumber'
                },
                {
                    label: '社区',
                    prop: 'communityName'
                },
                {
                    label: '房间',
                    prop: 'assets'
                },
                {
                    label: '业主',
                    prop: 'residentName'
                },
                {
                    label: '业主手机',
                    prop: 'phone'
                },
                {
                    label: '费用名称',
                    prop: 'chargeName'
                },
                {
                    label: '账期',
                    prop: 'paymentDays'
                },
                {
                    label: '费用金额(元)',
                    prop: 'amount'
                },
                {
                    label: '滞纳金(元)',
                    prop: 'lateFee'
                },
                {
                    label: '应收金额(元)',
                    prop: 'receivableAmount'
                },
                {
                    label: '应收时间',
                    prop: 'receivableTime'
                },
                {
                    label: '欠费天数',
                    prop: 'arrearageDays'
                },
                {
                    label: '最新下发通知时间',
                    prop: 'lastCallPaymeetTime'
                }
            ],
            mixins_post: 'post',
            communityArr: []
        };
    },
    created() {
        this.getorgTree();
        this.mixins_dataUrl = '/sc-charge/charge/bill/page';
        this.mixins_query = {};
        this.mixins_search();
    },
    mounted() {},
    methods: {
        getorgTree() {
            this.$http
                .get('/sc-community/assets/community/list')
                .then((data) => {
                    this.communityArr = data.data;
                    this.$store.commit('setAreaSelect', data.data);
                })

                .catch(function () {});
        },
        toPageSet() {
            this.isShowStatus = 'set';
        },
        toPageRecord() {
            this.isShowStatus = 'record';
        },
        batchNotice() {
            if (!this.selectRow.length) {
                this.$message.error('您尚未选择要操作项，请选择后再操作');
                return;
            }
            let ids = [];
            this.selectRow.forEach((v) => {
                ids.push(v.id);
            });
            this.$http.post('/sc-charge/scChargeCallPaymentRecord/batchNotice', ids).then(({ status, data, msg }) => {
                if (0 === status) {
                    this.$message({
                        type: 'success',
                        message: '催缴成功!'
                    });
                    this.mixins_search();
                }
            });
        },
        selectionChange(val) {
            this.selectRow = val;
        },
        allNotice() {
            if (!this.mixins_list.length) {
                this.$message.error('暂无数据无法催缴');
                return;
            }
            this.$http.post('/sc-charge/scChargeCallPaymentRecord/allNotice', this.mixins_query).then(({ status, data, msg }) => {
                if (0 === status) {
                    this.$message({
                        type: 'success',
                        message: '催缴成功!'
                    });
                    this.mixins_search();
                }
            });
        }
    }
};
</script>