oa-componentbook 1.0.1-stage.54 → 1.0.1-stage.55
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/build/dev/oa-component-document-viewer/CustomDocumentViewer.js +40 -39
- package/build/dev/oa-widget-document-side-drawer/DocumentSideDrawer.js +4 -3
- package/build/global-css/commonStyles.js +1 -1
- package/build/widgets/oa-widget-approval/ApprovalWidgetNew.js +54 -55
- package/build/widgets/oa-widget-document-upload/DocUploadWidget.js +22 -22
- package/package.json +1 -1
|
@@ -20,6 +20,8 @@ var _styles = _interopRequireDefault(require("./styles"));
|
|
|
20
20
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
21
21
|
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
22
22
|
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
23
|
+
/* eslint-disable */
|
|
24
|
+
|
|
23
25
|
_reactPdf.pdfjs.GlobalWorkerOptions.workerSrc = "//cdnjs.cloudflare.com/ajax/libs/pdf.js/".concat(_reactPdf.pdfjs.version, "/pdf.worker.js");
|
|
24
26
|
const ZOOM_STEP = 0.2;
|
|
25
27
|
const MIN_ZOOM = 0.5;
|
|
@@ -48,9 +50,8 @@ function CustomDocumentViewer(_ref) {
|
|
|
48
50
|
let {
|
|
49
51
|
numPages
|
|
50
52
|
} = _ref2;
|
|
51
|
-
|
|
53
|
+
setTotalPages(numPages);
|
|
52
54
|
};
|
|
53
|
-
|
|
54
55
|
// Zoom handlers.
|
|
55
56
|
const handleZoomIn = (0, _react.useCallback)(() => setScale(prev => Math.min(prev + ZOOM_STEP, MAX_ZOOM)), []);
|
|
56
57
|
const handleZoomOut = (0, _react.useCallback)(() => setScale(prev => Math.max(prev - ZOOM_STEP, MIN_ZOOM)), []);
|
|
@@ -63,27 +64,27 @@ function CustomDocumentViewer(_ref) {
|
|
|
63
64
|
|
|
64
65
|
// Default download function; can be overridden by passing an onDownload prop.
|
|
65
66
|
const defaultDownload = (0, _react.useCallback)(() => {
|
|
66
|
-
if (fileType ===
|
|
67
|
+
if (fileType === 'image') {
|
|
67
68
|
// Fetch the image as a blob to force download.
|
|
68
69
|
fetch(fileUrl, {
|
|
69
|
-
mode:
|
|
70
|
+
mode: 'cors'
|
|
70
71
|
}).then(res => res.blob()).then(blob => {
|
|
71
72
|
const url = window.URL.createObjectURL(blob);
|
|
72
|
-
const link = document.createElement(
|
|
73
|
+
const link = document.createElement('a');
|
|
73
74
|
link.href = url;
|
|
74
|
-
link.download = fileUrl.split(
|
|
75
|
+
link.download = fileUrl.split('/').pop();
|
|
75
76
|
document.body.appendChild(link);
|
|
76
77
|
link.click();
|
|
77
78
|
document.body.removeChild(link);
|
|
78
79
|
window.URL.revokeObjectURL(url);
|
|
79
80
|
}).catch(error => {
|
|
80
|
-
console.error(
|
|
81
|
+
console.error('Image download failed:', error);
|
|
81
82
|
});
|
|
82
83
|
} else {
|
|
83
84
|
// For PDFs and other file types, use the standard download.
|
|
84
|
-
const link = document.createElement(
|
|
85
|
+
const link = document.createElement('a');
|
|
85
86
|
link.href = fileUrl;
|
|
86
|
-
link.download = fileUrl.split(
|
|
87
|
+
link.download = fileUrl.split('/').pop();
|
|
87
88
|
document.body.appendChild(link);
|
|
88
89
|
link.click();
|
|
89
90
|
document.body.removeChild(link);
|
|
@@ -92,7 +93,7 @@ function CustomDocumentViewer(_ref) {
|
|
|
92
93
|
const handleDownload = onDownload || defaultDownload;
|
|
93
94
|
|
|
94
95
|
// Enable dragging when zoomed in.
|
|
95
|
-
(0, _react.useEffect)(
|
|
96
|
+
(0, _react.useEffect)(() => {
|
|
96
97
|
const container = containerRef.current;
|
|
97
98
|
if (!container) return;
|
|
98
99
|
let isDragging = false;
|
|
@@ -103,7 +104,7 @@ function CustomDocumentViewer(_ref) {
|
|
|
103
104
|
const onMouseDown = e => {
|
|
104
105
|
if (scale > 1.0) {
|
|
105
106
|
isDragging = true;
|
|
106
|
-
container.style.cursor =
|
|
107
|
+
container.style.cursor = 'grabbing';
|
|
107
108
|
startX = e.pageX;
|
|
108
109
|
startY = e.pageY;
|
|
109
110
|
scrollLeft = container.scrollLeft;
|
|
@@ -116,19 +117,19 @@ function CustomDocumentViewer(_ref) {
|
|
|
116
117
|
container.scrollLeft = scrollLeft - (e.pageX - startX);
|
|
117
118
|
container.scrollTop = scrollTop - (e.pageY - startY);
|
|
118
119
|
};
|
|
119
|
-
const onMouseUp = ()
|
|
120
|
+
const onMouseUp = function onMouseUp() {
|
|
120
121
|
isDragging = false;
|
|
121
|
-
container.style.cursor = scale > 1.0 ?
|
|
122
|
+
container.style.cursor = scale > 1.0 ? 'grab' : 'auto';
|
|
122
123
|
};
|
|
123
|
-
container.addEventListener(
|
|
124
|
-
container.addEventListener(
|
|
125
|
-
container.addEventListener(
|
|
126
|
-
container.addEventListener(
|
|
124
|
+
container.addEventListener('mousedown', onMouseDown);
|
|
125
|
+
container.addEventListener('mousemove', onMouseMove);
|
|
126
|
+
container.addEventListener('mouseup', onMouseUp);
|
|
127
|
+
container.addEventListener('mouseleave', onMouseUp);
|
|
127
128
|
return () => {
|
|
128
|
-
container.removeEventListener(
|
|
129
|
-
container.removeEventListener(
|
|
130
|
-
container.removeEventListener(
|
|
131
|
-
container.removeEventListener(
|
|
129
|
+
container.removeEventListener('mousedown', onMouseDown);
|
|
130
|
+
container.removeEventListener('mousemove', onMouseMove);
|
|
131
|
+
container.removeEventListener('mouseup', onMouseUp);
|
|
132
|
+
container.removeEventListener('mouseleave', onMouseUp);
|
|
132
133
|
};
|
|
133
134
|
}, [scale]);
|
|
134
135
|
|
|
@@ -159,17 +160,17 @@ function CustomDocumentViewer(_ref) {
|
|
|
159
160
|
ref: containerRef,
|
|
160
161
|
className: "customDocumentViewerOverlay",
|
|
161
162
|
style: {
|
|
162
|
-
cursor: scale > 1.0 ?
|
|
163
|
+
cursor: scale > 1.0 ? 'grab' : 'auto'
|
|
163
164
|
},
|
|
164
165
|
onScroll: handleScroll
|
|
165
166
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
166
167
|
className: "customDocumentViewerOverlayHeader"
|
|
167
|
-
}, fileType ===
|
|
168
|
+
}, fileType === 'pdf' && !hidePageNumber ? /*#__PURE__*/_react.default.createElement("div", {
|
|
168
169
|
className: "pageNumber"
|
|
169
170
|
}, /*#__PURE__*/_react.default.createElement(_Typography.default, {
|
|
170
171
|
className: "type-button-500",
|
|
171
172
|
color: "primary-background"
|
|
172
|
-
}, "Page
|
|
173
|
+
}, "Page", ' ', currentPage, ' ', "of", ' ', totalPages)) : fileType === 'image' && !hideRotate ? /*#__PURE__*/_react.default.createElement("div", {
|
|
173
174
|
className: "pageNumber"
|
|
174
175
|
}, /*#__PURE__*/_react.default.createElement(_MaterialIcon.default, {
|
|
175
176
|
color: "primary-background",
|
|
@@ -177,7 +178,7 @@ function CustomDocumentViewer(_ref) {
|
|
|
177
178
|
icon: _RotateRight.default,
|
|
178
179
|
onClick: handleRotate,
|
|
179
180
|
style: {
|
|
180
|
-
cursor:
|
|
181
|
+
cursor: 'pointer'
|
|
181
182
|
}
|
|
182
183
|
})) : null, !hideZoom && /*#__PURE__*/_react.default.createElement("div", {
|
|
183
184
|
className: "customDocumentViewerOverlayHeaderIcons"
|
|
@@ -187,7 +188,7 @@ function CustomDocumentViewer(_ref) {
|
|
|
187
188
|
icon: _icons.RemoveRounded,
|
|
188
189
|
onClick: handleZoomOut,
|
|
189
190
|
style: {
|
|
190
|
-
cursor: scale === MIN_ZOOM ?
|
|
191
|
+
cursor: scale === MIN_ZOOM ? 'not-allowed' : 'pointer'
|
|
191
192
|
}
|
|
192
193
|
}), /*#__PURE__*/_react.default.createElement(_MaterialIcon.default, {
|
|
193
194
|
color: "primary-background",
|
|
@@ -195,7 +196,7 @@ function CustomDocumentViewer(_ref) {
|
|
|
195
196
|
icon: _icons.ZoomInRounded,
|
|
196
197
|
onClick: handleResetZoom,
|
|
197
198
|
style: {
|
|
198
|
-
cursor: scale === 1.0 ?
|
|
199
|
+
cursor: scale === 1.0 ? 'not-allowed' : 'pointer'
|
|
199
200
|
}
|
|
200
201
|
}), /*#__PURE__*/_react.default.createElement(_MaterialIcon.default, {
|
|
201
202
|
color: "primary-background",
|
|
@@ -203,7 +204,7 @@ function CustomDocumentViewer(_ref) {
|
|
|
203
204
|
icon: _icons.AddRounded,
|
|
204
205
|
onClick: handleZoomIn,
|
|
205
206
|
style: {
|
|
206
|
-
cursor: scale === MAX_ZOOM ?
|
|
207
|
+
cursor: scale === MAX_ZOOM ? 'not-allowed' : 'pointer'
|
|
207
208
|
}
|
|
208
209
|
})), !hideDownload && /*#__PURE__*/_react.default.createElement("div", {
|
|
209
210
|
className: "downloadIcon"
|
|
@@ -212,10 +213,10 @@ function CustomDocumentViewer(_ref) {
|
|
|
212
213
|
size: 24,
|
|
213
214
|
icon: _icons.GetAppRounded,
|
|
214
215
|
onClick: handleDownload
|
|
215
|
-
}))), fileType ===
|
|
216
|
+
}))), fileType === 'pdf' && /*#__PURE__*/_react.default.createElement("div", {
|
|
216
217
|
style: {
|
|
217
218
|
transform: "scale(".concat(scale, ")"),
|
|
218
|
-
transformOrigin:
|
|
219
|
+
transformOrigin: 'top center'
|
|
219
220
|
}
|
|
220
221
|
}, /*#__PURE__*/_react.default.createElement(_reactPdf.Document, {
|
|
221
222
|
file: fileUrl,
|
|
@@ -226,25 +227,25 @@ function CustomDocumentViewer(_ref) {
|
|
|
226
227
|
key: "page_".concat(index + 1),
|
|
227
228
|
ref: el => pageRefs.current[index] = el,
|
|
228
229
|
style: {
|
|
229
|
-
marginBottom:
|
|
230
|
-
display:
|
|
231
|
-
justifyContent:
|
|
230
|
+
marginBottom: '20px',
|
|
231
|
+
display: 'flex',
|
|
232
|
+
justifyContent: 'center'
|
|
232
233
|
}
|
|
233
234
|
}, /*#__PURE__*/_react.default.createElement(_reactPdf.Page, {
|
|
234
235
|
pageNumber: index + 1,
|
|
235
236
|
scale: 1.0
|
|
236
|
-
}))))), fileType ===
|
|
237
|
+
}))))), fileType === 'image' && /*#__PURE__*/_react.default.createElement("div", {
|
|
237
238
|
style: {
|
|
238
239
|
transform: "scale(".concat(scale, ") rotate(").concat(rotation, "deg)"),
|
|
239
|
-
transformOrigin:
|
|
240
|
+
transformOrigin: 'center center'
|
|
240
241
|
}
|
|
241
242
|
}, /*#__PURE__*/_react.default.createElement("img", {
|
|
242
243
|
src: fileUrl,
|
|
243
244
|
alt: "document",
|
|
244
245
|
style: {
|
|
245
|
-
transition:
|
|
246
|
-
maxWidth:
|
|
247
|
-
maxHeight:
|
|
246
|
+
transition: 'transform 0.3s ease-in-out',
|
|
247
|
+
maxWidth: '100%',
|
|
248
|
+
maxHeight: '80vh'
|
|
248
249
|
}
|
|
249
250
|
})))));
|
|
250
251
|
}
|
|
@@ -270,6 +271,6 @@ CustomDocumentViewer.defaultProps = {
|
|
|
270
271
|
hideDownload: false,
|
|
271
272
|
hidePageNumber: false,
|
|
272
273
|
hideRotate: false,
|
|
273
|
-
documentViewerOverlayHeight:
|
|
274
|
+
documentViewerOverlayHeight: '100vh'
|
|
274
275
|
};
|
|
275
276
|
var _default = exports.default = CustomDocumentViewer;
|
|
@@ -14,6 +14,7 @@ var _CustomTag = _interopRequireDefault(require("../../components/oa-component-t
|
|
|
14
14
|
var _CustomButton = _interopRequireDefault(require("../../components/oa-component-button/CustomButton"));
|
|
15
15
|
var _styles = _interopRequireDefault(require("./styles"));
|
|
16
16
|
const _excluded = ["title", "handleCloseDrawer", "documentConfig", "drawerWidth", "drawerButtonConfig", "drawerTagConfig"];
|
|
17
|
+
/* eslint-disable */
|
|
17
18
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
18
19
|
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
19
20
|
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
@@ -46,9 +47,9 @@ function DocumentSideDrawer(_ref) {
|
|
|
46
47
|
color: "primary-content"
|
|
47
48
|
}, drawerTagConfig.heading), /*#__PURE__*/_react.default.createElement("div", {
|
|
48
49
|
className: "margin-top-16 statusSec"
|
|
49
|
-
}, drawerTagConfig.tag
|
|
50
|
+
}, drawerTagConfig.tag
|
|
50
51
|
// Conditionally render CustomTag or Typography based on tag type
|
|
51
|
-
drawerTagConfig.tag.type ? /*#__PURE__*/_react.default.createElement(_CustomTag.default, {
|
|
52
|
+
&& (drawerTagConfig.tag.type ? /*#__PURE__*/_react.default.createElement(_CustomTag.default, {
|
|
52
53
|
label: drawerTagConfig.tag.label,
|
|
53
54
|
type: drawerTagConfig.tag.type
|
|
54
55
|
}) : /*#__PURE__*/_react.default.createElement(_Typography.default, {
|
|
@@ -76,7 +77,7 @@ DocumentSideDrawer.propTypes = {
|
|
|
76
77
|
|
|
77
78
|
// Default props to provide fallback values for optional props
|
|
78
79
|
DocumentSideDrawer.defaultProps = {
|
|
79
|
-
title:
|
|
80
|
+
title: '',
|
|
80
81
|
handleCloseDrawer: () => {},
|
|
81
82
|
documentConfig: null,
|
|
82
83
|
drawerWidth: null,
|
|
@@ -7,5 +7,5 @@ exports.default = void 0;
|
|
|
7
7
|
var _styledComponents = require("styled-components");
|
|
8
8
|
var _templateObject;
|
|
9
9
|
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
10
|
-
const CommonStyles = (0, _styledComponents.createGlobalStyle)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n.tooltip-grid {\n display: flex;\n gap: 32px; /* Space between columns */\n}\n\n.tooltip-column {\n display: flex;\n flex-direction: column;\n width: 100%;\n}\n\n\n.multipleDocumentTooltip .ant-tooltip-inner{\n padding: 24px 16px;\n background: #fff;\n color: #212121;\n box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.14);\n width: max-content;\n border-radius: 12px;\n\n}\n .multipleDocumentTooltip .ant-tooltip-arrow:before{\n background: #fff;\n }\n .multipleDocumentTooltip li.tooltip-item{\n display: flex;\n gap: 8px;\n align-items: flex-start;\n color: #212121;\n font-size: 14px;\n font-weight: 400;\n line-height: 20px; \n padding: 8px 0;\n }\n .multipleDocumentTooltip ul .headingName{\n color: #717171;\n font-size: 12px;\n font-style: normal;\n font-weight: 700;\n line-height: 16px; \n letter-spacing: 0.24px;\n text-transform: uppercase;\n padding: 0 0 16px;\n }\n .multipleDocumentTooltip .flexWrap{\n display: flex;\n flex-wrap: wrap;\n column-count: 1;\n column-gap: 8px;\n list-style: none;\n justify-content: space-between;\n }\n.ant-modal .ant-modal-content {\n padding: 24px 24px 32px;\n border-radius: 12px;\n }\n .ant-select-dropdown .ant-select-item{\n min-height: auto !important;\n }\n .ant-notification .ant-notification-notice-wrapper .ant-notification-notice-message{\n margin-bottom: 0 !important;\n }\n .ant-notification .ant-notification-notice-wrapper{\n background: transparent;\n }\n .ant-notification .ant-notification-notice-wrapper .ant-notification-notice-close{\n position: inherit !important;\n width: 24px !important;\n height: 24px !important;\n }\n .ant-notification .ant-notification-notice-wrapper .ant-notification-notice-closable .ant-notification-notice-message {\n padding-inline-end: 0px !important;\n}\n .ant-notification-notice-close > button{\n width: 24px !important;\n height: 24px !important;\n }\n .ant-notification .ant-notification-notice-wrapper .ant-notification-notice {\n display: flex;\n align-items: center;\n gap: 12px;\n justify-content: space-between;\n }\n @media (max-width: 372px) {\n .ant-picker-date-panel .ant-picker-body{\n padding: 8px !important;\n }\n }\n@media (max-width: 600px) {\n .ant-drawer .ant-drawer-header,.ant-drawer .ant-drawer-body{\n padding: 16px !important;\n }\n .ant-drawer .ant-drawer-footer {\n padding: 12px 16px;\n }\n .ant-picker-dropdown .ant-picker-date-panel{\n width: 100%;\n }\n .ant-picker-dropdown .ant-picker-time-panel-column {\n overflow-y: auto;\n}\n.ant-picker-dropdown .ant-picker-time-panel-column::-webkit-scrollbar {\n width: 2px;\n }\n\n .ant-modal-root .ant-modal-wrap {\n position: fixed;\n overflow: inherit;\n }\n .ant-modal-root .ant-modal-centered .ant-modal{\n vertical-align: middle;\n position: absolute;\n bottom: 0;\n left: 0;\n width: 100% !important;\n max-width: 100%!important;\n // transform-origin: bottom !important;\n //animation-duration: 0s !important;\n animation-name: slideUp;\n animation-duration: 0.2s;\n transition: .3s ease-in-out;\n animation-timing-function: ease-in;\n }\n @keyframes slideUp {\n 0%,\n 50% {\n transform: translateY(100%);\n opacity: 0;\n }\n \n 60%,\n 100% {\n transform: translateY(0);\n opacity: 1;\n \n }\n }\n .ant-modal .ant-modal-content {\n bottom: -8px;\n left: 0;\n position: absolute;\n right: 0;\n border-bottom-left-radius: 0px;\n border-bottom-right-radius: 0px;\n }\n .ant-modal .ant-modal-body{\n max-height: calc(90vh - 126px);\n overflow: auto;\n padding-right: 16px;\n }\n .ant-modal-footer{\n padding-right: 16px !important;\n }\n .ant-modal .ant-modal-content{\n padding: 24px 16px 32px;\n padding-right: 0;\n }\n}\n\n.ant-dropdown .ant-dropdown-menu .ant-dropdown-menu-item{\n padding: 12px 24px;\n}\n.ant-dropdown-menu{\n min-width: 256px;\n top: 4px;\n}\n.ant-space-item span{\n line-height: 0 !important;\n display: flex;\n}\n.ant-select-dropdown{border-radius: 4px; padding:8px 0 !important;\n background: var(--color-primary-background) ;\n box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.14);}\n\n.ant-select-dropdown .ant-select-item { \n min-height: auto;\n padding: 12px 16px;\n color: var(--color-primary-content) ;\n line-height: 20px;\n border-radius: 0px;\n}\n\n.label-date-dropdown {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n gap: 16px;\n}\n\n.ant-select-dropdown .ant-select-item-option-active span{ color: var(--color-primary) !important;}\n.ant-picker-range {opacity: 0;}\n.ant-picker-dropdown-range { padding: 0; }\n\n.fadeImg{\n position: relative;\n width: 100%;\n max-height: 300px;\n overflow-x: auto;\n}\n.overLayImg{\n background: rgb(0 0 0 / 40%);\n border-radius: 12px 12px 0px 0px;\n overflow: hidden;\n}\n \n.OaTooltip .ant-tooltip-inner{\n padding: 24px 16px;\n background: #fff;\n color: #212121;\n box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.14);\n width: 348px;\n border-radius: 12px;\n}\n.OaTooltip .ant-tooltip-arrow:before{\n background: #fff !important;\n}\n.OaFooterBtn{\n display: flex;\n justify-content: end;\n}\n.OaTooltip{\n max-width: 348px !important;\n}\n.paddingBot .ant-drawer-body{\n padding-bottom: 100px !important;\n}\n.react-transform-component,.react-transform-wrapper,.react-transform-component > div{\n width: 100%;\n}\n.ascCollapse .ant-collapse-arrow{\n transform: rotate(90deg);\n color: var(--color-primary) !important;\n font-size: 14px !important;\n}\n.gappingIcons{\n display: flex;\n gap: 16px;\n}\n.imageZoom .ant-modal-body > div{\n height: 350px;\n overflow-y: auto;\n margin: 30px 0px 0px;\n padding: 0px 8px 0 0;;\n \n}\n/* width */\n.imageZoom ::-webkit-scrollbar {\n width: 8px;\n height: 100px;\n border-radius: 8px;\n}\n\n/* Track */\n.imageZoom ::-webkit-scrollbar-track {\n background: #f6f6f6; \n border-radius: 8px;\n}\n \n/* Handle */\n.imageZoom ::-webkit-scrollbar-thumb {\n background: #888; \n border-radius: 8px;\n height: 100px;\n}\n\n/* Handle on hover */\n.imageZoom ::-webkit-scrollbar-thumb:hover {\n background: #555; \n}\n .modalImg{\n width: 100%;\n }\n.overflowScroll{\n position: relative;\n}\n.ascCollapse .ant-collapse-header{\n border-radius: 4px !important;\n background: var(--color-secondary-background);\n}\n.ascCollapse,.ant-collapse{\n overflow: hidden;\n}\n.ascCollapse .totalVal{\n display: flex;\n gap: 12px;\n}\n.ascCollapse.ant-collapse-item-active .ant-collapse-arrow{\n transform: rotate(180deg) !important;\n}.mobilesIcons li.ant-dropdown-menu-item > svg {\n display: none\n}\n .ant-notification-notice-close svg{\n font-size: 24px !important;\n height: auto;\n }\n @media only screen and (max-width: 574px) {\n .ant-steps-item-tail{\n inset-inline-start: 78px !important;\n \n }\n}\n @media only screen and (max-width: 480px) {\n .ant-steps-item-tail{\n inset-inline-start: 60px !important;\n \n }\n}\n@media only screen and (max-width: 600px) {\n \n .ant-picker-dropdown .ant-picker-date-panel .ant-picker-body {\n padding: 8px;\n }\n .ant-picker-dropdown { width: 100%; left: 0 !important; }\n .mobilesIcons li.ant-dropdown-menu-item > svg {\n display: block;\n}\n.imageZoom .ant-modal-body>div{\n height: auto;\n overflow-y: auto;\n}\n.imageZoom .ant-modal-footer{\n padding-right: 16px !important;\n}\n .fadeImg{\n max-height: auto;\n }\n .ant-picker-dropdown .ant-picker-date-panel .ant-picker-content th {\n width: 24px; font-size: 12px; font-weight: bold; }\n\n .ant-picker-dropdown .ant-picker-content th {\n height: 24px;\n }\n .ant-picker-dropdown .ant-picker-content td {\n font-size: 12px;\n }\n .ant-picker-dropdown .ant-picker-date-panel .ant-picker-content {\n width: 100%;\n }\n\n}\n.ant-picker .ant-picker-clear{\n font-size: 20px;\n}\n\n"])));
|
|
10
|
+
const CommonStyles = (0, _styledComponents.createGlobalStyle)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n.tooltip-grid {\n display: flex;\n gap: 32px; /* Space between columns */\n}\n\n.tooltip-column {\n display: flex;\n flex-direction: column;\n width: 100%;\n}\n\n\n.multipleDocumentTooltip .ant-tooltip-inner{\n padding: 24px 16px;\n background: #fff;\n color: #212121;\n box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.14);\n width: max-content;\n border-radius: 12px;\n min-width: 300px;\n\n}\n .multipleDocumentTooltip .ant-tooltip-arrow:before{\n background: #fff;\n }\n .multipleDocumentTooltip li.tooltip-item{\n display: flex;\n gap: 8px;\n align-items: flex-start;\n color: #212121;\n font-size: 14px;\n font-weight: 400;\n line-height: 20px; \n padding: 8px 0;\n width: max-content;\n }\n .multipleDocumentTooltip ul .headingName{\n color: #717171;\n font-size: 12px;\n font-style: normal;\n font-weight: 700;\n line-height: 16px; \n letter-spacing: 0.24px;\n text-transform: uppercase;\n padding: 0 0 16px;\n }\n .multipleDocumentTooltip .flexWrap{\n display: flex;\n flex-wrap: wrap;\n column-count: 1;\n column-gap: 8px;\n list-style: none;\n justify-content: space-between;\n }\n.ant-modal .ant-modal-content {\n padding: 24px 24px 32px;\n border-radius: 12px;\n }\n .ant-select-dropdown .ant-select-item{\n min-height: auto !important;\n }\n .ant-notification .ant-notification-notice-wrapper .ant-notification-notice-message{\n margin-bottom: 0 !important;\n }\n .ant-notification .ant-notification-notice-wrapper{\n background: transparent;\n }\n .ant-notification .ant-notification-notice-wrapper .ant-notification-notice-close{\n position: inherit !important;\n width: 24px !important;\n height: 24px !important;\n }\n .ant-notification .ant-notification-notice-wrapper .ant-notification-notice-closable .ant-notification-notice-message {\n padding-inline-end: 0px !important;\n}\n .ant-notification-notice-close > button{\n width: 24px !important;\n height: 24px !important;\n }\n .ant-notification .ant-notification-notice-wrapper .ant-notification-notice {\n display: flex;\n align-items: center;\n gap: 12px;\n justify-content: space-between;\n }\n @media (max-width: 372px) {\n .ant-picker-date-panel .ant-picker-body{\n padding: 8px !important;\n }\n }\n@media (max-width: 600px) {\n .ant-drawer .ant-drawer-header,.ant-drawer .ant-drawer-body{\n padding: 16px !important;\n }\n .ant-drawer .ant-drawer-footer {\n padding: 12px 16px;\n }\n .ant-picker-dropdown .ant-picker-date-panel{\n width: 100%;\n }\n .ant-picker-dropdown .ant-picker-time-panel-column {\n overflow-y: auto;\n}\n.ant-picker-dropdown .ant-picker-time-panel-column::-webkit-scrollbar {\n width: 2px;\n }\n\n .ant-modal-root .ant-modal-wrap {\n position: fixed;\n overflow: inherit;\n }\n .ant-modal-root .ant-modal-centered .ant-modal{\n vertical-align: middle;\n position: absolute;\n bottom: 0;\n left: 0;\n width: 100% !important;\n max-width: 100%!important;\n // transform-origin: bottom !important;\n //animation-duration: 0s !important;\n animation-name: slideUp;\n animation-duration: 0.2s;\n transition: .3s ease-in-out;\n animation-timing-function: ease-in;\n }\n @keyframes slideUp {\n 0%,\n 50% {\n transform: translateY(100%);\n opacity: 0;\n }\n \n 60%,\n 100% {\n transform: translateY(0);\n opacity: 1;\n \n }\n }\n .ant-modal .ant-modal-content {\n bottom: -8px;\n left: 0;\n position: absolute;\n right: 0;\n border-bottom-left-radius: 0px;\n border-bottom-right-radius: 0px;\n }\n .ant-modal .ant-modal-body{\n max-height: calc(90vh - 126px);\n overflow: auto;\n padding-right: 16px;\n }\n .ant-modal-footer{\n padding-right: 16px !important;\n }\n .ant-modal .ant-modal-content{\n padding: 24px 16px 32px;\n padding-right: 0;\n }\n}\n\n.ant-dropdown .ant-dropdown-menu .ant-dropdown-menu-item{\n padding: 12px 24px;\n}\n.ant-dropdown-menu{\n min-width: 256px;\n top: 4px;\n}\n.ant-space-item span{\n line-height: 0 !important;\n display: flex;\n}\n.ant-select-dropdown{border-radius: 4px; padding:8px 0 !important;\n background: var(--color-primary-background) ;\n box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.14);}\n\n.ant-select-dropdown .ant-select-item { \n min-height: auto;\n padding: 12px 16px;\n color: var(--color-primary-content) ;\n line-height: 20px;\n border-radius: 0px;\n}\n\n.label-date-dropdown {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n gap: 16px;\n}\n\n.ant-select-dropdown .ant-select-item-option-active span{ color: var(--color-primary) !important;}\n.ant-picker-range {opacity: 0;}\n.ant-picker-dropdown-range { padding: 0; }\n\n.fadeImg{\n position: relative;\n width: 100%;\n max-height: 300px;\n overflow-x: auto;\n}\n.overLayImg{\n background: rgb(0 0 0 / 40%);\n border-radius: 12px 12px 0px 0px;\n overflow: hidden;\n}\n \n.OaTooltip .ant-tooltip-inner{\n padding: 24px 16px;\n background: #fff;\n color: #212121;\n box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.14);\n width: 348px;\n border-radius: 12px;\n}\n.OaTooltip .ant-tooltip-arrow:before{\n background: #fff !important;\n}\n.OaFooterBtn{\n display: flex;\n justify-content: end;\n}\n.OaTooltip{\n max-width: 348px !important;\n}\n.paddingBot .ant-drawer-body{\n padding-bottom: 100px !important;\n}\n.react-transform-component,.react-transform-wrapper,.react-transform-component > div{\n width: 100%;\n}\n.ascCollapse .ant-collapse-arrow{\n transform: rotate(90deg);\n color: var(--color-primary) !important;\n font-size: 14px !important;\n}\n.gappingIcons{\n display: flex;\n gap: 16px;\n}\n.imageZoom .ant-modal-body > div{\n height: 350px;\n overflow-y: auto;\n margin: 30px 0px 0px;\n padding: 0px 8px 0 0;;\n \n}\n/* width */\n.imageZoom ::-webkit-scrollbar {\n width: 8px;\n height: 100px;\n border-radius: 8px;\n}\n\n/* Track */\n.imageZoom ::-webkit-scrollbar-track {\n background: #f6f6f6; \n border-radius: 8px;\n}\n \n/* Handle */\n.imageZoom ::-webkit-scrollbar-thumb {\n background: #888; \n border-radius: 8px;\n height: 100px;\n}\n\n/* Handle on hover */\n.imageZoom ::-webkit-scrollbar-thumb:hover {\n background: #555; \n}\n .modalImg{\n width: 100%;\n }\n.overflowScroll{\n position: relative;\n}\n.ascCollapse .ant-collapse-header{\n border-radius: 4px !important;\n background: var(--color-secondary-background);\n}\n.ascCollapse,.ant-collapse{\n overflow: hidden;\n}\n.ascCollapse .totalVal{\n display: flex;\n gap: 12px;\n}\n.ascCollapse.ant-collapse-item-active .ant-collapse-arrow{\n transform: rotate(180deg) !important;\n}.mobilesIcons li.ant-dropdown-menu-item > svg {\n display: none\n}\n .ant-notification-notice-close svg{\n font-size: 24px !important;\n height: auto;\n }\n @media only screen and (max-width: 574px) {\n .ant-steps-item-tail{\n inset-inline-start: 78px !important;\n \n }\n}\n @media only screen and (max-width: 480px) {\n .ant-steps-item-tail{\n inset-inline-start: 60px !important;\n \n }\n}\n@media only screen and (max-width: 600px) {\n \n .ant-picker-dropdown .ant-picker-date-panel .ant-picker-body {\n padding: 8px;\n }\n .ant-picker-dropdown { width: 100%; left: 0 !important; }\n .mobilesIcons li.ant-dropdown-menu-item > svg {\n display: block;\n}\n.imageZoom .ant-modal-body>div{\n height: auto;\n overflow-y: auto;\n}\n.imageZoom .ant-modal-footer{\n padding-right: 16px !important;\n}\n .fadeImg{\n max-height: auto;\n }\n .ant-picker-dropdown .ant-picker-date-panel .ant-picker-content th {\n width: 24px; font-size: 12px; font-weight: bold; }\n\n .ant-picker-dropdown .ant-picker-content th {\n height: 24px;\n }\n .ant-picker-dropdown .ant-picker-content td {\n font-size: 12px;\n }\n .ant-picker-dropdown .ant-picker-date-panel .ant-picker-content {\n width: 100%;\n }\n\n}\n.ant-picker .ant-picker-clear{\n font-size: 20px;\n}\n\n"])));
|
|
11
11
|
var _default = exports.default = CommonStyles;
|
|
@@ -23,6 +23,7 @@ var _MaterialIcon = _interopRequireDefault(require("../../components/oa-componen
|
|
|
23
23
|
var _CustomTag = _interopRequireDefault(require("../../components/oa-component-tag/CustomTag"));
|
|
24
24
|
var _CustomTooltip = _interopRequireDefault(require("../../components/oa-component-tooltip/CustomTooltip"));
|
|
25
25
|
const _excluded = ["children", "description", "docDetails", "approvalForm", "isMandatory", "hasDivider", "isQuestionStyleWidget", "questionId", "title", "viewOnClick", "actionRenderType", "actionContent", "systemStatus", "documentTitle", "descriptionTitle", "data-test"];
|
|
26
|
+
/* eslint-disable */
|
|
26
27
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
27
28
|
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
28
29
|
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
@@ -70,7 +71,7 @@ function ApprovalWidget(_ref) {
|
|
|
70
71
|
systemStatus,
|
|
71
72
|
documentTitle,
|
|
72
73
|
descriptionTitle,
|
|
73
|
-
|
|
74
|
+
'data-test': dataTest
|
|
74
75
|
} = _ref,
|
|
75
76
|
props = _objectWithoutProperties(_ref, _excluded);
|
|
76
77
|
const getInitialValue = isApproved => {
|
|
@@ -88,11 +89,11 @@ function ApprovalWidget(_ref) {
|
|
|
88
89
|
return /*#__PURE__*/_react.default.createElement(_styles.StyledContainer, null, /*#__PURE__*/_react.default.createElement("div", {
|
|
89
90
|
className: "row"
|
|
90
91
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
91
|
-
className: approvalForm.hidden ?
|
|
92
|
+
className: approvalForm.hidden ? 'col-sm-12 col-md-12 col-lg-12' : 'col-sm-12 col-md-7 col-lg-7 gutter'
|
|
92
93
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
93
94
|
className: "row"
|
|
94
95
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
95
|
-
className: isQuestionStyleWidget ?
|
|
96
|
+
className: isQuestionStyleWidget ? 'col-sm-12 col-md-12 col-lg-12' : 'col-sm-12 col-md-9 col-lg-9 gutter flexCol12'
|
|
96
97
|
}, title && /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("h4", {
|
|
97
98
|
className: "type-b2-400"
|
|
98
99
|
}, title, isMandatory && /*#__PURE__*/_react.default.createElement(_styles.RedText, null, "*"))), description && /*#__PURE__*/_react.default.createElement(_styles.Styledescription, null, /*#__PURE__*/_react.default.createElement(_Typography.default, {
|
|
@@ -106,7 +107,7 @@ function ApprovalWidget(_ref) {
|
|
|
106
107
|
}, /*#__PURE__*/_react.default.createElement(_Typography.default, {
|
|
107
108
|
typography: "type-b2-400",
|
|
108
109
|
color: "secondary-content"
|
|
109
|
-
}, documentTitle, "
|
|
110
|
+
}, documentTitle, ' ', "\xA0"), /*#__PURE__*/_react.default.createElement(_UploadDownloadWidget.default, _extends({
|
|
110
111
|
disabled: (_approvalForm$disable = approvalForm === null || approvalForm === void 0 ? void 0 : approvalForm.disabled) !== null && _approvalForm$disable !== void 0 ? _approvalForm$disable : false,
|
|
111
112
|
"data-test": dataTest ? "".concat(dataTest, "--upload-download-widget") : undefined
|
|
112
113
|
}, docDetails, {
|
|
@@ -116,51 +117,49 @@ function ApprovalWidget(_ref) {
|
|
|
116
117
|
"data-test": dataTest ? "".concat(dataTest, "--view-button") : undefined,
|
|
117
118
|
onClick: () => viewOnClick(questionId),
|
|
118
119
|
type: "text-only",
|
|
119
|
-
label: isQuestionStyleWidget ?
|
|
120
|
+
label: isQuestionStyleWidget ? 'View Previous Description' : 'View History'
|
|
120
121
|
}), children)), !isQuestionStyleWidget && /*#__PURE__*/_react.default.createElement("div", {
|
|
121
122
|
className: "col-sm-12 col-md-3 col-lg-3 flexCol8"
|
|
122
|
-
}, systemStatus === null || systemStatus === void 0 ? void 0 : systemStatus.map(status =>
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
label: status.label
|
|
161
|
-
}))))))), approvalForm.invisible && /*#__PURE__*/_react.default.createElement("div", {
|
|
123
|
+
}, systemStatus === null || systemStatus === void 0 ? void 0 : systemStatus.map(status => {
|
|
124
|
+
var _status$items;
|
|
125
|
+
return /*#__PURE__*/_react.default.createElement("div", null, status.renderType === 'text' && /*#__PURE__*/_react.default.createElement(_Typography.default, {
|
|
126
|
+
typography: "type-b2-400",
|
|
127
|
+
color: "secondary-content"
|
|
128
|
+
}, status.label), status.renderType === 'tag' && /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_CustomTag.default, status)), status.renderType === 'toolTip' && ((_status$items = status.items) === null || _status$items === void 0 ? void 0 : _status$items.length) > 0 && /*#__PURE__*/_react.default.createElement(_CustomTooltip.default, {
|
|
129
|
+
overlayClassName: "multipleDocumentTooltip",
|
|
130
|
+
isDisplayed: true,
|
|
131
|
+
title: (() => {
|
|
132
|
+
const maxItemsPerColumn = 6; // Maximum 6 <li> per column
|
|
133
|
+
const columns = [];
|
|
134
|
+
|
|
135
|
+
// Splitting items into columns of max 6 items each
|
|
136
|
+
for (let i = 0; i < status.items.length; i += maxItemsPerColumn) {
|
|
137
|
+
columns.push(status.items.slice(i, i + maxItemsPerColumn));
|
|
138
|
+
}
|
|
139
|
+
return /*#__PURE__*/_react.default.createElement("div", {
|
|
140
|
+
className: "tooltip-grid"
|
|
141
|
+
}, columns.map(columnItems => {
|
|
142
|
+
var _columnItems$;
|
|
143
|
+
return /*#__PURE__*/_react.default.createElement("div", {
|
|
144
|
+
key: "col-".concat((_columnItems$ = columnItems[0]) === null || _columnItems$ === void 0 ? void 0 : _columnItems$.title),
|
|
145
|
+
className: "tooltip-column"
|
|
146
|
+
}, columnItems.map(item => /*#__PURE__*/_react.default.createElement("li", {
|
|
147
|
+
key: item.title,
|
|
148
|
+
className: "tooltip-item"
|
|
149
|
+
}, /*#__PURE__*/_react.default.createElement(_MaterialIcon.default, {
|
|
150
|
+
size: 20,
|
|
151
|
+
icon: item.type === 'positive' ? _Check.default : _Close.default,
|
|
152
|
+
color: item.type === 'positive' ? 'positive' : 'negative'
|
|
153
|
+
}), item.title)));
|
|
154
|
+
}));
|
|
155
|
+
})()
|
|
156
|
+
}, /*#__PURE__*/_react.default.createElement(_CustomButton.default, {
|
|
157
|
+
type: "text-only",
|
|
158
|
+
label: status.label
|
|
159
|
+
})));
|
|
160
|
+
})))), approvalForm.invisible && /*#__PURE__*/_react.default.createElement("div", {
|
|
162
161
|
className: "col-sm-12 col-md-5 col-lg-5"
|
|
163
|
-
}) || !approvalForm.hidden && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, actionRenderType ===
|
|
162
|
+
}) || !approvalForm.hidden && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, actionRenderType === 'text' && /*#__PURE__*/_react.default.createElement("div", {
|
|
164
163
|
className: "oaActionText"
|
|
165
164
|
}, /*#__PURE__*/_react.default.createElement(_MaterialIcon.default, {
|
|
166
165
|
icon: _CheckCircle.default,
|
|
@@ -168,7 +167,7 @@ function ApprovalWidget(_ref) {
|
|
|
168
167
|
}), /*#__PURE__*/_react.default.createElement(_Typography.default, {
|
|
169
168
|
typography: "type-b2-400",
|
|
170
169
|
color: "secondary-content"
|
|
171
|
-
}, (_actionContent$label = actionContent === null || actionContent === void 0 ? void 0 : actionContent.label) !== null && _actionContent$label !== void 0 ? _actionContent$label :
|
|
170
|
+
}, (_actionContent$label = actionContent === null || actionContent === void 0 ? void 0 : actionContent.label) !== null && _actionContent$label !== void 0 ? _actionContent$label : '-')), actionRenderType === 'button' && /*#__PURE__*/_react.default.createElement(_CustomButton.default, actionContent), actionRenderType === 'radio' && /*#__PURE__*/_react.default.createElement("div", {
|
|
172
171
|
className: "col-sm-12 col-md-5 col-lg-5"
|
|
173
172
|
}, /*#__PURE__*/_react.default.createElement(_antd.Form.Item, {
|
|
174
173
|
name: "isApproved-".concat(questionId),
|
|
@@ -178,7 +177,7 @@ function ApprovalWidget(_ref) {
|
|
|
178
177
|
required: true,
|
|
179
178
|
message: dataTest ? /*#__PURE__*/_react.default.createElement("span", {
|
|
180
179
|
"data-test": "".concat(dataTest, "--is-approved-validation-message")
|
|
181
|
-
}, "Approval status needs to be selected.") :
|
|
180
|
+
}, "Approval status needs to be selected.") : 'Approval status needs to be selected.'
|
|
182
181
|
}]
|
|
183
182
|
}, /*#__PURE__*/_react.default.createElement(_CustomRadio.default.Group, {
|
|
184
183
|
"data-test": dataTest ? "".concat(dataTest, "--is-approved-radio-group") : undefined,
|
|
@@ -198,12 +197,12 @@ function ApprovalWidget(_ref) {
|
|
|
198
197
|
className: "type-b2-400"
|
|
199
198
|
}, "Remarks"), /*#__PURE__*/_react.default.createElement(_antd.Form.Item, {
|
|
200
199
|
name: "remarks-".concat(questionId),
|
|
201
|
-
initialValue: (_approvalForm$remarks = approvalForm === null || approvalForm === void 0 ? void 0 : approvalForm.remarks) !== null && _approvalForm$remarks !== void 0 ? _approvalForm$remarks :
|
|
200
|
+
initialValue: (_approvalForm$remarks = approvalForm === null || approvalForm === void 0 ? void 0 : approvalForm.remarks) !== null && _approvalForm$remarks !== void 0 ? _approvalForm$remarks : '',
|
|
202
201
|
rules: [{
|
|
203
202
|
required: true,
|
|
204
203
|
message: dataTest ? /*#__PURE__*/_react.default.createElement("span", {
|
|
205
204
|
"data-test": "".concat(dataTest, "--remarks-validation-message")
|
|
206
|
-
}, "Remarks cannot be empty.") :
|
|
205
|
+
}, "Remarks cannot be empty.") : 'Remarks cannot be empty.'
|
|
207
206
|
}]
|
|
208
207
|
}, /*#__PURE__*/_react.default.createElement(_antd.Input.TextArea, {
|
|
209
208
|
"data-test": dataTest ? "".concat(dataTest, "--remarks") : undefined,
|
|
@@ -212,7 +211,7 @@ function ApprovalWidget(_ref) {
|
|
|
212
211
|
}
|
|
213
212
|
ApprovalWidget.propTypes = {
|
|
214
213
|
children: _propTypes.default.node,
|
|
215
|
-
|
|
214
|
+
'data-test': _propTypes.default.string,
|
|
216
215
|
description: _propTypes.default.string,
|
|
217
216
|
// Leave description optional
|
|
218
217
|
docDetails: _propTypes.default.shape({
|
|
@@ -253,8 +252,8 @@ ApprovalWidget.propTypes = {
|
|
|
253
252
|
};
|
|
254
253
|
ApprovalWidget.defaultProps = {
|
|
255
254
|
children: null,
|
|
256
|
-
|
|
257
|
-
description:
|
|
255
|
+
'data-test': undefined,
|
|
256
|
+
description: '',
|
|
258
257
|
docDetails: {},
|
|
259
258
|
approvalForm: {},
|
|
260
259
|
isMandatory: false,
|
|
@@ -264,7 +263,7 @@ ApprovalWidget.defaultProps = {
|
|
|
264
263
|
actionRenderType: undefined,
|
|
265
264
|
actionContent: {},
|
|
266
265
|
systemStatus: [],
|
|
267
|
-
documentTitle:
|
|
268
|
-
descriptionTitle:
|
|
266
|
+
documentTitle: '',
|
|
267
|
+
descriptionTitle: ''
|
|
269
268
|
};
|
|
270
269
|
var _default = exports.default = ApprovalWidget;
|
|
@@ -44,9 +44,9 @@ const getBase64 = file => new Promise((resolve, reject) => {
|
|
|
44
44
|
* @returns {undefined}
|
|
45
45
|
*/
|
|
46
46
|
const downloadFile = (base64String, fileName) => {
|
|
47
|
-
const link = document.createElement(
|
|
47
|
+
const link = document.createElement('a');
|
|
48
48
|
link.href = base64String;
|
|
49
|
-
link.download = fileName ||
|
|
49
|
+
link.download = fileName || 'download';
|
|
50
50
|
link.click();
|
|
51
51
|
};
|
|
52
52
|
|
|
@@ -80,7 +80,7 @@ function DocumentUpload(props) {
|
|
|
80
80
|
} = props;
|
|
81
81
|
const [previewOpen, setPreviewOpen] = (0, _react.useState)(false);
|
|
82
82
|
const [previewImage, setPreviewImage] = (0, _react.useState)(null);
|
|
83
|
-
const [previewTitle, setPreviewTitle] = (0, _react.useState)(
|
|
83
|
+
const [previewTitle, setPreviewTitle] = (0, _react.useState)('');
|
|
84
84
|
const [loading, setLoading] = (0, _react.useState)(false);
|
|
85
85
|
const [fileList, setFileList] = (0, _react.useState)(uploadedDocuments);
|
|
86
86
|
const handleCancel = () => setPreviewOpen(false);
|
|
@@ -91,10 +91,10 @@ function DocumentUpload(props) {
|
|
|
91
91
|
function isImageFile(fileName) {
|
|
92
92
|
var _fileName$split;
|
|
93
93
|
// Extract the file extension from the file name
|
|
94
|
-
const fileExtension = fileName === null || fileName === void 0 || (_fileName$split = fileName.split(
|
|
94
|
+
const fileExtension = fileName === null || fileName === void 0 || (_fileName$split = fileName.split('.')) === null || _fileName$split === void 0 || (_fileName$split = _fileName$split.pop()) === null || _fileName$split === void 0 ? void 0 : _fileName$split.toLowerCase();
|
|
95
95
|
|
|
96
96
|
// Define an array of image file extensions
|
|
97
|
-
const imageFileExtensions = [
|
|
97
|
+
const imageFileExtensions = ['jpg', 'jpeg', 'png', 'gif', 'bmp', 'tiff', 'svg'];
|
|
98
98
|
|
|
99
99
|
// Check if the file extension is in the array of image file extensions
|
|
100
100
|
if (imageFileExtensions.indexOf(fileExtension) !== -1) {
|
|
@@ -143,15 +143,15 @@ function DocumentUpload(props) {
|
|
|
143
143
|
fileList: newFileList,
|
|
144
144
|
file
|
|
145
145
|
} = _ref;
|
|
146
|
-
if (file.status ===
|
|
147
|
-
onChange(null,
|
|
146
|
+
if (file.status === 'removed') {
|
|
147
|
+
onChange(null, 'removed');
|
|
148
148
|
}
|
|
149
149
|
const modifiedList = await Promise.all(newFileList.map(async files => {
|
|
150
150
|
let modifiedFile = files;
|
|
151
151
|
setLoading(true);
|
|
152
152
|
try {
|
|
153
153
|
await onChange(files);
|
|
154
|
-
modifiedFile.status =
|
|
154
|
+
modifiedFile.status = 'done';
|
|
155
155
|
if (!isImageFile(file === null || file === void 0 ? void 0 : file.name)) {
|
|
156
156
|
var _modifiedFile, _modifiedFile2;
|
|
157
157
|
modifiedFile.url = _PdfSampleImage.default;
|
|
@@ -170,7 +170,7 @@ function DocumentUpload(props) {
|
|
|
170
170
|
const uploadButton = /*#__PURE__*/_react.default.createElement("button", {
|
|
171
171
|
style: {
|
|
172
172
|
border: 0,
|
|
173
|
-
background:
|
|
173
|
+
background: 'none'
|
|
174
174
|
},
|
|
175
175
|
type: "button"
|
|
176
176
|
}, loading ? /*#__PURE__*/_react.default.createElement(_icons.LoadingOutlined, null) : /*#__PURE__*/_react.default.createElement(_CustomIcon.default, {
|
|
@@ -187,7 +187,7 @@ function DocumentUpload(props) {
|
|
|
187
187
|
color: "negative"
|
|
188
188
|
}, " *"))), subText && /*#__PURE__*/_react.default.createElement("div", {
|
|
189
189
|
style: {
|
|
190
|
-
whiteSpace:
|
|
190
|
+
whiteSpace: 'pre-line'
|
|
191
191
|
}
|
|
192
192
|
}, /*#__PURE__*/_react.default.createElement(_Typography.default, {
|
|
193
193
|
color: "secondary-content",
|
|
@@ -200,12 +200,12 @@ function DocumentUpload(props) {
|
|
|
200
200
|
}, multipleDoc > 0 && /*#__PURE__*/_react.default.createElement("em", null, multipleDoc), /*#__PURE__*/_react.default.createElement(_antd.ConfigProvider, {
|
|
201
201
|
theme: {
|
|
202
202
|
token: {
|
|
203
|
-
colorBorder: _ColorVariablesMap.default[
|
|
203
|
+
colorBorder: _ColorVariablesMap.default['--color-primary'],
|
|
204
204
|
borderRadiusLG: 4,
|
|
205
|
-
colorPrimaryBorder: _ColorVariablesMap.default[
|
|
206
|
-
colorFillAlter: _ColorVariablesMap.default[
|
|
207
|
-
colorError: _ColorVariablesMap.default[
|
|
208
|
-
colorText: _ColorVariablesMap.default[
|
|
205
|
+
colorPrimaryBorder: _ColorVariablesMap.default['--color-divider'],
|
|
206
|
+
colorFillAlter: _ColorVariablesMap.default['--color-secondary-background'],
|
|
207
|
+
colorError: _ColorVariablesMap.default['--color-negative'],
|
|
208
|
+
colorText: _ColorVariablesMap.default['--color-primary']
|
|
209
209
|
}
|
|
210
210
|
}
|
|
211
211
|
}, /*#__PURE__*/_react.default.createElement(_antd.Form.Item, {
|
|
@@ -229,12 +229,12 @@ function DocumentUpload(props) {
|
|
|
229
229
|
onCancel: handleCancel
|
|
230
230
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
231
231
|
style: {
|
|
232
|
-
textAlign:
|
|
232
|
+
textAlign: 'center'
|
|
233
233
|
}
|
|
234
|
-
},
|
|
234
|
+
}, ' ', previewImage ? /*#__PURE__*/_react.default.createElement("img", {
|
|
235
235
|
alt: "example",
|
|
236
236
|
style: {
|
|
237
|
-
width:
|
|
237
|
+
width: '100%'
|
|
238
238
|
},
|
|
239
239
|
src: previewImage
|
|
240
240
|
}) : /*#__PURE__*/_react.default.createElement(_CustomLoader.default, null))));
|
|
@@ -255,10 +255,10 @@ DocumentUpload.propTypes = {
|
|
|
255
255
|
DocumentUpload.defaultProps = {
|
|
256
256
|
uploadedDocuments: [],
|
|
257
257
|
onChange: () => {},
|
|
258
|
-
subText:
|
|
259
|
-
heading:
|
|
260
|
-
formName:
|
|
261
|
-
infoText:
|
|
258
|
+
subText: '',
|
|
259
|
+
heading: '',
|
|
260
|
+
formName: '',
|
|
261
|
+
infoText: '',
|
|
262
262
|
multipleDoc: 0,
|
|
263
263
|
showDelete: true,
|
|
264
264
|
getPreview: () => {},
|