<template>
  <div class="bg-sort">
    <a
      v-for="(item, index) in types"
      :key="'name_' + index"
      :class="{ current: item.value === modelValue }"
      @click="selectAction(item)">
      {{ item.name }}
    </a>
  </div>
</template>

<script setup>
const props = defineProps({
  modelValue: {
    type: [String, Number],
    default: "",
  },
  types: {
    type: Array,
    default: () => [
      {
        name: "综合排序",
        value: 0,
      },
      {
        name: "最近更新",
        value: 1,
      },
      {
        name: "最高人气",
        value: 2,
      },
      {
        name: "最好评价",
        value: 3,
      },
    ],
  },
});

const emit = defineEmits(["update:modelValue"]);

const selectAction = ({ value }) => {
  emit("update:modelValue", value);
};
</script>
