<template>
  <a-cascader :value="value" :options="options" :placeholder="placeholder" @change="change" />
</template>

<script setup lang="ts">
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore
import options from './division/options'

defineOptions({
  name: 'addCommunity',
})

type Props = {
  value: string[]
  values?: string[]
  placeholder?: string
}
const emit = defineEmits<{
  (e: 'update:value', value: string[]): void
}>()

// eslint-disable-next-line @typescript-eslint/no-unused-vars
const props = withDefaults(defineProps<Props>(), {
  value: () => [],
  placeholder: '请选择',
})

const change = (value: string[], options: any) => {
  console.log('change', value, options)
  const names = options.map((item) => item.label)

  const combined = value.map((code, index) => {
    return `${code},${names[index]}`
  })

  emit('update:value', value)
  emit('update:values', combined)
}
</script>

<style scoped lang="less"></style>
