<template>
    <a-select ref="select" v-model:value="model" style="width: 100%" @change="handleChange" :defaultOpen="defaultOpen">
        <a-select-option v-for="value in stationList" :key="value.id" :value="value.id">
            {{ value.name }}
        </a-select-option>
    </a-select>
</template>

<script setup>
import { ref, watch } from 'vue'
import apis from '@/apis'

// 使用 defineModel 简化双向绑定
// 它会自动生成 { currentOrg: String, onUpdateCurrentOrg: Function }
// 并返回一个可读写的 ref
const model = ref(props.currentOrg)

// 接收其他不需要双向绑定的 prop
const props = defineProps({
    defaultOpen: {
        type: Boolean,
        default: false
    },
    currentOrg: {
        type: String,
        default: ''
    },
})
// 监听父组件 prop 变化（可选，如果父组件会动态改 currentOrg）
watch(() => props.currentOrg, (newVal) => {
    model.value = newVal
})
const emit = defineEmits(['update:currentOrg', 'change']) // 保留 change 事件

// 获取数据
const stationList = ref([])
getData()
async function getData() {
    try {
        const { data, success } = await apis.serviceMenu.getServiceSiteList({
            pageSize: 100,
            current: 1
        })
        if (success) {
            stationList.value = data.map(item => ({ id: item.id, name: item.name }))
        }
    } catch (error) {
        console.error('获取服务站点列表失败:', error)
    }
}

// 处理 change 事件
function handleChange(e) {
    model.value = e
    emit('update:currentOrg', e) // 触发 v-model 更新
    emit('change', e)
}
</script>