krp-react-form-component
Version:
KRP React Component for Form Preview Component
173 lines (171 loc) • 6.49 kB
JavaScript
;
require("core-js/modules/es.weak-map.js");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
require("core-js/modules/es.regexp.exec.js");
require("core-js/modules/es.string.replace.js");
require("core-js/modules/esnext.iterator.constructor.js");
require("core-js/modules/esnext.iterator.filter.js");
require("core-js/modules/esnext.iterator.find.js");
require("core-js/modules/web.dom-collections.iterator.js");
var _react = _interopRequireWildcard(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _antd = require("antd");
require("./CustomFileUpload.scss");
var _AppContext = require("../../../../context/AppContext");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
const CustomUploadFile = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
let {
className,
multiple,
accept,
initState,
formProps,
formFieldName,
errorMsg,
label,
handleTitleError
} = _ref;
const {
resolveLocale,
resolveFunctionLocale
} = (0, _react.useContext)(_AppContext.AppContext);
const [fileListState, setFileListState] = (0, _react.useState)(initState === null || initState === void 0 ? void 0 : initState.fileList);
// const [ formPreviewFileListState, setFormPreviewFileListState ] = useState();
const handleChange = _ref2 => {
let {
file,
fileList
} = _ref2;
if (validateUpload(file, fileList)) {
if (fileList.length > 1) {
fileList.splice(0, 1);
}
setFileListState(fileList);
if (fileList.length < 1) {
formProps.setFields({
[formFieldName]: {
value: {
file,
fileList
},
errors: [new Error(errorMsg)]
}
});
} else {
formProps.setFieldsValue({
[formFieldName]: {
file,
fileList
}
});
}
handleTitleError();
}
};
const validateUpload = (file, fileList) => {
const acceptedFileType = accept.split(",");
const filename = file === null || file === void 0 ? void 0 : file.name;
const fileExtension = filename.substring(filename.lastIndexOf('.') + 1, filename.length) || filename;
if (!acceptedFileType.find(fileType => fileType.replace('.', '') === fileExtension)) {
// let formPreviewFileList = fileList.filter(
// item => item.uid !== file.uid
// );
// setFormPreviewFileListState(formPreviewFileList);
_antd.message.error(resolveLocale('FORM_PREVIEW_ERROR_FILE_TYPE'));
return false;
}
const isLimit1MB = file.size / 1024 / 1024 > 1;
const isLimit3MB = file.size / 1024 / 1024 > 3;
switch (file.type) {
case 'image/png':
case 'image/jpeg':
if (isLimit1MB) {
// const formPreviewFileList = fileList.filter(
// item => item.uid !== file.uid
// );
// setFormPreviewFileListState(formPreviewFileList);
_antd.message.error(resolveFunctionLocale('INVALID_FILE_TYPE_SIZE', 1));
return false;
} else {
// setFormPreviewFileListState(fileList);
return true;
}
case 'application/pdf':
case 'application/vnd.ms-excel':
case 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet':
case 'application/msword':
case 'application/vnd.openxmlformats-officedocument.wordprocessingml.document':
case 'application/vnd.ms-powerpoint':
case 'application/vnd.openxmlformats-officedocument.presentationml.presentation':
if (isLimit3MB) {
// const formPreviewFileList = fileList.filter(
// item => item.uid !== file.uid
// );
// setFormPreviewFileListState(formPreviewFileList);
_antd.message.error(resolveFunctionLocale('INVALID_FILE_TYPE_SIZE', 3));
return false;
} else {
// setFormPreviewFileListState(fileList);
return true;
}
default:
// let formPreviewFileList = fileList.filter(
// item => item.uid !== file.uid
// );
// setFormPreviewFileListState(formPreviewFileList);
_antd.message.error(resolveLocale('FORM_PREVIEW_ERROR_FILE_TYPE'));
return false;
}
};
const handleRemove = file => {
let fileList = fileListState.filter(item => item.uid !== file.uid);
setFileListState(fileList);
};
const renderUploadButton = () => {
return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_antd.Button, null, /*#__PURE__*/_react.default.createElement(_antd.Icon, {
type: "upload"
}), label));
};
return /*#__PURE__*/_react.default.createElement(_antd.Upload, {
className: className,
initState: initState,
formProps: formProps,
formFieldName: formFieldName,
errorMsg: errorMsg,
label: label,
handleTitleError: handleTitleError
// action={}
,
customRequest: _ref3 => {
let {
file,
onSuccess
} = _ref3;
setTimeout(() => {
onSuccess('ok');
}, 0);
},
multiple: multiple,
accept: accept,
onChange: handleChange,
fileList: fileListState,
onRemove: handleRemove
// listType={'picture-card'}
}, renderUploadButton());
});
CustomUploadFile.propTypes = {
className: _propTypes.default.string,
multiple: _propTypes.default.bool,
accept: _propTypes.default.string,
initState: _propTypes.default.object,
formProps: _propTypes.default.object,
formFieldName: _propTypes.default.string,
errorMsg: _propTypes.default.string,
label: _propTypes.default.string,
handleTitleError: _propTypes.default.func
};
var _default = exports.default = CustomUploadFile;