Browse Source

add:AI写作

master
prr 7 months ago
parent
commit
407a52a3b6
  1. 4
      frontend/src/components/window/IframeFile.vue
  2. 18
      packages/word/index.html
  3. 2
      packages/word/src/editor/core/command/Command.ts
  4. 8
      packages/word/src/editor/core/command/CommandAdapt.ts
  5. 5
      packages/word/src/editor/dataset/constant/AIResult.ts
  6. 33
      packages/word/src/main.ts
  7. 11
      packages/word/src/plugins/floatingToolbar/index.ts

4
frontend/src/components/window/IframeFile.vue

@ -188,7 +188,7 @@ const eventHandler = async (e: MessageEvent) => {
} }
else if (eventData.type == 'aiCreater') { else if (eventData.type == 'aiCreater') {
console.log(eventData) // console.log(eventData)
let postData:any = {} let postData:any = {}
if(eventData.data){ if(eventData.data){
postData.content = eventData.data postData.content = eventData.data
@ -199,12 +199,14 @@ const eventHandler = async (e: MessageEvent) => {
if(eventData.category){ if(eventData.category){
postData.category = eventData.category postData.category = eventData.category
} }
// AI // AI
const res = await askAi(postData, eventData.action); const res = await askAi(postData, eventData.action);
storeRef.value?.contentWindow?.postMessage( storeRef.value?.contentWindow?.postMessage(
{ {
type: 'aiReciver', type: 'aiReciver',
data: res, data: res,
action: eventData.action
}, },
"*" "*"
); );

18
packages/word/index.html

@ -377,23 +377,7 @@
<textarea name="" id="outlineText">大纲</textarea> <textarea name="" id="outlineText">大纲</textarea>
</div> </div>
<div id="articleView" class="ai-content-box hide"> <div id="articleView" class="ai-content-box hide">
<textarea name="articleText" id="articleText"> <textarea name="articleText" id="articleText"> 请先点击生成文章按钮</textarea>
将进酒
作者:李白
  君不见,黄河之水天上来,奔流到海不复回。
  君不见,高堂明镜悲白发,朝如青丝暮成雪!
  人生得意须尽欢,莫使金樽空对月。
  天生我材必有用,千金散尽还复来。
  烹羊宰牛且为乐,会须一饮三百杯。
  岑夫子,丹丘生,将进酒,杯莫停。
  与君歌一曲,请君为我倾耳听。
  钟鼓馔玉不足贵,但愿长醉不复醒。
  古来圣贤皆寂寞,惟有饮者留其名。
  陈王昔时宴平乐,斗酒十千恣欢谑。
  主人何为言少钱,径须沽取对君酌。
  五花马、千金裘,呼儿将出换美酒,与尔同销万古愁!
</textarea>
</div> </div>
</div> </div>
</div> </div>

2
packages/word/src/editor/core/command/Command.ts

@ -28,7 +28,6 @@ export class Command {
public executeStrikeout: CommandAdapt['strikeout'] public executeStrikeout: CommandAdapt['strikeout']
public executeSuperscript: CommandAdapt['superscript'] public executeSuperscript: CommandAdapt['superscript']
public executeSubscript: CommandAdapt['subscript'] public executeSubscript: CommandAdapt['subscript']
public excuteAiResult: CommandAdapt['aiResult']
public executeAiEdit: CommandAdapt['aiEdit'] public executeAiEdit: CommandAdapt['aiEdit']
public executeAiArticle: CommandAdapt['aiArticle'] public executeAiArticle: CommandAdapt['aiArticle']
public executeColor: CommandAdapt['color'] public executeColor: CommandAdapt['color']
@ -155,7 +154,6 @@ export class Command {
this.executeStrikeout = adapt.strikeout.bind(adapt) this.executeStrikeout = adapt.strikeout.bind(adapt)
this.executeSuperscript = adapt.superscript.bind(adapt) this.executeSuperscript = adapt.superscript.bind(adapt)
this.executeSubscript = adapt.subscript.bind(adapt) this.executeSubscript = adapt.subscript.bind(adapt)
this.excuteAiResult = adapt.aiResult.bind(adapt)
this.executeAiEdit = adapt.aiEdit.bind(adapt) this.executeAiEdit = adapt.aiEdit.bind(adapt)
this.executeAiArticle = adapt.aiArticle.bind(adapt) this.executeAiArticle = adapt.aiArticle.bind(adapt)
this.executeColor = adapt.color.bind(adapt) this.executeColor = adapt.color.bind(adapt)

8
packages/word/src/editor/core/command/CommandAdapt.ts

@ -635,10 +635,6 @@ export class CommandAdapt {
}) })
this.draw.render({ isSetCursor: false }) this.draw.render({ isSetCursor: false })
} }
public aiResult(result?: string) {
result ? (this.aiContent = result) : ''
return this.aiContent
}
public aiArticle(payload: string) { public aiArticle(payload: string) {
this.selectAll() this.selectAll()
const isDisabled = this.draw.isReadonly() || this.draw.isDisabled() const isDisabled = this.draw.isReadonly() || this.draw.isDisabled()
@ -678,8 +674,6 @@ export class CommandAdapt {
selection.forEach(el => { selection.forEach(el => {
content += el.value content += el.value
}) })
// const eventBus = this.draw.getEventBus()
this.search(content) this.search(content)
if (operate && content) { if (operate && content) {
window.parent.postMessage( window.parent.postMessage(
@ -1218,6 +1212,8 @@ export class CommandAdapt {
if(aiArticle && aiArticle == true) { if(aiArticle && aiArticle == true) {
if (!payload) return if (!payload) return
} else { } else {
// console.log('zero:', new RegExp(`${ZERO}`, 'g').test(payload))
if (!payload || new RegExp(`${ZERO}`, 'g').test(payload)) return if (!payload || new RegExp(`${ZERO}`, 'g').test(payload)) return
} }
// if (!payload || (isZero && aiArticle)) return // if (!payload || (isZero && aiArticle)) return

5
packages/word/src/editor/dataset/constant/AIResult.ts

@ -0,0 +1,5 @@
export const AiResult = {
aiContent: '',
aiArticle: '',
aiOutline: ''
}

33
packages/word/src/main.ts

@ -30,6 +30,7 @@ import barcode2dPlugin from "./plugins/barcode2d"
import floatingToolbarPlugin from "./plugins/floatingToolbar" import floatingToolbarPlugin from "./plugins/floatingToolbar"
import excelPlugin from "./plugins/excel" import excelPlugin from "./plugins/excel"
import docxPlugin from './plugins/docx' import docxPlugin from './plugins/docx'
import { AiResult } from './editor/dataset/constant/AIResult'
window.onload = function () { window.onload = function () {
const isApple = const isApple =
typeof navigator !== 'undefined' && /Mac OS X/.test(navigator.userAgent) typeof navigator !== 'undefined' && /Mac OS X/.test(navigator.userAgent)
@ -1149,8 +1150,7 @@ window.onload = function () {
const articleTextarea = document.querySelector<HTMLTextAreaElement>('#articleText')! const articleTextarea = document.querySelector<HTMLTextAreaElement>('#articleText')!
aiEditDom.title = `ai写作` aiEditDom.title = `ai写作`
aiEditDom.onclick = function () { aiEditDom.onclick = function () {
console.log('ai-edit') // instance.command.executeAiEdit('')
instance.command.executeAiEdit('')
aiMenuBox.classList.contains('hide') ? aiMenuBox.classList.remove('hide') : aiMenuBox.classList.add('hide') aiMenuBox.classList.contains('hide') ? aiMenuBox.classList.remove('hide') : aiMenuBox.classList.add('hide')
} }
@ -1160,8 +1160,8 @@ window.onload = function () {
aiOutlineDom?.classList.remove('hide') aiOutlineDom?.classList.remove('hide')
aiContentDom?.classList.add('hide') aiContentDom?.classList.add('hide')
switchView('outline') switchView('outline')
articleTextarea.textContent = '' articleTextarea.value = ''
outlineTextarea.textContent = '' outlineTextarea.value = ''
} }
aiMenuBoxClose.onclick = function () { aiMenuBoxClose.onclick = function () {
initAiDialog() initAiDialog()
@ -1171,7 +1171,6 @@ window.onload = function () {
function () { function () {
const title = articleTitle.value const title = articleTitle.value
const category = articleType.value const category = articleType.value
//console.log('类型:',title, category);
if (title == '' || category == '') { if (title == '' || category == '') {
// alert() // alert()
@ -1192,7 +1191,9 @@ window.onload = function () {
}, },
'*' '*'
) )
outlineTextarea.textContent = instance.command.excuteAiResult() outlineTextarea.value = AiResult.aiOutline
console.log('结果:', AiResult);
aiOutlineDom?.classList.add('hide') aiOutlineDom?.classList.add('hide')
aiContentDom?.classList.remove('hide') aiContentDom?.classList.remove('hide')
aiMenuBox.classList.add('add-height') aiMenuBox.classList.add('add-height')
@ -1232,17 +1233,17 @@ window.onload = function () {
type: 'aiCreater', type: 'aiCreater',
data: { data: {
title: articleTitle.value, title: articleTitle.value,
outline: outlineTextarea.textContent outline: outlineTextarea.value
}, },
action: 'creation_builder' action: 'creation_builder'
}, },
'*' '*'
) )
articleTextarea.textContent = instance.command.excuteAiResult() articleTextarea.value = AiResult.aiArticle
} }
//插入文章 //插入文章
aiInertBtn.onclick = function () { aiInertBtn.onclick = function () {
const text = articleTextarea.textContent || '' const text = articleTextarea.value || ''
instance.command.executeAiArticle(text) instance.command.executeAiArticle(text)
initAiDialog() initAiDialog()
} }
@ -2159,13 +2160,19 @@ window.onload = function () {
arrayBuffer: buffer, arrayBuffer: buffer,
}); });
} else if (eventData.type === 'aiReciver') { } else if (eventData.type == 'aiReciver') {
// const buffer = base64ToArrayBuffer(eventData.data) console.log('接收到来自伏组件数据:', eventData.data);
//console.log('接收到来自伏组件数据:', eventData.data); if (eventData.action == 'creation_leader') {
instance.command.excuteAiResult(eventData.data) AiResult.aiOutline = eventData.data
} else if (eventData.action == 'creation_builder') {
AiResult.aiArticle = eventData.data
} else {
AiResult.aiContent = eventData.data
}
} }
} }
//window.addEventListener('load', () => { //window.addEventListener('load', () => {
window.parent.postMessage({ type: 'initSuccess' }, '*') window.parent.postMessage({ type: 'initSuccess' }, '*')
window.addEventListener('message', eventHandler) window.addEventListener('message', eventHandler)

11
packages/word/src/plugins/floatingToolbar/index.ts

@ -6,6 +6,7 @@ import { ToolbarType } from './enum'
import { IToolbarRegister } from './interface' import { IToolbarRegister } from './interface'
import { PLUGIN_PREFIX } from './constant' import { PLUGIN_PREFIX } from './constant'
import { Svgs } from './icons/Svgs' import { Svgs } from './icons/Svgs'
import { AiResult } from '../../editor/dataset/constant/AIResult'
function createPickerToolbar( function createPickerToolbar(
container: HTMLDivElement, container: HTMLDivElement,
toolbarType: ToolbarType, toolbarType: ToolbarType,
@ -163,24 +164,22 @@ function bindAiPanelEvent(container: HTMLDivElement, editor: Editor) {
let aiContent = editor.command.executeAiEdit(chooseType) let aiContent = editor.command.executeAiEdit(chooseType)
const textarea = container.querySelector<HTMLTextAreaElement>('textarea')! const textarea = container.querySelector<HTMLTextAreaElement>('textarea')!
if (aiContent) { if (aiContent) {
textarea.textContent = aiContent textarea.value = AiResult.aiContent
} }
}) })
}) })
// 替换 // 替换
container.querySelector('#replace')!.addEventListener('click', () => { container.querySelector('#replace')!.addEventListener('click', () => {
const aiResult = editor.command.excuteAiResult() editor.command.executeReplace(AiResult.aiContent)
editor.command.executeReplace(aiResult)
console.log('替换'); console.log('替换');
}) })
// 插入 // 插入
container.querySelector('#insert')!.addEventListener('click', () => { container.querySelector('#insert')!.addEventListener('click', () => {
const aiContent = editor.command.executeAiEdit('') const aiContent = editor.command.executeAiEdit('')
const aiResult = editor.command.excuteAiResult() editor.command.executeReplace(aiContent + AiResult.aiContent)
editor.command.executeReplace(aiContent + aiResult)
editor.command.executeSearch('') editor.command.executeSearch('')
console.log('插入'); console.log('插入:')
}) })
// 舍弃 // 舍弃
container.querySelector('#hide')!.addEventListener('click', () => { container.querySelector('#hide')!.addEventListener('click', () => {

Loading…
Cancel
Save