53 lines
1.1 KiB
Vue
53 lines
1.1 KiB
Vue
<template>
|
|
<view class="u-flex">
|
|
<view @click="show = true">
|
|
<slot v-if="$slots.default"> </slot>
|
|
<view v-else class="choose-goods u-flex u-row-between">
|
|
<text class="color-333 u-font-28 font-bold">{{ statusText }}</text>
|
|
<up-icon size="14" name="arrow-down" color="#333" bold></up-icon>
|
|
</view>
|
|
</view>
|
|
|
|
<up-action-sheet
|
|
:show="show"
|
|
cancel-text="取消"
|
|
closeOnClickAction
|
|
@close="show = false"
|
|
:actions="actions"
|
|
@select="confirm"
|
|
></up-action-sheet>
|
|
</view>
|
|
</template>
|
|
<script setup>
|
|
import { ref ,computed } from "vue";
|
|
const show = ref(false);
|
|
const modelValue = defineModel({
|
|
type: String,
|
|
default: "",
|
|
});
|
|
function confirm(item) {
|
|
modelValue.value = item.value;
|
|
}
|
|
const actions = ref([
|
|
{
|
|
name: "全部",
|
|
value: "",
|
|
},
|
|
{
|
|
name: "已兑换",
|
|
value: "1",
|
|
},
|
|
{
|
|
name: "未兑换",
|
|
value: "0",
|
|
},
|
|
]);
|
|
|
|
const statusText = computed(() => {
|
|
if (modelValue.value === "") {
|
|
return "全部";
|
|
}
|
|
return modelValue.value === "1" ? "已兑换" : "未兑换";
|
|
});
|
|
</script>
|