@cloud-app-dev/vidc 2.0.0-alpha.11 → 2.0.0-alpha.12

package/.umirc.ts

@@ -2,7 +2,7 @@ import { defineConfig } from 'dumi';
 import path from 'path';
 
 const token =
-  'eyJhbGciOiJIUzI1NiJ9.eyJvcmdhbml6YXRpb25JZCI6IjEwMDEwMTAwMDQ0NiIsImV4dCI6MTYzODY4NzgyNzEwNywidWlkIjoiMTAxMDAwMDAwMjQ5IiwidmFsaWRTdGF0ZSI6MTA0NDA2LCJyb2xlSWQiOlsxMDAwMDAxMTAzODddLCJ2YWxpZFRpbWUiOm51bGwsIm9wdENlbnRlcklkIjoiMTAwMTAwMDAwMjMzIiwidXNlclR5cGUiOjEwMDcwMiwiaWF0IjoxNjM4NDI4NjI3MTA3fQ.eEvUc9_eGBdUi2QCMDNjOYgTzTKwiLX-7DEQ_O9kjhs';
+  'eyJhbGciOiJIUzI1NiJ9.eyJvcmdhbml6YXRpb25JZCI6IjEwMDEwMTAwMDQ0NiIsImV4dCI6MTY0MDQwOTc4NjQ3OCwidWlkIjoiMTAxMDAwMDAwMjQ5IiwidmFsaWRTdGF0ZSI6MTA0NDA2LCJyb2xlSWQiOlsxMDAwMDAxMTAzODddLCJ2YWxpZFRpbWUiOm51bGwsIm9wdENlbnRlcklkIjoiMTAwMTAwMDAwMjMzIiwidXNlclR5cGUiOjEwMDcwMiwiaWF0IjoxNjQwMTUwNTg2NDc4fQ.9a8me82dxS_DJ52Ac8eBu1Y2Gigs7mZ6Cm3Rd-tj5Vk';
 
 export default defineConfig({
   title: '云应用-业务组件库',

package/es/AppRedirect/index.js

@@ -1,6 +1,6 @@
 import React, { useEffect } from 'react';
 import { useLocation } from 'react-router-dom';
-import useHistory from '../useHistory';
+import useNavigate from '../useNavigate';
 import "./index.css";
 
 var getKey = function getKey() {
@@ -10,24 +10,20 @@ var getKey = function getKey() {
 function AppRedirect(_ref) {
   var path = _ref.path,
       to = _ref.to;
-  var history = useHistory();
+  var navigate = useNavigate();
   var location = useLocation();
   useEffect(function () {
     if (path === location.pathname) {
       if (typeof to !== 'string') {
-        history.replace(Object.assign(Object.assign({}, to), {
-          search: to.search ? "".concat(to.search, "&key=").concat(getKey()) : "?key=".concat(getKey()),
+        navigate("".concat(to.pathname).concat(to.search ? "".concat(to.search, "&key=").concat(getKey()) : "?key=".concat(getKey())), {
+          replace: true,
           state: Object.assign({}, to.state, {
             isReplace: true
           })
-        }));
+        });
       } else {
-        history.push({
-          pathname: to,
-          search: "?key".concat(getKey()),
-          state: {
-            isReplace: true
-          }
+        navigate("".concat(to, "?key").concat(getKey()), {
+          replace: true
         });
       }
     }

package/es/AppRoute/index.d.ts

@@ -1,14 +1,10 @@
 import React from 'react';
-import { match } from 'react-router-dom';
-import { IAppRouteType, IAppRouteProps } from './interface';
-import * as H from 'history';
-import './index.less';
-declare class AppRoute extends React.Component<IAppRouteProps, IAppRouteType> {
+import { IAppRouteProps } from './interface';
+declare class AppRoute extends React.PureComponent<IAppRouteProps, any> {
     private isRender;
     constructor(props: IAppRouteProps);
     shouldComponentUpdate(props: IAppRouteProps): boolean;
     componentWillUnmount(): void;
-    setRouteProps: (newMatch: match<any>, newLocation: H.Location<any>, history: H.History<any>) => void;
     render(): JSX.Element;
 }
 export default AppRoute;

package/es/AppRoute/index.js

@@ -1,8 +1,8 @@
 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); }
 
-import _logger from "@cloud-app-dev/utils/es/logger";
 import _cache from "@cloud-app-dev/utils/es/cache";
-import _isEqual from "@cloud-app-dev/utils/es/isEqual";
+import _useUnmount from "ahooks/es/useUnmount";
+import _useMount from "ahooks/es/useMount";
 
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 
@@ -25,13 +25,26 @@ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Re
 function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
 
 import React from 'react';
-import { RenderComponents, RenderRoutes, RenderSingleRoute } from './Render';
-import Rendered from './Rendered';
-import "./index.css";
+import { Route } from 'react-router-dom';
 var _global = window;
 
-var AppRoute = /*#__PURE__*/function (_React$Component) {
-  _inherits(AppRoute, _React$Component);
+function RenderSingleRoute(_ref) {
+  var onMount = _ref.onMount,
+      onUnmount = _ref.onUnmount;
+
+  _useMount(function () {
+    return onMount();
+  });
+
+  _useUnmount(function () {
+    return onUnmount();
+  });
+
+  return /*#__PURE__*/React.createElement(React.Fragment, null);
+}
+
+var AppRoute = /*#__PURE__*/function (_React$PureComponent) {
+  _inherits(AppRoute, _React$PureComponent);
 
   var _super = _createSuper(AppRoute);
 
@@ -40,24 +53,11 @@ var AppRoute = /*#__PURE__*/function (_React$Component) {
 
     _classCallCheck(this, AppRoute);
 
-    _this = _super.call(this, props);
-
-    _this.setRouteProps = function (newMatch, newLocation, history) {
-      if (!_isEqual(_this.props.match, newMatch)) {
-        _this.setState({
-          match: newMatch,
-          location: newLocation,
-          history: history
-        });
-      }
-    }; //可能存在路由创建但是没有render 导致UI无法渲染
-
+    _this = _super.call(this, props); //可能存在路由创建但是没有render 导致UI无法渲染
 
     _this.isRender = false;
     _this.state = {
-      match: undefined,
-      location: undefined,
-      history: undefined
+      isMatch: false
     };
     return _this;
   }
@@ -74,33 +74,42 @@ var AppRoute = /*#__PURE__*/function (_React$Component) {
   }, {
     key: "componentWillUnmount",
     value: function componentWillUnmount() {
-      _logger.debug('路由销毁');
+      console.debug('路由销毁');
     }
   }, {
     key: "render",
     value: function render() {
       var _this2 = this;
 
-      var _this$state = this.state,
-          match = _this$state.match,
-          location = _this$state.location;
-      var isRouteMath = match && location;
-      return /*#__PURE__*/React.createElement(React.Fragment, null, this.props.routes ? /*#__PURE__*/React.createElement(RenderRoutes, Object.assign({}, this.props, {
-        setRouteProps: this.setRouteProps
-      })) : /*#__PURE__*/React.createElement(RenderSingleRoute, Object.assign({}, this.props, {
-        setRouteProps: this.setRouteProps
-      })), isRouteMath && /*#__PURE__*/React.createElement(RenderComponents, {
-        state: this.state,
-        props: this.props
-      }), isRouteMath && /*#__PURE__*/React.createElement(Rendered, {
-        onRendered: function onRendered() {
+      var _this$props = this.props,
+          element = _this$props.element,
+          path = _this$props.path;
+      return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Route, {
+        path: path,
+        element: /*#__PURE__*/React.createElement(RenderSingleRoute, {
+          onMount: function onMount() {
+            return _this2.setState({
+              isMatch: true
+            });
+          },
+          onUnmount: function onUnmount() {
+            return _this2.setState({
+              isMatch: false
+            });
+          }
+        })
+      }), this.state.isMatch && element, /*#__PURE__*/React.createElement(RenderSingleRoute, {
+        onMount: function onMount() {
           return _this2.isRender = true;
+        },
+        onUnmount: function onUnmount() {
+          return _this2.isRender = false;
         }
       }));
     }
   }]);
 
   return AppRoute;
-}(React.Component);
+}(React.PureComponent);
 
 export default AppRoute;

package/es/AppRoute/interface.d.ts

@@ -1,18 +1,8 @@
 import * as H from 'history';
-import { RouteProps, match } from 'react-router-dom';
-
-export interface IAppRouteType {
-  match?: match<any>;
-  location?: H.Location | undefined;
-  history?: H.History;
-}
+import { RouteProps } from 'react-router-dom';
 
 export interface IAppRouteProps extends RouteProps, IAppRouteType {
   routes?: RouteProps[];
   tabId?: string;
   currentId?: string;
 }
-
-export interface IRenderRouteProps extends IAppRouteType {
-  setRouteProps: (match: match<any>, location: H.Location, history: H.History) => void;
-}

package/es/AutoExit/index.js

@@ -1,5 +1,6 @@
+import _useMount from "ahooks/es/useMount";
 import React, { useContext } from 'react';
-import useHistory from '../useHistory';
+import useNavigate from '../useNavigate';
 import AppContext from '../AppContext';
 
 function AutoExit(_ref) {
@@ -8,14 +9,13 @@ function AutoExit(_ref) {
   var _useContext = useContext(AppContext.Context),
       loginStatus = _useContext.loginStatus;
 
-  var history = useHistory();
+  var navigate = useNavigate();
 
-  if (!loginStatus) {
-    history.replace('/login');
-    return null;
-  }
+  _useMount(function () {
+    !loginStatus && navigate('/login');
+  });
 
-  return /*#__PURE__*/React.createElement(React.Fragment, null, children);
+  return /*#__PURE__*/React.createElement(React.Fragment, null, !loginStatus ? children : null);
 }
 
 export default AutoExit;

package/es/{ContentBox → Box}/index.d.ts

@@ -5,10 +5,10 @@ export interface ContentBoxProps {
     contentGrid?: any;
     children?: React.ReactNode;
 }
-declare function ContentBox({ className, contentGrid, children }: ContentBoxProps): JSX.Element;
-declare namespace ContentBox {
+declare function Box({ className, contentGrid, children }: ContentBoxProps): JSX.Element;
+declare namespace Box {
     var TwoColumnBox: typeof import("./TwoColumnBox").default;
     var InfoBox: typeof import("./InfoBox").default;
     var BetweenBox: typeof import("./BetweenBox").default;
 }
-export default ContentBox;
+export default Box;

package/es/{ContentBox → Box}/index.js

@@ -9,7 +9,7 @@ import defaultContentGrid from './deps/content-grid';
 import BetweenBox from './BetweenBox';
 import "./index.css";
 
-function ContentBox(_ref) {
+function Box(_ref) {
   var _ref$className = _ref.className,
       className = _ref$className === void 0 ? '' : _ref$className,
       _ref$contentGrid = _ref.contentGrid,
@@ -22,7 +22,7 @@ function ContentBox(_ref) {
   }, contentGrid), children));
 }
 
-ContentBox.TwoColumnBox = TwoColumnBox;
-ContentBox.InfoBox = InfoBox;
-ContentBox.BetweenBox = BetweenBox;
-export default ContentBox;
+Box.TwoColumnBox = TwoColumnBox;
+Box.InfoBox = InfoBox;
+Box.BetweenBox = BetweenBox;
+export default Box;

package/es/CheckGroupFixed/index.js

@@ -2,6 +2,7 @@ import "antd/lib/badge/style";
 import _Badge from "antd/lib/badge";
 import "antd/lib/checkbox/style";
 import _Checkbox from "antd/lib/checkbox";
+import _useUpdateEffect from "ahooks/es/useUpdateEffect";
 
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 
@@ -16,7 +17,6 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
 import React, { useLayoutEffect, useMemo, useRef, useState } from 'react';
-import useChangeEffect from '../useChangeEffect';
 import "./index.css";
 
 function CheckGroupFixed(_ref) {
@@ -72,9 +72,11 @@ function CheckGroupFixed(_ref) {
       boxShadow: ' 0 0 10px rgba(0,0,0,0.1)'
     } : {};
   }, [state.sider, state.w]);
-  useChangeEffect(function () {
+
+  _useUpdateEffect(function () {
     return onChange && onChange(state.selectKeys);
   }, [state.selectKeys]);
+
   useLayoutEffect(function () {
     var dom = domRef.current.querySelector('.check-box-group-layout');
     dom === null || dom === void 0 ? void 0 : dom.setAttribute('style', "grid-template-columns:repeat(auto-fill, minmax(".concat(checboxSize, "px, 1fr));"));

package/es/Config/interface.d.ts

@@ -21,6 +21,7 @@ export type FeatureItemType = {
   sort: number;
   children?: FeatureItemType[];
   parentId?: string;
+  level?: number;
 };
 
 export type BSConfigType = {
@@ -34,6 +35,7 @@ export type BSConfigType = {
   AppTimeOut: number;
   shortcut: string;
   download: { chrome: string; player: string };
+  [key: string]: any;
 };
 
 export type ThemeInfoType = {
@@ -44,7 +46,7 @@ export type ThemeInfoType = {
   };
 };
 
-export type ConfigKey = 'app' | 'feature' | 'pFeature' | 'bs';
+export type ConfigKey = 'app' | 'feature' | 'featureIds' | 'bs' | 'theme';
 
 export type ConfigJOSN = {
   app: { [key: string]: AppItemType };

package/es/DeviceSelect/TreeType.d.ts

@@ -0,0 +1,6 @@
+interface ITreeTypeProps {
+    mode: string;
+    onChange: (mode: string) => void;
+}
+declare function TreeType({ mode, onChange }: ITreeTypeProps): JSX.Element;
+export default TreeType;

package/es/DeviceSelect/TreeType.js

@@ -0,0 +1,36 @@
+import "antd/lib/menu/style";
+import _Menu from "antd/lib/menu";
+import "antd/lib/dropdown/style";
+import _Dropdown from "antd/lib/dropdown";
+import React from 'react';
+import IconFont from '../IconFont';
+
+function TreeType(_ref) {
+  var mode = _ref.mode,
+      onChange = _ref.onChange;
+  return /*#__PURE__*/React.createElement(_Dropdown, {
+    overlay: /*#__PURE__*/React.createElement(_Menu, {
+      onClick: function onClick(info) {
+        return onChange(info.key);
+      }
+    }, /*#__PURE__*/React.createElement(_Menu.Item, {
+      style: {
+        fontSize: 12
+      },
+      key: "Bz"
+    }, "\u8BBE\u5907\u4E1A\u52A1\u6811"), /*#__PURE__*/React.createElement(_Menu.Item, {
+      style: {
+        fontSize: 12
+      },
+      key: "Place"
+    }, "\u884C\u653F\u533A\u5212"))
+  }, /*#__PURE__*/React.createElement("span", null, mode === 'Place' ? '行政区划' : '设备业务树', " ", /*#__PURE__*/React.createElement(IconFont, {
+    style: {
+      position: 'relative',
+      top: 1
+    },
+    type: "icon-S_Arrow_BigDown"
+  })));
+}
+
+export default TreeType;

package/es/DeviceSelect/demo.js

@@ -10,11 +10,11 @@ function App() {
     style: {
       padding: 20,
       width: 1000,
-      height: 500
+      height: 700
     }
   }, /*#__PURE__*/React.createElement("div", {
     style: {
-      height: 400
+      height: 660
     }
   }, /*#__PURE__*/React.createElement(DeviceSelect, null))));
 }

package/es/DeviceSelect/index.css

@@ -1,6 +1,11 @@
 .vidc-device-select-layout {
   height: 100%;
+  display: flex;
 }
-.vidc-device-select-layout > .cloudapp-col {
+.vidc-device-select-layout > div {
   height: 100%;
+  flex: 1;
+}
+.vidc-device-select-layout > div:first-child.bc-type-tree-layout {
+  border-right: none;
 }

package/es/DeviceSelect/index.d.ts

@@ -4,4 +4,9 @@ interface IDeviceSelectProps {
     selectDevices?: DeviceItemType[];
 }
 declare function DeviceSelect({ selectDevices }: IDeviceSelectProps): JSX.Element;
+declare namespace DeviceSelect {
+    var defaultProps: {
+        className: string;
+    };
+}
 export default DeviceSelect;

package/es/DeviceSelect/index.js

@@ -1,12 +1,3 @@
-import "antd/lib/menu/style";
-import _Menu from "antd/lib/menu";
-import "antd/lib/dropdown/style";
-import _Dropdown from "antd/lib/dropdown";
-import "antd/lib/col/style";
-import _Col from "antd/lib/col";
-import "antd/lib/row/style";
-import _Row from "antd/lib/row";
-
 function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
 
 function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -28,12 +19,11 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
 import React, { useCallback, useEffect, useMemo, useState } from 'react';
-import TreeMode from '../TreeMode';
-import DynamicDeviceList from '../DynamicDeviceList';
-import DeviceList from '../DeviceList';
-import uniq from 'lodash-es/uniq';
-import uniqBy from 'lodash-es/uniqBy';
-import IconFont from '../IconFont';
+import TreeMode from '../Tree';
+import DynamicDeviceList from '../List/DynamicDeviceList';
+import DeviceList from '../List/DeviceList';
+import { uniq, uniqBy } from 'lodash-es';
+import TreeType from './TreeType';
 import "./index.css";
 
 function DeviceSelect(_ref) {
@@ -163,61 +153,39 @@ function DeviceSelect(_ref) {
   var treeSelectedKeys = useMemo(function () {
     return state.mode === 'Bz' ? [state.buzGroupId] : [state.areaCode];
   }, [state.mode, state.buzGroupId, state.areaCode]);
-  return /*#__PURE__*/React.createElement(_Row, {
+  return /*#__PURE__*/React.createElement("div", {
     className: "vidc-device-select-layout"
-  }, /*#__PURE__*/React.createElement(_Col, {
-    span: 7
   }, /*#__PURE__*/React.createElement(TreeMode, {
-    key: state.mode,
     mode: state.mode,
     inputPlaceholder: "\u8BF7\u8F93\u5165\u540D\u79F0",
     onSelect: onSelectTree,
     selectedKeys: treeSelectedKeys,
-    title: /*#__PURE__*/React.createElement(_Dropdown, {
-      overlay: /*#__PURE__*/React.createElement(_Menu, {
-        onClick: function onClick(info) {
-          return setState(function (old) {
-            return Object.assign(Object.assign({}, old), {
-              mode: info.key
-            });
+    title: /*#__PURE__*/React.createElement(TreeType, {
+      mode: state.mode,
+      onChange: function onChange(mode) {
+        return setState(function (old) {
+          return Object.assign(Object.assign({}, old), {
+            mode: mode
           });
-        }
-      }, /*#__PURE__*/React.createElement(_Menu.Item, {
-        style: {
-          fontSize: 12
-        },
-        key: "Bz"
-      }, "\u8BBE\u5907\u4E1A\u52A1\u6811"), /*#__PURE__*/React.createElement(_Menu.Item, {
-        style: {
-          fontSize: 12
-        },
-        key: "Place"
-      }, "\u884C\u653F\u533A\u5212"))
-    }, /*#__PURE__*/React.createElement("span", null, state.mode === 'Place' ? '行政区划' : '设备业务树', " ", /*#__PURE__*/React.createElement(IconFont, {
-      style: {
-        position: 'relative',
-        top: 1
-      },
-      type: "icon-S_Arrow_BigDown"
-    })))
-  })), /*#__PURE__*/React.createElement(_Col, {
-    span: 8
-  }, /*#__PURE__*/React.createElement(DynamicDeviceList, {
+        });
+      }
+    })
+  }), /*#__PURE__*/React.createElement(DynamicDeviceList, {
     title: "\u8BBE\u5907\u5217\u8868",
     onChecked: onCheked1,
+    key: state.mode,
     checkedKeys: state.tempSelectIds,
     params: listParams
-  })), /*#__PURE__*/React.createElement(_Col, {
-    span: 1
-  }), /*#__PURE__*/React.createElement(_Col, {
-    span: 8
-  }, /*#__PURE__*/React.createElement(DeviceList, {
+  }), /*#__PURE__*/React.createElement(DeviceList, {
     itemKey: "cid",
     deviceList: state.selectDevices || [],
     onChecked: onCheked2,
     checkedKeys: state.selectIds,
     title: "\u5DF2\u9009\u8BBE\u5907\u5217\u8868"
-  })));
+  }));
 }
 
+DeviceSelect.defaultProps = {
+  className: ''
+};
 export default DeviceSelect;

package/es/IconFont/index.d.ts

@@ -1,5 +1,4 @@
 import React from 'react';
-import './index.less';
 interface IconFontProps extends React.HTMLAttributes<HTMLSpanElement> {
     type?: string;
     className?: string;

package/es/IconFont/index.js

@@ -1,20 +1,9 @@
-import _SocketEmitter from "@cloud-app-dev/utils/es/SocketEmitter";
 import { __rest } from "tslib";
 import React from 'react';
-import "./index.css";
 var global = window;
 
-function registerIconFont(scriptUrl) {
-  if (!global._ICON_IS_INIT_) {
-    global._ICON_SCRIPT_URL = scriptUrl;
-    global._ICON_IS_INIT_ = true;
-    loadScript(scriptUrl).then(function () {
-      _SocketEmitter.emit('update-iconfont', null);
-    }).catch(function (e) {
-      console.error(e);
-      global._ICON_IS_INIT_ = false;
-    });
-  }
+if (!global._ICON_SCRIPT_URL) {
+  global._ICON_SCRIPT_URL = {};
 }
 
 function loadScript(url) {
@@ -31,6 +20,16 @@ function loadScript(url) {
   });
 }
 
+function registerIconFont(scriptUrl) {
+  if (!global._ICON_SCRIPT_URL[scriptUrl]) {
+    global._ICON_SCRIPT_URL[scriptUrl] = true;
+    loadScript(scriptUrl).catch(function (e) {
+      global._ICON_SCRIPT_URL[scriptUrl] = false;
+      console.error(e);
+    });
+  }
+}
+
 function IconFont(_a) {
   var type = _a.type,
       _a$className = _a.className,