@lemon-fe/kits 0.0.9 → 0.0.11

package/es/index.d.ts

@@ -1,3 +1,6 @@
 export * from '@lemon-fe/components';
 export * from '@lemon-fe/hooks';
 export * from '@lemon-fe/layouts';
+export { default as usePreload } from './usePreload';
+export { default as useBatchOperator } from './useBatchOperator';
+export { default as Subject } from './subject';

package/es/index.js

@@ -1,3 +1,6 @@
 export * from '@lemon-fe/components';
 export * from '@lemon-fe/hooks';
-export * from '@lemon-fe/layouts';
+export * from '@lemon-fe/layouts';
+export { default as usePreload } from './usePreload';
+export { default as useBatchOperator } from './useBatchOperator';
+export { default as Subject } from './subject';

package/es/subject.d.ts

@@ -0,0 +1,12 @@
+interface Observer<State> {
+    next: (state: State) => void;
+    complete?: () => void;
+}
+export default function Subject<State>(): {
+    next: (state: State) => void;
+    subscribe: (observer: Observer<State>) => {
+        unsubscribe: () => void;
+    };
+    complete: () => void;
+};
+export {};

package/es/subject.js

@@ -0,0 +1,31 @@
+export default function Subject() {
+  var observers = [];
+  return {
+    next: function next(state) {
+      observers.forEach(function (item) {
+        return item.next(state);
+      });
+    },
+    subscribe: function subscribe(observer) {
+      observers.push(observer);
+      return {
+        unsubscribe: function unsubscribe() {
+          var index = observers.findIndex(function (item) {
+            return item === observer;
+          });
+
+          if (index >= 0) {
+            observers.splice(index, 1);
+          }
+        }
+      };
+    },
+    complete: function complete() {
+      observers.forEach(function (item) {
+        if (item.complete) {
+          item.complete();
+        }
+      });
+    }
+  };
+}

package/es/useBatchOperator/index.d.ts

@@ -0,0 +1,14 @@
+import type { Key } from 'react';
+import type { ColumnType, BaseTableProps } from '@lemon-fe/components';
+declare type Result = void | string | Error | symbol;
+export default function useBatchOperate<RecordType = Record<string, any>>(options: {
+    modalTitle: string;
+    handler: (record: RecordType) => Promise<string | void>;
+    columns?: ColumnType<RecordType>[];
+    rowKey?: BaseTableProps<RecordType>['rowKey'];
+    onClose?: (results: Map<Key, Result>) => void;
+}): {
+    node: JSX.Element;
+    run: (data: RecordType[]) => void;
+};
+export {};

package/es/useBatchOperator/index.js

@@ -0,0 +1,356 @@
+function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
+
+function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
+
+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."); }
+
+function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
+
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
+
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+import React, { useMemo, useState, useRef, useEffect } from 'react';
+import { Modal, Row, Spin } from 'antd';
+import { PlayCircleOutlined, DeleteTwoTone, PauseCircleOutlined, ReloadOutlined } from '@ant-design/icons';
+import { get } from 'lodash';
+import { BaseTable, Section, Layout, Icons, Actions } from '@lemon-fe/components';
+import { useThrottle } from '@lemon-fe/hooks';
+var loading = Symbol('loading');
+export default function useBatchOperate(options) {
+  var _options$modalTitle = options.modalTitle,
+      modalTitle = _options$modalTitle === void 0 ? '批量操作' : _options$modalTitle,
+      handler = options.handler,
+      columns = options.columns,
+      onClose = options.onClose,
+      rowKey = options.rowKey;
+
+  var _useState = useState(false),
+      _useState2 = _slicedToArray(_useState, 2),
+      visible = _useState2[0],
+      setVisible = _useState2[1];
+
+  var _useState3 = useState([]),
+      _useState4 = _slicedToArray(_useState3, 2),
+      data = _useState4[0],
+      setData = _useState4[1];
+
+  var _useState5 = useState(new Map()),
+      _useState6 = _slicedToArray(_useState5, 2),
+      results = _useState6[0],
+      setResults = _useState6[1];
+
+  var _useState7 = useState(-1),
+      _useState8 = _slicedToArray(_useState7, 2),
+      active = _useState8[0],
+      setActive = _useState8[1];
+
+  var _useState9 = useState(true),
+      _useState10 = _slicedToArray(_useState9, 2),
+      paused = _useState10[0],
+      setPaused = _useState10[1];
+
+  var mounted = useRef(false);
+  var pausedRef = useRef(paused);
+  pausedRef.current = paused;
+  useEffect(function () {
+    mounted.current = visible;
+    return function () {
+      mounted.current = false;
+    };
+  }, [visible]);
+
+  var getRowKey = function getRowKey(record, index) {
+    if (typeof rowKey === 'function') {
+      return rowKey(record, index);
+    }
+
+    if (rowKey !== undefined) {
+      return get(record, rowKey);
+    }
+
+    return get(record, 'key');
+  };
+
+  var mCols = useMemo(function () {
+    var cols = columns ? _toConsumableArray(columns) : [{
+      title: '编号',
+      key: 'id',
+      dataIndex: typeof rowKey === 'string' ? rowKey : undefined,
+      render: function render(_, record, index) {
+        return getRowKey(record, index);
+      }
+    }];
+    cols.unshift({
+      title: '',
+      key: 'delete',
+      width: 32,
+      render: function render(_, record, index) {
+        var key = getRowKey(record, index);
+        return /*#__PURE__*/React.createElement(DeleteTwoTone, {
+          onClick: function onClick() {
+            if (!paused) {
+              return;
+            }
+
+            setActive(function (prev) {
+              if (prev >= index) {
+                return prev - 1;
+              }
+
+              return prev;
+            });
+            setResults(function (prev) {
+              if (prev.has(key)) {
+                var next = new Map(prev);
+                next.delete(key);
+                return next;
+              }
+
+              return prev;
+            });
+            setData(function (prev) {
+              var next = _toConsumableArray(prev);
+
+              next.splice(index, 1);
+              return next;
+            });
+          }
+        });
+      }
+    });
+    cols.push({
+      title: '状态',
+      key: 'status',
+      width: 'auto',
+      render: function render(_, record, index) {
+        var key = getRowKey(record, index);
+        var result = results.get(key);
+
+        if (active === index && !paused || result === loading) {
+          return /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement(Spin, {
+            size: "small",
+            style: {
+              lineHeight: 1
+            }
+          }), /*#__PURE__*/React.createElement("span", null, " \u8FDB\u884C\u4E2D"));
+        }
+
+        if (!results.has(key)) {
+          return /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement(Icons.Tip, {
+            type: "warning"
+          }), /*#__PURE__*/React.createElement("span", null, " \u5F85\u5904\u7406"));
+        }
+
+        if (result instanceof Error) {
+          return /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement(Icons.Tip, {
+            type: "error"
+          }), /*#__PURE__*/React.createElement("span", null, " ", result.message, " "), /*#__PURE__*/React.createElement(ReloadOutlined, {
+            onClick: function onClick() {
+              return reload(record, index);
+            }
+          }));
+        }
+
+        return /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement(Icons.Tip, {
+          type: "success"
+        }), /*#__PURE__*/React.createElement("span", null, " ", result || '操作成功'));
+      }
+    });
+    return cols;
+  }, [columns, paused, active, results]);
+
+  var changeResult = function changeResult(key, val) {
+    if (mounted.current) {
+      setResults(function (prev) {
+        var next = new Map(prev);
+        next.set(key, val);
+        return next;
+      });
+    }
+  };
+
+  var reload = useThrottle( /*#__PURE__*/function () {
+    var _ref = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(item, index) {
+      var key, res;
+      return regeneratorRuntime.wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              key = getRowKey(item, index);
+              _context.prev = 1;
+              changeResult(key, loading);
+              _context.next = 5;
+              return handler(item);
+
+            case 5:
+              res = _context.sent;
+              changeResult(key, res);
+              _context.next = 12;
+              break;
+
+            case 9:
+              _context.prev = 9;
+              _context.t0 = _context["catch"](1);
+              changeResult(key, _context.t0);
+
+            case 12:
+            case "end":
+              return _context.stop();
+          }
+        }
+      }, _callee, null, [[1, 9]]);
+    }));
+
+    return function (_x, _x2) {
+      return _ref.apply(this, arguments);
+    };
+  }(), 500);
+  var start = useThrottle( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2() {
+    var i, item, key, res;
+    return regeneratorRuntime.wrap(function _callee2$(_context2) {
+      while (1) {
+        switch (_context2.prev = _context2.next) {
+          case 0:
+            setPaused(false);
+            i = active + 1;
+
+          case 2:
+            if (!(i < data.length)) {
+              _context2.next = 23;
+              break;
+            }
+
+            setActive(i);
+            item = data[i];
+            key = getRowKey(item, i);
+            _context2.prev = 6;
+            _context2.next = 9;
+            return handler(item);
+
+          case 9:
+            res = _context2.sent;
+            changeResult(key, res);
+            _context2.next = 16;
+            break;
+
+          case 13:
+            _context2.prev = 13;
+            _context2.t0 = _context2["catch"](6);
+            changeResult(key, _context2.t0);
+
+          case 16:
+            if (!pausedRef.current) {
+              _context2.next = 18;
+              break;
+            }
+
+            return _context2.abrupt("return");
+
+          case 18:
+            if (mounted.current) {
+              _context2.next = 20;
+              break;
+            }
+
+            return _context2.abrupt("break", 23);
+
+          case 20:
+            i += 1;
+            _context2.next = 2;
+            break;
+
+          case 23:
+            if (mounted.current) {
+              setActive(-1);
+              setPaused(true);
+            }
+
+          case 24:
+          case "end":
+            return _context2.stop();
+        }
+      }
+    }, _callee2, null, [[6, 13]]);
+  })), 500);
+
+  var run = function run(data) {
+    setVisible(true);
+    setData(data);
+  };
+
+  var handleClose = function handleClose() {
+    setVisible(false);
+
+    if (onClose) {
+      onClose(results);
+    }
+  };
+
+  var node = /*#__PURE__*/React.createElement(Modal, {
+    title: modalTitle,
+    visible: visible,
+    width: 896,
+    centered: true,
+    onCancel: handleClose,
+    footer: null,
+    maskClosable: false,
+    bodyStyle: {
+      height: '549px',
+      padding: 0,
+      backgroundColor: '#f9f9f9'
+    },
+    afterClose: function afterClose() {
+      setResults(new Map());
+      setPaused(true);
+      setActive(-1);
+      setData([]);
+    },
+    keyboard: false
+  }, /*#__PURE__*/React.createElement(Layout, {
+    full: true,
+    header: /*#__PURE__*/React.createElement(Row, {
+      justify: "space-between"
+    }, /*#__PURE__*/React.createElement("span", null, "\u660E\u7EC6".concat(results.size > 0 ? "(".concat(results.size, "/").concat(data.length, ")") : '')), /*#__PURE__*/React.createElement(Actions, {
+      actions: [paused ? {
+        disabled: data.length <= 0 || results.size >= data.length,
+        icon: /*#__PURE__*/React.createElement(PlayCircleOutlined, null),
+        text: active >= 0 ? '继续执行' : '开始执行',
+        onClick: start
+      } : {
+        disabled: data.length <= 0,
+        icon: /*#__PURE__*/React.createElement(PauseCircleOutlined, null),
+        text: '暂停执行',
+        onClick: function onClick() {
+          setPaused(true);
+        }
+      }]
+    }))
+  }, /*#__PURE__*/React.createElement(Section, {
+    type: "table"
+  }, /*#__PURE__*/React.createElement(BaseTable, {
+    scroll: {
+      y: true
+    },
+    pagination: false,
+    dataSource: data,
+    columns: mCols,
+    rowKey: rowKey
+  }))));
+  return {
+    node: node,
+    run: run
+  };
+}

package/es/usePreload/index.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+export default function usePreload<TargetProps>(opts: {
+    request: () => Promise<TargetProps>;
+    onSuccess?: (data: TargetProps) => void;
+} | (() => Promise<TargetProps>), deps?: ReadonlyArray<any>): {
+    refresh: () => void;
+    data: TargetProps | null;
+    mask: React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
+};

package/es/usePreload/index.js

@@ -0,0 +1,83 @@
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+import React, { useEffect, useState } from 'react';
+import { Result, Button } from 'antd';
+import { useRequest } from '@lemon-fe/hooks';
+import { PageLoading } from '@lemon-fe/components';
+export default function usePreload(opts, deps) {
+  var _useState = useState(null),
+      _useState2 = _slicedToArray(_useState, 2),
+      data = _useState2[0],
+      setData = _useState2[1];
+
+  var _useState3 = useState(null),
+      _useState4 = _slicedToArray(_useState3, 2),
+      error = _useState4[0],
+      setError = _useState4[1];
+
+  var request;
+
+  var _onSuccess;
+
+  if (typeof opts === 'function') {
+    request = opts;
+  } else {
+    request = opts.request;
+    _onSuccess = opts.onSuccess;
+  }
+
+  var _useRequest = useRequest(request, {
+    onSuccess: function onSuccess(res) {
+      if (_onSuccess) {
+        _onSuccess(res);
+      }
+
+      setData(res);
+    },
+    onError: function onError(err) {
+      setError(err);
+    }
+  }),
+      run = _useRequest.run;
+
+  useEffect(function () {
+    run();
+  }, deps ? deps : []);
+
+  var handleRefresh = function handleRefresh() {
+    setError(null);
+    run();
+  };
+
+  var mask = null;
+
+  if (error) {
+    mask = /*#__PURE__*/React.createElement(Result, {
+      status: "500",
+      title: "500",
+      subTitle: error.message,
+      extra: /*#__PURE__*/React.createElement(Button, {
+        type: "primary",
+        onClick: handleRefresh
+      }, "\u91CD\u65B0\u52A0\u8F7D")
+    });
+  } else if (data === null) {
+    mask = /*#__PURE__*/React.createElement(PageLoading, null);
+  }
+
+  return {
+    refresh: handleRefresh,
+    data: data,
+    mask: mask
+  };
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lemon-fe/kits",
-  "version": "0.0.9",
+  "version": "0.0.11",
   "description": "> TODO: description",
   "author": "鲁盛杰 <lusj@cnlemon.net>",
   "homepage": "",
@@ -20,12 +20,12 @@
     "url": "git@gitlab.nhsoft.cn:lemon-fe/kits-next.git"
   },
   "dependencies": {
-    "@lemon-fe/components": "^0.0.9",
-    "@lemon-fe/hooks": "^0.0.9",
-    "@lemon-fe/layouts": "^0.0.9"
+    "@lemon-fe/components": "^0.0.11",
+    "@lemon-fe/hooks": "^0.0.11",
+    "@lemon-fe/layouts": "^0.0.11"
   },
   "scripts": {
     "test": "echo \"Error: run tests from root\" && exit 1"
   },
-  "gitHead": "ef85c77ac935ece72378356f0cfa316d8d675cea"
+  "gitHead": "5ff7bc34a470e39c494efb4384f55d3d802e0e1e"
 }