Работа формика + дисабл чекбокса одобрения паузы от условия

This commit is contained in:
krokodilka 2022-06-02 13:39:43 +03:00
parent ddc2652cf8
commit c7e5fcebe2
3 changed files with 27 additions and 11 deletions

14
package-lock.json generated

@ -22,6 +22,7 @@
"axios": "^0.27.2",
"formik": "^2.2.9",
"framer-motion": "^6.3.3",
"moment": "^2.29.3",
"notistack": "^2.0.5",
"react": "^18.1.0",
"react-datepicker": "^4.8.0",
@ -13052,6 +13053,14 @@
"mkdirp": "bin/cmd.js"
}
},
"node_modules/moment": {
"version": "2.29.3",
"resolved": "https://registry.npmjs.org/moment/-/moment-2.29.3.tgz",
"integrity": "sha512-c6YRvhEo//6T2Jz/vVtYzqBzwvPT95JBQ+smCytzf7c50oMZRsR/a4w88aD34I+/QVSfnoAnSBFPJHItlOMJVw==",
"engines": {
"node": "*"
}
},
"node_modules/ms": {
"version": "2.1.2",
"resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
@ -27695,6 +27704,11 @@
"minimist": "^1.2.6"
}
},
"moment": {
"version": "2.29.3",
"resolved": "https://registry.npmjs.org/moment/-/moment-2.29.3.tgz",
"integrity": "sha512-c6YRvhEo//6T2Jz/vVtYzqBzwvPT95JBQ+smCytzf7c50oMZRsR/a4w88aD34I+/QVSfnoAnSBFPJHItlOMJVw=="
},
"ms": {
"version": "2.1.2",
"resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",

@ -17,6 +17,7 @@
"axios": "^0.27.2",
"formik": "^2.2.9",
"framer-motion": "^6.3.3",
"moment": "^2.29.3",
"notistack": "^2.0.5",
"react": "^18.1.0",
"react-datepicker": "^4.8.0",

@ -1,16 +1,15 @@
import React from 'react';
import moment from 'moment';
import {Input, Select, Stack, Checkbox, Box, Text, Divider, Button} from '@chakra-ui/react'
import { Formik, Field, Form } from 'formik';
import DatePicker from "react-datepicker";
import "react-datepicker/dist/react-datepicker.css";
import TimePicker from 'react-time-picker';
const statusValues: any = ['draft', 'template', 'stop', 'start']
export default () => {
const [startDate, setStartDate] = React.useState<any>(null);
const [value, onChange] = React.useState<string>("");
return(
<Box
padding="20px"
@ -87,25 +86,27 @@ export default () => {
amPmAriaLabel={"am"}
onChange={(e:any) => {
if (e !== null) {
console.log("i used")
console.log(e)
console.log(typeof e)
setFieldValue("time", e)
} else {
//При стирании значения пользователем затирается и последнее значение
setFieldValue("time", "")
}
}}
// onChange={(e:any) => onChange(e)}
value={values.time}
/>
<Text>Разрешить ставить на паузу</Text>
<Field as={Checkbox} name="pause"/>
<Field as={Checkbox} name="pause" isDisabled={values.time.length === 0 ? true : false}/>
<Text>Дата проведения опроса</Text>
<Field
as={DatePicker}
name="date"
selected={startDate}
timeInputLabel="Time:"
selected={values.date}
dateFormat="MM/dd/yyyy"
showTimeInput
onChange={(e:any) => {
console.log(e)
setFieldValue("date", e)
}}
minDate={new Date()}
/>
</Stack>
<Button type="submit">Сохранить</Button>