feat(Timestamp): Add TZC props.

uiwjs · Nov 22, 2017 · e787e0c · e787e0c
1 parent 1319139
commit e787e0c
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 11 deletions.
diff --git a/docs/md/cn/timestamp.md b/docs/md/cn/timestamp.md
@@ -8,12 +8,6 @@ Timestamp 时间戳
 <!--DemoStart--> 
 ```js
 class Demo extends Component {
-  constructor(props) {
-    super(props);
-    this.state = {
-      value: 20
-    }
-  }
   render() {
     return (
       <Timestamp value="Wed Nov 22 2017 02:06:01 GMT+0800 (CST)"/>
@@ -44,6 +38,21 @@ class Demo extends Component {
 ```
 <!--End-->
 
+## 时区转换
+
+`TZC` 为服务器时间时区，将时间转换到东八区时间
+
+<!--DemoStart--> 
+```js
+class Demo extends Component {
+  render() {
+    return (
+      <Timestamp TZC={8} format="yyyy年MM月dd日 hh:mm:ss" value="Wed Nov 22 2017 02:06:01 GMT+0800 (CST)"/>
+    )
+  }
+}
+```
+<!--End-->
 
 ## 安装和使用
 
@@ -52,7 +61,7 @@ npm install uiw --save
 ```
 
 ```js
-import { CopyToClipboard } from 'uiw';
+import { Timestamp } from 'uiw';
 // or
 import Timestamp from 'uiw/lib/timestamp';
 ```
@@ -63,3 +72,4 @@ import Timestamp from 'uiw/lib/timestamp';
 |--------- |-------- |--------- |-------- |
 | value | 日期值作为ISO8601字符串或Date对象 | String | - |
 | format | 格式化时间 | String | - |
+| TZC | 服务器时区，解决因时区变更，导致显示服务器时间不准确 time Zone Converter | Number | - |
diff --git a/src/timestamp/Timestamp.js b/src/timestamp/Timestamp.js
@@ -2,7 +2,7 @@ import React from 'react';
 import { Component, PropTypes } from '../utils/';
 
 function formatDate(date, formatStr) {
-  date = new Date(date)
+  // date = new Date(date)
   let timeFormat = {
     "M+": date.getMonth() + 1, //month
     "d+": date.getDate(), //day
@@ -21,6 +21,12 @@ function formatDate(date, formatStr) {
   return formatStr;
 }
 
+function timeZoneConverter(date, timeZone) {
+  let old_date = new Date(date), new_date = new Date(), stamp = old_date.getTime();
+  if (!timeZone) return old_date
+  return (isNaN(timeZone) && !timeZone) ? old_date : new Date(stamp + new_date.getTimezoneOffset() * 60 * 1000 + timeZone * 60 * 60 * 1000);
+}
+
 export default class Timestamp extends Component {
   constructor(props) {
     super(props);
@@ -29,15 +35,15 @@ export default class Timestamp extends Component {
     }
   }
   componentDidMount() {
-    const { value, format } = this.props
+    const { value, format, TZC } = this.props
     this.setState({
-      date: formatDate(value, format)
+      date: formatDate(timeZoneConverter(value, TZC), format)
     })
   }
   componentWillReceiveProps(nextProps) {
     if (nextProps.value !== this.props.value || nextProps.format !== this.props.format) {
       this.setState({
-        date: formatDate(nextProps.value, nextProps.format)
+        date: formatDate(timeZoneConverter(nextProps.value, nextProps.TZC), nextProps.format)
       })
     }
   }
@@ -54,6 +60,7 @@ export default class Timestamp extends Component {
 
 Timestamp.propTypes = {
   prefixCls: PropTypes.string,
+  TZC: PropTypes.number,
   value: PropTypes.oneOfType([
     PropTypes.string, // ISO-8601 string
     PropTypes.object  // Date object