Skip to content

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

fix: 富文件编辑器上传附件对附件名有特殊字段处理

parent 3bfaaf53
Pipeline #57669 failed with stages
          in 8 seconds
          Hide whitespace changes
          Inline Side-by-side
          Showing with 98 additions and 96 deletions
          packages/base-components/RichText/src/fileListItem.js
          View file @ b6d48803
          ...@@ -3,101 +3,99 @@ ...@@ -3,101 +3,99 @@
          * @Author: hongmye * @Author: hongmye
          * @Date: 2022-03-21 14:44:49 * @Date: 2022-03-21 14:44:49
          */ */
          import React, { useState, useEffect, useContext } 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, ConfigProvider } 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 { getPrefixCls } = useContext(ConfigProvider.ConfigContext); const { getPrefixCls } = useContext(ConfigProvider.ConfigContext);
          const prefixCls = getPrefixCls(); const prefixCls = getPrefixCls();
          const imgType = ['image/png', 'image/jpg', 'image/jpeg']; const imgType = ['image/png', 'image/jpg', 'image/jpeg'];
          const onPreview = item => { const onPreview = (item) => {
          props.onPreview(item); props.onPreview(item);
          }; };
          const onDownLoad = item => { const onDownLoad = (item) => {
          const a = document.createElement('a'); const a = document.createElement('a');
          a.setAttribute('download', item.name); a.setAttribute('download', item.name);
          a.setAttribute('href', item.path); a.setAttribute('href', item.path);
          document.documentElement.appendChild(a); document.documentElement.appendChild(a);
          a.target = '_black'; a.target = '_black';
          a.click(); a.click();
          }; };
          useEffect(() => { useEffect(() => {
          setFileList(props.list || []); setFileList(props.list || []);
          }, [props.list]); }, [props.list]);
          return ( return (
          <> <>
          {fileList.map((item, index) => { {fileList.map((item, index) => {
          return ( return (
          <div key={index} className={`${prefixCls}-upload-list ${prefixCls}-upload-list-picture`}> <div key={index} className={`${prefixCls}-upload-list ${prefixCls}-upload-list-picture`}>
          <div className={`${prefixCls}-upload-list-picture-container`}> <div className={`${prefixCls}-upload-list-picture-container`}>
          <div className={`${prefixCls}-upload-list-item`}> <div className={`${prefixCls}-upload-list-item`}>
          <div className={`${prefixCls}-upload-list-item-info`}> <div className={`${prefixCls}-upload-list-item-info`}>
          <span className={`${prefixCls}-upload-span`}> <span className={`${prefixCls}-upload-span`}>
          <div <div
          className={ className={`${prefixCls}-upload-list-item-thumbnail ${prefixCls}-upload-list-item-file`}
          `${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 />} */}
          <img src={iconFile} />
          </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> </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 @ b6d48803
          ...@@ -370,9 +370,13 @@ const RichText = forwardRef((props, ref) => { ...@@ -370,9 +370,13 @@ 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(API.POST_UPLOADERFILES, { request(API.POST_UPLOADERFILES, {
          method: 'POST', method: 'POST',
          ...@@ -392,7 +396,7 @@ const RichText = forwardRef((props, ref) => { ...@@ -392,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