<template>
  <div class="main">
    <zz-table
      :cols="cols"
      :settings="{ showIndex: true, stripe: true }"
      :loading="mixins_onQuery"
      :data="mixins_list"
      :updateFlag="true"
      :pageset="mixins_pageset"
      @page-change="pageChange"
    >
      <template
        slot-scope="scope"
        slot="payBeginTime"
      >
        {{ typeTimeTransition(scope.row.payBeginTime, scope.row.payEndTime) }}
      </template>
    </zz-table>
  </div>
</template>

<script>
import list from '@utils/list.js';
export default {
  mixins: [list],
  props: ['params'],
  data () {
    return {
      cols: [
        {
          label: '订单号',
          prop: 'billNumber'
        },
        {
          label: '房间',
          prop: 'assets'
        },
        {
          label: '业主',
          prop: 'residentName'
        },
        {
          label: '费用名称',
          prop: 'chargeName'
        },

        {
          label: '计费周期',
          prop: 'payBeginTime',
          slot: 'payBeginTime',
          width: '150'
        },

        // {
        //     label: '费用金额(元)',
        //     prop: 'amount'
        // },
        // {
        //     label: '滞纳金',
        //     prop: 'lateFee'
        // },
        {
          label: '应收金额(元)',
          prop: 'receivableAmount'
        },
        {
          label: '实收金额(元)',
          prop: 'receivedAmount'
        },
        {
          label: '缴费状态',
          prop: 'chargeStatus',
          format (val) {
            if (val == 1) {
              return '未缴费';
            } else if (val == 2) {
              return '已缴费';
            }
          }
        },
        {
          label: '缴费时间',
          prop: 'chargeDate'
        },
        {
          label: '收款方式',
          prop: 'payTypeDict'
        },
        {
          label: '收款人',
          prop: 'payee'
        }
      ],
      mixins_post: 'post'
    };
  },
  created () {
    this.mixins_query = Object.assign({ houseId: this.params.row.houseId, residentName: this.params.row.residentName, paymentMethod: -1 }, this.params.mixins_query);
    this.mixins_dataUrl = '/czc-charge/charge/bill/page';
    this.mixins_search();
  },
  mounted () { },
  methods: {
    typeTimeTransition (start, end) {
      let text = '';
      if (!!end) {
        let f = new Date(start).getMonth(),
          l = new Date(end).getMonth();
        if (f == l) {
          text = `${this.$moment(new Date(start)).format('YYYY年M月')}`;
        } else {
          text = `${this.$moment(new Date(start)).format('YYYY年M月')}-${this.$moment(new Date(end)).format('YYYY年M月')}`;
        }
      }

      return text;
    }
  }
};
</script>
<style scoped lang='scss'>
@import '@assets/css/public-style.scss';
</style>