61 lines
4.0 KiB
JavaScript
61 lines
4.0 KiB
JavaScript
import React, { useRef } from 'react';
|
|
import { Upload } from "antd";
|
|
import ImgCrop from 'antd-img-crop';
|
|
import ExtrafileUpload from '../upload';
|
|
export default function render(props) {
|
|
const { bucket, autoUpload, maxNumber, mode, showUploadList, showUploadProgress, accept, disablePreview, disableDelete, disableAdd, disableDownload, disabled, type, origin, tag1, tag2, entity, entityId, theme, children, cropQuality = 1, showRest = false, showGrid = false, fillColor = 'white', rotationSlider = false, aspectSlider = false, zoomSlider = true, resetText = '重置', aspect = 1 / 1, minZoom = 1, maxZoom = 3, cropShape = 'rect', cropperProps = {}, modalTitle = '编辑图片', modalWidth = '40vw', modalOk = '确定', modalCancel = '取消', enableCrop = false, enableCompross = false, oakFullpath, } = props.data;
|
|
const { compressFile } = props.methods;
|
|
const uploadRef = useRef(null);
|
|
const addFileByWeb = (file) => {
|
|
if (uploadRef.current) {
|
|
uploadRef.current.addFileByWeb(file);
|
|
}
|
|
};
|
|
return (<>
|
|
{enableCrop ? (<ImgCrop showReset={showRest} showGrid={showGrid} fillColor={fillColor} rotationSlider={rotationSlider} aspectSlider={aspectSlider} zoomSlider={zoomSlider} resetText={resetText} aspect={aspect} minZoom={minZoom} maxZoom={maxZoom} cropShape={cropShape} quality={cropQuality} cropperProps={{
|
|
restrictPosition: false,
|
|
...cropperProps,
|
|
}} modalTitle={modalTitle} modalWidth={modalWidth} modalOk={modalOk} modalCancel={modalCancel}>
|
|
<ExtrafileUpload oakPath={oakFullpath} bucket={bucket} autoUpload={autoUpload} maxNumber={maxNumber} mode={mode} showUploadList={showUploadList} showUploadProgress={showUploadProgress} accept={accept} disablePreview={disablePreview} disableDelete={disableDelete} disableAdd={disableAdd} disableDownload={disableDownload} disabled={disabled} type={type} origin={origin} tag1={tag1} tag2={tag2} entity={entity} entityId={entityId} theme={theme} children={children} beforeUpload={async (file) => {
|
|
const reader = new FileReader();
|
|
if (enableCompross) {
|
|
compressFile(file).then(res => {
|
|
addFileByWeb(res);
|
|
reader.readAsDataURL(res);
|
|
reader.onload = (e) => {
|
|
res.url = e.target?.result;
|
|
};
|
|
});
|
|
}
|
|
else {
|
|
addFileByWeb(file);
|
|
reader.readAsDataURL(file);
|
|
reader.onload = (e) => {
|
|
file.url = e.target?.result;
|
|
};
|
|
}
|
|
return Upload.LIST_IGNORE;
|
|
}} ref={uploadRef}/>
|
|
</ImgCrop>) : (<ExtrafileUpload oakPath={oakFullpath} bucket={bucket} autoUpload={autoUpload} maxNumber={maxNumber} mode={mode} showUploadList={showUploadList} showUploadProgress={showUploadProgress} accept={accept} disablePreview={disablePreview} disableDelete={disableDelete} disableAdd={disableAdd} disableDownload={disableDownload} disabled={disabled} type={type} origin={origin} tag1={tag1} tag2={tag2} entity={entity} entityId={entityId} theme={theme} children={children} beforeUpload={async (file) => {
|
|
const reader = new FileReader();
|
|
if (enableCompross) {
|
|
compressFile(file).then(res => {
|
|
addFileByWeb(res);
|
|
reader.readAsDataURL(res);
|
|
reader.onload = (e) => {
|
|
res.url = e.target?.result;
|
|
};
|
|
});
|
|
}
|
|
else {
|
|
addFileByWeb(file);
|
|
reader.readAsDataURL(file);
|
|
reader.onload = (e) => {
|
|
file.url = e.target?.result;
|
|
};
|
|
}
|
|
return Upload.LIST_IGNORE;
|
|
}} ref={uploadRef}/>)}
|
|
</>);
|
|
}
|