@kep-platform/business-component 0.0.28 → 0.0.32

Sign up to get free protection for your applications and to get access to all the features.
@@ -0,0 +1,25 @@
1
+ import React, { ReactNode } from 'react';
2
+ export interface ColumnType {
3
+ title: ReactNode;
4
+ dataIndex: string;
5
+ key: string;
6
+ align?: 'center' | 'left' | 'right';
7
+ width: number;
8
+ offset?: number;
9
+ hideInTable?: boolean;
10
+ sorter?: 'desc' | 'asc' | null;
11
+ type?: CellType;
12
+ render?: (text: any, record: any, index: number) => ReactNode;
13
+ editable?: boolean;
14
+ sticky?: 'left' | 'right';
15
+ filterValue?: string | null;
16
+ }
17
+ type CellType = 'string' | 'number' | 'date' | 'image' | 'icon';
18
+ export declare function ConfigColumnsModal(props: {
19
+ columns: ColumnType[];
20
+ open: boolean;
21
+ onClose: () => void;
22
+ onConfirm: (columns: ColumnType[]) => void;
23
+ title?: string;
24
+ }): React.JSX.Element;
25
+ export {};
@@ -0,0 +1,172 @@
1
+ function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
2
+ 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."); }
3
+ function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
4
+ function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
5
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
6
+ 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."); }
7
+ 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); }
8
+ 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; }
9
+ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
10
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
11
+ //用来配置表格列的表格字段,支持拖动排序功能,勾选和取消
12
+
13
+ import { CloseCircleOutlined } from '@ant-design/icons';
14
+ import { Card, Col, Modal, Row, Space, Tag } from 'antd';
15
+ import React, { useEffect, useRef, useState } from 'react';
16
+ import { DndProvider, useDrag, useDrop } from 'react-dnd';
17
+ import { HTML5Backend } from 'react-dnd-html5-backend';
18
+ function DragListItem(props) {
19
+ var item = props.item,
20
+ index = props.index,
21
+ handleDrag = props.handleDrag,
22
+ handleClose = props.handleClose;
23
+ var ref = useRef(null);
24
+ var _useDrop = useDrop({
25
+ accept: 'drag-item',
26
+ hover: function hover(item, monitor) {
27
+ if (!ref.current) return;
28
+ var dragIndex = item.index;
29
+ var hoverIndex = index;
30
+ // Do nothing if target and source are same
31
+ if (dragIndex === hoverIndex) return;
32
+ var hoverRect = ref.current.getBoundingClientRect();
33
+ // Get vertical middle
34
+ var hoverMiddleY = (hoverRect.bottom - hoverRect.top) / 2;
35
+ // Determine mouse position
36
+ var clientOffset = monitor.getClientOffset();
37
+ if (!clientOffset) return;
38
+ // Get pixels to the top
39
+ var hoverClientY = clientOffset.y - hoverRect.top;
40
+
41
+ // Only move when the mouse has crossed half of the items height
42
+ if (dragIndex < hoverIndex && hoverClientY < hoverMiddleY) {
43
+ return;
44
+ }
45
+ if (dragIndex > hoverIndex && hoverClientY > hoverMiddleY) {
46
+ return;
47
+ }
48
+ handleDrag(dragIndex, hoverIndex);
49
+ item.index = hoverIndex;
50
+ }
51
+ }),
52
+ _useDrop2 = _slicedToArray(_useDrop, 2),
53
+ drop = _useDrop2[1];
54
+ var _useDrag = useDrag({
55
+ type: 'drag-item',
56
+ item: {
57
+ item: item,
58
+ index: index
59
+ }
60
+ }, [item, index]),
61
+ _useDrag2 = _slicedToArray(_useDrag, 2),
62
+ drag = _useDrag2[1];
63
+ useEffect(function () {
64
+ drop(drag(ref));
65
+ }, []);
66
+ return /*#__PURE__*/React.createElement("li", {
67
+ ref: ref
68
+ }, /*#__PURE__*/React.createElement(Card, {
69
+ style: {
70
+ position: 'relative'
71
+ }
72
+ }, /*#__PURE__*/React.createElement(CloseCircleOutlined, {
73
+ onClick: function onClick() {
74
+ handleClose(item.key);
75
+ },
76
+ style: {
77
+ position: 'absolute',
78
+ right: '7px',
79
+ top: '7px',
80
+ color: 'red'
81
+ }
82
+ }), /*#__PURE__*/React.createElement("strong", null, item.title)));
83
+ }
84
+ export function ConfigColumnsModal(props) {
85
+ var columns = props.columns,
86
+ open = props.open,
87
+ onClose = props.onClose,
88
+ onConfirm = props.onConfirm,
89
+ title = props.title;
90
+ var _useState = useState(columns.filter(function (item) {
91
+ return !item.hideInTable;
92
+ })),
93
+ _useState2 = _slicedToArray(_useState, 2),
94
+ columnsUpdate = _useState2[0],
95
+ setColumnsUpdate = _useState2[1];
96
+ var _useState3 = useState(columns.filter(function (column) {
97
+ return !columnsUpdate.includes(column);
98
+ })),
99
+ _useState4 = _slicedToArray(_useState3, 2),
100
+ columnsHidden = _useState4[0],
101
+ setColumnsHidden = _useState4[1];
102
+ var handleDrag = function handleDrag(dragIndex, hoverIndex) {
103
+ setColumnsUpdate(function (prev) {
104
+ var copy = _toConsumableArray(prev);
105
+ var card = copy[dragIndex];
106
+ // remove origin
107
+ copy.splice(dragIndex, 1);
108
+ // add to target
109
+ copy.splice(hoverIndex, 0, card);
110
+ return copy;
111
+ });
112
+ };
113
+ var handleClose = function handleClose(key) {
114
+ setColumnsUpdate(columnsUpdate.filter(function (column) {
115
+ return column.key !== key;
116
+ }));
117
+ var deleteColumn = columns.find(function (column) {
118
+ return column.key === key;
119
+ });
120
+ setColumnsHidden(columnsHidden.concat(deleteColumn));
121
+ };
122
+ return /*#__PURE__*/React.createElement(Modal, {
123
+ title: title || '配置表格列',
124
+ open: open,
125
+ width: 600,
126
+ onCancel: onClose,
127
+ onOk: function onOk() {
128
+ columnsUpdate.forEach(function (column) {
129
+ column.hideInTable = false;
130
+ });
131
+ columnsHidden.forEach(function (column) {
132
+ column.hideInTable = true;
133
+ });
134
+ onConfirm(columnsUpdate.concat.apply(columnsUpdate, _toConsumableArray(columnsHidden)));
135
+ },
136
+ okText: "\u786E\u8BA4",
137
+ cancelText: "\u53D6\u6D88"
138
+ }, /*#__PURE__*/React.createElement(Row, null, /*#__PURE__*/React.createElement(Col, {
139
+ span: 3
140
+ }, /*#__PURE__*/React.createElement("strong", null, "\u9690\u85CF\u7684\u5217")), /*#__PURE__*/React.createElement(Col, {
141
+ span: 21
142
+ }, /*#__PURE__*/React.createElement(Space, null, columnsHidden.map(function (column) {
143
+ return /*#__PURE__*/React.createElement(Tag, {
144
+ style: {
145
+ cursor: 'pointer'
146
+ },
147
+ key: column.key,
148
+ onClick: function onClick() {
149
+ setColumnsUpdate(columnsUpdate.concat(column));
150
+ setColumnsHidden(columnsHidden.filter(function (c) {
151
+ return c.key !== column.key;
152
+ }));
153
+ }
154
+ }, column.title);
155
+ })))), /*#__PURE__*/React.createElement(DndProvider, {
156
+ backend: HTML5Backend
157
+ }, /*#__PURE__*/React.createElement("ul", {
158
+ style: {
159
+ listStyle: 'none',
160
+ padding: '0',
161
+ paddingTop: '12px'
162
+ }
163
+ }, columnsUpdate.map(function (column, index) {
164
+ return /*#__PURE__*/React.createElement(DragListItem, {
165
+ item: column,
166
+ key: column.key,
167
+ index: index,
168
+ handleDrag: handleDrag,
169
+ handleClose: handleClose
170
+ });
171
+ }))));
172
+ }
@@ -0,0 +1,45 @@
1
+ declare const _default: {
2
+ columns: ({
3
+ key: string;
4
+ title: string;
5
+ align: string;
6
+ type: string;
7
+ allowGroup: boolean;
8
+ dataIndex: string;
9
+ render: {
10
+ __isFunction__: boolean;
11
+ source: string;
12
+ };
13
+ } | {
14
+ key: string;
15
+ title: string;
16
+ dataIndex: string;
17
+ align: string;
18
+ type: string;
19
+ allowGroup?: undefined;
20
+ render?: undefined;
21
+ })[];
22
+ title: string;
23
+ actions: string[];
24
+ request: {
25
+ url: string;
26
+ method: string;
27
+ params: {
28
+ username: {
29
+ type: string;
30
+ required: boolean;
31
+ max: number;
32
+ };
33
+ age: {
34
+ type: string;
35
+ min: number;
36
+ max: number;
37
+ };
38
+ email: {
39
+ type: string;
40
+ required: boolean;
41
+ };
42
+ };
43
+ };
44
+ };
45
+ export default _default;
@@ -0,0 +1,64 @@
1
+ export default {
2
+ //列定义
3
+ columns: [{
4
+ key: 'name',
5
+ title: '名称',
6
+ align: 'center',
7
+ type: 'string',
8
+ allowGroup: true,
9
+ dataIndex: 'name',
10
+ render: {
11
+ __isFunction__: true,
12
+ source: 'function render(value) {\n return value + 1;\n }'
13
+ }
14
+ }, {
15
+ key: 'number',
16
+ title: '编号',
17
+ dataIndex: 'number',
18
+ align: 'center',
19
+ type: 'string'
20
+ }, {
21
+ key: 'version',
22
+ title: '版本',
23
+ dataIndex: 'version',
24
+ align: 'center',
25
+ type: 'string'
26
+ }, {
27
+ key: 'checkOutStatus',
28
+ title: '检入检出状态',
29
+ dataIndex: 'checkOutStatus',
30
+ align: 'center',
31
+ type: 'string'
32
+ }, {
33
+ key: 'owner',
34
+ title: '创建者',
35
+ dataIndex: 'owner',
36
+ align: 'center',
37
+ type: 'string'
38
+ }],
39
+ title: '零件',
40
+ //表格标题
41
+ actions: ['配置表格列', '分组'],
42
+ //可能的操作项,这个是预先开发好的
43
+ //接口描述
44
+ request: {
45
+ url: 'http://ao.renrunqi.com/service-icapp/search/advance',
46
+ method: 'post',
47
+ params: {
48
+ username: {
49
+ type: 'string',
50
+ required: true,
51
+ max: 20
52
+ },
53
+ age: {
54
+ type: 'number',
55
+ min: 18,
56
+ max: 100
57
+ },
58
+ email: {
59
+ type: 'email',
60
+ required: true
61
+ }
62
+ }
63
+ }
64
+ };
@@ -0,0 +1,7 @@
1
+ import React from 'react';
2
+ type ConfigTableProps = {
3
+ tableId: string;
4
+ [key: string]: any;
5
+ };
6
+ export default function ConfigTable(props: ConfigTableProps): React.JSX.Element;
7
+ export {};
@@ -0,0 +1,232 @@
1
+ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
2
+ var _excluded = ["tableId"];
3
+ function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
4
+ 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."); }
5
+ function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
6
+ function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
7
+ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
8
+ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
9
+ function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
10
+ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
11
+ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
12
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
13
+ 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."); }
14
+ 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); }
15
+ 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; }
16
+ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
17
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
18
+ function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
19
+ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
20
+ import { Button, Space, Spin, Table } from '@kep-platform/basic-component';
21
+ import { Card, Select, Tag } from 'antd';
22
+ import axios from 'axios';
23
+ import React, { useEffect, useMemo, useState } from 'react';
24
+ import { ConfigColumnsModal } from "../ConfigColumnsModal";
25
+ import configJson from "./config";
26
+ import { allGroup, deserialize, getGroupFromList, serialize } from "./utils";
27
+ var mockDataSource = [{
28
+ name: '姜鑫',
29
+ number: 'jx',
30
+ version: '0.0.1',
31
+ checkOutStatus: 'c/i'
32
+ }, {
33
+ name: 'jss',
34
+ number: 'jss',
35
+ version: '0.0.2',
36
+ checkOutStatus: 'c/i'
37
+ }];
38
+ export default function ConfigTable(props) {
39
+ var tableId = props.tableId,
40
+ context = _objectWithoutProperties(props, _excluded);
41
+ var _useState = useState(null),
42
+ _useState2 = _slicedToArray(_useState, 2),
43
+ config = _useState2[0],
44
+ setConfig = _useState2[1];
45
+ var _useState3 = useState(false),
46
+ _useState4 = _slicedToArray(_useState3, 2),
47
+ fetchConfigLoading = _useState4[0],
48
+ setFetchConfigLoading = _useState4[1];
49
+ var _useState5 = useState(false),
50
+ _useState6 = _slicedToArray(_useState5, 2),
51
+ fetchDataSourceLoading = _useState6[0],
52
+ setFetchDataSourceLoading = _useState6[1];
53
+ var _useState7 = useState([]),
54
+ _useState8 = _slicedToArray(_useState7, 2),
55
+ dataSource = _useState8[0],
56
+ setDataSource = _useState8[1];
57
+ var _useState9 = useState(false),
58
+ _useState10 = _slicedToArray(_useState9, 2),
59
+ configColumnsModalOpen = _useState10[0],
60
+ setConfigColumnsModalOpen = _useState10[1];
61
+ var _useState11 = useState(allGroup),
62
+ _useState12 = _slicedToArray(_useState11, 2),
63
+ activeGroupItem = _useState12[0],
64
+ setActiveGroupItem = _useState12[1];
65
+ var _useState13 = useState(null),
66
+ _useState14 = _slicedToArray(_useState13, 2),
67
+ groupBy = _useState14[0],
68
+ setGroupBy = _useState14[1];
69
+ var _useState15 = useState({
70
+ current: 1,
71
+ pageSize: 10
72
+ }),
73
+ _useState16 = _slicedToArray(_useState15, 2),
74
+ pagination = _useState16[0],
75
+ setPagination = _useState16[1];
76
+ var groupMap = useMemo(function () {
77
+ if (!groupBy) return null;
78
+ var map = getGroupFromList(dataSource, groupBy.value);
79
+ return map;
80
+ }, [dataSource, groupBy]);
81
+ var formatDataSource = useMemo(function () {
82
+ if (groupMap && activeGroupItem) {
83
+ return groupMap[activeGroupItem] || [];
84
+ } else {
85
+ return dataSource;
86
+ }
87
+ }, [groupMap, dataSource, activeGroupItem]);
88
+ function fetchConfigJson(tableId) {
89
+ console.log(tableId);
90
+ setFetchConfigLoading(true);
91
+ return new Promise(function () {
92
+ setTimeout(function () {
93
+ setFetchConfigLoading(false);
94
+ setConfig(deserialize(serialize(configJson)));
95
+ }, 1000);
96
+ });
97
+ }
98
+ function fetchDataSource(config, pagination) {
99
+ var _config$request = config.request,
100
+ url = _config$request.url,
101
+ method = _config$request.method,
102
+ data = _config$request.data,
103
+ params = _config$request.params;
104
+ console.log(pagination);
105
+ setFetchDataSourceLoading(true);
106
+ axios(url, {
107
+ method: method,
108
+ params: params ? _objectSpread(_objectSpread({}, params), context) : undefined,
109
+ data: data ? _objectSpread(_objectSpread({}, data), context) : undefined
110
+ }).then(function (resp) {
111
+ setFetchDataSourceLoading(false);
112
+ console.log(resp);
113
+ setDataSource(mockDataSource);
114
+ }, function (error) {
115
+ console.log(error.message);
116
+ setFetchDataSourceLoading(false);
117
+ setDataSource(mockDataSource);
118
+ });
119
+ }
120
+ useEffect(function () {
121
+ fetchConfigJson(tableId);
122
+ }, [tableId]);
123
+ useEffect(function () {
124
+ if (config) {
125
+ fetchDataSource(config, pagination);
126
+ }
127
+ }, [config, pagination]);
128
+ useEffect(function () {
129
+ setActiveGroupItem(allGroup);
130
+ }, [groupMap]);
131
+ var groupOptions = useMemo(function () {
132
+ if (config) {
133
+ return config.columns.filter(function (column) {
134
+ return column.allowGroup;
135
+ }).map(function (column) {
136
+ return {
137
+ label: column.title,
138
+ value: column.key
139
+ };
140
+ });
141
+ } else {
142
+ return [];
143
+ }
144
+ }, [config]);
145
+ var actions = useMemo(function () {
146
+ if (config !== null && config !== void 0 && config.actions) {
147
+ return config.actions.map(function (action) {
148
+ switch (action) {
149
+ case '配置表格列':
150
+ return /*#__PURE__*/React.createElement(Button, {
151
+ onClick: function onClick() {
152
+ setConfigColumnsModalOpen(true);
153
+ }
154
+ }, "\u914D\u7F6E\u8868\u683C\u5217");
155
+ case '分组':
156
+ return /*#__PURE__*/React.createElement(Select, {
157
+ value: groupBy === null || groupBy === void 0 ? void 0 : groupBy.value,
158
+ options: groupOptions,
159
+ placeholder: "\u9009\u62E9\u5206\u7EC4\u89C4\u5219",
160
+ onSelect: function onSelect(value, option) {
161
+ setGroupBy(option);
162
+ }
163
+ });
164
+ default:
165
+ return false;
166
+ }
167
+ });
168
+ }
169
+ }, [config, groupBy]);
170
+ var title = useMemo(function () {
171
+ if (config && groupBy && groupMap) {
172
+ var _groupOptions$find;
173
+ return /*#__PURE__*/React.createElement(Space, null, groupBy.value && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("span", null, "\u6839\u636E"), /*#__PURE__*/React.createElement(Tag, null, (_groupOptions$find = groupOptions.find(function (option) {
174
+ return option.value === groupBy.value;
175
+ })) === null || _groupOptions$find === void 0 ? void 0 : _groupOptions$find.label), /*#__PURE__*/React.createElement("span", null, "\u5206\u7EC4:")), /*#__PURE__*/React.createElement(Tag, {
176
+ color: activeGroupItem === allGroup ? 'blue' : 'default',
177
+ onClick: function onClick() {
178
+ setActiveGroupItem(allGroup);
179
+ },
180
+ hidden: !groupBy
181
+ }, "\u5168\u90E8"), Object.keys(groupMap).map(function (key) {
182
+ return /*#__PURE__*/React.createElement(Tag, {
183
+ onClick: function onClick() {
184
+ setActiveGroupItem(key);
185
+ },
186
+ key: key,
187
+ color: activeGroupItem === key ? 'blue' : 'default'
188
+ }, key);
189
+ }));
190
+ } else {
191
+ return '';
192
+ }
193
+ }, [groupBy, config, activeGroupItem]);
194
+ return /*#__PURE__*/React.createElement(Card, null, /*#__PURE__*/React.createElement(Spin, {
195
+ spinning: fetchConfigLoading || fetchDataSourceLoading
196
+ }, /*#__PURE__*/React.createElement("h5", null, title), config ? /*#__PURE__*/React.createElement(Table, {
197
+ dataSource: formatDataSource,
198
+ actions: actions,
199
+ columns: [{
200
+ key: 'order',
201
+ dataIndex: 'order',
202
+ title: '序号',
203
+ width: 70,
204
+ render: function render(_, __, index) {
205
+ return (pagination.current - 1) * pagination.pageSize + index + 1;
206
+ },
207
+ align: 'center'
208
+ }].concat(_toConsumableArray(config.columns)),
209
+ rowKey: 'oid',
210
+ pagination: pagination,
211
+ onChange: function onChange(_p) {
212
+ setPagination(_p);
213
+ },
214
+ empty: /*#__PURE__*/React.createElement("div", {
215
+ style: {
216
+ textAlign: 'center',
217
+ padding: '24px',
218
+ color: '#777'
219
+ }
220
+ }, "\u6682\u65E0\u6570\u636E")
221
+ }) : /*#__PURE__*/React.createElement("div", null, "\u914D\u7F6E\u6587\u4EF6\u52A0\u8F7D\u4E2D..."), configColumnsModalOpen && config && /*#__PURE__*/React.createElement(ConfigColumnsModal, {
222
+ columns: config.columns,
223
+ open: configColumnsModalOpen,
224
+ onClose: function onClose() {
225
+ setConfigColumnsModalOpen(false);
226
+ },
227
+ onConfirm: function onConfirm(columns) {
228
+ config.columns = columns;
229
+ setConfigColumnsModalOpen(false);
230
+ }
231
+ })));
232
+ }
@@ -0,0 +1,2 @@
1
+ import React from 'react';
2
+ export default function Test(): React.JSX.Element;
@@ -0,0 +1,10 @@
1
+ import { GlobalStyles } from '@kep-platform/basic-component';
2
+ import React from 'react';
3
+ import ConfigTable from '.';
4
+ export default function Test() {
5
+ return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(GlobalStyles, {
6
+ $css: []
7
+ }), /*#__PURE__*/React.createElement(ConfigTable, {
8
+ tableId: "name"
9
+ }));
10
+ }
@@ -0,0 +1,4 @@
1
+ export declare function serialize(obj: Record<string, any>): string;
2
+ export declare function deserialize(serializedStr: string): any;
3
+ export declare const allGroup: unique symbol;
4
+ export declare function getGroupFromList(arr: Record<string | symbol, any>[], propertyName: string): Record<string | symbol, Record<string, any>[]>;
@@ -0,0 +1,40 @@
1
+ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
2
+ function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
3
+ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
4
+ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
5
+ // 自定义序列化函数
6
+ export function serialize(obj) {
7
+ return JSON.stringify(obj, function (key, value) {
8
+ if (typeof value === 'function') {
9
+ return {
10
+ __isFunction__: true,
11
+ source: value.toString()
12
+ };
13
+ }
14
+ return value;
15
+ });
16
+ }
17
+
18
+ // 自定义反序列化函数
19
+ export function deserialize(serializedStr) {
20
+ return JSON.parse(serializedStr, function (key, value) {
21
+ if (value && value.__isFunction__) {
22
+ return new Function('return ' + value.source)();
23
+ }
24
+ return value;
25
+ });
26
+ }
27
+ export var allGroup = Symbol('全部');
28
+ export function getGroupFromList(arr, propertyName) {
29
+ var grouped = arr.reduce(function (acc, obj) {
30
+ var key = obj[propertyName];
31
+ if (key) {
32
+ if (!acc[key]) {
33
+ acc[key] = [];
34
+ }
35
+ acc[key].push(obj);
36
+ } else {}
37
+ return acc;
38
+ }, _defineProperty({}, allGroup, arr));
39
+ return grouped;
40
+ }
@@ -0,0 +1,20 @@
1
+ import { ReactNode } from 'react';
2
+ type ColumnType = {
3
+ key: string;
4
+ dataIndex: string;
5
+ title: string;
6
+ align: 'left' | 'right' | 'center';
7
+ type: 'icon' | 'string' | 'date' | 'number';
8
+ render?: (value: any, record: any, index: number) => ReactNode;
9
+ fixed?: 'left' | 'right';
10
+ filter?: boolean;
11
+ sorter?: boolean;
12
+ allowGroup?: boolean;
13
+ };
14
+ type Action = '配置表格列';
15
+ type TableInfoType = {
16
+ columns: ColumnType[];
17
+ actions: Action[];
18
+ };
19
+ export declare function getTableInfoByTableId(id: string): TableInfoType;
20
+ export {};
@@ -0,0 +1,22 @@
1
+ var tableId = 'table-1';
2
+ export function getTableInfoByTableId(id) {
3
+ console.log(id);
4
+ var tableInfo = {
5
+ columns: [{
6
+ key: 'name',
7
+ title: 'name',
8
+ align: 'center',
9
+ type: 'string',
10
+ dataIndex: 'name'
11
+ }, {
12
+ key: 'number',
13
+ title: 'number',
14
+ dataIndex: 'number',
15
+ align: 'center',
16
+ type: 'string'
17
+ }],
18
+ actions: ['配置表格列']
19
+ };
20
+ return tableInfo;
21
+ }
22
+ console.log(JSON.stringify(getTableInfoByTableId(tableId)));
package/package.json CHANGED
@@ -1,77 +1,82 @@
1
1
  {
2
- "name": "@kep-platform/business-component",
3
- "version": "0.0.28",
4
- "description": "A react library developed with dumi",
5
- "module": "dist/index.js",
6
- "types": "dist/index.d.ts",
7
- "scripts": {
8
- "start": "npm run dev",
9
- "dev": "dumi dev",
10
- "build": "father build",
11
- "build:watch": "father dev",
12
- "docs:build": "dumi build",
13
- "docs:preview": "dumi preview",
14
- "prepare": "dumi setup",
15
- "doctor": "father doctor",
16
- "lint": "npm run lint:es && npm run lint:css",
17
- "lint:css": "stylelint \"{src,test}/**/*.{css,less}\"",
18
- "lint:es": "eslint \"{src,test}/**/*.{js,jsx,ts,tsx}\"",
19
- "prepublishOnly": "father doctor && npm run build"
20
- },
21
- "authors": [],
22
- "license": "MIT",
23
- "files": [
24
- "dist"
25
- ],
26
- "commitlint": {
27
- "extends": [
28
- "@commitlint/config-conventional"
29
- ]
30
- },
31
- "lint-staged": {
32
- "*.{md,json}": [
33
- "prettier --write --no-error-on-unmatched-pattern"
2
+ "name": "@kep-platform/business-component",
3
+ "version": "0.0.32",
4
+ "description": "A react library developed with dumi",
5
+ "license": "MIT",
6
+ "module": "dist/index.js",
7
+ "types": "dist/index.d.ts",
8
+ "files": [
9
+ "dist"
34
10
  ],
35
- "*.{css,less}": [
36
- "stylelint --fix",
37
- "prettier --write"
38
- ],
39
- "*.{js,jsx}": [
40
- "eslint --fix",
41
- "prettier --write"
42
- ],
43
- "*.{ts,tsx}": [
44
- "eslint --fix",
45
- "prettier --parser=typescript --write"
46
- ]
47
- },
48
- "publishConfig": {
49
- "access": "public"
50
- },
51
- "peerDependencies": {
52
- "react": ">=16.9.0",
53
- "react-dom": ">=16.9.0"
54
- },
55
- "devDependencies": {
56
- "@commitlint/cli": "^17.1.2",
57
- "@commitlint/config-conventional": "^17.1.0",
58
- "@types/react": "^18.0.0",
59
- "@types/react-dom": "^18.0.0",
60
- "@umijs/lint": "^4.0.0",
61
- "dumi": "^2.3.0",
62
- "eslint": "^8.23.0",
63
- "father": "^4.1.0",
64
- "husky": "^8.0.1",
65
- "lint-staged": "^13.0.3",
66
- "prettier": "^2.7.1",
67
- "prettier-plugin-organize-imports": "^3.0.0",
68
- "prettier-plugin-packagejson": "^2.2.18",
69
- "react": "^18.0.0",
70
- "react-dom": "^18.0.0",
71
- "stylelint": "^14.9.1"
72
- },
73
- "gitHead": "199e06d46f67de10c87f790fc5c704666a0eb288",
74
- "dependencies": {
75
- "@kep-platform/basic-component": "^0.0.28"
76
- }
11
+ "scripts": {
12
+ "build": "father build",
13
+ "build:watch": "father dev",
14
+ "dev": "dumi dev",
15
+ "docs:build": "dumi build",
16
+ "docs:preview": "dumi preview",
17
+ "doctor": "father doctor",
18
+ "lint": "npm run lint:es && npm run lint:css",
19
+ "lint:css": "stylelint \"{src,test}/**/*.{css,less}\"",
20
+ "lint:es": "eslint \"{src,test}/**/*.{js,jsx,ts,tsx}\"",
21
+ "prepare": "dumi setup",
22
+ "prepublishOnly": "npm run build",
23
+ "start": "npm run dev"
24
+ },
25
+ "commitlint": {
26
+ "extends": [
27
+ "@commitlint/config-conventional"
28
+ ]
29
+ },
30
+ "lint-staged": {
31
+ "*.{md,json}": [
32
+ "prettier --write --no-error-on-unmatched-pattern"
33
+ ],
34
+ "*.{css,less}": [
35
+ "stylelint --fix",
36
+ "prettier --write"
37
+ ],
38
+ "*.{js,jsx}": [
39
+ "eslint --fix",
40
+ "prettier --write"
41
+ ],
42
+ "*.{ts,tsx}": [
43
+ "eslint --fix",
44
+ "prettier --parser=typescript --write"
45
+ ]
46
+ },
47
+ "dependencies": {
48
+ "@kep-platform/basic-component": "^0.0.32"
49
+ },
50
+ "devDependencies": {
51
+ "@commitlint/cli": "^17.1.2",
52
+ "@commitlint/config-conventional": "^17.1.0",
53
+ "@types/react": "^18.0.0",
54
+ "@types/react-dom": "^18.0.0",
55
+ "@umijs/lint": "^4.0.0",
56
+ "dumi": "^2.3.0",
57
+ "eslint": "^8.23.0",
58
+ "father": "^4.1.0",
59
+ "husky": "^8.0.1",
60
+ "lint-staged": "^13.0.3",
61
+ "prettier": "^2.7.1",
62
+ "prettier-plugin-organize-imports": "^3.0.0",
63
+ "prettier-plugin-packagejson": "^2.2.18",
64
+ "react": "^18.0.0",
65
+ "react-dom": "^18.0.0",
66
+ "stylelint": "^14.9.1"
67
+ },
68
+ "peerDependencies": {
69
+ "@ant-design/icons": ">=5.0.0",
70
+ "antd": ">=5.0.0",
71
+ "axios": ">=1.0.0",
72
+ "react": ">=16.9.0",
73
+ "react-dnd": ">=16.0.1",
74
+ "react-dnd-html5-backend": ">=16.0.1",
75
+ "react-dom": ">=16.9.0"
76
+ },
77
+ "publishConfig": {
78
+ "access": "public"
79
+ },
80
+ "authors": [],
81
+ "gitHead": "581914abdd5785a77fa0400eb7cce9f25e07eabf"
77
82
  }