liveh5-nuxt/app/components/x-van-select/index.vue
xingyy 43b1afb8f0 feat(collect-code): 实现线下扫码支付功能
- 新增 offlineQrcode 和 createOrder 接口
- 实现个人资讯页面的数据获取和处理
- 添加支付页面,支持全款和部分款项支付
- 优化签名协议页面,使用新接口获取数据
- 新增支付结果页面,展示支付状态和金额
2025-02-20 11:35:23 +08:00

84 lines
1.6 KiB
Vue

<script setup>
import { ref } from 'vue'
const props = defineProps({
modelValue: {
type: [Number, String]
},
columns: {
type: Array,
default: () => []
},
label: {
type: String,
default: ''
},
required: {
type: Boolean,
default: false
},
placeholder: {
type: String,
default: '请选择'
},
disabled: {
type: Boolean,
default: false
}
})
const emit = defineEmits(['update:modelValue', 'change'])
const show = ref(false)
const onConfirm = (value) => {
show.value = false
emit('update:modelValue', value.selectedValues?.[0])
emit('change', value.selectedValues?.[0])
}
const displayText = computed(() => {
const selected = props.columns.find(x => x.value === props.modelValue)
return selected?.text || ''
})
const openPopup=()=>{
show.value=true
}
</script>
<template>
<div>
<van-field
:model-value="displayText"
@click="openPopup"
readonly
:disabled="disabled"
:required="required"
:placeholder="placeholder"
:label="label"
class="mb-10px"
is-link
/>
<van-popup
v-model:show="show"
destroy-on-close
position="bottom"
teleport="body"
safe-area-inset-bottom
>
<van-picker
:columns="columns"
@confirm="onConfirm"
@cancel="show = false"
:default-index="columns.findIndex(x => x.value === modelValue)"
title="请选择"
confirm-button-text="确定"
cancel-button-text="取消"
/>
</van-popup>
</div>
</template>