mobile-workflow/components/form/SelectInput.vue

60 lines
1.5 KiB
Vue
Raw Normal View History

2024-04-28 10:10:03 +08:00
<template>
<text class="w-form-input-rv" v-if="readonly">{{_value}}</text>
<uni-data-checkbox v-else-if="formProps.expanding" v-model="_value" :disabled="readonly" :localdata="options" />
2024-05-18 20:34:50 +08:00
<picker v-else @change="ok" mode="selector" :value="pickerIndex" :range="pickerOptions" :disabled="readonly">
<click-input :value="modelValue ? pickerOptions[pickerIndex]:null" :disabled="readonly"
2024-04-28 10:10:03 +08:00
:placeholder="formProps.placeholder || '请选择'" />
</picker>
</template>
<script setup>
2024-05-18 20:34:50 +08:00
import { computed, ref, watch } from 'vue'
2024-04-28 10:10:03 +08:00
import ClickInput from '@/components/ClickInput.vue'
const props = defineProps({
formProps: {
type: Object,
default: () => {
return {}
}
},
modelValue: String,
readonly: Boolean
})
const options = computed(() => {
return props.formProps.options.map(v => {
return { text: v, value: v }
})
})
2024-05-18 20:34:50 +08:00
const pickerOptions = computed(() => {
console.log(JSON.stringify(props.formProps.options),777888)
return props.formProps.options
})
const pickerIndex = computed(() => {
let findIndex = props.formProps.options.findIndex(item => {
return item == props.modelValue
})
return findIndex != -1?findIndex:0
})
2024-04-28 10:10:03 +08:00
const index = ref(0)
const _value = computed({
get() {
2024-05-18 20:34:50 +08:00
console.log(props.modelValue,'单选框111')
2024-04-28 10:10:03 +08:00
return props.modelValue
},
set(val) {
emits('update:modelValue', val)
}
})
const emits = defineEmits(['update:modelValue'])
function ok(e) {
index.value = e.detail.value
_value.value = props.formProps.options[index.value]
}
</script>
<style>
</style>