@hw-component/table 1.2.1 → 1.2.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (41) hide show
  1. package/.eslintcache +1 -1
  2. package/es/HTableBody/RowSelection.d.ts +2 -1
  3. package/es/HTableBody/RowSelection.js +4 -3
  4. package/es/HTableBody/hooks.js +2 -1
  5. package/es/HTableBody/index.d.ts +1 -1
  6. package/es/HTableBody/index.js +63 -63
  7. package/es/HTableHeader/index.js +6 -15
  8. package/es/HTablePagination/index.js +7 -2
  9. package/es/Table.js +5 -4
  10. package/es/TableConfig.d.ts +7 -1
  11. package/es/TableConfig.js +12 -3
  12. package/es/context.d.ts +0 -1
  13. package/es/index.css +27 -5
  14. package/es/modal.d.ts +3 -2
  15. package/lib/HTableBody/RowSelection.d.ts +2 -1
  16. package/lib/HTableBody/RowSelection.js +4 -3
  17. package/lib/HTableBody/hooks.js +2 -1
  18. package/lib/HTableBody/index.d.ts +1 -1
  19. package/lib/HTableBody/index.js +62 -62
  20. package/lib/HTableHeader/index.js +6 -15
  21. package/lib/HTablePagination/index.js +7 -2
  22. package/lib/Table.js +9 -8
  23. package/lib/TableConfig.d.ts +7 -1
  24. package/lib/TableConfig.js +12 -3
  25. package/lib/context.d.ts +0 -1
  26. package/lib/index.css +27 -5
  27. package/lib/modal.d.ts +3 -2
  28. package/package.json +1 -1
  29. package/src/components/HTableBody/Options/index.tsx +26 -20
  30. package/src/components/HTableBody/Options/modal.d.ts +2 -2
  31. package/src/components/HTableBody/RowSelection.tsx +5 -3
  32. package/src/components/HTableBody/hooks.tsx +2 -1
  33. package/src/components/HTableBody/index.tsx +75 -78
  34. package/src/components/HTableHeader/index.tsx +3 -5
  35. package/src/components/HTablePagination/index.tsx +5 -2
  36. package/src/components/Table.tsx +6 -4
  37. package/src/components/TableConfig.tsx +11 -1
  38. package/src/components/context.ts +0 -1
  39. package/src/components/index.less +30 -6
  40. package/src/components/modal.ts +4 -3
  41. package/src/pages/Table/index.tsx +85 -79
package/es/index.css CHANGED
@@ -1,14 +1,28 @@
1
+ .ant-hw-table-content .ant-hw-table-body {
2
+ padding-top: 0px;
3
+ border-top-left-radius: 0px;
4
+ border-top-right-radius: 0px;
5
+ }
6
+ .ant-hw-table-content .ant-hw-table-header {
7
+ border-bottom-left-radius: 0px !important;
8
+ border-bottom-right-radius: 0px !important;
9
+ }
1
10
  .ant-hw-table-body {
2
- border-bottom-left-radius: 4px;
3
- border-bottom-right-radius: 4px;
4
11
  background-color: #fff;
5
12
  position: relative;
13
+ padding-right: 20px;
14
+ padding-left: 20px;
15
+ padding-top: 16px;
16
+ border-radius: 4px;
17
+ overflow: hidden;
6
18
  }
7
19
  .ant-hw-table-body .ant-hw-table-pagination {
8
20
  padding: 12px 24px;
9
21
  background-color: #ffffff;
10
22
  border-bottom-left-radius: 4px;
11
23
  border-bottom-right-radius: 4px;
24
+ margin-left: -20px;
25
+ margin-right: -20px;
12
26
  }
13
27
  .ant-hw-table-body .ant-hw-table-pagination .ant-select {
14
28
  width: auto;
@@ -19,8 +33,11 @@
19
33
  .ant-hw-table-body .ant-pro-table-list-toolbar-container {
20
34
  padding-top: 0px;
21
35
  }
36
+ .ant-hw-table-body .ant-pro-table > .ant-pro-card > .ant-pro-card-body {
37
+ padding: 0px;
38
+ }
22
39
  .ant-hw-table-pagination {
23
- padding: 24px;
40
+ padding: 20px;
24
41
  border-radius: 4px;
25
42
  background-color: #ffffff;
26
43
  position: relative;
@@ -37,13 +54,18 @@
37
54
  background-size: 100%;
38
55
  }
39
56
  .ant-hw-table-header {
40
- border-top-left-radius: 4px !important;
41
- border-top-right-radius: 4px !important;
57
+ border-radius: 4px !important;
42
58
  padding-bottom: 0px;
43
59
  }
44
60
  .ant-hw-table-header .ant-hw-table-header-item-hide {
45
61
  display: none;
46
62
  }
63
+ .ant-hw-table-header .ant-card-body {
64
+ padding: 24px 20px;
65
+ }
66
+ .ant-hw-table-header .ant-form-item {
67
+ margin-bottom: 16px;
68
+ }
47
69
  .ant-hw-table-body-option-icon {
48
70
  font-size: 16px;
49
71
  }
package/es/modal.d.ts CHANGED
@@ -6,7 +6,7 @@ import type React from "react";
6
6
  import type { ModalProps } from "antd";
7
7
  import type { TableProps } from "antd/lib/table";
8
8
  import type { AffixProps } from "antd/lib/affix";
9
- import { OptionModal } from "./HTableBody";
9
+ import type { OptionModal } from "./HTableBody";
10
10
  export interface RowObj {
11
11
  keys?: React.Key[];
12
12
  rowData?: any[];
@@ -42,6 +42,7 @@ export type actionFn = (...arg: any[]) => void;
42
42
  export interface RowSelectionOuter {
43
43
  allPageCheck?: boolean;
44
44
  }
45
+ type RowKeyFn = (data: any, index: number) => string;
45
46
  export type HRowSelection = RowSelectionOuter & (TableProps<any>["rowSelection"] & {
46
47
  alwaysShowAlert?: boolean;
47
48
  });
@@ -64,7 +65,7 @@ export interface HTableProps extends Omit<ProTableProps<any, any>, "request" | "
64
65
  manual?: boolean;
65
66
  dataSource?: ResultModal;
66
67
  paginationStyle?: React.CSSProperties;
67
- rowKey?: string;
68
+ rowKey?: string | RowKeyFn;
68
69
  allPageCheck?: boolean;
69
70
  rowSelection?: HRowSelection | false;
70
71
  affixProps?: AffixProps | false;
@@ -4,6 +4,7 @@ interface RowSelectionBoxProps {
4
4
  data: any;
5
5
  onChange?: HRowSelection["onChange"];
6
6
  getCheckboxProps?: HRowSelection["getCheckboxProps"];
7
+ index: number;
7
8
  }
8
- export declare const RowSelectionBox: ({ data, onChange, getCheckboxProps, }: RowSelectionBoxProps) => JSX.Element;
9
+ export declare const RowSelectionBox: ({ data, onChange, index, getCheckboxProps, }: RowSelectionBoxProps) => JSX.Element;
9
10
  export {};
@@ -35,8 +35,8 @@ var RowSelectionTitle = function RowSelectionTitle(_ref) {
35
35
  var keys = _keysInstanceProperty(selectedRowData),
36
36
  selectAll = selectedRowData.selectAll;
37
37
  var allCheck = function allCheck() {
38
- var setKeys = _mapInstanceProperty(newData).call(newData, function (item) {
39
- return item[rowKey];
38
+ var setKeys = _mapInstanceProperty(newData).call(newData, function (item, index) {
39
+ return typeof rowKey === "function" ? rowKey(item, index) : item[rowKey];
40
40
  });
41
41
  rowOnChange(setKeys, newData);
42
42
  onChange === null || onChange === void 0 || onChange(setKeys, newData);
@@ -121,6 +121,7 @@ var RowSelectionTitle = function RowSelectionTitle(_ref) {
121
121
  var RowSelectionBox = function RowSelectionBox(_ref5) {
122
122
  var data = _ref5.data,
123
123
  onChange = _ref5.onChange,
124
+ index = _ref5.index,
124
125
  getCheckboxProps = _ref5.getCheckboxProps;
125
126
  var _useHTableContext2 = context.useHTableContext(),
126
127
  selectedRowData = _useHTableContext2.selectedRowData,
@@ -131,7 +132,7 @@ var RowSelectionBox = function RowSelectionBox(_ref5) {
131
132
  rowData = _selectedRowData$rowD === void 0 ? [] : _selectedRowData$rowD,
132
133
  _selectedRowData$keys = _keysInstanceProperty(selectedRowData),
133
134
  keys = _selectedRowData$keys === void 0 ? [] : _selectedRowData$keys;
134
- var key = data[rowKey];
135
+ var key = typeof rowKey === "function" ? rowKey(data, index) : data[rowKey];
135
136
  var check = function check(e) {
136
137
  var checked = e.target.checked;
137
138
  var newKeys = _toConsumableArray(keys);
@@ -35,9 +35,10 @@ var rowSelectionCol = function rowSelectionCol(rowSelection) {
35
35
  width: 32,
36
36
  rowSelectionTitle: true,
37
37
  fixed: "left",
38
- render: function render(dom, data) {
38
+ render: function render(dom, data, index) {
39
39
  return jsxRuntime.jsx(RowSelection.RowSelectionBox, {
40
40
  data: data,
41
+ index: index,
41
42
  onChange: onChange,
42
43
  getCheckboxProps: getCheckboxProps
43
44
  });
@@ -2,7 +2,7 @@ import type { ProTableProps } from "@ant-design/pro-table";
2
2
  import type { ActionRenderFn, ConfigDataModal, ParamsModal, HTableInstance, HRowSelection } from "../modal";
3
3
  import React from "react";
4
4
  import type { AffixProps } from "antd/lib/affix";
5
- import { OptionConfig } from "@ant-design/pro-table/lib/components/ToolBar";
5
+ import type { OptionConfig } from "@ant-design/pro-table/lib/components/ToolBar";
6
6
  export interface OptionModal extends OptionConfig {
7
7
  settingRender?: () => React.ReactNode;
8
8
  }
@@ -34,11 +34,6 @@ var defaultRender = function defaultRender() {
34
34
  image: antd.Empty.PRESENTED_IMAGE_SIMPLE
35
35
  });
36
36
  };
37
- var contentStyle = {
38
- paddingLeft: 24,
39
- paddingRight: 24,
40
- paddingBottom: 16
41
- };
42
37
  var Body = (function (_ref) {
43
38
  var configData = _ref.configData,
44
39
  _ref$pagination = _ref.pagination,
@@ -71,11 +66,9 @@ var Body = (function (_ref) {
71
66
  tableInstance = _useHTableContext.tableInstance,
72
67
  contextConfigData = _useHTableContext.configData,
73
68
  data = _useHTableContext.data,
74
- selectedRowData = _useHTableContext.selectedRowData;
75
- _useHTableContext.rowOnChange;
76
- var error = _useHTableContext.error,
69
+ selectedRowData = _useHTableContext.selectedRowData,
70
+ error = _useHTableContext.error,
77
71
  loading = _useHTableContext.loading;
78
- _useHTableContext.allSelectChange;
79
72
  var _useHTableConfigConte = TableConfig.useHTableConfigContext({
80
73
  emptyRender: emptyRender,
81
74
  errorRender: errorRender
@@ -127,66 +120,73 @@ var Body = (function (_ref) {
127
120
  var defaultOptionsNode = optionsRender ? optionsRender(optionsNode) : optionsNode;
128
121
  var alwaysShowAlert = keys.length > 0 || selectAll || configAlwaysShowAlert;
129
122
  var className = index$1.useClassName("hw-table-body");
130
- return jsxRuntime.jsxs("div", {
131
- style: tableStyle,
123
+ var _useHTableConfigConte4 = TableConfig.useHTableConfigContext({
124
+ tableStyle: tableStyle
125
+ }),
126
+ defaultTableStyle = _useHTableConfigConte4.tableStyle;
127
+ return jsxRuntime.jsx("div", {
128
+ style: defaultTableStyle,
132
129
  className: "hw_table_body ".concat(className),
133
- children: [alwaysShowAlert && jsxRuntime.jsx("div", {
134
- style: contentStyle,
135
- children: jsxRuntime.jsx(antd.Alert, {
130
+ children: jsxRuntime.jsxs(antd.Space, {
131
+ size: 16,
132
+ direction: "vertical",
133
+ style: {
134
+ width: "100%"
135
+ },
136
+ children: [alwaysShowAlert && jsxRuntime.jsx(antd.Alert, {
136
137
  message: jsxRuntime.jsx(AlertMsg.default, {
137
138
  actionRender: actionRender
138
139
  }),
139
140
  type: "info"
140
- })
141
- }), jsxRuntime.jsx(index$2.default, {
142
- headerTitle: headerTitle,
143
- contentStyle: contentStyle,
144
- rNode: defaultOptionsNode
145
- }), jsxRuntime.jsxs(antd.ConfigProvider, {
146
- renderEmpty: function renderEmpty() {
147
- if (error) {
148
- return tableErrorRender === null || tableErrorRender === void 0 ? void 0 : tableErrorRender(tableInstance, error);
149
- }
150
- return tableEmptyRender === null || tableEmptyRender === void 0 ? void 0 : tableEmptyRender(tableInstance);
151
- },
152
- children: [jsxRuntime.jsx(ProTable, _objectSpread(_objectSpread({}, props), {}, {
153
- columnsState: _objectSpread(_objectSpread({}, selfColStatus), {}, {
154
- value: value
155
- }),
156
- columns: cols,
157
- size: cuSize,
158
- search: false,
159
- onChange: function onChange(page, filters, sorter) {
160
- if (localSorter) {
161
- return;
141
+ }), jsxRuntime.jsx(index$2.default, {
142
+ headerTitle: headerTitle,
143
+ rNode: defaultOptionsNode
144
+ }), jsxRuntime.jsxs(antd.ConfigProvider, {
145
+ renderEmpty: function renderEmpty() {
146
+ if (error) {
147
+ return tableErrorRender === null || tableErrorRender === void 0 ? void 0 : tableErrorRender(tableInstance, error);
162
148
  }
163
- var field = sorter.field,
164
- order = sorter.order;
165
- var orderByField = typeof order === "undefined" ? undefined : field;
166
- var asc = typeof order === "undefined" ? undefined : order === "ascend";
167
- tableInstance.table.reloadWithParams({
168
- current: 1,
169
- orderByField: orderByField,
170
- asc: asc
171
- });
172
- },
173
- tableStyle: {
174
- paddingBottom: 0
149
+ return tableEmptyRender === null || tableEmptyRender === void 0 ? void 0 : tableEmptyRender(tableInstance);
175
150
  },
176
- options: false,
177
- rowSelection: false,
178
- loading: loading,
179
- rowKey: rowKey,
180
- dataSource: records,
181
- pagination: false
182
- })), pagination !== false && jsxRuntime.jsx(index$3.default, _objectSpread({
183
- onPageChange: onPageChange,
184
- paginationStyle: paginationStyle,
185
- affixProps: affixProps,
186
- goTop: goTop,
187
- actionRender: paginationActionRender
188
- }, pagination))]
189
- })]
151
+ children: [jsxRuntime.jsx(ProTable, _objectSpread(_objectSpread({}, props), {}, {
152
+ columnsState: _objectSpread(_objectSpread({}, selfColStatus), {}, {
153
+ value: value
154
+ }),
155
+ columns: cols,
156
+ size: cuSize,
157
+ search: false,
158
+ onChange: function onChange(page, filters, sorter) {
159
+ if (localSorter) {
160
+ return;
161
+ }
162
+ var field = sorter.field,
163
+ order = sorter.order;
164
+ var orderByField = typeof order === "undefined" ? undefined : field;
165
+ var asc = typeof order === "undefined" ? undefined : order === "ascend";
166
+ tableInstance.table.reloadWithParams({
167
+ current: 1,
168
+ orderByField: orderByField,
169
+ asc: asc
170
+ });
171
+ },
172
+ tableStyle: {
173
+ paddingBottom: 0
174
+ },
175
+ options: false,
176
+ rowSelection: false,
177
+ loading: loading,
178
+ rowKey: rowKey,
179
+ dataSource: records,
180
+ pagination: false
181
+ })), pagination !== false && jsxRuntime.jsx(index$3.default, _objectSpread({
182
+ onPageChange: onPageChange,
183
+ paginationStyle: paginationStyle,
184
+ affixProps: affixProps,
185
+ goTop: goTop,
186
+ actionRender: paginationActionRender
187
+ }, pagination))]
188
+ })]
189
+ })
190
190
  });
191
191
  });
192
192
 
@@ -2,15 +2,6 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var _Object$keys = require('@babel/runtime-corejs3/core-js/object/keys');
6
- var _Object$getOwnPropertySymbols = require('@babel/runtime-corejs3/core-js/object/get-own-property-symbols');
7
- var _filterInstanceProperty = require('@babel/runtime-corejs3/core-js/instance/filter');
8
- var _Object$getOwnPropertyDescriptor = require('@babel/runtime-corejs3/core-js/object/get-own-property-descriptor');
9
- var _forEachInstanceProperty = require('@babel/runtime-corejs3/core-js/instance/for-each');
10
- var _Object$getOwnPropertyDescriptors = require('@babel/runtime-corejs3/core-js/object/get-own-property-descriptors');
11
- var _Object$defineProperties = require('@babel/runtime-corejs3/core-js/object/define-properties');
12
- var _Object$defineProperty = require('@babel/runtime-corejs3/core-js/object/define-property');
13
- var _defineProperty = require('@babel/runtime-corejs3/helpers/defineProperty');
14
5
  var jsxRuntime = require('react/jsx-runtime');
15
6
  var antd = require('antd');
16
7
  var context = require('../context.js');
@@ -18,9 +9,8 @@ var form = require('@hw-component/form');
18
9
  var index = require('../hooks/index.js');
19
10
  var hooks = require('./hooks.js');
20
11
  var Context = require('./Context.js');
12
+ var TableConfig = require('../TableConfig.js');
21
13
 
22
- 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; }
23
- 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; }
24
14
  var defaultSearchSpan = {
25
15
  xxl: 4,
26
16
  xl: 6,
@@ -56,11 +46,12 @@ var Header = (function (_ref) {
56
46
  var tableHideLabel = typeof hideLabel === "undefined" ? contextHideLabel : hideLabel;
57
47
  var tableLabelWidth = labelWidth || contextLabelWidth;
58
48
  var className = index.useClassName("hw-table-header");
49
+ var _useHTableConfigConte = TableConfig.useHTableConfigContext({
50
+ headerStyle: headerStyle
51
+ }),
52
+ defaultHeaderStyle = _useHTableConfigConte.headerStyle;
59
53
  return jsxRuntime.jsx(antd.Card, {
60
- style: _objectSpread({
61
- borderBottomLeftRadius: 0,
62
- borderBottomRightRadius: 0
63
- }, headerStyle),
54
+ style: defaultHeaderStyle,
64
55
  bordered: false,
65
56
  className: "hw_table_header ".concat(className),
66
57
  bodyStyle: {
@@ -21,6 +21,7 @@ var context = require('../context.js');
21
21
  var index = require('../hooks/index.js');
22
22
  var React = require('react');
23
23
  var index$1 = require('../GoTop/index.js');
24
+ var TableConfig = require('../TableConfig.js');
24
25
 
25
26
  var _excluded = ["onPageChange", "paginationStyle", "affixProps", "goTop", "actionRender"],
26
27
  _excluded2 = ["offsetBottom"];
@@ -53,12 +54,16 @@ var HTablePagination = (function (_ref) {
53
54
  if (!data) {
54
55
  return jsxRuntime.jsx(jsxRuntime.Fragment, {});
55
56
  }
57
+ var _useHTableConfigConte = TableConfig.useHTableConfigContext({
58
+ paginationStyle: paginationStyle
59
+ }),
60
+ defaultPaginationStyle = _useHTableConfigConte.paginationStyle;
56
61
  if (affixProps === false) {
57
62
  return jsxRuntime.jsxs(antd.Row, {
58
63
  justify: "space-between",
59
64
  align: "middle",
60
65
  className: className,
61
- style: paginationStyle,
66
+ style: defaultPaginationStyle,
62
67
  children: [jsxRuntime.jsx("div", {
63
68
  children: actionRender === null || actionRender === void 0 ? void 0 : actionRender(tableInstance)
64
69
  }), jsxRuntime.jsx(antd.Pagination, _objectSpread({
@@ -104,7 +109,7 @@ var HTablePagination = (function (_ref) {
104
109
  justify: "space-between",
105
110
  className: className,
106
111
  align: "middle",
107
- style: _objectSpread(_objectSpread({}, paginationStyle), style),
112
+ style: _objectSpread(_objectSpread({}, defaultPaginationStyle), style),
108
113
  children: [jsxRuntime.jsx("div", {
109
114
  children: actionRender === null || actionRender === void 0 ? void 0 : actionRender(tableInstance)
110
115
  }), jsxRuntime.jsx(antd.Pagination, _objectSpread({
package/lib/Table.js CHANGED
@@ -14,8 +14,8 @@ var _defineProperty = require('@babel/runtime-corejs3/helpers/defineProperty');
14
14
  var _slicedToArray = require('@babel/runtime-corejs3/helpers/slicedToArray');
15
15
  var _objectWithoutProperties = require('@babel/runtime-corejs3/helpers/objectWithoutProperties');
16
16
  var jsxRuntime = require('react/jsx-runtime');
17
- var index = require('./HTableHeader/index.js');
18
- var index$1 = require('./HTableBody/index.js');
17
+ var index$1 = require('./HTableHeader/index.js');
18
+ var index$2 = require('./HTableBody/index.js');
19
19
  var useCurrentTable = require('./hooks/useCurrentTable.js');
20
20
  var useRowObj = require('./hooks/useRowObj.js');
21
21
  var context = require('./context.js');
@@ -23,6 +23,7 @@ var antd = require('antd');
23
23
  var useReq = require('./hooks/useReq.js');
24
24
  var useDispatch = require('./hooks/useDispatch.js');
25
25
  var React = require('react');
26
+ var index = require('./hooks/index.js');
26
27
 
27
28
  var _excluded = ["request", "configData", "searchSpan", "table", "hideHeader", "headerStyle", "tableStyle", "action", "spaceSize", "className", "paginationStyle", "rowKey", "onFinish", "manual", "formInitValues", "hideLabel", "labelWidth", "onReset"];
28
29
  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; }
@@ -33,10 +34,8 @@ var Table = (function (_ref) {
33
34
  searchSpan = _ref.searchSpan,
34
35
  table = _ref.table,
35
36
  hideHeader = _ref.hideHeader,
36
- _ref$headerStyle = _ref.headerStyle,
37
- headerStyle = _ref$headerStyle === void 0 ? {} : _ref$headerStyle,
38
- _ref$tableStyle = _ref.tableStyle,
39
- tableStyle = _ref$tableStyle === void 0 ? {} : _ref$tableStyle,
37
+ headerStyle = _ref.headerStyle,
38
+ tableStyle = _ref.tableStyle,
40
39
  _ref$action = _ref.action,
41
40
  action = _ref$action === void 0 ? {} : _ref$action;
42
41
  _ref.spaceSize;
@@ -90,6 +89,7 @@ var Table = (function (_ref) {
90
89
  selectedRowData: selectedRowData,
91
90
  dataSource: data
92
91
  });
92
+ var contentClassName = index.useClassName("hw-table-content");
93
93
  return jsxRuntime.jsx(context.HTableContext.Provider, {
94
94
  value: {
95
95
  tableInstance: tableInstance,
@@ -121,13 +121,14 @@ var Table = (function (_ref) {
121
121
  style: {
122
122
  width: "100%"
123
123
  },
124
- children: [!hideHeader && jsxRuntime.jsx(index.default, {
124
+ className: contentClassName,
125
+ children: [!hideHeader && jsxRuntime.jsx(index$1.default, {
125
126
  searchSpan: searchSpan,
126
127
  headerStyle: headerStyle,
127
128
  onFinish: onFinish,
128
129
  initValues: formInitValues,
129
130
  onReset: onReset
130
- }), jsxRuntime.jsx(index$1.default, _objectSpread({
131
+ }), jsxRuntime.jsx(index$2.default, _objectSpread({
131
132
  tableStyle: hideHeader ? _objectSpread({
132
133
  paddingTop: 24
133
134
  }, tableStyle) : tableStyle,
@@ -3,11 +3,17 @@ import type { HTableInstance } from "src/components/modal";
3
3
  interface HTableConfigContextModal {
4
4
  emptyRender?: (table: HTableInstance) => React.ReactNode;
5
5
  errorRender?: (table: HTableInstance, error: Error) => React.ReactNode;
6
+ headerStyle?: React.CSSProperties;
7
+ tableStyle?: React.CSSProperties;
8
+ paginationStyle?: React.CSSProperties;
6
9
  }
7
10
  export declare const HTableConfigContext: React.Context<HTableConfigContextModal | null>;
8
- export declare const useHTableConfigContext: ({ emptyRender, errorRender, }: HTableConfigContextModal) => {
11
+ export declare const useHTableConfigContext: ({ emptyRender, errorRender, headerStyle, tableStyle, paginationStyle }: HTableConfigContextModal) => {
9
12
  errorRender: ((table: HTableInstance, error: Error) => React.ReactNode) | undefined;
10
13
  emptyRender: ((table: HTableInstance) => React.ReactNode) | undefined;
14
+ headerStyle: React.CSSProperties | undefined;
15
+ tableStyle: React.CSSProperties | undefined;
16
+ paginationStyle: React.CSSProperties | undefined;
11
17
  };
12
18
  declare const Index: React.FC<HTableConfigContextModal>;
13
19
  export default Index;
@@ -10,13 +10,22 @@ var _excluded = ["children"];
10
10
  var HTableConfigContext = /*#__PURE__*/React.createContext(null);
11
11
  var useHTableConfigContext = function useHTableConfigContext(_ref) {
12
12
  var emptyRender = _ref.emptyRender,
13
- errorRender = _ref.errorRender;
13
+ errorRender = _ref.errorRender,
14
+ headerStyle = _ref.headerStyle,
15
+ tableStyle = _ref.tableStyle,
16
+ paginationStyle = _ref.paginationStyle;
14
17
  var _ref2 = React.useContext(HTableConfigContext) || {},
15
18
  configErrorRender = _ref2.errorRender,
16
- configEmptyRender = _ref2.emptyRender;
19
+ configEmptyRender = _ref2.emptyRender,
20
+ configHeaderStyle = _ref2.headerStyle,
21
+ configTableStyle = _ref2.tableStyle,
22
+ configPaginationStyle = _ref2.paginationStyle;
17
23
  return {
18
24
  errorRender: errorRender || configErrorRender,
19
- emptyRender: emptyRender || configEmptyRender
25
+ emptyRender: emptyRender || configEmptyRender,
26
+ headerStyle: headerStyle || configHeaderStyle,
27
+ tableStyle: tableStyle || configTableStyle,
28
+ paginationStyle: paginationStyle || configPaginationStyle
20
29
  };
21
30
  };
22
31
  var Index = function Index(_ref3) {
package/lib/context.d.ts CHANGED
@@ -13,7 +13,6 @@ interface HContextModal extends Omit<HTableProps, "request"> {
13
13
  onFinish: (value: Record<string, any>) => Promise<any>;
14
14
  onPageChange: (value: Record<string, any>) => Promise<any>;
15
15
  setSelectedRowData: (row: RowObj) => void;
16
- rowKey?: string;
17
16
  headerOpen?: boolean;
18
17
  setHeaderOpen: Dispatch<SetStateAction<boolean | undefined>>;
19
18
  }
package/lib/index.css CHANGED
@@ -1,14 +1,28 @@
1
+ .ant-hw-table-content .ant-hw-table-body {
2
+ padding-top: 0px;
3
+ border-top-left-radius: 0px;
4
+ border-top-right-radius: 0px;
5
+ }
6
+ .ant-hw-table-content .ant-hw-table-header {
7
+ border-bottom-left-radius: 0px !important;
8
+ border-bottom-right-radius: 0px !important;
9
+ }
1
10
  .ant-hw-table-body {
2
- border-bottom-left-radius: 4px;
3
- border-bottom-right-radius: 4px;
4
11
  background-color: #fff;
5
12
  position: relative;
13
+ padding-right: 20px;
14
+ padding-left: 20px;
15
+ padding-top: 16px;
16
+ border-radius: 4px;
17
+ overflow: hidden;
6
18
  }
7
19
  .ant-hw-table-body .ant-hw-table-pagination {
8
20
  padding: 12px 24px;
9
21
  background-color: #ffffff;
10
22
  border-bottom-left-radius: 4px;
11
23
  border-bottom-right-radius: 4px;
24
+ margin-left: -20px;
25
+ margin-right: -20px;
12
26
  }
13
27
  .ant-hw-table-body .ant-hw-table-pagination .ant-select {
14
28
  width: auto;
@@ -19,8 +33,11 @@
19
33
  .ant-hw-table-body .ant-pro-table-list-toolbar-container {
20
34
  padding-top: 0px;
21
35
  }
36
+ .ant-hw-table-body .ant-pro-table > .ant-pro-card > .ant-pro-card-body {
37
+ padding: 0px;
38
+ }
22
39
  .ant-hw-table-pagination {
23
- padding: 24px;
40
+ padding: 20px;
24
41
  border-radius: 4px;
25
42
  background-color: #ffffff;
26
43
  position: relative;
@@ -37,13 +54,18 @@
37
54
  background-size: 100%;
38
55
  }
39
56
  .ant-hw-table-header {
40
- border-top-left-radius: 4px !important;
41
- border-top-right-radius: 4px !important;
57
+ border-radius: 4px !important;
42
58
  padding-bottom: 0px;
43
59
  }
44
60
  .ant-hw-table-header .ant-hw-table-header-item-hide {
45
61
  display: none;
46
62
  }
63
+ .ant-hw-table-header .ant-card-body {
64
+ padding: 24px 20px;
65
+ }
66
+ .ant-hw-table-header .ant-form-item {
67
+ margin-bottom: 16px;
68
+ }
47
69
  .ant-hw-table-body-option-icon {
48
70
  font-size: 16px;
49
71
  }
package/lib/modal.d.ts CHANGED
@@ -6,7 +6,7 @@ import type React from "react";
6
6
  import type { ModalProps } from "antd";
7
7
  import type { TableProps } from "antd/lib/table";
8
8
  import type { AffixProps } from "antd/lib/affix";
9
- import { OptionModal } from "./HTableBody";
9
+ import type { OptionModal } from "./HTableBody";
10
10
  export interface RowObj {
11
11
  keys?: React.Key[];
12
12
  rowData?: any[];
@@ -42,6 +42,7 @@ export type actionFn = (...arg: any[]) => void;
42
42
  export interface RowSelectionOuter {
43
43
  allPageCheck?: boolean;
44
44
  }
45
+ type RowKeyFn = (data: any, index: number) => string;
45
46
  export type HRowSelection = RowSelectionOuter & (TableProps<any>["rowSelection"] & {
46
47
  alwaysShowAlert?: boolean;
47
48
  });
@@ -64,7 +65,7 @@ export interface HTableProps extends Omit<ProTableProps<any, any>, "request" | "
64
65
  manual?: boolean;
65
66
  dataSource?: ResultModal;
66
67
  paginationStyle?: React.CSSProperties;
67
- rowKey?: string;
68
+ rowKey?: string | RowKeyFn;
68
69
  allPageCheck?: boolean;
69
70
  rowSelection?: HRowSelection | false;
70
71
  affixProps?: AffixProps | false;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hw-component/table",
3
- "version": "1.2.1",
3
+ "version": "1.2.3",
4
4
  "description": "基于antd二次开发table组件",
5
5
  "keywords": [
6
6
  "table"
@@ -79,27 +79,33 @@ export default ({
79
79
  </Tooltip>
80
80
  )}
81
81
  <Popover
82
- content={
83
- <ColsSettingContent
84
- columns={columns}
85
- checkKeys={checkKeys}
86
- onCheck={onChange}
87
- />
88
- }
89
- title={
90
- <Title
91
- columns={columns}
92
- reset={reset}
93
- checkKeys={checkKeys}
94
- onCheck={onChange}
95
- />
96
- }
97
- placement="bottomRight"
98
- getPopupContainer={() => ref.current || document.body}
99
- arrowPointAtCenter
100
- trigger="click"
82
+ content={
83
+ <ColsSettingContent
84
+ columns={columns}
85
+ checkKeys={checkKeys}
86
+ onCheck={onChange}
87
+ />
88
+ }
89
+ title={
90
+ <Title
91
+ columns={columns}
92
+ reset={reset}
93
+ checkKeys={checkKeys}
94
+ onCheck={onChange}
95
+ />
96
+ }
97
+ placement="bottomRight"
98
+ getPopupContainer={() => ref.current || document.body}
99
+ arrowPointAtCenter
100
+ trigger="click"
101
101
  >
102
- {settingRender?settingRender():<Tooltip title="列设置"><SettingOutlined className={pointer} width={24} /></Tooltip>}
102
+ {settingRender ? (
103
+ settingRender()
104
+ ) : (
105
+ <Tooltip title="列设置">
106
+ <SettingOutlined className={pointer} width={24} />
107
+ </Tooltip>
108
+ )}
103
109
  </Popover>
104
110
  </Space>
105
111
  </Row>