linkmore-design
Version:
🌈 🚀lm组件库。🚀
238 lines (236 loc) • 8.22 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _react = _interopRequireWildcard(require("react"));
var _radio = _interopRequireDefault(require("../radio"));
var _checkbox = _interopRequireDefault(require("../checkbox"));
var _row = _interopRequireDefault(require("../row"));
var _col = _interopRequireDefault(require("../col"));
var _inputNumber = _interopRequireDefault(require("../input-number"));
var _WeekSelect = _interopRequireWildcard(require("./WeekSelect"));
var _GlobalContext = _interopRequireDefault(require("./GlobalContext"));
// import { Radio, Checkbox, Row, Col, InputNumber } from "linkmore-design";
const RadioGroup = _radio.default.Group;
const CheckboxGroup = _checkbox.default.Group;
const radioStyle = {
display: "block",
paddingBottom: "6px"
};
const weekOptions = ["SUN", "MON", "TUE", "WED", "THU", "FRI", "SAT"];
function WeekPane(props) {
const {
language = {}
} = (0, _react.useContext)(_GlobalContext.default);
const {
assign,
donTAssign,
everyTime = {},
aTob = {},
aStartTob = {},
week: weekOptionsByL
} = language;
const {
value,
onChange
} = props;
const [currentRadio, setCurrentRadio] = (0, _react.useState)(2);
const [from, setFrom] = (0, _react.useState)("SUN");
const [to, setTo] = (0, _react.useState)("MON");
const [weekOfMonth, setWeekOfMonth] = (0, _react.useState)(1);
const [dayOfWeek, setDayOfWeek] = (0, _react.useState)("MON");
const [lastWeekOfMonth, setLastWeekOfMonth] = (0, _react.useState)("MON");
const [selected, setSelected] = (0, _react.useState)(["MON"]);
const isFirstRender = _react.default.useRef();
if (isFirstRender.current !== false) {
isFirstRender.current = true;
}
(0, _react.useEffect)(() => {
if (value === "*") {
setCurrentRadio(1);
} else if (value === "?") {
setCurrentRadio(2);
} else if (value.indexOf("-") > -1) {
setCurrentRadio(3);
const [defaultFrom, defaultTo] = value.split("-");
setFrom(defaultFrom);
setTo(defaultTo);
} else if (value.indexOf("#") > -1) {
setCurrentRadio(4);
const [defaultDayOfWeek, defaultWeekOfMonth] = value.split("#");
setWeekOfMonth(parseInt(defaultWeekOfMonth, 10));
setDayOfWeek(defaultDayOfWeek);
} else if (value.indexOf("L") > -1) {
setCurrentRadio(5);
const [defaultLastWeekOfMonth] = value.split("L");
setLastWeekOfMonth(defaultLastWeekOfMonth);
} else {
setCurrentRadio(6);
setSelected(value ? value.split(",") : ["MON"]);
}
}, [value]);
(0, _react.useEffect)(() => {
if (!isFirstRender.current) {
switch (currentRadio) {
case 1:
onChange("*");
break;
case 2:
onChange("?");
break;
case 3:
onChange(`${from}-${to}`);
break;
case 4:
onChange(`${dayOfWeek}#${weekOfMonth}`);
break;
case 5:
onChange(`${lastWeekOfMonth}L`);
break;
case 6:
onChange(selected.join(","));
break;
default:
break;
}
}
}, [currentRadio, from, to, weekOfMonth, dayOfWeek, lastWeekOfMonth, selected]);
const onChangeRadio = (0, _react.useCallback)(e => {
setCurrentRadio(e.target.value);
}, []);
const onChangeFrom = (0, _react.useCallback)(v => {
setFrom(v || "MON");
}, []);
const onChangeTo = (0, _react.useCallback)(v => {
setTo(v || "MON");
}, []);
const onChangeWeekOfMonth = (0, _react.useCallback)(v => {
setWeekOfMonth(v || 1);
}, []);
const onChangeDayOfWeek = (0, _react.useCallback)(v => {
setDayOfWeek(v || "MON");
}, []);
const onChangeLastWeekOfMonth = (0, _react.useCallback)(v => {
setLastWeekOfMonth(v || "MON");
}, []);
const onChangeSelected = (0, _react.useCallback)(v => {
setSelected(v.length !== 0 ? v : ["MON"]);
}, []);
const checkList = (0, _react.useMemo)(() => {
const disabled = currentRadio !== 6;
return weekOptions.map(item => {
return /*#__PURE__*/_react.default.createElement(_col.default, {
key: item,
span: 3
}, /*#__PURE__*/_react.default.createElement(_checkbox.default, {
disabled: disabled,
value: item
}, weekOptionsByL?.[`${item}`.toLocaleLowerCase()] || _WeekSelect.weekOptionsObj[item]));
});
}, [currentRadio, selected]);
(0, _react.useEffect)(() => {
isFirstRender.current = false;
}, []);
const aTobA = /*#__PURE__*/_react.default.createElement(_WeekSelect.default, {
disabled: currentRadio !== 3,
value: from,
size: "small",
onChange: onChangeFrom,
style: {
width: 100
}
});
const aTobB = /*#__PURE__*/_react.default.createElement(_WeekSelect.default, {
disabled: currentRadio !== 3,
value: to,
size: "small",
onChange: onChangeTo,
style: {
width: 100
}
});
const aStartTobA = /*#__PURE__*/_react.default.createElement(_inputNumber.default, {
disabled: currentRadio !== 4,
min: 0,
max: 5,
value: weekOfMonth,
size: "small",
onChange: onChangeWeekOfMonth,
style: {
width: 100
}
});
const aStartTobB = /*#__PURE__*/_react.default.createElement(_WeekSelect.default, {
disabled: currentRadio !== 4,
value: dayOfWeek,
size: "small",
onChange: onChangeDayOfWeek,
style: {
width: 100
}
});
const aStartTob2A = /*#__PURE__*/_react.default.createElement(_WeekSelect.default, {
disabled: currentRadio !== 5,
value: lastWeekOfMonth,
size: "small",
onChange: onChangeLastWeekOfMonth,
style: {
width: 100
}
});
return /*#__PURE__*/_react.default.createElement(RadioGroup, {
name: "radiogroup",
value: currentRadio,
onChange: onChangeRadio,
style: {
width: "100%"
}
}, /*#__PURE__*/_react.default.createElement(_radio.default, {
style: radioStyle,
value: 1
}, everyTime.week || "每一周"), /*#__PURE__*/_react.default.createElement(_radio.default, {
style: radioStyle,
value: 2
}, donTAssign || "不指定"), /*#__PURE__*/_react.default.createElement("span", {
style: {
display: "flex",
alignItems: "center",
fontSize: 14
}
}, /*#__PURE__*/_react.default.createElement(_radio.default, {
style: radioStyle,
value: 3
}), aTob.week ? aTob.week(aTobA, aTobB) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, "\u4ECE\xA0", aTobA, "\xA0-\xA0", aTobB, "\xA0\uFF0C\u6BCF\u661F\u671F\u6267\u884C\u4E00\u6B21")), /*#__PURE__*/_react.default.createElement("span", {
style: {
display: "flex",
alignItems: "center",
fontSize: 14
}
}, /*#__PURE__*/_react.default.createElement(_radio.default, {
style: radioStyle,
value: 4
}), aStartTob.week ? aStartTob.week(aStartTobA, aStartTobB) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, "\u672C\u6708\u7B2C\xA0", aStartTobA, "\xA0\u5468\u7684\xA0", aStartTobB, "\xA0\u6267\u884C\u4E00\u6B21")), /*#__PURE__*/_react.default.createElement("span", {
style: {
display: "flex",
alignItems: "center",
fontSize: 14
}
}, /*#__PURE__*/_react.default.createElement(_radio.default, {
style: radioStyle,
value: 5
}), aStartTob.week2 ? aStartTob.week2(aStartTob2A) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, "\u672C\u6708\u7684\u6700\u540E\u4E00\u4E2A\xA0", aStartTob2A, "\xA0\u6267\u884C\u4E00\u6B21")), /*#__PURE__*/_react.default.createElement(_radio.default, {
style: radioStyle,
value: 6
}, assign || "指定", /*#__PURE__*/_react.default.createElement("br", null), /*#__PURE__*/_react.default.createElement(CheckboxGroup, {
value: selected,
onChange: onChangeSelected,
style: {
width: "100%"
}
}, /*#__PURE__*/_react.default.createElement(_row.default, null, checkList))));
}
var _default = WeekPane;
exports.default = _default;