<script setup> const props = defineProps({ show: { type: Boolean, default: false }, price: { type: Number, default: 0 } }) const emit = defineEmits(['update:show']) const payStatus=ref(0) const changePayStatus=()=>{ payStatus.value=payStatus.value===0?1:0 } const close=()=>{ emit('update:show',false) } const confirm=()=>{ emit('update:show',false) } </script> <template> <div> <van-dialog :show="show" show-cancel-button @close="close" @confirm="confirm"> <div class="flex flex-col pt-18px pb-13px justify-between items-center h-144px"> <template v-if="payStatus===0"> <div class="text-#000 text-16px font-600 ">支付全部</div> <div class="text-#000 text-16px ">RMB 5,000</div> </template> <template v-if="payStatus===1"> <div class="text-#000 text-16px font-600 ">支付部分</div> <input class="w-272px h-48px bg-#F3F3F3 px-11px text-16px" type="text" placeholder="最多RMB5,000"> </template> <div class="text-#2B53AC text-14px" @click="changePayStatus">{{payStatus===0 ? '支付部分' : '支付全部'}}</div> </div> </van-dialog> </div> </template> <style scoped lang="scss"> :deep(.van-hairline--top.van-dialog__footer){ &>.van-button{ border-top: 1px solid #E7E7E7; &.van-dialog__cancel{ border-right: 1px solid #E7E7E7; } } } </style>