<template>
  <a-select
    placeholder="科目类型"
    allowClear
    :disabled="props.disabled"
    :value="valueStr"
    style="width: 120px"
    @change="handleChange"
  >
    <a-select-option value="PUBLIC">公共科目</a-select-option>
    <a-select-option value="MAJOR">专业科目</a-select-option>
  </a-select>
</template>

<script setup lang="ts">
import { Course_Type } from "@/types";
import { computed } from "vue";

const props = withDefaults(
  defineProps<{
    value?: Course_Type;
    disabled?: boolean;
  }>(),
  {
    value: undefined,
    disabled: false,
  }
);
const emit = defineEmits(["update:value"]);

const valueStr = computed(() => {
  let res: undefined | string = props.value ?? undefined;
  return res as undefined | string;
});

function handleChange(v: undefined | string) {
  // console.log(v);
  emit("update:value", v);
}
</script>
