fan-standard-comp 3.1.4 → 3.1.6

package/lib/NavLeafScroll/index.js

@@ -0,0 +1,397 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+require("antd/es/badge/style");
+
+var _badge = _interopRequireDefault(require("antd/es/badge"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _index = _interopRequireDefault(require("../SpecIcon/index"));
+
+var _lodash = _interopRequireDefault(require("lodash"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+require("./style/index.less");
+
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
+
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
+
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
+
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+
+function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
+
+function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
+
+function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+var NavLeafScroll = /*#__PURE__*/function (_Component) {
+  _inherits(NavLeafScroll, _Component);
+
+  var _super = _createSuper(NavLeafScroll);
+
+  function NavLeafScroll(props) {
+    var _this;
+
+    _classCallCheck(this, NavLeafScroll);
+
+    _this = _super.call(this, props);
+
+    _defineProperty(_assertThisInitialized(_this), "initFloorValues", function () {
+      var _this$props = _this.props,
+          baseItemHeight = _this$props.baseItemHeight,
+          activeKey = _this$props.activeKey,
+          navList = _this$props.navList,
+          _this$props$optionNam = _this$props.optionName,
+          optionName = _this$props$optionNam === void 0 ? {
+        key: 'id',
+        title: 'title',
+        count: 'count'
+      } : _this$props$optionNam; // 元素个数占用的高度是否不超过内容区域
+
+      var isInsideEnough = navList.length * baseItemHeight <= _this.mainWrap.current.clientHeight;
+      var wrapHeight = _this.mainWrap.current.clientHeight - (isInsideEnough ? 0 : 32 * 2); // 每次需要移动的偏移量 32是上下切换角占用的高度
+
+      var floorHeight = _this.leafNav.current.clientHeight; // 所有楼层占用的高度
+
+      var isEnough = wrapHeight % baseItemHeight === 0; // 剩余的是否足够容纳一个单元格
+      // 判断有效区域与单元格高度：若小于，则直接使用单元格高度，否则将内容区高度去除不足一个单元格高度
+
+      if (_this.mainWrap.current.clientHeight - (isInsideEnough ? 0 : 32 * 2) >= baseItemHeight) {
+        wrapHeight -= wrapHeight % baseItemHeight; // 判断是否除不尽,如果还有余数，则当前 区域有效区域要去除一个单元格的高度
+      } else {
+        wrapHeight = baseItemHeight;
+      }
+
+      var stepSize = wrapHeight / baseItemHeight; // - (isEnough ? 0 : 1) // 当前一页可容纳的单元格数量
+
+      _this.setState({
+        floorRelatedSize: {
+          wrapHeight: wrapHeight,
+          // 有效内容区域的
+          floorHeight: floorHeight // 楼层列表占用的高度
+
+        },
+        stepSize: stepSize,
+        showArrow: floorHeight > wrapHeight
+      });
+
+      if (activeKey && navList.length > 0) {
+        var matchIndex = _lodash.default.findIndex(navList, function (item) {
+          return item[(optionName === null || optionName === void 0 ? void 0 : optionName.key) || 'id'] === activeKey;
+        });
+
+        var stepNo = wrapHeight === 0 ? 0 : Math.floor(matchIndex / (wrapHeight / baseItemHeight)); // 当前所在的切换页数，从0开始
+
+        var stepTotalSize = Math.ceil(navList.length / stepSize) || 0; // 当前所有单元格占用的页总数
+
+        _this.setState({
+          leafNavScrollY: matchIndex !== -1 && stepNo !== 0 ? -wrapHeight * stepNo : 0,
+          // 如果当前默认传值有楼层节点，则需要判断其所在的位置
+          arrowPermit: {
+            prev: matchIndex !== -1 && stepNo !== 0,
+            next: floorHeight > wrapHeight && stepNo + 1 !== stepTotalSize
+          }
+        });
+      } else {
+        _this.setState({
+          leafNavScrollY: 0,
+          arrowPermit: {
+            prev: false,
+            next: floorHeight > wrapHeight
+          }
+        });
+      }
+    });
+
+    _defineProperty(_assertThisInitialized(_this), "handleLeafControl", function (type) {
+      var _this$state = _this.state,
+          floorRelatedSize = _this$state.floorRelatedSize,
+          leafNavScrollY = _this$state.leafNavScrollY;
+      var wrapHeight = floorRelatedSize.wrapHeight,
+          floorHeight = floorRelatedSize.floorHeight;
+      var maxNextPosition = -(wrapHeight * (Math.ceil(floorHeight / wrapHeight) - 1)); // 向下滚动的最大值
+
+      var scrollY = type === 'next' ? leafNavScrollY - wrapHeight : leafNavScrollY + wrapHeight;
+
+      _this.setState({
+        arrowPermit: {
+          prev: type === 'prev' ? scrollY !== 0 : true,
+          next: type === 'prev' ? true : scrollY !== maxNextPosition // 滚动大小与最大滚动值一致时，向下滚动禁用,
+
+        },
+        leafNavScrollY: scrollY
+      });
+    });
+
+    _defineProperty(_assertThisInitialized(_this), "handleItemControl", function (key, data) {
+      var onClick = _this.props.onClick;
+      onClick && onClick(key, data);
+    });
+
+    _defineProperty(_assertThisInitialized(_this), "mouseEnter", function (e) {
+      var onMouseEnter = _this.props.onMouseEnter;
+
+      _this.setState({
+        isMouseEnter: true
+      });
+
+      onMouseEnter && onMouseEnter(e);
+    });
+
+    _defineProperty(_assertThisInitialized(_this), "mouseLeave", function (e) {
+      var onMouseLeave = _this.props.onMouseLeave;
+
+      _this.setState({
+        isMouseEnter: false
+      });
+
+      onMouseLeave && onMouseLeave(e);
+    });
+
+    _defineProperty(_assertThisInitialized(_this), "mouseWheel", function (e) {
+      var _this$state2 = _this.state,
+          isMouseEnter = _this$state2.isMouseEnter,
+          arrowPermit = _this$state2.arrowPermit;
+      if (!isMouseEnter) return; // 鼠标没有经过内容区域，则不会滚轮监听
+
+      e.preventDefault();
+
+      if (e.deltaY <= 0) {
+        arrowPermit.prev && _this.handleLeafControl('prev'); // 向上滚动
+      } else {
+        arrowPermit.next && _this.handleLeafControl('next'); // 向下滚动
+      } // onWheel && onWheel(e)
+
+    });
+
+    _this.state = {
+      isMouseEnter: false,
+      leafNavScrollY: 0,
+      showArrow: false,
+      arrowPermit: {
+        prev: false,
+        next: false
+      },
+      floorRelatedSize: {
+        wrapHeight: 0,
+        // 有效内容区域的
+        floorHeight: 0 // 楼层列表占用的高度
+
+      },
+      stepSize: 0 // 当前一页可容纳的单元格数量
+
+    };
+    _this.mainWrap = /*#__PURE__*/_react.default.createRef();
+    _this.leafWrap = /*#__PURE__*/_react.default.createRef();
+    _this.leafNav = /*#__PURE__*/_react.default.createRef();
+    _this.initFloorValues = _this.initFloorValues.bind(_assertThisInitialized(_this));
+    return _this;
+  }
+
+  _createClass(NavLeafScroll, [{
+    key: "componentDidMount",
+    value: function componentDidMount() {
+      var forbidScroll = this.props.forbidScroll;
+      window.addEventListener('resize', this.initFloorValues);
+
+      if (!forbidScroll) {
+        // 禁用时，不启动滚动监听
+        this.mainWrap.current.addEventListener('wheel', this.mouseWheel, {
+          passive: false
+        });
+      }
+
+      this.initFloorValues();
+    }
+  }, {
+    key: "componentWillUnmount",
+    value: function componentWillUnmount() {
+      var forbidScroll = this.props.forbidScroll;
+      window.removeEventListener('resize', this.initFloorValues);
+
+      if (!forbidScroll) {
+        // 禁用时，不启动滚动监听
+        this.mainWrap.current.addEventListener('wheel', this.mouseWheel, {
+          passive: false
+        });
+      }
+
+      this.mainWrap.current.removeEventListener('wheel', this.mouseWheel);
+    }
+  }, {
+    key: "componentDidUpdate",
+    value: function componentDidUpdate(prevProps) {
+      var _this$props2 = this.props,
+          baseItemHeight = _this$props2.baseItemHeight,
+          navList = _this$props2.navList,
+          activeKey = _this$props2.activeKey,
+          _this$props2$optionNa = _this$props2.optionName,
+          optionName = _this$props2$optionNa === void 0 ? {
+        key: 'id',
+        title: 'title',
+        count: 'count'
+      } : _this$props2$optionNa,
+          forbidScroll = _this$props2.forbidScroll;
+      var _this$state3 = this.state,
+          _this$state3$floorRel = _this$state3.floorRelatedSize,
+          wrapHeight = _this$state3$floorRel.wrapHeight,
+          floorHeight = _this$state3$floorRel.floorHeight,
+          stepSize = _this$state3.stepSize;
+
+      if (JSON.stringify(navList) !== JSON.stringify(prevProps.navList) || baseItemHeight !== prevProps.baseItemHeight) {
+        this.initFloorValues();
+      }
+
+      if (forbidScroll !== prevProps.forbidScroll) {
+        // 禁用时，不启动滚动监听
+        if (!forbidScroll) {
+          // 禁用时，不启动滚动监听
+          this.mainWrap.current.addEventListener('wheel', this.mouseWheel, {
+            passive: false
+          });
+        } else {
+          this.mainWrap.current.removeEventListener('wheel', this.mouseWheel);
+        }
+      }
+
+      if (activeKey !== prevProps.activeKey) {
+        var matchIndex = _lodash.default.findIndex(navList, function (item) {
+          return item[optionName.key] === activeKey;
+        });
+
+        var stepNo = Math.floor(matchIndex / (wrapHeight / baseItemHeight)); // 当前所在的切换页数，从0开始
+
+        var stepTotalSize = Array.isArray(navList) && Math.ceil(navList.length / stepSize) || 0; // 当前所有单元格占用的页总数
+
+        this.setState({
+          leafNavScrollY: matchIndex !== -1 && stepNo !== 0 ? -wrapHeight * stepNo : 0,
+          // 如果当前默认传值有楼层节点，则需要判断其所在的位置
+          arrowPermit: {
+            prev: matchIndex !== -1 && stepNo !== 0,
+            next: floorHeight > wrapHeight && stepNo + 1 !== stepTotalSize
+          },
+          isMouseEnter: true
+        });
+      }
+    } // 初始化楼层相关的值，如：是否允许触发滚动,默认滚动区间高度等
+
+  }, {
+    key: "render",
+    value: function render() {
+      var _this2 = this;
+
+      var _this$props3 = this.props,
+          className = _this$props3.className,
+          width = _this$props3.width,
+          activeKey = _this$props3.activeKey,
+          customLeafNode = _this$props3.customLeafNode,
+          noArrowPadding = _this$props3.noArrowPadding,
+          navList = _this$props3.navList,
+          _this$props3$optionNa = _this$props3.optionName,
+          optionName = _this$props3$optionNa === void 0 ? {
+        key: 'id',
+        title: 'title',
+        count: 'count'
+      } : _this$props3$optionNa,
+          _this$props3$emptyNod = _this$props3.emptyNode,
+          emptyNode = _this$props3$emptyNod === void 0 ? null : _this$props3$emptyNod;
+      var _this$state4 = this.state,
+          showArrow = _this$state4.showArrow,
+          arrowPermit = _this$state4.arrowPermit,
+          leafNavScrollY = _this$state4.leafNavScrollY;
+      return /*#__PURE__*/_react.default.createElement("div", {
+        className: (0, _classnames.default)(className, "nav-leaf"),
+        style: width ? {
+          width: "".concat(width, "px")
+        } : {},
+        ref: this.mainWrap // onWheel={this.mouseWheel}
+        ,
+        onMouseEnter: this.mouseEnter,
+        onMouseLeave: this.mouseLeave
+      }, /*#__PURE__*/_react.default.createElement("div", {
+        className: "nav-leaf-container nav-leaf-container-scroll",
+        style: !showArrow || noArrowPadding ? {
+          padding: 0
+        } : {},
+        "data-prev": showArrow
+      }, /*#__PURE__*/_react.default.createElement("span", {
+        className: (0, _classnames.default)("nav-leaf-arrow nav-leaf-btn-prev", showArrow ? '' : 'is-hide', arrowPermit.prev ? '' : 'is-disabled'),
+        onClick: function onClick() {
+          return arrowPermit.prev ? _this2.handleLeafControl('prev') : '';
+        }
+      }, /*#__PURE__*/_react.default.createElement(_index.default, {
+        name: "caret-up"
+      })), /*#__PURE__*/_react.default.createElement("span", {
+        className: (0, _classnames.default)("nav-leaf-arrow nav-leaf-btn-next", showArrow ? '' : 'is-hide', arrowPermit.next ? '' : 'is-disabled'),
+        onClick: function onClick() {
+          return arrowPermit.next ? _this2.handleLeafControl('next') : '';
+        }
+      }, /*#__PURE__*/_react.default.createElement(_index.default, {
+        name: "caret-down"
+      })), /*#__PURE__*/_react.default.createElement("div", {
+        className: "nav-leaf-wrap",
+        ref: this.leafWrap
+      }, /*#__PURE__*/_react.default.createElement("div", {
+        className: "nav-leaf-scroll"
+      }, /*#__PURE__*/_react.default.createElement("div", {
+        className: "nav-leaf-nav",
+        ref: this.leafNav,
+        style: {
+          transform: "translate3d(0px, ".concat(leafNavScrollY, "px, 0px)")
+        }
+      }, navList && navList.length > 0 ? navList.map(function (item, i) {
+        var _this2$props;
+
+        return /*#__PURE__*/_react.default.createElement("div", {
+          key: item[optionName.key],
+          className: (0, _classnames.default)('nav-leaf-item', activeKey && activeKey === item[optionName.key] ? 'is-active' : ''),
+          style: {
+            height: "".concat(((_this2$props = _this2.props) === null || _this2$props === void 0 ? void 0 : _this2$props.baseItemHeight) || 40, "px")
+          },
+          onClick: function onClick() {
+            return _this2.handleItemControl(item[optionName.key], item);
+          }
+        }, customLeafNode ? customLeafNode(item) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, item[optionName.title] && /*#__PURE__*/_react.default.createElement("span", {
+          className: "leaf-title"
+        }, "".concat(item[optionName.title]), " "), item[optionName.count] ? /*#__PURE__*/_react.default.createElement("span", {
+          className: "leaf-extra"
+        }, " ", /*#__PURE__*/_react.default.createElement(_index.default, {
+          name: "warn-fill"
+        }), /*#__PURE__*/_react.default.createElement(_badge.default, {
+          className: "warning-count",
+          count: item[optionName.count]
+        })) : null));
+      }) : emptyNode)))));
+    }
+  }]);
+
+  return NavLeafScroll;
+}(_react.Component);
+
+var _default = NavLeafScroll;
+exports.default = _default;

package/lib/NavLeafScroll/style/index.less

@@ -0,0 +1,119 @@
+@root-entry-name: default;
+@import (reference) '~antd/es/style/themes/index';
+
+.nav-leaf {
+  width: 110px;
+  height:  100%;
+  //.nav-leaf-container {
+  //  height: ~'calc(100vh - @{nav-header-height})';
+  //}
+
+  .nav-leaf-container {
+    position: relative;
+    box-sizing: border-box;
+    width: 100%;
+    height: 100%;
+    //height: calc(100% - 32px);
+    margin-bottom: -1px;
+    font-size: 16px;
+    overflow: hidden;
+    line-height: 1.6;
+    white-space: nowrap;
+    //transition: padding 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+    zoom: 1;
+    &.nav-leaf-container-scroll {
+      padding: 32px 0;
+      overflow: hidden;
+      white-space: nowrap;
+    }
+  }
+  .nav-leaf-wrap {
+    height: 100%;
+    overflow: hidden;
+  }
+  .nav-leaf-nav {
+    position: relative;
+    display: inline-block;
+    box-sizing: border-box;
+    width: 100%;
+    margin: 0;
+    padding-left: 0;
+    //transition: transform 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+  }
+  .nav-leaf-arrow {
+    position: absolute;
+    left: 0;
+    width: 100%;
+    height: 32px;
+    color: @text-color;
+    text-align: center;
+    cursor: pointer;
+    &:hover {
+      color: @primary-color;
+    }
+    &.is-hide {
+      display: none;
+    }
+    &.is-disabled {
+      color: fade(@primary-color, 30%) !important;
+      cursor: not-allowed !important;
+    }
+    &.nav-leaf-btn-prev {
+      top: 0;
+    }
+    &.nav-leaf-btn-next {
+      bottom: 0;
+    }
+  }
+  .nav-leaf-item {
+    height: 40px;
+    padding: 5px 10px 5px 10px;
+    color: @text-color-secondary;
+    line-height: 30px;
+    border-top-left-radius: 20px;
+    border-bottom-left-radius: 20px;
+    cursor: pointer;
+    &:hover {
+      color: @primary-color;
+    }
+    &.is-active {
+      color: @primary-color;
+      background: @background-color-base;
+      border-color: @primary-color;
+    }
+    .leaf-title {
+      display: inline-block;
+      min-width: 30px;
+    }
+    .leaf-extra {
+      position: relative;
+      display: inline-block;
+      width: 18px;
+      margin-left: 4px;
+      color: @error-color;
+      text-align: center;
+      i {
+        color: @error-color;
+      }
+      .warning-count {
+        position: absolute;
+        top: -1px;
+        left: 20px;
+        .ant-badge-multiple-words {
+          box-shadow: 0 1px 4px fade(@primary-color, 45%)
+        }
+      }
+    }
+  }
+  .nav-leaf-empty {
+    position: absolute;
+    top: -25px;
+    left: -10px;
+    width: 100%;
+  }
+}
+.themeTech {
+  .nav-leaf .nav-leaf-item.is-active {
+    background: #10343A;
+  }
+}

package/lib/RefactorTree/data.d.ts

@@ -0,0 +1,7 @@
+import PropTypes from 'prop-types';
+export interface RefactorTree {
+  treeData: PropTypes.ReactNodeArray,
+  rootName: String; // 是否指定名称显示一个根节点
+  rootKey: String; //
+  emptyDescription: String;
+}

package/lib/RefactorTree/index.d.ts

@@ -0,0 +1,40 @@
+import React from 'react';
+import { TreeProps } from 'antd/es/tree';
+import './style/index.less';
+interface selectDataProps {
+    currentData?: object;
+    multiData?: object[];
+}
+interface optionNameProps {
+    key?: string;
+    value?: string;
+    title?: string;
+    children?: string;
+    disabled?: string;
+    selectable?: string;
+}
+interface RefactorTreeProps extends TreeProps {
+    treeData: any[];
+    rootName?: string;
+    rootKey?: string;
+    emptyDescription?: string;
+    optionName?: optionNameProps;
+    defaultSelectedKeys?: string[];
+    onSelect?: (selectedKeys: string[], selectData: selectDataProps, e: any) => void;
+    onCheck?: (checkedKeys: string[] | {
+        checked: string[];
+        halfChecked: string[];
+    }, selectData: selectDataProps, e: any) => void;
+    nodeExtra?: (data?: object) => React.ReactNode;
+    selectable?: boolean;
+    checkStrictly?: boolean;
+    limitKey?: string;
+    checkedKeys?: any;
+    nodeControl?: any;
+    disabledFields?: {
+        key: string;
+        value: any;
+    }[];
+}
+declare const RefactorTree: (props: RefactorTreeProps) => JSX.Element;
+export default RefactorTree;