This commit is contained in:
闫晓茹 2024-06-17 11:40:39 +08:00
parent 4dc9184867
commit 3561f70b13
2 changed files with 691 additions and 685 deletions

View File

@ -1,4 +1,5 @@
<template> <div style="border: 1px solid #ccc">
<template>
<div style="border: 1px solid #ccc">
<Toolbar
style="border-bottom: 1px solid #ccc"
:editor="editor"
@ -51,8 +52,6 @@
:before-close="beforeClose"
class="category-cascader-panel"
>
<!-- 在这里 -->
<el-cascader-panel
:options="fieldoptions"
@ -61,19 +60,18 @@
value: 'termCode',
label: 'termContent',
children: 'children',
checkStrictly: true,
checkStrictly: false,
multiple: true,
emitPath: false,
}"
ref="cascaderAddr"
>
</el-cascader-panel>
<div style="margin: 20px 0">结果预览:</div>
<div style="width: 80%;height: 100%; border: 2px solid #ECEFF7 ;">
<div v-for="(item, index) of add" :key="index" >
<div style="width: 80%; height: 100%; border: 2px solid #eceff7">
<div v-for="(item, index) of add" :key="index">
<!-- <input type="text"> -->
<div >{{ item }}</div>
<div>{{ item }}</div>
<!-- <el-input
type="textarea"
v-model="item[0]"
@ -85,36 +83,36 @@
<el-button @click="fieldclick" type="primary">确定</el-button>
</div>
</el-dialog>
</div>
</div>
</template>
<script>
import {
DomEditor,
IDomEditor,
SlateElement,
SlateDescendant,
SlateTransforms,
SlateEditor,
SlateNode,
DomEditor,
IDomEditor,
SlateElement,
SlateDescendant,
SlateTransforms,
SlateEditor,
SlateNode,
} from "@wangeditor/editor";
import { Editor, Toolbar } from "@wangeditor/editor-for-vue";
import { Boot } from "@wangeditor/editor";
import { h, VNode } from "snabbdom";
import {
labelFieldList,
richTextPictureUrl,
bankLevel,
labelFieldList,
richTextPictureUrl,
bankLevel,
} from "@/api/system/wangEditor.js";
// import menuConf from "./ModalMenu";
import { getToken } from "@/utils/auth";
var that;
export default {
props: ["nodeContent"],
components: { Editor, Toolbar },
name: "wangEditor",
data() {
props: ["nodeContent"],
components: { Editor, Toolbar },
name: "wangEditor",
data() {
return {
isResouceShow: 1,
searchForm: {},
@ -183,9 +181,9 @@ data() {
elist: [],
termContent: "",
};
},
},
methods: {
methods: {
handleChange(e) {
console.log(e, "e");
this.add = [];
@ -200,7 +198,6 @@ methods: {
}
});
},
async handleUpload(file, insertFn) {
@ -212,8 +209,7 @@ methods: {
this.html +=
'<video poster="" controls="true" width="auto" height="auto"><source src="' +
process.env.VUE_APP_BASE_API +
+
'" type="video/mp4"/></video>';
+'" type="video/mp4"/></video>';
},
async uploadFile(form) {
let res = await richTextPictureUrl(form); //
@ -268,16 +264,16 @@ methods: {
fieldclick() {
// divBox js +=
// += divBox
var aaa = document.querySelectorAll('.divBox')
console.log(this.html,'this.html--before');
console.log(aaa,'打印dom')
if(aaa.length!=0){
console.log(this.html,'this.html111');
aaa.remove()
}else{
aaa.innerHTML = ''
this.html += `<p >${this.add}</p>`
console.log(this.html,'this.html2222');
var aaa = document.querySelectorAll(".divBox");
console.log(this.html, "this.html--before");
console.log(aaa, "打印dom");
if (aaa.length != 0) {
console.log(this.html, "this.html111");
aaa.remove();
} else {
aaa.innerHTML = "";
this.html += `<p >${this.add}</p>`;
console.log(this.html, "this.html2222");
}
this.fieldshow = false;
setTimeout(() => {
@ -305,11 +301,10 @@ methods: {
// fieldMark: "",
// fileSpan: "",
// };
this.add=[]
// this.editor.focus();
this.add = [];
this.editor.focus();
++this.isResouceShow;
}, 100);
},
onCreated(editor) {
this.editor = Object.seal(editor);
@ -332,7 +327,7 @@ methods: {
});
bankLevel("3").then((res) => {
console.log(res,'打印res值')
console.log(res, "打印res值");
// res.forEach((e) => {
// e.children.forEach((el) => {
// el.children.forEach((f) => {
@ -344,7 +339,7 @@ methods: {
// });
// });
this.fieldoptions = res;
console.log(this.fieldoptions ,'***')
console.log(this.fieldoptions, "***");
});
},
beforeClose() {
@ -353,123 +348,123 @@ methods: {
this.fieldshow = false;
this.labelshow = false;
},
},
watch: {
},
watch: {
nodeContent(newValue, oldValue) {
console.log(newValue, oldValue);
this.html = newValue;
},
},
mounted() {
},
mounted() {
this.html = this.nodeContent;
},
beforeDestroy() {
},
beforeDestroy() {
const editor = this.editor;
if (editor == null) return;
editor.destroy(); //
},
created() {
},
created() {
that = this;
this.info();
},
},
};
class MyButtonMenu {
// JS
constructor(vueInstance) {
// JS
constructor(vueInstance) {
this.vueInstance = vueInstance;
this.title = "添加画像标签字段";
this.iconSvg =
'<svg t="1711951668796" class="icon" viewBox="0 0 1119 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4490" xmlns:xlink="http://www.w3.org/1999/xlink" width="218.5546875" height="200"><path d="M25.415082 562.922053a25.1989 25.1989 0 0 1-17.745705-43.299519L542.347456 7.392772A25.110172 25.110172 0 1 1 577.040308 43.682738L42.894601 555.9125a25.110172 25.110172 0 0 1-17.479519 7.009553z" p-id="4491"></path><path d="M1094.061411 562.922053a25.110172 25.110172 0 0 1-17.745704-7.009553L542.347456 43.682738A25.110172 25.110172 0 1 1 577.040308 7.392772l534.323165 512.229762a25.1989 25.1989 0 0 1-17.745704 43.299519zM559.738247 1023.955458a380.467906 380.467906 0 0 1-380.024264-380.112992 25.1989 25.1989 0 0 1 50.309073 0 330.070105 330.070105 0 0 0 329.715191 329.80392 25.1989 25.1989 0 1 1 0 50.309072z" p-id="4492"></path><path d="M1009.769315 799.472295H618.3878a25.1989 25.1989 0 0 1 0-50.309072h391.381515a25.1989 25.1989 0 0 1 0 50.309072z" fill="#231815" p-id="4493"></path><path d="M814.122922 996.005974a25.1989 25.1989 0 0 1-25.198901-25.198901V579.869201a25.1989 25.1989 0 1 1 50.309073 0v390.937872a25.1989 25.1989 0 0 1-25.110172 25.198901z" fill="#231815" p-id="4494"></path></svg>';
this.tag = "button";
this.showModal = true;
}
// false
isActive(editor) {
}
// false
isActive(editor) {
return false;
}
// value false
getValue(editor) {
}
// value false
getValue(editor) {
return "";
}
// H1 false
isDisabled(editor) {
}
// H1 false
isDisabled(editor) {
return false;
}
//
exec(editor, value) {
}
//
exec(editor, value) {
this.vueInstance.labelshow = true;
}
}
}
class MyButtonMenutwo {
// JS
constructor(vueInstance) {
// JS
constructor(vueInstance) {
this.vueInstance = vueInstance;
this.title = "添加知识库字段";
this.iconSvg =
'<svg t="1711422779479" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2507" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M831.6 639.6h-63.9v127.9H639.9v63.9h127.8v127.9h63.9V831.4h127.9v-63.9H831.6z" p-id="2508"></path><path d="M564.3 925.2c0-18.5-15-33.6-33.6-33.6H287.3c-86.2 0-156.4-70.2-156.4-156.4V286.9c0-86.2 70.1-156.4 156.4-156.4h448.4c86.2 0 156.4 70.2 156.4 156.4v238.8c0 18.5 15 33.6 33.6 33.6s33.6-15 33.6-33.6V286.9C959.2 163.6 859 63.3 735.7 63.3H287.3C164 63.3 63.7 163.6 63.7 286.8v448.3c0 123.2 100.3 223.5 223.6 223.5h243.4c18.6 0.1 33.6-14.9 33.6-33.4z" p-id="2509"></path></svg>';
this.tag = "button";
this.showModal = true;
}
// false
isActive(editor) {
}
// false
isActive(editor) {
return false;
}
// value false
getValue(editor) {
}
// value false
getValue(editor) {
return "";
}
// H1 false
isDisabled(editor) {
}
// H1 false
isDisabled(editor) {
return false;
}
//
exec(editor, value) {
}
//
exec(editor, value) {
this.vueInstance.fieldshow = true;
}
}
}
const menuConf = {
key: "MyButtonMenu", // menu key
factory() {
key: "MyButtonMenu", // menu key
factory() {
return new MyButtonMenu(that);
},
},
};
const menuConftwo = {
key: "MyButtonMenutwo", // menu key
factory() {
key: "MyButtonMenutwo", // menu key
factory() {
return new MyButtonMenutwo(that);
},
},
};
const module = {
// JS
menus: [menuConf, menuConftwo],
// ...
// JS
menus: [menuConf, menuConftwo],
// ...
};
Boot.registerModule(module);
function withAttachment(editor) {
// JS
const { isInline, isVoid } = editor;
const newEditor = editor;
newEditor.isInline = (elem) => {
// JS
const { isInline, isVoid } = editor;
const newEditor = editor;
newEditor.isInline = (elem) => {
const type = DomEditor.getNodeType(elem);
if (type === "attachment") return true; // type: attachment inline
if (type === "attachmenttwo") return true; // type: attachment inline
return isInline(elem);
};
newEditor.isVoid = (elem) => {
};
newEditor.isVoid = (elem) => {
const type = DomEditor.getNodeType(elem);
if (type === "attachment") return true; // type: attachment void
if (type === "attachmenttwo") return true; // type: attachment void
return isVoid(elem);
};
return newEditor; // newEditor
};
return newEditor; // newEditor
}
Boot.registerPlugin(withAttachment);
function renderAttachment(elem, children, editor) {
// JS
// myResume
const { fileName = "", link = "", fileSpan = "", fieldMark = "" } = elem;
// icon vnode
const iconVnode = h(
// JS
// myResume
const { fileName = "", link = "", fileSpan = "", fieldMark = "" } = elem;
// icon vnode
const iconVnode = h(
// HTML tag
"span",
// HTML
@ -492,8 +487,8 @@ const iconVnode = h(
},
}
// img
);
const nameiconVnode = h(
);
const nameiconVnode = h(
// HTML tag
"span",
// HTML
@ -517,8 +512,8 @@ const nameiconVnode = h(
},
}
// img
);
const spanVnode = h(
);
const spanVnode = h(
// HTML tag
"span",
// HTML
@ -533,8 +528,8 @@ const spanVnode = h(
},
// img
[fileSpan, iconVnode]
);
const nameVnode = h(
);
const nameVnode = h(
// HTML tag
"span",
// HTML
@ -549,9 +544,9 @@ const nameVnode = h(
},
// img
[fileName, nameiconVnode]
);
// vnode
const attachVnode = h(
);
// vnode
const attachVnode = h(
// HTML tag
"span",
// HTML
@ -564,15 +559,15 @@ const attachVnode = h(
},
//
[nameVnode, spanVnode]
);
return attachVnode;
);
return attachVnode;
}
function renderAttachmenttwo(elem, children, editor) {
// JS
// myResume
const { fileName = "", link = "", fileSpan = "", fieldMark = "" } = elem;
// icon vnode
const iconVnode = h(
// JS
// myResume
const { fileName = "", link = "", fileSpan = "", fieldMark = "" } = elem;
// icon vnode
const iconVnode = h(
// HTML tag
"span",
// HTML
@ -595,8 +590,8 @@ const iconVnode = h(
},
}
// img
);
const nameiconVnode = h(
);
const nameiconVnode = h(
// HTML tag
"span",
// HTML
@ -616,13 +611,13 @@ const nameiconVnode = h(
click() {
that.modify = true;
that.fieldshow = true;
this.add=[]
this.add = [];
} /* 其他... */,
},
}
// img
);
const spanVnode = h(
);
const spanVnode = h(
// HTML tag
"span",
// HTML
@ -637,8 +632,8 @@ const spanVnode = h(
},
// img
[fileSpan, iconVnode]
);
const nameVnode = h(
);
const nameVnode = h(
// HTML tag
"span",
// HTML
@ -653,9 +648,9 @@ const nameVnode = h(
},
// img
[fileName, nameiconVnode]
);
// vnode
const attachVnode = h(
);
// vnode
const attachVnode = h(
// HTML tag
"span",
// HTML
@ -668,33 +663,33 @@ const attachVnode = h(
},
//
[nameVnode, spanVnode]
);
return attachVnode;
);
return attachVnode;
}
const renderElemConf = {
type: "attachment", // type
renderElem: renderAttachment,
type: "attachment", // type
renderElem: renderAttachment,
};
const renderElemConftwo = {
type: "attachmenttwo", // type
renderElem: renderAttachmenttwo,
type: "attachmenttwo", // type
renderElem: renderAttachmenttwo,
};
const rendermodule = {
// JS
// menus: [menu1Conf, menu2Conf, menu3Conf], //
// editorPlugin: withBreakAndDelete, //
renderElems: [renderElemConf, renderElemConftwo /* 其他元素... */], // renderElem
// JS
// menus: [menu1Conf, menu2Conf, menu3Conf], //
// editorPlugin: withBreakAndDelete, //
renderElems: [renderElemConf, renderElemConftwo /* 其他元素... */], // renderElem
// ...
// ...
};
Boot.registerModule(rendermodule);
function attachmentToHtml(elem, childrenHtml) {
// JS
//
const { link = "", fileName = "", fileSpan = "", fieldMark = "" } = elem;
// HTML
const html = `<span data-w-e-type="attachment"
// JS
//
const { link = "", fileName = "", fileSpan = "", fieldMark = "" } = elem;
// HTML
const html = `<span data-w-e-type="attachment"
data-w-e-is-void
data-w-e-is-inline
data-link="${link}"
@ -706,14 +701,14 @@ const html = `<span data-w-e-type="attachment"
<span>${fileSpan}</span>
</span>
</span>`;
return html;
return html;
}
function attachmentToHtmltwo(elem, childrenHtml) {
// JS
//
const { link = "", fileName = "", fileSpan = "", fieldMark = "" } = elem;
// HTML
const html = `<span data-w-e-type="attachmenttwo"
// JS
//
const { link = "", fileName = "", fileSpan = "", fieldMark = "" } = elem;
// HTML
const html = `<span data-w-e-type="attachmenttwo"
data-w-e-is-void
data-w-e-is-inline
data-link="${link}"
@ -725,67 +720,67 @@ const html = `<span data-w-e-type="attachmenttwo"
<span>${fileSpan}</span>
</span>
</span>`;
return html;
return html;
}
const elemToHtmlConf = {
type: "attachment", // type
elemToHtml: attachmentToHtml,
type: "attachment", // type
elemToHtml: attachmentToHtml,
};
const elemToHtmlConftwo = {
type: "attachmenttwo", // type
elemToHtml: attachmentToHtmltwo,
type: "attachmenttwo", // type
elemToHtml: attachmentToHtmltwo,
};
const elemToHtmlConfmodule = {
// JS
elemsToHtml: [elemToHtmlConf, elemToHtmlConftwo /* 其他元素... */], // elemToHtml
// JS
elemsToHtml: [elemToHtmlConf, elemToHtmlConftwo /* 其他元素... */], // elemToHtml
};
Boot.registerModule(elemToHtmlConfmodule);
function parseAttachmentHtml(domElem, children, editor) {
// JS
// DOM element
const link = domElem.getAttribute("data-link") || "";
const fileName = domElem.getAttribute("data-fileName") || "";
const fileSpan = domElem.getAttribute("data-fileSpan") || "";
const fieldMark = domElem.getAttribute("data-fieldMark") || "";
//
const myResume = {
// JS
// DOM element
const link = domElem.getAttribute("data-link") || "";
const fileName = domElem.getAttribute("data-fileName") || "";
const fileSpan = domElem.getAttribute("data-fileSpan") || "";
const fieldMark = domElem.getAttribute("data-fieldMark") || "";
//
const myResume = {
type: "attachment",
link,
fileName,
fileSpan,
fieldMark,
children: [{ text: "" }], // void node children
};
return myResume;
};
return myResume;
}
function parseAttachmentHtmltwo(domElem, children, editor) {
// JS
// DOM element
const link = domElem.getAttribute("data-link") || "";
const fileName = domElem.getAttribute("data-fileName") || "";
const fileSpan = domElem.getAttribute("data-fileSpan") || "";
const fieldMark = domElem.getAttribute("data-fieldMark") || "";
//
const myResume = {
// JS
// DOM element
const link = domElem.getAttribute("data-link") || "";
const fileName = domElem.getAttribute("data-fileName") || "";
const fileSpan = domElem.getAttribute("data-fileSpan") || "";
const fieldMark = domElem.getAttribute("data-fieldMark") || "";
//
const myResume = {
type: "attachmenttwo",
link,
fileName,
fileSpan,
fieldMark,
children: [{ text: "" }], // void node children
};
return myResume;
};
return myResume;
}
const parseHtmlConf = {
selector: 'span[data-w-e-type="attachment"]', // CSS HTML
parseElemHtml: parseAttachmentHtml,
selector: 'span[data-w-e-type="attachment"]', // CSS HTML
parseElemHtml: parseAttachmentHtml,
};
const parseHtmlConftwo = {
selector: 'span[data-w-e-type="attachmenttwo"]', // CSS HTML
parseElemHtml: parseAttachmentHtmltwo,
selector: 'span[data-w-e-type="attachmenttwo"]', // CSS HTML
parseElemHtml: parseAttachmentHtmltwo,
};
const parseHtmlConfmodule = {
parseElemsHtml: [parseHtmlConf, parseHtmlConftwo], // parseElemHtml
parseElemsHtml: [parseHtmlConf, parseHtmlConftwo], // parseElemHtml
};
Boot.registerModule(parseHtmlConfmodule);
</script>
@ -794,15 +789,15 @@ Boot.registerModule(parseHtmlConfmodule);
<style lang="scss" >
.category-cascader-panel {
.el-cascader-panel {
// background-color: red !important;
li[aria-haspopup="true"] {
.el-cascader-panel {
// background-color: red !important;
.el-scrollbar:first-child {
// li[aria-haspopup="true"] {
.el-checkbox {
display: none !important;
}
}
}
}
}
</style>
// ::v-deep .el-textarea__inner {

View File

@ -583,7 +583,7 @@ export default {
executionTime: "",
appletPushSign: "0",
officialPushSign: "0",
messagePushSign: "0",
messagePushSign: 0,
taskSubdivisiontemplateType: "",
officialRemindContent: "",
messagePreview: "",
@ -692,10 +692,21 @@ export default {
this.totalNumber = res.data.totalNumber;
res.data.specialDiseaseNodeList.forEach((e) => {
console.log(e, "eeeeeeeeeeeeeeeee");
if(e.messagePushSign){
e.messagePushSign = "" + e.messagePushSign;
}if( e.officialPushSign ){
e.officialPushSign = "" + e.officialPushSign;
}
if(e.appletPushSign){
e.appletPushSign = "" + e.appletPushSign;
e.phonePushSign = "" + e.phonePushSign;
}
if(e.phonePushSign){
e.phonePushSign = ""+e.phonePushSign
}
});
this.lists = this.handleData(
res.data.specialDiseaseNodeList,