<script lang="ts" name="rc-select" setup>
import type { FormCreateProps } from '@form-create/element-ui'
import type { Option } from './createOptions.ts'
import { onMounted, ref } from 'vue'
const props = defineProps<{
  formCreateInject: FormCreateProps & {
    field: string
  }
}>()

const options = ref<Option[]>([])

// 注册组件的事件， 获取右边标签改变时的值
window.__QIANKUN__EVENT__?.on(props.formCreateInject.field, (tags: Option[]) => {
  if (props.formCreateInject.rule?.props === void 0) {
    return
  }
  ;(props.formCreateInject.rule.props as Record<string, Option[]>).options =
    // eslint-disable-next-line vue/no-mutating-props
    props.formCreateInject.rule.options = tags.map((item) => {
      return {
        ...item,
        value: item.label,
      }
    })
  options.value = tags
})

onMounted(() => {
  options.value = props.formCreateInject.rule!.options as unknown as Option[]
})
</script>
<template>
  <slot :options="options" />
</template>
