From fcacef732cfc0db975351830ba6a53c077fa3d0d Mon Sep 17 00:00:00 2001 From: 7laria Date: Tue, 9 Jul 2019 16:33:32 +0200 Subject: [PATCH 1/3] from listview to flatlist --- Calendar.js | 8 +-- MonthList.js | 31 +++++------ package.json | 143 +++++++++++++++++++++++++++++++-------------------- 3 files changed, 107 insertions(+), 75 deletions(-) diff --git a/Calendar.js b/Calendar.js index ed32f6e..7515c45 100644 --- a/Calendar.js +++ b/Calendar.js @@ -18,6 +18,7 @@ import { import Moment from 'moment'; import styles from './CalendarStyle'; import MonthList from './MonthList'; + const ICON = { close: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAADGklEQVR4Xu3b3XXTMBTAcV1Leu8I3YAyAWECygSlE9BOQJmAdAK6QWGCphNQNmAE+mzZl6Mc5xzXtiLJ1r0STfLqJM3/Z9muPwTiwF9w4P3iCHAcAQ4BRDxt2/aDEOKkqqqfAPD0P2EZYy6EEJ/sbwaATVVVtwDwd9gwuQkYY+wHv9n43QcQca21vi4dARFPmqa5F0Ks+r8VEZ+UUu+HCCMAu+abpvnVj+990Z1S6rJUBBtvjHkAgLOp34iIX7XWN/1lI4Cmaa4Q0a5916tIBF+8jUHER631i5ExAqjr+gYAvnjWclEIIfHBAIh41m0CvpFeBEJofBdzqZS627sJ2IV1Xa8B4LNPQAiRFSEmfmr4b48QrkhjjJWyhxLfKwtCZPxvpdQq+DC4Ky4VIVX83hFQKkLK+CAA+6ZSRkLq+GCAEhAo4qMAciJQxUcD5ECgjJ8FwIlAHT8bgAOBI34RACUCV/xiAAoEzvgkACkRuOOTAaRAyBGfFGAJQq745ABzEHLGkwDEItgLMK5reP3zcER0ntL6ztf3LSe7MRJxAuX9/VTxZCNgxqm0E4EynhwgcnMYIVDHswDMReCIZwOIReCKZwOIOdR12wHbhVayo8Bug54Rv/soCwIpwIJ4NgQygATxLAgkAAnjyRGSA8TE27199+BFtjtQSQFi43e3qyL+bU6+Y0wGMDd+xr/NSRGSACyNz4mwGCBVfC6ERQCp43MgzAagiudGmAVAHc+JEA3AFc+FEAXAHc+BEAyQK54aIQggdzwlgheglHgqhL0ApcVTIDgBSo1PjTAJUHp8SgTXfIGH4fP2U3cuOK/euu6chJ5KI+Kt1vpq+D0jgG6yxHfnrZpuQQnxsSNBSvl2OPNl6nH5DQC82wdQUnwMAgBcSynX/bZogBLjIxA+KqV++ACcEyZKjg9AeJZSnobMGbLzbuxm8KYvZZ+3V0qdTz1y7ttfcC+fmO/wjIjnWuuNdydo39AdBu0eczu/BgDsdbgXMy24o2L/nn3wom3bFSL+kVLaFTqaMrdti/3i1/b+I8BrW6OxPQc/Av4BDSZYbnPWwJkAAAAASUVORK5CYII=' }; @@ -77,7 +78,8 @@ export default class Calendar extends Component { constructor (props) { super(props); this.state = { - isModalVisible: false + isModalVisible: false, + startDate:Moment() }; this._today = Moment(); this._year = this._today.year(); @@ -118,10 +120,10 @@ export default class Calendar extends Component { let isStartValid = start.isValid() && start >= this._minDate && start <= this._maxDate; let isEndValid = end.isValid() && end >= this._minDate && end <= this._maxDate; this.setState({ - startDate: isStartValid ? start : null, + startDate: isStartValid ? start : Moment(), startDateText: isStartValid ? this._i18n(start, 'date') : '', startWeekdayText: isStartValid ? this._i18n(start.isoWeekday(), 'weekday') : '', - endDate: isEndValid ? end: null, + endDate: isEndValid ? end: Moment(), endDateText: isEndValid ? this._i18n(end, 'date') : '', endWeekdayText: isEndValid ? this._i18n(end.isoWeekday(), 'weekday') : '' }); diff --git a/MonthList.js b/MonthList.js index 9c05255..2267d72 100644 --- a/MonthList.js +++ b/MonthList.js @@ -6,7 +6,7 @@ import React, {PropTypes, Component} from 'react'; import { View, Text, - ListView, + FlatList, Dimensions } from 'react-native'; import Moment from 'moment'; @@ -16,14 +16,14 @@ const {width} = Dimensions.get('window'); export default class MonthList extends Component { constructor (props) { super(props); - this.ds = new ListView.DataSource({ - rowHasChanged: (r1, r2) => { - return r2.shouldUpdate; - } - }); + // this.ds = new ListView.DataSource({ + // rowHasChanged: (r1, r2) => { + // return r2.shouldUpdate; + // } + // }); this.monthList = []; this.state = { - dataSource: this.ds.cloneWithRows(this._getMonthList()) + dataSource: this._getMonthList() }; this._renderMonth = this._renderMonth.bind(this); this._shouldUpdate = this._shouldUpdate.bind(this); @@ -40,15 +40,15 @@ export default class MonthList extends Component { }, false); if (isDateUpdated) { this.setState({ - dataSource: - this.state.dataSource.cloneWithRows(this._getMonthList(nextProps)) + dataSource:this._getMonthList(nextProps) }); } } - _renderMonth (month) { + _renderMonth ({item, index}) { + console.log("mese ",item) return ( ); @@ -114,7 +114,7 @@ export default class MonthList extends Component { startDate.month() - minDate.month(); let weekOffset = this._getWeekNums(minDate, startDate); setTimeout(() => { - this.list && this.list.scrollTo({ + this.list && this.list.scrollToOffset({ x: 0, y: monthOffset * (24 + 25) + (monthOffset ? weekOffset * Math.ceil(width / 7 + 10) : 0), animated: true @@ -126,14 +126,15 @@ export default class MonthList extends Component { } render () { return ( - {this.list = list;}} style={styles.scrollArea} - dataSource={this.state.dataSource} - renderRow={this._renderMonth} + data={this.state.dataSource} + renderItem={this._renderMonth} pageSize={2} initialListSize={2} showsVerticalScrollIndicator={false} + keyExtractor={(item,index)=> item.date.format('X')} /> ); } diff --git a/package.json b/package.json index 07aac9e..8f8f05a 100644 --- a/package.json +++ b/package.json @@ -1,59 +1,88 @@ { - "name": "react-native-calendar-select", - "version": "0.1.2", - "description": "Calendar select component for react-native, like Airbnb.", - "main": "./Calendar.js", - "repository": { - "type": "git", - "url": "git+https://github.com/Tinysymphony/react-native-calendar-select.git" - }, - "scripts": { - "start": "react-native start", - "ios": "react-native run-ios", - "android": "react-native run-android", - "test": "jest", - "coverage": "cat ./coverage/lcov.info | coveralls", - "changelog": "conventional-changelog -p angular -i CHANGELOG.md -s" - }, - "keywords": [ - "react-native", - "react-native-calendar-xg", - "calendar" - ], - "dependencies": { - "moment": "^2.18.1" - }, - "peerDependencies": { - "prop-types": "^15.6.0", - "react": "^15.4.2", - "react-native": "^0.41.2" - }, - "devDependencies": { - "coveralls": "^2.13.1", - "cz-conventional-changelog": "^2.0.0", - "babel-jest": "21.2.0", - "babel-preset-react-native": "4.0.0", - "enzyme": "^3.2.0", - "enzyme-adapter-react-16": "^1.1.0", - "istanbul": "^0.4.5", - "jest": "21.2.1", - "react": "^16.1.0", - "react-addons-test-utils": "^15.6.2", - "react-dom": "^16.2.0", - "react-native": "^0.50.0", - "react-test-renderer": "16.0.0" - }, - "jest": { - "preset": "react-native", - "verbose": true, - "collectCoverage": true, - "moduleFileExtensions": [ - "js" - ] - }, - "config": { - "commitizen": { - "path": "./node_modules/cz-conventional-changelog" - } - } + "_from": "react-native-calendar-select@^0.1.2", + "_id": "react-native-calendar-select@0.1.2", + "_inBundle": false, + "_integrity": "sha512-iL/nVWS/5/+UfBTUP765FAn+/NBkYfJr+ap12EpO6y9+tq9sXnXIByX61fbk2R4FSTIwspL3EXr0U+yoXabB+A==", + "_location": "/react-native-calendar-select", + "_phantomChildren": {}, + "_requested": { + "type": "range", + "registry": true, + "raw": "react-native-calendar-select@^0.1.2", + "name": "react-native-calendar-select", + "escapedName": "react-native-calendar-select", + "rawSpec": "^0.1.2", + "saveSpec": null, + "fetchSpec": "^0.1.2" + }, + "_requiredBy": [ + "/" + ], + "_resolved": "https://registry.npmjs.org/react-native-calendar-select/-/react-native-calendar-select-0.1.2.tgz", + "_shasum": "814302a2add128209e91d1485d9afdb83b726712", + "_spec": "react-native-calendar-select@^0.1.2", + "_where": "/Users/developer7/Desktop/work/HotelHugNew/hotehug", + "bugs": { + "url": "https://github.com/Tinysymphony/react-native-calendar-select/issues" + }, + "bundleDependencies": false, + "config": { + "commitizen": { + "path": "./node_modules/cz-conventional-changelog" + } + }, + "dependencies": { + "moment": "^2.18.1" + }, + "deprecated": false, + "description": "Calendar select component for react-native, like Airbnb.", + "devDependencies": { + "babel-jest": "21.2.0", + "babel-preset-react-native": "4.0.0", + "coveralls": "^2.13.1", + "cz-conventional-changelog": "^2.0.0", + "enzyme": "^3.2.0", + "enzyme-adapter-react-16": "^1.1.0", + "istanbul": "^0.4.5", + "jest": "21.2.1", + "react": "^16.1.0", + "react-addons-test-utils": "^15.6.2", + "react-dom": "^16.2.0", + "react-native": "^0.50.0", + "react-test-renderer": "16.0.0" + }, + "homepage": "https://github.com/Tinysymphony/react-native-calendar-select#readme", + "jest": { + "preset": "react-native", + "verbose": true, + "collectCoverage": true, + "moduleFileExtensions": [ + "js" + ] + }, + "keywords": [ + "react-native", + "react-native-calendar-xg", + "calendar" + ], + "main": "./Calendar.js", + "name": "react-native-calendar-select", + "peerDependencies": { + "prop-types": "^15.6.0", + "react": "^15.4.2", + "react-native": "^0.41.2" + }, + "repository": { + "type": "git", + "url": "git+https://github.com/Tinysymphony/react-native-calendar-select.git" + }, + "scripts": { + "android": "react-native run-android", + "changelog": "conventional-changelog -p angular -i CHANGELOG.md -s", + "coverage": "cat ./coverage/lcov.info | coveralls", + "ios": "react-native run-ios", + "start": "react-native start", + "test": "jest" + }, + "version": "0.1.2" } From 72442de71848c394f7d538a70ace0d35fed4c179 Mon Sep 17 00:00:00 2001 From: 7laria Date: Tue, 24 Sep 2019 12:28:48 +0200 Subject: [PATCH 2/3] RN 0.60 compatible --- Calendar.js | 8 +++----- MonthList.js | 19 ++++++------------- 2 files changed, 9 insertions(+), 18 deletions(-) diff --git a/Calendar.js b/Calendar.js index 7515c45..ed32f6e 100644 --- a/Calendar.js +++ b/Calendar.js @@ -18,7 +18,6 @@ import { import Moment from 'moment'; import styles from './CalendarStyle'; import MonthList from './MonthList'; - const ICON = { close: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAADGklEQVR4Xu3b3XXTMBTAcV1Leu8I3YAyAWECygSlE9BOQJmAdAK6QWGCphNQNmAE+mzZl6Mc5xzXtiLJ1r0STfLqJM3/Z9muPwTiwF9w4P3iCHAcAQ4BRDxt2/aDEOKkqqqfAPD0P2EZYy6EEJ/sbwaATVVVtwDwd9gwuQkYY+wHv9n43QcQca21vi4dARFPmqa5F0Ks+r8VEZ+UUu+HCCMAu+abpvnVj+990Z1S6rJUBBtvjHkAgLOp34iIX7XWN/1lI4Cmaa4Q0a5916tIBF+8jUHER631i5ExAqjr+gYAvnjWclEIIfHBAIh41m0CvpFeBEJofBdzqZS627sJ2IV1Xa8B4LNPQAiRFSEmfmr4b48QrkhjjJWyhxLfKwtCZPxvpdQq+DC4Ky4VIVX83hFQKkLK+CAA+6ZSRkLq+GCAEhAo4qMAciJQxUcD5ECgjJ8FwIlAHT8bgAOBI34RACUCV/xiAAoEzvgkACkRuOOTAaRAyBGfFGAJQq745ABzEHLGkwDEItgLMK5reP3zcER0ntL6ztf3LSe7MRJxAuX9/VTxZCNgxqm0E4EynhwgcnMYIVDHswDMReCIZwOIReCKZwOIOdR12wHbhVayo8Bug54Rv/soCwIpwIJ4NgQygATxLAgkAAnjyRGSA8TE27199+BFtjtQSQFi43e3qyL+bU6+Y0wGMDd+xr/NSRGSACyNz4mwGCBVfC6ERQCp43MgzAagiudGmAVAHc+JEA3AFc+FEAXAHc+BEAyQK54aIQggdzwlgheglHgqhL0ApcVTIDgBSo1PjTAJUHp8SgTXfIGH4fP2U3cuOK/euu6chJ5KI+Kt1vpq+D0jgG6yxHfnrZpuQQnxsSNBSvl2OPNl6nH5DQC82wdQUnwMAgBcSynX/bZogBLjIxA+KqV++ACcEyZKjg9AeJZSnobMGbLzbuxm8KYvZZ+3V0qdTz1y7ttfcC+fmO/wjIjnWuuNdydo39AdBu0eczu/BgDsdbgXMy24o2L/nn3wom3bFSL+kVLaFTqaMrdti/3i1/b+I8BrW6OxPQc/Av4BDSZYbnPWwJkAAAAASUVORK5CYII=' }; @@ -78,8 +77,7 @@ export default class Calendar extends Component { constructor (props) { super(props); this.state = { - isModalVisible: false, - startDate:Moment() + isModalVisible: false }; this._today = Moment(); this._year = this._today.year(); @@ -120,10 +118,10 @@ export default class Calendar extends Component { let isStartValid = start.isValid() && start >= this._minDate && start <= this._maxDate; let isEndValid = end.isValid() && end >= this._minDate && end <= this._maxDate; this.setState({ - startDate: isStartValid ? start : Moment(), + startDate: isStartValid ? start : null, startDateText: isStartValid ? this._i18n(start, 'date') : '', startWeekdayText: isStartValid ? this._i18n(start.isoWeekday(), 'weekday') : '', - endDate: isEndValid ? end: Moment(), + endDate: isEndValid ? end: null, endDateText: isEndValid ? this._i18n(end, 'date') : '', endWeekdayText: isEndValid ? this._i18n(end.isoWeekday(), 'weekday') : '' }); diff --git a/MonthList.js b/MonthList.js index 2267d72..e12f82d 100644 --- a/MonthList.js +++ b/MonthList.js @@ -16,11 +16,7 @@ const {width} = Dimensions.get('window'); export default class MonthList extends Component { constructor (props) { super(props); - // this.ds = new ListView.DataSource({ - // rowHasChanged: (r1, r2) => { - // return r2.shouldUpdate; - // } - // }); + this.ds = [] this.monthList = []; this.state = { dataSource: this._getMonthList() @@ -44,8 +40,7 @@ export default class MonthList extends Component { }); } } - _renderMonth ({item, index}) { - console.log("mese ",item) + _renderMonth ({item}) { return ( { this.list && this.list.scrollToOffset({ - x: 0, - y: monthOffset * (24 + 25) + (monthOffset ? weekOffset * Math.ceil(width / 7 + 10) : 0), + offset: monthOffset * (24 + 25) + (monthOffset ? weekOffset * Math.ceil(width / 7 + 10) : 0), animated: true }); }, 400); @@ -131,10 +125,9 @@ export default class MonthList extends Component { style={styles.scrollArea} data={this.state.dataSource} renderItem={this._renderMonth} - pageSize={2} - initialListSize={2} - showsVerticalScrollIndicator={false} - keyExtractor={(item,index)=> item.date.format('X')} + keyExtractor={(item,index)=>item.date.format('YYYY-MM-DD')} + initialNumToRender={2} + showsHorizontalScrollIndicator={false} /> ); } From c5c4b0966b7bd5cd5e988d8485f95ef38aee9454 Mon Sep 17 00:00:00 2001 From: 7laria Date: Thu, 2 Jan 2020 10:49:50 +0100 Subject: [PATCH 3/3] disablwd old days and upgrate to RN 0.60.5 --- Calendar.js | 3 -- Day/index.js | 27 ++++++++++++------ MonthList.js | 81 ++++++++++++++++++++-------------------------------- package.json | 14 ++++----- utils.js | 40 ++++++++++++++++++++++++++ 5 files changed, 96 insertions(+), 69 deletions(-) create mode 100644 utils.js diff --git a/Calendar.js b/Calendar.js index ed32f6e..0834f7c 100644 --- a/Calendar.js +++ b/Calendar.js @@ -10,9 +10,6 @@ import { Text, Modal, Image, - StyleSheet, - ScrollView, - Dimensions, TouchableHighlight } from 'react-native'; import Moment from 'moment'; diff --git a/Day/index.js b/Day/index.js index 57e321d..2b43ba2 100644 --- a/Day/index.js +++ b/Day/index.js @@ -13,21 +13,22 @@ import { } from 'react-native'; import Moment from 'moment'; import styles from './style'; +import moment from 'moment'; export default class Day extends Component { static propTypes = { onChoose: PropTypes.func } - constructor (props) { + constructor(props) { super(props); this._chooseDay = this._chooseDay.bind(this); this._statusCheck = this._statusCheck.bind(this); this._statusCheck(); } - _chooseDay () { + _chooseDay() { this.props.onChoose && this.props.onChoose(this.props.date); } - _statusCheck (props) { + _statusCheck(props) { const { startDate, endDate, @@ -49,22 +50,29 @@ export default class Day extends Component { this.isFocus = this.isMid || this.isStart || this.isEnd; return this.isFocus; } - shouldComponentUpdate (nextProps) { + shouldComponentUpdate(nextProps) { let prevStatus = this.isFocus; let nextStatus = this._statusCheck(nextProps); if (prevStatus || nextStatus) return true; return false; } - render () { + isDisabled = (day) => { + if (day) + return day.isBefore(Moment().subtract(2, 'day')) + else + return false + } + render() { const { date, color } = this.props; let text = date ? date.date() : ''; - let mainColor = {color: color.mainColor}; - let subColor = {color: color.subColor}; - let mainBack = {backgroundColor: color.mainColor}; - let subBack = {backgroundColor: color.subColor}; + let mainColor = { color: color.mainColor }; + let subColor = { color: color.subColor }; + let mainBack = { backgroundColor: color.mainColor }; + let subBack = { backgroundColor: color.subColor }; + return ( {text} diff --git a/MonthList.js b/MonthList.js index e12f82d..564bbd3 100644 --- a/MonthList.js +++ b/MonthList.js @@ -6,41 +6,50 @@ import React, {PropTypes, Component} from 'react'; import { View, Text, - FlatList, + ListView, Dimensions } from 'react-native'; import Moment from 'moment'; import styles from './CalendarStyle'; import Month from './Month'; +import { FlatList } from 'react-native-gesture-handler'; +import {_getMonthList,_checkRange,_getWeekNums} from './utils' const {width} = Dimensions.get('window'); + + export default class MonthList extends Component { constructor (props) { super(props); - this.ds = [] + this.monthList = []; this.state = { - dataSource: this._getMonthList() + dataSource: _getMonthList(this.props) }; - this._renderMonth = this._renderMonth.bind(this); - this._shouldUpdate = this._shouldUpdate.bind(this); - this._checkRange = this._checkRange.bind(this); - this._getWeekNums = this._getWeekNums.bind(this); + + this._shouldUpdate = this._shouldUpdate.bind(this) this._scrollToSelecetdMonth = this._scrollToSelecetdMonth.bind(this); } - componentWillReceiveProps (nextProps) { + static getDerivedStateFromProps(nextProps, prevState){ let isDateUpdated = ['startDate', 'endDate', 'minDate', 'maxDate'].reduce((prev, next) => { - if (prev || nextProps[next] !== this.props[next]) { + if (prev || nextProps[next] !== prevState[next]) { return true; } return prev; }, false); if (isDateUpdated) { - this.setState({ - dataSource:this._getMonthList(nextProps) - }); + return{ + ...prevState, + dataSource:_getMonthList(nextProps) + }; + } + return { + ...prevState } } - _renderMonth ({item}) { + + + + _renderMonth =({item,index})=> { return ( minDate || ( - maxDate.year() === minDate.year() && - maxDate.month() === minDate.month() - )) { - let month = { - date: minDate.clone() - }; - month.shouldUpdate = this._shouldUpdate(month, props); - monthList.push(month); - minDate.add(1, 'month'); - } - return monthList; - } - _getWeekNums(start, end) { - let clonedMoment = Moment(start), date, day, num, y, m, total = 0; - while (!clonedMoment.isSame(end, 'months')) { - y = clonedMoment.year(); - m = clonedMoment.month(); - date = new Date(y, m, 1); - day = date.getDay(); - num = new Date(y, m + 1, 0).getDate(); - total += Math.ceil((num + day) / 7); - clonedMoment.add(1, 'months'); - } - return total; - } + + _scrollToSelecetdMonth () { const { startDate, @@ -107,7 +87,7 @@ export default class MonthList extends Component { } = this.props; let monthOffset = 12 * (startDate.year() - minDate.year()) + startDate.month() - minDate.month(); - let weekOffset = this._getWeekNums(minDate, startDate); + let weekOffset = _getWeekNums(minDate, startDate); setTimeout(() => { this.list && this.list.scrollToOffset({ offset: monthOffset * (24 + 25) + (monthOffset ? weekOffset * Math.ceil(width / 7 + 10) : 0), @@ -125,9 +105,10 @@ export default class MonthList extends Component { style={styles.scrollArea} data={this.state.dataSource} renderItem={this._renderMonth} - keyExtractor={(item,index)=>item.date.format('YYYY-MM-DD')} - initialNumToRender={2} - showsHorizontalScrollIndicator={false} + pageSize={2} + initialListSize={2} + keyExtractor={(item,index)=> item.date.format('X')} + showsVerticalScrollIndicator={false} /> ); } diff --git a/package.json b/package.json index 8f8f05a..1d4a29a 100644 --- a/package.json +++ b/package.json @@ -1,27 +1,27 @@ { - "_from": "react-native-calendar-select@^0.1.2", + "_from": "react-native-calendar-select@0.1.2", "_id": "react-native-calendar-select@0.1.2", "_inBundle": false, "_integrity": "sha512-iL/nVWS/5/+UfBTUP765FAn+/NBkYfJr+ap12EpO6y9+tq9sXnXIByX61fbk2R4FSTIwspL3EXr0U+yoXabB+A==", "_location": "/react-native-calendar-select", "_phantomChildren": {}, "_requested": { - "type": "range", + "type": "version", "registry": true, - "raw": "react-native-calendar-select@^0.1.2", + "raw": "react-native-calendar-select@0.1.2", "name": "react-native-calendar-select", "escapedName": "react-native-calendar-select", - "rawSpec": "^0.1.2", + "rawSpec": "0.1.2", "saveSpec": null, - "fetchSpec": "^0.1.2" + "fetchSpec": "0.1.2" }, "_requiredBy": [ "/" ], "_resolved": "https://registry.npmjs.org/react-native-calendar-select/-/react-native-calendar-select-0.1.2.tgz", "_shasum": "814302a2add128209e91d1485d9afdb83b726712", - "_spec": "react-native-calendar-select@^0.1.2", - "_where": "/Users/developer7/Desktop/work/HotelHugNew/hotehug", + "_spec": "react-native-calendar-select@0.1.2", + "_where": "/Users/developer7/Desktop/repository hotelhug/master/hotelhug-app", "bugs": { "url": "https://github.com/Tinysymphony/react-native-calendar-select/issues" }, diff --git a/utils.js b/utils.js new file mode 100644 index 0000000..45014ce --- /dev/null +++ b/utils.js @@ -0,0 +1,40 @@ +import Moment from 'moment' +export const _checkRange = (date, start, end) => { + if (!date || !start) return false; + if (!end) return date.year() === start.year() && date.month() === start.month(); + if (date.year() < start.year() || (date.year() === start.year() && date.month() < start.month())) return false; + if (date.year() > end.year() || (date.year() === end.year() && date.month() > end.month())) return false; + return true; + } + + export const _getMonthList = (props) => { + let minDate =props.minDate.clone().date(1); + let maxDate = props.maxDate.clone(); + let monthList = []; + if (!maxDate || !minDate) return monthList; + while (maxDate > minDate || ( + maxDate.year() === minDate.year() && + maxDate.month() === minDate.month() + )) { + let month = { + date: minDate.clone() + }; + monthList.push(month); + minDate.add(1, 'month'); + } + return monthList; + } + +export const _getWeekNums = (start, end) =>{ + let clonedMoment = Moment(start), date, day, num, y, m, total = 0; + while (!clonedMoment.isSame(end, 'months')) { + y = clonedMoment.year(); + m = clonedMoment.month(); + date = new Date(y, m, 1); + day = date.getDay(); + num = new Date(y, m + 1, 0).getDate(); + total += Math.ceil((num + day) / 7); + clonedMoment.add(1, 'months'); + } + return total; + } \ No newline at end of file