<template>
    <app-view class="order-detail g-form">
        <template #header>
            <app-navbar title="采购详情" />
        </template>
        <div v-if="detail" class="order-detail__container g-form__container">
            <CellGroup title="采购信息">
                <Cell title="商品" :value="detail.wrstandardname" />
                <Cell title="仓库" :value="detail.warehousename" />
                <Cell title="预售价" :value="detail.tradeprice" />
                <Cell title="数量" :value="detail.tradeqty" />
                <Cell title="定金" :value="detail.payeddeposit" />
                <Cell title="实际价" :value="detail.lastprice" />
                <Cell title="尾款" :value="detail.remainamount" />
                <Cell title="状态" :value="detail.orderstatus" />
                <Cell title="总货款" :value="detail.tradeamount" />
                <Cell title="摘牌时间：" :value="formatDate(detail.tradetime, 'YYYY/MM/DD HH:mm:ss')" />
            </CellGroup>
            <CellGroup title="提货信息">
                <Cell title="提货方式" :value="detail.thjdeliverymodedisplay" />
                <Cell title="联系人" :value="detail.contactname" v-if="detail.contactname" />
                <Cell title="联系方式" :value="detail.contactinfo" v-if="detail.contactinfo" />
                <Cell title="目的地地址" :value="detail.desaddress" v-if="detail.desaddress" />
                <Cell title="发票信息" :value="detail.receiptinfo" v-if="detail.receiptinfo" />
                <Cell title="合同单号" :value="detail.wrtradedetailid" :is-link="!!detail.contractaddrbuy"
                    @click="openPDF(detail?.contractaddrbuy)" />
            </CellGroup>
        </div>
        <div v-else>
            <Empty />
        </div>
        <template #footer>
            <div class="g-form__footer" v-if="detail">
                <!-- <Button block round type="primary" v-if="detail.orderstatus === 1">合同转让</Button>
                <Button block round type="primary" v-if="detail.orderstatus === 8">转让撤销</Button> -->
                <Button block round type="primary" v-if="detail.orderstatus === 5"
                    @click="spotConfirmSubmit">确认交收</Button>
                <Button block round type="primary" v-if="detail.orderstatus === 3" @click="spotApplySubmit">违约</Button>
                <Button block round type="primary" v-if="detail.orderstatus === 3"
                    @click="spotPlaymentSubmit">支付</Button>
            </div>
        </template>
    </app-view>
</template>

<script lang="ts" setup>
import { shallowRef } from 'vue'
import { useNavigation } from '@/hooks/navigation'
import { fullloading, dialog } from '@/utils/vant'
import { CellGroup, Cell, Empty, Button, Toast } from 'vant'
import { formatDate, getUrl } from '@/filters'
import { useSpotPresaleDeliveryConfirm, useSpotPresaleBreachOfContractApply, useSpotPresalePlayment } from "@/business/trade";

const { route, router } = useNavigation()
const item = route.params.item
const detail = shallowRef<Model.THJPurchaseTradeDetailRsp>()

const { confirmSubmit } = useSpotPresaleDeliveryConfirm()
const { applySubmit } = useSpotPresaleBreachOfContractApply()
const { playmentSubmit } = useSpotPresalePlayment()

if (item) {
    detail.value = JSON.parse(item.toString())
}

// 打开pdf文件
const openPDF = (file?: string) => {
    if (file) {
        window.open(getUrl(file).href)
    }
}

/// 确认交收
const spotConfirmSubmit = () => {
    dialog('确认要交收吗？', {
        showCancelButton: true
    }).then(() => {
        fullloading((hideLoading) => {
            confirmSubmit(detail.value?.wrtradedetailid ?? 0).then(() => {
                hideLoading()
                dialog('确认交收提交成功，请耐心等待审核。').then(() => {
                    router.back()
                })
            }).catch((err) => {
                Toast.fail(err)
            })
        })
    })
}

const spotApplySubmit = () => {
    dialog('确认要违约吗？', {
        showCancelButton: true
    }).then(() => {
        fullloading((hideLoading) => {
            applySubmit(detail.value?.wrtradedetailid ?? 0).then(() => {
                hideLoading()
                dialog('违约提交成功，请耐心等待审核。').then(() => {
                    router.back()
                })
            }).catch((err) => {
                Toast.fail(err)
            })
        })
    })
}

const spotPlaymentSubmit = () => {
    dialog('确认要付款吗？', {
        showCancelButton: true
    }).then(() => {
        fullloading((hideLoading) => {
            playmentSubmit(detail.value?.wrtradedetailid ?? 0).then(() => {
                hideLoading()
                dialog('付款提交成功，请耐心等待审核。').then(() => {
                    router.back()
                })
            }).catch((err) => {
                Toast.fail(err)
            })
        })
    })
}
</script>

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