@bchr/bchr-front-lib 0.6.1 → 0.6.3
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/lib/base/layout/ui_tpl/InputPasswordDecrypt.js +201 -48
- package/lib/base/layout/ui_tpl/consts.js +1 -0
- package/lib/base/layout/ui_tpl/form/FormForBrowse.js +8 -0
- package/lib/base/layout/ui_tpl/form/FormForModify.js +21 -2
- package/lib/base/layout/ui_tpl/grid/GridForBrowse.js +8 -2
- package/lib/base/layout/ui_tpl/grid/GridForModify.js +22 -0
- package/package.json +1 -1
- package/src/base/layout/ui_tpl/InputPasswordDecrypt.js +164 -15
- package/src/base/layout/ui_tpl/consts.js +1 -0
- package/src/base/layout/ui_tpl/form/FormForBrowse.js +12 -0
- package/src/base/layout/ui_tpl/form/FormForModify.js +28 -2
- package/src/base/layout/ui_tpl/grid/GridForBrowse.js +9 -2
- package/src/base/layout/ui_tpl/grid/GridForModify.js +24 -0
|
@@ -8,8 +8,10 @@ exports["default"] = void 0;
|
|
|
8
8
|
var _react = _interopRequireWildcard(require("react"));
|
|
9
9
|
var _antd = require("antd");
|
|
10
10
|
var _HttpService = _interopRequireDefault(require("../../../services/HttpService"));
|
|
11
|
+
var _excluded = ["ui_render_type", "initValue", "value", "onChange", "requestUrl", "appconfig", "appConfig", "maskLength", "placeholder", "maxLength", "allowClear", "onKeyDown", "onPaste"];
|
|
11
12
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
|
|
12
13
|
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t2 in e) "default" !== _t2 && {}.hasOwnProperty.call(e, _t2) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t2)) && (i.get || i.set) ? o(f, _t2, i) : f[_t2] = e[_t2]); return f; })(e, t); }
|
|
14
|
+
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
|
|
13
15
|
function _regenerator() { /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/babel/babel/blob/main/packages/babel-helpers/LICENSE */ var e, t, r = "function" == typeof Symbol ? Symbol : {}, n = r.iterator || "@@iterator", o = r.toStringTag || "@@toStringTag"; function i(r, n, o, i) { var c = n && n.prototype instanceof Generator ? n : Generator, u = Object.create(c.prototype); return _regeneratorDefine2(u, "_invoke", function (r, n, o) { var i, c, u, f = 0, p = o || [], y = !1, G = { p: 0, n: 0, v: e, a: d, f: d.bind(e, 4), d: function d(t, r) { return i = t, c = 0, u = e, G.n = r, a; } }; function d(r, n) { for (c = r, u = n, t = 0; !y && f && !o && t < p.length; t++) { var o, i = p[t], d = G.p, l = i[2]; r > 3 ? (o = l === n) && (u = i[(c = i[4]) ? 5 : (c = 3, 3)], i[4] = i[5] = e) : i[0] <= d && ((o = r < 2 && d < i[1]) ? (c = 0, G.v = n, G.n = i[1]) : d < l && (o = r < 3 || i[0] > n || n > l) && (i[4] = r, i[5] = n, G.n = l, c = 0)); } if (o || r > 1) return a; throw y = !0, n; } return function (o, p, l) { if (f > 1) throw TypeError("Generator is already running"); for (y && 1 === p && d(p, l), c = p, u = l; (t = c < 2 ? e : u) || !y;) { i || (c ? c < 3 ? (c > 1 && (G.n = -1), d(c, u)) : G.n = u : G.v = u); try { if (f = 2, i) { if (c || (o = "next"), t = i[o]) { if (!(t = t.call(i, u))) throw TypeError("iterator result is not an object"); if (!t.done) return t; u = t.value, c < 2 && (c = 0); } else 1 === c && (t = i["return"]) && t.call(i), c < 2 && (u = TypeError("The iterator does not provide a '" + o + "' method"), c = 1); i = e; } else if ((t = (y = G.n < 0) ? u : r.call(n, G)) !== a) break; } catch (t) { i = e, c = 1, u = t; } finally { f = 1; } } return { value: t, done: y }; }; }(r, o, i), !0), u; } var a = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} t = Object.getPrototypeOf; var c = [][n] ? t(t([][n]())) : (_regeneratorDefine2(t = {}, n, function () { return this; }), t), u = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(c); function f(e) { return Object.setPrototypeOf ? Object.setPrototypeOf(e, GeneratorFunctionPrototype) : (e.__proto__ = GeneratorFunctionPrototype, _regeneratorDefine2(e, o, "GeneratorFunction")), e.prototype = Object.create(u), e; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, _regeneratorDefine2(u, "constructor", GeneratorFunctionPrototype), _regeneratorDefine2(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = "GeneratorFunction", _regeneratorDefine2(GeneratorFunctionPrototype, o, "GeneratorFunction"), _regeneratorDefine2(u), _regeneratorDefine2(u, o, "Generator"), _regeneratorDefine2(u, n, function () { return this; }), _regeneratorDefine2(u, "toString", function () { return "[object Generator]"; }), (_regenerator = function _regenerator() { return { w: i, m: f }; })(); }
|
|
14
16
|
function _regeneratorDefine2(e, r, n, t) { var i = Object.defineProperty; try { i({}, "", {}); } catch (e) { i = 0; } _regeneratorDefine2 = function _regeneratorDefine(e, r, n, t) { function o(r, n) { _regeneratorDefine2(e, r, function (e) { return this._invoke(r, n, e); }); } r ? i ? i(e, r, { value: n, enumerable: !t, configurable: !t, writable: !t }) : e[r] = n : (o("next", 0), o("throw", 1), o("return", 2)); }, _regeneratorDefine2(e, r, n, t); }
|
|
15
17
|
function asyncGeneratorStep(n, t, e, r, o, a, c) { try { var i = n[a](c), u = i.value; } catch (n) { return void e(n); } i.done ? t(u) : Promise.resolve(u).then(r, o); }
|
|
@@ -20,54 +22,80 @@ function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r)
|
|
|
20
22
|
function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
|
|
21
23
|
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
22
24
|
function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
|
|
25
|
+
function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
|
|
26
|
+
function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
|
|
23
27
|
var MASK_LENGTH = 8;
|
|
28
|
+
var normalizeValue = function normalizeValue(value) {
|
|
29
|
+
if (value === null || value === undefined) {
|
|
30
|
+
return "";
|
|
31
|
+
}
|
|
32
|
+
return String(value);
|
|
33
|
+
};
|
|
24
34
|
var maskValue = function maskValue(value, maskLength) {
|
|
25
35
|
if (value === null || value === undefined || value === "") {
|
|
26
36
|
return "";
|
|
27
37
|
}
|
|
28
38
|
return "*".repeat(maskLength);
|
|
29
39
|
};
|
|
40
|
+
var limitText = function limitText(text, maxLength) {
|
|
41
|
+
if (typeof maxLength === "number" && maxLength > 0 && text.length > maxLength) {
|
|
42
|
+
return text.slice(0, maxLength);
|
|
43
|
+
}
|
|
44
|
+
return text;
|
|
45
|
+
};
|
|
30
46
|
var InputPasswordDecrypt = function InputPasswordDecrypt(props) {
|
|
31
47
|
var ui_render_type = props.ui_render_type,
|
|
32
48
|
initValue = props.initValue,
|
|
49
|
+
value = props.value,
|
|
50
|
+
onChange = props.onChange,
|
|
33
51
|
requestUrl = props.requestUrl,
|
|
34
52
|
appconfig = props.appconfig,
|
|
35
53
|
appConfig = props.appConfig,
|
|
36
|
-
maskLength = props.maskLength
|
|
54
|
+
maskLength = props.maskLength,
|
|
55
|
+
placeholder = props.placeholder,
|
|
56
|
+
maxLength = props.maxLength,
|
|
57
|
+
_props$allowClear = props.allowClear,
|
|
58
|
+
allowClear = _props$allowClear === void 0 ? true : _props$allowClear,
|
|
59
|
+
onKeyDown = props.onKeyDown,
|
|
60
|
+
onPaste = props.onPaste,
|
|
61
|
+
restInputProps = _objectWithoutProperties(props, _excluded);
|
|
37
62
|
var resolvedMaskLength = Number.isInteger(maskLength) && maskLength > 0 ? maskLength : MASK_LENGTH;
|
|
38
63
|
var serviceConfig = appconfig || appConfig;
|
|
39
|
-
var
|
|
64
|
+
var incomingValue = normalizeValue(value !== undefined ? value : initValue);
|
|
65
|
+
var _useState = (0, _react.useState)(incomingValue),
|
|
40
66
|
_useState2 = _slicedToArray(_useState, 2),
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
var _useState3 = (0, _react.useState)(
|
|
67
|
+
realValue = _useState2[0],
|
|
68
|
+
setRealValue = _useState2[1];
|
|
69
|
+
var _useState3 = (0, _react.useState)(false),
|
|
44
70
|
_useState4 = _slicedToArray(_useState3, 2),
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
var _useState5 = (0, _react.useState)(
|
|
71
|
+
toggle = _useState4[0],
|
|
72
|
+
setToggle = _useState4[1];
|
|
73
|
+
var _useState5 = (0, _react.useState)(maskValue(initValue, resolvedMaskLength)),
|
|
48
74
|
_useState6 = _slicedToArray(_useState5, 2),
|
|
49
|
-
|
|
50
|
-
|
|
75
|
+
toggleVal = _useState6[0],
|
|
76
|
+
setToggleVal = _useState6[1];
|
|
77
|
+
var _useState7 = (0, _react.useState)(false),
|
|
78
|
+
_useState8 = _slicedToArray(_useState7, 2),
|
|
79
|
+
loading = _useState8[0],
|
|
80
|
+
setLoading = _useState8[1];
|
|
51
81
|
var timerRef = (0, _react.useRef)(null);
|
|
52
82
|
var requestSeqRef = (0, _react.useRef)(0);
|
|
83
|
+
var realValueRef = (0, _react.useRef)(incomingValue);
|
|
84
|
+
var originalRef = (0, _react.useRef)(incomingValue);
|
|
85
|
+
var emittedRef = (0, _react.useRef)(incomingValue);
|
|
86
|
+
var editingRef = (0, _react.useRef)(false);
|
|
87
|
+
var maskLengthRef = (0, _react.useRef)(resolvedMaskLength);
|
|
88
|
+
realValueRef.current = ui_render_type === "modify" ? realValue : normalizeValue(initValue);
|
|
89
|
+
maskLengthRef.current = resolvedMaskLength;
|
|
53
90
|
var clearHideTimer = function clearHideTimer() {
|
|
54
91
|
if (timerRef.current) {
|
|
55
92
|
clearTimeout(timerRef.current);
|
|
56
93
|
timerRef.current = null;
|
|
57
94
|
}
|
|
58
95
|
};
|
|
59
|
-
(0, _react.useEffect)(function () {
|
|
60
|
-
setToggle(false);
|
|
61
|
-
setToggleVal(maskValue(initValue, resolvedMaskLength));
|
|
62
|
-
setLoading(false);
|
|
63
|
-
return function () {
|
|
64
|
-
requestSeqRef.current += 1;
|
|
65
|
-
clearHideTimer();
|
|
66
|
-
};
|
|
67
|
-
}, [initValue, resolvedMaskLength]);
|
|
68
96
|
var hidePlainText = function hidePlainText() {
|
|
69
97
|
clearHideTimer();
|
|
70
|
-
setToggleVal(maskValue(
|
|
98
|
+
setToggleVal(maskValue(realValueRef.current, maskLengthRef.current));
|
|
71
99
|
setToggle(false);
|
|
72
100
|
};
|
|
73
101
|
var showPlainText = function showPlainText(plainText) {
|
|
@@ -76,13 +104,63 @@ var InputPasswordDecrypt = function InputPasswordDecrypt(props) {
|
|
|
76
104
|
setToggle(true);
|
|
77
105
|
timerRef.current = setTimeout(function () {
|
|
78
106
|
timerRef.current = null;
|
|
79
|
-
setToggleVal(maskValue(
|
|
107
|
+
setToggleVal(maskValue(realValueRef.current, maskLengthRef.current));
|
|
80
108
|
setToggle(false);
|
|
81
109
|
}, 5000);
|
|
82
110
|
};
|
|
111
|
+
(0, _react.useEffect)(function () {
|
|
112
|
+
return function () {
|
|
113
|
+
requestSeqRef.current += 1;
|
|
114
|
+
clearHideTimer();
|
|
115
|
+
};
|
|
116
|
+
}, []);
|
|
117
|
+
(0, _react.useEffect)(function () {
|
|
118
|
+
if (ui_render_type === "modify") {
|
|
119
|
+
return undefined;
|
|
120
|
+
}
|
|
121
|
+
setToggle(false);
|
|
122
|
+
setToggleVal(maskValue(initValue, resolvedMaskLength));
|
|
123
|
+
setLoading(false);
|
|
124
|
+
return function () {
|
|
125
|
+
requestSeqRef.current += 1;
|
|
126
|
+
clearHideTimer();
|
|
127
|
+
};
|
|
128
|
+
}, [ui_render_type, initValue, resolvedMaskLength]);
|
|
129
|
+
(0, _react.useEffect)(function () {
|
|
130
|
+
if (ui_render_type !== "modify" || incomingValue === emittedRef.current) {
|
|
131
|
+
return undefined;
|
|
132
|
+
}
|
|
133
|
+
emittedRef.current = incomingValue;
|
|
134
|
+
originalRef.current = incomingValue;
|
|
135
|
+
editingRef.current = false;
|
|
136
|
+
realValueRef.current = incomingValue;
|
|
137
|
+
setRealValue(incomingValue);
|
|
138
|
+
requestSeqRef.current += 1;
|
|
139
|
+
clearHideTimer();
|
|
140
|
+
setToggle(false);
|
|
141
|
+
setToggleVal(maskValue(incomingValue, resolvedMaskLength));
|
|
142
|
+
setLoading(false);
|
|
143
|
+
}, [ui_render_type, incomingValue, resolvedMaskLength]);
|
|
144
|
+
var commitValue = function commitValue(nextValue, reveal) {
|
|
145
|
+
var normalized = limitText(normalizeValue(nextValue), maxLength);
|
|
146
|
+
emittedRef.current = normalized;
|
|
147
|
+
editingRef.current = true;
|
|
148
|
+
realValueRef.current = normalized;
|
|
149
|
+
setRealValue(normalized);
|
|
150
|
+
if (reveal) {
|
|
151
|
+
showPlainText(normalized);
|
|
152
|
+
}
|
|
153
|
+
if (onChange) {
|
|
154
|
+
onChange({
|
|
155
|
+
target: {
|
|
156
|
+
value: normalized
|
|
157
|
+
}
|
|
158
|
+
});
|
|
159
|
+
}
|
|
160
|
+
};
|
|
83
161
|
var onToggleFull = /*#__PURE__*/function () {
|
|
84
162
|
var _ref = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee() {
|
|
85
|
-
var requestSeq, result, _t;
|
|
163
|
+
var secret, requestSeq, result, _t;
|
|
86
164
|
return _regenerator().w(function (_context) {
|
|
87
165
|
while (1) switch (_context.p = _context.n) {
|
|
88
166
|
case 0:
|
|
@@ -99,82 +177,157 @@ var InputPasswordDecrypt = function InputPasswordDecrypt(props) {
|
|
|
99
177
|
}
|
|
100
178
|
return _context.a(2);
|
|
101
179
|
case 2:
|
|
102
|
-
|
|
180
|
+
secret = realValueRef.current;
|
|
181
|
+
if (!(ui_render_type === "modify" && (secret === "" || editingRef.current || secret !== originalRef.current))) {
|
|
182
|
+
_context.n = 4;
|
|
183
|
+
break;
|
|
184
|
+
}
|
|
185
|
+
if (!(secret === "")) {
|
|
103
186
|
_context.n = 3;
|
|
104
187
|
break;
|
|
105
188
|
}
|
|
106
|
-
_antd.message.error("请为组件注入属性【requestUrl】");
|
|
107
189
|
return _context.a(2);
|
|
108
190
|
case 3:
|
|
191
|
+
showPlainText(secret);
|
|
192
|
+
return _context.a(2);
|
|
193
|
+
case 4:
|
|
194
|
+
if (secret) {
|
|
195
|
+
_context.n = 5;
|
|
196
|
+
break;
|
|
197
|
+
}
|
|
198
|
+
return _context.a(2);
|
|
199
|
+
case 5:
|
|
200
|
+
if (requestUrl) {
|
|
201
|
+
_context.n = 6;
|
|
202
|
+
break;
|
|
203
|
+
}
|
|
204
|
+
_antd.message.error("请为组件注入属性【requestUrl】");
|
|
205
|
+
return _context.a(2);
|
|
206
|
+
case 6:
|
|
109
207
|
if (serviceConfig) {
|
|
110
|
-
_context.n =
|
|
208
|
+
_context.n = 7;
|
|
111
209
|
break;
|
|
112
210
|
}
|
|
113
211
|
_antd.message.error("请为组件注入属性【appconfig】");
|
|
114
212
|
return _context.a(2);
|
|
115
|
-
case
|
|
213
|
+
case 7:
|
|
116
214
|
requestSeq = requestSeqRef.current + 1;
|
|
117
215
|
requestSeqRef.current = requestSeq;
|
|
118
216
|
setLoading(true);
|
|
119
|
-
_context.p =
|
|
120
|
-
_context.n =
|
|
217
|
+
_context.p = 8;
|
|
218
|
+
_context.n = 9;
|
|
121
219
|
return new _HttpService["default"](requestUrl, serviceConfig).post("decrypt", {
|
|
122
|
-
data:
|
|
220
|
+
data: secret
|
|
123
221
|
});
|
|
124
|
-
case
|
|
222
|
+
case 9:
|
|
125
223
|
result = _context.v;
|
|
126
224
|
if (!(requestSeq !== requestSeqRef.current)) {
|
|
127
|
-
_context.n =
|
|
225
|
+
_context.n = 10;
|
|
128
226
|
break;
|
|
129
227
|
}
|
|
130
228
|
return _context.a(2);
|
|
131
|
-
case
|
|
229
|
+
case 10:
|
|
132
230
|
if (!(typeof result !== "string")) {
|
|
133
|
-
_context.n =
|
|
231
|
+
_context.n = 11;
|
|
134
232
|
break;
|
|
135
233
|
}
|
|
136
234
|
_antd.message.error("解密失败");
|
|
137
235
|
return _context.a(2);
|
|
138
|
-
case
|
|
236
|
+
case 11:
|
|
139
237
|
showPlainText(result);
|
|
140
|
-
_context.n =
|
|
238
|
+
_context.n = 14;
|
|
141
239
|
break;
|
|
142
|
-
case
|
|
143
|
-
_context.p =
|
|
240
|
+
case 12:
|
|
241
|
+
_context.p = 12;
|
|
144
242
|
_t = _context.v;
|
|
145
243
|
if (!(requestSeq !== requestSeqRef.current)) {
|
|
146
|
-
_context.n =
|
|
244
|
+
_context.n = 13;
|
|
147
245
|
break;
|
|
148
246
|
}
|
|
149
247
|
return _context.a(2);
|
|
150
|
-
case
|
|
248
|
+
case 13:
|
|
151
249
|
if (_t && _t.responseJSON && _t.responseJSON.msg) {
|
|
152
250
|
_antd.message.error(_t.responseJSON.msg);
|
|
153
251
|
} else {
|
|
154
252
|
_antd.message.error("解密失败");
|
|
155
253
|
}
|
|
156
|
-
case
|
|
157
|
-
_context.p =
|
|
254
|
+
case 14:
|
|
255
|
+
_context.p = 14;
|
|
158
256
|
if (requestSeq === requestSeqRef.current) {
|
|
159
257
|
setLoading(false);
|
|
160
258
|
}
|
|
161
|
-
return _context.f(
|
|
162
|
-
case
|
|
259
|
+
return _context.f(14);
|
|
260
|
+
case 15:
|
|
163
261
|
return _context.a(2);
|
|
164
262
|
}
|
|
165
|
-
}, _callee, null, [[
|
|
263
|
+
}, _callee, null, [[8, 12, 14, 15]]);
|
|
166
264
|
}));
|
|
167
265
|
return function onToggleFull() {
|
|
168
266
|
return _ref.apply(this, arguments);
|
|
169
267
|
};
|
|
170
268
|
}();
|
|
269
|
+
var onModifyKeyDown = function onModifyKeyDown(event) {
|
|
270
|
+
if (onKeyDown) {
|
|
271
|
+
onKeyDown(event);
|
|
272
|
+
}
|
|
273
|
+
if (toggle || event.defaultPrevented || event.ctrlKey || event.metaKey || event.altKey || event.isComposing) {
|
|
274
|
+
return;
|
|
275
|
+
}
|
|
276
|
+
if (event.key === "Backspace" || event.key === "Delete") {
|
|
277
|
+
event.preventDefault();
|
|
278
|
+
commitValue("", false);
|
|
279
|
+
return;
|
|
280
|
+
}
|
|
281
|
+
if (event.key.length !== 1) {
|
|
282
|
+
return;
|
|
283
|
+
}
|
|
284
|
+
event.preventDefault();
|
|
285
|
+
var nextValue = editingRef.current ? realValueRef.current + event.key : event.key;
|
|
286
|
+
commitValue(nextValue, false);
|
|
287
|
+
};
|
|
288
|
+
var onModifyPaste = function onModifyPaste(event) {
|
|
289
|
+
if (onPaste) {
|
|
290
|
+
onPaste(event);
|
|
291
|
+
}
|
|
292
|
+
if (toggle || event.defaultPrevented) {
|
|
293
|
+
return;
|
|
294
|
+
}
|
|
295
|
+
var text = event.clipboardData ? event.clipboardData.getData("text") : "";
|
|
296
|
+
event.preventDefault();
|
|
297
|
+
if (!text) {
|
|
298
|
+
return;
|
|
299
|
+
}
|
|
300
|
+
var nextValue = editingRef.current ? realValueRef.current + text : text;
|
|
301
|
+
commitValue(nextValue, false);
|
|
302
|
+
};
|
|
303
|
+
var onModifyChange = function onModifyChange(event) {
|
|
304
|
+
var nextValue = event.target.value;
|
|
305
|
+
if (!toggle) {
|
|
306
|
+
if (nextValue === "") {
|
|
307
|
+
commitValue("", false);
|
|
308
|
+
}
|
|
309
|
+
return;
|
|
310
|
+
}
|
|
311
|
+
commitValue(nextValue, true);
|
|
312
|
+
};
|
|
171
313
|
if (ui_render_type === "modify") {
|
|
172
|
-
|
|
173
|
-
|
|
314
|
+
var modifyDisplay = toggle ? toggleVal : maskValue(realValue, resolvedMaskLength);
|
|
315
|
+
return /*#__PURE__*/_react["default"].createElement(_antd.Input, _extends({}, restInputProps, {
|
|
316
|
+
value: modifyDisplay,
|
|
317
|
+
placeholder: placeholder,
|
|
318
|
+
allowClear: allowClear,
|
|
319
|
+
maxLength: toggle && typeof maxLength === "number" ? maxLength : undefined,
|
|
320
|
+
onChange: onModifyChange,
|
|
321
|
+
onKeyDown: onModifyKeyDown,
|
|
322
|
+
onPaste: onModifyPaste,
|
|
174
323
|
addonAfter: /*#__PURE__*/_react["default"].createElement("span", {
|
|
175
|
-
className: "iconfont ".concat(toggle ? "icon-bchr-show" : "icon-bchr-hide")
|
|
324
|
+
className: "iconfont ".concat(toggle ? "icon-bchr-show" : "icon-bchr-hide"),
|
|
325
|
+
style: {
|
|
326
|
+
cursor: "pointer"
|
|
327
|
+
},
|
|
328
|
+
onClick: onToggleFull
|
|
176
329
|
})
|
|
177
|
-
});
|
|
330
|
+
}));
|
|
178
331
|
} else if (ui_render_type === "browse") {
|
|
179
332
|
return /*#__PURE__*/_react["default"].createElement(_react.Fragment, null, /*#__PURE__*/_react["default"].createElement("span", null, toggleVal, /*#__PURE__*/_react["default"].createElement("span", {
|
|
180
333
|
className: "iconfont ".concat(toggle ? "icon-bchr-show" : "icon-bchr-hide"),
|
|
@@ -7,6 +7,7 @@ exports.UI_RENDER_TYPE = exports.EXPORT_GRID_HEADER_CELL_OPTIONS = exports.EXPOR
|
|
|
7
7
|
var UI_RENDER_TYPE = exports.UI_RENDER_TYPE = {
|
|
8
8
|
INPUT: "input",
|
|
9
9
|
INPUT_PASSWORD: "inputPassword",
|
|
10
|
+
INPUT_PASSWORD_DECRYPT: "inputPasswordDecrypt",
|
|
10
11
|
INPUT_NUMBER: "inputNumber",
|
|
11
12
|
TEXT_AREA: "textArea",
|
|
12
13
|
DATE: "date",
|
|
@@ -10,6 +10,7 @@ var _antd = require("antd");
|
|
|
10
10
|
var _icons = require("@ant-design/icons");
|
|
11
11
|
var _moment = _interopRequireDefault(require("moment"));
|
|
12
12
|
var _consts = require("../consts");
|
|
13
|
+
var _InputPassword = _interopRequireDefault(require("../InputPassword"));
|
|
13
14
|
var _InputPasswordDecrypt = _interopRequireDefault(require("../InputPasswordDecrypt"));
|
|
14
15
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
|
|
15
16
|
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
|
|
@@ -289,6 +290,7 @@ var FormForBrowse = /*#__PURE__*/function (_React$Component) {
|
|
|
289
290
|
case _consts.UI_RENDER_TYPE.INPUT:
|
|
290
291
|
case _consts.UI_RENDER_TYPE.INPUT_NUMBER:
|
|
291
292
|
case _consts.UI_RENDER_TYPE.INPUT_PASSWORD:
|
|
293
|
+
case _consts.UI_RENDER_TYPE.INPUT_PASSWORD_DECRYPT:
|
|
292
294
|
case _consts.UI_RENDER_TYPE.TEXT_AREA:
|
|
293
295
|
case _consts.UI_RENDER_TYPE.SELECT:
|
|
294
296
|
case _consts.UI_RENDER_TYPE.TREE_SELECT:
|
|
@@ -320,6 +322,12 @@ var FormForBrowse = /*#__PURE__*/function (_React$Component) {
|
|
|
320
322
|
}
|
|
321
323
|
components = /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement("span", null, value));
|
|
322
324
|
if (ui_render_type === _consts.UI_RENDER_TYPE.INPUT_PASSWORD) {
|
|
325
|
+
components = /*#__PURE__*/_react["default"].createElement("div", null, initialValues[code] && /*#__PURE__*/_react["default"].createElement(_InputPassword["default"], {
|
|
326
|
+
ui_render_type: 'browse',
|
|
327
|
+
initValue: initialValues[code]
|
|
328
|
+
}));
|
|
329
|
+
}
|
|
330
|
+
if (ui_render_type === _consts.UI_RENDER_TYPE.INPUT_PASSWORD_DECRYPT) {
|
|
323
331
|
components = /*#__PURE__*/_react["default"].createElement("div", null, initialValues[code] && /*#__PURE__*/_react["default"].createElement(_InputPasswordDecrypt["default"], {
|
|
324
332
|
ui_render_type: 'browse',
|
|
325
333
|
initValue: initialValues[code],
|
|
@@ -11,6 +11,7 @@ var _moment = _interopRequireDefault(require("moment"));
|
|
|
11
11
|
var _consts = require("../consts");
|
|
12
12
|
var _zh_CN = _interopRequireDefault(require("antd/es/locale/zh_CN"));
|
|
13
13
|
var _HttpService = _interopRequireDefault(require("../../../../services/HttpService"));
|
|
14
|
+
var _InputPassword = _interopRequireDefault(require("../InputPassword"));
|
|
14
15
|
var _InputPasswordDecrypt = _interopRequireDefault(require("../InputPasswordDecrypt"));
|
|
15
16
|
require("../../../AppFormulaFunctions");
|
|
16
17
|
var _BaseAppUtils = require("../../../BaseAppUtils");
|
|
@@ -330,14 +331,31 @@ var FormForModify = /*#__PURE__*/function (_React$Component) {
|
|
|
330
331
|
}, ext_props));
|
|
331
332
|
break;
|
|
332
333
|
case _consts.UI_RENDER_TYPE.INPUT_PASSWORD:
|
|
334
|
+
component = b_readonly || _this2.disabledExpression(dataItem, data) ? /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_InputPassword["default"], {
|
|
335
|
+
ui_render_type: 'browse',
|
|
336
|
+
initValue: displayValue
|
|
337
|
+
})) : /*#__PURE__*/_react["default"].createElement(_antd.Input, _extends({
|
|
338
|
+
key: form_id + "_" + code,
|
|
339
|
+
placeholder: "请填写" + name,
|
|
340
|
+
allowClear: true,
|
|
341
|
+
maxLength: field_length && field_length > 0 ? field_length : null,
|
|
342
|
+
onChange: _this2.inputOnChange.bind(_this2, dataItem, onChange)
|
|
343
|
+
}, ext_props));
|
|
344
|
+
break;
|
|
345
|
+
case _consts.UI_RENDER_TYPE.INPUT_PASSWORD_DECRYPT:
|
|
333
346
|
component = b_readonly || _this2.disabledExpression(dataItem, data) ? /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_InputPasswordDecrypt["default"], {
|
|
334
347
|
ui_render_type: 'browse',
|
|
335
348
|
initValue: displayValue,
|
|
336
349
|
maskLength: _this2.props.maskLength,
|
|
337
350
|
requestUrl: _this2.props.file_service_path,
|
|
338
351
|
appconfig: _this2.props.appconfig || _this2.props.appConfig
|
|
339
|
-
})) : /*#__PURE__*/_react["default"].createElement(
|
|
352
|
+
})) : /*#__PURE__*/_react["default"].createElement(_InputPasswordDecrypt["default"], _extends({
|
|
340
353
|
key: form_id + "_" + code,
|
|
354
|
+
ui_render_type: 'modify',
|
|
355
|
+
initValue: initialValue,
|
|
356
|
+
maskLength: _this2.props.maskLength,
|
|
357
|
+
requestUrl: _this2.props.file_service_path,
|
|
358
|
+
appconfig: _this2.props.appconfig || _this2.props.appConfig,
|
|
341
359
|
placeholder: "请填写" + name,
|
|
342
360
|
allowClear: true,
|
|
343
361
|
maxLength: field_length && field_length > 0 ? field_length : null,
|
|
@@ -843,7 +861,7 @@ var FormForModify = /*#__PURE__*/function (_React$Component) {
|
|
|
843
861
|
return Promise.resolve();
|
|
844
862
|
} else if (ui_render_type === _consts.UI_RENDER_TYPE.INPUT_NUMBER) {
|
|
845
863
|
return value != null ? Promise.resolve() : Promise.reject("validate fail");
|
|
846
|
-
} else if (ui_render_type === _consts.UI_RENDER_TYPE.INPUT || ui_render_type === _consts.UI_RENDER_TYPE.TEXT_AREA || ui_render_type === _consts.UI_RENDER_TYPE.INPUT_PASSWORD) {
|
|
864
|
+
} else if (ui_render_type === _consts.UI_RENDER_TYPE.INPUT || ui_render_type === _consts.UI_RENDER_TYPE.TEXT_AREA || ui_render_type === _consts.UI_RENDER_TYPE.INPUT_PASSWORD || ui_render_type === _consts.UI_RENDER_TYPE.INPUT_PASSWORD_DECRYPT) {
|
|
847
865
|
if (!value) {
|
|
848
866
|
return Promise.reject("validate fail");
|
|
849
867
|
} else {
|
|
@@ -1217,6 +1235,7 @@ var FormForModify = /*#__PURE__*/function (_React$Component) {
|
|
|
1217
1235
|
case _consts.UI_RENDER_TYPE.INPUT:
|
|
1218
1236
|
case _consts.UI_RENDER_TYPE.INPUT_NUMBER:
|
|
1219
1237
|
case _consts.UI_RENDER_TYPE.INPUT_PASSWORD:
|
|
1238
|
+
case _consts.UI_RENDER_TYPE.INPUT_PASSWORD_DECRYPT:
|
|
1220
1239
|
case _consts.UI_RENDER_TYPE.TEXT_AREA:
|
|
1221
1240
|
case _consts.UI_RENDER_TYPE.TREE_SELECT:
|
|
1222
1241
|
value = formItemValue;
|
|
@@ -14,6 +14,7 @@ var _consts = require("../consts");
|
|
|
14
14
|
var _GridFilterRowIndicator = _interopRequireDefault(require("./GridFilterRowIndicator"));
|
|
15
15
|
var _zh_CN = _interopRequireDefault(require("antd/es/locale/zh_CN"));
|
|
16
16
|
var _GridColumnCustomToolBar = _interopRequireDefault(require("./GridColumnCustomToolBar"));
|
|
17
|
+
var _InputPassword = _interopRequireDefault(require("../InputPassword"));
|
|
17
18
|
var _InputPasswordDecrypt = _interopRequireDefault(require("../InputPasswordDecrypt"));
|
|
18
19
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
|
|
19
20
|
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
|
|
@@ -202,6 +203,7 @@ var GridForBrowse = /*#__PURE__*/function (_React$Component) {
|
|
|
202
203
|
switch (ui_render_type) {
|
|
203
204
|
case _consts.UI_RENDER_TYPE.INPUT:
|
|
204
205
|
case _consts.UI_RENDER_TYPE.INPUT_PASSWORD:
|
|
206
|
+
case _consts.UI_RENDER_TYPE.INPUT_PASSWORD_DECRYPT:
|
|
205
207
|
case _consts.UI_RENDER_TYPE.SELECT:
|
|
206
208
|
case _consts.UI_RENDER_TYPE.TREE_SELECT:
|
|
207
209
|
case _consts.UI_RENDER_TYPE.UPLOAD:
|
|
@@ -527,6 +529,7 @@ var GridForBrowse = /*#__PURE__*/function (_React$Component) {
|
|
|
527
529
|
switch (ui_render_type) {
|
|
528
530
|
case _consts.UI_RENDER_TYPE.INPUT:
|
|
529
531
|
case _consts.UI_RENDER_TYPE.INPUT_PASSWORD:
|
|
532
|
+
case _consts.UI_RENDER_TYPE.INPUT_PASSWORD_DECRYPT:
|
|
530
533
|
case _consts.UI_RENDER_TYPE.INPUT_NUMBER:
|
|
531
534
|
case _consts.UI_RENDER_TYPE.SELECT:
|
|
532
535
|
case _consts.UI_RENDER_TYPE.TREE_SELECT:
|
|
@@ -567,7 +570,7 @@ var GridForBrowse = /*#__PURE__*/function (_React$Component) {
|
|
|
567
570
|
className: "form-item-control-input-ext-icon",
|
|
568
571
|
onClick: this.downloadOnClick.bind(this, dataItem[code])
|
|
569
572
|
}) : null, value);
|
|
570
|
-
} else if (ui_render_type === _consts.UI_RENDER_TYPE.INPUT_PASSWORD) {
|
|
573
|
+
} else if (ui_render_type === _consts.UI_RENDER_TYPE.INPUT_PASSWORD || ui_render_type === _consts.UI_RENDER_TYPE.INPUT_PASSWORD_DECRYPT) {
|
|
571
574
|
return /*#__PURE__*/_react["default"].createElement("td", {
|
|
572
575
|
className: props.className,
|
|
573
576
|
style: grid_default_locked ? {
|
|
@@ -584,7 +587,10 @@ var GridForBrowse = /*#__PURE__*/function (_React$Component) {
|
|
|
584
587
|
dangerouslySetInnerHTML: {
|
|
585
588
|
__html: column_value_prefix
|
|
586
589
|
}
|
|
587
|
-
}), dataItem[code] ? /*#__PURE__*/_react["default"].createElement(
|
|
590
|
+
}), dataItem[code] ? ui_render_type === _consts.UI_RENDER_TYPE.INPUT_PASSWORD ? /*#__PURE__*/_react["default"].createElement(_InputPassword["default"], {
|
|
591
|
+
ui_render_type: 'browse',
|
|
592
|
+
initValue: dataItem[code]
|
|
593
|
+
}) : /*#__PURE__*/_react["default"].createElement(_InputPasswordDecrypt["default"], {
|
|
588
594
|
ui_render_type: 'browse',
|
|
589
595
|
initValue: dataItem[code],
|
|
590
596
|
maskLength: this.props.maskLength,
|
|
@@ -11,6 +11,7 @@ var _antd = require("antd");
|
|
|
11
11
|
var _moment = _interopRequireDefault(require("moment"));
|
|
12
12
|
var _icons = require("@ant-design/icons");
|
|
13
13
|
var _consts = require("../consts");
|
|
14
|
+
var _InputPasswordDecrypt = _interopRequireDefault(require("../InputPasswordDecrypt"));
|
|
14
15
|
var _zh_CN = _interopRequireDefault(require("antd/es/locale/zh_CN"));
|
|
15
16
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
|
|
16
17
|
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
|
|
@@ -284,6 +285,27 @@ var GridForModify = /*#__PURE__*/function (_React$Component) {
|
|
|
284
285
|
onChange: this.inputOnChange.bind(this, dataItem, fieldConfig)
|
|
285
286
|
}));
|
|
286
287
|
break;
|
|
288
|
+
case _consts.UI_RENDER_TYPE.INPUT_PASSWORD:
|
|
289
|
+
component = /*#__PURE__*/_react["default"].createElement(_antd.Input, {
|
|
290
|
+
title: dataItem[code],
|
|
291
|
+
placeholder: "请填写" + name,
|
|
292
|
+
defaultValue: dataItem[code],
|
|
293
|
+
allowClear: true,
|
|
294
|
+
onChange: this.inputOnChange.bind(this, dataItem, fieldConfig, onChange)
|
|
295
|
+
});
|
|
296
|
+
break;
|
|
297
|
+
case _consts.UI_RENDER_TYPE.INPUT_PASSWORD_DECRYPT:
|
|
298
|
+
component = /*#__PURE__*/_react["default"].createElement(_InputPasswordDecrypt["default"], {
|
|
299
|
+
ui_render_type: 'modify',
|
|
300
|
+
initValue: dataItem[code],
|
|
301
|
+
maskLength: this.props.maskLength,
|
|
302
|
+
requestUrl: this.props.requestUrl || file_service_path,
|
|
303
|
+
appconfig: this.props.appconfig || this.props.appConfig,
|
|
304
|
+
placeholder: "请填写" + name,
|
|
305
|
+
allowClear: true,
|
|
306
|
+
onChange: this.inputOnChange.bind(this, dataItem, fieldConfig, onChange)
|
|
307
|
+
});
|
|
308
|
+
break;
|
|
287
309
|
default:
|
|
288
310
|
component = /*#__PURE__*/_react["default"].createElement(_antd.Input, {
|
|
289
311
|
title: dataItem[code],
|
package/package.json
CHANGED
|
@@ -4,6 +4,13 @@ import HttpService from "../../../services/HttpService";
|
|
|
4
4
|
|
|
5
5
|
const MASK_LENGTH = 8;
|
|
6
6
|
|
|
7
|
+
const normalizeValue = (value) => {
|
|
8
|
+
if (value === null || value === undefined) {
|
|
9
|
+
return "";
|
|
10
|
+
}
|
|
11
|
+
return String(value);
|
|
12
|
+
};
|
|
13
|
+
|
|
7
14
|
const maskValue = (value, maskLength) => {
|
|
8
15
|
if (value === null || value === undefined || value === "") {
|
|
9
16
|
return "";
|
|
@@ -11,15 +18,47 @@ const maskValue = (value, maskLength) => {
|
|
|
11
18
|
return "*".repeat(maskLength);
|
|
12
19
|
};
|
|
13
20
|
|
|
21
|
+
const limitText = (text, maxLength) => {
|
|
22
|
+
if (typeof maxLength === "number" && maxLength > 0 && text.length > maxLength) {
|
|
23
|
+
return text.slice(0, maxLength);
|
|
24
|
+
}
|
|
25
|
+
return text;
|
|
26
|
+
};
|
|
27
|
+
|
|
14
28
|
const InputPasswordDecrypt = (props) => {
|
|
15
|
-
let {
|
|
29
|
+
let {
|
|
30
|
+
ui_render_type,
|
|
31
|
+
initValue,
|
|
32
|
+
value,
|
|
33
|
+
onChange,
|
|
34
|
+
requestUrl,
|
|
35
|
+
appconfig,
|
|
36
|
+
appConfig,
|
|
37
|
+
maskLength,
|
|
38
|
+
placeholder,
|
|
39
|
+
maxLength,
|
|
40
|
+
allowClear = true,
|
|
41
|
+
onKeyDown,
|
|
42
|
+
onPaste,
|
|
43
|
+
...restInputProps
|
|
44
|
+
} = props;
|
|
16
45
|
const resolvedMaskLength = Number.isInteger(maskLength) && maskLength > 0 ? maskLength : MASK_LENGTH;
|
|
17
46
|
const serviceConfig = appconfig || appConfig;
|
|
47
|
+
const incomingValue = normalizeValue(value !== undefined ? value : initValue);
|
|
48
|
+
const [realValue, setRealValue] = useState(incomingValue);
|
|
18
49
|
const [toggle, setToggle] = useState(false);
|
|
19
50
|
const [toggleVal, setToggleVal] = useState(maskValue(initValue, resolvedMaskLength));
|
|
20
51
|
const [loading, setLoading] = useState(false);
|
|
21
52
|
const timerRef = useRef(null);
|
|
22
53
|
const requestSeqRef = useRef(0);
|
|
54
|
+
const realValueRef = useRef(incomingValue);
|
|
55
|
+
const originalRef = useRef(incomingValue);
|
|
56
|
+
const emittedRef = useRef(incomingValue);
|
|
57
|
+
const editingRef = useRef(false);
|
|
58
|
+
const maskLengthRef = useRef(resolvedMaskLength);
|
|
59
|
+
|
|
60
|
+
realValueRef.current = ui_render_type === "modify" ? realValue : normalizeValue(initValue);
|
|
61
|
+
maskLengthRef.current = resolvedMaskLength;
|
|
23
62
|
|
|
24
63
|
const clearHideTimer = () => {
|
|
25
64
|
if (timerRef.current) {
|
|
@@ -28,19 +67,9 @@ const InputPasswordDecrypt = (props) => {
|
|
|
28
67
|
}
|
|
29
68
|
};
|
|
30
69
|
|
|
31
|
-
useEffect(() => {
|
|
32
|
-
setToggle(false);
|
|
33
|
-
setToggleVal(maskValue(initValue, resolvedMaskLength));
|
|
34
|
-
setLoading(false);
|
|
35
|
-
return () => {
|
|
36
|
-
requestSeqRef.current += 1;
|
|
37
|
-
clearHideTimer();
|
|
38
|
-
};
|
|
39
|
-
}, [initValue, resolvedMaskLength]);
|
|
40
|
-
|
|
41
70
|
const hidePlainText = () => {
|
|
42
71
|
clearHideTimer();
|
|
43
|
-
setToggleVal(maskValue(
|
|
72
|
+
setToggleVal(maskValue(realValueRef.current, maskLengthRef.current));
|
|
44
73
|
setToggle(false);
|
|
45
74
|
};
|
|
46
75
|
|
|
@@ -50,11 +79,61 @@ const InputPasswordDecrypt = (props) => {
|
|
|
50
79
|
setToggle(true);
|
|
51
80
|
timerRef.current = setTimeout(() => {
|
|
52
81
|
timerRef.current = null;
|
|
53
|
-
setToggleVal(maskValue(
|
|
82
|
+
setToggleVal(maskValue(realValueRef.current, maskLengthRef.current));
|
|
54
83
|
setToggle(false);
|
|
55
84
|
}, 5000);
|
|
56
85
|
};
|
|
57
86
|
|
|
87
|
+
useEffect(() => {
|
|
88
|
+
return () => {
|
|
89
|
+
requestSeqRef.current += 1;
|
|
90
|
+
clearHideTimer();
|
|
91
|
+
};
|
|
92
|
+
}, []);
|
|
93
|
+
|
|
94
|
+
useEffect(() => {
|
|
95
|
+
if (ui_render_type === "modify") {
|
|
96
|
+
return undefined;
|
|
97
|
+
}
|
|
98
|
+
setToggle(false);
|
|
99
|
+
setToggleVal(maskValue(initValue, resolvedMaskLength));
|
|
100
|
+
setLoading(false);
|
|
101
|
+
return () => {
|
|
102
|
+
requestSeqRef.current += 1;
|
|
103
|
+
clearHideTimer();
|
|
104
|
+
};
|
|
105
|
+
}, [ui_render_type, initValue, resolvedMaskLength]);
|
|
106
|
+
|
|
107
|
+
useEffect(() => {
|
|
108
|
+
if (ui_render_type !== "modify" || incomingValue === emittedRef.current) {
|
|
109
|
+
return undefined;
|
|
110
|
+
}
|
|
111
|
+
emittedRef.current = incomingValue;
|
|
112
|
+
originalRef.current = incomingValue;
|
|
113
|
+
editingRef.current = false;
|
|
114
|
+
realValueRef.current = incomingValue;
|
|
115
|
+
setRealValue(incomingValue);
|
|
116
|
+
requestSeqRef.current += 1;
|
|
117
|
+
clearHideTimer();
|
|
118
|
+
setToggle(false);
|
|
119
|
+
setToggleVal(maskValue(incomingValue, resolvedMaskLength));
|
|
120
|
+
setLoading(false);
|
|
121
|
+
}, [ui_render_type, incomingValue, resolvedMaskLength]);
|
|
122
|
+
|
|
123
|
+
const commitValue = (nextValue, reveal) => {
|
|
124
|
+
const normalized = limitText(normalizeValue(nextValue), maxLength);
|
|
125
|
+
emittedRef.current = normalized;
|
|
126
|
+
editingRef.current = true;
|
|
127
|
+
realValueRef.current = normalized;
|
|
128
|
+
setRealValue(normalized);
|
|
129
|
+
if (reveal) {
|
|
130
|
+
showPlainText(normalized);
|
|
131
|
+
}
|
|
132
|
+
if (onChange) {
|
|
133
|
+
onChange({target: {value: normalized}});
|
|
134
|
+
}
|
|
135
|
+
};
|
|
136
|
+
|
|
58
137
|
const onToggleFull = async () => {
|
|
59
138
|
if (toggle) {
|
|
60
139
|
hidePlainText();
|
|
@@ -63,6 +142,18 @@ const InputPasswordDecrypt = (props) => {
|
|
|
63
142
|
if (loading) {
|
|
64
143
|
return;
|
|
65
144
|
}
|
|
145
|
+
|
|
146
|
+
const secret = realValueRef.current;
|
|
147
|
+
if (ui_render_type === "modify" && (secret === "" || editingRef.current || secret !== originalRef.current)) {
|
|
148
|
+
if (secret === "") {
|
|
149
|
+
return;
|
|
150
|
+
}
|
|
151
|
+
showPlainText(secret);
|
|
152
|
+
return;
|
|
153
|
+
}
|
|
154
|
+
if (!secret) {
|
|
155
|
+
return;
|
|
156
|
+
}
|
|
66
157
|
if (!requestUrl) {
|
|
67
158
|
message.error("请为组件注入属性【requestUrl】");
|
|
68
159
|
return;
|
|
@@ -76,7 +167,7 @@ const InputPasswordDecrypt = (props) => {
|
|
|
76
167
|
requestSeqRef.current = requestSeq;
|
|
77
168
|
setLoading(true);
|
|
78
169
|
try {
|
|
79
|
-
const result = await new HttpService(requestUrl, serviceConfig).post("decrypt", {data:
|
|
170
|
+
const result = await new HttpService(requestUrl, serviceConfig).post("decrypt", {data: secret});
|
|
80
171
|
if (requestSeq !== requestSeqRef.current) {
|
|
81
172
|
return;
|
|
82
173
|
}
|
|
@@ -101,8 +192,66 @@ const InputPasswordDecrypt = (props) => {
|
|
|
101
192
|
}
|
|
102
193
|
};
|
|
103
194
|
|
|
195
|
+
const onModifyKeyDown = (event) => {
|
|
196
|
+
if (onKeyDown) {
|
|
197
|
+
onKeyDown(event);
|
|
198
|
+
}
|
|
199
|
+
if (toggle || event.defaultPrevented || event.ctrlKey || event.metaKey || event.altKey || event.isComposing) {
|
|
200
|
+
return;
|
|
201
|
+
}
|
|
202
|
+
if (event.key === "Backspace" || event.key === "Delete") {
|
|
203
|
+
event.preventDefault();
|
|
204
|
+
commitValue("", false);
|
|
205
|
+
return;
|
|
206
|
+
}
|
|
207
|
+
if (event.key.length !== 1) {
|
|
208
|
+
return;
|
|
209
|
+
}
|
|
210
|
+
event.preventDefault();
|
|
211
|
+
const nextValue = editingRef.current ? realValueRef.current + event.key : event.key;
|
|
212
|
+
commitValue(nextValue, false);
|
|
213
|
+
};
|
|
214
|
+
|
|
215
|
+
const onModifyPaste = (event) => {
|
|
216
|
+
if (onPaste) {
|
|
217
|
+
onPaste(event);
|
|
218
|
+
}
|
|
219
|
+
if (toggle || event.defaultPrevented) {
|
|
220
|
+
return;
|
|
221
|
+
}
|
|
222
|
+
const text = event.clipboardData ? event.clipboardData.getData("text") : "";
|
|
223
|
+
event.preventDefault();
|
|
224
|
+
if (!text) {
|
|
225
|
+
return;
|
|
226
|
+
}
|
|
227
|
+
const nextValue = editingRef.current ? realValueRef.current + text : text;
|
|
228
|
+
commitValue(nextValue, false);
|
|
229
|
+
};
|
|
230
|
+
|
|
231
|
+
const onModifyChange = (event) => {
|
|
232
|
+
const nextValue = event.target.value;
|
|
233
|
+
if (!toggle) {
|
|
234
|
+
if (nextValue === "") {
|
|
235
|
+
commitValue("", false);
|
|
236
|
+
}
|
|
237
|
+
return;
|
|
238
|
+
}
|
|
239
|
+
commitValue(nextValue, true);
|
|
240
|
+
};
|
|
241
|
+
|
|
104
242
|
if (ui_render_type === "modify") {
|
|
105
|
-
|
|
243
|
+
const modifyDisplay = toggle ? toggleVal : maskValue(realValue, resolvedMaskLength);
|
|
244
|
+
return <Input
|
|
245
|
+
{...restInputProps}
|
|
246
|
+
value={modifyDisplay}
|
|
247
|
+
placeholder={placeholder}
|
|
248
|
+
allowClear={allowClear}
|
|
249
|
+
maxLength={toggle && typeof maxLength === "number" ? maxLength : undefined}
|
|
250
|
+
onChange={onModifyChange}
|
|
251
|
+
onKeyDown={onModifyKeyDown}
|
|
252
|
+
onPaste={onModifyPaste}
|
|
253
|
+
addonAfter={<span className={`iconfont ${toggle ? "icon-bchr-show" : "icon-bchr-hide"}`} style={{cursor: "pointer"}} onClick={onToggleFull}/>}
|
|
254
|
+
/>;
|
|
106
255
|
} else if (ui_render_type === "browse") {
|
|
107
256
|
return <Fragment>
|
|
108
257
|
<span>{toggleVal}<span className={`iconfont ${toggle ? "icon-bchr-show" : "icon-bchr-hide"}`} style={{cursor: "pointer", margin: "0 5px", color: "#337DB7", fontWeight: "bolder"}} onClick={onToggleFull}/></span>
|
|
@@ -4,6 +4,7 @@ import {Badge, Col, ConfigProvider, Form, Row, Tooltip} from "antd";
|
|
|
4
4
|
import {DownloadOutlined, QuestionCircleOutlined} from '@ant-design/icons';
|
|
5
5
|
import moment from "moment";
|
|
6
6
|
import {UI_RENDER_TYPE} from "../consts";
|
|
7
|
+
import InputPassword from "../InputPassword";
|
|
7
8
|
import InputPasswordDecrypt from "../InputPasswordDecrypt";
|
|
8
9
|
|
|
9
10
|
class FormForBrowse extends React.Component{
|
|
@@ -318,6 +319,7 @@ class FormForBrowse extends React.Component{
|
|
|
318
319
|
case UI_RENDER_TYPE.INPUT:
|
|
319
320
|
case UI_RENDER_TYPE.INPUT_NUMBER:
|
|
320
321
|
case UI_RENDER_TYPE.INPUT_PASSWORD:
|
|
322
|
+
case UI_RENDER_TYPE.INPUT_PASSWORD_DECRYPT:
|
|
321
323
|
case UI_RENDER_TYPE.TEXT_AREA:
|
|
322
324
|
case UI_RENDER_TYPE.SELECT:
|
|
323
325
|
case UI_RENDER_TYPE.TREE_SELECT:
|
|
@@ -355,6 +357,16 @@ class FormForBrowse extends React.Component{
|
|
|
355
357
|
);
|
|
356
358
|
|
|
357
359
|
if (ui_render_type === UI_RENDER_TYPE.INPUT_PASSWORD) {
|
|
360
|
+
components = (
|
|
361
|
+
<div>
|
|
362
|
+
{
|
|
363
|
+
initialValues[code] && <InputPassword ui_render_type={'browse'} initValue={initialValues[code]}/>
|
|
364
|
+
}
|
|
365
|
+
</div>
|
|
366
|
+
)
|
|
367
|
+
}
|
|
368
|
+
|
|
369
|
+
if (ui_render_type === UI_RENDER_TYPE.INPUT_PASSWORD_DECRYPT) {
|
|
358
370
|
components = (
|
|
359
371
|
<div>
|
|
360
372
|
{
|
|
@@ -21,6 +21,7 @@ import moment from "moment";
|
|
|
21
21
|
import {UI_RENDER_TYPE} from "../consts";
|
|
22
22
|
import zhCN from "antd/es/locale/zh_CN";
|
|
23
23
|
import HttpService from "../../../../services/HttpService";
|
|
24
|
+
import InputPassword from "../InputPassword";
|
|
24
25
|
import InputPasswordDecrypt from "../InputPasswordDecrypt";
|
|
25
26
|
import '../../../AppFormulaFunctions'
|
|
26
27
|
import {treeDataToListByChildFieldName} from "../../../BaseAppUtils";
|
|
@@ -405,7 +406,7 @@ class FormForModify extends React.Component{
|
|
|
405
406
|
case UI_RENDER_TYPE.INPUT_PASSWORD:
|
|
406
407
|
component = b_readonly || this.disabledExpression(dataItem, data) ? (
|
|
407
408
|
<div>
|
|
408
|
-
<
|
|
409
|
+
<InputPassword ui_render_type={'browse'} initValue={displayValue}/>
|
|
409
410
|
</div>
|
|
410
411
|
)
|
|
411
412
|
:
|
|
@@ -420,6 +421,29 @@ class FormForModify extends React.Component{
|
|
|
420
421
|
/>
|
|
421
422
|
);
|
|
422
423
|
break;
|
|
424
|
+
case UI_RENDER_TYPE.INPUT_PASSWORD_DECRYPT:
|
|
425
|
+
component = b_readonly || this.disabledExpression(dataItem, data) ? (
|
|
426
|
+
<div>
|
|
427
|
+
<InputPasswordDecrypt ui_render_type={'browse'} initValue={displayValue} maskLength={this.props.maskLength} requestUrl={this.props.file_service_path} appconfig={this.props.appconfig || this.props.appConfig}/>
|
|
428
|
+
</div>
|
|
429
|
+
)
|
|
430
|
+
:
|
|
431
|
+
(
|
|
432
|
+
<InputPasswordDecrypt
|
|
433
|
+
key={form_id + "_" + code}
|
|
434
|
+
ui_render_type={'modify'}
|
|
435
|
+
initValue={initialValue}
|
|
436
|
+
maskLength={this.props.maskLength}
|
|
437
|
+
requestUrl={this.props.file_service_path}
|
|
438
|
+
appconfig={this.props.appconfig || this.props.appConfig}
|
|
439
|
+
placeholder={"请填写" + name}
|
|
440
|
+
allowClear
|
|
441
|
+
maxLength={field_length && field_length > 0 ? field_length : null}
|
|
442
|
+
onChange={this.inputOnChange.bind(this, dataItem, onChange)}
|
|
443
|
+
{...ext_props}
|
|
444
|
+
/>
|
|
445
|
+
);
|
|
446
|
+
break;
|
|
423
447
|
case UI_RENDER_TYPE.TEXT_AREA:
|
|
424
448
|
component = b_readonly || this.disabledExpression(dataItem, data) ? (
|
|
425
449
|
<div>
|
|
@@ -781,7 +805,8 @@ class FormForModify extends React.Component{
|
|
|
781
805
|
}
|
|
782
806
|
else if (ui_render_type === UI_RENDER_TYPE.INPUT
|
|
783
807
|
|| ui_render_type === UI_RENDER_TYPE.TEXT_AREA
|
|
784
|
-
|| ui_render_type ===
|
|
808
|
+
|| ui_render_type === UI_RENDER_TYPE.INPUT_PASSWORD
|
|
809
|
+
|| ui_render_type === UI_RENDER_TYPE.INPUT_PASSWORD_DECRYPT) {
|
|
785
810
|
|
|
786
811
|
if (!value) {
|
|
787
812
|
return Promise.reject("validate fail");
|
|
@@ -1358,6 +1383,7 @@ class FormForModify extends React.Component{
|
|
|
1358
1383
|
case UI_RENDER_TYPE.INPUT:
|
|
1359
1384
|
case UI_RENDER_TYPE.INPUT_NUMBER:
|
|
1360
1385
|
case UI_RENDER_TYPE.INPUT_PASSWORD:
|
|
1386
|
+
case UI_RENDER_TYPE.INPUT_PASSWORD_DECRYPT:
|
|
1361
1387
|
case UI_RENDER_TYPE.TEXT_AREA:
|
|
1362
1388
|
case UI_RENDER_TYPE.TREE_SELECT:
|
|
1363
1389
|
value = formItemValue;
|
|
@@ -8,6 +8,7 @@ import {EXPORT_GRID_CELL_OPTIONS, EXPORT_GRID_HEADER_CELL_OPTIONS, UI_RENDER_TYP
|
|
|
8
8
|
import GridFilterRowIndicator from "./GridFilterRowIndicator";
|
|
9
9
|
import zhCN from "antd/es/locale/zh_CN";
|
|
10
10
|
import GridColumnCustomToolBar from "./GridColumnCustomToolBar";
|
|
11
|
+
import InputPassword from "../InputPassword";
|
|
11
12
|
import InputPasswordDecrypt from "../InputPasswordDecrypt";
|
|
12
13
|
|
|
13
14
|
class GridForBrowse extends React.Component{
|
|
@@ -384,6 +385,7 @@ class GridForBrowse extends React.Component{
|
|
|
384
385
|
switch (ui_render_type) {
|
|
385
386
|
case UI_RENDER_TYPE.INPUT:
|
|
386
387
|
case UI_RENDER_TYPE.INPUT_PASSWORD:
|
|
388
|
+
case UI_RENDER_TYPE.INPUT_PASSWORD_DECRYPT:
|
|
387
389
|
case UI_RENDER_TYPE.INPUT_NUMBER:
|
|
388
390
|
case UI_RENDER_TYPE.SELECT:
|
|
389
391
|
case UI_RENDER_TYPE.TREE_SELECT:
|
|
@@ -426,7 +428,8 @@ class GridForBrowse extends React.Component{
|
|
|
426
428
|
{value}
|
|
427
429
|
</td>
|
|
428
430
|
);
|
|
429
|
-
} else if (ui_render_type === UI_RENDER_TYPE.INPUT_PASSWORD
|
|
431
|
+
} else if (ui_render_type === UI_RENDER_TYPE.INPUT_PASSWORD
|
|
432
|
+
|| ui_render_type === UI_RENDER_TYPE.INPUT_PASSWORD_DECRYPT) {
|
|
430
433
|
return (
|
|
431
434
|
<td className={props.className}
|
|
432
435
|
style={grid_default_locked ? {left: column_locked_left + 'px', right: "0px"} : {}}>
|
|
@@ -443,7 +446,10 @@ class GridForBrowse extends React.Component{
|
|
|
443
446
|
}
|
|
444
447
|
|
|
445
448
|
{
|
|
446
|
-
dataItem[code] ?
|
|
449
|
+
dataItem[code] ? (ui_render_type === UI_RENDER_TYPE.INPUT_PASSWORD
|
|
450
|
+
? <InputPassword ui_render_type={'browse'} initValue={dataItem[code]}/>
|
|
451
|
+
: <InputPasswordDecrypt ui_render_type={'browse'} initValue={dataItem[code]} maskLength={this.props.maskLength} requestUrl={this.props.requestUrl} appconfig={this.props.appconfig || this.props.appConfig}/>)
|
|
452
|
+
: null
|
|
447
453
|
}
|
|
448
454
|
</td>
|
|
449
455
|
);
|
|
@@ -507,6 +513,7 @@ class GridForBrowse extends React.Component{
|
|
|
507
513
|
switch (ui_render_type) {
|
|
508
514
|
case UI_RENDER_TYPE.INPUT:
|
|
509
515
|
case UI_RENDER_TYPE.INPUT_PASSWORD:
|
|
516
|
+
case UI_RENDER_TYPE.INPUT_PASSWORD_DECRYPT:
|
|
510
517
|
case UI_RENDER_TYPE.SELECT:
|
|
511
518
|
case UI_RENDER_TYPE.TREE_SELECT:
|
|
512
519
|
case UI_RENDER_TYPE.UPLOAD:
|
|
@@ -16,6 +16,7 @@ import {
|
|
|
16
16
|
import moment from "moment";
|
|
17
17
|
import {QuestionCircleOutlined, UploadOutlined} from '@ant-design/icons';
|
|
18
18
|
import {DateFormat, UI_RENDER_TYPE} from "../consts";
|
|
19
|
+
import InputPasswordDecrypt from "../InputPasswordDecrypt";
|
|
19
20
|
import zhCN from "antd/es/locale/zh_CN";
|
|
20
21
|
|
|
21
22
|
class GridForModify extends React.Component{
|
|
@@ -257,6 +258,29 @@ class GridForModify extends React.Component{
|
|
|
257
258
|
</Upload>
|
|
258
259
|
|
|
259
260
|
|
|
261
|
+
);
|
|
262
|
+
break;
|
|
263
|
+
case UI_RENDER_TYPE.INPUT_PASSWORD:
|
|
264
|
+
component = (
|
|
265
|
+
<Input
|
|
266
|
+
title={dataItem[code]}
|
|
267
|
+
placeholder={"请填写" + name}
|
|
268
|
+
defaultValue={dataItem[code]}
|
|
269
|
+
allowClear
|
|
270
|
+
onChange={this.inputOnChange.bind(this, dataItem, fieldConfig, onChange)}/>
|
|
271
|
+
);
|
|
272
|
+
break;
|
|
273
|
+
case UI_RENDER_TYPE.INPUT_PASSWORD_DECRYPT:
|
|
274
|
+
component = (
|
|
275
|
+
<InputPasswordDecrypt
|
|
276
|
+
ui_render_type={'modify'}
|
|
277
|
+
initValue={dataItem[code]}
|
|
278
|
+
maskLength={this.props.maskLength}
|
|
279
|
+
requestUrl={this.props.requestUrl || file_service_path}
|
|
280
|
+
appconfig={this.props.appconfig || this.props.appConfig}
|
|
281
|
+
placeholder={"请填写" + name}
|
|
282
|
+
allowClear
|
|
283
|
+
onChange={this.inputOnChange.bind(this, dataItem, fieldConfig, onChange)}/>
|
|
260
284
|
);
|
|
261
285
|
break;
|
|
262
286
|
default:
|