<template>
  <el-select v-model="modelValue" placeholder="请选择优惠券" clearable style="width: 300px;" @change="changHandle">
    <el-option v-for="coupon in couponList" :key="coupon.id" :label="coupon.title" :value="coupon.id" />
  </el-select>
</template>
<script setup>
import couponApi from "@/api/market/coupon";
import { ref, onMounted } from "vue";

const modelValue = defineModel({
  type: [String, Number],
  default: ''
});

const name = defineModel('name', {
  type: String,
  default: ''
});

function changHandle(value) {
  name.value = couponList.value.find(item => item.id === value)?.title || '';
}

// 优惠券列表
const couponList = ref([]);

onMounted(() => {
  couponApi.getList({ size: 999 }).then((res) => {
    if (res) {
      couponList.value = res.records || [];
    }
  });
});
</script>