Nejcraft/nej-react-utils
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

use dayjs for dates

Browse Source
This commit is contained in:
honzapatCZ 2026-06-03 15:15:08 +02:00
parent e46167ea63
commit a975be99e9
2 changed files with 11 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
Form/Core/DateFields.js
View File

@ -1,5 +1,6 @@
import tw, { styled } from "twin.macro";
import "styled-components/macro";
import dayjs from "dayjs";
import Input, { useField } from "@shared/nej-react-components/Parts/Input";
@ -7,16 +8,12 @@ export default function DateField(props) {
const [{onChange, value, ...field}, meta, helpers] = useField(props);
let realDate = (typeof(value) === "string" ? new Date(Date.parse(value)) : value);
if(typeof(realDate) != "object")
realDate = null;
//check if its ivnalid, if so make it null
if(isNaN(realDate))
realDate = null;
const parsedDate = dayjs(value);
const isValid = value && parsedDate.isValid();
const {value: _x, onChange: _y, ...restProps} = props;
return <Input type="date"
value={realDate?.toISOString().slice(0,10)}
onChange={(e)=>onChange(new Date(e.target.value))} {...field} {...restProps} />;
value={isValid ? parsedDate.format("YYYY-MM-DD") : ""}
onChange={(e)=>onChange(e.target.value ? dayjs(e.target.value).toDate() : null)} {...field} {...restProps} />;
}

22
Form/Core/DateTimeField.js
View File

@ -1,5 +1,6 @@
import tw, { styled } from "twin.macro";
import "styled-components/macro";
import dayjs from "dayjs";
import Input, { useField } from "@shared/nej-react-components/Parts/Input";
@ -7,26 +8,15 @@ export default function DateTimeField(props) {
const [{onChange, value, ...field}, meta, helpers] = useField(props);
//console.log(value)
/***
* @type {Date}
*/
let realDate = (typeof(value) === "string" ? new Date(Date.parse( (value.length > 19 || value.length < 10) ? value : value + "Z")) : value);
if(typeof(realDate) != "object")
realDate = null;
//check if its ivnalid, if so make it null
if(isNaN(realDate))
realDate = null;
const parsedDate = dayjs(value);
const isValid = value && parsedDate.isValid();
const {value: _x, onChange: _y, ...restProps} = props;
// console.log(realDate)
// console.log(realDate?.toISOString().slice(0,19))
return <Input type="datetime-local"
value={realDate?.toISOString().slice(0,16)}
value={isValid ? parsedDate.format("YYYY-MM-DDTHH:mm") : ""}
onChange={(e)=>{
const value = e.target.value;
console.log( (value.length > 19 || value.length < 10) ? value : value + "Z")
onChange(new Date( (value.length > 19 || value.length < 10) ? value : value + "Z"))
const val = e.target.value;
onChange(val ? dayjs(val).toDate() : null);
}} {...field} {...restProps} />;
}