<!--
 * @Author: micky
 * @Date: 2024-08-16 17:32:49
 * @LastEditors: micky
 * @LastEditTime: 2024-10-27 20:47:30
 * @FilePath: \chargingpile-uniapp\src\bundle\pages\repair\order-detail.vue
-->
<template>
    <view class="order-detail-wrapper">
        <view class="header">
            <u-tabs
                :list="tabs"
                itemStyle="height:50px;flex:1;white-space:nowrap;"
                lineColor="#0E66FB"
                lineWidth="16"
                :activeStyle="{ color: '#0E66FB' }"
                keyName="label"
                :scrollable="false"
                :current="activeTab"
                @change="handleChangeTab"
            ></u-tabs>
        </view>
        <view class="content">
            <OrderSteps
                v-if="activeTab === 1"
                :formData="formData"
                @refresh="getDetail"
                :pageSource="pageSource"
            />
            <OrderInfo
                v-else-if="activeTab === 0"
                :formData="formData"
                @refresh="getDetail"
                :pageSource="pageSource"
            />
        </view>
        <view class="page-common-footer">
            <CardBtn
                :item="formData"
                :pageSource="pageSource"
                pageType="detail"
                @refresh="getDetail"
            />
        </view>
    </view>
</template>

<script setup lang="ts">
import { computed, ref, shallowRef, unref } from 'vue'
import { onShow, onLoad } from '@dcloudio/uni-app'
import OrderSteps from './order-steps.vue'
import OrderInfo from './order-info.vue'
import { apiRepairDetail } from '@/api/repair'
import CardBtn from '@/components/order-button/repair-btn.vue'
import { DCPFC } from '@/enums/cacheEnums'
import cache from '@/utils/cache'
// import { useAppStore } from '@/stores/app'
// import { storeToRefs } from 'pinia'

const tabs = shallowRef([
    { label: '工单详情', value: 0 },
    { label: '工单步骤', value: 1 }
])
const activeTab = ref(0)
const orderId = ref('')
let moduleCode: any = ''
// 2:维修主管 1:检修员 0：客户
const pageSource = ref('0')
const formData = ref<Partial<RepairItem>>({})
const loading = ref(false)
// const isError = computed(() => Object.keys(formData.value).length === 0)
const handleChangeTab = (item: any) => {
    activeTab.value = item.value
}

const getDetail = async () => {
    try {
        uni.showLoading({
            title: '加载中...'
        })
        loading.value = true
        const params: any = moduleCode
            ? {
                  moduleCode: moduleCode
              }
            : {
                  id: unref(orderId)
              }
        params.isClient = unref(pageSource)
        const res: RepairItem = await apiRepairDetail(params)
        formData.value = res
        uni.hideLoading()
        loading.value = false
    } catch (error) {}
}
onLoad(options => {
    orderId.value = options.id as string
    moduleCode = options.code
    pageSource.value = options.pageSource as string
})

onShow(() => {
    getDetail()
    cache.set(DCPFC, {
        list: [],
        moduleCode: ''
    })
})
// const appStore = useAppStore()
// const { sysInfo } = storeToRefs(appStore)

// const zPagingHeight = computed(() => sysInfo.value.windowHeight - 50 + 'px')

// const paging = ref()
// const onRefresh = () => {
//     getDetail()
//     paging.value.complete()
// }
</script>
<style scoped lang="scss">
.order-detail-wrapper {
    display: flex;
    flex-direction: column;
    height: 100vh;
    .content {
        flex: 1;
        overflow: auto;
    }
}
.desc {
    font-size: 28rpx;
    color: $gray-2;
    .strong {
        color: $blue-1;
    }
}
</style>
