@arim-aisdc/public-components 0.0.58 → 0.0.59
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.
- package/dist/components/Filter/FilterColor/index.d.ts +14 -0
- package/dist/components/Filter/FilterColor/index.js +97 -0
- package/dist/components/Filter/FilterColor/index.less +106 -0
- package/dist/components/Filter/FilterInputNumber/index.d.ts +17 -0
- package/dist/components/Filter/FilterInputNumber/index.js +52 -0
- package/dist/components/Filter/FilterInputNumber/index.less +16 -0
- package/dist/components/Filter/FilterRadio/index.d.ts +19 -0
- package/dist/components/Filter/FilterRadio/index.js +56 -0
- package/dist/components/Filter/FilterRadio/index.less +26 -0
- package/dist/components/Filter/FilterSelect/index.d.ts +18 -0
- package/dist/components/Filter/FilterSelect/index.js +58 -0
- package/dist/components/Filter/FilterSelect/index.less +29 -0
- package/dist/components/Filter/FilterSlider/index.d.ts +15 -0
- package/dist/components/Filter/FilterSlider/index.js +52 -0
- package/dist/components/Filter/FilterSlider/index.less +20 -0
- package/dist/components/Filter/FilterSwitch/index.d.ts +13 -0
- package/dist/components/Filter/FilterSwitch/index.js +51 -0
- package/dist/components/Filter/FilterSwitch/index.less +21 -0
- package/dist/components/Filter/index.d.ts +6 -0
- package/dist/components/Filter/index.js +6 -0
- package/dist/components/TableMax/TableBody/Row.js +0 -1
- package/dist/components/TableMax/TableBody/index.js +6 -5
- package/dist/components/TableMax/TableBody/index.less +12 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.js +1 -0
- package/package.json +2 -1
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import './index.less';
|
|
3
|
+
interface ColorProps {
|
|
4
|
+
title: string;
|
|
5
|
+
name: string;
|
|
6
|
+
size?: 'small' | 'middle' | 'large';
|
|
7
|
+
filterReturnEvt: Function;
|
|
8
|
+
defaultColor?: string;
|
|
9
|
+
align?: 'left' | 'right';
|
|
10
|
+
width?: number;
|
|
11
|
+
labelWidth?: number;
|
|
12
|
+
}
|
|
13
|
+
declare const Color: React.FC<ColorProps>;
|
|
14
|
+
export default Color;
|
|
@@ -0,0 +1,97 @@
|
|
|
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
|
+
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
|
+
import { DownOutlined } from '@ant-design/icons';
|
|
12
|
+
import classnames from 'classnames';
|
|
13
|
+
import React, { useEffect, useState } from 'react';
|
|
14
|
+
import { SketchPicker } from 'react-color';
|
|
15
|
+
import "./index.less";
|
|
16
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
17
|
+
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
18
|
+
var Color = function Color(props) {
|
|
19
|
+
var title = props.title,
|
|
20
|
+
name = props.name,
|
|
21
|
+
filterReturnEvt = props.filterReturnEvt,
|
|
22
|
+
defaultColor = props.defaultColor,
|
|
23
|
+
size = props.size,
|
|
24
|
+
_props$align = props.align,
|
|
25
|
+
align = _props$align === void 0 ? 'left' : _props$align,
|
|
26
|
+
width = props.width,
|
|
27
|
+
labelWidth = props.labelWidth;
|
|
28
|
+
var _useState = useState(false),
|
|
29
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
30
|
+
displayColorPicker = _useState2[0],
|
|
31
|
+
setDisplayColorPicker = _useState2[1];
|
|
32
|
+
var _useState3 = useState(defaultColor || '#F3B74B'),
|
|
33
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
34
|
+
backgroundColor = _useState4[0],
|
|
35
|
+
setBackgroundColor = _useState4[1];
|
|
36
|
+
useEffect(function () {
|
|
37
|
+
setBackgroundColor(defaultColor);
|
|
38
|
+
}, [defaultColor]);
|
|
39
|
+
return /*#__PURE__*/_jsxs("div", {
|
|
40
|
+
className: "filterItem",
|
|
41
|
+
style: {
|
|
42
|
+
width: "".concat(width || 400, "px")
|
|
43
|
+
},
|
|
44
|
+
children: [/*#__PURE__*/_jsx("span", {
|
|
45
|
+
className: "filterItemTitle",
|
|
46
|
+
style: {
|
|
47
|
+
width: "".concat(labelWidth || 120, "px")
|
|
48
|
+
},
|
|
49
|
+
children: title
|
|
50
|
+
}), /*#__PURE__*/_jsx("div", {
|
|
51
|
+
className: "filterItemContent",
|
|
52
|
+
children: /*#__PURE__*/_jsxs("div", {
|
|
53
|
+
className: classnames(_defineProperty(_defineProperty({}, "colorBox", true), "small", size === 'small')),
|
|
54
|
+
children: [/*#__PURE__*/_jsxs("div", {
|
|
55
|
+
className: "swatch",
|
|
56
|
+
onClick: function onClick() {
|
|
57
|
+
setDisplayColorPicker(true);
|
|
58
|
+
},
|
|
59
|
+
children: [/*#__PURE__*/_jsx("div", {
|
|
60
|
+
className: "color",
|
|
61
|
+
style: {
|
|
62
|
+
backgroundColor: backgroundColor
|
|
63
|
+
}
|
|
64
|
+
}), /*#__PURE__*/_jsx("div", {
|
|
65
|
+
className: "arrow",
|
|
66
|
+
children: /*#__PURE__*/_jsx(DownOutlined, {
|
|
67
|
+
style: {
|
|
68
|
+
color: localStorage.getItem('poi-current-page') === 'dark' ? '#DADBDF' : '#838695'
|
|
69
|
+
}
|
|
70
|
+
})
|
|
71
|
+
})]
|
|
72
|
+
}), displayColorPicker ? /*#__PURE__*/_jsxs("div", {
|
|
73
|
+
className: classnames(_defineProperty(_defineProperty(_defineProperty({}, "popover", true), "left", align === 'left'), "right", align === 'right')),
|
|
74
|
+
children: [/*#__PURE__*/_jsx("div", {
|
|
75
|
+
className: "cover",
|
|
76
|
+
onClick: function onClick() {
|
|
77
|
+
return setDisplayColorPicker(false);
|
|
78
|
+
}
|
|
79
|
+
}), /*#__PURE__*/_jsx(SketchPicker, {
|
|
80
|
+
color: backgroundColor,
|
|
81
|
+
className: 'picker_module-case',
|
|
82
|
+
onChange: function onChange(color) {
|
|
83
|
+
var hex = color.hex || '';
|
|
84
|
+
var hexUpperCase = hex.toLocaleUpperCase();
|
|
85
|
+
setBackgroundColor(hexUpperCase);
|
|
86
|
+
filterReturnEvt({
|
|
87
|
+
name: name,
|
|
88
|
+
value: hexUpperCase
|
|
89
|
+
});
|
|
90
|
+
}
|
|
91
|
+
})]
|
|
92
|
+
}) : null]
|
|
93
|
+
})
|
|
94
|
+
})]
|
|
95
|
+
});
|
|
96
|
+
};
|
|
97
|
+
export default Color;
|
|
@@ -0,0 +1,106 @@
|
|
|
1
|
+
.popover {
|
|
2
|
+
position: absolute;
|
|
3
|
+
z-index: 2;
|
|
4
|
+
|
|
5
|
+
&.left {
|
|
6
|
+
left: 0;
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
&.right {
|
|
10
|
+
right: 0;
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
// 颜色设置弹框 - 隐藏下部默认颜色块部分
|
|
14
|
+
.picker_module-case {
|
|
15
|
+
:global {
|
|
16
|
+
.flexbox-fix:last-child {
|
|
17
|
+
display: none !important;
|
|
18
|
+
}
|
|
19
|
+
}
|
|
20
|
+
}
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
.colorBox {
|
|
24
|
+
position: relative;
|
|
25
|
+
|
|
26
|
+
input {
|
|
27
|
+
line-height: 1;
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
span {
|
|
31
|
+
line-height: 1;
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
input {
|
|
35
|
+
box-sizing: content-box;
|
|
36
|
+
}
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
.arrow {
|
|
40
|
+
font-size: 12px;
|
|
41
|
+
font-weight: 600;
|
|
42
|
+
padding-left: 12px;
|
|
43
|
+
padding-right: 5px;
|
|
44
|
+
fill: @globalColor1;
|
|
45
|
+
.arrowIcon {
|
|
46
|
+
color: @globalColor1;
|
|
47
|
+
}
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
.swatch {
|
|
51
|
+
width: 240px;
|
|
52
|
+
height: 32px;
|
|
53
|
+
// height: 20px;
|
|
54
|
+
padding: 6px;
|
|
55
|
+
background: @globalColor6;
|
|
56
|
+
display: flex;
|
|
57
|
+
justify-content: space-between;
|
|
58
|
+
align-items: center;
|
|
59
|
+
cursor: pointer;
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
.color {
|
|
63
|
+
width: 100%;
|
|
64
|
+
height: 100%;
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
.cover {
|
|
68
|
+
position: fixed;
|
|
69
|
+
top: 0px;
|
|
70
|
+
right: 0px;
|
|
71
|
+
bottom: 0px;
|
|
72
|
+
left: 0px;
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
.small {
|
|
76
|
+
.swatch {
|
|
77
|
+
width: 100px;
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
.color {
|
|
81
|
+
width: 20px;
|
|
82
|
+
height: 20px;
|
|
83
|
+
}
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
.filterItem {
|
|
87
|
+
width: 100%;
|
|
88
|
+
min-width: 200px;
|
|
89
|
+
display: flex;
|
|
90
|
+
align-items: center;
|
|
91
|
+
justify-content: space-between;
|
|
92
|
+
margin-bottom: 20px;
|
|
93
|
+
|
|
94
|
+
.filterItemTitle {
|
|
95
|
+
font-size: 14px;
|
|
96
|
+
color: @globalColor1;
|
|
97
|
+
min-width: 120px;
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
.filterItemContent {
|
|
101
|
+
flex: 1;
|
|
102
|
+
:global {
|
|
103
|
+
color: #212121;
|
|
104
|
+
}
|
|
105
|
+
}
|
|
106
|
+
}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import "./index.less";
|
|
3
|
+
export type FilterInputNumberProps = {
|
|
4
|
+
title?: string;
|
|
5
|
+
name?: string;
|
|
6
|
+
defaultValue?: number;
|
|
7
|
+
value?: number;
|
|
8
|
+
filterReturnEvt?: Function;
|
|
9
|
+
width?: number;
|
|
10
|
+
labelWidth?: number;
|
|
11
|
+
marginBottom?: number;
|
|
12
|
+
max?: number;
|
|
13
|
+
min?: number;
|
|
14
|
+
step?: number;
|
|
15
|
+
};
|
|
16
|
+
declare const FilterInputNumber: React.FC<FilterInputNumberProps>;
|
|
17
|
+
export default FilterInputNumber;
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
import "antd/es/input-number/style";
|
|
2
|
+
import _InputNumber from "antd/es/input-number";
|
|
3
|
+
import React from "react";
|
|
4
|
+
import "./index.less";
|
|
5
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
6
|
+
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
7
|
+
var FilterInputNumber = function FilterInputNumber(_ref) {
|
|
8
|
+
var title = _ref.title,
|
|
9
|
+
name = _ref.name,
|
|
10
|
+
defaultValue = _ref.defaultValue,
|
|
11
|
+
value = _ref.value,
|
|
12
|
+
filterReturnEvt = _ref.filterReturnEvt,
|
|
13
|
+
width = _ref.width,
|
|
14
|
+
_ref$labelWidth = _ref.labelWidth,
|
|
15
|
+
labelWidth = _ref$labelWidth === void 0 ? 120 : _ref$labelWidth,
|
|
16
|
+
_ref$marginBottom = _ref.marginBottom,
|
|
17
|
+
marginBottom = _ref$marginBottom === void 0 ? 20 : _ref$marginBottom,
|
|
18
|
+
max = _ref.max,
|
|
19
|
+
min = _ref.min,
|
|
20
|
+
step = _ref.step;
|
|
21
|
+
var onChange = function onChange(value) {
|
|
22
|
+
filterReturnEvt === null || filterReturnEvt === void 0 || filterReturnEvt({
|
|
23
|
+
name: name,
|
|
24
|
+
value: value
|
|
25
|
+
});
|
|
26
|
+
};
|
|
27
|
+
return /*#__PURE__*/_jsxs("div", {
|
|
28
|
+
className: "filterItem",
|
|
29
|
+
style: {
|
|
30
|
+
width: "".concat(width || 400, "px"),
|
|
31
|
+
marginBottom: "".concat(marginBottom, "px")
|
|
32
|
+
},
|
|
33
|
+
children: [/*#__PURE__*/_jsx("span", {
|
|
34
|
+
className: "filterItemTitle",
|
|
35
|
+
style: {
|
|
36
|
+
width: "".concat(labelWidth, "px")
|
|
37
|
+
},
|
|
38
|
+
children: title
|
|
39
|
+
}), /*#__PURE__*/_jsx("div", {
|
|
40
|
+
className: "filterItemContent",
|
|
41
|
+
children: /*#__PURE__*/_jsx(_InputNumber, {
|
|
42
|
+
step: step,
|
|
43
|
+
min: min,
|
|
44
|
+
max: max,
|
|
45
|
+
defaultValue: defaultValue,
|
|
46
|
+
value: value,
|
|
47
|
+
onChange: onChange
|
|
48
|
+
})
|
|
49
|
+
})]
|
|
50
|
+
});
|
|
51
|
+
};
|
|
52
|
+
export default FilterInputNumber;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
.filterItem {
|
|
2
|
+
width: 100%;
|
|
3
|
+
min-width: 200px;
|
|
4
|
+
display: flex;
|
|
5
|
+
align-items: center;
|
|
6
|
+
justify-content: space-between;
|
|
7
|
+
margin-bottom: 20px;
|
|
8
|
+
.filterItemTitle {
|
|
9
|
+
font-size: 14px;
|
|
10
|
+
color: @globalColor1;
|
|
11
|
+
margin-right: 16px;
|
|
12
|
+
}
|
|
13
|
+
.filterItemContent {
|
|
14
|
+
flex: 1;
|
|
15
|
+
}
|
|
16
|
+
}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import "./index.less";
|
|
3
|
+
type dataListProps = {
|
|
4
|
+
label: string;
|
|
5
|
+
value: number | string;
|
|
6
|
+
};
|
|
7
|
+
type FilterRadioProps = {
|
|
8
|
+
title?: string;
|
|
9
|
+
name: string;
|
|
10
|
+
defaultValue?: number | string;
|
|
11
|
+
dataList: Array<dataListProps>;
|
|
12
|
+
filterReturnEvt: Function;
|
|
13
|
+
width?: number;
|
|
14
|
+
labelWidth?: number;
|
|
15
|
+
isShowLabel?: boolean;
|
|
16
|
+
hasMargin?: boolean;
|
|
17
|
+
};
|
|
18
|
+
declare const FilterRadio: React.FC<FilterRadioProps>;
|
|
19
|
+
export default FilterRadio;
|
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
import "antd/es/radio/style";
|
|
2
|
+
import _Radio from "antd/es/radio";
|
|
3
|
+
import "antd/es/select/style";
|
|
4
|
+
import _Select from "antd/es/select";
|
|
5
|
+
import React from "react";
|
|
6
|
+
import "./index.less";
|
|
7
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
8
|
+
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
9
|
+
var Option = _Select.Option;
|
|
10
|
+
var FilterRadio = function FilterRadio(_ref) {
|
|
11
|
+
var title = _ref.title,
|
|
12
|
+
name = _ref.name,
|
|
13
|
+
dataList = _ref.dataList,
|
|
14
|
+
defaultValue = _ref.defaultValue,
|
|
15
|
+
filterReturnEvt = _ref.filterReturnEvt,
|
|
16
|
+
width = _ref.width,
|
|
17
|
+
labelWidth = _ref.labelWidth,
|
|
18
|
+
_ref$isShowLabel = _ref.isShowLabel,
|
|
19
|
+
isShowLabel = _ref$isShowLabel === void 0 ? true : _ref$isShowLabel,
|
|
20
|
+
_ref$hasMargin = _ref.hasMargin,
|
|
21
|
+
hasMargin = _ref$hasMargin === void 0 ? true : _ref$hasMargin;
|
|
22
|
+
var handleChange = function handleChange(e) {
|
|
23
|
+
filterReturnEvt({
|
|
24
|
+
name: name,
|
|
25
|
+
value: e.target.value
|
|
26
|
+
});
|
|
27
|
+
};
|
|
28
|
+
return /*#__PURE__*/_jsxs("div", {
|
|
29
|
+
className: "filterItem",
|
|
30
|
+
style: {
|
|
31
|
+
width: "".concat(width, "px"),
|
|
32
|
+
marginBottom: hasMargin ? '20px' : '0px'
|
|
33
|
+
},
|
|
34
|
+
children: [/*#__PURE__*/_jsx("span", {
|
|
35
|
+
className: "filterItemTitle",
|
|
36
|
+
style: {
|
|
37
|
+
width: "".concat(labelWidth || 120, "px"),
|
|
38
|
+
display: !isShowLabel ? 'none' : 'inline-block'
|
|
39
|
+
},
|
|
40
|
+
children: title
|
|
41
|
+
}), /*#__PURE__*/_jsx("div", {
|
|
42
|
+
className: "filterItemContent",
|
|
43
|
+
children: /*#__PURE__*/_jsx(_Radio.Group, {
|
|
44
|
+
onChange: handleChange,
|
|
45
|
+
defaultValue: defaultValue,
|
|
46
|
+
children: dataList.map(function (item, index) {
|
|
47
|
+
return /*#__PURE__*/_jsx(_Radio.Button, {
|
|
48
|
+
value: item.value,
|
|
49
|
+
children: item.label
|
|
50
|
+
}, index);
|
|
51
|
+
})
|
|
52
|
+
})
|
|
53
|
+
})]
|
|
54
|
+
});
|
|
55
|
+
};
|
|
56
|
+
export default FilterRadio;
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
.filterItem {
|
|
2
|
+
width: 100%;
|
|
3
|
+
min-width: 200px;
|
|
4
|
+
display: flex;
|
|
5
|
+
align-items: center;
|
|
6
|
+
justify-content: space-between;
|
|
7
|
+
|
|
8
|
+
.filterItemTitle {
|
|
9
|
+
font-size: 14px;
|
|
10
|
+
color: @globalColor1;
|
|
11
|
+
min-width: 120px;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
.filterItemContent {
|
|
15
|
+
flex: 1;
|
|
16
|
+
|
|
17
|
+
// :global {
|
|
18
|
+
// .ant-radio-group {
|
|
19
|
+
// .ant-radio-button-wrapper {
|
|
20
|
+
// background: @globalColor7;
|
|
21
|
+
// color: @globalColor2;
|
|
22
|
+
// }
|
|
23
|
+
// }
|
|
24
|
+
// }
|
|
25
|
+
}
|
|
26
|
+
}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import "./index.less";
|
|
3
|
+
type dataListProps = {
|
|
4
|
+
label: string;
|
|
5
|
+
value: number | string;
|
|
6
|
+
};
|
|
7
|
+
type FilterSelectProps = {
|
|
8
|
+
title?: string;
|
|
9
|
+
name: string;
|
|
10
|
+
defaultValue?: number | string;
|
|
11
|
+
dataList: Array<dataListProps>;
|
|
12
|
+
filterReturnEvt: Function;
|
|
13
|
+
width?: number;
|
|
14
|
+
labelWidth?: number;
|
|
15
|
+
marginBottom?: number;
|
|
16
|
+
};
|
|
17
|
+
declare const FilterSelect: React.FC<FilterSelectProps>;
|
|
18
|
+
export default FilterSelect;
|
|
@@ -0,0 +1,58 @@
|
|
|
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
|
+
import "antd/es/select/style";
|
|
3
|
+
import _Select from "antd/es/select";
|
|
4
|
+
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; }
|
|
5
|
+
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; }
|
|
6
|
+
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; }
|
|
7
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
|
|
8
|
+
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); }
|
|
9
|
+
import React from "react";
|
|
10
|
+
import "./index.less";
|
|
11
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
12
|
+
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
13
|
+
var Option = _Select.Option;
|
|
14
|
+
var FilterSelect = function FilterSelect(_ref) {
|
|
15
|
+
var title = _ref.title,
|
|
16
|
+
name = _ref.name,
|
|
17
|
+
dataList = _ref.dataList,
|
|
18
|
+
defaultValue = _ref.defaultValue,
|
|
19
|
+
filterReturnEvt = _ref.filterReturnEvt,
|
|
20
|
+
width = _ref.width,
|
|
21
|
+
labelWidth = _ref.labelWidth,
|
|
22
|
+
_ref$marginBottom = _ref.marginBottom,
|
|
23
|
+
marginBottom = _ref$marginBottom === void 0 ? 20 : _ref$marginBottom;
|
|
24
|
+
var handleChange = function handleChange(value) {
|
|
25
|
+
filterReturnEvt({
|
|
26
|
+
name: name,
|
|
27
|
+
value: value
|
|
28
|
+
});
|
|
29
|
+
};
|
|
30
|
+
return /*#__PURE__*/_jsxs("div", {
|
|
31
|
+
className: "filterItem",
|
|
32
|
+
style: _objectSpread({
|
|
33
|
+
width: "".concat(width || 400, "px")
|
|
34
|
+
}, marginBottom ? {
|
|
35
|
+
marginBottom: "".concat(marginBottom, "px")
|
|
36
|
+
} : {}),
|
|
37
|
+
children: [/*#__PURE__*/_jsx("span", {
|
|
38
|
+
className: "filterItemTitle",
|
|
39
|
+
style: {
|
|
40
|
+
width: "".concat(labelWidth || 120, "px")
|
|
41
|
+
},
|
|
42
|
+
children: title
|
|
43
|
+
}), /*#__PURE__*/_jsx("div", {
|
|
44
|
+
className: "filterItemContent",
|
|
45
|
+
children: /*#__PURE__*/_jsx(_Select, {
|
|
46
|
+
defaultValue: defaultValue,
|
|
47
|
+
onChange: handleChange,
|
|
48
|
+
children: dataList.map(function (item) {
|
|
49
|
+
return /*#__PURE__*/_jsx(Option, {
|
|
50
|
+
value: item.value,
|
|
51
|
+
children: item.label
|
|
52
|
+
}, item.value);
|
|
53
|
+
})
|
|
54
|
+
})
|
|
55
|
+
})]
|
|
56
|
+
});
|
|
57
|
+
};
|
|
58
|
+
export default FilterSelect;
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
.filterItem {
|
|
2
|
+
:global {
|
|
3
|
+
.custom-dark-select,
|
|
4
|
+
.custom-light-select
|
|
5
|
+
{
|
|
6
|
+
width: 100% !important;
|
|
7
|
+
}
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
width: 100%;
|
|
11
|
+
min-width: 200px;
|
|
12
|
+
display: flex;
|
|
13
|
+
align-items: center;
|
|
14
|
+
justify-content: space-between;
|
|
15
|
+
margin-bottom: 20px;
|
|
16
|
+
|
|
17
|
+
.filterItemTitle {
|
|
18
|
+
font-size: 14px;
|
|
19
|
+
// color: #212121;
|
|
20
|
+
color: @globalColor1;
|
|
21
|
+
min-width: 80px;
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
.filterItemContent {
|
|
25
|
+
flex: 1;
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
|
|
29
|
+
}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import './index.less';
|
|
3
|
+
type FilterSilderPropTypes = {
|
|
4
|
+
title: string;
|
|
5
|
+
name?: string;
|
|
6
|
+
maxValue: number;
|
|
7
|
+
minValue: number;
|
|
8
|
+
defaultValue: number;
|
|
9
|
+
filterReturnEvt: Function;
|
|
10
|
+
width?: number;
|
|
11
|
+
labelWidth?: number;
|
|
12
|
+
marginSpace?: string | number;
|
|
13
|
+
};
|
|
14
|
+
declare const FilterSilder: React.FC<FilterSilderPropTypes>;
|
|
15
|
+
export default FilterSilder;
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
import "antd/es/slider/style";
|
|
2
|
+
import _Slider from "antd/es/slider";
|
|
3
|
+
import "./index.less";
|
|
4
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
5
|
+
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
6
|
+
var FilterSilder = function FilterSilder(_ref) {
|
|
7
|
+
var _ref$title = _ref.title,
|
|
8
|
+
title = _ref$title === void 0 ? 'CellWidth' : _ref$title,
|
|
9
|
+
name = _ref.name,
|
|
10
|
+
_ref$maxValue = _ref.maxValue,
|
|
11
|
+
maxValue = _ref$maxValue === void 0 ? 100 : _ref$maxValue,
|
|
12
|
+
_ref$minValue = _ref.minValue,
|
|
13
|
+
minValue = _ref$minValue === void 0 ? 0 : _ref$minValue,
|
|
14
|
+
_ref$defaultValue = _ref.defaultValue,
|
|
15
|
+
defaultValue = _ref$defaultValue === void 0 ? 50 : _ref$defaultValue,
|
|
16
|
+
_ref$filterReturnEvt = _ref.filterReturnEvt,
|
|
17
|
+
filterReturnEvt = _ref$filterReturnEvt === void 0 ? function (v) {
|
|
18
|
+
return v;
|
|
19
|
+
} : _ref$filterReturnEvt,
|
|
20
|
+
width = _ref.width,
|
|
21
|
+
labelWidth = _ref.labelWidth,
|
|
22
|
+
marginSpace = _ref.marginSpace;
|
|
23
|
+
var onChange = function onChange(value) {
|
|
24
|
+
filterReturnEvt({
|
|
25
|
+
name: name,
|
|
26
|
+
value: value
|
|
27
|
+
});
|
|
28
|
+
};
|
|
29
|
+
return /*#__PURE__*/_jsxs("div", {
|
|
30
|
+
className: "filterItem",
|
|
31
|
+
style: {
|
|
32
|
+
width: "".concat(width || 400, "px"),
|
|
33
|
+
marginBottom: "".concat(marginSpace || '20px')
|
|
34
|
+
},
|
|
35
|
+
children: [/*#__PURE__*/_jsx("span", {
|
|
36
|
+
className: "filterItemTitle",
|
|
37
|
+
style: {
|
|
38
|
+
width: "".concat(labelWidth || 120, "px")
|
|
39
|
+
},
|
|
40
|
+
children: title
|
|
41
|
+
}), /*#__PURE__*/_jsx("div", {
|
|
42
|
+
className: "filterItemContent",
|
|
43
|
+
children: /*#__PURE__*/_jsx(_Slider, {
|
|
44
|
+
max: maxValue,
|
|
45
|
+
min: minValue,
|
|
46
|
+
value: defaultValue,
|
|
47
|
+
onChange: onChange
|
|
48
|
+
})
|
|
49
|
+
})]
|
|
50
|
+
});
|
|
51
|
+
};
|
|
52
|
+
export default FilterSilder;
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
.filterItem {
|
|
2
|
+
width: 100%;
|
|
3
|
+
min-width: 200px;
|
|
4
|
+
display: flex;
|
|
5
|
+
align-items: center;
|
|
6
|
+
justify-content: space-between;
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
.filterItemTitle {
|
|
10
|
+
font-size: 14px;
|
|
11
|
+
// color: #212121;
|
|
12
|
+
color: @globalColor1;
|
|
13
|
+
margin-right: 2px;
|
|
14
|
+
// min-width: 120px;
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
.filterItemContent {
|
|
18
|
+
flex: 1;
|
|
19
|
+
}
|
|
20
|
+
}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import "./index.less";
|
|
3
|
+
export type FilterSwitchProps = {
|
|
4
|
+
title: string;
|
|
5
|
+
name?: string;
|
|
6
|
+
defaultValue: boolean;
|
|
7
|
+
filterReturnEvt: Function;
|
|
8
|
+
width?: number;
|
|
9
|
+
labelWidth?: number;
|
|
10
|
+
marginBottom?: number;
|
|
11
|
+
};
|
|
12
|
+
declare const FilterSwitch: React.FC<FilterSwitchProps>;
|
|
13
|
+
export default FilterSwitch;
|
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
import "antd/es/switch/style";
|
|
2
|
+
import _Switch from "antd/es/switch";
|
|
3
|
+
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); }
|
|
4
|
+
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; }
|
|
5
|
+
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; }
|
|
6
|
+
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; }
|
|
7
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
|
|
8
|
+
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); }
|
|
9
|
+
import React from "react";
|
|
10
|
+
import "./index.less";
|
|
11
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
12
|
+
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
13
|
+
var FilterSwitch = function FilterSwitch(_ref) {
|
|
14
|
+
var title = _ref.title,
|
|
15
|
+
name = _ref.name,
|
|
16
|
+
_ref$defaultValue = _ref.defaultValue,
|
|
17
|
+
defaultValue = _ref$defaultValue === void 0 ? false : _ref$defaultValue,
|
|
18
|
+
filterReturnEvt = _ref.filterReturnEvt,
|
|
19
|
+
width = _ref.width,
|
|
20
|
+
labelWidth = _ref.labelWidth,
|
|
21
|
+
_ref$marginBottom = _ref.marginBottom,
|
|
22
|
+
marginBottom = _ref$marginBottom === void 0 ? 20 : _ref$marginBottom;
|
|
23
|
+
var onChange = function onChange(checked) {
|
|
24
|
+
filterReturnEvt({
|
|
25
|
+
name: name,
|
|
26
|
+
value: checked
|
|
27
|
+
});
|
|
28
|
+
};
|
|
29
|
+
return /*#__PURE__*/_jsxs("div", {
|
|
30
|
+
className: "filterItem",
|
|
31
|
+
style: _objectSpread({
|
|
32
|
+
width: "".concat(width || 400, "px")
|
|
33
|
+
}, marginBottom ? {
|
|
34
|
+
marginBottom: "".concat(marginBottom, "px")
|
|
35
|
+
} : {}),
|
|
36
|
+
children: [/*#__PURE__*/_jsx("span", {
|
|
37
|
+
className: "filterItemTitle",
|
|
38
|
+
style: {
|
|
39
|
+
width: "".concat(labelWidth || 120, "px")
|
|
40
|
+
},
|
|
41
|
+
children: title
|
|
42
|
+
}), /*#__PURE__*/_jsx("div", {
|
|
43
|
+
className: "filterItemContent",
|
|
44
|
+
children: /*#__PURE__*/_jsx(_Switch, {
|
|
45
|
+
defaultChecked: defaultValue,
|
|
46
|
+
onChange: onChange
|
|
47
|
+
})
|
|
48
|
+
})]
|
|
49
|
+
});
|
|
50
|
+
};
|
|
51
|
+
export default FilterSwitch;
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
.filterItem {
|
|
2
|
+
width: 100%;
|
|
3
|
+
min-width: 140px;
|
|
4
|
+
display: flex;
|
|
5
|
+
align-items: center;
|
|
6
|
+
justify-content: space-between;
|
|
7
|
+
margin-bottom: 20px;
|
|
8
|
+
|
|
9
|
+
.filterItemTitle {
|
|
10
|
+
font-size: 14px;
|
|
11
|
+
// color: #212121;
|
|
12
|
+
color: @globalColor1;
|
|
13
|
+
width: 120px;
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
.filterItemContent {
|
|
17
|
+
flex: 1;
|
|
18
|
+
display: flex;
|
|
19
|
+
align-items: center;
|
|
20
|
+
}
|
|
21
|
+
}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
export { default as FilterColor } from './FilterColor';
|
|
2
|
+
export { default as FilterInputNumber } from './FilterInputNumber';
|
|
3
|
+
export { default as FilterRadio } from './FilterRadio';
|
|
4
|
+
export { default as FilterSelect } from './FilterSelect';
|
|
5
|
+
export { default as FilterSlider } from './FilterSlider';
|
|
6
|
+
export { default as FilterSwitch } from './FilterSwitch';
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
export { default as FilterColor } from "./FilterColor";
|
|
2
|
+
export { default as FilterInputNumber } from "./FilterInputNumber";
|
|
3
|
+
export { default as FilterRadio } from "./FilterRadio";
|
|
4
|
+
export { default as FilterSelect } from "./FilterSelect";
|
|
5
|
+
export { default as FilterSlider } from "./FilterSlider";
|
|
6
|
+
export { default as FilterSwitch } from "./FilterSwitch";
|
|
@@ -310,7 +310,6 @@ var Row = function Row(_ref) {
|
|
|
310
310
|
};
|
|
311
311
|
return /*#__PURE__*/_jsxs(_Fragment, {
|
|
312
312
|
children: [!!getRowHoverTipConfig ? /*#__PURE__*/_jsx(_Tooltip, _objectSpread(_objectSpread({}, tooltipConfig), {}, {
|
|
313
|
-
// autoAdjustOverflow={false}
|
|
314
313
|
onOpenChange: onOpenChange,
|
|
315
314
|
destroyTooltipOnHide: {
|
|
316
315
|
keepParent: false
|
|
@@ -92,16 +92,17 @@ var TableBody = function TableBody(_ref) {
|
|
|
92
92
|
var handleCellContextMenu = function handleCellContextMenu(e, cell) {
|
|
93
93
|
// console.log('cell :>> ', cell);
|
|
94
94
|
if (getContextMenu) {
|
|
95
|
+
var options = getContextMenu({
|
|
96
|
+
row: cell.row.original,
|
|
97
|
+
column: cell.column.columnDef
|
|
98
|
+
});
|
|
95
99
|
setContextMenuData({
|
|
96
|
-
visible:
|
|
100
|
+
visible: options.length > 0,
|
|
97
101
|
clientX: e.clientX,
|
|
98
102
|
clientY: e.clientY,
|
|
99
103
|
row: cell.row.original,
|
|
100
104
|
column: cell.column.columnDef,
|
|
101
|
-
options:
|
|
102
|
-
row: cell.row.original,
|
|
103
|
-
column: cell.column.columnDef
|
|
104
|
-
})
|
|
105
|
+
options: options
|
|
105
106
|
});
|
|
106
107
|
e.preventDefault();
|
|
107
108
|
}
|
|
@@ -144,4 +144,16 @@ table {
|
|
|
144
144
|
.table-max-row-tooltip-wrapper {
|
|
145
145
|
left: 50% !important;
|
|
146
146
|
transform: translateX(-50%) !important;
|
|
147
|
+
|
|
148
|
+
&.custom-light-tooltip-placement-top {
|
|
149
|
+
.custom-light-tooltip-content {
|
|
150
|
+
margin-bottom: -13px;
|
|
151
|
+
}
|
|
152
|
+
}
|
|
153
|
+
|
|
154
|
+
&.custom-light-tooltip-placement-bottom {
|
|
155
|
+
.custom-light-tooltip-content {
|
|
156
|
+
margin-top: -13px;
|
|
157
|
+
}
|
|
158
|
+
}
|
|
147
159
|
}
|
package/dist/index.d.ts
CHANGED
|
@@ -23,6 +23,7 @@ export { default as SplitPane } from './components/SplitPane';
|
|
|
23
23
|
export * from './components/TableMax';
|
|
24
24
|
export { default as TableMax } from './components/TableMax';
|
|
25
25
|
export * from './components/ConfigProvider';
|
|
26
|
+
export * from './components/Filter';
|
|
26
27
|
export { default as SchemaForm } from './components/SchemaForm';
|
|
27
28
|
export * from './hooks/useEventBus';
|
|
28
29
|
export { default as useEventBus } from './hooks/useEventBus';
|
package/dist/index.js
CHANGED
|
@@ -24,6 +24,7 @@ export { default as SplitPane } from "./components/SplitPane";
|
|
|
24
24
|
export * from "./components/TableMax";
|
|
25
25
|
export { default as TableMax } from "./components/TableMax";
|
|
26
26
|
export * from "./components/ConfigProvider";
|
|
27
|
+
export * from "./components/Filter";
|
|
27
28
|
export { default as SchemaForm } from "./components/SchemaForm";
|
|
28
29
|
|
|
29
30
|
// hooks
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@arim-aisdc/public-components",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.59",
|
|
4
4
|
"description": "前端组件库",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"main": "dist/index.js",
|
|
@@ -58,6 +58,7 @@
|
|
|
58
58
|
"jsep": "^1.3.8",
|
|
59
59
|
"lodash": "^4.17.21",
|
|
60
60
|
"path": "^0.12.7",
|
|
61
|
+
"react-color": "^2.19.3",
|
|
61
62
|
"react-dnd": "^16.0.1",
|
|
62
63
|
"react-dnd-html5-backend": "^16.0.1",
|
|
63
64
|
"react-draggable": "^4.4.6",
|