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 = ref([]);
const getRejectReason = async () => {
    const res = await uni.$u.http.get('/app/sysDict/getDict?key=route_exception_reason ');
    if (res.code == 200) {
        rejectReasons.value = res.data.map(item => item.dictValue);
    }
};
getRejectReason()


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

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