<template>
    <uni-drawer ref="drawerContainerRef" :width="width" mode="right">

        <uni-nav-bar
            :border="false"
            :fixed="true"
            left-icon="left"
            status-bar
            title="账期终审"
            @clickLeft="hideDrawer"
        />

        <uni-collapse ref="collapse">
            <uni-collapse-item
                v-for="row in tableData"
                :key="row.creditHistId"
                :title="row.shortName"
                open
            >
                <view class="padding">
                    <view class="context">
                        <view class="label">
                            <text>货主:</text>
                            <text>{{ row.companyName }}</text>
                        </view>
                        <view class="label">
                            <text>状态:</text>
                            <text>{{ row.state }}</text>
                        </view>
                        <view class="label">
                            <text>老账期:</text>
                            <text>{{ row.oldCreditPeriod }}</text>
                        </view>
                        <view class="label">
                            <text>新账期:</text>
                            <text>{{ row.creditPeriod }}</text>
                        </view>
                        <view class="label">
                            <text>申请日期:</text>
                            <text>{{ row.addDate }}</text>
                        </view>
                        <view class="label">
                            <text></text>
                            <button class="mini-btn" size="mini" type="primary" @click="handleFinalReview(row)">查看</button>
                        </view>
                    </view>
                </view>
            </uni-collapse-item>
        </uni-collapse>
    </uni-drawer>
    <AccountPeriodFinalReview ref="AccountPeriodFinalReviewRef" @refresh="handleQuery"/>
</template>

<script setup>
import {defineExpose, defineOptions, ref} from 'vue'
import {getLastPaymentAndQuotaList} from "../../../../api/AccountPriceFinallReview";
import AccountPeriodFinalReview from "./components/AccountPeriodReview.vue";

defineOptions({
    name: "AccountPeriodFinal"
})

const width = ref(document.documentElement.clientWidth || document.body.clientWidth)
const drawerContainerRef = ref()
const queryParams = ref()
const tableData = ref([])
const total = ref(0)
const paging = ref({
    pageNum: 1,
    pageSize: 100,
})
const AccountPeriodFinalReviewRef = ref()

const handleQuery = async () => {
    uni.showLoading({
        title: '加载中'
    });
    const {rows, total: count} = await getLastPaymentAndQuotaList(queryParams.value, paging.value)
    tableData.value = rows
    total.value = count
    uni.hideLoading()
}
const openDrawer = async (item) => {
    drawerContainerRef.value.open()
    queryParams.value = {
        userId: item.userId,
        type: 0
    }
    await handleQuery()
}

defineExpose({openDrawer})

const hideDrawer = () => {
    drawerContainerRef.value.close()
}

const handleFinalReview = (item) => {
    AccountPeriodFinalReviewRef.value.openDrawer(item)
}
</script>