<template>
    <view :class="pageType == 'card' ? 'order-btns-wrapper' : 'page-common-footer'">
        <template v-if="pageSource == '1'">
            <u-button
                shape="circle"
                type="primary"
                :plain="true"
                @click="closeOrder"
                v-if="ifShow([WorkOrderStatusEnum.WAITING, WorkOrderStatusEnum.DETECTING])"
            >
                退单
            </u-button>
            <u-button
                shape="circle"
                type="primary"
                @click="popupShow = true"
                v-if="item?.orderStatus == WorkOrderStatusEnum.WAITING"
            >
                接单
            </u-button>
            <template v-if="ifShow([WorkOrderStatusEnum.DETECTING])">
                <u-button shape="circle" type="primary" @click="servicePrice">服务报价</u-button>
                <u-button shape="circle" plain @click="fillIn" class="fill-btn">填写回单</u-button>
            </template>
            <u-button
                shape="circle"
                type="primary"
                @click="servicePrice"
                v-if="ifShow([WorkOrderStatusEnum.SENDBACK])"
            >
                重新报价
            </u-button>
            <template v-if="ifShow([WorkOrderStatusEnum.INMAINTENANCE])">
                <view class="btns">
                    <u-button
                        type="primary"
                        plain
                        shape="circle"
                        @click="applySpareParts"
                        v-if="showApply"
                    >
                        配件领用
                    </u-button>
                    <u-button
                        type="primary"
                        shape="circle"
                        @click="fillIn"
                        v-if="item?.isConfirmReceipt"
                    >
                        填写回单
                    </u-button>
                    <!-- <view class="_border" @click="applySpareParts" v-if="showApply">配件领用</view> -->
                    <!-- <view class="_border" @click="moduleReturn" v-if="!item?.maintenanceRepair">
                        模块返修
                    </view>
                    <view class="_border" @click="moduldReplace">模块替换</view> -->
                    <!-- <view @click="fillIn" v-if="item?.isConfirmReceipt">填写回单</view> -->
                </view>
            </template>
        </template>
        <template v-else>
            <u-button
                type="primary"
                shape="circle"
                @click="closeOrder"
                v-if="
                    ifShow([
                        WorkOrderStatusEnum.WAITING,
                        WorkOrderStatusEnum.CREATED,
                        WorkOrderStatusEnum.OVERTIME
                    ])
                "
            >
                关闭工单
            </u-button>
            <u-button
                type="primary"
                shape="circle"
                @click="confirmPrice"
                v-if="ifShow([WorkOrderStatusEnum.TOBECOMFIRMED])"
            >
                确认报价
            </u-button>
        </template>

        <w-confirm-popup
            contentText="确认接单吗？"
            v-model="popupShow"
            @confirm="confirmTakeOrder"
        />
    </view>
    <w-cancel-order
        ref="cancelPopup"
        :id="props?.item?.id"
        :type="1"
        :pageSource="pageSource"
        @refresh="emits('refresh')"
    />
</template>

<script setup lang="ts">
import { ref, computed } from 'vue'
import { apiOverhaulOrderReceive } from '@/api/overhaul'
import { WorkOrderTypeEnum, WorkOrderStatusEnum, StashTypeEnum } from '@/enums/businessEnums'
import { toast } from '@/utils/util'

const props = defineProps({
    item: Object,
    pageType: String,
    pageSource: String
})
const emits = defineEmits(['refresh'])
const popupShow = ref(false)
const cancelPopup = ref()

const ifShow = (arr: any[]) => {
    return arr.find(i => i == props.item?.orderStatus) != null ? true : false
}
const showApply = computed(() => {
    return !props.item?.isConfirmReceipt || props.item?.warehouseType == StashTypeEnum.COMMON
})
// 退单
const closeOrder = () => {
    cancelPopup.value.showPopup()
}
// 确认接单
const confirmTakeOrder = async () => {
    await apiOverhaulOrderReceive({
        id: props.item?.id
    })
    toast('接单成功')
    emits('refresh')
}

// 模块返修
// const moduleReturn = () => {
//     uni.navigateTo({
//         url: `/bundle/pages/overhaul/module-return?id=${props.item?.id}`
//     })
// }

// // 模块替换
// const moduldReplace = () => {
//     uni.navigateTo({
//         url: `/bundle/pages/scan/scan?type=1&id=${props.item?.id}`
//     })
// }

// 服务报价
const servicePrice = () => {
    uni.navigateTo({
        url: `/bundle/pages/overhaul/offer-price?id=${props.item?.id}`
    })
}

// 配件领用申请
const applySpareParts = () => {
    const { sparePartStockAudit, isConfirmReceipt } = props.item as OverhaulItem
    if ((sparePartStockAudit && sparePartStockAudit?.receiveStatus != 1) || isConfirmReceipt == 1) {
        uni.navigateTo({
            url: `/bundle/pages/spareParts/detail?id=${props.item?.id}&type=${WorkOrderTypeEnum.OVERHAUL}`
        })
    } else {
        uni.navigateTo({
            url: `/bundle/pages/spareParts/apply?id=${props.item?.id}&type=${WorkOrderTypeEnum.OVERHAUL}`
        })
    }
}

// 填写回单
const fillIn = () => {
    uni.navigateTo({
        url: `/bundle/pages/overhaul/fill-receipt?id=${props.item?.id}`
    })
}

// 检修单确认报价
const confirmPrice = () => {
    uni.navigateTo({
        url: `/bundle/pages/client/confirm-price?id=${props.item?.id}`
    })
}
</script>
<style scoped lang="scss">
.fill-btn {
    :deep(button) {
        color: #3d3d3d !important;
        border: 1px solid #d5d5d5 !important;
    }
}
.btns {
    // @apply flex justify-center items-center w-full my-2;
    @apply flex justify-end items-center w-full my-2;
    height: 64rpx;
    view {
        // @apply text-primary text-center leading-[30px];
        background: $blue-1;
        color: $white-1;

        &:last-child {
            @apply border-none;
        }
        &._border {
            @apply border-r border-border;
        }
    }
}
</style>
