complete office add-in

This commit is contained in:
ilia 2022-08-27 17:40:09 +03:00
parent 2340e3072b
commit 70fc7c27b4
9 changed files with 140 additions and 23 deletions

16
package-lock.json generated
View File

@ -15,6 +15,7 @@
"es6-promise": "^4.2.8",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-spinners": "^0.13.4",
"regenerator-runtime": "^0.13.7"
},
"devDependencies": {
@ -11504,6 +11505,15 @@
"integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA==",
"dev": true
},
"node_modules/react-spinners": {
"version": "0.13.4",
"resolved": "https://registry.npmjs.org/react-spinners/-/react-spinners-0.13.4.tgz",
"integrity": "sha512-V6IURjYOwomhdngMfuVxBp4utCF6v21sjQ6r4K2JoKl8fwXZp1UeHMBLf+2SU+cts8hAVj9rHOJ8kdT5UqqaJw==",
"peerDependencies": {
"react": "^16.0.0 || ^17.0.0 || ^18.0.0",
"react-dom": "^16.0.0 || ^17.0.0 || ^18.0.0"
}
},
"node_modules/read-cmd-shim": {
"version": "3.0.1",
"resolved": "https://registry.npmjs.org/read-cmd-shim/-/read-cmd-shim-3.0.1.tgz",
@ -23232,6 +23242,12 @@
"integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA==",
"dev": true
},
"react-spinners": {
"version": "0.13.4",
"resolved": "https://registry.npmjs.org/react-spinners/-/react-spinners-0.13.4.tgz",
"integrity": "sha512-V6IURjYOwomhdngMfuVxBp4utCF6v21sjQ6r4K2JoKl8fwXZp1UeHMBLf+2SU+cts8hAVj9rHOJ8kdT5UqqaJw==",
"requires": {}
},
"read-cmd-shim": {
"version": "3.0.1",
"resolved": "https://registry.npmjs.org/read-cmd-shim/-/read-cmd-shim-3.0.1.tgz",

View File

@ -32,6 +32,7 @@
"es6-promise": "^4.2.8",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-spinners": "^0.13.4",
"regenerator-runtime": "^0.13.7"
},
"devDependencies": {

6
src/api/check_state.ts Normal file
View File

@ -0,0 +1,6 @@
import { check_state_url } from "./consts"
import { get } from "./fetch"
export const check_state = async (uuid: string) => {
return await get(check_state_url + uuid);
}

4
src/api/consts.ts Normal file
View File

@ -0,0 +1,4 @@
export const base_url = "https://5bf1-89-223-81-202.eu.ngrok.io/api"
export const update_state_url = "/word/state/"
export const load_docx_text_url = "/word/docx/"
export const check_state_url = "word/state/"

10
src/api/fetch.ts Normal file
View File

@ -0,0 +1,10 @@
import axios from 'axios'
import { base_url } from './consts';
export const get = async (url: string) => {
return (await axios.get(base_url + url)).data;
}
export const post = async (url: string, data: any) => {
return (await axios.post(base_url+url, data=data)).data;
}

8
src/api/interfaces.ts Normal file
View File

@ -0,0 +1,8 @@
export interface IEUID {
text: string;
uuid: string;
}
export interface IEData extends Record<string, (string|number)[]>{
}

View File

@ -0,0 +1,6 @@
import { load_docx_text_url } from "./consts"
import { post } from "./fetch"
export const load_docx = async (text: string) => {
return await post(load_docx_text_url, {text: JSON.stringify(text)})
}

6
src/api/update_state.ts Normal file
View File

@ -0,0 +1,6 @@
import { update_state_url } from "./consts"
import { get } from "./fetch"
export const update_state = async (uid: string) => {
return await get(update_state_url + uid);
}

View File

@ -1,40 +1,100 @@
import * as React from "react";
import { DefaultButton } from "@fluentui/react";
import { DefaultButton, ProgressIndicator } from "@fluentui/react";
import { load_docx } from "../../api/load_docx_text";
import { IEUID, IEData } from "../../api/interfaces";
import { update_state } from "../../api/update_state";
import ClipLoader from "react-spinners/ClipLoader";
/* global Word, require */
const processFunction = (context: Word.RequestContext, search_text: string, comment_text: string) => {
//if (search_text.includes("\u")) return undefined;
search_text.replace("\u0005", "")
console.log(search_text)
if (search_text.length > 10){
return context.document.body.search(
search_text.slice(0, 255).split("\\").join(""),
{
ignorePunct: true,
ignoreSpace: true
}
).getFirst().insertComment(comment_text);
}
return undefined
}
const App: React.FC = () => {
const [process, onProcessed] = React.useState(false);
const [comments, setComments] = React.useState<Word.Comment[]>([]);
const [uid, setUid] = React.useState("");
const [response_data, setResponseData] = React.useState<IEData>();
React.useEffect(() => {
if (uid.length) {
setTimeout(async () => {
const data: IEData = await update_state(uid);
console.log(data)
setResponseData(data);
}, 2000)
setUid("");
}
if (response_data != undefined) {
Word.run(async (context) => {
var comments = []
const response_data_keys = Object.keys(response_data)
for (var i = 0; i < response_data_keys.length; ++i) {
for (var j = 0; j < response_data[response_data_keys[i]].length; ++j) {
var comm = processFunction(context, response_data[response_data_keys[i]][j][0], response_data_keys[i]);
if (comm != undefined){
comments.push();
}
}
}
setComments(comments)
setResponseData(undefined)
//
})
setResponseData(undefined);
}
})
return (
<div style={{
'display': 'flex',
'justifyContent': 'center',
'alignContent': 'center'
'alignContent': 'center',
'flexDirection': 'column'
}}>
<DefaultButton
onClick={() => {
Word.run(function(context) {
// Insert your code here. For example:
var documentBody = context.document.body;
context.load(documentBody);
return context.sync()
.then(function(){
console.log(documentBody.text);
})
});
Word.run(async (context) => {
Office.context.document.getFileAsync(Office.FileType.Compressed, (file) => {
console.log(file.value);
})
context.document.body.search("2-кратного размера").getFirst().insertComment("fuck you")
})
}}
>
Проверить на ошибки
</DefaultButton>
onClick={() => {
Word.run(function(context) {
// Insert your code here. For example:
var documentBody = context.document.body;
context.load(documentBody);
return context.sync()
.then( async () => {
const data: IEUID = await load_docx(documentBody.text);
console.log(data);
setUid(data.uuid);
})
});
}}
>
Проверить на ошибки
</DefaultButton>
<div style={{
'display': 'flex',
'justifyContent': 'center',
'alignItems': 'center',
'marginTop': 100
}}>
{
response_data === undefined && uid.length ?
<ClipLoader></ClipLoader> : <div></div>
}
</div>
</div>
);
}