linkmore-design 1.0.71 → 1.0.74

package/es/Approval/index.d.ts

@@ -2,3 +2,4 @@ import React from 'react';
 import { IApprovalProps } from './type';
 declare const LMApproval: React.FC<IApprovalProps>;
 export default LMApproval;
+export type { ApprovalType, StatusType, IApprovalItemProps, IApprovalProps } from './type';

package/es/CardTable/table/TableContainer.js

@@ -27,21 +27,20 @@ var LmCardTableContainer = /*#__PURE__*/_react.default.memo(function (_ref) {
       type = table.type;
   var tableContainerRef = (0, _react.useRef)(null); // 行数据计算
 
-  var getRows = function getRows(columnCount) {
+  var getRows = (0, _react.useCallback)(function (columnCount) {
     var arr = [];
     var len = Math.ceil(dataSource.length / columnCount);
 
-    for (var i = 0; i < len; i++) {
+    for (var i = 0; i < len; i += 1) {
       var startIndex = columnCount * i;
       var items = dataSource.slice(startIndex, startIndex + columnCount);
       arr.push(items);
     }
 
     return arr;
-  }; // 获取容器盒子高宽
+  }, [dataSource]); // 获取容器盒子高宽
 
-
-  var getResize = function getResize() {
+  var getResize = (0, _react.useCallback)(function () {
     var _ref2 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
         blockSize = _ref2.blockSize,
         inlineSize = _ref2.inlineSize;
@@ -68,8 +67,7 @@ var LmCardTableContainer = /*#__PURE__*/_react.default.memo(function (_ref) {
       type: 'changeRows',
       rows: rows
     });
-  }; // 获取表格高度
-
+  }, [getRows]); // 获取表格高度
 
   useIsomorphicLayoutEffect(function () {
     // 频繁变动可考虑增加防抖
@@ -86,7 +84,7 @@ var LmCardTableContainer = /*#__PURE__*/_react.default.memo(function (_ref) {
     return function () {
       return resizeObserver.disconnect();
     };
-  }, [type]);
+  }, [type, getResize]);
   return /*#__PURE__*/_react.default.createElement("div", {
     ref: tableContainerRef,
     className: "lm_card_table_container"

package/es/ConfigProvider/index.js

@@ -0,0 +1,15 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+require("antd/es/config-provider/style");
+
+var _configProvider = _interopRequireDefault(require("antd/es/config-provider"));
+
+var _default = _configProvider.default;
+exports.default = _default;

package/es/ConfigProvider/style/index.css

@@ -0,0 +1,141 @@
+.lm-radio {
+  font-size: 12px;
+  line-height: 20px;
+  color: var(--font-color);
+}
+.lm-radio > span:last-child {
+  padding: 0;
+  margin: 0 8px;
+  max-width: 96px;
+  overflow: hidden;
+  white-space: nowrap;
+}
+.lm-radio .ant-radio .ant-radio-inner {
+  border-color: var(--stroke-color);
+}
+.lm-radio .ant-radio:hover .ant-radio-inner {
+  border-color: var(--primary-color);
+}
+.lm-radio .ant-radio-disabled.ant-radio-checked .ant-radio-inner:after {
+  background-color: var(--tip-text-color);
+}
+.lm-radio .ant-radio-disabled .ant-radio-inner {
+  background-color: var(--background-color);
+  border-color: var(--stroke-color) !important;
+}
+.lm-radio .ant-radio-disabled + span {
+  color: var(--disabled-font-color);
+}
+.lm-radio-group .ant-radio-button-wrapper {
+  font-size: 12px;
+  height: 32px;
+  padding: 0px 12px;
+  color: var(--font-color);
+  vertical-align: middle;
+}
+.lm-radio-group .ant-radio-button-wrapper .anticon {
+  font-size: 16px;
+  vertical-align: middle;
+  line-height: 1;
+}
+.lm-radio-group .ant-radio-button-wrapper:hover {
+  color: var(--primary-color);
+}
+.lm-radio-group .ant-radio-button-wrapper > span:last-child {
+  display: inline-block;
+  font-size: 12px;
+  max-width: 96px;
+  overflow: hidden;
+  white-space: nowrap;
+}
+.lm-radio-group .ant-radio-button-wrapper-checked:not([class*=' ant-radio-button-wrapper-disabled']) .ant-radio-button-wrapper:first-child {
+  border-right-color: var(--primary-hover-color);
+}
+.lm-radio-group .ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled) {
+  color: var(--primary-color);
+  border-color: var(--primary-color);
+}
+.lm-radio-group .ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled):first-child {
+  border-color: var(--primary-color);
+}
+.lm-radio-group .ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled):hover {
+  color: var(--primary-hover-color);
+  border-color: var(--primary-hover-color);
+}
+.lm-radio-group.ant-radio-group-large .ant-radio-button-wrapper {
+  line-height: 38px;
+  height: 40px;
+}
+.lm-radio-group.ant-radio-group-large .ant-radio-button-wrapper > span:last-child {
+  line-height: 38px;
+}
+.lm-radio-group.ant-radio-group-small .ant-radio-button-wrapper {
+  line-height: 22px;
+  height: 24px;
+  padding: 0px 8px;
+}
+.lm-radio-group.ant-radio-group-small .ant-radio-button-wrapper > span:last-child {
+  line-height: 22px;
+}
+.lm-radio-group .ant-radio-wrapper {
+  font-size: 12px;
+  line-height: 20px;
+  color: var(--font-color);
+}
+.lm-radio-group .ant-radio-wrapper > span:last-child {
+  padding: 0;
+  margin: 0 8px;
+  max-width: 96px;
+  overflow: hidden;
+  white-space: nowrap;
+}
+.lm-radio-group .ant-radio-wrapper .ant-radio .ant-radio-inner {
+  border-color: var(--stroke-color);
+}
+.lm-radio-group .ant-radio-wrapper .ant-radio:hover .ant-radio-inner {
+  border-color: var(--primary-color);
+}
+.lm-radio-group .ant-radio-wrapper .ant-radio-disabled.ant-radio-checked .ant-radio-inner:after {
+  background-color: var(--tip-text-color);
+}
+.lm-radio-group .ant-radio-wrapper .ant-radio-disabled .ant-radio-inner {
+  background-color: var(--background-color);
+  border-color: var(--stroke-color) !important;
+}
+.lm-radio-group .ant-radio-wrapper .ant-radio-disabled + span {
+  color: var(--disabled-font-color);
+}
+.lm-radio-group .ant-radio-button-wrapper-disabled {
+  color: var(--disabled-font-color);
+  background-color: var(--disabled-bg-color);
+  border-color: var(--stroke-color);
+}
+.lm-radio-group .ant-radio-button-wrapper-disabled.ant-radio-button-wrapper-checked {
+  color: #b8b8b8 !important;
+  background-color: var(--background-color-hover);
+  border-color: var(--stroke-color);
+}
+.lm-radio-group .ant-radio-button-wrapper-disabled:hover {
+  color: var(--disabled-font-color);
+}
+.lm-radio-group.lm-radio-group-row {
+  display: flex;
+  flex-direction: row;
+}
+.lm-radio-group.lm-radio-group-column {
+  display: flex;
+  flex-direction: column;
+}
+.lm-radio-group.lm-radio-group-column .lm-radio {
+  margin-bottom: 12px;
+}
+.lm-radio-group.lm-radio-group-column .lm-radio > span:last-child {
+  max-width: 216px;
+  overflow: hidden;
+  white-space: nowrap;
+  padding: 0;
+  margin: 0 8px;
+}
+.lm-radio-group.lm-radio-group-column .lm-radio:last-child {
+  margin-bottom: 0;
+}

package/es/ConfigProvider/style/index.js

@@ -0,0 +1,3 @@
+"use strict";
+
+require("./index.css");

package/es/ImageViewer/LmImageViewer.js

@@ -18,9 +18,18 @@ var LmImageViewer = function LmImageViewer(_a, ref) {
   var resetProps = __rest(_a, []);
 
   var defaultRef = useRef(null);
+  var defaultConfig = Object.assign({
+    visible: null,
+    urlList: [],
+    zIndex: 2001,
+    initialIndex: 0,
+    infinite: false,
+    hideOnClickModal: true,
+    close: function close() {}
+  }, resetProps);
   return /*#__PURE__*/React.createElement(LmImageViewerRoot, Object.assign({
     ref: ref || defaultRef
-  }, resetProps));
+  }, defaultConfig));
 };
 
 export default /*#__PURE__*/forwardRef(LmImageViewer);

package/es/ImageViewer/components/Arrows.d.ts

@@ -0,0 +1,4 @@
+declare const Arrows: ({ instance }: {
+    instance: any;
+}) => JSX.Element;
+export default Arrows;

package/es/ImageViewer/components/Arrows.js

@@ -0,0 +1,38 @@
+import React from 'react';
+import { IconFont } from 'linkmore-design';
+
+var Arrows = function Arrows(_ref) {
+  var instance = _ref.instance;
+  var slickNext = instance.slickNext,
+      slickPrev = instance.slickPrev;
+
+  var handlePreNext = function handlePreNext(e, type) {
+    e.stopPropagation();
+
+    if (type === 'next') {
+      slickNext();
+    }
+
+    if (type === 'prev') {
+      slickPrev();
+    }
+  };
+
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+    className: "arrow arrow_left",
+    onClick: function onClick(e) {
+      return handlePreNext(e, 'prev');
+    }
+  }, /*#__PURE__*/React.createElement(IconFont, {
+    type: "lmweb-left"
+  })), /*#__PURE__*/React.createElement("div", {
+    className: "arrow arrow_right",
+    onClick: function onClick(e) {
+      return handlePreNext(e, 'next');
+    }
+  }, /*#__PURE__*/React.createElement(IconFont, {
+    type: "lmweb-right"
+  })));
+};
+
+export default Arrows;

package/es/ImageViewer/components/Carousel.d.ts

@@ -0,0 +1,4 @@
+declare const BigImg: ({ instance }: {
+    instance: any;
+}) => JSX.Element;
+export default BigImg;

package/es/ImageViewer/components/Carousel.js

@@ -0,0 +1,71 @@
+import React, { useMemo, useCallback } from 'react';
+import { Carousel } from 'linkmore-design';
+
+var ListItem = function ListItem(_ref) {
+  var key = _ref.key,
+      index = _ref.index,
+      item = _ref.item,
+      instance = _ref.instance;
+  var state = instance.state;
+  var transformProps = useMemo(function () {
+    if (index !== state.currentIndex) return {};
+    var _state$transform = state.transform,
+        scale = _state$transform.scale,
+        rotateZ = _state$transform.rotateZ;
+    return {
+      transform: "scale(".concat(scale, ") rotateZ(").concat(rotateZ, "deg)")
+    };
+  }, [state.currentIndex, state.transform]);
+  return /*#__PURE__*/React.createElement("div", {
+    className: "preview_item",
+    key: key
+  }, /*#__PURE__*/React.createElement("img", {
+    src: item,
+    alt: "",
+    style: transformProps
+  }));
+};
+
+var BigImg = function BigImg(_ref2) {
+  var instance = _ref2.instance;
+  var urlList = instance.urlList,
+      previewRef = instance.previewRef,
+      infinite = instance.infinite,
+      setTransform = instance.setTransform,
+      afterChange = instance.afterChange;
+  var onWheel = useCallback(function (e) {
+    // e?.preventDefault()
+    // e.stopPropagation()
+    if ((e === null || e === void 0 ? void 0 : e.deltaY) <= 0) {
+      setTransform('zoomIn');
+    } else {
+      setTransform('zoomOut');
+    }
+  }, [setTransform]);
+  var config = {
+    dots: false,
+    infinite: infinite,
+    // lazyLoad: true, // 懒加载
+    adaptiveHeight: false,
+    afterChange: afterChange // customPaging: (i) => <img src={urlList[i]} alt="" />,
+
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    className: "preview_list",
+    onClick: function onClick(e) {
+      return e.stopPropagation();
+    },
+    onWheel: onWheel
+  }, /*#__PURE__*/React.createElement(Carousel, Object.assign({
+    ref: previewRef
+  }, config), urlList.map(function (v, idx) {
+    return /*#__PURE__*/React.createElement(ListItem, {
+      key: idx || v,
+      index: idx,
+      item: v,
+      instance: instance
+    });
+  })));
+};
+
+export default BigImg;

package/es/ImageViewer/components/Operate.d.ts

@@ -0,0 +1,4 @@
+declare const Operate: ({ instance }: {
+    instance: any;
+}) => JSX.Element;
+export default Operate;

package/es/ImageViewer/components/Operate.js

@@ -0,0 +1,40 @@
+import React from 'react';
+import { IconFont } from 'linkmore-design';
+
+var Operate = function Operate(_ref) {
+  var instance = _ref.instance;
+  var setTransform = instance.setTransform;
+
+  var handleTranform = function handleTranform(e, type) {
+    setTransform(type);
+  };
+
+  return /*#__PURE__*/React.createElement("div", {
+    className: "image_viewer_action",
+    onClick: function onClick(e) {
+      return e.stopPropagation();
+    }
+  }, /*#__PURE__*/React.createElement(IconFont, {
+    type: "lmweb-zoomin",
+    onClick: function onClick(e) {
+      return handleTranform(e, 'zoomIn');
+    }
+  }), /*#__PURE__*/React.createElement(IconFont, {
+    type: "lmweb-a-icon_m_search1",
+    onClick: function onClick(e) {
+      return handleTranform(e, 'zoomOut');
+    }
+  }), /*#__PURE__*/React.createElement(IconFont, {
+    type: "lmweb-undo",
+    onClick: function onClick(e) {
+      return handleTranform(e, 'rotateLeft');
+    }
+  }), /*#__PURE__*/React.createElement(IconFont, {
+    type: "lmweb-redo",
+    onClick: function onClick(e) {
+      return handleTranform(e, 'rotateRight');
+    }
+  }));
+};
+
+export default Operate;

package/es/ImageViewer/components/Thumb.d.ts

@@ -0,0 +1,4 @@
+declare const Thumb: ({ instance }: {
+    instance: any;
+}) => JSX.Element;
+export default Thumb;

package/es/ImageViewer/components/Thumb.js

@@ -0,0 +1,37 @@
+import React, { useMemo } from 'react';
+import cn from 'classnames';
+
+var Thumb = function Thumb(_ref) {
+  var instance = _ref.instance;
+  var state = instance.state,
+      urlList = instance.urlList,
+      slickGoTo = instance.slickGoTo;
+  var activeIndex = useMemo(function () {
+    return state.currentIndex;
+  }, [state.currentIndex]);
+
+  var handleGoTo = function handleGoTo(e, number) {
+    e.preventDefault();
+    slickGoTo(number);
+  };
+
+  return /*#__PURE__*/React.createElement("div", {
+    className: "thumb_list",
+    onClick: function onClick(e) {
+      return e.stopPropagation();
+    }
+  }, urlList.map(function (v, idx) {
+    return /*#__PURE__*/React.createElement("div", {
+      className: cn('thumb_item', activeIndex === idx && 'active'),
+      key: idx || v,
+      onClick: function onClick(e) {
+        return handleGoTo(e, idx);
+      }
+    }, /*#__PURE__*/React.createElement("img", {
+      src: v,
+      alt: ""
+    }));
+  }));
+};
+
+export default Thumb;

package/es/ImageViewer/fns/index.d.ts

@@ -0,0 +1,20 @@
+declare const useCoreOptions: ({ state, dispatch, props, previewRef }: {
+    state: any;
+    dispatch: any;
+    props: any;
+    previewRef: any;
+}) => {
+    CoreMethods: {
+        getVisible: () => any;
+        onClose: () => void;
+        setTransform: (type: any) => void;
+        afterChange: (currentIndex: any) => void;
+        slickGoTo: (currentIndex: any) => void;
+        slickNext: () => void;
+        slickPrev: () => void;
+    };
+    RefMethods: {
+        getState: () => any;
+    };
+};
+export default useCoreOptions;

package/es/ImageViewer/fns/index.js

@@ -0,0 +1,100 @@
+import { useCallback } from 'react';
+
+var useCoreOptions = function useCoreOptions(_ref) {
+  var state = _ref.state,
+      dispatch = _ref.dispatch,
+      props = _ref.props,
+      previewRef = _ref.previewRef;
+  // 获取显示状态
+  var getVisible = useCallback(function () {
+    return typeof props.visible === 'boolean' ? props.visible : state.visible;
+  }, [props, state.visible]); // 关闭事件
+
+  var onClose = useCallback(function () {
+    var _a;
+
+    (_a = props.close) === null || _a === void 0 ? void 0 : _a.call(props);
+    dispatch({
+      type: 'init'
+    });
+    dispatch({
+      type: 'changeVisible',
+      visible: false
+    });
+  }, []);
+  var setTransform = useCallback(function (type) {
+    var scale = state.transform.scale * 100;
+    var rotateZ = state.transform.rotateZ;
+
+    switch (type) {
+      case 'zoomIn':
+        scale += 25;
+        break;
+
+      case 'zoomOut':
+        scale < 30 ? scale : scale -= 25;
+        break;
+
+      case 'rotateLeft':
+        rotateZ -= 90;
+        break;
+
+      case 'rotateRight':
+        rotateZ += 90;
+        break;
+
+      default:
+        break;
+    }
+
+    dispatch({
+      type: 'changeTransform',
+      transform: {
+        rotateZ: rotateZ,
+        scale: scale / 100
+      }
+    });
+  }, [state.transform]); // 切换轮播后的回调
+
+  var afterChange = useCallback(function (currentIndex) {
+    console.log('currentIndex', currentIndex);
+    dispatch({
+      type: 'changeCurrent',
+      current: {
+        currentIndex: currentIndex
+      }
+    });
+  }, []); // 转到指定的轮播图, 直接跳转, 不展示动画
+
+  var slickGoTo = useCallback(function (currentIndex) {
+    previewRef.current.goTo(currentIndex, true);
+  }, []); // 转到下一张轮播图
+
+  var slickNext = useCallback(function () {
+    previewRef.current.next();
+  }, []); // 转到上一张轮播图
+
+  var slickPrev = useCallback(function () {
+    previewRef.current.prev();
+  }, []);
+  var CoreMethods = {
+    getVisible: getVisible,
+    onClose: onClose,
+    setTransform: setTransform,
+    afterChange: afterChange,
+    slickGoTo: slickGoTo,
+    slickNext: slickNext,
+    slickPrev: slickPrev
+  };
+  var RefMethods = {
+    getState: function getState() {
+      return state;
+    }
+  };
+  return {
+    CoreMethods: CoreMethods,
+    RefMethods: RefMethods
+  };
+};
+
+export default useCoreOptions;