This is an automated email from the ASF dual-hosted git repository.
xiaoyu pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/shenyu-dashboard.git
The following commit(s) were added to refs/heads/master by this push:
new 2ea5204e Fixed DatePicker&TimePicker losing data when editing (#436)
2ea5204e is described below
commit 2ea5204e39ea50a55850a6120df991a96fcf1adb
Author: Kerwin Bryant <[email protected]>
AuthorDate: Tue Apr 2 22:31:11 2024 +0800
Fixed DatePicker&TimePicker losing data when editing (#436)
---
src/routes/Plugin/Common/Rule.js | 34 +++++++++++++++++++--------
src/routes/Plugin/Common/Selector.js | 36 ++++++++++++++++++++---------
src/utils/utils.js | 45 ++++++++++++++++++++++++++++++++++++
3 files changed, 94 insertions(+), 21 deletions(-)
diff --git a/src/routes/Plugin/Common/Rule.js b/src/routes/Plugin/Common/Rule.js
index 6c5d8673..f309800e 100644
--- a/src/routes/Plugin/Common/Rule.js
+++ b/src/routes/Plugin/Common/Rule.js
@@ -35,6 +35,12 @@ import { getIntlContent } from "../../../utils/IntlUtils";
import CommonRuleHandle from "./CommonRuleHandle";
import PluginRuleHandle from "../PluginRuleHandle";
import RuleCopy from "./RuleCopy";
+import {
+ formatDate,
+ formatTime,
+ formatDateString,
+ formatTimeString,
+} from "../../../utils/utils";
const FormItem = Form.Item;
const { Option } = Select;
@@ -406,39 +412,47 @@ class AddModal extends Component {
.concat(date.getMonth() + 1)
.concat("-")
.concat(date.getDate());
- let day = defaultDay;
return (
<Input.Group compact style={{ top: -2 }}>
<DatePicker
+ style={{ width: "51%" }}
onChange={(e) => {
- day = e
+ let day = e
? e
.eraYear()
.toString()
.concat("-")
.concat(e.month() + 1)
.concat("-")
- .concat(e.date() < 10 ? "0".concat(e.date()) : e.date())
+ .concat(e.date())
: defaultDay;
+ this.conditionChange(
+ index,
+ "paramValue",
+ `${formatDateString(day)}
${formatTimeString(item.paramValue)}`,
+ );
}}
- style={{ width: "51%" }}
+ value={formatDate(item.paramValue)}
/>
<TimePicker
style={{ width: "49%" }}
onChange={(e) => {
- let Time = e
- ? day
+ let time = e
+ ? ""
.concat(" ")
.concat(e.hours())
.concat(":")
.concat(e.minutes())
.concat(":")
- .concat(
- e.seconds() < 10 ? "0".concat(e.seconds()) : e.seconds(),
- )
+ .concat(e.seconds())
: "";
- this.conditionChange(index, "paramValue", Time);
+ this.conditionChange(
+ index,
+ "paramValue",
+ `${formatDateString(item.paramValue)}
${formatTimeString(time)}`,
+ );
}}
+ value={formatTime(item.paramValue)}
/>
</Input.Group>
);
diff --git a/src/routes/Plugin/Common/Selector.js
b/src/routes/Plugin/Common/Selector.js
index b9e039f2..daf76cde 100644
--- a/src/routes/Plugin/Common/Selector.js
+++ b/src/routes/Plugin/Common/Selector.js
@@ -41,7 +41,13 @@ import classnames from "classnames";
import styles from "../index.less";
import { getIntlContent } from "../../../utils/IntlUtils";
import SelectorCopy from "./SelectorCopy";
-import { findKeyByValue } from "../../../utils/utils";
+import {
+ findKeyByValue,
+ formatDate,
+ formatTime,
+ formatDateString,
+ formatTimeString,
+} from "../../../utils/utils";
import DiscoveryImportModal from "../Discovery/DiscoveryImportModal";
import EditableFormTable from "../Discovery/DiscoveryUpstreamTable.js";
@@ -1036,39 +1042,47 @@ class AddModal extends Component {
.concat(date.getMonth() + 1)
.concat("-")
.concat(date.getDate());
- let day = defaultDay;
return (
<Input.Group compact style={{ top: -2 }}>
<DatePicker
+ style={{ width: "51%" }}
onChange={(e) => {
- day = e
+ let day = e
? e
.eraYear()
.toString()
.concat("-")
.concat(e.month() + 1)
.concat("-")
- .concat(e.date() < 10 ? "0".concat(e.date()) : e.date())
+ .concat(e.date())
: defaultDay;
+ this.conditionChange(
+ index,
+ "paramValue",
+ `${formatDateString(day)}
${formatTimeString(item.paramValue)}`,
+ );
}}
- style={{ width: "51%" }}
+ value={formatDate(item.paramValue)}
/>
<TimePicker
style={{ width: "49%" }}
onChange={(e) => {
- let Time = e
- ? day
+ let time = e
+ ? ""
.concat(" ")
.concat(e.hours())
.concat(":")
.concat(e.minutes())
.concat(":")
- .concat(
- e.seconds() < 10 ? "0".concat(e.seconds()) : e.seconds(),
- )
+ .concat(e.seconds())
: "";
- this.conditionChange(index, "paramValue", Time);
+ this.conditionChange(
+ index,
+ "paramValue",
+ `${formatDateString(item.paramValue)}
${formatTimeString(time)}`,
+ );
}}
+ value={formatTime(item.paramValue)}
/>
</Input.Group>
);
diff --git a/src/utils/utils.js b/src/utils/utils.js
index 4c408f89..7efb7153 100644
--- a/src/utils/utils.js
+++ b/src/utils/utils.js
@@ -110,6 +110,19 @@ function getRenderArr(routes) {
return renderArr;
}
+function zeroPadding(number, len) {
+ const getZero = (l) => {
+ let z = "";
+ for (let i = 0, j = l; i < j; i += 1) {
+ z += "0";
+ }
+ return z;
+ };
+ return (
+ (`${number}`.length < len ? getZero(len - `${number}`.length) : "") +
number
+ );
+}
+
/**
* Get router routing configuration
* { path:{name,...param}}=>Array<{name,path ...param}>
@@ -198,3 +211,35 @@ export function formatTimestamp(timestamp) {
export function findKeyByValue(obj, value) {
return Object.keys(obj).find((key) => obj[key] === value);
}
+
+export function formatDate(str) {
+ const d = str.split(" ")[0];
+ const da = d.split("-");
+ if (da.length < 3) return null;
+ return moment(
+ `${da[0]}-${zeroPadding(da[1], 2)}-${zeroPadding(da[2], 2)}`,
+ "YYYY-MM-DD",
+ );
+}
+
+export function formatDateString(str) {
+ const f = formatDate(str);
+ return f ? f.format("YYYY-MM-DD") : "";
+}
+
+export function formatTime(str) {
+ const sa = str.split(" ");
+ if (sa.length < 2) return null;
+ const t = sa[1];
+ const ta = t.split(":");
+ if (ta.length < 3) return null;
+ return moment(
+ `${zeroPadding(ta[0], 2)}:${zeroPadding(ta[1], 2)}:${zeroPadding(ta[2],
2)}`,
+ "HH:mm:ss",
+ );
+}
+
+export function formatTimeString(str) {
+ const f = formatTime(str);
+ return f ? f.format("HH:mm:ss") : "";
+}
