ahooks/lib/useAntdTable/index.js

react hooks library

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = void 0;
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
var _toArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toArray"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _tslib = require("tslib");
var _react = require("react");
var _useMemoizedFn = _interopRequireDefault(require("../useMemoizedFn"));
var _usePagination = _interopRequireDefault(require("../usePagination"));
var _useUpdateEffect = _interopRequireDefault(require("../useUpdateEffect"));
var useAntdTable = function useAntdTable(service) {
  var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
  var _a;
  var form = options.form,
    _options$defaultType = options.defaultType,
    defaultType = _options$defaultType === void 0 ? 'simple' : _options$defaultType,
    defaultParams = options.defaultParams,
    _options$manual = options.manual,
    manual = _options$manual === void 0 ? false : _options$manual,
    _options$refreshDeps = options.refreshDeps,
    refreshDeps = _options$refreshDeps === void 0 ? [] : _options$refreshDeps,
    _options$ready = options.ready,
    ready = _options$ready === void 0 ? true : _options$ready,
    rest = (0, _tslib.__rest)(options, ["form", "defaultType", "defaultParams", "manual", "refreshDeps", "ready"]);
  var result = (0, _usePagination["default"])(service, Object.assign(Object.assign({
    ready: ready,
    manual: true
  }, rest), {
    onSuccess: function onSuccess() {
      var _a2;
      var _a;
      // eslint-disable-next-line @typescript-eslint/no-use-before-define
      runSuccessRef.current = true;
      for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
        args[_key] = arguments[_key];
      }
      (_a = rest.onSuccess) === null || _a === void 0 ? void 0 : (_a2 = _a).call.apply(_a2, [rest].concat(args));
    }
  }));
  var _result$params = result.params,
    params = _result$params === void 0 ? [] : _result$params,
    run = result.run;
  var cacheFormTableData = params[2] || {};
  var _useState = (0, _react.useState)((cacheFormTableData === null || cacheFormTableData === void 0 ? void 0 : cacheFormTableData.type) || defaultType),
    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
    type = _useState2[0],
    setType = _useState2[1];
  var allFormDataRef = (0, _react.useRef)({});
  var defaultDataSourceRef = (0, _react.useRef)([]);
  var runSuccessRef = (0, _react.useRef)(false);
  var isAntdV4 = !!(form === null || form === void 0 ? void 0 : form.getInternalHooks);
  // get current active field values
  var getActiveFieldValues = function getActiveFieldValues() {
    if (!form) {
      return {};
    }
    // antd 4
    if (isAntdV4) {
      return form.getFieldsValue(null, function () {
        return true;
      });
    }
    // antd 3
    var allFieldsValue = form.getFieldsValue();
    var activeFieldsValue = {};
    Object.keys(allFieldsValue).forEach(function (key) {
      if (form.getFieldInstance ? form.getFieldInstance(key) : true) {
        activeFieldsValue[key] = allFieldsValue[key];
      }
    });
    return activeFieldsValue;
  };
  var validateFields = function validateFields() {
    if (!form) {
      return Promise.resolve({});
    }
    var activeFieldsValue = getActiveFieldValues();
    var fields = Object.keys(activeFieldsValue);
    // antd 4
    if (isAntdV4) {
      if (form.validateFieldsReturnFormatValue) {
        return form.validateFieldsReturnFormatValue(fields);
      }
      return form.validateFields(fields);
    }
    // antd 3
    return new Promise(function (resolve, reject) {
      form.validateFields(fields, function (errors, values) {
        if (errors) {
          reject(errors);
        } else {
          resolve(values);
        }
      });
    });
  };
  var restoreForm = function restoreForm() {
    if (!form) {
      return;
    }
    // antd v4
    if (isAntdV4) {
      return form.setFieldsValue(allFormDataRef.current);
    }
    // antd v3
    var activeFieldsValue = {};
    Object.keys(allFormDataRef.current).forEach(function (key) {
      if (form.getFieldInstance ? form.getFieldInstance(key) : true) {
        activeFieldsValue[key] = allFormDataRef.current[key];
      }
    });
    form.setFieldsValue(activeFieldsValue);
  };
  var changeType = function changeType() {
    var activeFieldsValue = getActiveFieldValues();
    allFormDataRef.current = Object.assign(Object.assign({}, allFormDataRef.current), activeFieldsValue);
    setType(function (t) {
      return t === 'simple' ? 'advance' : 'simple';
    });
  };
  var _submit = function _submit(initPagination) {
    if (!ready) {
      return;
    }
    setTimeout(function () {
      validateFields().then(function () {
        var values = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
        var pagination = initPagination || Object.assign(Object.assign({
          pageSize: options.defaultPageSize || 10
        }, (params === null || params === void 0 ? void 0 : params[0]) || {}), {
          current: 1
        });
        if (!form) {
          // @ts-ignore
          run(pagination);
          return;
        }
        // record all form data
        allFormDataRef.current = Object.assign(Object.assign({}, allFormDataRef.current), values);
        // @ts-ignore
        run(pagination, values, {
          allFormData: allFormDataRef.current,
          type: type
        });
      })["catch"](function (err) {
        return err;
      });
    });
  };
  var reset = function reset() {
    var _a, _b;
    if (form) {
      form.resetFields();
    }
    _submit(Object.assign(Object.assign({}, (defaultParams === null || defaultParams === void 0 ? void 0 : defaultParams[0]) || {}), {
      pageSize: options.defaultPageSize || ((_b = (_a = options.defaultParams) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.pageSize) || 10,
      current: 1
    }));
  };
  var submit = function submit(e) {
    var _a, _b, _c;
    (_a = e === null || e === void 0 ? void 0 : e.preventDefault) === null || _a === void 0 ? void 0 : _a.call(e);
    _submit(runSuccessRef.current ? undefined : Object.assign({
      pageSize: options.defaultPageSize || ((_c = (_b = options.defaultParams) === null || _b === void 0 ? void 0 : _b[0]) === null || _c === void 0 ? void 0 : _c.pageSize) || 10,
      current: 1
    }, (defaultParams === null || defaultParams === void 0 ? void 0 : defaultParams[0]) || {}));
  };
  var onTableChange = function onTableChange(pagination, filters, sorter, extra) {
    var _ref = params || [],
      _ref2 = (0, _toArray2["default"])(_ref),
      oldPaginationParams = _ref2[0],
      restParams = _ref2.slice(1);
    run.apply(void 0, [Object.assign(Object.assign({}, oldPaginationParams), {
      current: pagination.current,
      pageSize: pagination.pageSize,
      filters: filters,
      sorter: sorter,
      extra: extra
    })].concat((0, _toConsumableArray2["default"])(restParams)));
  };
  // init
  (0, _react.useEffect)(function () {
    // if has cache, use cached params. ignore manual and ready.
    if (params.length > 0) {
      allFormDataRef.current = (cacheFormTableData === null || cacheFormTableData === void 0 ? void 0 : cacheFormTableData.allFormData) || {};
      restoreForm();
      // @ts-ignore
      run.apply(void 0, (0, _toConsumableArray2["default"])(params));
      return;
    }
    if (ready) {
      allFormDataRef.current = (defaultParams === null || defaultParams === void 0 ? void 0 : defaultParams[1]) || {};
      restoreForm();
      if (!manual) {
        _submit(defaultParams === null || defaultParams === void 0 ? void 0 : defaultParams[0]);
      }
    }
  }, []);
  // change search type, restore form data
  (0, _useUpdateEffect["default"])(function () {
    if (!ready) {
      return;
    }
    restoreForm();
  }, [type]);
  // refresh & ready change on the same time
  var hasAutoRun = (0, _react.useRef)(false);
  hasAutoRun.current = false;
  (0, _useUpdateEffect["default"])(function () {
    if (!manual && ready) {
      hasAutoRun.current = true;
      if (form) {
        form.resetFields();
      }
      allFormDataRef.current = (defaultParams === null || defaultParams === void 0 ? void 0 : defaultParams[1]) || {};
      restoreForm();
      _submit(defaultParams === null || defaultParams === void 0 ? void 0 : defaultParams[0]);
    }
  }, [ready]);
  (0, _useUpdateEffect["default"])(function () {
    if (hasAutoRun.current) {
      return;
    }
    if (!ready) {
      return;
    }
    if (!manual) {
      hasAutoRun.current = true;
      if (options.refreshDepsAction) {
        options.refreshDepsAction();
      } else {
        result.pagination.changeCurrent(1);
      }
    }
  }, (0, _toConsumableArray2["default"])(refreshDeps));
  return Object.assign(Object.assign({}, result), {
    tableProps: {
      dataSource: ((_a = result.data) === null || _a === void 0 ? void 0 : _a.list) || defaultDataSourceRef.current,
      loading: result.loading,
      onChange: (0, _useMemoizedFn["default"])(onTableChange),
      pagination: {
        current: result.pagination.current,
        pageSize: result.pagination.pageSize,
        total: result.pagination.total
      }
    },
    search: {
      submit: (0, _useMemoizedFn["default"])(submit),
      type: type,
      changeType: (0, _useMemoizedFn["default"])(changeType),
      reset: (0, _useMemoizedFn["default"])(reset)
    }
  });
};
var _default = exports["default"] = useAntdTable;