shuhi-app/pages/index/express/components/RejectButton.vue

<template>
    <view style="width:50%">
        <u-button type="warning" text="驳回" size="small" @click="handleReject" v-bind="$attrs" />

        <!-- 驳回原因选择器 -->
        <u-picker :show="showRejectPicker" :columns="[rejectReasons]" @confirm="confirmReject"
            @cancel="showRejectPicker = false" />
    </view>
</template>

<script setup>
import { ref } from 'vue';

const emit = defineEmits(['reject']);
const showRejectPicker = ref(false);

const rejectReasons = [
    '重量不符',
    '包装破损',
    '货物缺失',
    '其他原因'
];

const handleReject = () => {
    showRejectPicker.value = true;
};

const confirmReject = (e) => {
    const reason = e.value[0];
    emit('reject', reason);
    showRejectPicker.value = false;
};
</script>