|
|
|
@ -1,65 +1,72 @@
|
|
|
|
|
import React, {Component} from 'react';
|
|
|
|
|
import {Col, DatePicker, Row} from 'antd';
|
|
|
|
|
import {observer} from 'mobx-react';
|
|
|
|
|
import React, { Component } from "react";
|
|
|
|
|
import { Col, DatePicker, Row } from "antd";
|
|
|
|
|
import { observer } from "mobx-react";
|
|
|
|
|
import * as config from "../config";
|
|
|
|
|
import moment from "moment";
|
|
|
|
|
import 'moment/locale/zh-cn';
|
|
|
|
|
import locale from 'antd/es/date-picker/locale/zh_CN';
|
|
|
|
|
import {stores_Context} from "../config";
|
|
|
|
|
import "moment/locale/zh-cn";
|
|
|
|
|
import locale from "antd/es/date-picker/locale/zh_CN";
|
|
|
|
|
import { stores_Context } from "../config";
|
|
|
|
|
|
|
|
|
|
//用于日期选择,计算上一时间段、同比时间等
|
|
|
|
|
class DatePickerCharts extends Component {
|
|
|
|
|
static contextType = stores_Context;
|
|
|
|
|
static contextType = stores_Context;
|
|
|
|
|
|
|
|
|
|
constructor(props) {
|
|
|
|
|
super(props);
|
|
|
|
|
}
|
|
|
|
|
constructor(props) {
|
|
|
|
|
super(props);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
render() {
|
|
|
|
|
const {date_picker_store} = this.context;
|
|
|
|
|
return (
|
|
|
|
|
<div>
|
|
|
|
|
<Row>
|
|
|
|
|
<Col span={24}>
|
|
|
|
|
<DatePicker.RangePicker format={config.DATE_FORMAT} locale={locale}
|
|
|
|
|
allowClear={false}
|
|
|
|
|
value={[date_picker_store.start_date, date_picker_store.end_date]}
|
|
|
|
|
onChange={date_picker_store.onChange_dataPicker}
|
|
|
|
|
ranges={{
|
|
|
|
|
'本周': [moment().startOf('week'), moment().endOf('week')],
|
|
|
|
|
'上周': [moment().startOf('week').subtract(7, 'days'), moment().endOf('week').subtract(7, 'days')],
|
|
|
|
|
'本月': [moment().startOf('month'), moment().endOf('month')],
|
|
|
|
|
'上个月': [moment().subtract(1, 'months').startOf('month'), moment(new Date()).subtract(1, 'months').endOf('month')],
|
|
|
|
|
'近30天': [moment().subtract(30, 'days'), moment()],
|
|
|
|
|
'近三个月': [moment().subtract(2, 'month').startOf('month'), moment().endOf('month')],
|
|
|
|
|
'今年': [moment().startOf('year').subtract(1, 'month'), moment().endOf('year').subtract(1, 'month')],
|
|
|
|
|
'去年': [moment().subtract(1, 'year').startOf('year').subtract(1, 'month'), moment().subtract(1, 'year').endOf('year').subtract(1, 'month')],
|
|
|
|
|
}}
|
|
|
|
|
/>
|
|
|
|
|
</Col>
|
|
|
|
|
{this.props.hide_vs ? '' : <Col span={24}>
|
|
|
|
|
<DatePicker.RangePicker bordered={false} format={config.DATE_FORMAT} locale={locale}
|
|
|
|
|
value={[date_picker_store.start_date_cp, date_picker_store.end_date_cp]}
|
|
|
|
|
placeholder={['对比 Start date', 'End date']}
|
|
|
|
|
onChange={date_picker_store.onChange_dataPicker_cp}
|
|
|
|
|
ranges={{
|
|
|
|
|
'上一时间段': date_picker_store.previous_date(),
|
|
|
|
|
'去年同期': date_picker_store.previous_year(),
|
|
|
|
|
'上周': [moment().startOf('week').subtract(7, 'days'), moment().endOf('week').subtract(7, 'days')],
|
|
|
|
|
'上个月': [moment().subtract(1, 'months').startOf('month'), moment(new Date()).subtract(1, 'months').endOf('month')],
|
|
|
|
|
'前个月': [moment().subtract(2, 'month').startOf('month'), moment().subtract(2, 'month').endOf('month')],
|
|
|
|
|
'前三个月': [moment().subtract(5, 'month').startOf('month'), moment().subtract(3, 'month').endOf('month')],
|
|
|
|
|
'去年': [moment().subtract(1, 'year').startOf('year').subtract(1, 'month'), moment().subtract(1, 'year').endOf('year').subtract(1, 'month')],
|
|
|
|
|
}}
|
|
|
|
|
/>
|
|
|
|
|
</Col>}
|
|
|
|
|
</Row>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
render() {
|
|
|
|
|
const { date_picker_store } = this.context;
|
|
|
|
|
return (
|
|
|
|
|
<div>
|
|
|
|
|
<Row>
|
|
|
|
|
<Col span={24}>
|
|
|
|
|
<DatePicker.RangePicker
|
|
|
|
|
format={config.DATE_FORMAT}
|
|
|
|
|
locale={locale}
|
|
|
|
|
allowClear={false}
|
|
|
|
|
value={[date_picker_store.start_date, date_picker_store.end_date]}
|
|
|
|
|
onChange={date_picker_store.onChange_dataPicker}
|
|
|
|
|
ranges={{
|
|
|
|
|
本周: [moment().startOf("week"), moment().endOf("week")],
|
|
|
|
|
上周: [moment().startOf("week").subtract(7, "days"), moment().endOf("week").subtract(7, "days")],
|
|
|
|
|
本月: [moment().startOf("month"), moment().endOf("month")],
|
|
|
|
|
上个月: [moment().subtract(1, "months").startOf("month"), moment(new Date()).subtract(1, "months").endOf("month")],
|
|
|
|
|
近7天: [moment().subtract(7, "days"), moment()],
|
|
|
|
|
近30天: [moment().subtract(30, "days"), moment()],
|
|
|
|
|
近三个月: [moment().subtract(2, "month").startOf("month"), moment().endOf("month")],
|
|
|
|
|
今年: [moment().startOf("year"), moment().endOf("year")],
|
|
|
|
|
去年: [moment().subtract(1, "year").startOf("year"), moment().subtract(1, "year").endOf("year")],
|
|
|
|
|
}}
|
|
|
|
|
/>
|
|
|
|
|
</Col>
|
|
|
|
|
{this.props.hide_vs ? (
|
|
|
|
|
""
|
|
|
|
|
) : (
|
|
|
|
|
<Col span={24}>
|
|
|
|
|
<DatePicker.RangePicker
|
|
|
|
|
bordered={false}
|
|
|
|
|
format={config.DATE_FORMAT}
|
|
|
|
|
locale={locale}
|
|
|
|
|
value={[date_picker_store.start_date_cp, date_picker_store.end_date_cp]}
|
|
|
|
|
placeholder={["对比 Start date", "End date"]}
|
|
|
|
|
onChange={date_picker_store.onChange_dataPicker_cp}
|
|
|
|
|
ranges={{
|
|
|
|
|
上一时间段: date_picker_store.previous_date(),
|
|
|
|
|
去年同期: date_picker_store.previous_year(),
|
|
|
|
|
上周: [moment().startOf("week").subtract(7, "days"), moment().endOf("week").subtract(7, "days")],
|
|
|
|
|
上个月: [moment().subtract(1, "months").startOf("month"), moment(new Date()).subtract(1, "months").endOf("month")],
|
|
|
|
|
前个月: [moment().subtract(2, "month").startOf("month"), moment().subtract(2, "month").endOf("month")],
|
|
|
|
|
前三个月: [moment().subtract(5, "month").startOf("month"), moment().subtract(3, "month").endOf("month")],
|
|
|
|
|
去年: [moment().subtract(1, "year").startOf("year"), moment().subtract(1, "year").endOf("year")],
|
|
|
|
|
}}
|
|
|
|
|
/>
|
|
|
|
|
</Col>
|
|
|
|
|
)}
|
|
|
|
|
</Row>
|
|
|
|
|
</div>
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
export default observer(DatePickerCharts);
|
|
|
|
|
|
|
|
|
|