57 lines
1.4 KiB
Vue
57 lines
1.4 KiB
Vue
<script lang="ts" setup>
|
|
const props = defineProps({
|
|
inquiriesList: {
|
|
type: Array as PropType<
|
|
{ label: string; inquiries?: { question: string }[] }[]
|
|
>,
|
|
required: true,
|
|
},
|
|
});
|
|
|
|
const emit = defineEmits({
|
|
"select-inquiry": (inquiry: string) => true,
|
|
});
|
|
|
|
const activeTab = ref("0");
|
|
</script>
|
|
|
|
<template>
|
|
<div v-if="props.inquiriesList.length">
|
|
<div
|
|
class="rounded-lg bg-white/50 shadow border border-neutral-50/50 dark:border-neutral-700 dark:bg-neutral-800/50 overflow-hidden"
|
|
>
|
|
<div>
|
|
<UTabs
|
|
v-model="activeTab"
|
|
:content="false"
|
|
:items="props.inquiriesList"
|
|
variant="link"
|
|
size="sm"
|
|
/>
|
|
</div>
|
|
<div
|
|
v-if="props.inquiriesList[Number(activeTab)].inquiries"
|
|
class="py-1.5 px-1.5 flex flex-col gap-1 max-h-36 overflow-y-auto"
|
|
>
|
|
<UButton
|
|
v-for="inquiry in props.inquiriesList[Number(activeTab)].inquiries"
|
|
variant="ghost"
|
|
color="neutral"
|
|
trailing-icon="tabler-arrow-right"
|
|
size="sm"
|
|
block
|
|
:key="inquiry.question"
|
|
@click="() => emit('select-inquiry', inquiry.question)"
|
|
>
|
|
{{ inquiry.question }}
|
|
</UButton>
|
|
</div>
|
|
<div v-else class="p-4 text-sm font-medium text-center text-neutral-500">
|
|
暂无数据
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped></style>
|