diff --git a/frontend/src/App.jsx b/frontend/src/App.jsx index ac2498e..2022807 100644 --- a/frontend/src/App.jsx +++ b/frontend/src/App.jsx @@ -12,6 +12,7 @@ import JsonFormat from "./Pages/JsonFormat" import RegTest from "./Pages/RegTest" import TextCodec from "./Pages/TextCodec" import MakePassword from "./Pages/MakePassword" +import Timestamp from "./Pages/Timestamp" const {Title} = Typography const {Content, Sider} = Layout @@ -59,6 +60,9 @@ export default class extends React.Component { 密码生成 + + 时间戳转换 + @@ -73,6 +77,7 @@ export default class extends React.Component { }/> }/> }/> + }/> }/> diff --git a/frontend/src/Pages/Timestamp.jsx b/frontend/src/Pages/Timestamp.jsx new file mode 100644 index 0000000..51c6488 --- /dev/null +++ b/frontend/src/Pages/Timestamp.jsx @@ -0,0 +1,110 @@ +import React from "react" +import Container from "./Container" +import {Button, Form, Input, Radio, Space} from "antd" + +export default class extends React.Component { + constructor(prop) { + super(prop) + + this.state = { + currentTimestamp: 0, + timestampIsSecond: false, + stopTimer: false, + result: "", + inputTime: "", + inputTimestamp: "", + } + } + + formatDate = date => { + if (String(date).length === 10 && this.state.timestampIsSecond) { + date = date * 1000 + } + + return new Date(date).toLocaleDateString(undefined, { + year: "numeric", + month: "numeric", + day: "2-digit", + hour: "2-digit", + minute: "2-digit", + second: "2-digit", + timeZone: "PRC", + }) + } + + + updateTS = () => { + let ts = new Date().getTime() + this.setState({ + currentTimestamp: Math.ceil(this.state.timestampIsSecond ? Math.ceil(ts / 1000) : ts), + }) + } + + componentDidMount() { + this.updateTS() + this.timer = setInterval(() => !this.state.stopTimer && this.updateTS(), 1000) + } + + componentWillUnmount() { + clearInterval(this.timer) + } + + transferTime = (t, ts) => { + if (ts === "" && t === "") { + return + } + + if (t !== null) { + ts = new Date(t).getTime() + return this.setState({ + inputTime: t, + inputTimestamp: t === "" ? "" : (this.state.timestampIsSecond ? Math.ceil(ts / 1000) : ts), + }) + } + + this.setState({ + inputTimestamp: ts, inputTime: ts === "" ? "" : this.formatDate(Number(ts)), + }) + } + + render() { + return +
+ + this.setState({ + timestampIsSecond: e.target.value, + })}> + + 毫秒 + + + + + + - + + + + + + + this.transferTime(e.target.value, null)}/> + - + this.transferTime(null, e.target.value)}/> + + + + +
+
+ } +}