feat: 切换 history 时自动聚焦输入框 (#735)

* feat: 修改 scrollToBottom 行为(当滚动条在底部或发送问题时才会进入自动滚动,滚轮向上滚动会中止自动滚动,方便复制和查看之前的代码; 切换 history 时自动聚焦输入框,方便直接输入文字,不用再次去点击输入框;)

* chore: 通过eslint检查

* perf: 清理重复功能

---------

Co-authored-by: Redon <790348264@qq.com>
This commit is contained in:
Allen 2023-03-22 19:53:21 +08:00 committed by GitHub
parent d2a22a3ee5
commit 814c3a2565
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 5 additions and 0 deletions

View File

@ -1,4 +1,5 @@
<script setup lang='ts'> <script setup lang='ts'>
import type { Ref } from 'vue'
import { computed, onMounted, onUnmounted, ref } from 'vue' import { computed, onMounted, onUnmounted, ref } from 'vue'
import { useRoute } from 'vue-router' import { useRoute } from 'vue-router'
import { storeToRefs } from 'pinia' import { storeToRefs } from 'pinia'
@ -40,6 +41,7 @@ const conversationList = computed(() => dataSources.value.filter(item => (!item.
const prompt = ref<string>('') const prompt = ref<string>('')
const loading = ref<boolean>(false) const loading = ref<boolean>(false)
const inputRef = ref<Ref | null>(null)
// PromptStore // PromptStore
const promptStore = usePromptStore() const promptStore = usePromptStore()
@ -452,6 +454,8 @@ const footerClass = computed(() => {
onMounted(() => { onMounted(() => {
scrollToBottom() scrollToBottom()
if (inputRef.value)
inputRef.value?.focus()
}) })
onUnmounted(() => { onUnmounted(() => {
@ -532,6 +536,7 @@ onUnmounted(() => {
<NAutoComplete v-model:value="prompt" :options="searchOptions" :render-label="renderOption"> <NAutoComplete v-model:value="prompt" :options="searchOptions" :render-label="renderOption">
<template #default="{ handleInput, handleBlur, handleFocus }"> <template #default="{ handleInput, handleBlur, handleFocus }">
<NInput <NInput
ref="inputRef"
v-model:value="prompt" v-model:value="prompt"
type="textarea" type="textarea"
:placeholder="placeholder" :placeholder="placeholder"