Browse Source

add:AI写作

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

18
packages/word/index.html

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

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

@ -28,7 +28,6 @@ export class Command {
public executeStrikeout: CommandAdapt['strikeout']
public executeSuperscript: CommandAdapt['superscript']
public executeSubscript: CommandAdapt['subscript']
public excuteAiResult: CommandAdapt['aiResult']
public executeAiEdit: CommandAdapt['aiEdit']
public executeAiArticle: CommandAdapt['aiArticle']
public executeColor: CommandAdapt['color']
@ -155,7 +154,6 @@ export class Command {
this.executeStrikeout = adapt.strikeout.bind(adapt)
this.executeSuperscript = adapt.superscript.bind(adapt)
this.executeSubscript = adapt.subscript.bind(adapt)
this.excuteAiResult = adapt.aiResult.bind(adapt)
this.executeAiEdit = adapt.aiEdit.bind(adapt)
this.executeAiArticle = adapt.aiArticle.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 })
}
public aiResult(result?: string) {
result ? (this.aiContent = result) : ''
return this.aiContent
}
public aiArticle(payload: string) {
this.selectAll()
const isDisabled = this.draw.isReadonly() || this.draw.isDisabled()
@ -678,8 +674,6 @@ export class CommandAdapt {
selection.forEach(el => {
content += el.value
})
// const eventBus = this.draw.getEventBus()
this.search(content)
if (operate && content) {
window.parent.postMessage(
@ -1218,6 +1212,8 @@ export class CommandAdapt {
if(aiArticle && aiArticle == true) {
if (!payload) return
} else {
// console.log('zero:', new RegExp(`${ZERO}`, 'g').test(payload))
if (!payload || new RegExp(`${ZERO}`, 'g').test(payload)) 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 excelPlugin from "./plugins/excel"
import docxPlugin from './plugins/docx'
import { AiResult } from './editor/dataset/constant/AIResult'
window.onload = function () {
const isApple =
typeof navigator !== 'undefined' && /Mac OS X/.test(navigator.userAgent)
@ -1149,8 +1150,7 @@ window.onload = function () {
const articleTextarea = document.querySelector<HTMLTextAreaElement>('#articleText')!
aiEditDom.title = `ai写作`
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')
}
@ -1160,8 +1160,8 @@ window.onload = function () {
aiOutlineDom?.classList.remove('hide')
aiContentDom?.classList.add('hide')
switchView('outline')
articleTextarea.textContent = ''
outlineTextarea.textContent = ''
articleTextarea.value = ''
outlineTextarea.value = ''
}
aiMenuBoxClose.onclick = function () {
initAiDialog()
@ -1171,7 +1171,6 @@ window.onload = function () {
function () {
const title = articleTitle.value
const category = articleType.value
//console.log('类型:',title, category);
if (title == '' || category == '') {
// alert()
@ -1192,7 +1191,9 @@ window.onload = function () {
},
'*'
)
outlineTextarea.textContent = instance.command.excuteAiResult()
outlineTextarea.value = AiResult.aiOutline
console.log('结果:', AiResult);
aiOutlineDom?.classList.add('hide')
aiContentDom?.classList.remove('hide')
aiMenuBox.classList.add('add-height')
@ -1232,17 +1233,17 @@ window.onload = function () {
type: 'aiCreater',
data: {
title: articleTitle.value,
outline: outlineTextarea.textContent
outline: outlineTextarea.value
},
action: 'creation_builder'
},
'*'
)
articleTextarea.textContent = instance.command.excuteAiResult()
articleTextarea.value = AiResult.aiArticle
}
//插入文章
aiInertBtn.onclick = function () {
const text = articleTextarea.textContent || ''
const text = articleTextarea.value || ''
instance.command.executeAiArticle(text)
initAiDialog()
}
@ -2159,13 +2160,19 @@ window.onload = function () {
arrayBuffer: buffer,
});
} else if (eventData.type === 'aiReciver') {
// const buffer = base64ToArrayBuffer(eventData.data)
//console.log('接收到来自伏组件数据:', eventData.data);
instance.command.excuteAiResult(eventData.data)
} else if (eventData.type == 'aiReciver') {
console.log('接收到来自伏组件数据:', eventData.data);
if (eventData.action == 'creation_leader') {
AiResult.aiOutline = eventData.data
} else if (eventData.action == 'creation_builder') {
AiResult.aiArticle = eventData.data
} else {
AiResult.aiContent = eventData.data
}
}
}
//window.addEventListener('load', () => {
window.parent.postMessage({ type: 'initSuccess' }, '*')
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 { PLUGIN_PREFIX } from './constant'
import { Svgs } from './icons/Svgs'
import { AiResult } from '../../editor/dataset/constant/AIResult'
function createPickerToolbar(
container: HTMLDivElement,
toolbarType: ToolbarType,
@ -163,24 +164,22 @@ function bindAiPanelEvent(container: HTMLDivElement, editor: Editor) {
let aiContent = editor.command.executeAiEdit(chooseType)
const textarea = container.querySelector<HTMLTextAreaElement>('textarea')!
if (aiContent) {
textarea.textContent = aiContent
textarea.value = AiResult.aiContent
}
})
})
// 替换
container.querySelector('#replace')!.addEventListener('click', () => {
const aiResult = editor.command.excuteAiResult()
editor.command.executeReplace(aiResult)
editor.command.executeReplace(AiResult.aiContent)
console.log('替换');
})
// 插入
container.querySelector('#insert')!.addEventListener('click', () => {
const aiContent = editor.command.executeAiEdit('')
const aiResult = editor.command.excuteAiResult()
editor.command.executeReplace(aiContent + aiResult)
editor.command.executeReplace(aiContent + AiResult.aiContent)
editor.command.executeSearch('')
console.log('插入');
console.log('插入:')
})
// 舍弃
container.querySelector('#hide')!.addEventListener('click', () => {

Loading…
Cancel
Save