\r\n
\r\n
請選擇證件
\r\n \r\n\r\n {/* {userRef.IPRegion !== \"CN\" && ( */}\r\n
\r\n
\r\n
\r\n {/* )} */}\r\n\r\n
\r\n {/*
*/}\r\n
\r\n
\r\n\r\n \r\n
\r\n
\r\n
\r\n \r\n\r\n {/*
\r\n \r\n
*/}\r\n
\r\n \r\n );\r\n}\r\n\r\nexport default UserClassification;\r\n","export default \"data:image/png;base64,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\"","import React from \"react\";\r\n\r\nexport const PrettyPrintJson = ({ data }) => {\r\n return (
{JSON.stringify(data, null, 2)});\r\n};\r\n\r\nexport const ReqFieldIcon = () => {\r\n return (
*)\r\n};\r\n\r\nexport const FBLabel = (props) => {\r\n return (
)\r\n};\r\n\r\nexport const PropIsExist = (obj, PropName) => PropName && PropName.split('.').reduce((a, b) => (a || {})[b], obj) !== undefined;\r\n\r\n\r\nexport const cssFormInput = (ErrMsg) => {\r\n return 'form-control' + (ErrMsg ? ' is-invalid' : '');\r\n};\r\n\r\nexport const InvalidFieldStyle = (ErrorFieldName) => ErrorFieldName ? \"is-invalid\" : \"\";\r\n\r\nexport const GetIDCardOriginName = (Code) => {\r\n switch (Code?.toUpperCase() ?? \"\") {\r\n case \"HKG\": return \"中國香港身份證\";\r\n case \"CHN\": return \"中國內地身份證\";\r\n case \"OTHER\": return \"其他國家證件\";\r\n default:\r\n return \"\";\r\n }\r\n};\r\n","import React, { useState, useRef, useEffect } from \"react\";\r\nimport { library } from '@fortawesome/fontawesome-svg-core';\r\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\r\nimport { faCircle, faSquare, faTrashAlt, faSpinner, faCheckCircle } from '@fortawesome/free-solid-svg-icons'\r\nimport { faTimesCircle } from '@fortawesome/free-regular-svg-icons'\r\nimport AOSService from \"../../services/AOSServices\";\r\nimport { GetIDCardOriginName } from '../../services/Utils';\r\nimport Compress from \"compress.js\";\r\n\r\nimport \"./IDCardUploader.css\";\r\nimport back from '../../assets/IDCard_back.png';\r\nimport front from '../../assets/IDCard_front.png';\r\nimport sam1 from '../../assets/sample_1.png';\r\nimport sam2 from '../../assets/sample_2.png';\r\nimport sam3 from '../../assets/sample_3.png';\r\nimport sam4 from '../../assets/sample_4.png';\r\n\r\nimport { setLocale } from \"yup\";\r\n\r\nconst IDCardUploader = React.memo(({ UserRef, onIDCardReady }) => {\r\n library.add(faCircle, faSquare, faTrashAlt, faSpinner, faCheckCircle, faTimesCircle);\r\n\r\n const DocStatus = useRef({ Front: false, Back: false });\r\n\r\n const FileChangeHandler = ({ ImgName, Status }) => {\r\n if (ImgName.toLowerCase() === \"front\") {\r\n DocStatus.current.Front = Status;\r\n } else if (ImgName.toLowerCase() === \"back\") {\r\n DocStatus.current.Back = Status;\r\n }\r\n onIDCardReady(DocStatus.current.Front && DocStatus.current.Back);\r\n };\r\n\r\n const IDCardUploadButton = ({ UserRef, Side, BGImage, Title, onFileChanged }) => {\r\n const compress = new Compress();\r\n const initialRender = useRef(true);\r\n const [uploadProcess, setUploadProcess] = useState(0);\r\n const [file, setFile] = useState(\"\");\r\n const [loading, setLoading] = useState(false);\r\n const inputFileRef = useRef();\r\n\r\n useEffect(() => {\r\n if (initialRender.current) {\r\n //console.log(`${Side} file or IDCardImage changed`, \"useEffect\");\r\n\r\n if (!file && UserRef.IDCardOrigin && UserRef.RefCode) {\r\n AOSService.GetIDCard(UserRef.IDCardOrigin, UserRef.RefCode, Side)\r\n .then(d => {\r\n const base64 = btoa(\r\n new Uint8Array(d).reduce(\r\n (data, byte) => data + String.fromCharCode(byte),\r\n '',\r\n ),\r\n );\r\n if (base64) {\r\n onFileChanged({ ImgName: Side, Status: true });\r\n setFile(\"data:;base64,\" + base64);\r\n }\r\n });\r\n }\r\n initialRender.current = false;\r\n }\r\n\r\n return () => {\r\n //console.log(\"unmount IDCardUploadButton\", \"useEffect\")\r\n if (file) URL.revokeObjectURL(file);\r\n };\r\n });\r\n\r\n const showFileDialog = (event) => {\r\n inputFileRef.current.click();\r\n };\r\n\r\n const deleteImage = () => {\r\n onFileChanged({ ImgName: Side, Status: false });\r\n setFile(null);\r\n };\r\n\r\n const handleChange = (event) => {\r\n const fileObject = event.target.files[0];\r\n if (!fileObject) return;\r\n renderImage([fileObject]);\r\n };\r\n\r\n const renderImage = (fileObject) => {\r\n compress.compress(fileObject, {\r\n size: 2, // the max size in MB, defaults to 2MB\r\n quality: .90, // the quality of the image, max is 1,\r\n maxWidth: 1920, // the max width of the output image, defaults to 1920px\r\n maxHeight: 1920, // the max height of the output image, defaults to 1920px\r\n resize: true, // defaults to true, set false if you do not want to resize the image width and height\r\n rotate: false, // See the rotation section below\r\n }).then((data) => {\r\n // returns an array of compressed images\r\n //console.log(data[0], \"compress aynce\");\r\n const img = data[0];\r\n const base64str = img.data;\r\n const imgExt = img.ext;\r\n const resizedFile = Compress.convertBase64ToFile(base64str, imgExt);\r\n resizedFile.fileName = img.alt;\r\n setFile(URL.createObjectURL(resizedFile));\r\n\r\n setLoading(true);\r\n AOSService.UploadID(UserRef.IDCardOrigin, UserRef.RefCode, Side, resizedFile,\r\n (event) => {\r\n setUploadProcess(Math.round((100 * event.loaded) / event.total));\r\n }).then(req => {\r\n if (req && !req.Result) {\r\n switch (req.Info) {\r\n case 1:\r\n alert(`上傳失敗檔案格式不支援，請重新上載`);\r\n break;\r\n case 2:\r\n alert(`身份證號已經註冊開戶`);\r\n break;\r\n default:\r\n alert(`上傳失敗或證件文字不清晰，請重新上載`);\r\n }\r\n deleteImage();\r\n } else {\r\n onFileChanged({ ImgName: Side, Status: true });\r\n }\r\n\r\n setLoading(false);\r\n });\r\n });\r\n\r\n };\r\n\r\n const LoadingPanel = () => {\r\n return (\r\n
\r\n );\r\n }\r\n\r\n return (\r\n <>\r\n {file ? (\r\n
\r\n {loading && (
)}\r\n
\r\n
\r\n
\r\n \r\n \r\n \r\n {uploadProcess > 0 && uploadProcess < 100 && (\r\n
\r\n \r\n {uploadProcess}%\r\n \r\n \r\n )}\r\n
\r\n
\r\n ) : (\r\n
\r\n
\r\n
\r\n
{Title}
\r\n
\r\n
\r\n
\r\n )}\r\n \r\n );\r\n };\r\n\r\n return (\r\n
\r\n
\r\n
上傳證件 ({GetIDCardOriginName(UserRef.IDCardOrigin)})
\r\n \r\n
\r\n \r\n
\r\n\r\n
\r\n \r\n
\r\n\r\n
\r\n\r\n
\r\n
\r\n
\r\n \r\n 正确示例\r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n 边角缺失\r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n 信息模糊\r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n 闪光强烈\r\n
\r\n
\r\n\r\n\r\n
\r\n {/* {docIDCardFront && (
{docIDCardFront.length})} */}\r\n
\r\n 1. 拍摄时请将证件平放，手机横向拍摄;
\r\n 2. 确保身份证 边框完整、文字清晰可见;
\r\n 3. 若点击上传无反应，请先确认是否开启相机权限。\r\n
\r\n\r\n
\r\n
\r\n );\r\n});\r\n\r\nexport default IDCardUploader;","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAZcAAADgCAMAAAD46NvyAAAByFBMVEX///8AAADh6PL/x7Dy8vV0U0////8KmP/4//j///+IVlb3+P1jZ3H////////29vjp7PXm6/L9/f/////19fz+/fz///////////////////////////8Tnf/////////////////////8w6z////y+f9Qt//////////////u8fZ6V1T///+R0f/4/P781ML8z7qScGvl5uyHiZGidm7/////////28r////////w7e3///+QaGN+YFz////////F6P/UoZD//////////fv++Pbq5ufr4N/+/v4/sP8ko//////////////////o9f/h3d/0183FwsW8r7Hnsp7///////////////////+s3v/Vysn///////////+l2//0vqi1n57////////////////////Q0tiXmaGrlJGkiIaMXlz////k6vTPubfBkoSVfXr/////////8erb0c+lp63////////////////39vb/6uD/4dOzgnj///////////////91d4HZ8P+34/////////99yv9pwP/////////+//7r5+atmJfz8/b////////c1NPUycfTx8e7qqj6//r///////9XjA5fAAAAl3RSTlNNAE1NTU1JTR8bTU1NCRFNTU1Nuk1N79+Vo2zrek1e+sAVT01fTU38QvZNTVdNTU1NTU1NTedoTdiaTVpNTfNRTU0F4eFNTU3MTU2zgHViTU1NTU1N7dPGhVRNTamLcU1NTUe9nZBlTU1NTU0CTk1NTa14TU1NGA0B5OFNTU0uE86gTU1NMiVNTTo2KsBoVD00oZOReDYhMwUwKQAADbNJREFUeNrs1t1r01AYx/Gn6vElUovDqLPokKFTo4PAFBcStYV2eqGEdr4RB66yi6alK1KcN24XWnV64ZXm3zXqNN3WvLQ9Jzng73MZcnW+POc5dHSx6IUorlzMgSAb/QuhDr9p06IXbuZhDsTIn53xQs09/UFXvQhPcyDGt8delEfkoUsWGqe9KGcju8zhHhNl+/H4XYpr2Pui5F8k6pKDtF1fmR7mPrpI6Ry6SAld5IQucoruUt46dhTEO7ZVTt6lvdE/TJCOxma+naxLfhNV0tT4Wk7Spbw9RZAmtf82vkv7O0HaNt/G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\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAZcAAADgCAMAAAD46NvyAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAJBQTFRF////4unz8fT56O31/f397vL48PT55ev05+317/P45Or0/v7/4+rz7fH36u/29ff77PH36/D35ez06e72+Pr85uz18/b67PD38PP5/Pz+/v//4+r06+/39vj75Ov07fH47/L47fL48vX6/P3++fv9+/z9+Pn8/f3+/v7++fr88vX59fj76e/2+/z+//79////hIC1HQAAADB0Uk5T//////////////////////////////////////////////////////////////8AYqXQeAAAB8pJREFUeNrs3dmaojgAhmEEw1YKKO5LaW1de9f9393odM90CwFREknJ9x/NU0fpvJOFbFpWab6IpljWTWG61pEsqD9tLLVCBepy+Vla73NcvmN7oR+jH8OF+v82MlSTmVzUBy4ElytzscilUt2FurpgulmaQhfq6uIyVVx+EZKmYApdYGl0lCn4O1VkqAvNpVkY2gsu5OjQf8yFbsxMF+qIfozgggvBBReCCy64GOoyx4X2Qiq4/BL4svb/wW6lQS6/HThxgQvBBReCCy4EF4ILLgQXXAguuOCCC8EFF4ILLgQXXHDBheCCC8EFF7Uuz6PYFoN07C07nc7SG6cDYcejZwwadHmdiPS2I8ttKiavODTgMo+F0ymPI+K5ln9e3zEx/W7jLg/xZtypkvEmflDP0jEz/YZdRjP/hNL6s5FiF8dQF6dRl3U/PLG8YX+t1KVjqku3OZf36VlFnr7jotFlnZxd6GSNiyaXRxHWKHUoHnHR4PJy79cst3//gotql1GioOTJCBe1LhNfSdH9CS4KXZ6EssKLJ1xUufwYKCz94AfflWpcYrUV4cSsw6hwmQxLS9Pz/HSVbITYCrFJVqnv9Y6Uf1hzkOmybrnLW+lHS2/orPoicF17H9cNRH/lDI/IhG+s89d1sUvqOPSju2D2i+RP3FlwF/nlmnb1AnziImMprNulP9jmTP7YbAf+skTGpr3UcXkrai3eh3CLUH7TuOLDK24xVbuyOS6SIb+gN/KioBzlN00QFcqE1Qb/G9qLZIIsn4ndRoFdNUF0WzQrqzJd/qQfk3xOSr9beo6wT4lwCvpC54fVtihxeZJ+5XtT1z4t7rSgMxs84XKGi5A2lq19erYFTUbgcrrLRDZYR659TtxIPoGY4HKqy0iysO8l57HsYBJpX+b/2Y9ZqK6DxVW6vEi2wYZ39vm5k87tkhfay0ku95IzesKuEyE9CXiPyykuj/lebBzY9RLIYPxHXE5wyc/FhsKuGzGUzslucKnqss5Nn7z6LDsYyeAfrmkvlV1yg36Y2CqSSKbLCS5VXd5zlRe5SlzcSNKTveNS0SV3BtlRw7KDkSy5TXGp5rLODS6BrSqBZIhZ41LJJXvepDe11WXaO+McCS77FZhQVy9W0JOFI1wquMyy22DCVhmR3yib4XLc5SH7qR/ZapOfk/kn38Gct88l1jfoFw79VbaUb1reXjaam4uswWxaoVLLZT7W3FxkDWY8v+beS4lLthv7cJW7uB8ndmRXs7JZwyWzkrwUtvqIZUt3+mu4ZD4vfFeDi+ufcnXkBhfLes2eJbJ1JH8C6pX2UuoyyV7u1uKSv3A+KRvrGV+yw4uWbkzWkQnaS6lLqmXf5fg+TIpLmcvz4eJVT083tuvIsqvKt8+4lLiMMoctAk0uQe4IxqgF07HzXeLMaeSZJpdZ7sRyTHspcTm8tuetXE0u7sqrcrGvoK0Yeh9Zo8vhdMzv27rS96tMyD6lx4xbeH//8IMvFdpcRJr9gK3eG7TwvYvD2loF2lyC1fkT5Ra+D3O4yD91tbm42bNQY0lpFvKl/Ra6HI7GG40u2e03T16gBS77HC7A6xtedgNM9pkG+rESl05jLh3aS2WXrUaXLS7ftr0s6MdMHV8+cTFyPsZ3pYHfLwXpt8/FvO99yYdl1XcUjevGrmZ9rN5Bvu5lo3Od37D15JJJGfsvDe6/sC9m8H7lAhcT9/dpL5yH4fzYSefHPnHhvKWZLsadT8bl33Ce30wXA++/WD/Pmilf2TuK3Bcz08XE+5W4GHwfedFuF0Pv72dseO/CmPcuMnOB1rl8i/dhWtiP8Z6SoS68P2amC+/1GerC+5ZmuvAerKEuvJ9spgvvjRvqwvv8Zrpc9PcscDH49180rEouPq/Phd9LMtSF3xcz0+Xiv8eHC79f+a1d+L1XQ134fWQzXfg9cUNdrFg6h+rcRtU/ZYLotuDa2zC2cDnPxZrIh+uOFwVVejM3iLyi24jhxMLlXBfrraAP6ngfwi2ncV3xUajS6b1ZuJzvkrnYd3AS0x9sZ0U07mw78Jcll3drXdsz86K4zvvIEphecUlCP7oLcjbuLLiL/LDsn9C7Qhat7yjKurLyGh46q74IfvdprhuI/soZ9sr/AWG9TqyF711IB/9haWl6np+uko0QWyE2ySr1vSMqnWHNIb+F78PIp8tq/wd16k6QcfnvA3OgsPSD2p+TuPy/JCOUFV7UX3zB5a9BxldSdF/F1yQuf+/HJApKnijZb8HlYAfzvm6T8e/V7E7icphHEdYodSgeFa1m4JLN+vzOLFF3Tozvynzep2cVearysGsfF1mb6Z/am4V9tWcqu46Z6TbqspuazU6ZAfgz9Ydeuibmouv88jzEm3EllPEmbsvdScsAl13msTg2/joinmNxYZd9XicilW/f36Zi8opDQy77PI9iWwzSsbffnVx643Qg7Hj0jEHDLgQXXAguuOCCC8EFF4ILLgQXXHDBhZzrcvBHaqhpF/mfqSFcSAnAT1yMdKG94EJwwYXgggvBheCCC8EFF9KIS5cqaiBd2gsuhPEFF6KV5ava38llR5diF2AabS7FLl97QNIQS4kLTaY5leN1X/GdBqISpXqb+CKaYt0o9SSqXBQ3NAILLrgYBTPHxdAG8wWLgS5f/wgwAIyCe9TXwCpGAAAAAElFTkSuQmCC\"","export default \"data:image/png;base64,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\"","export default \"data:image/png;base64,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\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAARgAAADICAMAAAAEGQ4lAAAA4VBMVEX////4+Pj4+Pj5+fn4+Pj39/fz6+3j7/X27Ozl7vTw6+7Z4fHx7O7o7vLY4/Lk8fbj7fTm8PXb4fDw6e3e4O7u7fDc4O/s7fHi4e3g6/Tp8PTt6O3r6e/g7fXq7vLb5vPm5O66zfDc6PPm8va+z/Dr5u3t6+/e6vTr6/Dm6/Hm5+/Z5fPe4vDo6fDg5PDp5u7w7vDg6PLk6/Pk5O/g4e7F1PHu6u7I1vHB0vHV4fLb4/HK2PHW3vDt7/LN2fHj5vDS3/LQ2vDz7e7j6PHf5vG3y/DO3PK1yfDU3PDo8vfR3PFZcbhsAAAABXRSTlMBktUrvaCgw60AAA6jSURBVHja7NU9asNAGAZh/VjGCXbhQghcqHGjMhdIky73v1C0WqGVbQ2ksJEM8yx7geGFLwvKvKg0KvIyG+WVbuTZYFfpzs698GbKSgtKB0OT8R4tKrJKiwxjGMMYZsYwwDDAMMAwwDDAMMAwwDDAMMAwwDDAMMAwwDDAMMAwwDDAMMAwwDDAMMAwwDDAMMAwwDDAMMAwwDDAMGC9ML/J9Ty4zLSXNvgeNE1T975Gx+An2EcHsL9xjD4n9aSZtMHpwcedc/KyMNfe68IcIEwdHoXpKEzy9mHmaZ6wmOTdw/R/8v/FbCBMzOJiIIyLmYlRXMyDGGWTizl1GCZZK0y73mJCiY7CJNsJ80edvS2lDYVhGD6DCgWpKIURxTIatsIIFiQyoIOlDPd/Qf13i38li1CKlsQ3ne4On35ZIfTi/y5Gj5joxdiluXhgmEVhpI9ZjOeFWJpNc8AkC0ZocugSCUM/f8higjBNuK4JBgaTTBhMab5zF1JgMV/fuxiPXDyWgXJNzGWJ6CgwapOLhBGbC4V552I8azDMsude0tSxYVgmFw2Dm6FSpkMXgzZek7omlZYp14oZ5vT0NAyjCY1kYDKYDfMldcBiPKkJMBSDXMMlPIMcXImA4c8G0TASw7xzMS7MPdSyy1GDCJf/C3OKfVMZLBeKbJrchQdluA9ajKqEZAaDAa4GihnmxLQDxnNg3rsYvY1UxYLBxQxOWseEOd1k78XWoS23Wk1KZdTmIxajc1kEAhjpBIoHJs2dmAZYy051qpAHjQjm8MV4pmqzyiztRagBRruJH6ZA4XTDNveYA6OnzD8uRk+YKu+lDS7z+fyNeqCUJgYYdSlIA01wFq3FvV0VG42QBmGkQxaDzqQC+0CUHiY2ojPgCo5LbDALuAQGam2Dgf4Cg5cWBdNuz3kspKKRTXwwaYWpSA/cIlSbYxvdzO7FfHFh1EX2Aiw9qOv7Z5jPCYzIQLHAXF1dqYpk+8w5pmGZy0uUUZhU1GKiYcxcUIVQspLIKE2BigFGWBpBkzdprgVgikWFCcqk9IyJhKH7SF3AY0pNJtl8Np8HmlqdDxq8wWOB4bk0Kg+NuqmGGZieaT4cDucgIzRF6OuBi6lCsBdi8YFFVFbQ9GU6ySJNTWQqhaPDpBWmgTHKm7n8MIyMpt/vOzAsoya7zpgRwdwLTBfuIUZZUy/QdAIy9G+DMnEsBlkMDKlwvl1XMqthmctLktn+8TflLkZZRrwXgKHbiFgA5XUT4kyQpsObqeDddOzFKIyoKIuLY2DaCANZMI6MAYuGwb10uwgjLjMOZIgG7iaQIRjouDAQuTSMS6eTt+JnxBllZIYsU61aMOhgq+y1mHZ7aO6jNaI8Q+PxGH6ezZZLkKHbqV7fwBSODkMuCqMoHKioTRAG2rYYliKxHTDzYY/2slqRy5gjG5KZ4mZqCIMsgyPDXAmMsFgwrozZzNycMkWdjNmJ/qosDoycvDQY2MtaXH5SKjMBmRpuplIhmEKcMLaLa2NuJuf4JQzm0bXwb1wY2gvCdEswGNzLM6g8bfpJNK9LPGf8DsA0KkAjpT8FDJ0yiiAuGP+VFgUzXcEBgy4IcwshDMjIZvL5BMB0IIWZ8BWGeZRTBmDudDGUYdG9bIXhDzHk0sUHEtxHxHLLCQ1shg5gOX+TvxiF6d/xYoTGXoy4RMDwETMc9s5LWRzM7Blg0OUHxjS4GZlMrZYsGFnM3jB2KuPAeKMNTLdUwsG8Wi5KAzKzGZ0yHYRpJAYmMJrgU0lhSIZtighhLsgdjMDIEYOLYZjZeGxcfkFMQzcTw+R9OWXihIFUZSdMG2BUJoUV5ZI/bYcZCQwvBlwsmF8UwzwRzDoBMHWFcfbiwNzcAIzeTFwqeEXDyNlLMHjC0MmLLL8hopHJLJf8WSZemPoBMCzjwphfMnvD/NgJU48BxnlXij5hXBiSQRzlsRe081ZCmBXC4NELMOTCNHovvbxYMFJML5F6/Po+ufguDNH0ZTMmsOEfdl81C+aeYc6yCDNWGJUxMOtPCMNPJkp17op3YLM/zJoe1nrE6GQSC+NjwOI7MCDDNLwa0dFkPtL+ML8/NQzSDEUmguYSLqX566302WDcW0l67CmNVf8majUWi3v4fp7F+O5TSRMaqFwuI42ymO5uHBuF2fq43n3GJP9xzTCS0oiOtrmz9oWJfirp4zo5H/CcNwKpBJ2fP24qB7opb3QsmUxGYax3JQMzVhgdzK3ATGKH0XclaSeMpijEUtbVsEw0TI9hZgojLvoBLwmvBAjjuGgKgwnP+dbdOJNBEIZxv3agl8inJwvGeSWQl8hCfDA6mAl+E+MUgtGCNvZoImD4/wgMDE3GgRkDjL5dx/3VZl5gkGWCl7MahbHi9ZQft28mQ22HWQkMT0ZcAg+lTufoX1SlDUzo6J1QYjLly6FxbAI31babKcMpDH21+fqq3ztA5GIeSvoNXiVmGNmLJCDaFFSmpQBMCS57NvvDwPMaYdYGxv2iagkw+QTC/KHuTnqjBoIoAN8QCsshDGbQsKMwBMIgwCQRsRSiQA7z/38Q9arKvF6NOTDTPIvtgIQ+VXe726asgymqmG5AuYCGCWGWKBuDkejCRBgkeUqwMBi9k+HRpi/WWjFYk1qAiYeS0AwslqEbZCh1h5AZlMRlSNP/JczJHZ19izBwuWnjKUE8+Uogw3o5FBbAJNUSVwxYpmA4+cokY0+uCePhSNo28lyJMr4igcaCcjEYBih+OcsimmPmw9hp+BwYpPUbPAXpgmJZLJcTq5LntAgjJdM6zIwtAV3SlO99ycJNpM0xdZivAYw9cCNNk5tIurBcUCqolsKmYDUNs5CjqqZhZh47IGTJ7nxHmi8Ko/WSwehA8k0kV6XKULJV6T3GEmGQ9g6qcpReIvUS7ZamYeDy8R0f6tcm3zMs17ol8FmGMm0dbcoxFWGMxPfXMvPmu+sKTPR2TDfwBg8wxqIwfKhv0y9q5nMTMDwMJ4xkdOkZVAyKhjATaxIGktXLpva2QwBjMigZHFUhJvNfwCx6olRhWC9w8RnGH+onMNwStAkTDCWGI4lDabJiYhpzERh5W7jXLSRgznwTGcG4zNZk3v+WedoizEkK48sR55j5MJt+0Q0+9RLmZwnGa2a9Jkxry3U3JlmnRSasGKXJYU7DGeZk0elaDRi4EIYy+laryTynjNE09RoIYBjC6OYRv1Ru8DTCYvXycZx5MZDUpQYDmatxMAnN+pPCKE1TLw4hAUyW0mDKYfTJCW56FebCp16H+cnBBBgtGcKsCdPGq2bEyWGIgml4BswLDKSuuzMWTATz0uLvtF6oDKeZgKaNlxPrMIlOz1mmCIOCEZi+l4HEkUSYeF3SWWZcmaRkmoDJnxFQJj14YArHDi5j9XKEgeQFQxeHIYvD6MKkJfO9MJj2BaMBDWHKNJRZQoaDKYHhDNMvFOaqCoM4zMWFwnjJyD+UMHt9ZR4ZpmqGLpXD8BxmKQPpcIhgzjOYc8LoLOObSYVB2quYRAVXELCUYVYrm3oxxei22mHODCbJeQXmVQswfzvH5EebOcw7gdn0XQDj//GkeRjKBKndx+THVdlyPQdGZCQRC1x8VarB7P2//hVVEhJulghzNLqcJkOJMJSBDQMVqxdblfYCk28imSqMr8088dWLLMleKYc5HMaSgQxsNFRRl0mYNv57sf8HY6b2ThVdOMEEqxLvYyDjNMDRGIiQWERFWMwlh2nnP6RrNn2anIUTTB2mMxj739akcREUi5XL1fbGXHYKwxYGpFGbcm8H5ssGbyYyLxjWS/x/U8I7315ksIkEjdsYj8f+fCPZyoYAMLzz3VXFEOZ304sfr/LeDoxT0GSJK1KRqEsOw+NerRnQbLe0YaACF2PhJjKAaapNyuWlaxRzJJXC/11AlwOJwKxWPpbswHfsdaHZFvId4TgyGO6VGmqsw+46LA7PURKywEVjMJSx4WQBkEcxnAQocLEJRvIYUZhmWjGpCOMeVCFNNojiRwR+5LtB0XiXIadRBHSPYYyF9UKY/Xc1C5t3RSYxBX4AJPt/XXeR5MxXJxrYSA4Rvu43bs/uW6gCl2Ag7b+r2TFdmCcWaMQhSB3m4wfA6BxMGudhMpj1Y7jsBgZh30TaGApDkDAlj5VdEUtIo38RMtqdKsoJ8i3Kc2SsluDxye5gIONBF928peQHaynJnHpoEOdWmBTGR+VljPMDVxA3+YR4uYDkn8O8fj2jCemzrAkp4igHRRFc/t9oUxjIaACjNHGyDoGexxbCNNa2ljAHY8wCBGOHh2KSeQYBTapzjdAjcrGmQ54WGx0jBwkMLq8Ty4PbD/4IY3lnxXOdhioOA4/dwDgNWWa0xiZK0h779gN2dtCf0lBGu+C5DXOc5XOSwKW9ZupweViCMQoiqU8J5k0Kk+Nc2zUB02j7/QSFHYc8RMlhvGaQt2EKRVM2IUt7H2zgdwkYNqcyoGqbFIQycRKZsJF6BtPWJz4Ag8Qw7DZkcZ9JGE+AItfbZxEMeu8fyzXCRE19G/0oDD7ywYk37LXpv80HU9RjnjJZ3UihMFY1/9FnhByGNAYS07Bu5sHc0+uYMqiZz63CgKb4GSHCsCugx2ccpv4li4ePpr+v1G7FTH6qzEOVUIYVk8E8TD48xS9yadGkMA19quxXe/dygyAQhVF4eEwJbKzApQ24of+iHHONEpxDYiRm1HPo4Msf2HEPr8CERU2GFzMBzOqGG8J8wznEWMbTz583F0PH7WIzP3JAs7aYsNlazOadyGMLMHyL9nwLYZYysBiEmZq9LBq9D8PvmKvLjDCNXhbdEyZM1i4uJmDgZ+rzw2Uhc5qaX0xp/8WESjwI0+jp+H9LGGGEEWaRMJAwkDCQMJAwkDCQMJAwkDCQMJAwkDCQMJAwkDCQMJAwkDCQMJAwkDCQMJAwkDCQMJAwkDCQMJAwkDCfKvXZKvWpy1apS0O2SkNyMvXBlMZsq8ZUcjO1vURD57fpXt8NqXQBlywIZISYWTQAAAAASUVORK5CYII=\"","export default \"data:image/png;base64,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\"","import styled, { css } from 'styled-components'\r\n\r\nexport const PreviewImgWrapper = styled.div`\r\n margin:0.25rem;\r\n padding:auto;\r\n height:80px;\r\n width:80px;\r\n background-color: #fff;\r\n border: 1px solid #dee2e6;\r\n border-radius: 0.25rem;\r\n position: relative;\r\n\r\n & span.Trash {\r\n position: absolute;\r\n right: -8px;\r\n top: -5px;\r\n }\r\n`;\r\n\r\nexport const PreviewImg = styled.img`\r\n padding: 0.25rem;\r\n max-width: 100%;\r\n height: auto;\r\n`;\r\n\r\nexport const DocUploadButton = styled.div`\r\n display:block;\r\n height:100%;\r\n\r\n & input {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n width: 1px;\r\n font-size: 0;\r\n opacity: 0;\r\n }\r\n\r\n ${props =>\r\n props.disabled &&\r\n css`\r\n background-color: #ececec;\r\n `};\r\n`;","import React, { Component } from \"react\";\r\nimport AOSServices from \"../../services/AOSServices\";\r\nimport { PreviewImgWrapper, PreviewImg, DocUploadButton } from \"./DocUploaderStyle\";\r\n\r\nimport { library } from '@fortawesome/fontawesome-svg-core';\r\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\r\nimport { faCircle, faSquare, faTrashAlt, faPlusCircle, faSpinner, faCheckCircle } from '@fortawesome/free-solid-svg-icons'\r\nimport { faTimesCircle } from '@fortawesome/free-regular-svg-icons'\r\nimport Compress from \"compress.js\";\r\n\r\nexport default class DocUploader extends Component {\r\n constructor(props) {\r\n super(props);\r\n\r\n this.selectFiles = this.selectFiles.bind(this);\r\n this.upload = this.upload.bind(this);\r\n this.uploadImages = this.uploadImages.bind(this);\r\n this.SelectFilesRef = this.SelectFilesRef.bind(this);\r\n this.DeleteFile = this.DeleteFile.bind(this);\r\n this.inputFilesRef = React.createRef();\r\n this.compress = new Compress();\r\n\r\n library.add(faCircle, faSquare, faTrashAlt, faSpinner, faCheckCircle, faTimesCircle);\r\n\r\n this.state = {\r\n selectedFiles: undefined,\r\n previewImages: [],\r\n progressInfos: [],\r\n message: [],\r\n\r\n imageInfos: [],\r\n processCount: 0\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n AOSServices.GetDocList(this.props.RefCode, this.props.AType).then((response) => {\r\n this.setState({\r\n imageInfos: response,\r\n });\r\n });\r\n }\r\n\r\n selectFiles(event) {\r\n const files = [...event.target.files]\r\n let images = this.state.previewImages ?? [];\r\n let resizedImgFiles = this.state.selectedFiles ?? [];\r\n\r\n this.compress.compress(files, {\r\n size: 1, // the max size in MB, defaults to 2MB\r\n quality: .90, // the quality of the image, max is 1,\r\n maxWidth: 3840, // the max width of the output image, defaults to 1920px\r\n maxHeight: 3840, // the max height of the output image, defaults to 1920px\r\n resize: true, // defaults to true, set false if you do not want to resize the image width and height\r\n rotate: false, // See the rotation section below\r\n }).then((data) => {\r\n // returns an array of compressed images\r\n\r\n for (let i = 0; i < data.length; i++) {\r\n const img = data[i];\r\n const base64str = img.data;\r\n const imgExt = img.ext;\r\n const resizedFile = Compress.convertBase64ToFile(base64str, imgExt);\r\n resizedFile.name = resizedFile.fileName = img.alt;\r\n\r\n resizedImgFiles.push(resizedFile);\r\n images.push(URL.createObjectURL(resizedFile))\r\n }\r\n\r\n const { progressInfos, message } = this.state;\r\n this.setState({\r\n progressInfos: progressInfos,\r\n message: message,\r\n selectedFiles: resizedImgFiles,\r\n previewImages: images\r\n });\r\n }).then(() => {\r\n // upload all files\r\n this.uploadImages();\r\n });\r\n }\r\n\r\n upload(idx, file) {\r\n let _progressInfos = [...this.state.progressInfos];\r\n\r\n this.setState((p) => { return { processCount: p.processCount + 1 } });\r\n AOSServices.UploadDoc(this.props.RefCode, this.props.AType, file, (event) => {\r\n _progressInfos[idx].percentage = Math.round((100 * event.loaded) / event.total);\r\n this.setState({\r\n progressInfos: _progressInfos,\r\n })\r\n })\r\n .then((r) => {\r\n this.setState((prev) => {\r\n let nextMessage = [...prev.message, \"Uploaded the image successfully: \" + file.fileName];\r\n // let _selectedFiles = prev.selectedFiles;\r\n // let removeIdx = _selectedFiles.indexOf(w => w.fileName === file.fileName);\r\n // if (removeIdx >= 0) {\r\n // _selectedFiles = _selectedFiles.splic(removeIdx, 1);\r\n // console.log(\"remove\");\r\n // }\r\n\r\n return {\r\n message: nextMessage,\r\n //selectedFiles: _selectedFiles\r\n processCount: prev.processCount - 1\r\n };\r\n });\r\n\r\n if (r && !r.Result) {\r\n throw 'Could not upload the image';\r\n }\r\n\r\n //return AOSServices.GetDocList(this.props.RefCode, this.props.AType);\r\n })\r\n .then(() => {\r\n let pc = this.state.processCount;\r\n if (pc === 0) {\r\n this.setState((prev) => {\r\n return {\r\n selectedFiles: [],\r\n previewImages: [],\r\n };\r\n });\r\n\r\n AOSServices.GetDocList(this.props.RefCode, this.props.AType)\r\n .then((files) => {\r\n this.setState({\r\n imageInfos: files,\r\n });\r\n });\r\n }\r\n })\r\n // .then((files) => {\r\n // this.setState({\r\n // imageInfos: files,\r\n // });\r\n // })\r\n .catch(() => {\r\n _progressInfos[idx].percentage = 0;\r\n this.setState((prev) => {\r\n let nextMessage = [...prev.message, \"Could not upload the image: \" + file.fileName];\r\n return {\r\n progressInfos: _progressInfos,\r\n message: nextMessage\r\n };\r\n });\r\n });\r\n };\r\n\r\n DeleteFile = (DocID) => {\r\n AOSServices.DeleteDoc(this.props.RefCode, DocID)\r\n .then((r) => {\r\n if (r && r.Result) {\r\n AOSServices.GetDocList(this.props.RefCode, this.props.AType)\r\n .then((files) => {\r\n this.setState({\r\n imageInfos: files,\r\n });\r\n });\r\n\r\n }\r\n });\r\n };\r\n\r\n SelectFilesRef = (event) => {\r\n this.inputFilesRef.current.click();\r\n };\r\n\r\n uploadImages() {\r\n const selectedFiles = this.state.selectedFiles;\r\n let _progressInfos = [];\r\n\r\n for (let i = 0; i < selectedFiles.length; i++) {\r\n _progressInfos.push({ percentage: 0, fileName: selectedFiles[i].fileName });\r\n }\r\n\r\n this.setState(\r\n {\r\n progressInfos: _progressInfos,\r\n message: [],\r\n },\r\n () => {\r\n for (let i = 0; i < selectedFiles.length; i++) {\r\n this.upload(i, selectedFiles[i]);\r\n }\r\n }\r\n );\r\n }\r\n\r\n render() {\r\n const { selectedFiles, previewImages, progressInfos, message, imageInfos } = this.state;\r\n\r\n return (\r\n
\r\n {/*
\r\n
\r\n \r\n
\r\n\r\n
\r\n \r\n Upload\r\n \r\n
\r\n
*/}\r\n\r\n {/* {progressInfos &&\r\n progressInfos.map((progressInfo, index) => (\r\n
\r\n
{progressInfo.fileName}\r\n
\r\n
\r\n {progressInfo.percentage}%\r\n \r\n
\r\n
\r\n ))} */}\r\n {/* {this.state.processCount},\r\n {this.state.selectedFiles?.length} */}\r\n {previewImages && (\r\n
\r\n\r\n
\r\n 0}>\r\n \r\n 0 ? \"rgb(240, 200, 200)\" : \"rgb(204, 0, 16)\"}\r\n transform=\"shrink-1\" />\r\n \r\n 0} type=\"file\" ref={this.inputFilesRef} multiple accept=\"image/*\" onChange={this.selectFiles} />\r\n \r\n \r\n\r\n {previewImages.map((img, i) => {\r\n return (\r\n
\r\n \r\n\r\n {progressInfos[i] && (\r\n \r\n
\r\n {progressInfos[i].percentage}%\r\n \r\n )}\r\n \r\n )\r\n })}\r\n\r\n {imageInfos &&\r\n imageInfos.map((img, index) => (\r\n
\r\n \r\n\r\n this.DeleteFile(img.ID)}>\r\n \r\n \r\n \r\n \r\n ))}\r\n