shuhi-app/pages/order/mall/detail.vue

<template>
    <view class="common-page" style="padding: 0;padding-bottom: 130rpx;">
        <InfoCard :detail="detail" type="mall" />

        <TrackRecord :records="records" class="mt-20" />

        <view class="fixed-bottom">
            <u-button type="warning" size="large" @click="onEdit">编辑</u-button>
            <u-button type="danger" size="large" @click="onVoid">作废</u-button>
            <u-button type="primary" size="large" @click="onFinish">完成</u-button>
        </view>
    </view>
</template>

<script setup>
import { ref } from 'vue'
import { onLoad } from '@dcloudio/uni-app'
import InfoCard from '@/pages/order/components/info-card.vue'
import TrackRecord from '@/pages/order/components/track-record.vue'

const detail = ref({})
const records = ref([])

const getDetail = async (code) => {
    try {
        const res = await uni.$u.http.get('/app/workorder/detail', { params: { type: 'mall', waybillCode: code } })
        if (res?.code === 200 && res?.data) {
            detail.value = res.data
            return
        }
    } catch (e) { }
    detail.value = {
        waybillCode: code || 'YT54454654564',
        taskTypeName: '部分发货',
        verifyStatusName: '已验货',
        taskDetail: '少发一本',
        createUser: 'zzz',
        createTime: '2026-05-11 15:00:00',
        imageUrl: '/static/img/book.png'
    }
    records.value = [
        { time: '2025-02-11 16:00:00', user: 'aaa', statusText: '发货' }
    ]
}

const onEdit = () => {
    uni.$u.toast('进入编辑')
}

const onVoid = () => {
    uni.$u.toast('已作废')
}

const onFinish = () => {
    uni.$u.toast('任务已完成')
}

onLoad((options) => {
    getDetail(options.waybillCode)
})
</script>

<style lang="scss" scoped>
.mt-20 {
    margin-top: 20rpx;
}
</style>