@zykj2024/much-library 1.1.7-beta.3 → 1.1.7-beta.4

package/dist/esm/McPeriodSelect/index.js

@@ -0,0 +1,305 @@
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _regeneratorRuntime from "@babel/runtime/helpers/esm/regeneratorRuntime";
+import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
+import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import { Button } from 'antd';
+import { McIconFont } from "./..";
+import { useEffect, useMemo, useRef, useState } from 'react';
+import "./index.less";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+var getHours = function getHours() {
+  var hours = [];
+  for (var i = 0; i < 24; i++) {
+    hours.push(i);
+  }
+  return hours;
+};
+var days = ['星期一', '星期二', '星期三', '星期四', '星期五', '星期六', '星期日'];
+// 根据是不是半小时初始化内部使用的全0字符串
+var get0str = function get0str(length) {
+  var tempValue = '';
+  for (var i = 0; i < length; i++) {
+    tempValue += 0;
+  }
+  return tempValue;
+};
+// 根据是否是半小时将外部值转换为内部使用的值
+var aa2a = function aa2a(value) {
+  var res = '',
+    len = value.length;
+  for (var i = 0; i < len; i += 2) {
+    res += value[i];
+  }
+  return res;
+};
+var valueToList = function valueToList(v, half) {
+  var tempValue = v ? half ? v : aa2a(v) : get0str(half ? 336 : 168);
+  return tempValue.split('').map(function (value, index) {
+    return {
+      value: value,
+      index: index
+    };
+  });
+};
+var listToValue = function listToValue(v, half) {
+  var tempValue = v.map(function (item) {
+    return half ? item.value : item.value + item.value;
+  }).join('');
+  return tempValue.includes('1') ? tempValue : undefined;
+};
+
+// 将一维数组按指定数量拆分为二维数组
+var chunkArray = function chunkArray(arr, size) {
+  var res = [];
+  for (var i = 0; i < arr.length; i += size) {
+    res.push(arr.slice(i, i + size));
+  }
+  return res;
+};
+var numToTime = function numToTime(num) {
+  return num.toFixed(1).split('.').map(function (v, i) {
+    return v === '5' && i === 1 ? '30' : +v > 9 ? v : '0' + v;
+  }).join(':');
+};
+var getTimePair = function getTimePair(index, half) {
+  return [numToTime(index * (half ? 0.5 : 1)), numToTime((index + 1) * (half ? 0.5 : 1))];
+};
+var McPeriodSelect = function McPeriodSelect(props) {
+  var style = props.style,
+    className = props.className,
+    half = props.half,
+    value = props.value,
+    onChange = props.onChange,
+    _props$disabled = props.disabled,
+    disabled = _props$disabled === void 0 ? false : _props$disabled;
+  var _useState = useState([]),
+    _useState2 = _slicedToArray(_useState, 2),
+    list = _useState2[0],
+    setList = _useState2[1];
+  var chunkList = useMemo(function () {
+    return chunkArray(list, list.length / 7);
+  }, [list]);
+  var startCoord = useRef();
+  var _useState3 = useState([]),
+    _useState4 = _slicedToArray(_useState3, 2),
+    activeItems = _useState4[0],
+    setActiveItems = _useState4[1];
+  var currentSelectedList = useMemo(function () {
+    var res = [];
+    chunkList.forEach(function (day, dayIndex) {
+      if (day.some(function (item) {
+        return item.value === '1';
+      })) {
+        var chunks = day.map(function (item, index) {
+          return item.value === '1' ? "".concat(index, ",") : '-';
+        }).join('').split('-').filter(function (v) {
+          return v;
+        }).map(function (v) {
+          return v.split(',').filter(function (i) {
+            return !!i;
+          }).map(function (i) {
+            return +i;
+          });
+        }).map(function (c) {
+          var times = [];
+          c.forEach(function (i) {
+            return times.push.apply(times, _toConsumableArray(getTimePair(i, half)));
+          });
+          return [times[0], times[times.length - 1]];
+        });
+        res.push({
+          dayIndex: dayIndex,
+          periodText: chunks.reduce(function (p, c) {
+            return "".concat(p, "\u3001").concat(c.join('-'));
+          }, '').slice(1)
+        });
+      }
+    });
+    return res;
+  }, [chunkList, half]);
+  useEffect(function () {
+    setList(valueToList(value, half));
+  }, [value]);
+  var mouseDown = /*#__PURE__*/function () {
+    var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(x, y, item) {
+      return _regeneratorRuntime().wrap(function _callee$(_context) {
+        while (1) switch (_context.prev = _context.next) {
+          case 0:
+            _context.next = 2;
+            return setActiveItems([]);
+          case 2:
+            startCoord.current = {
+              x: x,
+              y: y
+            };
+            setActiveItems([item]);
+          case 4:
+          case "end":
+            return _context.stop();
+        }
+      }, _callee);
+    }));
+    return function mouseDown(_x, _x2, _x3) {
+      return _ref.apply(this, arguments);
+    };
+  }();
+  var mouseEnter = function mouseEnter(x, y) {
+    if (startCoord.current) {
+      var currentActiveItems = [];
+      var startX = startCoord.current.x > x ? x : startCoord.current.x,
+        endX = startCoord.current.x > x ? startCoord.current.x : x,
+        startY = startCoord.current.y > y ? y : startCoord.current.y,
+        endY = startCoord.current.y > y ? startCoord.current.y : y;
+      for (var i = startX; i <= endX; i++) {
+        for (var j = startY; j <= endY; j++) {
+          currentActiveItems.push(chunkList[i][j]);
+        }
+      }
+      setActiveItems(currentActiveItems);
+    }
+  };
+  var mouseUp = function mouseUp() {
+    var newList = _toConsumableArray(list);
+    var tempValue = activeItems.every(function (item) {
+      return item.value === '1';
+    }) ? '0' : '1';
+    activeItems.forEach(function (item) {
+      return newList[item.index].value = tempValue;
+    });
+    if (!props.hasOwnProperty('value')) {
+      setList(newList);
+    }
+    onChange === null || onChange === void 0 || onChange(listToValue(newList, half));
+    startCoord.current = undefined;
+    setActiveItems([]);
+  };
+  return /*#__PURE__*/_jsxs("div", {
+    style: style,
+    className: "mc-period-select  ".concat(disabled ? 'mc-period-select--disabled' : '', "  ").concat(className || ''),
+    children: [/*#__PURE__*/_jsxs("div", {
+      className: "mc-period-select__header",
+      children: [/*#__PURE__*/_jsx("div", {
+        className: "mc-period-select__title",
+        children: "\u661F\u671F/\u65F6\u95F4"
+      }), /*#__PURE__*/_jsxs("div", {
+        className: "mc-period-select__subtitle-box",
+        children: [/*#__PURE__*/_jsxs("div", {
+          className: "mc-period-select__time-bar",
+          children: [/*#__PURE__*/_jsx("div", {
+            children: "00:00-12:00"
+          }), /*#__PURE__*/_jsx("div", {
+            children: "12:00-24:00"
+          })]
+        }), /*#__PURE__*/_jsx("div", {
+          className: "mc-period-select__hour-bar",
+          children: getHours().map(function (i) {
+            return /*#__PURE__*/_jsx("div", {
+              children: i
+            }, i);
+          })
+        })]
+      })]
+    }), /*#__PURE__*/_jsxs("div", {
+      className: "mc-period-select__body",
+      children: [/*#__PURE__*/_jsx("div", {
+        className: "mc-period-select__side-bar",
+        children: days.map(function (i) {
+          return /*#__PURE__*/_jsx("div", {
+            children: i
+          }, i);
+        })
+      }), /*#__PURE__*/_jsx("div", {
+        className: "mc-period-select__wrapper",
+        onMouseLeave: function onMouseLeave() {
+          startCoord.current = undefined;
+          setActiveItems([]);
+        },
+        children: chunkList.map(function (day, dayIndex) {
+          return /*#__PURE__*/_jsx("div", {
+            className: "mc-period-select__day",
+            children: day.map(function (item, index) {
+              return /*#__PURE__*/_jsx("div", {
+                className: "mc-period-select__item ".concat(activeItems.some(function (aItem) {
+                  return aItem.index === item.index;
+                }) ? 'mc-period-select__item--active' : '', " ").concat(item.value === '1' ? 'mc-period-select__item--selected' : ''),
+                onMouseDown: function onMouseDown() {
+                  return mouseDown(dayIndex, index, item);
+                },
+                onMouseEnter: function onMouseEnter() {
+                  return mouseEnter(dayIndex, index);
+                },
+                onMouseMove: function onMouseMove(e) {
+                  return e.preventDefault();
+                },
+                onMouseUp: mouseUp,
+                children: /*#__PURE__*/_jsx("div", {
+                  className: "mc-period-select__item__mask"
+                })
+              }, item.index);
+            })
+          }, dayIndex);
+        })
+      })]
+    }), /*#__PURE__*/_jsxs("div", {
+      className: "mc-period-select__footer",
+      children: [/*#__PURE__*/_jsxs("div", {
+        className: "mc-period-select__action-bar",
+        children: [/*#__PURE__*/_jsx("div", {
+          children: "\u53EF\u62D6\u5230\u9F20\u6807\u9009\u62E9\u65F6\u6BB5"
+        }), /*#__PURE__*/_jsx(Button, {
+          style: {
+            padding: 0,
+            height: 'auto'
+          },
+          type: "link",
+          icon: /*#__PURE__*/_jsx(McIconFont, {
+            type: "icon-DeleteOutlined",
+            style: {
+              marginRight: -4
+            }
+          }),
+          onClick: function onClick() {
+            if (!props.hasOwnProperty('value')) {
+              setList(function (os) {
+                return os.map(function (item) {
+                  return _objectSpread(_objectSpread({}, item), {}, {
+                    value: '0'
+                  });
+                });
+              });
+            }
+            onChange === null || onChange === void 0 || onChange(undefined);
+          },
+          children: "\u6E05\u7A7A"
+        })]
+      }), currentSelectedList.map(function (item) {
+        return /*#__PURE__*/_jsxs("div", {
+          className: "mc-period-select__selected-item",
+          children: [/*#__PURE__*/_jsx("div", {
+            className: "mc-period-select__selected-item__title",
+            children: days[item.dayIndex]
+          }), /*#__PURE__*/_jsx("div", {
+            className: "mc-period-select__selected-item__content",
+            children: item.periodText
+          }), /*#__PURE__*/_jsx(McIconFont, {
+            className: "mc-period-select__selected-item__remove",
+            type: "icon-CloseOutlined",
+            onClick: function onClick() {
+              var newlist = _toConsumableArray(list);
+              chunkList[item.dayIndex].forEach(function (i) {
+                return newlist[i.index].value = '0';
+              });
+              if (!props.hasOwnProperty('value')) {
+                setList(newlist);
+              }
+              onChange === null || onChange === void 0 || onChange(listToValue(newlist, half));
+            }
+          })]
+        }, item.dayIndex);
+      })]
+    })]
+  });
+};
+export default McPeriodSelect;

package/dist/esm/McPeriodSelect/index.less

@@ -0,0 +1,187 @@
+.mc-period-select {
+  width: 960px;
+  background: #fff;
+  border: 1px solid #ebebeb;
+  border-radius: 4px;
+
+  &__header {
+    display: flex;
+    height: 68px;
+    color: rgba(0, 0, 0, 84.7%);
+    font-weight: bold;
+    font-size: 14px;
+    border-bottom: 1px solid #ebebeb;
+  }
+
+  &__title {
+    flex-shrink: 0;
+    width: 95px;
+    line-height: 68px;
+    text-align: center;
+    border-right: 1px solid #ebebeb;
+  }
+
+  &__subtitle-box {
+    flex: 1;
+  }
+
+  &__time-bar {
+    display: flex;
+    border-bottom: 1px solid #ebebeb;
+
+    div {
+      flex: 1;
+      height: 40px;
+      line-height: 40px;
+      text-align: center;
+
+      &:last-child {
+        border-left: 1px solid #ebebeb;
+      }
+    }
+  }
+
+  &__hour-bar {
+    display: flex;
+
+    div {
+      width: 36px;
+      height: 27px;
+      color: rgba(0, 0, 0, 65%);
+      font-weight: normal;
+      font-size: 12px;
+      line-height: 27px;
+      text-align: center;
+    }
+  }
+
+  &__body {
+    display: flex;
+  }
+
+  &__side-bar {
+    width: 95px;
+    border-right: 1px solid #ebebeb;
+
+    div {
+      height: 52px;
+      color: rgba(0, 0, 0, 65%);
+      line-height: 52px;
+      text-align: center;
+      background: #f9f9f9;
+      border-bottom: 1px solid #ebebeb;
+
+      &:last-child {
+        border-bottom: 0;
+      }
+    }
+  }
+
+  &__wrapper {
+    flex: 1;
+  }
+
+  &__day {
+    display: flex;
+
+    &:last-child .mc-period-select__item {
+      border-bottom: 0;
+    }
+  }
+
+  &__item {
+    position: relative;
+    flex: 1;
+    height: 52px;
+    background: #f9f9f9;
+    border-right: 1px solid #ebebeb;
+    border-bottom: 1px solid #ebebeb;
+
+    &__mask {
+      position: absolute;
+      top: 0;
+      right: 0;
+      bottom: 0;
+      left: 0;
+      display: none;
+      background: #91caff;
+      opacity: 0.5;
+    }
+
+    &:last-child {
+      border-right: 0;
+    }
+
+    &.mc-period-select__item--selected {
+      background: #325cf7;
+    }
+
+    &.mc-period-select__item--active .mc-period-select__item__mask {
+      display: block;
+    }
+  }
+
+  &__footer {
+    padding: 24px;
+    border-top: 1px solid #ebebeb;
+  }
+
+  &__action-bar {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    color: rgba(0, 0, 0, 42.8%);
+  }
+
+  &__selected-item {
+    display: flex;
+    margin-top: 16px;
+    padding: 5px 8px;
+    color: rgba(0, 0, 0, 85%);
+    line-height: 22px;
+    background: #f5f5f5;
+    border-radius: 4px;
+
+    &__title {
+      flex-shrink: 0;
+      margin-right: 8px;
+    }
+
+    &__content {
+      flex: 1;
+      margin-right: 16px;
+    }
+
+    &__remove {
+      height: 22px;
+      margin-left: auto;
+      color: #8c8c8c;
+
+      &:hover {
+        color: #262626;
+        cursor: pointer;
+      }
+    }
+  }
+}
+
+.mc-period-select.mc-period-select--disabled {
+  position: relative;
+  user-select: none;
+  // pointer-events: none;
+}
+
+.mc-period-select.mc-period-select--disabled::before {
+  position: absolute;
+  display: block;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  z-index: 1000;
+  width: 100%;
+  height: 100%;
+  background: rgba(0, 0, 0, 4%);
+  cursor: not-allowed;
+  content: '';
+  // pointer-events: none;
+}

package/dist/esm/McPopoverButton/index.d.ts

@@ -0,0 +1,14 @@
+import { ButtonProps, PopconfirmProps } from 'antd';
+import React, { ReactNode } from 'react';
+type McPopoverButtonProps = Omit<PopconfirmProps, 'title'> & {
+    title?: string;
+    description?: string | ReactNode;
+    btnText?: string;
+    btnProps?: ButtonProps;
+    placement?: PopconfirmProps['placement'];
+    disabled?: boolean;
+    children?: ReactNode;
+    onConfirm: () => void;
+};
+declare const McPopoverButton: React.FC<McPopoverButtonProps>;
+export default McPopoverButton;

package/dist/esm/McPopoverButton/index.js

@@ -0,0 +1,52 @@
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["title", "description", "btnText", "btnProps", "children", "placement", "disabled", "onConfirm"];
+import { Button, Popconfirm } from 'antd';
+import { WarningFilled } from 'much-icons';
+import React from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
+var McPopoverButton = function McPopoverButton(_ref) {
+  var _ref$title = _ref.title,
+    title = _ref$title === void 0 ? '提示' : _ref$title,
+    _ref$description = _ref.description,
+    description = _ref$description === void 0 ? '删除后，将无法恢复，请谨慎！' : _ref$description,
+    _ref$btnText = _ref.btnText,
+    btnText = _ref$btnText === void 0 ? '删除' : _ref$btnText,
+    _ref$btnProps = _ref.btnProps,
+    btnProps = _ref$btnProps === void 0 ? {} : _ref$btnProps,
+    children = _ref.children,
+    _ref$placement = _ref.placement,
+    placement = _ref$placement === void 0 ? 'topRight' : _ref$placement,
+    _ref$disabled = _ref.disabled,
+    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+    onConfirm = _ref.onConfirm,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/_jsx(Popconfirm, _objectSpread(_objectSpread({
+    title: title,
+    icon: /*#__PURE__*/_jsx(WarningFilled, {
+      style: {
+        color: '#FF4D4F',
+        fontSize: 16,
+        marginRight: 4
+      }
+    }),
+    description: description,
+    okText: "\u5220\u9664",
+    cancelText: "\u53D6\u6D88",
+    placement: placement,
+    disabled: disabled,
+    onConfirm: onConfirm
+  }, rest), {}, {
+    children: children ? children : /*#__PURE__*/_jsx(Button, _objectSpread(_objectSpread({
+      type: "link",
+      danger: true,
+      disabled: disabled,
+      style: {
+        padding: 0
+      }
+    }, btnProps), {}, {
+      children: btnText
+    }))
+  }));
+};
+export default McPopoverButton;

package/dist/esm/McPopoverForm/index.d.ts

@@ -0,0 +1,14 @@
+import { FormProps, PopconfirmProps } from 'antd';
+import React, { ReactNode } from 'react';
+type McPopoverFormProps = Omit<PopconfirmProps, 'title' | 'description' | 'onConfirm'> & {
+    children?: ReactNode;
+    title?: string;
+    placement?: PopconfirmProps['placement'];
+    disabled?: boolean;
+    formProps?: FormProps;
+    formItem?: ReactNode;
+    formData?: Record<string, unknown>;
+    onConfirm: (values: Record<string, unknown>) => PromiseLike<any> | any;
+};
+declare const McPopoverForm: React.FC<McPopoverFormProps>;
+export default McPopoverForm;

package/dist/esm/McPopoverForm/index.js

@@ -0,0 +1,95 @@
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["children", "title", "placement", "disabled", "formItem", "formData", "formProps", "onConfirm"];
+import { Form, Popconfirm } from 'antd';
+import React, { useEffect, useRef, useState } from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
+var McPopoverForm = function McPopoverForm(_ref) {
+  var children = _ref.children,
+    title = _ref.title,
+    _ref$placement = _ref.placement,
+    placement = _ref$placement === void 0 ? 'rightTop' : _ref$placement,
+    _ref$disabled = _ref.disabled,
+    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+    formItem = _ref.formItem,
+    formData = _ref.formData,
+    formProps = _ref.formProps,
+    onConfirm = _ref.onConfirm,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  var _Form$useForm = Form.useForm(),
+    _Form$useForm2 = _slicedToArray(_Form$useForm, 1),
+    form = _Form$useForm2[0];
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    open = _useState2[0],
+    setOpen = _useState2[1];
+  var clickTypeRef = useRef('');
+  var handelConfirm = function handelConfirm() {
+    clickTypeRef.current = 'confirm';
+    form.validateFields().then(function (values) {
+      onConfirm(values);
+      setOpen(false);
+    });
+  };
+  var handelCancel = function handelCancel() {
+    clickTypeRef.current = 'confirm';
+    setOpen(false);
+  };
+  var handelOpenPageChange = function handelOpenPageChange(value, e) {
+    if (value) {
+      setOpen(true);
+    } else {
+      if (e) {
+        clickTypeRef.current = 'cancel';
+        if (clickTypeRef.current === 'comfirm') {
+          handelConfirm();
+        }
+      } else {
+        clickTypeRef.current = '';
+        setOpen(false);
+      }
+    }
+  };
+  useEffect(function () {
+    if (formData && open) {
+      var _form$setFieldsValue;
+      form === null || form === void 0 || (_form$setFieldsValue = form.setFieldsValue) === null || _form$setFieldsValue === void 0 || _form$setFieldsValue.call(form, formData);
+    }
+  }, [formData, open]);
+  return /*#__PURE__*/_jsx(Popconfirm, _objectSpread(_objectSpread({
+    title: /*#__PURE__*/_jsx("div", {
+      style: {
+        marginBottom: 8
+      },
+      children: title
+    }),
+    icon: false,
+    open: open,
+    onOpenChange: handelOpenPageChange,
+    description: /*#__PURE__*/_jsx("div", {
+      style: {
+        marginBottom: 8
+      },
+      children: /*#__PURE__*/_jsx(Form, _objectSpread(_objectSpread({
+        form: form,
+        autoComplete: "off"
+      }, formProps), {}, {
+        children: formItem
+      }))
+    }),
+    overlayInnerStyle: {
+      padding: 16
+    },
+    okText: "\u4FDD\u5B58",
+    cancelText: "\u53D6\u6D88",
+    placement: placement,
+    disabled: disabled,
+    destroyTooltipOnHide: true,
+    onCancel: handelCancel,
+    onConfirm: handelConfirm
+  }, rest), {}, {
+    children: children
+  }));
+};
+export default McPopoverForm;

package/dist/esm/McProSelect/index.d.ts

@@ -0,0 +1,35 @@
+import { FormItemProps } from 'antd/es/form/FormItem';
+import { McSelectProps, Option } from '../McSelect';
+type McProselectOptions<T> = (T & Partial<Pick<Option, 'title' | 'disabled'>> & {
+    extra?: T;
+})[] | undefined;
+type McProSelectProps<T = {
+    label: string;
+    value: string;
+}> = Omit<FormItemProps, 'required'> & {
+    multiple?: boolean;
+    /** 默认为keyword */
+    searchKey?: string;
+    /** 为string时表示未填写时的提示文案 */
+    required?: boolean | string;
+    disabled?: boolean;
+    excludeIds?: (string | number)[];
+    fieldNames?: {
+        label?: keyof T;
+        value?: keyof T;
+    };
+    fieldProps?: Omit<McSelectProps, 'multiple' | 'fetchOption' | 'toFilterOptions' | 'options'> & {
+        options: McProselectOptions<T>;
+    };
+    request?: (params: {
+        current: number;
+        pageSize: number;
+        [key: string]: number | string;
+    }) => Promise<{
+        records: T[];
+        total: number;
+        [key: string]: any;
+    }>;
+};
+declare const McProSelect: <T extends Record<string, any>>({ label, name, fieldNames, required, request, multiple, disabled, searchKey, excludeIds, fieldProps, ...restProps }: McProSelectProps<T>) => import("react/jsx-runtime").JSX.Element;
+export default McProSelect;