108 lines
2.4 KiB
Vue
108 lines
2.4 KiB
Vue
<script setup lang="ts">
|
|
export interface ResearchInputData {
|
|
query: string
|
|
breadth: number
|
|
depth: number
|
|
numQuestions: number
|
|
}
|
|
|
|
defineProps<{
|
|
isLoadingFeedback: boolean
|
|
}>()
|
|
|
|
const emit = defineEmits<{
|
|
(e: 'submit', value: ResearchInputData): void
|
|
}>()
|
|
|
|
const form = reactive({
|
|
query: '',
|
|
breadth: 2,
|
|
depth: 2,
|
|
numQuestions: 3,
|
|
})
|
|
|
|
const isSubmitButtonDisabled = computed(
|
|
() => !form.query || !form.breadth || !form.depth || !form.numQuestions,
|
|
)
|
|
|
|
function handleSubmit() {
|
|
emit('submit', {
|
|
...form,
|
|
})
|
|
}
|
|
|
|
defineExpose({
|
|
form,
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<UCard>
|
|
<template #header>
|
|
<h2 class="font-bold">1. Research Topic</h2>
|
|
</template>
|
|
<div class="flex flex-col gap-2">
|
|
<UFormField label="Research Topic" required>
|
|
<UTextarea
|
|
class="w-full"
|
|
v-model="form.query"
|
|
:rows="3"
|
|
placeholder="Enter whatever you want to research..."
|
|
required
|
|
/>
|
|
</UFormField>
|
|
|
|
<div class="grid grid-cols-1 sm:grid-cols-3 gap-4">
|
|
<UFormField label="Number of Questions" required>
|
|
<template #help> Number of questions for you to clarify. </template>
|
|
<UInput
|
|
v-model="form.numQuestions"
|
|
class="w-full"
|
|
type="number"
|
|
:min="1"
|
|
:max="5"
|
|
:step="1"
|
|
/>
|
|
</UFormField>
|
|
|
|
<UFormField label="Depth" required>
|
|
<template #help> How deep you want to dig. </template>
|
|
<UInput
|
|
v-model="form.depth"
|
|
class="w-full"
|
|
type="number"
|
|
:min="1"
|
|
:max="5"
|
|
:step="1"
|
|
/>
|
|
</UFormField>
|
|
|
|
<UFormField label="Breadth" required>
|
|
<template #help> Number of searches in each depth. </template>
|
|
<UInput
|
|
v-model="form.breadth"
|
|
class="w-full"
|
|
type="number"
|
|
:min="1"
|
|
:max="5"
|
|
:step="1"
|
|
/>
|
|
</UFormField>
|
|
</div>
|
|
</div>
|
|
|
|
<template #footer>
|
|
<UButton
|
|
type="submit"
|
|
color="primary"
|
|
:loading="isLoadingFeedback"
|
|
:disabled="isSubmitButtonDisabled"
|
|
block
|
|
@click="handleSubmit"
|
|
>
|
|
{{ isLoadingFeedback ? 'Researching...' : 'Start Research' }}
|
|
</UButton>
|
|
</template>
|
|
</UCard>
|
|
</template>
|