diff --git a/src/stores/agent.ts b/src/stores/agent.ts index 3fbdfe9..4c7546a 100644 --- a/src/stores/agent.ts +++ b/src/stores/agent.ts @@ -16,6 +16,7 @@ type InitialProjectData = { useReport:boolean needSuggestion:boolean quoteList: Array + parameterTags?: Array<{ kind: string; label: string }> tempImages: any[] } export const useAgentStore = defineStore('agent', () => { diff --git a/src/views/home/agent/components/Agent.vue b/src/views/home/agent/components/Agent.vue index b8223a3..75f71f3 100644 --- a/src/views/home/agent/components/Agent.vue +++ b/src/views/home/agent/components/Agent.vue @@ -37,8 +37,12 @@ import type { AgentParamsType } from '@/api/agent' import { useUserInfoStore, useProjectStore, useAgentStore } from '@/stores' import MyEvent from '@/utils/myEvent' + import { areaList } from '@/utils/area' import { useI18n } from 'vue-i18n' import { useRoute } from 'vue-router' + import { ElMessage } from 'element-plus' + import { createStyleOptions, createTypeOptions } from '../../components/input/options' + import type { OptionItem, ParameterTag } from '../../components/input/types' const { t } = useI18n() const route = useRoute() @@ -83,6 +87,59 @@ }) const sketchList = ref([]) + const typeOptions = createTypeOptions() + const areaOptions = areaList + const styleOptions = createStyleOptions() + + const getTranslatedOptionLabel = (options: OptionItem[], value?: string) => { + if (!value) return '' + const option = options.find((item) => item.value === value) + return option ? t(option.label) : value + } + + const getOptionLabel = (options: OptionItem[], value?: string) => { + if (!value) return '' + return options.find((item) => item.value === value)?.label || value + } + + const getProjectParameterTags = (project: any): ParameterTag[] => { + const type = project?.type || '' + const region = project?.region || project?.area || '' + const style = project?.style || '' + const tags: ParameterTag[] = [] + + if (type) { + tags.push({ + kind: 'type', + label: getTranslatedOptionLabel(typeOptions, type) + }) + } + if (region) { + tags.push({ + kind: 'area', + label: getTranslatedOptionLabel(areaOptions, region) + }) + } + if (style) { + tags.push({ + kind: 'style', + label: getOptionLabel(styleOptions, style) + }) + } + + return tags + } + + const applyProjectParameterTags = (messages: any[], project: any) => { + const parameterTags = getProjectParameterTags(project) + if (parameterTags.length === 0) return + + const firstUserMessage = messages.find((item) => item.isUser || item.role === 'user') + if (firstUserMessage) { + firstUserMessage.parameterTags = parameterTags + } + } + watch( sketchList, (newVal) => { @@ -143,7 +200,8 @@ images: initialData.images, useReport: initialData.useReport, tempImages: initialData.tempImages, - quoteList: initialData.quoteList + quoteList: initialData.quoteList, + parameterTags: initialData.parameterTags || [] }) // 更新 configParams @@ -181,6 +239,7 @@ tempImages: any[] useReport: boolean quoteList: Array + parameterTags?: Array<{ kind: string; label: string }> }, skipUserMessage = false ) => { @@ -199,7 +258,8 @@ id: messageList.value.length + 1, text: message.text, isUser: true, - imageUrls: message.tempImages.concat(message.quoteList) + imageUrls: message.tempImages.concat(message.quoteList), + parameterTags: message.parameterTags || [] }) } @@ -628,7 +688,7 @@ const setChatInfo = (info) => { const initialData = agentStore.getInitialProjectData if (isGenerating.value || initialData) return - +console.log('---',info) const data = info.conversation let project = info.project if (info.id) { @@ -641,7 +701,7 @@ if (project) { params.configParams.type = project.type || '' - params.configParams.region = project.area || '' + params.configParams.region = project.region || project.area || '' params.configParams.style = project.style || '' params.configParams.temperature = project.temperature params.projectID = project.id @@ -668,6 +728,7 @@ item.text += `` } }) + applyProjectParameterTags(ancestorsList, project) // console.log('ancestorslist', ancestorsList) messageList.value = [...ancestorsList] params.versionID = current?.id diff --git a/src/views/home/agent/components/Item.vue b/src/views/home/agent/components/Item.vue index 01e22d6..ae327d9 100644 --- a/src/views/home/agent/components/Item.vue +++ b/src/views/home/agent/components/Item.vue @@ -52,20 +52,36 @@ --> -
+
+
+
+ + {{ tag.label }} +
+
() @@ -174,6 +200,16 @@ return list }) + const parameterTags = computed(() => { + return Array.isArray(props.content?.parameterTags) ? props.content.parameterTags : [] + }) + + const getParameterTagIcon = (kind: ParameterTagKind) => { + if (kind === 'type') return TypeIcon + if (kind === 'area') return RegionIcon + return StyleIcon + } + const customAttrs: CustomAttrs = { img: { style: 'max-width: 100%;' @@ -348,6 +384,38 @@ width: fit-content; max-width: 82%; } + .message-parameter-tags { + flex-wrap: wrap; + justify-content: flex-start; + gap: 0.8rem; + margin-right: 0.8rem; + } + .message-parameter-tag { + height: 3rem; + max-width: 24rem; + padding: 0 1rem; + border: 0.1rem solid #0000001a; + border-radius: 2.2rem; + column-gap: 0.8rem; + font-family: 'Medium'; + font-weight: 500; + font-size: 1.2rem; + color: #0d0d0d; + background-color: #fff; + box-sizing: border-box; + .parameter-tag-icon { + width: 1.2rem; + height: 1.2rem; + flex-shrink: 0; + object-fit: contain; + } + span { + min-width: 0; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + } + } .web-address { width: fit-content; min-width: 22.5rem; @@ -443,6 +511,18 @@