diff --git a/src/assets/images/restore.png b/src/assets/images/restore.png new file mode 100644 index 0000000..8a19eb2 Binary files /dev/null and b/src/assets/images/restore.png differ diff --git a/src/assets/images/tag-close.png b/src/assets/images/tag-close.png new file mode 100644 index 0000000..b89b45b Binary files /dev/null and b/src/assets/images/tag-close.png differ diff --git a/src/views/home/agent/components/Agent.vue b/src/views/home/agent/components/Agent.vue index 04cb668..8102bcd 100644 --- a/src/views/home/agent/components/Agent.vue +++ b/src/views/home/agent/components/Agent.vue @@ -10,6 +10,7 @@
+ + diff --git a/src/views/home/agent/components/versionTree/index.vue b/src/views/home/agent/components/versionTree/index.vue index 583fc63..6687919 100644 --- a/src/views/home/agent/components/versionTree/index.vue +++ b/src/views/home/agent/components/versionTree/index.vue @@ -19,8 +19,9 @@ const props = defineProps({ } }) -//const emit = defineEmits([ -//]) +const emit = defineEmits([ + 'restore' +]) const versionsList = ref([]) @@ -70,7 +71,8 @@ const openTree = (state)=>{ treeState.value = state } -const versionRestore = ()=>{ +const versionRestore = () => { + let id = '' if(selectItem.value?.children?.length > 0){ function findMaxForYourFormat(items) { @@ -99,6 +101,7 @@ const versionRestore = ()=>{ findAndAddChild(versionsList.value, selectItem.value?.versionId, addObj) selectItem.value = {...addObj} treeKey.value++ + emit('restore') } const versionDelete = (versionDetail)=>{ if(!selectItem.value?.versionId)return diff --git a/src/views/home/agent/index.vue b/src/views/home/agent/index.vue index 40b6219..f8408e0 100644 --- a/src/views/home/agent/index.vue +++ b/src/views/home/agent/index.vue @@ -4,12 +4,16 @@
Version Tree
- +
- + @@ -21,12 +25,11 @@ import { useProjectStore } from '@/stores' import { getProjectInfo } from '@/api/agent' - const agentTitle = ref('Retro Sofa Sketch') const previewType = ref<'sketch' | 'report'>('sketch') const VersionTreeIndexRef = ref() - + const agentRef = ref() const sketchList = ref([]) const updateSketchList = (newVal) => { console.log('newVal', newVal) @@ -35,21 +38,30 @@ } const versionTreeData = ref({ - drawer: false, + drawer: false }) + const handleRestore = () => { + console.log('-----------', agentRef.value.inputRef.addReportTag) + + agentRef.value?.inputRef?.addReportTag('Restore') + } + const projectStore = useProjectStore() - watch(()=>projectStore.state.id, (newVal, oldVal) => { - if(newVal){ - getProjectInfo({ id: newVal }).then(res => { - projectStore.setProject(res.project) - }) + watch( + () => projectStore.state.id, + (newVal, oldVal) => { + if (newVal) { + getProjectInfo({ id: newVal }).then((res) => { + projectStore.setProject(res.project) + }) + } } - }) + ) - onMounted(()=>{ - if(projectStore.state.id){ - getProjectInfo({ id: projectStore.state.id }).then(res => { + onMounted(() => { + if (projectStore.state.id) { + getProjectInfo({ id: projectStore.state.id }).then((res) => { projectStore.setProject(res.project) }) } diff --git a/src/views/home/components/Input.vue b/src/views/home/components/Input.vue index 186a483..9802681 100644 --- a/src/views/home/components/Input.vue +++ b/src/views/home/components/Input.vue @@ -22,7 +22,7 @@ :placeholder="$t('Input.placeholder')" @input="handleEditorInput" @paste="handleEditorPaste" - @keypress="handleKeyPress" + @keydown="handleKeyDown" >
@@ -184,6 +184,8 @@ import { useAgentStore, useProjectStore } from '@/stores' import lightIcon from '@/assets/images/light-icon.png' import closeIcon from '@/assets/images/close-icon.png' + import restoreIcon from '@/assets/images/restore.png' + import restoreCloseIcon from '@/assets/images/tag-close.png' import { createProject } from '@/api/agent' import { getStyleImage } from './style' // import Tag from './Tag.vue' @@ -265,22 +267,35 @@ const inputValue = ref('') const reportTags = ref([]) - const addReportTag = () => { + // 导出给父组件调用的方法 + const addReportTag = (text?: string) => { + // 使用传入的文本,如果没有传入则使用默认的翻译文本 + const tagText = text || t('Input.trendingReport') + // create container matching static structure:
... const tag = document.createElement('div') - tag.className = 'editor-tag report-btn flex-center' tag.contentEditable = 'false' - const imgLeft = document.createElement('img') - imgLeft.className = 'light-icon' - imgLeft.src = lightIcon as unknown as string - - const textSpan = document.createElement('span') - textSpan.innerText = t('Input.trendingReport') - const imgClose = document.createElement('img') + const textSpan = document.createElement('span') imgClose.className = 'close-icon' - imgClose.src = closeIcon as unknown as string + if (text) { + tag.className = 'editor-tag restore flex-center' + imgLeft.className = 'restore-icon' + imgLeft.src = restoreIcon as unknown as string + imgClose.src = restoreCloseIcon as unknown as string + imgClose.className = 'close-icon restore' + textSpan.className = 'restore-text' + } else { + tag.className = 'editor-tag report-btn flex-center' + imgLeft.className = 'light-icon' + imgLeft.src = lightIcon as unknown as string + imgClose.src = closeIcon as unknown as string + } + + + textSpan.innerText = tagText + imgClose.addEventListener('click', (ev) => { ev.stopPropagation() // remove tag when close clicked @@ -398,11 +413,17 @@ } } - const handleKeyPress = (e) => { + const handleKeyDown = (e) => { // 检测回车 if (e.key === 'Enter') { + console.log('11111111111') + e.preventDefault() - handleSendAgent() + if (props.isAgentMode) { + handleSendAgent() + } else { + handleCreateProject() + } return } if (e.key === 'Backspace') { @@ -446,12 +467,20 @@ } const handleSendAgent = async () => { + console.log('发送信息--------') + if (props.generating) { emits('pause') return } if (!inputValue.value.trim()) return - emits('send', { text: inputValue.value.trim(), images: uploadedImages.value }) + console.log('222222') + + const payload = { text: inputValue.value.trim(), images: uploadedImages.value } + console.log('准备发送 send 事件', payload) + emits('send', payload) + console.log('send 事件已发送') + // 发送后清空输入框 if (editorRef.value) { editorRef.value.innerHTML = '' @@ -534,7 +563,7 @@ temperature: 0.7 } const projectres = await createProject(params) - console.log('projectres', projectres) + // console.log('projectres', projectres) projectStore.setId(projectres) // 保存初始数据到 store agentStore.setInitialProjectData({ @@ -543,9 +572,14 @@ ...params }) - console.log('Create project with:', params) + // console.log('Create project with:', params) router.push('/home/agent', { query: params }) } + + // 暴露方法给父组件 + defineExpose({ + addReportTag + }) diff --git a/src/views/home/components/style.ts b/src/views/home/components/style.ts index 0e59efb..189ae29 100644 --- a/src/views/home/components/style.ts +++ b/src/views/home/components/style.ts @@ -25,35 +25,15 @@ function slugify(str) { * @returns { string | null } 返回可直接用于 的 URL */ export function getStyleImage(types, style) { - - if (!types) types = 'Sofa' + if (!types) types = 'Sofa' const type = types.toLowerCase() const map = imagesMaps[type] - + const fileName = `${slugify(style)}.png` const key = `/src/assets/images/${type}/${fileName}` - console.log('types',types, 'style',style, 'fileName',fileName, 'key',key); if (map[key]) { return map[key].default } return '' } - -const styleList = [ - 'Venetian Modern', - 'Coastal', - 'Maximalism', - 'Memphis', - 'Verdant', - 'Century Chrome', - 'Modern Revival', - 'Transitional', - "Tuscan 2000's", - 'Kitsch-core', - 'Bauhaus', - 'Constructivism', - 'Nordic Noir', - 'Dopamine', - 'Squiggle' -]