<template>
  <view>
    <cc-scroll-loading :meta="useModel?.metaData?.value" @load="method?.loadMore">
      <view
        v-for="(i, index) in useModel?.listData?.value"
        :key="`items_${index}`"
        class="payment_records_item"
      >
        <view class="payment_records_item_cell">
          {{ i?.display_text || '-' }}
          <view class="header_right_content" @click="billsShow = !billsShow">
            <text> ¥{{ i?.total_paid_amount_monthly }} </text>
            <uni-icons type="down" size="15" color="#666"></uni-icons>
          </view>
        </view>
        <view class="items_body" v-if="billsShow">
          <template v-for="(k, idx) in i?.bills" :key="`bills_${index}_${idx}`">
            <view class="bills_cell">
              <hs-enum-tag :value="k?.type" :Enums="HouseBillsTypeEnum" />
              <view> ¥{{ k?.total_payable_amount }} </view>
            </view>
          </template>
        </view>
      </view>
    </cc-scroll-loading>
  </view>
</template>
<script setup lang="ts">
const billsShow = ref(false)
import { HouseBillsTypeEnum } from '@/gen/Enums'
import { ref } from 'vue'
import method from './method'
import useModel from './model'
import { onLoad } from '@dcloudio/uni-app'
onLoad(e => {
  console.log(e, 'e')
  useModel.formData.value.asset_houses_id = e?.asset_houses_id
  method?.getHouseBills()
})
</script>

<style lang="scss">
@import './style.scss';
</style>
