index.js 7.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118
  1. import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
  2. import { Checkbox } from "antd";
  3. import { forwardRef, useCallback, useEffect, useImperativeHandle, useMemo, useState, } from "react";
  4. import { DAGE_FILE_CHECKBOX_OPTIONS } from "./constants";
  5. import { DageUpload, DageUploadType, } from "../DageUpload";
  6. import { FileCheckboxItem } from "./style";
  7. export const DageFileCheckbox = forwardRef(({ value, action, disabled, hasMobileModel, maxAudioCount = 1, maxImgCount = 9, maxMobileModelCount = 1, maxModelCount = 1, maxVideoCount = 1, onChange, onFileChange, }, ref) => {
  8. const checkboxVal = useMemo(() => (value ? value.split(",") : []), [value]);
  9. const [modelFiles, setModelFiles] = useState([]);
  10. const [mobileModelFiles, setMobileModelFiles] = useState([]);
  11. const [imgFiles, setImgFiles] = useState([]);
  12. const [videoFiles, setVideoFiles] = useState([]);
  13. const [audioFiles, setAudioFiles] = useState([]);
  14. const hasModel = useMemo(() => checkboxVal.includes(DageUploadType.MODEL), [checkboxVal]);
  15. const hasImg = useMemo(() => checkboxVal.includes(DageUploadType.IMG), [checkboxVal]);
  16. const hasAudio = useMemo(() => checkboxVal.includes(DageUploadType.AUDIO), [checkboxVal]);
  17. const hasVideo = useMemo(() => checkboxVal.includes(DageUploadType.VIDEO), [checkboxVal]);
  18. useImperativeHandle(ref, () => ({
  19. validate(rule, val, callback) {
  20. if (!val) {
  21. callback("请选择文件类型");
  22. }
  23. else if (hasModel &&
  24. (!modelFiles.length || !modelFiles.some((i) => i.status === "done"))) {
  25. callback("PC端模型文件不能为空");
  26. }
  27. else if (hasModel &&
  28. hasMobileModel &&
  29. (!mobileModelFiles.length ||
  30. !mobileModelFiles.some((i) => i.status === "done"))) {
  31. callback("移动端模型文件不能为空");
  32. }
  33. else if (hasImg &&
  34. (!imgFiles.length || !imgFiles.some((i) => i.status === "done"))) {
  35. callback("图片文件不能为空");
  36. }
  37. else if (hasVideo &&
  38. (!videoFiles.length || !videoFiles.some((i) => i.status === "done"))) {
  39. callback("视频文件不能为空");
  40. }
  41. else if (hasAudio &&
  42. (!audioFiles.length || !audioFiles.some((i) => i.status === "done"))) {
  43. callback("音频文件不能为空");
  44. }
  45. callback();
  46. },
  47. setFileList(list) {
  48. const stack = {
  49. [DageUploadType.MODEL]: [],
  50. [DageUploadType.MOBILE_MODEL]: [],
  51. [DageUploadType.IMG]: [],
  52. [DageUploadType.AUDIO]: [],
  53. [DageUploadType.VIDEO]: [],
  54. };
  55. list.forEach((item) => {
  56. stack[item.dType].push(item);
  57. });
  58. Object.keys(stack).forEach((key) => {
  59. const list = stack[key];
  60. if (!list.length)
  61. return;
  62. switch (key) {
  63. case DageUploadType.MODEL:
  64. setModelFiles(list);
  65. break;
  66. case DageUploadType.MOBILE_MODEL:
  67. setMobileModelFiles(list);
  68. break;
  69. case DageUploadType.IMG:
  70. setImgFiles(list);
  71. break;
  72. case DageUploadType.AUDIO:
  73. setAudioFiles(list);
  74. break;
  75. case DageUploadType.VIDEO:
  76. setVideoFiles(list);
  77. break;
  78. }
  79. });
  80. },
  81. }));
  82. const handleCheckbox = useCallback((val) => {
  83. onChange === null || onChange === void 0 ? void 0 : onChange(val.join(","));
  84. }, [onChange]);
  85. const handleFileChange = useCallback((method, list) => {
  86. method(list);
  87. }, []);
  88. useEffect(() => {
  89. if (!onFileChange)
  90. return;
  91. onFileChange([
  92. ...(hasModel ? modelFiles : []),
  93. ...(hasModel && hasMobileModel ? mobileModelFiles : []),
  94. ...(hasImg ? imgFiles : []),
  95. ...(hasVideo ? videoFiles : []),
  96. ...(hasAudio ? audioFiles : []),
  97. ]);
  98. }, [
  99. hasMobileModel,
  100. modelFiles,
  101. mobileModelFiles,
  102. imgFiles,
  103. videoFiles,
  104. audioFiles,
  105. hasModel,
  106. hasImg,
  107. hasVideo,
  108. hasAudio,
  109. onFileChange,
  110. ]);
  111. return (_jsxs("div", { className: "dage-file-checkbox", children: [_jsx(Checkbox.Group, { disabled: disabled, value: checkboxVal, options: DAGE_FILE_CHECKBOX_OPTIONS, style: {
  112. display: "flex",
  113. alignItems: "center",
  114. height: "32px",
  115. }, onChange: handleCheckbox }), hasModel && (_jsxs(_Fragment, { children: [_jsxs(FileCheckboxItem, { className: "dage-file-checkbox__item", children: [_jsx("p", { children: "PC\u7AEF\u6A21\u578B\uFF1A" }), _jsx(DageUpload, { disabled: disabled, value: modelFiles, action: action, dType: DageUploadType.MODEL, maxCount: maxModelCount, maxSize: 500, tips: "\u4EC5\u652F\u63014dage\u683C\u5F0F\u7684\u6A21\u578B\u6587\u4EF6\uFF0C\u5927\u5C0F\u4E0D\u80FD\u8D85\u8FC7500M", onChange: handleFileChange.bind(undefined, setModelFiles) })] }), hasMobileModel && (_jsxs(FileCheckboxItem, { className: "dage-file-checkbox__item", children: [_jsx("p", { children: "\u79FB\u52A8\u7AEF\u6A21\u578B\uFF1A" }), _jsx(DageUpload, { disabled: disabled, value: mobileModelFiles, action: action, dType: DageUploadType.MOBILE_MODEL, maxCount: maxMobileModelCount, maxSize: 1000, tips: "\u4EC5\u652F\u6301zip\u683C\u5F0F\u7684\u538B\u7F29\u5305\uFF0C\u5927\u5C0F\u4E0D\u80FD\u8D85\u8FC71000M", onChange: handleFileChange.bind(undefined, setMobileModelFiles) })] }))] })), hasImg && (_jsxs(FileCheckboxItem, { className: "dage-file-checkbox__item", children: [_jsx("p", { children: "\u56FE\u7247\uFF1A" }), _jsx(DageUpload, { disabled: disabled, value: imgFiles, action: action, dType: DageUploadType.IMG, maxCount: maxImgCount, maxSize: 20, tips: "\u652F\u6301png\u3001jpg\u548Cjpeg\u683C\u5F0F\uFF1B\u6700\u592720M\uFF0C\u6700\u591A9\u5F20", onChange: handleFileChange.bind(undefined, setImgFiles) })] })), hasAudio && (_jsxs(FileCheckboxItem, { className: "dage-file-checkbox__item", children: [_jsx("p", { children: "\u97F3\u9891\uFF1A" }), _jsx(DageUpload, { disabled: disabled, value: audioFiles, action: action, dType: DageUploadType.AUDIO, maxCount: maxAudioCount, maxSize: 10, tips: "\u4EC5\u652F\u6301MP3\u683C\u5F0F\u7684\u97F3\u9891\u6587\u4EF6\uFF0C\u5927\u5C0F\u4E0D\u5F97\u8D85\u8FC710MB", onChange: handleFileChange.bind(undefined, setAudioFiles) })] })), hasVideo && (_jsxs(FileCheckboxItem, { className: "dage-file-checkbox__item", children: [_jsx("p", { children: "\u89C6\u9891\uFF1A" }), _jsx(DageUpload, { disabled: disabled, value: videoFiles, action: action, dType: DageUploadType.VIDEO, maxCount: maxVideoCount, maxSize: 500, tips: "\u4EC5\u652F\u6301MP4\u683C\u5F0F\u7684\u89C6\u9891\u6587\u4EF6\uFF0C\u5927\u5C0F\u4E0D\u5F97\u8D85\u8FC7500MB", onChange: handleFileChange.bind(undefined, setVideoFiles) })] }))] }));
  116. });
  117. export * from "./types";
  118. export * from "./constants";