55 lines
1.4 KiB
Vue
55 lines
1.4 KiB
Vue
<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> |