diff --git a/public/react/src/common/components/comment/CommentForm.js b/public/react/src/common/components/comment/CommentForm.js index dc90b7296..4e5316642 100644 --- a/public/react/src/common/components/comment/CommentForm.js +++ b/public/react/src/common/components/comment/CommentForm.js @@ -26,9 +26,6 @@ function CommentForm(props) { const [focus, setFocus] = useState(false); const options = [ - // ['bold', 'italic', 'underline'], - // [{header: [1,2,3,false]}], - 'code-block', 'link', 'image', 'formula' @@ -50,11 +47,9 @@ function CommentForm(props) { // 编辑器内容变化时 const handleContentChange = (content) => { - console.log('编辑器内容', content); setCtx(content); try { // const _html = new QuillDeltaToHtmlConverter(content.ops, {}).convert(); - // props.form.setFieldsValue({'comment': _html.replace(/<\/?[^>]*>/g, '')}); props.form.setFieldsValue({ 'comment': content }); } catch (error) { console.log(error); diff --git a/public/react/src/common/components/comment/CommentItem.js b/public/react/src/common/components/comment/CommentItem.js index dc54d96c0..1b2225041 100644 --- a/public/react/src/common/components/comment/CommentItem.js +++ b/public/react/src/common/components/comment/CommentItem.js @@ -236,7 +236,6 @@ function CommentItem({ /> - {/* 显示上传的图片信息 */}
diff --git a/public/react/src/common/quillForEditor/ImageBlot.js b/public/react/src/common/quillForEditor/ImageBlot.js index 5ff84b249..0a9bec733 100644 --- a/public/react/src/common/quillForEditor/ImageBlot.js +++ b/public/react/src/common/quillForEditor/ImageBlot.js @@ -17,7 +17,6 @@ export default class ImageBlot extends BlockEmbed { const node = super.create(); node.setAttribute('alt', value.alt); node.setAttribute('src', value.url); - // console.log('~~~~~~~~~~~', node, value); node.addEventListener('click', function () { value.onclick(value.url); }, false); @@ -33,25 +32,14 @@ export default class ImageBlot extends BlockEmbed { } // 宽度和高度都不存在时, if (!value.width && !value.height) { - // node.setAttribute('display', 'block'); node.setAttribute('width', '100%'); } - // node.setAttribute('style', { cursor: 'pointer' }); - - // if (node.onclick) { - // console.log('image 有图片点击事件======》》》》》》'); - // // node.setAttribute('onclick', node.onCLick); - // } - // 给图片添加点击事件 - // node.onclick = () => { - // value.onClick && value.onClick(value.url); - // } return node; } // 获取节点值 - static value (node) { + static value(node) { return { alt: node.getAttribute('alt'), @@ -61,7 +49,6 @@ export default class ImageBlot extends BlockEmbed { height: node.height, display: node.getAttribute('display'), id: node.id, - // style: node.style }; } } diff --git a/public/react/src/common/quillForEditor/index.js b/public/react/src/common/quillForEditor/index.js index 27dd2f158..1d9582ab5 100644 --- a/public/react/src/common/quillForEditor/index.js +++ b/public/react/src/common/quillForEditor/index.js @@ -20,16 +20,17 @@ import { fetchUploadImage } from '../../services/ojService.js'; import { getImageUrl } from 'educoder' import ImageBlot from './ImageBlot'; import FillBlot from './FillBlot'; +import LinkBlot from './link-blot' var Size = Quill.import('attributors/style/size'); -// const Color = Quill.import('attributes/style/color'); Size.whitelist = ['14px', '16px', '18px', '20px', false]; -var fonts = ['Microsoft-YaHei','SimSun', 'SimHei','KaiTi','FangSong']; +var fonts = ['Microsoft-YaHei', 'SimSun', 'SimHei', 'KaiTi', 'FangSong']; var Font = Quill.import('formats/font'); Font.whitelist = fonts; //将字体加入到白名单 window.Quill = Quill; window.katex = katex; Quill.register(ImageBlot); Quill.register(Size); +Quill.register(LinkBlot); Quill.register(Font, true); Quill.register({ 'formats/fill': FillBlot @@ -49,17 +50,16 @@ function QuillForEditor({ onContentChange, addFill, // 点击填空成功的回调 deleteFill // 删除填空,返回删除的下标 - // getQuillContent }) { // toolbar 默认值 const defaultConfig = [ 'bold', 'italic', 'underline', - {size: ['14px', '16px', '18px', '20px']}, - {align: []}, {list: 'ordered'}, {list: 'bullet'}, // 列表 - {script: 'sub'}, {script: 'super'}, + { size: ['14px', '16px', '18px', '20px'] }, + { align: [] }, { list: 'ordered' }, { list: 'bullet' }, // 列表 + { script: 'sub' }, { script: 'super' }, { 'color': [] }, { 'background': [] }, - { 'font': []}, - {header: [1,2,3,4,5,false]}, + { 'font': [] }, + { header: [1, 2, 3, 4, 5, false] }, 'blockquote', 'code-block', 'link', 'image', 'video', 'formula', @@ -75,7 +75,6 @@ function QuillForEditor({ // 文本内容变化时 const handleOnChange = content => { - // getQuillContent && getQuillContent(quill); onContentChange && onContentChange(content, quill); }; @@ -84,9 +83,7 @@ function QuillForEditor({ const bindings = { tab: { key: 9, - handler: function () { - console.log('调用了tab=====>>>>'); - } + handler: function () { } }, backspace: { key: 'Backspace', @@ -106,7 +103,6 @@ function QuillForEditor({ const _start = length === 0 ? index - 1 : index; const _length = length || 1; let delCtx = this.quill.getText(_start, _length); // 删除的元素 - // aa const reg = /▁/g; const delArrs = delCtx.match(reg); if (delArrs) { diff --git a/public/react/src/common/quillForEditor/link-blot.js b/public/react/src/common/quillForEditor/link-blot.js new file mode 100644 index 000000000..8f508dd34 --- /dev/null +++ b/public/react/src/common/quillForEditor/link-blot.js @@ -0,0 +1,21 @@ +import Quill from "quill"; +const Inline = Quill.import('blots/inline'); + +export default class LinkBlot extends Inline { + static create(value) { + let node = super.create() + let rs = value + if (rs.indexOf('http://') < 0) { + rs = 'http://' + rs + } + node.setAttribute('href', rs) + node.setAttribute('target', '_blank') + return node; + } + + static formats(node) { + return node.getAttribute('href'); + } +} +LinkBlot.blotName = 'link' +LinkBlot.tagName = 'a' \ No newline at end of file