<script setup>
import { computed } from "vue";
import levelTwo from "./data/pc-code.json";
import levelThree from "./data/pca-code.json";
import levelFour from "./data/pcas-code.json";

const props = defineProps({
  value: {
    type: String,
    default: undefined
  },
  label: {
    type: String,
    default: undefined
  },
  level: {
    type: Number,
    default: 3
  }
});
const cascaderRef = ref(null);

const emit = defineEmits(['update:value']);
const levelMap = {
  2: levelTwo,
  3: levelThree,
  4: levelFour
};

const options = computed(() => levelMap[props.level] || []);

const updateValue = (value, option) => {
  emit("update:value", value);
};
defineExpose({
  cascaderRef
});
</script>

<template>
  <n-cascader
    ref="cascaderRef"
    :value="value"
    placeholder="请选择"
    :options="options"
    showPath
    check-strategy="child"
    value-field="code"
    label-field="name"
    filterable
    @update:value="updateValue"
    v-bind="{...$attrs}"
  />
</template>