From 0f13cb82cd3b5fc20ed79321b8fea870db1868f8 Mon Sep 17 00:00:00 2001
From: wujingjing <gersonwu@qq.com>
Date: 星期五, 03 一月 2025 17:05:02 +0800
Subject: [PATCH] input-select
---
src/components/chat/Chat.vue | 30 ++++++++++++---
src/components/chat/chatComponents/multiChat/Select.vue | 8 ++--
src/components/chat/chatComponents/multiChat/index.ts | 4 +
src/components/chat/model/types.ts | 1
src/components/chat/assistant/index.vue | 9 +---
src/components/chat/chatComponents/multiChat/InputSelect.vue | 44 ++++++++++++++++++++++
6 files changed, 78 insertions(+), 18 deletions(-)
diff --git a/src/components/chat/Chat.vue b/src/components/chat/Chat.vue
index f3f8915..fe35bdb 100644
--- a/src/components/chat/Chat.vue
+++ b/src/components/chat/Chat.vue
@@ -340,14 +340,29 @@
chunkRes.value = '鍒嗘瀽缁撴潫';
}
}
+ const getLastGroup = () => {
+ const lastGroup = computedMessageList.value.at(-1).stepGroup.at(-1);
+ return lastGroup;
+ }
+ const getLastStepList = () => {
+ const stepList = getLastGroup()?.value ?? [];
+ return stepList;
+ };
+ const getLastStepItem = () => {
+ const stepList = getLastStepList();
+ const lastStepItem = stepList.at(-1);
+ return lastStepItem;
+ };
+
+ const checkStepItem = (stepItem) => {
+ if (!stepItem.subStep) {
+ stepItem.subStep = [];
+ }
+ };
if (chunkRes.mode === 'question') {
- const lastGroup = computedMessageList.value.at(-1).stepGroup.at(-1);
- const stepList = lastGroup?.value ?? [];
- const lastStepItem = stepList.at(-1);
- if (!lastStepItem.subStep) {
- lastStepItem.subStep = [];
- }
+ const lastStepItem = getLastStepItem();
+ checkStepItem(lastStepItem);
lastStepItem.subStep.push({
type: chunkRes.value.type,
data: chunkRes.value,
@@ -355,6 +370,9 @@
scrollToBottom();
return;
}
+
+
+
// 鏆傛椂涓嶈�冭檻澶氫釜 report鎯呭喌
// if (lastIsResult && chunkRes.mode !== 'finish') {
diff --git a/src/components/chat/assistant/index.vue b/src/components/chat/assistant/index.vue
index a361793..3bc4318 100644
--- a/src/components/chat/assistant/index.vue
+++ b/src/components/chat/assistant/index.vue
@@ -91,18 +91,13 @@
v-for="(multiChatItem, multiChatIndex) in subItem.subStep"
>
<component
- v-if="multiChatItem.type === MultiChatType.Select"
+
:order="`${stepIndex + 1}-${multiChatIndex + 1}`"
:item="multiChatItem"
:is="multiChatTypeMapCom[multiChatItem.type]"
:disabled="!(stepIndex + 1 === msg?.stepGroup?.[index].value.length && isTalking && isLast)"
/>
- <component
- v-else-if="multiChatItem.type === MultiChatType.Result"
- :is="answerTypeMapCom['summary']"
- :data="multiChatItem.data.content.values"
- :originData="multiChatItem.data"
- />
+
</div>
</div>
</template>
diff --git a/src/components/chat/chatComponents/multiChat/InputSelect.vue b/src/components/chat/chatComponents/multiChat/InputSelect.vue
new file mode 100644
index 0000000..34b5238
--- /dev/null
+++ b/src/components/chat/chatComponents/multiChat/InputSelect.vue
@@ -0,0 +1,44 @@
+<template>
+ <div class="flex flex-col gap-1">
+ <span class="text-gray-600 font-normal">{{ `${order} ${item?.data?.title}` }}</span>
+ <div class="flex-items-center gap-5">
+ <!-- <span
+ @click="select(subItem)"
+ v-for="(subItem, index) in item?.data?.options"
+ :key="index"
+ class="flex w-fit items-center cursor-pointer border-solid border px-3 border-gray-300 hover:text-blue-400 rounded-lg"
+ :class="{ 'cursor-not-allowed': disabled, 'bg-blue-400': subItem === activeOption, 'text-white': subItem === activeOption }"
+ >{{ subItem }}</span
+ > -->
+ <el-select v-if="isSelect" v-model="activeOption" placeholder="璇烽�夋嫨" @change="debounceSelect">
+ <el-option v-for="item in item?.data?.options" :key="item" :label="item" :value="item"></el-option>
+ </el-select>
+ <el-input v-else @input="debounceSelect" v-model="activeOption" />
+ </div>
+ </div>
+</template>
+
+<script setup lang="ts">
+import { computed, ref } from 'vue';
+import { question_stream_reply } from '/@/api/ai/chat';
+import { debounce } from '/@/utils/util';
+const props = defineProps(['order', 'item', 'disabled']);
+// :class="[...(subItem === activeOption ? ['bg-blue-400', 'text-white'] : []), disabled ? 'cursor-not-allowed' : '']"
+// 'bg-blue-400': subItem === activeOption, 'text-white': subItem === activeOption.value
+const isSelect = computed(() => props.item?.data?.options?.length > 0);
+
+const activeOption = ref();
+const selectChange = async (option) => {
+ if (props.disabled) return;
+ const res = await question_stream_reply({
+ select: option,
+ reply_id: props.item?.data?.reply_id,
+ });
+ if (res.json_ok) {
+ activeOption.value = option;
+ }
+};
+const debounceSelect = debounce(selectChange, 500);
+
+</script>
+<style scoped lang="scss"></style>
diff --git a/src/components/chat/chatComponents/multiChat/Select.vue b/src/components/chat/chatComponents/multiChat/Select.vue
index 39272bd..627096e 100644
--- a/src/components/chat/chatComponents/multiChat/Select.vue
+++ b/src/components/chat/chatComponents/multiChat/Select.vue
@@ -1,13 +1,13 @@
<template>
<div class="flex flex-col gap-1">
<span class="text-gray-600 font-normal">{{ `${order} ${item?.data?.title}` }}</span>
-
<div v-if="item?.data?.options?.length > 0" class="flex-items-center gap-5">
<span
- @click="select(subItem)"
- v-for="subItem in item?.data?.options"
+ @click="select(subItem)"
+ v-for="(subItem,index) in item?.data?.options"
+ :key="index"
class="flex w-fit items-center cursor-pointer border-solid border px-3 border-gray-300 hover:text-blue-400 rounded-lg"
- :class="{ 'cursor-not-allowed': disabled, }"
+ :class="{ 'cursor-not-allowed': disabled, 'bg-blue-400': subItem === activeOption, 'text-white': subItem === activeOption }"
>{{ subItem }}</span
>
</div>
diff --git a/src/components/chat/chatComponents/multiChat/index.ts b/src/components/chat/chatComponents/multiChat/index.ts
index 329ea11..9cbc0e1 100644
--- a/src/components/chat/chatComponents/multiChat/index.ts
+++ b/src/components/chat/chatComponents/multiChat/index.ts
@@ -1,6 +1,8 @@
import { MultiChatType } from '../../model/types';
import Select from './Select.vue';
-
+import InputSelect from './InputSelect.vue';
export const multiChatTypeMapCom = {
[MultiChatType.Select]: Select,
+ [MultiChatType.InputSelect]: InputSelect,
};
+
\ No newline at end of file
diff --git a/src/components/chat/model/types.ts b/src/components/chat/model/types.ts
index 0d88a24..a1e8e34 100644
--- a/src/components/chat/model/types.ts
+++ b/src/components/chat/model/types.ts
@@ -84,6 +84,7 @@
};
export const enum MultiChatType {
Select = 'select',
+ InputSelect = 'input-select',
Summary = 'summary',
Result = 'result',
}
--
Gitblit v1.9.3