<template>
    <div class="flex-1 fx-col">
        <ie-form-picker :model-value="college.name" label="选择学校" @click="handlePick"/>
    </div>
</template>

<script>
import {ref, getCurrentInstance} from 'vue';
import IeFormPicker from "@/pages/ie/components/picker/ie-form-picker.vue";
import AIFormFieldBase from "@/pages/ie/components/ai-form/items/AIFormFieldBase";
import {useTransfer} from "@/hooks/useTransfer";
import mxConst from "@/common/mxConst";

export default {
    name: "ai-form-college",
    components: {IeFormPicker},
    mixins: [AIFormFieldBase],
    setup(_, {emit}) {
        const {transferTo, onPageCallback} = useTransfer()
        const instance = getCurrentInstance()

        const college = ref({})

        const handlePick = () => {
            transferTo('/pages/college-library/picker/picker', {
                callback: mxConst.globalEvents.collegeSelected
            })
        }

        onPageCallback((item) => {
            if (item) {
                college.value = item
                emit('update:modelValue', item.code)
                instance.proxy?.clearValidate()
            }
        })

        return {
            college,
            handlePick
        }
    }
}
</script>

<style scoped>

</style>