index.js 37 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904
  1. import Taro from '@tarojs/taro'
  2. import React, { Component } from 'react'
  3. import { View, Text,PickerView,PickerViewColumn } from '@tarojs/components'
  4. import './index.scss'
  5. import PropTypes from 'prop-types';
  6. export default class DatePicker extends Component {
  7. constructor(props) {
  8. super(props);
  9. this.state = {
  10. pickVal: [],
  11. range: {
  12. years: [],
  13. months: [],
  14. days: [],
  15. hours: [],
  16. minutes: [],
  17. seconds: []
  18. },
  19. checkObj: {},
  20. values:this.props.value,
  21. fields2:this.props.fields,
  22. }
  23. }
  24. componentWillMount() {
  25. this.initData();
  26. }
  27. componentDidMount() {
  28. }
  29. componentWillUnmount() { }
  30. componentDidShow() { }
  31. componentDidHide() { }
  32. componentDidUpdate(prevProps, prevState) {
  33. if (prevProps.value !== this.state.values) {
  34. // this.initData();
  35. this.setState({
  36. values: prevProps.value,
  37. }, () => {
  38. this.initData();
  39. })
  40. }
  41. if (prevProps.fields !== this.state.fields2) {
  42. // this.initData();
  43. this.setState({
  44. fields2: prevProps.fields,
  45. }, () => {
  46. this.initData();
  47. })
  48. }
  49. }
  50. formatNum = (n) => {
  51. return (Number(n) < 10 ? '0' + Number(n) : Number(n) + '');
  52. }
  53. checkValue = (value) => {
  54. let strReg, example
  55. switch (this.props.fields) {
  56. case "year":
  57. strReg = /^\d{4}$/;
  58. example = "2019";
  59. break;
  60. case "month":
  61. strReg = /^\d{4}-\d{2}$/;
  62. example = "2019-02";
  63. break;
  64. case "day":
  65. strReg = /^\d{4}-\d{2}-\d{2}$/;
  66. example = "2019-02-01";
  67. break;
  68. case "hour":
  69. strReg = /^\d{4}-\d{2}-\d{2} \d{2}(:\d{2}){1,2}?$/;
  70. example = "2019-02-01 18:00:00或2019-02-01 18";
  71. break;
  72. case "minute":
  73. strReg = /^\d{4}-\d{2}-\d{2} \d{2}:\d{2}(:\d{2}){0,1}?$/;
  74. example = "2019-02-01 18:06:00或2019-02-01 18:06";
  75. break;
  76. case "second":
  77. strReg = /^\d{4}-\d{2}-\d{2} \d{2}:\d{2}:\d{2}$/;
  78. example = "2019-02-01 18:06:01";
  79. break;
  80. }
  81. if (!strReg.test(value)) {
  82. console.log(new Error("请传入与mode、fields匹配的value值,例value=" + example + ""))
  83. }
  84. return strReg.test(value);
  85. }
  86. resetData = (year, month, day, hour, minute) => {
  87. let curDate = this.getCurrenDate();
  88. let curFlag = this.props.current;
  89. let curYear = curDate.curYear;
  90. let curMonth = curDate.curMonth;
  91. let curDay = curDate.curDay;
  92. let curHour = curDate.curHour;
  93. let curMinute = curDate.curMinute;
  94. let curSecond = curDate.curSecond;
  95. let months = [], days = [], hours = [], minutes = [], seconds = [];
  96. let disabledAfter = this.props.disabledAfter;
  97. let monthsLen = disabledAfter ? (year * 1 < curYear ? 12 : curMonth) : 12;
  98. let totalDays = new Date(year, month, 0).getDate();//计算当月有几天;
  99. let daysLen = disabledAfter ? ((year * 1 < curYear || month * 1 < curMonth) ? totalDays : curDay) : totalDays;
  100. let hoursLen = disabledAfter ? ((year * 1 < curYear || month * 1 < curMonth || day * 1 < curDay) ? 24 : curHour + 1) : 24;
  101. let minutesLen = disabledAfter ? ((year * 1 < curYear || month * 1 < curMonth || day * 1 < curDay || hour * 1 < curHour) ? 60 : curMinute + 1) : 60;
  102. let secondsLen = disabledAfter ? ((year * 1 < curYear || month * 1 < curMonth || day * 1 < curDay || hour * 1 < curHour || minute * 1 < curMinute) ? 60 : curSecond + 1) : 60;
  103. for (let month = 1; month <= monthsLen; month++) {
  104. months.push(this.formatNum(month));
  105. };
  106. for (let day = 1; day <= daysLen; day++) {
  107. days.push(this.formatNum(day));
  108. }
  109. for (let hour = 0; hour < hoursLen; hour++) {
  110. hours.push(this.formatNum(hour));
  111. }
  112. for (let minute = 0; minute < minutesLen; minute++) {
  113. minutes.push(this.formatNum(minute));
  114. }
  115. for (let second = 0; second < secondsLen; second++) {
  116. seconds.push(this.formatNum(second));
  117. }
  118. return {
  119. months,
  120. days,
  121. hours,
  122. minutes,
  123. seconds
  124. }
  125. }
  126. getData(dVal) {
  127. //用来处理初始化数据
  128. let curFlag = this.props.current;
  129. let disabledAfter = this.props.disabledAfter;
  130. let fields = this.props.fields;
  131. let curDate = this.getCurrenDate();
  132. let curYear = curDate.curYear;
  133. let curMonthdays = curDate.curMonthdays;
  134. let curMonth = curDate.curMonth;
  135. let curDay = curDate.curDay;
  136. let curHour = curDate.curHour;
  137. let curMinute = curDate.curMinute;
  138. let curSecond = curDate.curSecond;
  139. let defaultDate = this.getDefaultDate();
  140. let startYear = this.getStartDate().getFullYear();
  141. let endYear = this.getEndDate().getFullYear();
  142. //颗粒度,禁用当前之后日期仅对year,month,day,hour生效;分钟秒禁用没有意义,
  143. let years = [], months = [], days = [], hours = [], minutes = [], seconds = [];
  144. let year = dVal[0] * 1;
  145. let month = dVal[1] * 1;
  146. let day = dVal[2] * 1;
  147. let hour = dVal[3] * 1;
  148. let minute = dVal[4] * 1;
  149. let monthsLen = disabledAfter ? (year < curYear ? 12 : curDate.curMonth) : 12;
  150. let daysLen = disabledAfter ? ((year < curYear || month < curMonth) ? defaultDate.defaultDays : curDay) : (curFlag ? curMonthdays : defaultDate.defaultDays);
  151. let hoursLen = disabledAfter ? ((year < curYear || month < curMonth || day < curDay) ? 24 : curHour + 1) : 24;
  152. let minutesLen = disabledAfter ? ((year < curYear || month < curMonth || day < curDay || hour < curHour) ? 60 : curMinute + 1) : 60;
  153. let secondsLen = disabledAfter ? ((year < curYear || month < curMonth || day < curDay || hour < curHour || minute < curMinute) ? 60 : curSecond + 1) : 60;
  154. for (let year = startYear; year <= (disabledAfter ? curYear : endYear); year++) {
  155. years.push(year.toString())
  156. }
  157. for (let month = 1; month <= monthsLen; month++) {
  158. months.push(this.formatNum(month));
  159. }
  160. for (let day = 1; day <= daysLen; day++) {
  161. days.push(this.formatNum(day));
  162. }
  163. for (let hour = 0; hour < hoursLen; hour++) {
  164. hours.push(this.formatNum(hour));
  165. }
  166. for (let minute = 0; minute < minutesLen; minute++) {
  167. minutes.push(this.formatNum(minute));
  168. }
  169. // for(let second=0;second<(disabledAfter?curDate.curSecond+1:60);second++){
  170. // seconds.push(this.formatNum(second));
  171. // }
  172. for (let second = 0; second < 60; second++) {
  173. seconds.push(this.formatNum(second));
  174. }
  175. return {
  176. years,
  177. months,
  178. days,
  179. hours,
  180. minutes,
  181. seconds
  182. }
  183. }
  184. getCurrenDate() {
  185. let curDate = new Date();
  186. let curYear = curDate.getFullYear();
  187. let curMonth = curDate.getMonth() + 1;
  188. let curMonthdays = new Date(curYear, curMonth, 0).getDate();
  189. let curDay = curDate.getDate();
  190. let curHour = curDate.getHours();
  191. let curMinute = curDate.getMinutes();
  192. let curSecond = curDate.getSeconds();
  193. return {
  194. curDate,
  195. curYear,
  196. curMonth,
  197. curMonthdays,
  198. curDay,
  199. curHour,
  200. curMinute,
  201. curSecond
  202. }
  203. }
  204. getDefaultDate() {
  205. let value = this.props.value;
  206. let reg = /-/g;
  207. let defaultDate = value ? new Date(value.replace(reg, "/")) : new Date();
  208. let defaultYear = defaultDate.getFullYear();
  209. let defaultMonth = defaultDate.getMonth() + 1;
  210. let defaultDay = defaultDate.getDate();
  211. let defaultDays = new Date(defaultYear, defaultMonth, 0).getDate() * 1;
  212. return {
  213. defaultDate,
  214. defaultYear,
  215. defaultMonth,
  216. defaultDay,
  217. defaultDays
  218. }
  219. }
  220. getStartDate = () => {
  221. let start = this.props.startYear;
  222. let startDate = "";
  223. let reg = /-/g;
  224. if (start) {
  225. startDate = new Date(start + "/01/01");
  226. } else {
  227. startDate = new Date("1970/01/01");
  228. }
  229. return startDate;
  230. }
  231. getEndDate = () => {
  232. let end = this.props.endYear;
  233. let reg = /-/g;
  234. let endDate = "";
  235. if (end) {
  236. endDate = new Date(end + "/12/01");
  237. } else {
  238. endDate = new Date();
  239. }
  240. return endDate;
  241. }
  242. getDval() {
  243. let value = this.props.value;
  244. let fields = this.props.fields;
  245. let dVal = null;
  246. let aDate = new Date();
  247. let year = this.formatNum(aDate.getFullYear());
  248. let month = this.formatNum(aDate.getMonth() + 1);
  249. let day = this.formatNum(aDate.getDate());
  250. let hour = this.formatNum(aDate.getHours());
  251. let minute = this.formatNum(aDate.getMinutes());
  252. let second = this.formatNum(aDate.getSeconds());
  253. if (value) {
  254. let flag = this.checkValue(value);
  255. if (!flag) {
  256. dVal = [year, month, day, hour, minute, second]
  257. } else {
  258. switch (this.props.fields) {
  259. case "year":
  260. dVal = value ? [value] : [];
  261. break;
  262. case "month":
  263. dVal = value ? value.split("-") : [];
  264. break;
  265. case "day":
  266. dVal = value ? value.split("-") : [];
  267. break;
  268. case "hour":
  269. dVal = [...value.split(" ")[0].split("-"), ...value.split(" ")[1].split(":")];
  270. break;
  271. case "minute":
  272. dVal = value ? [...value.split(" ")[0].split("-"), ...value.split(" ")[1].split(":")] : [];
  273. break;
  274. case "second":
  275. dVal = [...value.split(" ")[0].split("-"), ...value.split(" ")[1].split(":")];
  276. break;
  277. }
  278. }
  279. } else {
  280. dVal = [year, month, day, hour, minute, second]
  281. }
  282. return dVal;
  283. }
  284. initData() {
  285. let startDate, endDate, startYear, endYear, startMonth, endMonth, startDay, endDay;
  286. let years = [], months = [], days = [], hours = [], minutes = [], seconds = [];
  287. let dVal = [], pickVal = [];
  288. let value = this.props.value;
  289. let reg = /-/g;
  290. let range = {};
  291. let result = "", full = "", year, month, day, hour, minute, second, obj = {};
  292. let defaultDate = this.getDefaultDate();
  293. let defaultYear = defaultDate.defaultYear;
  294. let defaultMonth = defaultDate.defaultMonth;
  295. let defaultDay = defaultDate.defaultDay;
  296. let defaultDays = defaultDate.defaultDays;
  297. let curFlag = this.props.current;
  298. let disabledAfter = this.props.disabledAfter;
  299. let curDate = this.getCurrenDate();
  300. let curYear = curDate.curYear;
  301. let curMonth = curDate.curMonth;
  302. let curMonthdays = curDate.curMonthdays;
  303. let curDay = curDate.curDay;
  304. let curHour = curDate.curHour;
  305. let curMinute = curDate.curMinute;
  306. let curSecond = curDate.curSecond;
  307. let dateData = [];
  308. dVal = this.getDval();
  309. startDate = this.getStartDate();
  310. endDate = this.getEndDate();
  311. startYear = startDate.getFullYear();
  312. startMonth = startDate.getMonth();
  313. startDay = startDate.getDate();
  314. endYear = endDate.getFullYear();
  315. endMonth = endDate.getMonth();
  316. endDay = endDate.getDate();
  317. dateData = this.getData(dVal);
  318. years = dateData.years;
  319. months = dateData.months;
  320. days = dateData.days;
  321. hours = dateData.hours;
  322. minutes = dateData.minutes;
  323. seconds = dateData.seconds;
  324. switch (this.props.fields) {
  325. case "year":
  326. pickVal = disabledAfter ? [
  327. dVal[0] && years.indexOf(dVal[0]) != -1 ? years.indexOf(dVal[0]) : 0
  328. ] : (curFlag ? [
  329. years.indexOf(curYear + '')
  330. ] : [
  331. dVal[0] && years.indexOf(dVal[0]) != -1 ? years.indexOf(dVal[0]) : 0
  332. ]);
  333. range = { years };
  334. year = dVal[0] ? dVal[0] : years[0];
  335. result = full = `${year}`;
  336. obj = {
  337. year
  338. }
  339. break;
  340. case "month":
  341. pickVal = disabledAfter ? [
  342. dVal[0] && years.indexOf(dVal[0]) != -1 ? years.indexOf(dVal[0]) : 0,
  343. dVal[1] && months.indexOf(dVal[1]) != -1 ? months.indexOf(dVal[1]) : 0
  344. ] : (curFlag ? [
  345. years.indexOf(curYear + ''),
  346. months.indexOf(this.formatNum(curMonth))
  347. ] : [
  348. dVal[0] && years.indexOf(dVal[0]) != -1 ? years.indexOf(dVal[0]) : 0,
  349. dVal[1] && months.indexOf(dVal[1]) != -1 ? months.indexOf(dVal[1]) : 0
  350. ]);
  351. range = { years, months };
  352. year = dVal[0] ? dVal[0] : years[0];
  353. month = dVal[1] ? dVal[1] : months[0];
  354. result = full = `${year + '-' + month}`;
  355. obj = {
  356. year,
  357. month
  358. }
  359. break;
  360. case "day":
  361. pickVal = disabledAfter ? [
  362. dVal[0] && years.indexOf(dVal[0]) != -1 ? years.indexOf(dVal[0]) : 0,
  363. dVal[1] && months.indexOf(dVal[1]) != -1 ? months.indexOf(dVal[1]) : 0,
  364. dVal[2] && days.indexOf(dVal[2]) != -1 ? days.indexOf(dVal[2]) : 0
  365. ] : (curFlag ? [
  366. years.indexOf(curYear + ''),
  367. months.indexOf(this.formatNum(curMonth)),
  368. days.indexOf(this.formatNum(curDay)),
  369. ] : [
  370. dVal[0] && years.indexOf(dVal[0]) != -1 ? years.indexOf(dVal[0]) : 0,
  371. dVal[1] && months.indexOf(dVal[1]) != -1 ? months.indexOf(dVal[1]) : 0,
  372. dVal[2] && days.indexOf(dVal[2]) != -1 ? days.indexOf(dVal[2]) : 0
  373. ]);
  374. range = { years, months, days };
  375. year = dVal[0] ? dVal[0] : years[0];
  376. month = dVal[1] ? dVal[1] : months[0];
  377. day = dVal[2] ? dVal[2] : days[0];
  378. result = full = `${year + '-' + month + '-' + day}`;
  379. obj = {
  380. year,
  381. month,
  382. day
  383. }
  384. break;
  385. case "hour":
  386. pickVal = disabledAfter ? [
  387. dVal[0] && years.indexOf(dVal[0]) != -1 ? years.indexOf(dVal[0]) : 0,
  388. dVal[1] && months.indexOf(dVal[1]) != -1 ? months.indexOf(dVal[1]) : 0,
  389. dVal[2] && days.indexOf(dVal[2]) != -1 ? days.indexOf(dVal[2]) : 0,
  390. dVal[3] && hours.indexOf(dVal[3]) != -1 ? hours.indexOf(dVal[3]) : 0
  391. ] : (curFlag ? [
  392. years.indexOf(curYear + ''),
  393. months.indexOf(this.formatNum(curMonth)),
  394. days.indexOf(this.formatNum(curDay)),
  395. hours.indexOf(this.formatNum(curHour)),
  396. ] : [
  397. dVal[0] && years.indexOf(dVal[0]) != -1 ? years.indexOf(dVal[0]) : 0,
  398. dVal[1] && months.indexOf(dVal[1]) != -1 ? months.indexOf(dVal[1]) : 0,
  399. dVal[2] && days.indexOf(dVal[2]) != -1 ? days.indexOf(dVal[2]) : 0,
  400. dVal[3] && hours.indexOf(dVal[3]) != -1 ? hours.indexOf(dVal[3]) : 0
  401. ]);
  402. range = { years, months, days, hours };
  403. year = dVal[0] ? dVal[0] : years[0];
  404. month = dVal[1] ? dVal[1] : months[0];
  405. day = dVal[2] ? dVal[2] : days[0];
  406. hour = dVal[3] ? dVal[3] : hours[0];
  407. result = `${year + '-' + month + '-' + day + ' ' + hour}`;
  408. full = `${year + '-' + month + '-' + day + ' ' + hour + ':00:00'}`;
  409. obj = {
  410. year,
  411. month,
  412. day,
  413. hour
  414. }
  415. break;
  416. case "minute":
  417. pickVal = disabledAfter ? [
  418. dVal[0] && years.indexOf(dVal[0]) != -1 ? years.indexOf(dVal[0]) : 0,
  419. dVal[1] && months.indexOf(dVal[1]) != -1 ? months.indexOf(dVal[1]) : 0,
  420. dVal[2] && days.indexOf(dVal[2]) != -1 ? days.indexOf(dVal[2]) : 0,
  421. dVal[3] && hours.indexOf(dVal[3]) != -1 ? hours.indexOf(dVal[3]) : 0,
  422. dVal[4] && minutes.indexOf(dVal[4]) != -1 ? minutes.indexOf(dVal[4]) : 0
  423. ] : (curFlag ? [
  424. years.indexOf(curYear + ''),
  425. months.indexOf(this.formatNum(curMonth)),
  426. days.indexOf(this.formatNum(curDay)),
  427. hours.indexOf(this.formatNum(curHour)),
  428. minutes.indexOf(this.formatNum(curMinute)),
  429. ] : [
  430. dVal[0] && years.indexOf(dVal[0]) != -1 ? years.indexOf(dVal[0]) : 0,
  431. dVal[1] && months.indexOf(dVal[1]) != -1 ? months.indexOf(dVal[1]) : 0,
  432. dVal[2] && days.indexOf(dVal[2]) != -1 ? days.indexOf(dVal[2]) : 0,
  433. dVal[3] && hours.indexOf(dVal[3]) != -1 ? hours.indexOf(dVal[3]) : 0,
  434. dVal[4] && minutes.indexOf(dVal[4]) != -1 ? minutes.indexOf(dVal[4]) : 0
  435. ]);
  436. range = { years, months, days, hours, minutes };
  437. year = dVal[0] ? dVal[0] : years[0];
  438. month = dVal[1] ? dVal[1] : months[0];
  439. day = dVal[2] ? dVal[2] : days[0];
  440. hour = dVal[3] ? dVal[3] : hours[0];
  441. minute = dVal[4] ? dVal[4] : minutes[0];
  442. full = `${year + '-' + month + '-' + day + ' ' + hour + ':' + minute + ':00'}`;
  443. result = `${year + '-' + month + '-' + day + ' ' + hour + ':' + minute}`;
  444. obj = {
  445. year,
  446. month,
  447. day,
  448. hour,
  449. minute
  450. }
  451. break;
  452. case "second":
  453. pickVal = disabledAfter ? [
  454. dVal[0] && years.indexOf(dVal[0]) != -1 ? years.indexOf(dVal[0]) : 0,
  455. dVal[1] && months.indexOf(dVal[1]) != -1 ? months.indexOf(dVal[1]) : 0,
  456. dVal[2] && days.indexOf(dVal[2]) != -1 ? days.indexOf(dVal[2]) : 0,
  457. dVal[3] && hours.indexOf(dVal[3]) != -1 ? hours.indexOf(dVal[3]) : 0,
  458. dVal[4] && minutes.indexOf(dVal[4]) != -1 ? minutes.indexOf(dVal[4]) : 0,
  459. dVal[5] && seconds.indexOf(dVal[5]) != -1 ? seconds.indexOf(dVal[5]) : 0
  460. ] : (curFlag ? [
  461. years.indexOf(curYear + ''),
  462. months.indexOf(this.formatNum(curMonth)),
  463. days.indexOf(this.formatNum(curDay)),
  464. hours.indexOf(this.formatNum(curHour)),
  465. minutes.indexOf(this.formatNum(curMinute)),
  466. seconds.indexOf(this.formatNum(curSecond)),
  467. ] : [
  468. dVal[0] && years.indexOf(dVal[0]) != -1 ? years.indexOf(dVal[0]) : 0,
  469. dVal[1] && months.indexOf(dVal[1]) != -1 ? months.indexOf(dVal[1]) : 0,
  470. dVal[2] && days.indexOf(dVal[2]) != -1 ? days.indexOf(dVal[2]) : 0,
  471. dVal[3] && hours.indexOf(dVal[3]) != -1 ? hours.indexOf(dVal[3]) : 0,
  472. dVal[4] && minutes.indexOf(dVal[4]) != -1 ? minutes.indexOf(dVal[4]) : 0,
  473. dVal[5] && seconds.indexOf(dVal[5]) != -1 ? seconds.indexOf(dVal[5]) : 0
  474. ]);
  475. range = { years, months, days, hours, minutes, seconds };
  476. year = dVal[0] ? dVal[0] : years[0];
  477. month = dVal[1] ? dVal[1] : months[0];
  478. day = dVal[2] ? dVal[2] : days[0];
  479. hour = dVal[3] ? dVal[3] : hours[0];
  480. minute = dVal[4] ? dVal[4] : minutes[0];
  481. second = dVal[5] ? dVal[5] : seconds[0];
  482. result = full = `${year + '-' + month + '-' + day + ' ' + hour + ':' + minute + ':' + second}`;
  483. obj = {
  484. year,
  485. month,
  486. day,
  487. hour,
  488. minute,
  489. second
  490. }
  491. break;
  492. default:
  493. range = { years, months, days };
  494. break;
  495. }
  496. this.setState({
  497. range,
  498. checkObj:obj
  499. })
  500. this.props.change({
  501. result: result,
  502. value: full,
  503. obj: obj
  504. })
  505. Taro.nextTick(() => {
  506. this.setState({
  507. pickVal
  508. })
  509. });
  510. }
  511. isLeapYear = (Year) => {
  512. if (((Year % 4)==0) && ((Year % 100)!=0) || ((Year % 400)==0)) {
  513. return true;
  514. } else {
  515. return false;
  516. }
  517. }
  518. handlerChange = (e) => {
  519. let arr = [...e.detail.value];
  520. let data = this.state.range;
  521. let year = "", month = "", day = "", hour = "", minute = "", second = "";
  522. let result = "", full = "", obj = {};
  523. let months = null, days = null, hours = null, minutes = null, seconds = null;
  524. let disabledAfter = this.props.disabledAfter;
  525. let range = Object.assign({}, this.state.range);
  526. let leapYear= false,resetData={};
  527. year = (arr[0] || arr[0] == 0) ? data.years[arr[0]] || data.years[data.years.length - 1] : "";
  528. month = (arr[1] || arr[1] == 0) ? data.months[arr[1]] || data.months[data.months.length - 1] : "";
  529. day = (arr[2] || arr[2] == 0) ? data.days[arr[2]] || data.days[data.days.length - 1] : "";
  530. hour = (arr[3] || arr[3] == 0) ? data.hours[arr[3]] || data.hours[data.hours.length - 1] : "";
  531. minute = (arr[4] || arr[4] == 0) ? data.minutes[arr[4]] || data.minutes[data.minutes.length - 1] : "";
  532. second = (arr[5] || arr[5] == 0) ? data.seconds[arr[5]] || data.seconds[data.seconds.length - 1] : "";
  533. resetData = this.resetData(year, month, day, hour, minute);
  534. leapYear = this.isLeapYear(year);
  535. switch (this.props.fields) {
  536. case "year":
  537. result = full = `${year}`;
  538. obj = {
  539. year
  540. };
  541. break;
  542. case "month":
  543. result = full = `${year + '-' + month}`;
  544. if (this.props.disabledAfter) months = resetData.months;
  545. if (months) {
  546. range.months = months;
  547. this.setState({
  548. range,
  549. pickVal:e.detail.value
  550. })
  551. }
  552. obj = {
  553. year,
  554. month
  555. }
  556. break;
  557. case "day":
  558. result = full = `${year + '-' + month + '-' + day}`;
  559. if (this.props.disabledAfter) {
  560. months = resetData.months;
  561. days = resetData.days;
  562. } else {
  563. if (leapYear || (month != this.state.checkObj.month)) {
  564. days = resetData.days;
  565. }
  566. }
  567. if (months) range.months=months;
  568. if (days) range.days=days;
  569. this.setState({
  570. range,
  571. pickVal:e.detail.value
  572. })
  573. obj = {
  574. year,
  575. month,
  576. day
  577. }
  578. break;
  579. case "hour":
  580. result = `${year + '-' + month + '-' + day + ' ' + hour}`;
  581. full = `${year + '-' + month + '-' + day + ' ' + hour + ':00:00'}`;
  582. if (this.props.disabledAfter) {
  583. months = resetData.months;
  584. days = resetData.days;
  585. hours = resetData.hours;
  586. } else {
  587. if (leapYear || (month != this.state.checkObj.month)) {
  588. days = resetData.days;
  589. }
  590. }
  591. if (months) range.months = months;
  592. if (days) range.days = days;
  593. if (hours) range.hours = hours;
  594. this.setState({
  595. range,
  596. pickVal:e.detail.value
  597. })
  598. obj = {
  599. year,
  600. month,
  601. day,
  602. hour
  603. }
  604. break;
  605. case "minute":
  606. full = `${year + '-' + month + '-' + day + ' ' + hour + ':' + minute + ':00'}`;
  607. result = `${year + '-' + month + '-' + day + ' ' + hour + ':' + minute}`;
  608. if (this.props.disabledAfter) {
  609. months = resetData.months;
  610. days = resetData.days;
  611. hours = resetData.hours;
  612. minutes = resetData.minutes;
  613. } else {
  614. if (leapYear || (month != this.state.checkObj.month)) {
  615. days = resetData.days;
  616. }
  617. }
  618. if (months) range.months = months;
  619. if (days) range.days = days;
  620. if (hours) range.hours = hours;
  621. if (minutes) range.minutes = minutes;
  622. this.setState({
  623. range,
  624. pickVal:e.detail.value
  625. })
  626. obj = {
  627. year,
  628. month,
  629. day,
  630. hour,
  631. minute
  632. };
  633. break;
  634. case "second":
  635. result = full = `${year + '-' + month + '-' + day + ' ' + hour + ':' + minute + ':' + second}`;
  636. if (this.props.disabledAfter) {
  637. months = resetData.months;
  638. days = resetData.days;
  639. hours = resetData.hours;
  640. minutes = resetData.minutes;
  641. //seconds=resetData.seconds;
  642. } else {
  643. if (leapYear || (month != this.state.checkObj.month)) {
  644. days = resetData.days;
  645. }
  646. }
  647. if (months) range.months = months;
  648. if (days) range.days = days;
  649. if (hours) range.hours = hours;
  650. if (minutes) range.minutes = minutes;
  651. //if(seconds)this.range.seconds=seconds;
  652. this.setState({
  653. range,
  654. pickVal:e.detail.value
  655. })
  656. obj = {
  657. year,
  658. month,
  659. day,
  660. hour,
  661. minute,
  662. second
  663. }
  664. break;
  665. }
  666. this.setState({
  667. checkObj:obj
  668. })
  669. this.props.change({
  670. result: result,
  671. value: full,
  672. obj: obj
  673. })
  674. }
  675. render() {
  676. const { pickVal, range } = this.state
  677. return (
  678. <View className='w-picker-view'>
  679. {this.props.fields == 'year' ? (
  680. <PickerView className="d-picker-view" indicatorStyle={this.props.itemHeight} value={pickVal} onChange={this.handlerChange}>
  681. <PickerViewColumn>
  682. {
  683. range.years.map((item, index) => {
  684. return (<View className="w-picker-item" key={index}>{item}年</View>)
  685. })
  686. }
  687. </PickerViewColumn>
  688. </PickerView>
  689. ) : null}
  690. {this.props.fields == 'month' ? (
  691. <PickerView className="d-picker-view" indicatorStyle={this.props.itemHeight} value={pickVal} onChange={this.handlerChange}>
  692. <PickerViewColumn>
  693. {
  694. range.years.map((item, index) => {
  695. return (<View className="w-picker-item" key={index}>{item}年</View>)
  696. })
  697. }
  698. </PickerViewColumn>
  699. <PickerViewColumn>
  700. {
  701. range.months.map((item, index) => {
  702. return (<View className="w-picker-item" key={index}>{item}月</View>)
  703. })
  704. }
  705. </PickerViewColumn>
  706. </PickerView>
  707. ) : null}
  708. {this.props.fields == 'day' ? (
  709. <PickerView className="d-picker-view" indicatorStyle={this.props.itemHeight} value={pickVal} onChange={this.handlerChange}>
  710. <PickerViewColumn>
  711. {
  712. range.years.map((item, index) => {
  713. return (<View className="w-picker-item" key={index}>{item}年</View>)
  714. })
  715. }
  716. </PickerViewColumn>
  717. <PickerViewColumn>
  718. {
  719. range.months.map((item, index) => {
  720. return (<View className="w-picker-item" key={index}>{item}月</View>)
  721. })
  722. }
  723. </PickerViewColumn>
  724. <PickerViewColumn>
  725. {
  726. range.days.map((item, index) => {
  727. return (<View className="w-picker-item" key={index}>{item}日</View>)
  728. })
  729. }
  730. </PickerViewColumn>
  731. </PickerView>
  732. ) : null}
  733. {this.props.fields == 'hour' ? (
  734. <PickerView className="d-picker-view" indicatorStyle={this.props.itemHeight} value={pickVal} onChange={this.handlerChange}>
  735. <PickerViewColumn>
  736. {
  737. range.years.map((item, index) => {
  738. return (<View className="w-picker-item" key={index}>{item}年</View>)
  739. })
  740. }
  741. </PickerViewColumn>
  742. <PickerViewColumn>
  743. {
  744. range.months.map((item, index) => {
  745. return (<View className="w-picker-item" key={index}>{item}月</View>)
  746. })
  747. }
  748. </PickerViewColumn>
  749. <PickerViewColumn>
  750. {
  751. range.days.map((item, index) => {
  752. return (<View className="w-picker-item" key={index}>{item}日</View>)
  753. })
  754. }
  755. </PickerViewColumn>
  756. <PickerViewColumn>
  757. {
  758. range.hours.map((item, index) => {
  759. return (<View className="w-picker-item" key={index}>{item}时</View>)
  760. })
  761. }
  762. </PickerViewColumn>
  763. </PickerView>
  764. ) : null}
  765. {this.props.fields == 'minute' ? (
  766. <PickerView className="d-picker-view" indicatorStyle={this.props.itemHeight} value={pickVal} onChange={this.handlerChange}>
  767. <PickerViewColumn>
  768. {
  769. range.years.map((item, index) => {
  770. return (<View className="w-picker-item" key={index}>{item}年</View>)
  771. })
  772. }
  773. </PickerViewColumn>
  774. <PickerViewColumn>
  775. {
  776. range.months.map((item, index) => {
  777. return (<View className="w-picker-item" key={index}>{item}月</View>)
  778. })
  779. }
  780. </PickerViewColumn>
  781. <PickerViewColumn>
  782. {
  783. range.days.map((item, index) => {
  784. return (<View className="w-picker-item" key={index}>{item}日</View>)
  785. })
  786. }
  787. </PickerViewColumn>
  788. <PickerViewColumn>
  789. {
  790. range.hours.map((item, index) => {
  791. return (<View className="w-picker-item" key={index}>{item}时</View>)
  792. })
  793. }
  794. </PickerViewColumn>
  795. <PickerViewColumn>
  796. {
  797. range.minutes.map((item, index) => {
  798. return (<View className="w-picker-item" key={index}>{item}分</View>)
  799. })
  800. }
  801. </PickerViewColumn>
  802. </PickerView>
  803. ) : null}
  804. {this.props.fields == 'second' ? (
  805. <PickerView className="d-picker-view" indicatorStyle={this.props.itemHeight} value={pickVal} onChange={this.handlerChange}>
  806. <PickerViewColumn>
  807. {
  808. range.years.map((item, index) => {
  809. return (<View className="w-picker-item" key={index}>{item}年</View>)
  810. })
  811. }
  812. </PickerViewColumn>
  813. <PickerViewColumn>
  814. {
  815. range.months.map((item, index) => {
  816. return (<View className="w-picker-item" key={index}>{item}月</View>)
  817. })
  818. }
  819. </PickerViewColumn>
  820. <PickerViewColumn>
  821. {
  822. range.days.map((item, index) => {
  823. return (<View className="w-picker-item" key={index}>{item}日</View>)
  824. })
  825. }
  826. </PickerViewColumn>
  827. <PickerViewColumn>
  828. {
  829. range.hours.map((item, index) => {
  830. return (<View className="w-picker-item" key={index}>{item}时</View>)
  831. })
  832. }
  833. </PickerViewColumn>
  834. <PickerViewColumn>
  835. {
  836. range.minutes.map((item, index) => {
  837. return (<View className="w-picker-item" key={index}>{item}分</View>)
  838. })
  839. }
  840. </PickerViewColumn>
  841. <PickerViewColumn>
  842. {
  843. range.seconds.map((item, index) => {
  844. return (<View className="w-picker-item" key={index}>{item}秒</View>)
  845. })
  846. }
  847. </PickerViewColumn>
  848. </PickerView>
  849. ) : null}
  850. </View>
  851. )
  852. }
  853. }
  854. DatePicker.PropTypes = {
  855. itemHeight: PropTypes.string,
  856. startYear: PropTypes.oneOfType([
  857. PropTypes.string,
  858. PropTypes.number,
  859. ]),
  860. endYear: PropTypes.oneOfType([
  861. PropTypes.string,
  862. PropTypes.number,
  863. ]),
  864. value: PropTypes.oneOfType([
  865. PropTypes.string,
  866. PropTypes.array,
  867. PropTypes.number
  868. ]),
  869. current: PropTypes.bool,//是否默认选中当前日期
  870. disabledAfter: PropTypes.bool,//是否禁用当前之后的日期
  871. fields: PropTypes.string
  872. }
  873. DatePicker.defaultProps = {
  874. itemHeight: "44px",
  875. startYear: "",
  876. endYear: "",
  877. value: "",
  878. current: false,
  879. disabledAfter: false,
  880. fields: "day"
  881. }