linkmore-design
Version:
🌈 🚀lm组件库。🚀
210 lines • 6.97 kB
JavaScript
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
import React, { useState, useMemo, useEffect, useCallback, useContext } from "react";
// import { Radio, Checkbox, Row, Col, InputNumber } from "linkmore-design";
import Radio from "../radio";
import Checkbox from "../checkbox";
import Row from "../row";
import Col from "../col";
import InputNumber from "../input-number";
import GlobalContext from "./GlobalContext";
var RadioGroup = Radio.Group;
var CheckboxGroup = Checkbox.Group;
var radioStyle = {
display: "block",
paddingBottom: "6px"
};
function HourPane(props) {
var _useContext = useContext(GlobalContext),
_useContext$language = _useContext.language,
language = _useContext$language === void 0 ? {} : _useContext$language;
var assign = language.assign,
_language$everyTime = language.everyTime,
everyTime = _language$everyTime === void 0 ? {} : _language$everyTime,
_language$aTob = language.aTob,
aTob = _language$aTob === void 0 ? {} : _language$aTob,
_language$aStartTob = language.aStartTob,
aStartTob = _language$aStartTob === void 0 ? {} : _language$aStartTob,
donTAssign = language.donTAssign;
var value = props.value,
onChange = props.onChange;
var _useState = useState(1),
_useState2 = _slicedToArray(_useState, 2),
currentRadio = _useState2[0],
setCurrentRadio = _useState2[1];
var _useState3 = useState(0),
_useState4 = _slicedToArray(_useState3, 2),
from = _useState4[0],
setFrom = _useState4[1];
var _useState5 = useState(10),
_useState6 = _slicedToArray(_useState5, 2),
to = _useState6[0],
setTo = _useState6[1];
var _useState7 = useState(0),
_useState8 = _slicedToArray(_useState7, 2),
offsetFrom = _useState8[0],
setOffsetFrom = _useState8[1];
var _useState9 = useState(1),
_useState10 = _slicedToArray(_useState9, 2),
offset = _useState10[0],
setOffset = _useState10[1];
var _useState11 = useState(["0"]),
_useState12 = _slicedToArray(_useState11, 2),
selected = _useState12[0],
setSelected = _useState12[1];
var isFirstRender = React.useRef();
if (isFirstRender.current !== false) {
isFirstRender.current = true;
}
useEffect(function () {
if (value === "*") {
setCurrentRadio(1);
} else if (value === "?") {
setCurrentRadio(5);
} else if (value.indexOf("-") > -1) {
setCurrentRadio(2);
var _value$split = value.split("-"),
_value$split2 = _slicedToArray(_value$split, 2),
defaultFrom = _value$split2[0],
defaultTo = _value$split2[1];
setFrom(parseInt(defaultFrom, 10));
setTo(parseInt(defaultTo, 10));
} else if (value.indexOf("/") > -1) {
setCurrentRadio(3);
var _value$split3 = value.split("/"),
_value$split4 = _slicedToArray(_value$split3, 2),
defaultOffsetFrom = _value$split4[0],
defaultOffset = _value$split4[1];
setOffsetFrom(parseInt(defaultOffsetFrom, 10));
setOffset(parseInt(defaultOffset, 10));
} else {
setCurrentRadio(4);
setSelected(value ? value.split(",") : ["0"]);
}
}, [value]);
useEffect(function () {
if (!isFirstRender.current) {
switch (currentRadio) {
case 1:
onChange("*");
break;
case 2:
onChange("".concat(from, "-").concat(to));
break;
case 3:
onChange("".concat(offsetFrom, "/").concat(offset));
break;
case 4:
onChange(selected.join(","));
break;
case 5:
onChange("?");
break;
default:
break;
}
}
}, [currentRadio, from, to, offsetFrom, offset, selected]);
var onChangeRadio = useCallback(function (e) {
setCurrentRadio(e.target.value);
}, []);
var onChangeFrom = useCallback(function (v) {
setFrom(v || 0);
}, []);
var onChangeTo = useCallback(function (v) {
setTo(v || 0);
}, []);
var onChangeOffsetFrom = useCallback(function (v) {
setOffsetFrom(v || 0);
}, []);
var onChangeOffset = useCallback(function (v) {
setOffset(v || 0);
}, []);
var onChangeSelected = useCallback(function (v) {
setSelected(v.length !== 0 ? v : ["0"]);
}, []);
var checkList = useMemo(function () {
var disabled = currentRadio !== 4;
var checks = [];
for (var i = 0; i < 24; i++) {
checks.push( /*#__PURE__*/React.createElement(Col, {
key: i,
span: 4
}, /*#__PURE__*/React.createElement(Checkbox, {
disabled: disabled,
value: i.toString()
}, i)));
}
return checks;
}, [currentRadio, selected]);
useEffect(function () {
isFirstRender.current = false;
}, []);
var aTobA = /*#__PURE__*/React.createElement(InputNumber, {
disabled: currentRadio !== 2,
min: 0,
max: 23,
value: from,
size: "small",
onChange: onChangeFrom,
style: {
width: 100
}
});
var aTobB = /*#__PURE__*/React.createElement(InputNumber, {
disabled: currentRadio !== 2,
min: 0,
max: 23,
value: to,
size: "small",
onChange: onChangeTo,
style: {
width: 100
}
});
var aStartTobA = /*#__PURE__*/React.createElement(InputNumber, {
disabled: currentRadio !== 3,
min: 0,
max: 23,
value: offsetFrom,
size: "small",
onChange: onChangeOffsetFrom,
style: {
width: 100
}
});
var aStartTobB = /*#__PURE__*/React.createElement(InputNumber, {
disabled: currentRadio !== 3,
min: 0,
max: 23,
value: offset,
size: "small",
onChange: onChangeOffset,
style: {
width: 100
}
});
return /*#__PURE__*/React.createElement(RadioGroup, {
name: "radiogroup",
value: currentRadio,
onChange: onChangeRadio
}, /*#__PURE__*/React.createElement(Radio, {
style: radioStyle,
value: 1
}, everyTime.hour || "每一小时"), /*#__PURE__*/React.createElement(Radio, {
style: radioStyle,
value: 5
}, donTAssign || "不指定"), /*#__PURE__*/React.createElement(Radio, {
style: radioStyle,
value: 2
}, aTob.hour ? aTob.hour(aTobA, aTobB) : /*#__PURE__*/React.createElement(React.Fragment, null, "\u4ECE\xA0", aTobA, "\xA0-\xA0", aTobB, "\xA0\u65F6\uFF0C\u6BCF\u5C0F\u65F6\u6267\u884C\u4E00\u6B21")), /*#__PURE__*/React.createElement(Radio, {
style: radioStyle,
value: 3
}, aStartTob.hour ? aStartTob.hour(aStartTobA, aStartTobB) : /*#__PURE__*/React.createElement(React.Fragment, null, "\u4ECE\xA0", aStartTobA, "\xA0\u65F6\u5F00\u59CB\uFF0C \u6BCF\xA0", aStartTobB, "\xA0\u5C0F\u65F6\u6267\u884C\u4E00\u6B21")), /*#__PURE__*/React.createElement(Radio, {
style: radioStyle,
value: 4
}, assign || "指定", /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement(CheckboxGroup, {
value: selected,
onChange: onChangeSelected
}, /*#__PURE__*/React.createElement(Row, null, " ", checkList))));
}
export default HourPane;