@hw-component/table 0.0.2-beta-v7 → 0.0.2-beta-v8

package/es/Body/hooks.js

@@ -0,0 +1,51 @@
+// welcome to hoo hoo hoo
+import _Object$keys from '@babel/runtime-corejs3/core-js/object/keys';
+import _Object$getOwnPropertySymbols from '@babel/runtime-corejs3/core-js/object/get-own-property-symbols';
+import _Object$getOwnPropertyDescriptor from '@babel/runtime-corejs3/core-js/object/get-own-property-descriptor';
+import _forEachInstanceProperty from '@babel/runtime-corejs3/core-js/instance/for-each';
+import _Object$getOwnPropertyDescriptors from '@babel/runtime-corejs3/core-js/object/get-own-property-descriptors';
+import _Object$defineProperties from '@babel/runtime-corejs3/core-js/object/define-properties';
+import _Object$defineProperty from '@babel/runtime-corejs3/core-js/object/define-property';
+import _defineProperty from '@babel/runtime-corejs3/helpers/defineProperty';
+import _mapInstanceProperty from '@babel/runtime-corejs3/core-js/instance/map';
+import _filterInstanceProperty from '@babel/runtime-corejs3/core-js/instance/filter';
+import _indexOfInstanceProperty from '@babel/runtime-corejs3/core-js/instance/index-of';
+import { useMemo, useEffect } from 'react';
+import { useHTableContext } from '../context.js';
+
+function ownKeys(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context2 = ownKeys(Object(t))).call(_context2, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
+var useCols = function useCols(cols, table) {
+  return useMemo(function () {
+    return _mapInstanceProperty(cols).call(cols, function (item) {
+      var _render = item.render;
+      return _objectSpread(_objectSpread({}, item), {}, {
+        render: function render(dom, data, index) {
+          if (!_render) {
+            return dom;
+          }
+          return _render(dom, data, index, table);
+        }
+      });
+    });
+  }, [cols, table]);
+};
+var useSynchronousKeys = function useSynchronousKeys(_ref) {
+  var selectedRowKeys = _ref.selectedRowKeys,
+    records = _ref.records,
+    rowKey = _ref.rowKey;
+  var _useHTableContext = useHTableContext(),
+    rowOnChange = _useHTableContext.rowOnChange;
+  useEffect(function () {
+    if (selectedRowKeys && records && rowKey) {
+      var resultData = _filterInstanceProperty(records).call(records, function (item, index) {
+        var id = typeof rowKey === "function" ? rowKey(item, index) : item[rowKey];
+        return _indexOfInstanceProperty(selectedRowKeys).call(selectedRowKeys, id) !== -1;
+      });
+      rowOnChange(selectedRowKeys, resultData);
+    }
+  }, [selectedRowKeys, records, rowKey]);
+};
+
+export { useCols, useSynchronousKeys };
+// powered by hdj

package/es/Body/index.js

@@ -9,59 +9,93 @@ import _Object$defineProperties from '@babel/runtime-corejs3/core-js/object/defi
 import _Object$defineProperty from '@babel/runtime-corejs3/core-js/object/define-property';
 import _defineProperty from '@babel/runtime-corejs3/helpers/defineProperty';
 import _objectWithoutProperties from '@babel/runtime-corejs3/helpers/objectWithoutProperties';
+import _keysInstanceProperty from '@babel/runtime-corejs3/core-js/instance/keys';
+import _Number$parseInt from '@babel/runtime-corejs3/core-js/number/parse-int';
 import { jsx } from 'react/jsx-runtime';
 import ProTable from '@ant-design/pro-table';
+import { useCols, useSynchronousKeys } from './hooks.js';
 import { useHTableContext } from '../context.js';
-import { ConfigProvider } from 'antd';
+import 'antd';
+import { useHTableConfigContext } from '../TableConfig.js';
 
 var _excluded = ["loading", "configData", "pagination", "onPageChange", "rowSelection", "rowKey", "emptyRender", "errorRender", "tableStyle"];
 function ownKeys(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context2 = ownKeys(Object(t))).call(_context2, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
 var Body = (function (_ref) {
-  var loading = _ref.loading;
-    _ref.configData;
-    _ref.pagination;
-    var onPageChange = _ref.onPageChange,
+  var loading = _ref.loading,
+    configData = _ref.configData,
+    _ref$pagination = _ref.pagination,
+    pagination = _ref$pagination === void 0 ? {} : _ref$pagination,
+    onPageChange = _ref.onPageChange,
     _ref$rowSelection = _ref.rowSelection,
     rowSelection = _ref$rowSelection === void 0 ? {} : _ref$rowSelection,
     _ref$rowKey = _ref.rowKey,
-    rowKey = _ref$rowKey === void 0 ? "id" : _ref$rowKey;
-    _ref.emptyRender;
-    _ref.errorRender;
-    var tableStyle = _ref.tableStyle,
+    rowKey = _ref$rowKey === void 0 ? "id" : _ref$rowKey,
+    emptyRender = _ref.emptyRender,
+    errorRender = _ref.errorRender,
+    tableStyle = _ref.tableStyle,
     props = _objectWithoutProperties(_ref, _excluded);
-  rowSelection.selectedRowKeys;
-    rowSelection.onChange;
-  var _useHTableContext = useHTableContext();
-    _useHTableContext.tableInstance;
-    _useHTableContext.data;
-    _useHTableContext.selectedRowData;
-    _useHTableContext.rowOnChange;
+  var selectedRowKeys = rowSelection.selectedRowKeys,
+    onChange = rowSelection.onChange;
+  var _useHTableContext = useHTableContext(),
+    tableInstance = _useHTableContext.tableInstance,
+    data = _useHTableContext.data,
+    selectedRowData = _useHTableContext.selectedRowData,
+    rowOnChange = _useHTableContext.rowOnChange;
     _useHTableContext.error;
+  useHTableConfigContext({
+      emptyRender: emptyRender,
+      errorRender: errorRender
+    });
+  var _ref2 = data || {},
+    records = _ref2.records,
+    size = _ref2.size,
+    current = _ref2.current,
+    total = _ref2.total;
+  var cols = useCols(configData, tableInstance);
+  var change = function change(key, rowData) {
+    if (onChange) {
+      return onChange(key, rowData);
+    }
+    rowOnChange(key, rowData);
+  };
+  useSynchronousKeys({
+    selectedRowKeys: selectedRowKeys,
+    records: records,
+    rowKey: rowKey
+  });
   return jsx("div", {
     style: _objectSpread({
       borderRadius: 4,
       overflow: "hidden"
     }, tableStyle),
     className: "hw_table_body",
-    children: jsx(ConfigProvider, {
-      children: jsx(ProTable, _objectSpread(_objectSpread({}, props), {}, {
-        columns: [],
-        tableAlertRender: false,
-        search: false,
-        loading: loading,
-        rowKey: rowKey,
-        dataSource: [],
-        onChange: function onChange(paginationData) {
-          var ps = paginationData.pageSize,
-            pn = paginationData.current;
-          onPageChange === null || onPageChange === void 0 || onPageChange({
-            size: ps,
-            current: pn
-          });
-        }
-      }))
-    })
+    children: jsx(ProTable, _objectSpread(_objectSpread({}, props), {}, {
+      columns: cols,
+      tableAlertRender: false,
+      search: false,
+      rowSelection: _objectSpread(_objectSpread({}, rowSelection), {}, {
+        selectedRowKeys: _keysInstanceProperty(selectedRowData),
+        onChange: change
+      }),
+      loading: loading,
+      rowKey: rowKey,
+      dataSource: records,
+      onChange: function onChange(paginationData) {
+        var ps = paginationData.pageSize,
+          pn = paginationData.current;
+        onPageChange === null || onPageChange === void 0 || onPageChange({
+          size: ps,
+          current: pn
+        });
+      },
+      pagination: pagination === false ? pagination : _objectSpread({
+        current: _Number$parseInt(current || "1", 10),
+        total: _Number$parseInt(total || "0", 10),
+        pageSize: _Number$parseInt(size || "10", 10),
+        showQuickJumper: true
+      }, pagination)
+    }))
   });
 });
 

package/es/TableConfig.js

@@ -1,10 +1,21 @@
 // welcome to hoo hoo hoo
 import _objectWithoutProperties from '@babel/runtime-corejs3/helpers/objectWithoutProperties';
 import { jsx } from 'react/jsx-runtime';
-import React from 'react';
+import React, { useContext } from 'react';
 
 var _excluded = ["children"];
 var HTableConfigContext = /*#__PURE__*/React.createContext(null);
+var useHTableConfigContext = function useHTableConfigContext(_ref) {
+  var emptyRender = _ref.emptyRender,
+    errorRender = _ref.errorRender;
+  var _ref2 = useContext(HTableConfigContext) || {},
+    configErrorRender = _ref2.errorRender,
+    configEmptyRender = _ref2.emptyRender;
+  return {
+    errorRender: errorRender || configErrorRender,
+    emptyRender: emptyRender || configEmptyRender
+  };
+};
 var Index = function Index(_ref3) {
   var children = _ref3.children,
     props = _objectWithoutProperties(_ref3, _excluded);
@@ -14,5 +25,5 @@ var Index = function Index(_ref3) {
   });
 };
 
-export { HTableConfigContext, Index as default };
+export { HTableConfigContext, Index as default, useHTableConfigContext };
 // powered by hdj

package/lib/Body/hooks.js

@@ -0,0 +1,53 @@
+'use strict';
+
+var _Object$keys = require('@babel/runtime-corejs3/core-js/object/keys');
+var _Object$getOwnPropertySymbols = require('@babel/runtime-corejs3/core-js/object/get-own-property-symbols');
+var _Object$getOwnPropertyDescriptor = require('@babel/runtime-corejs3/core-js/object/get-own-property-descriptor');
+var _forEachInstanceProperty = require('@babel/runtime-corejs3/core-js/instance/for-each');
+var _Object$getOwnPropertyDescriptors = require('@babel/runtime-corejs3/core-js/object/get-own-property-descriptors');
+var _Object$defineProperties = require('@babel/runtime-corejs3/core-js/object/define-properties');
+var _Object$defineProperty = require('@babel/runtime-corejs3/core-js/object/define-property');
+var _defineProperty = require('@babel/runtime-corejs3/helpers/defineProperty');
+var _mapInstanceProperty = require('@babel/runtime-corejs3/core-js/instance/map');
+var _filterInstanceProperty = require('@babel/runtime-corejs3/core-js/instance/filter');
+var _indexOfInstanceProperty = require('@babel/runtime-corejs3/core-js/instance/index-of');
+var React = require('react');
+var context = require('../context.js');
+
+function ownKeys(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context2 = ownKeys(Object(t))).call(_context2, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
+var useCols = function useCols(cols, table) {
+  return React.useMemo(function () {
+    return _mapInstanceProperty(cols).call(cols, function (item) {
+      var _render = item.render;
+      return _objectSpread(_objectSpread({}, item), {}, {
+        render: function render(dom, data, index) {
+          if (!_render) {
+            return dom;
+          }
+          return _render(dom, data, index, table);
+        }
+      });
+    });
+  }, [cols, table]);
+};
+var useSynchronousKeys = function useSynchronousKeys(_ref) {
+  var selectedRowKeys = _ref.selectedRowKeys,
+    records = _ref.records,
+    rowKey = _ref.rowKey;
+  var _useHTableContext = context.useHTableContext(),
+    rowOnChange = _useHTableContext.rowOnChange;
+  React.useEffect(function () {
+    if (selectedRowKeys && records && rowKey) {
+      var resultData = _filterInstanceProperty(records).call(records, function (item, index) {
+        var id = typeof rowKey === "function" ? rowKey(item, index) : item[rowKey];
+        return _indexOfInstanceProperty(selectedRowKeys).call(selectedRowKeys, id) !== -1;
+      });
+      rowOnChange(selectedRowKeys, resultData);
+    }
+  }, [selectedRowKeys, records, rowKey]);
+};
+
+exports.useCols = useCols;
+exports.useSynchronousKeys = useSynchronousKeys;
+// powered by h

package/lib/Body/index.js

@@ -12,59 +12,93 @@ var _Object$defineProperties = require('@babel/runtime-corejs3/core-js/object/de
 var _Object$defineProperty = require('@babel/runtime-corejs3/core-js/object/define-property');
 var _defineProperty = require('@babel/runtime-corejs3/helpers/defineProperty');
 var _objectWithoutProperties = require('@babel/runtime-corejs3/helpers/objectWithoutProperties');
+var _keysInstanceProperty = require('@babel/runtime-corejs3/core-js/instance/keys');
+var _Number$parseInt = require('@babel/runtime-corejs3/core-js/number/parse-int');
 var jsxRuntime = require('react/jsx-runtime');
 var ProTable = require('@ant-design/pro-table');
+var hooks = require('./hooks.js');
 var context = require('../context.js');
-var antd = require('antd');
+require('antd');
+var TableConfig = require('../TableConfig.js');
 
 var _excluded = ["loading", "configData", "pagination", "onPageChange", "rowSelection", "rowKey", "emptyRender", "errorRender", "tableStyle"];
 function ownKeys(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context2 = ownKeys(Object(t))).call(_context2, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
 var Body = (function (_ref) {
-  var loading = _ref.loading;
-    _ref.configData;
-    _ref.pagination;
-    var onPageChange = _ref.onPageChange,
+  var loading = _ref.loading,
+    configData = _ref.configData,
+    _ref$pagination = _ref.pagination,
+    pagination = _ref$pagination === void 0 ? {} : _ref$pagination,
+    onPageChange = _ref.onPageChange,
     _ref$rowSelection = _ref.rowSelection,
     rowSelection = _ref$rowSelection === void 0 ? {} : _ref$rowSelection,
     _ref$rowKey = _ref.rowKey,
-    rowKey = _ref$rowKey === void 0 ? "id" : _ref$rowKey;
-    _ref.emptyRender;
-    _ref.errorRender;
-    var tableStyle = _ref.tableStyle,
+    rowKey = _ref$rowKey === void 0 ? "id" : _ref$rowKey,
+    emptyRender = _ref.emptyRender,
+    errorRender = _ref.errorRender,
+    tableStyle = _ref.tableStyle,
     props = _objectWithoutProperties(_ref, _excluded);
-  rowSelection.selectedRowKeys;
-    rowSelection.onChange;
-  var _useHTableContext = context.useHTableContext();
-    _useHTableContext.tableInstance;
-    _useHTableContext.data;
-    _useHTableContext.selectedRowData;
-    _useHTableContext.rowOnChange;
+  var selectedRowKeys = rowSelection.selectedRowKeys,
+    onChange = rowSelection.onChange;
+  var _useHTableContext = context.useHTableContext(),
+    tableInstance = _useHTableContext.tableInstance,
+    data = _useHTableContext.data,
+    selectedRowData = _useHTableContext.selectedRowData,
+    rowOnChange = _useHTableContext.rowOnChange;
     _useHTableContext.error;
+  TableConfig.useHTableConfigContext({
+      emptyRender: emptyRender,
+      errorRender: errorRender
+    });
+  var _ref2 = data || {},
+    records = _ref2.records,
+    size = _ref2.size,
+    current = _ref2.current,
+    total = _ref2.total;
+  var cols = hooks.useCols(configData, tableInstance);
+  var change = function change(key, rowData) {
+    if (onChange) {
+      return onChange(key, rowData);
+    }
+    rowOnChange(key, rowData);
+  };
+  hooks.useSynchronousKeys({
+    selectedRowKeys: selectedRowKeys,
+    records: records,
+    rowKey: rowKey
+  });
   return jsxRuntime.jsx("div", {
     style: _objectSpread({
       borderRadius: 4,
       overflow: "hidden"
     }, tableStyle),
     className: "hw_table_body",
-    children: jsxRuntime.jsx(antd.ConfigProvider, {
-      children: jsxRuntime.jsx(ProTable, _objectSpread(_objectSpread({}, props), {}, {
-        columns: [],
-        tableAlertRender: false,
-        search: false,
-        loading: loading,
-        rowKey: rowKey,
-        dataSource: [],
-        onChange: function onChange(paginationData) {
-          var ps = paginationData.pageSize,
-            pn = paginationData.current;
-          onPageChange === null || onPageChange === void 0 || onPageChange({
-            size: ps,
-            current: pn
-          });
-        }
-      }))
-    })
+    children: jsxRuntime.jsx(ProTable, _objectSpread(_objectSpread({}, props), {}, {
+      columns: cols,
+      tableAlertRender: false,
+      search: false,
+      rowSelection: _objectSpread(_objectSpread({}, rowSelection), {}, {
+        selectedRowKeys: _keysInstanceProperty(selectedRowData),
+        onChange: change
+      }),
+      loading: loading,
+      rowKey: rowKey,
+      dataSource: records,
+      onChange: function onChange(paginationData) {
+        var ps = paginationData.pageSize,
+          pn = paginationData.current;
+        onPageChange === null || onPageChange === void 0 || onPageChange({
+          size: ps,
+          current: pn
+        });
+      },
+      pagination: pagination === false ? pagination : _objectSpread({
+        current: _Number$parseInt(current || "1", 10),
+        total: _Number$parseInt(total || "0", 10),
+        pageSize: _Number$parseInt(size || "10", 10),
+        showQuickJumper: true
+      }, pagination)
+    }))
   });
 });
 

package/lib/TableConfig.js

@@ -8,6 +8,17 @@ var React = require('react');
 
 var _excluded = ["children"];
 var HTableConfigContext = /*#__PURE__*/React.createContext(null);
+var useHTableConfigContext = function useHTableConfigContext(_ref) {
+  var emptyRender = _ref.emptyRender,
+    errorRender = _ref.errorRender;
+  var _ref2 = React.useContext(HTableConfigContext) || {},
+    configErrorRender = _ref2.errorRender,
+    configEmptyRender = _ref2.emptyRender;
+  return {
+    errorRender: errorRender || configErrorRender,
+    emptyRender: emptyRender || configEmptyRender
+  };
+};
 var Index = function Index(_ref3) {
   var children = _ref3.children,
     props = _objectWithoutProperties(_ref3, _excluded);
@@ -19,4 +30,5 @@ var Index = function Index(_ref3) {
 
 exports.HTableConfigContext = HTableConfigContext;
 exports.default = Index;
+exports.useHTableConfigContext = useHTableConfigContext;
 // powered by h

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hw-component/table",
-  "version": "0.0.2-beta-v7",
+  "version": "0.0.2-beta-v8",
   "description": "基于antd二次开发table组件",
   "keywords": [
     "table"

package/src/components/Body/index.tsx

@@ -37,27 +37,49 @@ export default ({
   const { selectedRowKeys, onChange } = rowSelection;
   const { tableInstance, data, selectedRowData, rowOnChange, error } =
     useHTableContext();
+  const {
+    emptyRender: tableEmptyRender = defaultRender,
+    errorRender: tableErrorRender = defaultRender,
+  } = useHTableConfigContext({ emptyRender, errorRender });
+  const { records, size, current, total } = data || {};
+  const cols = useCols(configData, tableInstance);
+  const change = (key: React.Key[], rowData: any[]) => {
+    if (onChange) {
+      return onChange(key, rowData);
+    }
+    rowOnChange(key, rowData);
+  };
+  useSynchronousKeys({ selectedRowKeys, records, rowKey });
   return (
     <div
       style={{ borderRadius: 4, overflow: "hidden", ...tableStyle }}
       className="hw_table_body"
     >
-      <ConfigProvider
-      >
         <ProTable
           {...props}
-          columns={[]}
+          columns={cols}
           tableAlertRender={false}
           search={false}
+          rowSelection={{
+            ...rowSelection,
+            selectedRowKeys: selectedRowData.keys,
+            onChange: change,
+          }}
           loading={loading}
           rowKey={rowKey}
-          dataSource={[]}
+          dataSource={records}
           onChange={(paginationData) => {
             const { pageSize: ps, current: pn } = paginationData;
             onPageChange?.({ size: ps, current: pn });
           }}
+          pagination={pagination===false?pagination:{
+            current: Number.parseInt(current || "1", 10),
+            total: Number.parseInt(total || "0", 10),
+            pageSize: Number.parseInt(size || "10", 10),
+            showQuickJumper: true,
+            ...pagination,
+          }}
         />
-      </ConfigProvider>
     </div>
   );
 };