<!--
 * @Author: micky
 * @Date: 2024-09-05 16:15:45
 * @LastEditors: micky
 * @LastEditTime: 2024-10-14 12:24:12
 * @FilePath: \chargingpile-uniapp\src\pages\client\workOrder\overhaul-card.vue
-->
<template>
    <w-order-card>
        <template #title>
            <view class="flex justify-between items-center">
                <view>工单编号：{{ item.orderNo }}</view>
                <view v-if="!activeStatus" :style="{ color: workOrderColor[item.orderStatus] }">
                    {{ workOrderStatusMap[item.orderStatus] }}
                </view>
                <view
                    v-else-if="item.orderStatus == WorkOrderStatusEnum.SENDBACK"
                    class="text-error"
                >
                    已退回
                </view>
            </view>
        </template>
        <template #content>
            <view class="order-content-wrapper relative" @click="toDetail(item)">
                <view>
                    <text>报修人</text>
                    <text>{{ item.creatorName }}</text>
                </view>
                <view>
                    <text>报修时间</text>
                    <text>{{ item.createTime }}</text>
                </view>
                <view>
                    <text>设备编号</text>
                    <text>{{ item.equipmentNo }}</text>
                </view>
                <view>
                    <text>设备名称</text>
                    <text>{{ item.equipmentName }}</text>
                </view>
                <view>
                    <text>设备地址</text>
                    <text>{{ item.detailedAddress }}</text>
                </view>
                <view v-if="item.receiverName">
                    <text>接单人</text>
                    <text>{{ item.receiverName }}</text>
                </view>
                <view v-if="item.receiverTime">
                    <text>接单时间</text>
                    <text>{{ item.receiverTime }}</text>
                </view>
                <view v-if="item.isMaintain != null">
                    <text>是否维修</text>
                    <text :style="{ color: yesOrNoColor[item.isMaintain] }">
                        {{ yesOrNoMap[item.isMaintain] }}
                    </text>
                </view>
                <view v-if="item.orderAccomplishTime">
                    <text>完成时间</text>
                    <text>{{ item.orderAccomplishTime }}</text>
                </view>
            </view>
        </template>
        <template #btns>
            <view class="order-btns-wrapper">
                <u-button
                    shape="circle"
                    type="primary"
                    :plain="true"
                    v-if="
                        ifShow([
                            WorkOrderStatusEnum.CREATED,
                            WorkOrderStatusEnum.WAITING,
                            WorkOrderStatusEnum.OVERTIME
                        ])
                    "
                    @click="closeOrder"
                >
                    关闭工单
                </u-button>
                <u-button
                    shape="circle"
                    type="primary"
                    v-if="item?.orderStatus == WorkOrderStatusEnum.TOBECOMFIRMED"
                    @click="confirmPrice"
                >
                    确认报价
                </u-button>
            </view>
        </template>
    </w-order-card>
    <w-cancel-order ref="cancelPopup" :id="props?.item?.id" :type="1" :pageSource="0" />
</template>

<script setup lang="ts">
import { ref } from 'vue'
import {
    workOrderColor,
    workOrderStatusMap,
    WorkOrderStatusEnum,
    yesOrNoMap,
    yesOrNoColor
} from '@/enums/businessEnums'

const props = defineProps<{
    item: OverhaulItem
    activeStatus: number | string
}>()

const ifShow = (arr: any[]) => {
    return arr.find(i => i == props?.item?.orderStatus) != null ? true : false
}

const cancelPopup = ref()
const closeOrder = () => {
    cancelPopup.value.showPopup()
}

// 检修单确认报价
const confirmPrice = () => {
    uni.navigateTo({
        url: `/bundle/pages/client/confirm-price?id=${props.item?.id}`
    })
}

// 检修单确认返还
// const confirmReturn = () => {
//     uni.navigateTo({
//         url: `/bundle/pages/client/confirm-return?id=${props.item?.id}`
//     })
// }

const toDetail = (row: any) => {
    uni.navigateTo({
        url: `/bundle/pages/overhaul/order-detail?id=${row.id}&pageSource=0`
    })
}
</script>
<style scoped lang="scss"></style>
