Skip to content

W
wisdom-components
Commit 4215a43a authored by 周宏民's avatar 周宏民
Browse files
Options

fix: 富文本组件更新

parent 7a35b967
Hide whitespace changes
Inline Side-by-side
Showing with 275 additions and 201 deletions
packages/base-components/RichText/CHANGELOG.md
View file @ 4215a43a
...@@ -2,11 +2,78 @@ ...@@ -2,11 +2,78 @@
All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
## [0.2.19](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/richtext@0.2.18...@wisdom-components/richtext@0.2.19) (2022-08-15)
### Bug Fixes
- rich ([7bb8920](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/commits/7bb8920cf4e82df2afb5742024c1c2a26d583baa))
## [0.2.18](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/richtext@0.2.17...@wisdom-components/richtext@0.2.18) (2022-08-15)
### Bug Fixes
- rich ([80b59bb](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/commits/80b59bb5dfeca75b3412ca1ee7cd9edbac03b3ef))
## [0.2.17](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/richtext@0.2.16...@wisdom-components/richtext@0.2.17) (2022-08-15)
### Bug Fixes
- rich ([518de5f](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/commits/518de5f000ea6bd3dc3f5942f66a0bdf73d1f4c7))
- rich ([54fb5db](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/commits/54fb5db071ee98ef9407282da3657d6df8f818e1))
## [0.2.16](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/richtext@0.2.14...@wisdom-components/richtext@0.2.16) (2022-08-15)
### Bug Fixes
- rich ([c648d91](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/commits/c648d913c7f3cc8f4c78d406443b2111fe6537bb))
## [0.2.14](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/richtext@0.2.13...@wisdom-components/richtext@0.2.14) (2022-08-15)
### Bug Fixes
- rich ([50d6197](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/commits/50d6197a421bdb610633019901b5232276a4663e))
## [0.2.13](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/richtext@0.2.12...@wisdom-components/richtext@0.2.13) (2022-08-15)
### Bug Fixes
- 富文件编辑器上传附件对附件名有特殊字段处理 ([b6d4880](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/commits/b6d488032b3f09f8e19469c5a2bbee66fa1b7422))
## [0.2.12](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/richtext@0.2.10...@wisdom-components/richtext@0.2.12) (2022-08-08)
### Bug Fixes
- 富文本组件修改 ([2f10eed](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/commits/2f10eed0f9c9c345d632169b1c142623617ccbc9))
## [0.2.10](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/richtext@0.2.9...@wisdom-components/richtext@0.2.10) (2022-06-27)
### Bug Fixes
- 富文本组件搜索人员出错 ([9a5c9d7](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/commits/9a5c9d786eaece0cffa5bb6478b49d8996111f42))
## [0.2.9](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/richtext@0.2.8...@wisdom-components/richtext@0.2.9) (2022-06-27)
### Bug Fixes
- 文件列表样式修改 ([986b866](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/commits/986b866a509a1b13125a930f30b65e6c59195616))
## [0.2.8](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/richtext@0.2.7...@wisdom-components/richtext@0.2.8) (2022-06-27)
### Bug Fixes
- 富文本组件服务修改 ([5daa86c](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/commits/5daa86ca289b85be6d3d9f2087c653c5609f0c42))
## [0.2.7](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/richtext@0.2.5...@wisdom-components/richtext@0.2.7) (2022-06-27)
### Bug Fixes
- test ([650717c](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/commits/650717ca42144b44c72e4cc43a984353f4e3f0fd))
## [0.2.6](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/richtext@0.2.5...@wisdom-components/richtext@0.2.6) (2022-06-27) ## [0.2.6](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/richtext@0.2.5...@wisdom-components/richtext@0.2.6) (2022-06-27)
### Bug Fixes ### Bug Fixes
- 修改 ([0f126c9](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/commits/0f126c905fd979137f3594750d43f3fbe247254e)) - test ([650717c](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/commits/650717ca42144b44c72e4cc43a984353f4e3f0fd))
## [0.2.5](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/richtext@0.2.4...@wisdom-components/richtext@0.2.5) (2022-06-27) ## [0.2.5](https://g.civnet.cn:8443/ReactWeb5/wisdom-components/compare/@wisdom-components/richtext@0.2.4...@wisdom-components/richtext@0.2.5) (2022-06-27)
......
packages/base-components/RichText/package.json
View file @ 4215a43a
{ {
"name": "@wisdom-components/richtext", "name": "@wisdom-components/richtext",
"version": "0.2.6", "version": "0.2.19",
"description": "> TODO: description", "description": "> TODO: description",
"author": "hongmye <1014185119@qq.com>", "author": "hongmye <1014185119@qq.com>",
"homepage": "", "homepage": "",
......
packages/base-components/RichText/src/demos/demo.jsx
View file @ 4215a43a
...@@ -5,89 +5,88 @@ ...@@ -5,89 +5,88 @@
*/ */
import React from 'react'; import React from 'react';
import { Button } from 'antd';
import RichText from '../index'; import RichText from '../index';
import RichTextShow from '../RichTextShow';
// import { projectManageService } from '@/api'; // import { projectManageService } from '@/api';
import styles from './demo.less'; import styles from './demo.less';
class RichTextDemo extends React.Component { class RichTextDemo extends React.Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.myRichText = React.createRef(); this.myRichText = React.createRef();
this.state = { this.state = {
personList: [ personList: [
{ userId: 568, userName: '徐乐' }, { userId: 568, userName: '徐乐' },
{ userId: 569, userName: '余苏苏' }, { userId: 569, userName: '余苏苏' },
{ userId: 572, userName: '周宏民' }, { userId: 572, userName: '周宏民' },
], ],
content: '', content: '',
fileList: [], fileList: [],
};
}
getData = async () => {
// const res = await projectManageService.GetWorkHourUserList({ projectId: 19 });
// this.setState({
// // personList: res.data || [],
// });
// const arr = [
// {
// name: '工时管理_工时日报 (1).xlsx',
// type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
// size: 8192,
// path:
// '/PandaWorkFlow/WorkFlow/AccountManage/DownloadFiles?filePath=b0422fdb-6c63-4b34-8021-b54102236bcb/工时管理_工时日报/(1).xlsx',
// },
// {
// name: '浊度.png',
// type: 'image/png',
// size: 6789,
// path:
// '/PandaWorkFlow/WorkFlow/AccountManage/DownloadFiles?filePath=fd00ce06-52c0-410a-bd30-8aed9131a616/浊度.png',
// },
// ];
// // this.setState({ fileList: arr });
// this.myRichText.current && this.myRichText.current.setHtml('');
}; };
}
componentDidMount = () => { getData = async () => {
this.getData(); // const res = await projectManageService.GetWorkHourUserList({ projectId: 19 });
}; // this.setState({
// // personList: res.data || [],
// });
const arr = [
{
name: '工时管理_工时日报 (1).xlsx',
type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
size: 8192,
path: '/PandaWorkFlow/WorkFlow/AccountManage/DownloadFiles?filePath=b0422fdb-6c63-4b34-8021-b54102236bcb/工时管理_工时日报/(1).xlsx',
},
{
name: '浊度.png',
type: 'image/png',
size: 6789,
path: '/PandaWorkFlow/WorkFlow/AccountManage/DownloadFiles?filePath=fd00ce06-52c0-410a-bd30-8aed9131a616/浊度.png',
},
];
this.setState({ fileList: arr });
// this.myRichText.current && this.myRichText.current.setHtml('');
};
componentDidMount = () => {
this.getData();
};
componentDidUpdate = (propNev, stateNev) => { }; componentDidUpdate = (propNev, stateNev) => {};
componentWillUnmount() { componentWillUnmount() {
this.setState = () => { }; this.setState = () => {};
} }
render() { render() {
return ( return (
<div className={styles.RichTextDemo}> <div className={styles.RichTextDemo}>
<div className={styles.RichTextDemoContainer}> <div className={styles.RichTextDemoContainer}>
<RichText <RichText
// content={this.state.content} // content={this.state.content}
personList={this.state.personList} personList={this.state.personList}
onChange={val => { onChange={(val) => {
this.setState({ content: val }); this.setState({ content: val });
}} }}
onChangeFile={arr => { onChangeFile={(arr) => {
this.setState({ fileList: arr }); this.setState({ fileList: arr });
}} }}
fileList={this.state.fileList} fileList={this.state.fileList}
projectId={19} projectId={19}
ref={this.myRichText} ref={this.myRichText}
/> />
</div> </div>
{/* <div className={styles.contentBox}>{this.state.content}</div> */} {/* <div className={styles.contentBox}>{this.state.content}</div> */}
<div className={styles.contentBox}> {/* <div className={styles.contentBox}>
<RichTextShow content={this.state.content} onClickImg={src => { }} fileList={this.state.fileList} /> <RichTextShow
</div> content={this.state.content}
<div className={styles.contentBox}>{this.state.content}</div> onClickImg={(src) => {}}
</div> fileList={this.state.fileList}
); />
} </div> */}
<div className={styles.contentBox}>{this.state.content}</div>
</div>
);
}
} }
export default RichTextDemo; export default RichTextDemo;
packages/base-components/RichText/src/fileListItem.js
View file @ 4215a43a
...@@ -3,98 +3,99 @@ ...@@ -3,98 +3,99 @@
* @Author: hongmye * @Author: hongmye
* @Date: 2022-03-21 14:44:49 * @Date: 2022-03-21 14:44:49
*/ */
import React, { useState, useEffect, useRef, useImperativeHandle, forwardRef } from 'react'; import { DeleteOutlined, DownloadOutlined, PictureOutlined } from '@ant-design/icons';
import { FileTwoTone, DeleteOutlined, FileImageTwoTone, DownloadOutlined, PictureOutlined } from '@ant-design/icons'; import { Button, ConfigProvider } from 'antd';
import { Button } from 'antd'; import { useContext, useEffect, useState } from 'react';
import iconFile from './icon_file.png'; import iconFile from './icon_file.png';
function fileListItem(props) { function FileListItem(props) {
const [fileList, setFileList] = useState([]); const [fileList, setFileList] = useState([]);
const imgType = ['image/png', 'image/jpg', 'image/jpeg']; const { getPrefixCls } = useContext(ConfigProvider.ConfigContext);
const onPreview = item => { const prefixCls = getPrefixCls();
props.onPreview(item);
}; const imgType = ['image/png', 'image/jpg', 'image/jpeg'];
const onDownLoad = item => { const onPreview = (item) => {
const a = document.createElement('a'); props.onPreview(item);
a.setAttribute('download', item.name); };
a.setAttribute('href', item.path); const onDownLoad = (item) => {
document.documentElement.appendChild(a); const a = document.createElement('a');
a.target = '_black'; a.setAttribute('download', item.name);
a.click(); a.setAttribute('href', item.path);
}; document.documentElement.appendChild(a);
useEffect(() => { a.target = '_black';
setFileList(props.list || []); a.click();
}, [props.list]); };
return ( useEffect(() => {
<> setFileList(props.list || []);
{fileList.map((item, index) => { }, [props.list]);
return ( return (
<div key={index} className={'panda-civ-work-upload-list panda-civ-work-upload-list-picture'}> <>
<div className={'panda-civ-work-upload-list-picture-container'}> {fileList.map((item, index) => {
<div className={'panda-civ-work-upload-list-item'}> return (
<div className={'panda-civ-work-upload-list-item-info'}> <div key={index} className={`${prefixCls}-upload-list ${prefixCls}-upload-list-picture`}>
<span className={'panda-civ-work-upload-span'}> <div className={`${prefixCls}-upload-list-picture-container`}>
<div <div className={`${prefixCls}-upload-list-item`}>
className={ <div className={`${prefixCls}-upload-list-item-info`}>
'panda-civ-work-upload-list-item-thumbnail panda-civ-work-upload-list-item-file' <span className={`${prefixCls}-upload-span`}>
} <div
> className={`${prefixCls}-upload-list-item-thumbnail ${prefixCls}-upload-list-item-file`}
{/* {imgType.includes(item.type) ? <FileImageTwoTone /> : <FileTwoTone />} */} >
<img src={iconFile} /> {/* {imgType.includes(item.type) ? <FileImageTwoTone /> : <FileTwoTone />} */}
</div> <img src={iconFile} />
<span
className={'panda-civ-work-upload-list-item-name'}
title={item.name}
style={{ cursor: 'pointer' }}
>
{item.name}
</span>
<span className={'panda-civ-work-upload-list-item-card-actions picture'}>
{imgType.includes(item.type) && (
<Button
title="预览"
type="text"
onClick={e => {
e && e.stopPropagation();
onPreview(item);
}}
style={{ padding: '4px 8px' }}
>
<PictureOutlined />
</Button>
)}
<Button
title="下载"
type="text"
onClick={e => {
e && e.stopPropagation();
onDownLoad(item);
}}
style={{ padding: '4px 8px' }}
>
<DownloadOutlined />
</Button>
{props.type === 'edit' && (
<Button
title="删除文件"
type="text"
onClick={e => {
e && e.stopPropagation();
props.onDel(item);
}}
style={{ padding: '4px 8px' }}
>
<DeleteOutlined />
</Button>
)}
</span>
</span>
</div>
</div>
</div>
</div> </div>
); <span
})} className={`${prefixCls}-upload-list-item-name`}
</> title={item.name}
); style={{ cursor: 'pointer' }}
>
{item.name}
</span>
<span className={`${prefixCls}-upload-list-item-card-actions picture`}>
{imgType.includes(item.type) && (
<Button
title="预览"
type="text"
onClick={(e) => {
e && e.stopPropagation();
onPreview(item);
}}
style={{ padding: '4px 8px' }}
>
<PictureOutlined />
</Button>
)}
<Button
title="下载"
type="text"
onClick={(e) => {
e && e.stopPropagation();
onDownLoad(item);
}}
style={{ padding: '4px 8px' }}
>
<DownloadOutlined />
</Button>
{props.type === 'edit' && (
<Button
title="删除文件"
type="text"
onClick={(e) => {
e && e.stopPropagation();
props.onDel(item);
}}
style={{ padding: '4px 8px' }}
>
<DeleteOutlined />
</Button>
)}
</span>
</span>
</div>
</div>
</div>
</div>
);
})}
</>
);
} }
export default fileListItem; export default FileListItem;
packages/base-components/RichText/src/index.js
View file @ 4215a43a
import { Image, message, Spin } from 'antd'; import { Image, message, Spin } from 'antd';
import classNames from 'classnames'; import classNames from 'classnames';
import { forwardRef, useEffect, useImperativeHandle, useRef, useState } from 'react'; import { forwardRef, useEffect, useImperativeHandle, useRef, useState } from 'react';
// import { request } from '@wisdom-utils/utils';
import request from 'umi-request'; import request from 'umi-request';
import WangEditor from './wangEditor.js';
// import { API } from '@/api/service/workflow';
const API = {};
// import { appWork, projectManageService } from '@/api';
import FileListItem from './fileListItem'; import FileListItem from './fileListItem';
import styles from './index.less'; import styles from './index.less';
import WangEditor from './wangEditor.js';
const baseUrl = '';
const API = {
POST_UPLOADERFILES: `${baseUrl}/PandaWorkFlow/WorkFlow/AccountManage/UploaderFiles`,
GET_DOWNLOADFILES: `${baseUrl}/PandaWorkFlow/WorkFlow/AccountManage/DownloadFiles`,
GET_GETALLPERSONNELS: `${baseUrl}/PandaInformatization/PandaWork/MeetingTask/GetAllPersonnels`, // 获取人员
GET_WORKHOURUSERLIST: `${baseUrl}/PandaInformatization/PandaWork/ProjectManage/GetWorkHourUserList`, //根据项目id获取项目参与人员
};
let editor = null; let editor = null;
let range; let range;
const selection = window.getSelection(); const selection = window.getSelection();
...@@ -20,7 +24,6 @@ let selectPerson = []; ...@@ -20,7 +24,6 @@ let selectPerson = [];
const RichText = forwardRef((props, ref) => { const RichText = forwardRef((props, ref) => {
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
const [zIndex, setZIndex] = useState(500); const [zIndex, setZIndex] = useState(500);
// const [inputValue, setInputValue] = useState('');
const [selectIndex, setSelectIndex] = useState(null); const [selectIndex, setSelectIndex] = useState(null);
const [selectList, setSelectList] = useState([]); const [selectList, setSelectList] = useState([]);
const [selectSearchList, setSelectSearchList] = useState([]); const [selectSearchList, setSelectSearchList] = useState([]);
...@@ -30,27 +33,37 @@ const RichText = forwardRef((props, ref) => { ...@@ -30,27 +33,37 @@ const RichText = forwardRef((props, ref) => {
const richTextRef = useRef(); const richTextRef = useRef();
const selectBoxRef = useRef(); const selectBoxRef = useRef();
const fileInputRef = useRef(); const fileInputRef = useRef();
const getData = async () => { const getData = () => {
// const { data } = await projectManageService.GetWorkHourUserList({ projectId: props.projectId }); request(API.GET_WORKHOURUSERLIST, {
// setSelectList(data); method: 'get',
params: { projectId: props.projectId },
}).then((res) => {
setSelectList(res.data || []);
});
}; };
// 获取全部人员信息 // 获取全部人员信息
const getAllPeople = async () => { const getAllPeople = async () => {
// const res = await appWork.GetAllPersonnels(); request(API.GET_GETALLPERSONNELS, {
// allPeople = res?.data?.data || []; method: 'get',
params: {},
}).then((res) => {
allPeople = res?.data?.data || [];
});
}; };
// 图片上传 // 图片上传
const uploadImg = (file) => { const uploadImg = (file) => {
const formData = new FormData(); const formData = new FormData();
formData.append('file', file); formData.append('file', file);
setLoading(true); setLoading(true);
request({ request(API.POST_UPLOADERFILES, {
url: API.POST_UPLOADERFILES,
method: 'POST', method: 'POST',
data: formData, data: formData,
}) })
.then((res) => { .then((res) => {
if (!res.data) return; if (!res.data) {
setLoading(false);
return;
}
const img = res.data.replace(/[\\ \/=]/g, '/'); const img = res.data.replace(/[\\ \/=]/g, '/');
const imgHtml = ` const imgHtml = `
<img contenteditable="false" style="display: block;" width="50%" src="${API.GET_DOWNLOADFILES}?filePath=${img}" > <img contenteditable="false" style="display: block;" width="50%" src="${API.GET_DOWNLOADFILES}?filePath=${img}" >
...@@ -92,7 +105,6 @@ const RichText = forwardRef((props, ref) => { ...@@ -92,7 +105,6 @@ const RichText = forwardRef((props, ref) => {
} }
editor.menus.extend(menuKey, InsertABCMenu); editor.menus.extend(menuKey, InsertABCMenu);
} }
editor.config = Object.assign( editor.config = Object.assign(
{}, {},
editor.config, editor.config,
...@@ -189,7 +201,6 @@ const RichText = forwardRef((props, ref) => { ...@@ -189,7 +201,6 @@ const RichText = forwardRef((props, ref) => {
startOffset = selection.focusOffset; startOffset = selection.focusOffset;
range.setStart(selection.getRangeAt(0).commonAncestorContainer, selection.focusOffset); range.setStart(selection.getRangeAt(0).commonAncestorContainer, selection.focusOffset);
selection.addRange(range); selection.addRange(range);
moveListBox(); moveListBox();
// 清空搜索 // 清空搜索
handleChange('', tempList); handleChange('', tempList);
...@@ -208,8 +219,8 @@ const RichText = forwardRef((props, ref) => { ...@@ -208,8 +219,8 @@ const RichText = forwardRef((props, ref) => {
const keyDownEvent = (evet) => { const keyDownEvent = (evet) => {
// 上下方向键 // 上下方向键
if (evet.key === 'ArrowDown' || evet.key === 'ArrowUp') { if (evet.key === 'ArrowDown' || evet.key === 'ArrowUp') {
evet.preventDefault();
if (selectBoxRef.current?.style?.display === 'block') { if (selectBoxRef.current?.style?.display === 'block') {
evet.preventDefault();
const max = selectBoxRef.current.querySelectorAll('.selectItem')?.length || 1000; const max = selectBoxRef.current.querySelectorAll('.selectItem')?.length || 1000;
let val = selectPersonIndex; let val = selectPersonIndex;
if (evet.key === 'ArrowDown') { if (evet.key === 'ArrowDown') {
...@@ -228,7 +239,8 @@ const RichText = forwardRef((props, ref) => { ...@@ -228,7 +239,8 @@ const RichText = forwardRef((props, ref) => {
} }
if (evet.key === 'Enter') { if (evet.key === 'Enter') {
// 解决无法回车换行的bug // 解决无法回车换行的bug
if (selectBoxRef.current.style.display === 'block' && selectSearchList.length) { console.log(selectBoxRef.current.style.display === 'block');
if (selectBoxRef.current.style.display === 'block') {
evet.preventDefault(); evet.preventDefault();
if (selectPerson[selectPersonIndex]) { if (selectPerson[selectPersonIndex]) {
onSelect(selectPerson[selectPersonIndex]); onSelect(selectPerson[selectPersonIndex]);
...@@ -244,7 +256,6 @@ const RichText = forwardRef((props, ref) => { ...@@ -244,7 +256,6 @@ const RichText = forwardRef((props, ref) => {
getAllPeople(); getAllPeople();
return () => { return () => {
richTextRef.current && richTextRef.current.removeEventListener('input', (e) => {}); richTextRef.current && richTextRef.current.removeEventListener('input', (e) => {});
editor && editor.destroy(); editor && editor.destroy();
editor = null; editor = null;
}; };
...@@ -282,11 +293,7 @@ const RichText = forwardRef((props, ref) => { ...@@ -282,11 +293,7 @@ const RichText = forwardRef((props, ref) => {
tempList = arr; tempList = arr;
setSelectSearchList(arr); setSelectSearchList(arr);
}, [selectList, props.personList]); }, [selectList, props.personList]);
// useEffect(() => {
// if (!props.projectId) {
// setSelectList(props.personList || []);
// }
// }, [props.personList]);
useEffect(() => { useEffect(() => {
setFileList(props.fileList); setFileList(props.fileList);
}, [props.fileList]); }, [props.fileList]);
...@@ -323,10 +330,6 @@ const RichText = forwardRef((props, ref) => { ...@@ -323,10 +330,6 @@ const RichText = forwardRef((props, ref) => {
selection.collapseToEnd(); selection.collapseToEnd();
} }
}; };
// const onChange = val => {
// setInputValue(val.currentTarget.value);
// handleChange(val.currentTarget.value);
// };
let timer = null; let timer = null;
const filterList = (val, list) => { const filterList = (val, list) => {
if (!val) { if (!val) {
...@@ -343,6 +346,7 @@ const RichText = forwardRef((props, ref) => { ...@@ -343,6 +346,7 @@ const RichText = forwardRef((props, ref) => {
} }
}; };
const handleChange = (val, list) => { const handleChange = (val, list) => {
console.log('🚀 ~ val', val);
if (timer) { if (timer) {
clearTimeout(timer); clearTimeout(timer);
} }
...@@ -366,12 +370,15 @@ const RichText = forwardRef((props, ref) => { ...@@ -366,12 +370,15 @@ const RichText = forwardRef((props, ref) => {
}; };
const addFile = (e) => { const addFile = (e) => {
if (e.target) { if (e.target) {
const file = e.target.files[0]; let file = e.target.files[0];
const pattern =
/[`~!@#$^\-&*()+=|{}':;',\\\[\]\<>\/?~！@#￥……&*（）——|{}【】'；：""'。，、？\s]/g;
let name = file.name.replace(pattern, '');
const renameFile = new File([file], name);
const formData = new FormData(); const formData = new FormData();
formData.append('file', file); formData.append('file', renameFile);
setLoading(true); setLoading(true);
request({ request(API.POST_UPLOADERFILES, {
url: API.POST_UPLOADERFILES,
method: 'POST', method: 'POST',
data: formData, data: formData,
}) })
...@@ -380,7 +387,7 @@ const RichText = forwardRef((props, ref) => { ...@@ -380,7 +387,7 @@ const RichText = forwardRef((props, ref) => {
const arr = [...fileList]; const arr = [...fileList];
const url = res.data.replace(/[\\ \/=]/g, '/'); const url = res.data.replace(/[\\ \/=]/g, '/');
arr.unshift({ arr.unshift({
name: file.name, name: name,
type: file.type ? file.type.toLowerCase() : '', type: file.type ? file.type.toLowerCase() : '',
size: file.size, size: file.size,
path: `${API.GET_DOWNLOADFILES}?filePath=${url}`, path: `${API.GET_DOWNLOADFILES}?filePath=${url}`,
...@@ -389,7 +396,7 @@ const RichText = forwardRef((props, ref) => { ...@@ -389,7 +396,7 @@ const RichText = forwardRef((props, ref) => {
props.onChangeFile(arr); props.onChangeFile(arr);
setLoading(false); setLoading(false);
} else { } else {
message.error(res.msg); res && message.error(res.msg);
setLoading(false); setLoading(false);
} }
}) })
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment