siam-ui-utils 2.0.27 → 2.0.28
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json
CHANGED
package/src/App.css
CHANGED
package/src/App.jsx
CHANGED
|
@@ -48,6 +48,7 @@ const App = () => {
|
|
|
48
48
|
maxFiles={7}
|
|
49
49
|
nameFileLabel="Subir archivos"
|
|
50
50
|
capture="environment"
|
|
51
|
+
onFilesSelectedSelfie
|
|
51
52
|
/>
|
|
52
53
|
</AccordionBody>
|
|
53
54
|
</AccordionItem>
|
|
@@ -62,9 +63,7 @@ const App = () => {
|
|
|
62
63
|
onChangeFiles={() => {
|
|
63
64
|
console.log('onChange');
|
|
64
65
|
}}
|
|
65
|
-
|
|
66
|
-
console.log('MAXIMO ARCHIVO PERMITIDO :>> ');
|
|
67
|
-
}}
|
|
66
|
+
classNames="custom-dropzone-uploader-dni-digital"
|
|
68
67
|
/>
|
|
69
68
|
</AccordionBody>
|
|
70
69
|
</AccordionItem>
|
|
@@ -13,6 +13,7 @@ export const DropzoneUploaderDniDigital = ({
|
|
|
13
13
|
onChangeFiles,
|
|
14
14
|
totalFiles,
|
|
15
15
|
label = 'Cargar Dni',
|
|
16
|
+
maxFiles = 2,
|
|
16
17
|
maxSize = 2,
|
|
17
18
|
onMaxFileSizeError = () => {
|
|
18
19
|
alert('El archivo supera el tamaño máximo');
|
|
@@ -47,7 +48,6 @@ export const DropzoneUploaderDniDigital = ({
|
|
|
47
48
|
|
|
48
49
|
const CustomPreview = ({ fileWithMeta }) => {
|
|
49
50
|
const { meta, remove } = fileWithMeta;
|
|
50
|
-
console.log('meta.size :>> ', meta.size);
|
|
51
51
|
if (meta.size / (1024 * 1024) > maxSize) {
|
|
52
52
|
onMaxFileSizeError();
|
|
53
53
|
remove();
|
|
@@ -103,7 +103,8 @@ export const DropzoneUploaderDniDigital = ({
|
|
|
103
103
|
};
|
|
104
104
|
|
|
105
105
|
const Input = ({ accept, onFiles, getFilesFromEvent }) => {
|
|
106
|
-
const text =
|
|
106
|
+
const text =
|
|
107
|
+
totalFiles > 0 ? `${maxFiles - totalFiles} archivos más` : `${label}`;
|
|
107
108
|
return (
|
|
108
109
|
<>
|
|
109
110
|
<Button
|
|
@@ -135,7 +136,7 @@ export const DropzoneUploaderDniDigital = ({
|
|
|
135
136
|
<div className={classNames}>
|
|
136
137
|
<Dropzone
|
|
137
138
|
disableUpload={false}
|
|
138
|
-
maxFiles={totalFiles <
|
|
139
|
+
maxFiles={totalFiles < maxFiles ? maxFiles : 0}
|
|
139
140
|
maxSize={maxSize} // en megas
|
|
140
141
|
InputComponent={Input}
|
|
141
142
|
PreviewComponent={CustomPreview}
|
package/src/tomar-foto/index.jsx
CHANGED
|
@@ -1,66 +1,69 @@
|
|
|
1
|
-
import { useState } from 'react'
|
|
2
|
-
import { Row } from 'reactstrap'
|
|
3
|
-
import { DropzoneUploader, Colxx } from '../'
|
|
4
|
-
import { TAKE_PHOTO } from '../constants'
|
|
5
|
-
import imgHacerFoto from '../assets/img/take-photo.png'
|
|
1
|
+
import { useState } from 'react';
|
|
2
|
+
import { Row } from 'reactstrap';
|
|
3
|
+
import { DropzoneUploader, Colxx } from '../';
|
|
4
|
+
import { TAKE_PHOTO } from '../constants';
|
|
5
|
+
import imgHacerFoto from '../assets/img/take-photo.png';
|
|
6
6
|
|
|
7
7
|
// eslint-disable-next-line react/prop-types
|
|
8
|
-
export const TomarFoto = ({
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
8
|
+
export const TomarFoto = ({
|
|
9
|
+
onFilesSelectedSelfie = () => {},
|
|
10
|
+
isMobile = false,
|
|
11
|
+
}) => {
|
|
12
|
+
const [filesTotalSelectedSelfie, setTotalFilesSelectedSelfie] = useState(0);
|
|
13
|
+
const {
|
|
14
|
+
LOAD_SELFIE_WITH_IDENTITY_CARD_MESSAGE,
|
|
15
|
+
MESSAGE_SELFIE_ONLY_CAN_TAKE_FROM_CELLPHONE,
|
|
16
|
+
TAKE_PHOTO_MESSAGE,
|
|
17
|
+
} = TAKE_PHOTO;
|
|
15
18
|
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
19
|
+
const handleFilesSelectedSelfie = (files) => {
|
|
20
|
+
setTotalFilesSelectedSelfie(files.length);
|
|
21
|
+
onFilesSelectedSelfie(files);
|
|
22
|
+
};
|
|
20
23
|
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
}
|
|
24
|
+
return (
|
|
25
|
+
<>
|
|
26
|
+
<Row className="pt-2 ml-4">
|
|
27
|
+
<Colxx xxs="11" md="5">
|
|
28
|
+
{LOAD_SELFIE_WITH_IDENTITY_CARD_MESSAGE}
|
|
29
|
+
</Colxx>
|
|
30
|
+
</Row>
|
|
31
|
+
<Row className="pt-2 ml-2">
|
|
32
|
+
<Colxx xxs="12" md="9">
|
|
33
|
+
{isMobile ? (
|
|
34
|
+
<>
|
|
35
|
+
<Colxx xxs="12" className="text-center">
|
|
36
|
+
{filesTotalSelectedSelfie === 0 && (
|
|
37
|
+
<img
|
|
38
|
+
style={{ width: '97%' }}
|
|
39
|
+
alt="hacerFotoDNI"
|
|
40
|
+
src={imgHacerFoto}
|
|
41
|
+
/>
|
|
42
|
+
)}
|
|
43
|
+
<DropzoneUploader
|
|
44
|
+
className="pt-2 ml-2"
|
|
45
|
+
maxFiles={1}
|
|
46
|
+
onChangeFiles={handleFilesSelectedSelfie}
|
|
47
|
+
totalFiles={filesTotalSelectedSelfie}
|
|
48
|
+
accept="image/jpg,image/jpeg"
|
|
49
|
+
capture="environment"
|
|
50
|
+
nameFileLabel={TAKE_PHOTO_MESSAGE}
|
|
51
|
+
/>
|
|
52
|
+
</Colxx>
|
|
53
|
+
</>
|
|
54
|
+
) : (
|
|
55
|
+
<h2
|
|
56
|
+
className={'view-icon iconsminds-smartphone-4 ml-2 mr-2'}
|
|
57
|
+
style={{
|
|
58
|
+
color: 'red',
|
|
59
|
+
margin: '10px 10px 0px 10px',
|
|
60
|
+
}}
|
|
61
|
+
>
|
|
62
|
+
{MESSAGE_SELFIE_ONLY_CAN_TAKE_FROM_CELLPHONE}
|
|
63
|
+
</h2>
|
|
64
|
+
)}
|
|
65
|
+
</Colxx>
|
|
66
|
+
</Row>
|
|
67
|
+
</>
|
|
68
|
+
);
|
|
69
|
+
};
|