<template>
  <view class="steps_content">
    <cc-scroll-loading :meta="useModel?.metaData?.value" @load="method?.loadMore">
      <up-steps direction="column" :dot="true" :current="useModel?.listData?.value?.length - 1">
        <up-steps-item v-for="(i, index) in useModel?.listData?.value" :key="`pay_item_${index}`">
          <template #desc>
            <view class="desc_title">
              {{ i?.created_at }} <text>操作人：{{ i?.company_employee?.name }}</text>
            </view>
            <view class="desc_content">
              <view class="desc_cell"> 催缴金额：{{ i?.total_unpaid_amount }}元 </view>
              <view class="desc_cell" v-if="i?.collection_result">
                催缴结果：<view :class="`tag_${i?.collection_result}`">
                  <hs-enum-tag
                    :value="i?.collection_result"
                    :Enums="HouseCollectionRecordsCollectionResultEnum"
                  />
                </view>
              </view>
              <view class="desc_cell">
                催缴方式：<hs-enum-tag
                  :value="i?.channel"
                  :Enums="HouseCollectionTasksChannelEnum"
                />
              </view>
              <view class="desc_cell" v-if="i?.collection_content">
                催缴结果：{{ i?.collection_content }}
              </view>
            </view>
          </template>
        </up-steps-item>
      </up-steps>
    </cc-scroll-loading>
    <hs-footer btnParimaryName="新增催缴记录" @handleParmaryClick="toAdd" />
  </view>
</template>
<script setup lang="ts">
import {
  HouseCollectionTasksChannelEnum,
  HouseCollectionRecordsCollectionResultEnum
} from '@/gen/Enums'
import method from './method'
import useModel from './model'
import { onLoad, onShow, onUnload } from '@dcloudio/uni-app'
const toAdd = () => {
  uni.navigateTo({
    url: `/BILL/outstanding_fee/add/index?amount=${useModel?.formData?.value?.total_pending_amount}&id=${useModel?.formData?.value?.asset_houses_id}`
  })
}

onShow(() => {
  if (useModel?.listData?.value?.length) {
    useModel.listData.value = []
    method?.loadMore(1)
  }
})

onLoad(e => {
  console.log(e, 'e')
  useModel.formData.value = {
    asset_houses_id: e?.asset_houses_id,
    total_pending_amount: e?.total_pending_amount,
    page: 1
  }
  method?.getHouseCollectionRecords()
})

onUnload(() => {
  useModel.listData.value = []
})
</script>

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