Merge branch 'dev_tj' into dev_aliyun

merge oj
dev_static
tangjiang 5 years ago
commit 5fa2132186

@ -4,16 +4,17 @@
* @Github: * @Github:
* @Date: 2020-01-06 09:02:29 * @Date: 2020-01-06 09:02:29
* @LastEditors : tangjiang * @LastEditors : tangjiang
* @LastEditTime : 2020-01-09 11:58:52 * @LastEditTime : 2020-01-09 15:00:13
*/ */
import Quill from 'quill'; import Quill from 'quill';
// let Inline = Quill.import('blots/inline'); // let Inline = Quill.import('blots/inline');
const BlockEmbed = Quill.import('blots/block/embed'); const BlockEmbed = Quill.import('blots/embed');
class FillBlot extends BlockEmbed { class FillBlot extends BlockEmbed {
static create (value) { static create (value) {
const node = super.cerate(); const node = super.cerate(value);
// node.classList.add('icon icon-bianji2'); // node.classList.add('icon icon-bianji2');
// node.setAttribute('data-fill', 'fill'); // node.setAttribute('data-fill', 'fill');
console.log('编辑器值===》》》》》', value);
node.setAttribute('data_index', value.data_index); node.setAttribute('data_index', value.data_index);
node.nodeValue = value.text; node.nodeValue = value.text;
return node; return node;
@ -28,7 +29,7 @@ class FillBlot extends BlockEmbed {
} }
FillBlot.blotName = "fill"; FillBlot.blotName = "fill-blot";
FillBlot.tagName = "span"; FillBlot.tagName = "span";
export default FillBlot; export default FillBlot;

@ -4,7 +4,7 @@
* @Github: * @Github:
* @Date: 2019-12-18 08:49:30 * @Date: 2019-12-18 08:49:30
* @LastEditors : tangjiang * @LastEditors : tangjiang
* @LastEditTime : 2020-01-09 11:56:10 * @LastEditTime : 2020-01-10 15:05:27
*/ */
import './index.scss'; import './index.scss';
import 'quill/dist/quill.core.css'; // 核心样式 import 'quill/dist/quill.core.css'; // 核心样式
@ -31,14 +31,16 @@ Quill.register(ImageBlot);
Quill.register(Size); Quill.register(Size);
Quill.register(Font, true); Quill.register(Font, true);
// Quill.register({'modules/toolbar': Toolbar}); // Quill.register({'modules/toolbar': Toolbar});
Quill.register(FillBlot); Quill.register({
'formats/fill': FillBlot
});
// Quill.register(Color); // Quill.register(Color);
function QuillForEditor ({ function QuillForEditor ({
placeholder, placeholder,
readOnly, readOnly,
autoFocus, autoFocus = false,
options, options,
value, value,
imgAttrs = {}, // 指定图片的宽高 imgAttrs = {}, // 指定图片的宽高
@ -194,10 +196,11 @@ function QuillForEditor ({
}); });
_quill.getModule('toolbar').addHandler('fill', (e) => { _quill.getModule('toolbar').addHandler('fill', (e) => {
// console.log('点击了填空=====>>>>>>', e);
setFillCount(fillCount + 1); setFillCount(fillCount + 1);
const range = _quill.getSelection(true); const range = _quill.getSelection(true);
// _quill.insertText(range.index, '▁', { 'data_index': fillCount }); // _quill.insertText(range.index, '▁', { 'data_index': fillCount });
_quill.insertEmbed(range.index, 'span', { _quill.insertEmbed(range.index, 'fill', {
text: '▁', text: '▁',
'data_index': fillCount 'data_index': fillCount
}); });
@ -229,16 +232,21 @@ function QuillForEditor ({
} }
const current = value const current = value
// console.log('+++++', current);
if (!deepEqual(previous, current)) { if (!deepEqual(previous, current)) {
setSelection(quill.getSelection()) setSelection(quill.getSelection())
if (typeof value === 'string') { if (typeof value === 'string') {
quill.clipboard.dangerouslyPasteHTML(value, 'api') quill.clipboard.dangerouslyPasteHTML(value, 'api');
if (autoFocus) {
quill.focus();
} else {
quill.blur();
}
} else { } else {
quill.setContents(value) quill.setContents(value)
if (autoFocus) quill.focus();
} }
} }
}, [quill, value, setQuill]); }, [quill, value, setQuill, autoFocus]);
// 清除选择区域 // 清除选择区域
useEffect(() => { useEffect(() => {
@ -272,13 +280,6 @@ function QuillForEditor ({
} }
}, [quill, handleOnChange]); }, [quill, handleOnChange]);
useEffect(() => {
if (!quill) return;
if (autoFocus) {
quill.focus();
}
}, [quill, autoFocus]);
// 返回结果 // 返回结果
return ( return (
<div className='quill_editor_for_react_area' style={wrapStyle}> <div className='quill_editor_for_react_area' style={wrapStyle}>

@ -4,7 +4,7 @@
* @Github: * @Github:
* @Date: 2019-11-20 10:35:40 * @Date: 2019-11-20 10:35:40
* @LastEditors : tangjiang * @LastEditors : tangjiang
* @LastEditTime : 2020-01-09 14:18:37 * @LastEditTime : 2020-01-10 15:06:23
*/ */
import './index.scss'; import './index.scss';
// import 'katex/dist/katex.css'; // import 'katex/dist/katex.css';
@ -453,6 +453,7 @@ class EditTab extends React.Component {
colon={ false } colon={ false }
> >
<QuillForEditor <QuillForEditor
autoFocus={true}
style={{ height: '200px' }} style={{ height: '200px' }}
placeholder="请输入描述信息" placeholder="请输入描述信息"
onContentChange={handleContentChange} onContentChange={handleContentChange}

Loading…
Cancel
Save