contentoh-components-library 21.4.113 → 21.4.115
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/dist/components/atoms/GeneralInput/style.js +29 -0
- package/dist/components/pages/MultipleEdition/components/ImageUploader.js +49 -28
- package/dist/components/pages/MultipleEdition/components/ImageUploaderStyles.js +8 -1
- package/dist/components/pages/MultipleEdition/components/ImageVisor.js +77 -34
- package/dist/components/pages/MultipleEdition/components/styles.js +16 -6
- package/dist/components/pages/MultipleEdition/index.js +17 -17
- package/dist/components/pages/MultipleEdition/utils.js +65 -63
- package/dist/index.js +13 -0
- package/package.json +1 -1
- package/src/components/pages/MultipleEdition/MultipleEdition.stories.js +1 -1
- package/src/components/pages/MultipleEdition/index.js +92 -65
- package/src/components/pages/MultipleEdition/utils.js +297 -124
- package/src/index.js +1 -0
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
+
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
exports.Container = void 0;
|
|
9
|
+
|
|
10
|
+
var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
|
|
11
|
+
|
|
12
|
+
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
13
|
+
|
|
14
|
+
var _variables = require("../../../global-files/variables");
|
|
15
|
+
|
|
16
|
+
var _templateObject;
|
|
17
|
+
|
|
18
|
+
var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n\n > div {\n label {\n &:before {\n outline: 1px solid ", ";\n }\n }\n }\n\n input,\n textarea {\n width: 100%;\n border: 1px solid\n ", ";\n\n font-family: ", ";\n color: ", ";\n font-weight: normal;\n font-size: 12px;\n line-height: 15px;\n padding: 10px;\n outline: none;\n border-radius: 2px;\n resize: none;\n\n &:focus {\n border: 1px solid ", ";\n }\n }\n\n select {\n background: #fafafa;\n outline: none;\n border: 1px solid\n ", ";\n width: 100%;\n cursor: pointer;\n font-family: ", ";\n color: ", ";\n font-size: 12px;\n line-height: 21px;\n padding: 10px;\n border-right: 2px solid #e33aa9;\n\n &:focus {\n border: 1px solid ", ";\n }\n }\n\n p {\n font-family: ", ";\n font-size: 12px;\n color: ", ";\n }\n\n &.audit-class {\n input,\n .quill {\n border: 1px solid #8a6caa;\n background-color: #ededfc;\n }\n }\n"])), function (_ref) {
|
|
19
|
+
var isRequired = _ref.isRequired;
|
|
20
|
+
return isRequired ? "red" : "none";
|
|
21
|
+
}, function (_ref2) {
|
|
22
|
+
var isRequired = _ref2.isRequired;
|
|
23
|
+
return isRequired ? "red" : "".concat(_variables.GlobalColors.s2);
|
|
24
|
+
}, _variables.FontFamily.AvenirNext, _variables.GlobalColors.deep_gray, _variables.GlobalColors.magenta_s2, function (_ref3) {
|
|
25
|
+
var isRequired = _ref3.isRequired;
|
|
26
|
+
return isRequired ? "red" : "".concat(_variables.GlobalColors.s2);
|
|
27
|
+
}, _variables.FontFamily.AvenirNext, _variables.GlobalColors.deep_gray, _variables.GlobalColors.magenta_s2, _variables.FontFamily.Raleway, _variables.GlobalColors.deep_gray);
|
|
28
|
+
|
|
29
|
+
exports.Container = Container;
|
|
@@ -1,38 +1,58 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
3
|
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
|
|
4
|
+
|
|
5
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
6
|
+
|
|
5
7
|
Object.defineProperty(exports, "__esModule", {
|
|
6
8
|
value: true
|
|
7
9
|
});
|
|
8
10
|
exports.default = void 0;
|
|
11
|
+
|
|
12
|
+
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
|
|
13
|
+
|
|
14
|
+
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
|
|
15
|
+
|
|
9
16
|
var _react = _interopRequireWildcard(require("react"));
|
|
17
|
+
|
|
10
18
|
var _reactDropzone = require("react-dropzone");
|
|
19
|
+
|
|
11
20
|
var _ImageUploaderStyles = require("./ImageUploaderStyles");
|
|
21
|
+
|
|
12
22
|
var _upload_file = _interopRequireDefault(require("../../../../assets/images/Icons/upload_file.svg"));
|
|
23
|
+
|
|
13
24
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
25
|
+
|
|
26
|
+
var ImageUploader = function ImageUploader(_ref) {
|
|
27
|
+
var handleNewImage = _ref.handleNewImage;
|
|
28
|
+
|
|
29
|
+
var _useState = (0, _react.useState)(null),
|
|
30
|
+
_useState2 = (0, _slicedToArray2.default)(_useState, 2),
|
|
31
|
+
image = _useState2[0],
|
|
32
|
+
setImage = _useState2[1];
|
|
33
|
+
|
|
34
|
+
var onDrop = function onDrop(acceptedFiles) {
|
|
20
35
|
if (acceptedFiles.length === 1) {
|
|
21
36
|
showImage(acceptedFiles[0]);
|
|
22
37
|
}
|
|
23
38
|
};
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
reader
|
|
39
|
+
|
|
40
|
+
var showImage = function showImage(file) {
|
|
41
|
+
var reader = new FileReader();
|
|
42
|
+
|
|
43
|
+
reader.onload = function () {
|
|
27
44
|
setImage(reader.result);
|
|
28
45
|
getImageDimensions(reader.result);
|
|
29
46
|
};
|
|
47
|
+
|
|
30
48
|
reader.readAsDataURL(file);
|
|
31
49
|
};
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
img
|
|
35
|
-
|
|
50
|
+
|
|
51
|
+
var getImageDimensions = function getImageDimensions(dataURL) {
|
|
52
|
+
var img = new Image();
|
|
53
|
+
|
|
54
|
+
img.onload = function () {
|
|
55
|
+
var image = {
|
|
36
56
|
src: dataURL,
|
|
37
57
|
ext: img.src.includes("image/jpeg") ? "jpg" : "png",
|
|
38
58
|
width: img.width,
|
|
@@ -40,20 +60,19 @@ const ImageUploader = _ref => {
|
|
|
40
60
|
};
|
|
41
61
|
handleNewImage(image);
|
|
42
62
|
};
|
|
63
|
+
|
|
43
64
|
img.src = dataURL;
|
|
44
65
|
};
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
|
|
55
|
-
...getInputProps()
|
|
56
|
-
}), image ? /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
|
|
66
|
+
|
|
67
|
+
var _useDropzone = (0, _reactDropzone.useDropzone)({
|
|
68
|
+
onDrop: onDrop
|
|
69
|
+
}),
|
|
70
|
+
getRootProps = _useDropzone.getRootProps,
|
|
71
|
+
getInputProps = _useDropzone.getInputProps,
|
|
72
|
+
isDragActive = _useDropzone.isDragActive;
|
|
73
|
+
|
|
74
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_ImageUploaderStyles.ImageUploaderContainer, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, getRootProps()), {}, {
|
|
75
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("input", (0, _objectSpread2.default)({}, getInputProps())), image ? /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
|
|
57
76
|
className: "imageLoaded",
|
|
58
77
|
src: image,
|
|
59
78
|
alt: "Imagen Cargada"
|
|
@@ -71,6 +90,8 @@ const ImageUploader = _ref => {
|
|
|
71
90
|
})]
|
|
72
91
|
})]
|
|
73
92
|
})]
|
|
74
|
-
});
|
|
93
|
+
}));
|
|
75
94
|
};
|
|
76
|
-
|
|
95
|
+
|
|
96
|
+
var _default = ImageUploader;
|
|
97
|
+
exports.default = _default;
|
|
@@ -1,11 +1,18 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
+
|
|
4
5
|
Object.defineProperty(exports, "__esModule", {
|
|
5
6
|
value: true
|
|
6
7
|
});
|
|
7
8
|
exports.ImageUploaderContainer = void 0;
|
|
9
|
+
|
|
8
10
|
var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
|
|
11
|
+
|
|
9
12
|
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
13
|
+
|
|
10
14
|
var _templateObject;
|
|
11
|
-
|
|
15
|
+
|
|
16
|
+
var ImageUploaderContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: space-between;\n width: 100%;\n height: 100%;\n cursor: pointer;\n color: var(--magenta-main, #e33aa9);\n text-align: center;\n font-family: Roboto;\n font-size: 12px;\n font-style: normal;\n font-weight: 400;\n line-height: normal;\n padding: 49px 32px;\n & > div {\n & > p {\n margin-bottom: 10px;\n }\n & > span {\n color: var(--grey-medium, #cbcbcb);\n font-size: 10px;\n font-weight: 400;\n }\n }\n"])));
|
|
17
|
+
|
|
18
|
+
exports.ImageUploaderContainer = ImageUploaderContainer;
|
|
@@ -1,54 +1,80 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
+
|
|
4
5
|
Object.defineProperty(exports, "__esModule", {
|
|
5
6
|
value: true
|
|
6
7
|
});
|
|
7
8
|
exports.default = exports.ImageVisor = void 0;
|
|
9
|
+
|
|
10
|
+
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
|
|
11
|
+
|
|
12
|
+
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
|
|
13
|
+
|
|
14
|
+
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
|
|
15
|
+
|
|
8
16
|
var _react = require("react");
|
|
17
|
+
|
|
9
18
|
var _reactImageFallback = _interopRequireDefault(require("react-image-fallback"));
|
|
19
|
+
|
|
10
20
|
var _styles = require("./styles.js");
|
|
21
|
+
|
|
11
22
|
var _ImageUploader = _interopRequireDefault(require("./ImageUploader.js"));
|
|
23
|
+
|
|
12
24
|
var _utils = require("../../../../global-files/utils.js");
|
|
25
|
+
|
|
13
26
|
var _defaultProductImage = _interopRequireDefault(require("../../../../assets/images/defaultImages/defaultProductImage.png"));
|
|
27
|
+
|
|
14
28
|
var _fullscreen = _interopRequireDefault(require("../../../../assets/images/Icons/fullscreen.svg"));
|
|
29
|
+
|
|
15
30
|
var _close = _interopRequireDefault(require("../../../../assets/images/Icons/close.svg"));
|
|
31
|
+
|
|
16
32
|
var _uploadFile = _interopRequireDefault(require("../../../../assets/images/Icons/upload-file.svg"));
|
|
33
|
+
|
|
17
34
|
var _deleteForeverWhite = _interopRequireDefault(require("../../../../assets/images/Icons/delete-forever-white.svg"));
|
|
35
|
+
|
|
18
36
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
37
|
+
|
|
38
|
+
var _excluded = ["value", "name", "setModalFromTable", "setDataServices", "setModal"];
|
|
39
|
+
|
|
40
|
+
var ImageVisor = function ImageVisor(_ref) {
|
|
41
|
+
var value = _ref.value,
|
|
42
|
+
name = _ref.name,
|
|
43
|
+
setModalFromTable = _ref.setModalFromTable,
|
|
44
|
+
setDataServices = _ref.setDataServices,
|
|
45
|
+
setModal = _ref.setModal,
|
|
46
|
+
props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
|
|
47
|
+
|
|
48
|
+
var _useState = (0, _react.useState)(""),
|
|
49
|
+
_useState2 = (0, _slicedToArray2.default)(_useState, 2),
|
|
50
|
+
smallSrc = _useState2[0],
|
|
51
|
+
setSmallSrc = _useState2[1];
|
|
52
|
+
|
|
29
53
|
function handleNewImage(imageFile) {
|
|
30
|
-
|
|
31
|
-
...props,
|
|
32
|
-
...imageFile
|
|
33
|
-
};
|
|
54
|
+
var payload = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, props), imageFile);
|
|
34
55
|
setDataServices({
|
|
35
56
|
type: "updateImage",
|
|
36
|
-
payload
|
|
57
|
+
payload: payload
|
|
37
58
|
});
|
|
38
59
|
}
|
|
60
|
+
|
|
39
61
|
function handleUpdateImage(file) {
|
|
40
62
|
if (file) {
|
|
41
|
-
|
|
42
|
-
|
|
63
|
+
var reader = new FileReader();
|
|
64
|
+
|
|
65
|
+
reader.onload = function () {
|
|
43
66
|
getImageDimensions(reader.result);
|
|
44
67
|
};
|
|
68
|
+
|
|
45
69
|
reader.readAsDataURL(file);
|
|
46
70
|
}
|
|
47
71
|
}
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
img
|
|
51
|
-
|
|
72
|
+
|
|
73
|
+
var getImageDimensions = function getImageDimensions(dataURL) {
|
|
74
|
+
var img = new Image();
|
|
75
|
+
|
|
76
|
+
img.onload = function () {
|
|
77
|
+
var image = {
|
|
52
78
|
src: dataURL,
|
|
53
79
|
ext: img.src.includes("image/jpeg") ? "jpg" : "png",
|
|
54
80
|
width: img.width,
|
|
@@ -57,15 +83,18 @@ const ImageVisor = _ref => {
|
|
|
57
83
|
handleNewImage(image);
|
|
58
84
|
changeVisor();
|
|
59
85
|
};
|
|
86
|
+
|
|
60
87
|
img.src = dataURL;
|
|
61
88
|
};
|
|
89
|
+
|
|
62
90
|
function changeVisor(view) {
|
|
63
91
|
if (!view) {
|
|
64
92
|
setModalFromTable(null);
|
|
65
93
|
return;
|
|
66
94
|
}
|
|
67
|
-
|
|
68
|
-
|
|
95
|
+
|
|
96
|
+
var isSmall = view === "small";
|
|
97
|
+
var src = isSmall ? smallSrc : "".concat(process.env.REACT_APP_IMAGES_ENDPOINT, "/").concat(value === null || value === void 0 ? void 0 : value.src);
|
|
69
98
|
setModalFromTable( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.ImageView, {
|
|
70
99
|
visorView: view,
|
|
71
100
|
children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
|
|
@@ -78,11 +107,15 @@ const ImageVisor = _ref => {
|
|
|
78
107
|
children: [value !== null && value !== void 0 && value.src ? /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
|
|
79
108
|
src: _fullscreen.default,
|
|
80
109
|
alt: "Ver en pantalla completa",
|
|
81
|
-
onClick: ()
|
|
110
|
+
onClick: function onClick() {
|
|
111
|
+
return changeVisor("fullscreen");
|
|
112
|
+
}
|
|
82
113
|
}) : null, /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
|
|
83
114
|
src: _close.default,
|
|
84
115
|
alt: "Cerrar",
|
|
85
|
-
onClick: ()
|
|
116
|
+
onClick: function onClick() {
|
|
117
|
+
return changeVisor();
|
|
118
|
+
}
|
|
86
119
|
})]
|
|
87
120
|
}) : /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
|
|
88
121
|
children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("label", {
|
|
@@ -98,18 +131,20 @@ const ImageVisor = _ref => {
|
|
|
98
131
|
style: {
|
|
99
132
|
display: "none"
|
|
100
133
|
},
|
|
101
|
-
onChange:
|
|
134
|
+
onChange: function onChange(e) {
|
|
135
|
+
return handleUpdateImage(e.target.files[0]);
|
|
136
|
+
}
|
|
102
137
|
})]
|
|
103
138
|
}), /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
|
|
104
139
|
className: "borderCircle",
|
|
105
140
|
src: _deleteForeverWhite.default,
|
|
106
141
|
alt: "Eliminar im\xE1gen",
|
|
107
|
-
onClick: ()
|
|
142
|
+
onClick: function onClick() {
|
|
108
143
|
setModal({
|
|
109
144
|
type: "delete",
|
|
110
145
|
functions: {
|
|
111
|
-
setModal,
|
|
112
|
-
setDataServices
|
|
146
|
+
setModal: setModal,
|
|
147
|
+
setDataServices: setDataServices
|
|
113
148
|
},
|
|
114
149
|
payload: props
|
|
115
150
|
});
|
|
@@ -119,7 +154,9 @@ const ImageVisor = _ref => {
|
|
|
119
154
|
className: "borderCircle",
|
|
120
155
|
src: _close.default,
|
|
121
156
|
alt: "Cerrar",
|
|
122
|
-
onClick: ()
|
|
157
|
+
onClick: function onClick() {
|
|
158
|
+
return changeVisor("small");
|
|
159
|
+
}
|
|
123
160
|
})]
|
|
124
161
|
})
|
|
125
162
|
})]
|
|
@@ -136,14 +173,18 @@ const ImageVisor = _ref => {
|
|
|
136
173
|
})]
|
|
137
174
|
}));
|
|
138
175
|
}
|
|
139
|
-
|
|
176
|
+
|
|
177
|
+
(0, _react.useEffect)(function () {
|
|
140
178
|
var _value$src;
|
|
141
|
-
|
|
179
|
+
|
|
180
|
+
var src = value !== null && value !== void 0 && (_value$src = value.src) !== null && _value$src !== void 0 && _value$src.includes("image/") ? value === null || value === void 0 ? void 0 : value.src : (0, _utils.getImageURL)(process.env.REACT_APP_IMAGES_BUCKET, value === null || value === void 0 ? void 0 : value.src, 250, 250);
|
|
142
181
|
setSmallSrc(src);
|
|
143
182
|
}, [value]);
|
|
144
183
|
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
|
|
145
184
|
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.ImageContainer, {
|
|
146
|
-
onClick: ()
|
|
185
|
+
onClick: function onClick() {
|
|
186
|
+
return changeVisor("small");
|
|
187
|
+
},
|
|
147
188
|
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactImageFallback.default, {
|
|
148
189
|
src: smallSrc,
|
|
149
190
|
fallbackImage: _defaultProductImage.default,
|
|
@@ -152,5 +193,7 @@ const ImageVisor = _ref => {
|
|
|
152
193
|
})
|
|
153
194
|
});
|
|
154
195
|
};
|
|
196
|
+
|
|
155
197
|
exports.ImageVisor = ImageVisor;
|
|
156
|
-
var _default =
|
|
198
|
+
var _default = ImageVisor;
|
|
199
|
+
exports.default = _default;
|
|
@@ -1,19 +1,29 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
+
|
|
4
5
|
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
|
|
6
|
+
|
|
5
7
|
Object.defineProperty(exports, "__esModule", {
|
|
6
8
|
value: true
|
|
7
9
|
});
|
|
8
10
|
exports.ImageView = exports.ImageContainer = void 0;
|
|
11
|
+
|
|
9
12
|
var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
|
|
13
|
+
|
|
10
14
|
var _styledComponents = _interopRequireWildcard(require("styled-components"));
|
|
15
|
+
|
|
11
16
|
var _uploadFile = _interopRequireDefault(require("../../../../assets/images/Icons/upload-file.svg"));
|
|
17
|
+
|
|
12
18
|
var _templateObject, _templateObject2, _templateObject3;
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
19
|
+
|
|
20
|
+
var ImageContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n align-items: center;\n background: var(--white-main, #fff);\n border-radius: 7px;\n border: 1px solid var(--grey-medium, #cbcbcb);\n cursor: pointer;\n display: flex;\n height: 52px;\n justify-content: center;\n width: 52px;\n & > img {\n border-radius: 7px;\n height: 100%;\n width: 100%;\n object-fit: contain;\n }\n"])));
|
|
21
|
+
|
|
22
|
+
exports.ImageContainer = ImageContainer;
|
|
23
|
+
|
|
24
|
+
var ImageView = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n background: var(--white-main, #fff);\n border-radius: 5px;\n box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.25);\n height: 280px;\n left: calc(50% - 125px);\n position: absolute;\n top: calc(50% - 140px);\n width: 250px;\n z-index: 10;\n .header {\n align-items: center;\n background: var(--grey-medium, #cbcbcb);\n border-radius: 5px 5px 0px 0px;\n color: var(--white-main, #fff);\n display: flex;\n font-family: Roboto;\n font-size: 12px;\n font-style: normal;\n font-weight: 500;\n height: 30px;\n justify-content: space-between;\n line-height: normal;\n overflow: hidden;\n padding: 0 9px 0 10px;\n text-overflow: ellipsis;\n width: 100%;\n .buttons {\n display: flex;\n gap: 10px;\n img {\n cursor: pointer;\n }\n label {\n display: flex;\n align-items: center;\n padding: 3px;\n }\n .borderCircle {\n border-radius: 20px;\n border: 1px solid var(--white-main, #fff);\n }\n }\n }\n .body {\n width: 100%;\n height: calc(100% - 30px);\n .imageLoaded {\n width: 100%;\n height: 100%;\n object-fit: contain;\n }\n }\n ", "\n"])), function (_ref) {
|
|
25
|
+
var visorView = _ref.visorView;
|
|
18
26
|
return visorView === "fullscreen" && (0, _styledComponents.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n background: var(--black-main, #262626d9);\n height: 100%;\n left: 0;\n top: 0;\n width: 100%;\n .header {\n background: var(--black-main, #262626);\n font-size: 14px;\n height: 45px;\n .buttons > img {\n border-radius: 20px;\n border: 1px solid var(--white-main, #fff);\n padding: 3px;\n }\n }\n > div {\n align-items: center;\n display: flex;\n height: 100%;\n justify-content: center;\n width: 100%;\n & > img {\n border-radius: 5px;\n height: 500px;\n width: 500px;\n }\n }\n "])));
|
|
19
|
-
});
|
|
27
|
+
});
|
|
28
|
+
|
|
29
|
+
exports.ImageView = ImageView;
|
|
@@ -7,7 +7,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
|
|
|
7
7
|
Object.defineProperty(exports, "__esModule", {
|
|
8
8
|
value: true
|
|
9
9
|
});
|
|
10
|
-
exports.
|
|
10
|
+
exports.MEdition = void 0;
|
|
11
11
|
|
|
12
12
|
var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
|
|
13
13
|
|
|
@@ -47,7 +47,7 @@ var _ScreenHeader = require("../../atoms/ScreenHeader");
|
|
|
47
47
|
|
|
48
48
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
49
49
|
|
|
50
|
-
var
|
|
50
|
+
var MEdition = function MEdition(_ref) {
|
|
51
51
|
var articles = _ref.articles,
|
|
52
52
|
versions = _ref.versions,
|
|
53
53
|
onClose = _ref.onClose,
|
|
@@ -150,31 +150,31 @@ var MultipleEdition = function MultipleEdition(_ref) {
|
|
|
150
150
|
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
|
|
151
151
|
children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
|
|
152
152
|
className: "tabs",
|
|
153
|
-
children: [/*#__PURE__*/(0, _jsxRuntime.
|
|
154
|
-
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_EditionTabs.EditionTabs, {
|
|
153
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
|
|
154
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_EditionTabs.EditionTabs, {
|
|
155
155
|
getSection: setSection
|
|
156
|
-
})
|
|
157
|
-
}), /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
|
|
156
|
+
}), " "]
|
|
157
|
+
}), " ", /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
|
|
158
158
|
src: _beenhere.default,
|
|
159
159
|
alt: "beenhere"
|
|
160
160
|
})]
|
|
161
|
-
}), /*#__PURE__*/(0, _jsxRuntime.
|
|
161
|
+
}), " ", /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
|
|
162
162
|
className: "action_buttons",
|
|
163
|
-
children: /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
|
|
163
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
|
|
164
164
|
src: _closeMagenta.default,
|
|
165
165
|
alt: "Cerrar",
|
|
166
166
|
onClick: function onClick() {
|
|
167
167
|
return onClose && onClose();
|
|
168
168
|
}
|
|
169
|
-
})
|
|
170
|
-
}), /*#__PURE__*/(0, _jsxRuntime.
|
|
169
|
+
}), " "]
|
|
170
|
+
}), " ", /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
|
|
171
171
|
className: "table",
|
|
172
|
-
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Table.Table, {
|
|
172
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Table.Table, {
|
|
173
173
|
withCheckbox: true,
|
|
174
174
|
columns: currentData.columns,
|
|
175
175
|
data: currentData.data
|
|
176
|
-
})
|
|
177
|
-
}), modalFromTable, /*#__PURE__*/(0, _jsxRuntime.jsx)(_Modal.Modal, (0, _objectSpread2.default)({}, modal)), showRejectModal && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Modal.Modal, {
|
|
176
|
+
}), " "]
|
|
177
|
+
}), " ", modalFromTable, " ", /*#__PURE__*/(0, _jsxRuntime.jsx)(_Modal.Modal, (0, _objectSpread2.default)({}, modal)), " ", showRejectModal && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Modal.Modal, {
|
|
178
178
|
title: "Agregar mensaje de rechazo",
|
|
179
179
|
show: showRejectModal,
|
|
180
180
|
customComponent: /*#__PURE__*/(0, _jsxRuntime.jsx)(_TagAndInput.TagAndInput, {
|
|
@@ -210,7 +210,7 @@ var MultipleEdition = function MultipleEdition(_ref) {
|
|
|
210
210
|
});
|
|
211
211
|
attributesReviewed[index].isApproved = false;
|
|
212
212
|
attributesReviewed[index].isReviewed = true;
|
|
213
|
-
document.getElementById("button_" + attributeSelected.articleId +
|
|
213
|
+
document.getElementById("button_" + attributeSelected.articleId + "_" + attributeSelected.attributeId + "_" + attributeSelected.versionId).src = _rejectIcon.default;
|
|
214
214
|
attributesReviewed[index].comment = comment[0].value;
|
|
215
215
|
console.log(attributesReviewed[index]);
|
|
216
216
|
setShowRejectModal(false);
|
|
@@ -223,7 +223,7 @@ var MultipleEdition = function MultipleEdition(_ref) {
|
|
|
223
223
|
}, _callee);
|
|
224
224
|
}))
|
|
225
225
|
}, "btn-Aceptar")]
|
|
226
|
-
}), message.length > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_GenericModal.GenericModal, {
|
|
226
|
+
}), " ", message.length > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_GenericModal.GenericModal, {
|
|
227
227
|
componentsArray: [/*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
|
|
228
228
|
src: _genericModalCheck.default,
|
|
229
229
|
alt: "success icon"
|
|
@@ -236,8 +236,8 @@ var MultipleEdition = function MultipleEdition(_ref) {
|
|
|
236
236
|
setMessage("");
|
|
237
237
|
callbackToInitData();
|
|
238
238
|
}
|
|
239
|
-
})]
|
|
239
|
+
}), " "]
|
|
240
240
|
});
|
|
241
241
|
};
|
|
242
242
|
|
|
243
|
-
exports.
|
|
243
|
+
exports.MEdition = MEdition;
|