<!--
 * @Author: micky
 * @Date: 2024-08-15 20:04:50
 * @LastEditors: micky
 * @LastEditTime: 2024-08-31 00:36:05
 * @FilePath: \chargingpile-uniapp\src\bundle\pages\overhaul\pool-detail.vue
-->
<template>
    <w-page-common btnText="抢单" @submit="popupShow = true">
        <view class="icon-field">
            <TIcon name="icon-solid-time" :size="40" color="#0E66FB"></TIcon>
            <view class="mt-2">
                {{ workOrderTypeMap[orderType as number] }}
            </view>
        </view>
        <view class="c-form-item-wrapper" style="padding: 8rpx">
            <view class="item">
                <view>工单编号</view>
                <view>
                    {{ formData.orderNo }}
                </view>
            </view>
            <template v-if="orderType == WorkOrderTypeEnum.OVERHAUL">
                <view class="item">
                    <view>客户名称</view>
                    <view>
                        {{ formData.clientName }}
                    </view>
                </view>
                <view class="item">
                    <view>报修人</view>
                    <view>
                        {{ formData.creatorName }}
                    </view>
                </view>
                <view class="item">
                    <view>报修时间</view>
                    <view>
                        {{ formData.createTime }}
                    </view>
                </view>
            </template>
            <w-client-device-info :formData="formData" :needClient="false" />
            <template v-if="orderType == WorkOrderTypeEnum.INSPECTION">
                <view class="item">
                    <view>创建时间</view>
                    <view>
                        {{ formData.createTime }}
                    </view>
                </view>
            </template>
            <template v-if="orderType == WorkOrderTypeEnum.OVERHAUL">
                <view class="item">
                    <view>故障类型</view>
                    <view>
                        {{ formData.faultName }}
                    </view>
                </view>
                <view class="item">
                    <view>故障描述</view>
                    <view>
                        {{ formData.faultDescription }}
                    </view>
                </view>
            </template>
            <view class="item" v-if="formData.remark">
                <view>备注</view>
                <view>
                    {{ formData.remark }}
                </view>
            </view>
        </view>
        <w-confirm-popup
            contentText="确认抢单吗？"
            v-model="popupShow"
            @confirm="confirmTakeOrder"
        />
    </w-page-common>
</template>

<script setup lang="ts">
import { ref, unref } from 'vue'
import { workOrderTypeMap, WorkOrderTypeEnum } from '@/enums/businessEnums'
import { apiOverhaulDetail, apiInspectionDetail } from '@/api/overhaul'
import { apiInspectGrabOrder, apiOverhaulGrabOrder } from '@/api/overhaul'
import { onLoad } from '@dcloudio/uni-app'
import { toast } from '@/utils/util'

const orderId = ref()
const orderType = ref<number>()
const popupShow = ref(false)
const formData = ref<any>({})
const confirmTakeOrder = async () => {
    const api =
        unref(orderType) == WorkOrderTypeEnum.OVERHAUL ? apiOverhaulGrabOrder : apiInspectGrabOrder
    await api({
        id: unref(orderId)
    })
    toast('抢单成功')
    setTimeout(() => {
        uni.navigateBack({ delta: 1 })
    }, 300)
}

const getDetail = async () => {
    const api =
        unref(orderType) == WorkOrderTypeEnum.OVERHAUL ? apiOverhaulDetail : apiInspectionDetail
    const res = await api({
        id: unref(orderId)
    })
    formData.value = res
}

onLoad(options => {
    orderId.value = options.id as string
    orderType.value = Number(options.type as string)
    getDetail()
})
</script>
<style scoped lang="scss">
.icon-field {
    @apply pt-[48px] pb-[15px] flex flex-col justify-center items-center;
}
</style>
