Commit b8c8e9a9 authored by tyyin lan's avatar tyyin lan

feat(首页): 输入框编辑器多语言配置

parent de919d91
...@@ -282,6 +282,73 @@ home_module: ...@@ -282,6 +282,73 @@ home_module:
interrupt_dialogue_prompt: 'The current reply is not complete. Are you sure to interrupt and initiate a new session?' interrupt_dialogue_prompt: 'The current reply is not complete. Are you sure to interrupt and initiate a new session?'
interrupt_the_conversation_and_apply_the_history_prompt: 'The current reply is not complete, are you sure to interrupt the conversation and apply another record?' interrupt_the_conversation_and_apply_the_history_prompt: 'The current reply is not complete, are you sure to interrupt the conversation and apply another record?'
rich_text_module:
placeholder: 'Send a message and enter {symbol} to select the tool'
template: 'Template'
message_editor: 'Message editor'
writing_placeholder: 'Enter the topic you are going to write about'
template_list:
work: 'Work'
business_marketing: 'Business marketing'
social_media_copywriting: 'Social media copywriting'
literature_and_art: 'Literature and art'
work_list:
t_title_1: 'Weekly Report'
t_doc_1: 'Summarize the work achievements of the week'
t_template_1: "My occupation is [[Enter occupation]]. Please help me write a weekly work report for this week, which includes [[Enter this week's work content]] and the plan for next week [[Enter next week's work plan]]."
t_title_2: 'Daily Report'
t_doc_2: 'Summary and review of daily work'
t_template_2: "My occupation is [[Enter occupation]]. Please help me write a work report for today, which includes [[Enter today's work content]] and tomorrow's plan [[Enter tomorrow's work plan]]."
t_title_3: 'Monthly report'
t_doc_3: "A clear review of the entire month's work"
t_template_3: "My occupation is [[Enter occupation]]. Please help me write a monthly work report for this month, which includes [[Enter this month's work content]] and the plan for next month [[Enter next month's work plan]]."
t_title_4: 'Email'
t_doc_4: 'Write emails efficiently and professionally'
t_template_4: 'Help me write an email to [[Enter the sender]], and the content is [[Enter the subject]].'
t_title_5: 'Meeting Summary'
t_doc_5: 'The content of the meeting was clear and straightforward'
t_template_5: 'Help me write a meeting summary for the discussion [[Enter the meeting content]]. The tone should be formal, and the content should include the main discussion points and conclusions of the meeting. Use Markdown format.'
business_marketing_list:
t_title_1: 'Event planning'
t_doc_1: 'Efficiently customize various planning schemes'
t_template_1: "I'm an event planner. Please help me write a plan for a music exchange event. The content should include but not be limited to the planning theme, planning purpose, detailed plan, required resources, planning budget, risk response, and effect evaluation."
t_title_2: 'Market research'
t_doc_2: 'Accurate insight into the market'
t_template_2: 'I am a market research expert. Please help me write a market research report on [[topic]], which should include the research background and purpose, research methods, market analysis, consumer analysis, data analysis and findings, conclusions and suggestions, etc.'
t_title_3: 'Marketing slogan'
t_doc_3: 'Eye-catching and creative advertising slogans'
t_template_3: 'Help me write five advertising and marketing slogans for [[Input target audience]] to promote [[Input brand products]]. They should be concise, clear and creative.'
social_media_copywriting_list:
t_title_1: 'RedNote'
t_doc_1: 'Create eye-catching content on Xiaohongshu'
t_template_1: 'Generate a Little Red Book copy about the [[topic]]. The content should have a title and a main body. The title should be in the style of Xiaohongshu, and the main text should appropriately use emojis to enrich the copy.'
t_title_2: 'Weibo'
t_doc_2: 'Quickly create a Weibo post plan'
t_template_2: 'Help me generate a Weibo post proposal about [[topic]]'
t_title_3: 'Evaluation'
t_doc_3: 'Create personalized comments'
t_template_3: 'I want to write a positive review about [[Input evaluation topic: such as book evaluation]] and post it on [[Input platform]], with no less than [[100]] words.'
literature_and_art_list:
t_title_1: 'Poetry'
t_doc_1: 'Create beautiful and touching poems'
t_template_1: 'You are a poet. Help me create a poem about [[input theme]], using [[Input format: such as a four-character regulated verse]] format.'
t_title_2: 'Story'
t_doc_2: 'Write interesting and eye-catching stories'
t_template_2: 'Help me create a story about [[Input theme]]. It should have a title and a main text. The plot should be full of ups and downs and captivating. The word count should be around 800 words.'
personal_space_module: personal_space_module:
title: 'Personal space' title: 'Personal space'
create_btn_text: 'Create' create_btn_text: 'Create'
......
...@@ -281,6 +281,73 @@ home_module: ...@@ -281,6 +281,73 @@ home_module:
interrupt_dialogue_prompt: '当前回复尚未完成,是否确定打断发起新会话?' interrupt_dialogue_prompt: '当前回复尚未完成,是否确定打断发起新会话?'
interrupt_the_conversation_and_apply_the_history_prompt: '当前回复尚未完成,是否确定打断对话应用其它记录?' interrupt_the_conversation_and_apply_the_history_prompt: '当前回复尚未完成,是否确定打断对话应用其它记录?'
rich_text_module:
placeholder: '发送消息、输入{symbol}选择工具'
template: '模板'
message_editor: '消息编辑器'
writing_placeholder: '输入你要撰写的主题'
template_list:
work: '工作'
business_marketing: '商务营销'
social_media_copywriting: '社媒文案'
literature_and_art: '文学艺术'
work_list:
t_title_1: '周报'
t_doc_1: '总结一周的工作成果'
t_template_1: '我的职业是[[输入职业]],帮我写一份本周的工作周报,内容包含[[输入本周工作内容]],下周计划[[输入下周工作计划]]。'
t_title_2: '日报'
t_doc_2: '每日工作的总结回顾'
t_template_2: '我的职业是[[输入职业]],帮我写一份今天的工作日报,内容包含[[输入今日工作内容]],明日计划[[输入明日工作计划]]。'
t_title_3: '月报'
t_doc_3: '整月工作的清晰回顾'
t_template_3: '我的职业是[[输入职业]],帮我写一份本月的工作月报,内容包含[[输入本月工作内容]],下月计划[[输入下月工作计划]]。'
t_title_4: '邮件'
t_doc_4: '高效专业撰写邮件'
t_template_4: '帮我写一封发给[[输入发送对象]]的邮件,内容是[[输入主题]]。'
t_title_5: '会议总结'
t_doc_5: '会议内容清晰明了'
t_template_5: '帮我写一个讨论[[输入会议内容]]的会议总结,语气需要正式,内容要包含会议的主要讨论内容、结论,使用Markdown格式。'
business_marketing_list:
t_title_1: '活动策划'
t_doc_1: '高效定制各类策划方案'
t_template_1: '我是一名[[活动策划师]],帮我写一个[[音乐交流活动]]的方案,内容包含但不限于策划主题、策划目的、详细计划、所需资源、策划预算、风险应对、效果评估。'
t_title_2: '市场调研'
t_doc_2: '精准洞察市场'
t_template_2: '我是一名市场调研专家 ,帮我写一个关于[[主题]]的市场调研报告,需要包含调研背景与目的、研究方法、市场分析、消费者分析、数据分析与发现、结论与建议等。'
t_title_3: '营销slogan'
t_doc_3: '吸睛创意广告语'
t_template_3: '帮我写5个面向[[输入目标人群]]宣传[[输入品牌商品]]的广告营销slogan,简洁明了,富有创意。'
social_media_copywriting_list:
t_title_1: '小红书'
t_doc_1: '打造小红书吸睛内容'
t_template_1: '生成一篇关于[[主题]]的小红书文案。内容要有标题和正文。标题需为小红书风格,正文适当使用 emoji丰富文案。'
t_title_2: '微博'
t_doc_2: '快速创作微博文案'
t_template_2: '帮我生成一个关于[[主题]]的微博文案'
t_title_3: '评价'
t_doc_3: '创造个性化评语'
t_template_3: '我想写一段关于[[输入评价主题:如书籍评价]]的好评,发布在[[输入平台]]上,字数不少于[[100]]字。'
literature_and_art_list:
t_title_1: '诗歌'
t_doc_1: '创作优美动人的诗篇'
t_template_1: '你是一个诗人,帮我创作一首关于[[输入主题]]的诗歌,使用[[输入格式:如四言律诗]]的格式。'
t_title_2: '故事'
t_doc_2: '编写有趣吸睛的故事'
t_template_2: '帮我创作一篇关于[[输入主题]]的故事,要有标题和正文,情节要跌宕起伏,引人入胜,字数在800字左右。'
personal_space_module: personal_space_module:
title: '个人空间' title: '个人空间'
create_btn_text: '新建' create_btn_text: '新建'
......
...@@ -281,6 +281,73 @@ home_module: ...@@ -281,6 +281,73 @@ home_module:
history_record_item_apply_tip: '是否確定應用此會話記錄?' history_record_item_apply_tip: '是否確定應用此會話記錄?'
historical_record: '歷史記錄' historical_record: '歷史記錄'
rich_text_module:
placeholder: '發送消息、輸入{symbol}選擇工具'
template: '模板'
message_editor: '消息編輯器'
writing_placeholder: '輸入你要撰寫的主題'
template_list:
work: '工作'
business_marketing: '商務營銷'
social_media_copywriting: '社媒文案'
literature_and_art: '文學藝術'
work_list:
t_title_1: '周報'
t_doc_1: '總結一周的工作成果'
t_template_1: '我的職業是[[輸入職業]],幫我寫一份本周的工作周報,內容包含[[輸入本周工作內容]],下周計劃[[輸入下周工作計劃]]。'
t_title_2: '日報'
t_doc_2: '每日工作的總結回顧'
t_template_2: '我的職業是[[輸入職業]],幫我寫一份今天的工作日報,內容包含[[輸入今日工作內容]],明日計劃[[輸入明日工作計劃]]。'
t_title_3: '月報'
t_doc_3: '整月工作的清晰回顧'
t_template_3: '我的職業是[[輸入職業]],幫我寫一份本月的工作月報,內容包含[[輸入本月工作內容]],下月計劃[[輸入下月工作計劃]]。'
t_title_4: '郵件'
t_doc_4: '高效專業撰寫郵件'
t_template_4: '幫我寫一封發給[[輸入發送對象]]的郵件,內容是[[輸入主題]]。'
t_title_5: '會議總結'
t_doc_5: '會議內容清晰明了'
t_template_5: '帮我写一个讨论[[输入会议内容]]的会议总结,语气需要正式,内容要包含会议的主要讨论内容、结论,使用Markdown格式。'
business_marketing_list:
t_title_1: '活動策劃'
t_doc_1: '高效定製各類策劃方案'
t_template_1: '我是一名[[活動策劃師]],幫我寫一個[[音樂交流活動]]的方案,內容包含但不限於策劃主題、策劃目的、詳細計劃、所需資源、策劃預算、風險應對、效果評估。'
t_title_2: '市場調研'
t_doc_2: '精準洞察市場'
t_template_2: '我是一名市場調研專家 ,幫我寫一個關於[[主題]]的市場調研報告,需要包含調研背景與目的、研究方法、市場分析、消費者分析、數據分析與發現、結論與建議等。'
t_title_3: '營銷slogan'
t_doc_3: '吸睛創意廣告語'
t_template_3: '幫我寫5個面向[[輸入目標人群]]宣傳[[輸入品牌商品]]的廣告營銷slogan,簡潔明了,富有創意。'
social_media_copywriting_list:
t_title_1: '小紅書'
t_doc_1: '打造小紅書吸睛內容'
t_template_1: '生成一篇關於[[主題]]的小紅書文案。內容要有標題和正文。標題需為小紅書風格,正文適當使用 emoji豐富文案。'
t_title_2: '微博'
t_doc_2: '快速創作微博文案'
t_template_2: '幫我生成一個關於[[主題]]的微博文案'
t_title_3: '評價'
t_doc_3: '創造個性化評語'
t_template_3: '我想寫一段關於[[輸入評價主題:如書籍評價]]的好評,發佈在[[輸入平臺]]上,字數不少於[[100]]字。'
literature_and_art_list:
t_title_1: '詩歌'
t_doc_1: '創作優美動人的詩篇'
t_template_1: '你是一個詩人,幫我創作一首關於[[輸入主題]]的詩歌,使用[[輸入格式:如四言律詩]]的格式。'
t_title_2: '故事'
t_doc_2: '編寫有趣吸睛的故事'
t_template_2: '幫我創作一篇關於[[輸入主題]]的故事,要有標題和正文,情節要跌宕起伏,引人入勝,字數在800字左右。'
personal_space_module: personal_space_module:
title: '個人空間' title: '個人空間'
create_btn_text: '新建' create_btn_text: '新建'
......
...@@ -2,7 +2,6 @@ ...@@ -2,7 +2,6 @@
import { readonly, ref, useTemplateRef, watch } from 'vue' import { readonly, ref, useTemplateRef, watch } from 'vue'
import { templateMenuConfigFactory } from '../data/template-menu' import { templateMenuConfigFactory } from '../data/template-menu'
import { useFocus } from '@vueuse/core' import { useFocus } from '@vueuse/core'
import { debounce } from 'lodash-es'
import type { TemplateMenuConfig } from '@/views/home/components/rich-text-input-box/data/template-menu' import type { TemplateMenuConfig } from '@/views/home/components/rich-text-input-box/data/template-menu'
const showTemplateMenu = defineModel<boolean>('showTemplateMenu', { default: false }) const showTemplateMenu = defineModel<boolean>('showTemplateMenu', { default: false })
...@@ -17,14 +16,6 @@ const { focused: templateMenuContainerFocus } = useFocus(templateMenuContainerRe ...@@ -17,14 +16,6 @@ const { focused: templateMenuContainerFocus } = useFocus(templateMenuContainerRe
const templateMenuConfig = readonly<TemplateMenuConfig[]>(templateMenuConfigFactory()) const templateMenuConfig = readonly<TemplateMenuConfig[]>(templateMenuConfigFactory())
const currentTemplateCategory = ref<string>('Work') const currentTemplateCategory = ref<string>('Work')
const templateMenuClose = debounce(
() => {
showTemplateMenu.value && (showTemplateMenu.value = false)
},
100,
{ leading: true, trailing: false },
)
watch( watch(
() => showTemplateMenu.value, () => showTemplateMenu.value,
(isShow) => { (isShow) => {
...@@ -40,7 +31,7 @@ watch( ...@@ -40,7 +31,7 @@ watch(
() => templateMenuContainerFocus.value, () => templateMenuContainerFocus.value,
(isFocus) => { (isFocus) => {
if (!isFocus) { if (!isFocus) {
templateMenuClose() showTemplateMenu.value && (showTemplateMenu.value = false)
} }
}, },
) )
...@@ -80,6 +71,7 @@ function handleTemplateSelect(templateItem: Readonly<TemplateMenuConfig['templat ...@@ -80,6 +71,7 @@ function handleTemplateSelect(templateItem: Readonly<TemplateMenuConfig['templat
@click="handleTemplateSelect(templateItem)" @click="handleTemplateSelect(templateItem)"
> >
<div class="flex items-center"> <div class="flex items-center">
<!-- <span class="size-[20px]"></span> -->
<span class="flex-center inline-flex rounded-[4px] bg-[#8e83f1] px-[4px]"> <span class="flex-center inline-flex rounded-[4px] bg-[#8e83f1] px-[4px]">
<i class="iconfont text-[12px] text-white" :class="{ [`${templateItem.icon}`]: true }"></i> <i class="iconfont text-[12px] text-white" :class="{ [`${templateItem.icon}`]: true }"></i>
</span> </span>
......
import { useI18n } from 'vue-i18n'
export interface TemplateMenuConfig { export interface TemplateMenuConfig {
category: string category: string
title: string title: string
...@@ -10,116 +12,111 @@ export interface TemplateMenuConfig { ...@@ -10,116 +12,111 @@ export interface TemplateMenuConfig {
} }
export function templateMenuConfigFactory(): TemplateMenuConfig[] { export function templateMenuConfigFactory(): TemplateMenuConfig[] {
const { t } = useI18n()
return [ return [
{ {
category: 'Work', category: 'Work',
title: '工作', title: t('home_module.rich_text_module.template_list.work'),
templateList: [ templateList: [
{ {
title: '周报', title: t('home_module.rich_text_module.template_list.work_list.t_title_1'),
icon: 'icon-yingpingmoban', icon: 'icon-yingpingmoban',
doc: '总结一周的工作成果', doc: t('home_module.rich_text_module.template_list.work_list.t_doc_1'),
template: template: t('home_module.rich_text_module.template_list.work_list.t_template_1'),
'我的职业是【输入职业】,帮我写一份本周的工作周报,内容包含【输入本周工作内容】,下周计划【输入下周工作计划】。',
}, },
{ {
title: '日报', title: t('home_module.rich_text_module.template_list.work_list.t_title_2'),
icon: 'icon-yingpingmoban', icon: 'icon-yingpingmoban',
doc: '每日工作的总结回顾', doc: t('home_module.rich_text_module.template_list.work_list.t_doc_2'),
template: template: t('home_module.rich_text_module.template_list.work_list.t_template_2'),
'我的职业是【输入职业】,帮我写一份今天的工作日报,内容包含【输入今日工作内容】,明日计划【输入明日工作计划】。',
}, },
{ {
title: '月报', title: t('home_module.rich_text_module.template_list.work_list.t_title_3'),
icon: 'icon-yingpingmoban', icon: 'icon-yingpingmoban',
doc: '整月工作的清晰回顾', doc: t('home_module.rich_text_module.template_list.work_list.t_doc_3'),
template: template: t('home_module.rich_text_module.template_list.work_list.t_template_3'),
'我的职业是【输入职业】,帮我写一份本月的工作月报,内容包含【输入本月工作内容】,下月计划【输入下月工作计划】。',
}, },
{ {
title: '邮件', title: t('home_module.rich_text_module.template_list.work_list.t_title_4'),
icon: 'icon-yingpingmoban', icon: 'icon-yingpingmoban',
doc: '高效专业撰写邮件', doc: t('home_module.rich_text_module.template_list.work_list.t_doc_4'),
template: '帮我写一封发给【输入发送对象】的邮件,内容是【输入主题】。', template: t('home_module.rich_text_module.template_list.work_list.t_template_4'),
}, },
{ {
title: '会议总结', title: t('home_module.rich_text_module.template_list.work_list.t_title_5'),
icon: 'icon-yingpingmoban', icon: 'icon-yingpingmoban',
doc: '会议内容清晰明了', doc: t('home_module.rich_text_module.template_list.work_list.t_doc_5'),
template: template: t('home_module.rich_text_module.template_list.work_list.t_template_5'),
'帮我写一个讨论【输入会议内容】的会议总结,语气需要正式,内容要包含会议的主要讨论内容、结论,使用Markdown格式。',
}, },
], ],
}, },
{ {
category: 'BusinessMarketing', category: 'BusinessMarketing',
title: '商务营销', title: t('home_module.rich_text_module.template_list.business_marketing'),
templateList: [ templateList: [
{ {
title: '活动策划', title: t('home_module.rich_text_module.template_list.business_marketing_list.t_title_1'),
icon: 'icon-yingpingmoban', icon: 'icon-yingpingmoban',
doc: '高效定制各类策划方案', doc: t('home_module.rich_text_module.template_list.business_marketing_list.t_doc_1'),
template: template: t('home_module.rich_text_module.template_list.business_marketing_list.t_template_1'),
'我是一名【活动策划师】,帮我写一个【音乐交流活动】的方案,内容包含但不限于策划主题、策划目的、详细计划、所需资源、策划预算、风险应对、效果评估。',
}, },
{ {
title: '市场调研', title: t('home_module.rich_text_module.template_list.business_marketing_list.t_title_2'),
icon: 'icon-yingpingmoban', icon: 'icon-yingpingmoban',
doc: '精准洞察市场', doc: t('home_module.rich_text_module.template_list.business_marketing_list.t_doc_2'),
template: template: t('home_module.rich_text_module.template_list.business_marketing_list.t_template_2'),
'我是一名市场调研专家 ,帮我写一个关于【主题】的市场调研报告,需要包含调研背景与目的、研究方法、市场分析、消费者分析、数据分析与发现、结论与建议等。',
}, },
{ {
title: '营销slogan', title: t('home_module.rich_text_module.template_list.business_marketing_list.t_title_3'),
icon: 'icon-yingpingmoban', icon: 'icon-yingpingmoban',
doc: '吸睛创意广告语', doc: t('home_module.rich_text_module.template_list.business_marketing_list.t_doc_3'),
template: '帮我写5个面向【输入目标人群】宣传【输入品牌商品】的广告营销slogan,简洁明了,富有创意。', template: t('home_module.rich_text_module.template_list.business_marketing_list.t_template_3'),
}, },
], ],
}, },
{ {
category: 'SocialMediaCopywriting', category: 'SocialMediaCopywriting',
title: '社媒文案', title: t('home_module.rich_text_module.template_list.social_media_copywriting'),
templateList: [ templateList: [
{ {
title: '小红书', title: t('home_module.rich_text_module.template_list.social_media_copywriting_list.t_title_1'),
icon: 'icon-yingpingmoban', icon: 'icon-yingpingmoban',
doc: '打造小红书吸睛内容', doc: t('home_module.rich_text_module.template_list.social_media_copywriting_list.t_doc_1'),
template: template: t('home_module.rich_text_module.template_list.social_media_copywriting_list.t_template_1'),
'生成一篇关于【主题】的小红书文案。内容要有标题和正文。标题需为小红书风格,正文适当使用 emoji丰富文案。',
}, },
{ {
title: '微博', title: t('home_module.rich_text_module.template_list.social_media_copywriting_list.t_title_2'),
icon: 'icon-yingpingmoban', icon: 'icon-yingpingmoban',
doc: '快速创作微博文案', doc: t('home_module.rich_text_module.template_list.social_media_copywriting_list.t_doc_2'),
template: '帮我生成一个关于【主题】的微博文案', template: t('home_module.rich_text_module.template_list.social_media_copywriting_list.t_template_2'),
}, },
{ {
title: '评价', title: t('home_module.rich_text_module.template_list.social_media_copywriting_list.t_title_3'),
icon: 'icon-yingpingmoban', icon: 'icon-yingpingmoban',
doc: '创造个性化评语', doc: t('home_module.rich_text_module.template_list.social_media_copywriting_list.t_doc_3'),
template: '我想写一段关于【输入评价主题:如书籍评价】的好评,发布在【输入平台】上,字数不少于【100】字。', template: t('home_module.rich_text_module.template_list.social_media_copywriting_list.t_template_3'),
}, },
], ],
}, },
{ {
category: 'LiteratureAndArt', category: 'LiteratureAndArt',
title: '文学艺术', title: t('home_module.rich_text_module.template_list.literature_and_art'),
templateList: [ templateList: [
{ {
title: '诗歌', title: t('home_module.rich_text_module.template_list.literature_and_art_list.t_title_1'),
icon: 'icon-yingpingmoban', icon: 'icon-yingpingmoban',
doc: '创作优美动人的诗篇', doc: t('home_module.rich_text_module.template_list.literature_and_art_list.t_doc_1'),
template: '你是一个诗人,帮我创作一首关于【输入主题】的诗歌,使用【输入格式:如四言律诗】的格式。', template: t('home_module.rich_text_module.template_list.literature_and_art_list.t_template_1'),
}, },
{ {
title: '故事', title: t('home_module.rich_text_module.template_list.literature_and_art_list.t_title_2'),
icon: 'icon-yingpingmoban', icon: 'icon-yingpingmoban',
doc: '编写有趣吸睛的故事', doc: t('home_module.rich_text_module.template_list.literature_and_art_list.t_doc_2'),
template: '帮我创作一篇关于【输入主题】的故事,要有标题和正文,情节要跌宕起伏,引人入胜,字数在800字左右。', template: t('home_module.rich_text_module.template_list.literature_and_art_list.t_template_2'),
}, },
// { // {
// title: '', // title: '',
......
...@@ -14,6 +14,7 @@ import type { WorkModeType } from '@/views/home/components/rich-text-input-box/t ...@@ -14,6 +14,7 @@ import type { WorkModeType } from '@/views/home/components/rich-text-input-box/t
import type { UploadImageItem } from '@/composables/useUploadImage' import type { UploadImageItem } from '@/composables/useUploadImage'
import { UploadStatus } from '@/enums/upload-status' import { UploadStatus } from '@/enums/upload-status'
import { CloseSmall } from '@icon-park/vue-next' import { CloseSmall } from '@icon-park/vue-next'
import { useI18n } from 'vue-i18n'
interface Props { interface Props {
isQuestionSubmitBtnDisabled: boolean isQuestionSubmitBtnDisabled: boolean
...@@ -40,12 +41,15 @@ const currentSceneConfig = defineModel<{ ...@@ -40,12 +41,15 @@ const currentSceneConfig = defineModel<{
}) })
const editorModeEnable = defineModel<boolean>('editorModeEnable', { default: false }) const editorModeEnable = defineModel<boolean>('editorModeEnable', { default: false })
const { t } = useI18n()
const quillInst = shallowRef<Quill | null>(null) const quillInst = shallowRef<Quill | null>(null)
const questionContentDraft = ref('') const questionContentDraft = ref('')
const isInputFocus = ref(false) const isInputFocus = ref(false)
const showSceneList = ref(false) const showSceneList = ref(false)
const showTemplateMenu = ref(false) const showTemplateMenu = ref(false)
const clickShowTemplateMenu = ref(false)
const uploadImageInfo = computed(() => { const uploadImageInfo = computed(() => {
const imageInfo = props.uploadImageList[0] const imageInfo = props.uploadImageList[0]
...@@ -68,6 +72,8 @@ watch( ...@@ -68,6 +72,8 @@ watch(
if (newConfig) { if (newConfig) {
emit('workModeSwitch', 'SceneMode') emit('workModeSwitch', 'SceneMode')
initQuill()
nextTick(() => { nextTick(() => {
quillInst.value?.focus() quillInst.value?.focus()
}) })
...@@ -91,6 +97,14 @@ watch( ...@@ -91,6 +97,14 @@ watch(
{ immediate: true }, { immediate: true },
) )
watch(showTemplateMenu, (isShow) => {
if (!isShow) {
setTimeout(() => {
clickShowTemplateMenu.value = false
}, 200)
}
})
watchEffect(() => { watchEffect(() => {
if (quillInst.value) { if (quillInst.value) {
quillInst.value.on('text-change', onQuillTextChange) quillInst.value.on('text-change', onQuillTextChange)
...@@ -102,9 +116,15 @@ onMounted(() => { ...@@ -102,9 +116,15 @@ onMounted(() => {
}) })
function initQuill() { function initQuill() {
const placeholderMap = {
common: t('home_module.rich_text_module.placeholder', { symbol: '@' }),
writing: t('home_module.rich_text_module.writing_placeholder'),
}
quillInst.value = new Quill( quillInst.value = new Quill(
'#rich-text-input-box-editor', '#rich-text-input-box-editor',
getQuillOptions({ getQuillOptions({
placeholder: currentSceneConfig.value?.agentId ? placeholderMap.writing : placeholderMap.common,
keyboardCallback: { keyboardCallback: {
enter: () => { enter: () => {
if (!props.isQuestionSubmitBtnDisabled) { if (!props.isQuestionSubmitBtnDisabled) {
...@@ -122,11 +142,19 @@ function initQuill() { ...@@ -122,11 +142,19 @@ function initQuill() {
} }
function handleShowTemplateMenuSwitch() { function handleShowTemplateMenuSwitch() {
nextTick(() => { // nextTick(() => {
if (!showTemplateMenu.value) { // if (!showTemplateMenu.value) {
showTemplateMenu.value = true // showTemplateMenu.value = true
} // }
}) // })
if (clickShowTemplateMenu.value) {
clickShowTemplateMenu.value = false
return
}
showTemplateMenu.value = true
clickShowTemplateMenu.value = true
} }
function quillContentExtractor(delta: Delta) { function quillContentExtractor(delta: Delta) {
...@@ -244,7 +272,7 @@ function onTemplateConfirm(templateConfig: TemplateMenuConfig['templateList'][0] ...@@ -244,7 +272,7 @@ function onTemplateConfirm(templateConfig: TemplateMenuConfig['templateList'][0]
<i class="iconfont icon-moban1 text-[14px]"></i> <i class="iconfont icon-moban1 text-[14px]"></i>
</button> </button>
</template> </template>
模板 {{ t('home_module.rich_text_module.template') }}
</n-tooltip> </n-tooltip>
<n-tooltip trigger="hover"> <n-tooltip trigger="hover">
...@@ -257,7 +285,7 @@ function onTemplateConfirm(templateConfig: TemplateMenuConfig['templateList'][0] ...@@ -257,7 +285,7 @@ function onTemplateConfirm(templateConfig: TemplateMenuConfig['templateList'][0]
<i class="iconfont icon-wendangbianjiqi1 text-[14px]"></i> <i class="iconfont icon-wendangbianjiqi1 text-[14px]"></i>
</button> </button>
</template> </template>
消息编辑器 {{ t('home_module.rich_text_module.message_editor') }}
</n-tooltip> </n-tooltip>
</div> </div>
</Transition> </Transition>
......
...@@ -2,6 +2,7 @@ import type { QuillOptions } from 'quill' ...@@ -2,6 +2,7 @@ import type { QuillOptions } from 'quill'
import type Quill from 'quill' import type Quill from 'quill'
interface ConfigInterface { interface ConfigInterface {
placeholder: string
keyboardCallback: { keyboardCallback: {
enter?: (quillInst?: Quill, range?: any, context?: any) => void enter?: (quillInst?: Quill, range?: any, context?: any) => void
at?: (quillInst?: Quill, range?: any, context?: any) => void at?: (quillInst?: Quill, range?: any, context?: any) => void
...@@ -10,7 +11,7 @@ interface ConfigInterface { ...@@ -10,7 +11,7 @@ interface ConfigInterface {
export function getQuillOptions(config: ConfigInterface): QuillOptions { export function getQuillOptions(config: ConfigInterface): QuillOptions {
return { return {
placeholder: '发送信息、输入@选择工具', placeholder: config.placeholder,
modules: { modules: {
keyboard: { keyboard: {
bindings: { bindings: {
......
...@@ -6,7 +6,7 @@ interface Segment { ...@@ -6,7 +6,7 @@ interface Segment {
} }
export default function textStructureExtractor(str: string): Segment[] { export default function textStructureExtractor(str: string): Segment[] {
const segments = str.split(/(.*?)/g) const segments = str.split(/\[\[(.*?)\]\]/g)
const result: Segment[] = [] const result: Segment[] = []
segments.forEach((text, index) => { segments.forEach((text, index) => {
......
...@@ -290,6 +290,84 @@ declare namespace I18n { ...@@ -290,6 +290,84 @@ declare namespace I18n {
historical_record: string historical_record: string
interrupt_dialogue_prompt: string interrupt_dialogue_prompt: string
interrupt_the_conversation_and_apply_the_history_prompt: string interrupt_the_conversation_and_apply_the_history_prompt: string
rich_text_module: {
placeholder: string
template: string
message_editor: string
writing_placeholder: string
template_list: {
work: string
business_marketing: string
social_media_copywriting: string
literature_and_art: string
work_list: {
t_title_1: string
t_doc_1: string
t_template_1: string
t_title_2: string
t_doc_2: string
t_template_2: string
t_title_3: string
t_doc_3: string
t_template_3: string
t_title_4: string
t_doc_4: string
t_template_4: string
t_title_5: string
t_doc_5: string
t_template_5: string
}
business_marketing_list: {
t_title_1: string
t_doc_1: string
t_template_1: string
t_title_2: string
t_doc_2: string
t_template_2: string
t_title_3: string
t_doc_3: string
t_template_3: string
}
social_media_copywriting_list: {
t_title_1: string
t_doc_1: string
t_template_1: string
t_title_2: string
t_doc_2: string
t_template_2: string
t_title_3: string
t_doc_3: string
t_template_3: string
}
literature_and_art_list: {
t_title_1: string
t_doc_1: string
t_template_1: string
t_title_2: string
t_doc_2: string
t_template_2: string
t_title_3: string
t_doc_3: string
t_template_3: string
}
}
}
} }
personal_space_module: { personal_space_module: {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment