@zgfe/business-lib 1.1.62 → 1.1.63-tags.0
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/es/assets/demo/picker.d.ts +2 -0
- package/es/assets/demo/picker.js +22 -0
- package/es/assets/demo/select.d.ts +2 -0
- package/es/assets/demo/select.js +30 -0
- package/es/assets/styles/chunks.less +14 -5
- package/es/assets/styles/resetAntd.less +20 -10
- package/es/assets/styles/variable.less +3 -0
- package/es/attrCondition/styles/index.less +0 -1
- package/es/attrConditions/styles/index.less +3 -5
- package/es/attributeSelector/index.js +2 -2
- package/es/attributeSelector/styles/index.less +7 -0
- package/es/eventSelector/demo/index.js +1 -6
- package/es/eventSelector/index.js +4 -3
- package/es/eventSelector/styles/index.less +2 -1
- package/es/index.d.ts +2 -1
- package/es/index.js +2 -1
- package/es/quickDatePicker/demo/index.d.ts +3 -0
- package/es/quickDatePicker/demo/index.js +40 -0
- package/es/quickDatePicker/index.d.ts +6 -0
- package/es/quickDatePicker/index.js +186 -0
- package/es/quickDatePicker/styles/index.less +138 -0
- package/es/quickDatePicker/types.d.ts +25 -0
- package/es/quickDatePicker/types.js +1 -0
- package/es/quickDatePicker/utils.d.ts +12 -0
- package/es/quickDatePicker/utils.js +52 -0
- package/es/targetConditionGroup/styles/index.less +3 -0
- package/es/targetSelector/index.js +12 -4
- package/es/userCondition/conditions/tagsCondition.js +1 -4
- package/es/userCondition/conditions/textDesc.js +3 -2
- package/es/userCondition/demo/mockData.d.ts +27 -41
- package/es/userCondition/demo/mockData.js +121 -175
- package/es/userCondition/types.d.ts +1 -0
- package/es/userCondition/util.d.ts +11 -1
- package/es/userCondition/util.js +34 -10
- package/es/userGroup/index.js +10 -2
- package/es/userGroup/styles/index.less +4 -1
- package/es/userTagsSelector/cascaderOverlay.js +28 -2
- package/es/userTagsSelector/demo/index.js +1 -1
- package/es/userTagsSelector/index.js +4 -2
- package/es/userTagsSelector/util.d.ts +1 -0
- package/es/userTagsSelector/util.js +10 -0
- package/package.json +2 -2
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { Card, DatePicker, Space } from 'antd';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import AssetsDemo from '.';
|
|
4
|
+
var RangePicker = DatePicker.RangePicker;
|
|
5
|
+
export default (function () {
|
|
6
|
+
return /*#__PURE__*/React.createElement(AssetsDemo, null, /*#__PURE__*/React.createElement(Card, {
|
|
7
|
+
title: "Input"
|
|
8
|
+
}, /*#__PURE__*/React.createElement(Space, {
|
|
9
|
+
direction: "vertical",
|
|
10
|
+
size: 12
|
|
11
|
+
}, /*#__PURE__*/React.createElement(RangePicker, null), /*#__PURE__*/React.createElement(RangePicker, {
|
|
12
|
+
showTime: true
|
|
13
|
+
}), /*#__PURE__*/React.createElement(RangePicker, {
|
|
14
|
+
picker: "week"
|
|
15
|
+
}), /*#__PURE__*/React.createElement(RangePicker, {
|
|
16
|
+
picker: "month"
|
|
17
|
+
}), /*#__PURE__*/React.createElement(RangePicker, {
|
|
18
|
+
picker: "quarter"
|
|
19
|
+
}), /*#__PURE__*/React.createElement(RangePicker, {
|
|
20
|
+
picker: "year"
|
|
21
|
+
}))));
|
|
22
|
+
});
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import { Card, Space, Select } from 'antd';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import AssetsDemo from '.';
|
|
4
|
+
export default (function () {
|
|
5
|
+
return /*#__PURE__*/React.createElement(AssetsDemo, null, /*#__PURE__*/React.createElement(Card, {
|
|
6
|
+
title: "Input"
|
|
7
|
+
}, /*#__PURE__*/React.createElement(Space, {
|
|
8
|
+
direction: "vertical",
|
|
9
|
+
size: 12
|
|
10
|
+
}, /*#__PURE__*/React.createElement(Select, {
|
|
11
|
+
defaultValue: "lucy",
|
|
12
|
+
style: {
|
|
13
|
+
width: 120
|
|
14
|
+
},
|
|
15
|
+
options: [{
|
|
16
|
+
value: 'jack',
|
|
17
|
+
label: 'Jack'
|
|
18
|
+
}, {
|
|
19
|
+
value: 'lucy',
|
|
20
|
+
label: 'Lucy'
|
|
21
|
+
}, {
|
|
22
|
+
value: 'Yiminghe',
|
|
23
|
+
label: 'yiminghe'
|
|
24
|
+
}, {
|
|
25
|
+
value: 'disabled',
|
|
26
|
+
label: 'Disabled',
|
|
27
|
+
disabled: true
|
|
28
|
+
}]
|
|
29
|
+
}))));
|
|
30
|
+
});
|
|
@@ -25,10 +25,19 @@
|
|
|
25
25
|
|
|
26
26
|
// 下拉组件操作栏样式
|
|
27
27
|
.__select-handle {
|
|
28
|
-
padding: @padding-xss;
|
|
29
|
-
border: 1px solid @border-color-base;
|
|
28
|
+
// padding: @padding-xss;
|
|
29
|
+
// border: 1px solid @border-color-base;
|
|
30
|
+
background: @custom-background;
|
|
31
|
+
border: 1px solid @custom-background;
|
|
30
32
|
border-radius: @border-radius-small;
|
|
31
33
|
cursor: pointer;
|
|
34
|
+
&:hover {
|
|
35
|
+
border: 1px solid @primary-color;
|
|
36
|
+
}
|
|
37
|
+
&.focus {
|
|
38
|
+
border: 1px solid @primary-color;
|
|
39
|
+
box-shadow: 0 0 0 4px @custom-focus;
|
|
40
|
+
}
|
|
32
41
|
}
|
|
33
42
|
|
|
34
43
|
// 下拉组件展开panel样式
|
|
@@ -118,7 +127,7 @@
|
|
|
118
127
|
.__default-overflow();
|
|
119
128
|
|
|
120
129
|
&:hover:not(.disable) {
|
|
121
|
-
background-color: @background-color-base;
|
|
130
|
+
// background-color: @background-color-base;
|
|
122
131
|
border-color: @primary-color;
|
|
123
132
|
box-shadow: none;
|
|
124
133
|
}
|
|
@@ -132,14 +141,14 @@
|
|
|
132
141
|
|
|
133
142
|
// 下拉框常用样式
|
|
134
143
|
.__select-normal-secondary {
|
|
135
|
-
background-color: @white;
|
|
144
|
+
// background-color: @white;
|
|
136
145
|
border: 1px solid @border-color-base;
|
|
137
146
|
border-radius: @border-radius-small;
|
|
138
147
|
|
|
139
148
|
&:not(.disable) {
|
|
140
149
|
&:hover,
|
|
141
150
|
&.active {
|
|
142
|
-
.__default-hover();
|
|
151
|
+
// .__default-hover();
|
|
143
152
|
border-color: @border-color-base;
|
|
144
153
|
box-shadow: none;
|
|
145
154
|
}
|
|
@@ -48,11 +48,14 @@
|
|
|
48
48
|
background-color: @background-color-base!important;
|
|
49
49
|
// border-color: @background-color-base!important;
|
|
50
50
|
border-radius: @border-radius-small!important;
|
|
51
|
-
|
|
51
|
+
&:hover {
|
|
52
|
+
border-color: @primary-color;
|
|
53
|
+
}
|
|
52
54
|
&:focus,
|
|
53
55
|
&-focused {
|
|
54
56
|
background-color: #fff !important;
|
|
55
|
-
|
|
57
|
+
border-color: @primary-color;
|
|
58
|
+
box-shadow: 0 0 0 4px @custom-focus !important;
|
|
56
59
|
}
|
|
57
60
|
&.ant-input-status-error {
|
|
58
61
|
border-color: @error-color !important;
|
|
@@ -70,6 +73,20 @@
|
|
|
70
73
|
background-color: @background-color-base!important;
|
|
71
74
|
}
|
|
72
75
|
|
|
76
|
+
.ant-select {
|
|
77
|
+
border: 1px solid #fafafb;
|
|
78
|
+
border-radius: 2px;
|
|
79
|
+
&:hover {
|
|
80
|
+
border: 1px solid @primary-color;
|
|
81
|
+
}
|
|
82
|
+
&:focus,
|
|
83
|
+
&-focused {
|
|
84
|
+
background-color: #fff !important;
|
|
85
|
+
border-color: @primary-color;
|
|
86
|
+
box-shadow: 0 0 0 4px @custom-focus !important;
|
|
87
|
+
}
|
|
88
|
+
}
|
|
89
|
+
|
|
73
90
|
.ant-select:not(.ant-select-customize-input):not(.ant-pagination-size-changer):not(
|
|
74
91
|
.ant-select-status-error
|
|
75
92
|
)
|
|
@@ -178,14 +195,7 @@
|
|
|
178
195
|
|
|
179
196
|
&:hover:not(.ant-picker-disabled),
|
|
180
197
|
&.ant-picker-focused {
|
|
181
|
-
|
|
182
|
-
border-color: @border-color-base!important;
|
|
183
|
-
box-shadow: none !important;
|
|
184
|
-
|
|
185
|
-
span,
|
|
186
|
-
input {
|
|
187
|
-
color: @primary-color!important;
|
|
188
|
-
}
|
|
198
|
+
border-color: @primary-color!important;
|
|
189
199
|
}
|
|
190
200
|
|
|
191
201
|
.ant-picker-active-bar {
|
|
@@ -12,3 +12,6 @@
|
|
|
12
12
|
@box-shadow-small: 0px 1px 2px @shadow-color-light;
|
|
13
13
|
@primary-color-hover: color(~`colorPalette('@{primary-color}', 0.1) `);
|
|
14
14
|
@box-shadow-form: 0 0 0 4px @primary-color-hover;
|
|
15
|
+
@custom-background: #fafafb;
|
|
16
|
+
@custom-focus: #f0f7ff;
|
|
17
|
+
@primary-color: '#165dff';
|
|
@@ -2,9 +2,9 @@
|
|
|
2
2
|
|
|
3
3
|
/* 筛选条件 */
|
|
4
4
|
.biz-condition-item {
|
|
5
|
-
&.border {
|
|
6
|
-
|
|
7
|
-
}
|
|
5
|
+
// &.border {
|
|
6
|
+
// .__select-handle();
|
|
7
|
+
// }
|
|
8
8
|
&-panel {
|
|
9
9
|
display: flex;
|
|
10
10
|
width: 100%;
|
|
@@ -19,8 +19,6 @@
|
|
|
19
19
|
.biz-attr-select-handle {
|
|
20
20
|
margin-bottom: 2px;
|
|
21
21
|
padding: 0;
|
|
22
|
-
border: none;
|
|
23
|
-
border-radius: 0;
|
|
24
22
|
}
|
|
25
23
|
|
|
26
24
|
.ant-input {
|
|
@@ -83,9 +83,9 @@ var BizAttributeSelector = function BizAttributeSelector(props) {
|
|
|
83
83
|
setVisible(flag);
|
|
84
84
|
};
|
|
85
85
|
return /*#__PURE__*/React.createElement("div", {
|
|
86
|
-
className: classPrefix
|
|
86
|
+
className: "".concat(classPrefix)
|
|
87
87
|
}, /*#__PURE__*/React.createElement("div", {
|
|
88
|
-
className: "".concat(classPrefix, "-handle")
|
|
88
|
+
className: "".concat(classPrefix, "-handle ").concat(visible ? 'focus' : '')
|
|
89
89
|
}, /*#__PURE__*/React.createElement(Dropdown, {
|
|
90
90
|
dropdownRender: function dropdownRender() {
|
|
91
91
|
return /*#__PURE__*/React.createElement(AttrListPanel, _objectSpread(_objectSpread({
|
|
@@ -1,6 +1,13 @@
|
|
|
1
1
|
@import '../../assets/styles/inner.less';
|
|
2
2
|
|
|
3
3
|
.biz-attr-select {
|
|
4
|
+
border-radius: 4px;
|
|
5
|
+
// &.focus {
|
|
6
|
+
// box-shadow: 0 0 0 4px @custom-focus;
|
|
7
|
+
// .biz-attr-select-handle{
|
|
8
|
+
// border: 1px solid @primary-color;
|
|
9
|
+
// }
|
|
10
|
+
// }
|
|
4
11
|
&-handle {
|
|
5
12
|
display: flex;
|
|
6
13
|
flex-direction: row;
|
|
@@ -25,12 +25,7 @@ var EventDemo = function EventDemo() {
|
|
|
25
25
|
var onChange = function onChange(data) {
|
|
26
26
|
setValue(data);
|
|
27
27
|
};
|
|
28
|
-
return /*#__PURE__*/React.createElement("div", {
|
|
29
|
-
style: {
|
|
30
|
-
height: '500px',
|
|
31
|
-
overflow: 'auto'
|
|
32
|
-
}
|
|
33
|
-
}, /*#__PURE__*/React.createElement("div", {
|
|
28
|
+
return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
|
|
34
29
|
style: {
|
|
35
30
|
height: '700px'
|
|
36
31
|
}
|
|
@@ -96,8 +96,9 @@ var BizEventSelector = function BizEventSelector(props) {
|
|
|
96
96
|
setCurrentValue(value);
|
|
97
97
|
props.onChange && props.onChange(value);
|
|
98
98
|
};
|
|
99
|
-
var onVisibleChange = function onVisibleChange(
|
|
100
|
-
setVisible(
|
|
99
|
+
var onVisibleChange = function onVisibleChange(show) {
|
|
100
|
+
setVisible(show);
|
|
101
|
+
props.onVisibleChange && props.onVisibleChange(show);
|
|
101
102
|
};
|
|
102
103
|
return /*#__PURE__*/React.createElement("div", {
|
|
103
104
|
className: [classPrefix, border ? 'border' : ''].join(' ')
|
|
@@ -124,7 +125,7 @@ var BizEventSelector = function BizEventSelector(props) {
|
|
|
124
125
|
} : undefined,
|
|
125
126
|
destroyPopupOnHide: props.defaultSelectAble
|
|
126
127
|
}, /*#__PURE__*/React.createElement("div", {
|
|
127
|
-
className: "".concat(classPrefix, "-handle"),
|
|
128
|
+
className: "".concat(classPrefix, "-handle ").concat(visible ? 'focus' : ''),
|
|
128
129
|
id: selectId
|
|
129
130
|
}, /*#__PURE__*/React.createElement(SelectHandle, {
|
|
130
131
|
theme: theme,
|
|
@@ -1,12 +1,13 @@
|
|
|
1
1
|
@import '../../assets/styles/inner.less';
|
|
2
2
|
|
|
3
3
|
.biz-event-select {
|
|
4
|
+
position: relative;
|
|
5
|
+
border-radius: 4px;
|
|
4
6
|
&.border {
|
|
5
7
|
.biz-event-select-handle {
|
|
6
8
|
.__select-handle();
|
|
7
9
|
}
|
|
8
10
|
}
|
|
9
|
-
position: relative;
|
|
10
11
|
&-list-panel {
|
|
11
12
|
display: flex;
|
|
12
13
|
flex-direction: row;
|
package/es/index.d.ts
CHANGED
|
@@ -8,6 +8,7 @@ import BizTargetCondition from './targetConditionGroup';
|
|
|
8
8
|
import BizConditionItem from './attrConditions';
|
|
9
9
|
import BizConditionGroup from './attrConditions/group';
|
|
10
10
|
import BizDatePicker from './datePicker';
|
|
11
|
+
import BizQuickDatePicker from './quickDatePicker';
|
|
11
12
|
import BizSelect from './select';
|
|
12
13
|
import BizDialog from './dialog';
|
|
13
14
|
import BizChart from './chart';
|
|
@@ -34,7 +35,7 @@ import BizAttrCondition from './attrCondition';
|
|
|
34
35
|
import BizAttrConditionGroup from './attrCondition/group';
|
|
35
36
|
import BizTargetFromPanel from './layout/optionTitle';
|
|
36
37
|
import { BizTargetFromPanelContext } from './layout/optionTitle/types';
|
|
37
|
-
export { BizTargetFromPanel, BizSearchInput, BizSelect, BizDialog, BizChart, BizTable, BizAnalysisLayout, BizDetailLayout, BizUserGroup, IconFont, ColorIcon, BizTargetSelector, BizEventSelector, BizAttributeSelector, BizGlobalDataContext, BizTargetFromPanelContext, BizTargetCondition, BizDatePicker, BizConditionItem, BizConditionGroup, BizAttrCondition, BizAttrConditionGroup, BizUserCondition, BizAddToScene, BizAddToPanel, BizCycleTime, BizDnd, BizLoginForm, DemoWrapper, SocketClient, ajax, util, theme, convertAttributeData, BizUserTagsSelect, setGlobalConfig, };
|
|
38
|
+
export { BizTargetFromPanel, BizSearchInput, BizSelect, BizDialog, BizChart, BizTable, BizAnalysisLayout, BizDetailLayout, BizUserGroup, IconFont, ColorIcon, BizTargetSelector, BizEventSelector, BizAttributeSelector, BizGlobalDataContext, BizTargetFromPanelContext, BizTargetCondition, BizDatePicker, BizQuickDatePicker, BizConditionItem, BizConditionGroup, BizAttrCondition, BizAttrConditionGroup, BizUserCondition, BizAddToScene, BizAddToPanel, BizCycleTime, BizDnd, BizLoginForm, DemoWrapper, SocketClient, ajax, util, theme, convertAttributeData, BizUserTagsSelect, setGlobalConfig, };
|
|
38
39
|
export type { UserGroupTypes } from './userGroup/types';
|
|
39
40
|
export type { BizSelectTypes } from './select/types';
|
|
40
41
|
export type { AttributeSelect } from './attributeSelector/types';
|
package/es/index.js
CHANGED
|
@@ -7,6 +7,7 @@ import BizTargetCondition from './targetConditionGroup';
|
|
|
7
7
|
import BizConditionItem from './attrConditions';
|
|
8
8
|
import BizConditionGroup from './attrConditions/group';
|
|
9
9
|
import BizDatePicker from './datePicker';
|
|
10
|
+
import BizQuickDatePicker from './quickDatePicker';
|
|
10
11
|
import BizSelect from './select';
|
|
11
12
|
import BizDialog from './dialog';
|
|
12
13
|
import BizChart from './chart';
|
|
@@ -33,4 +34,4 @@ import BizAttrCondition from './attrCondition';
|
|
|
33
34
|
import BizAttrConditionGroup from './attrCondition/group';
|
|
34
35
|
import BizTargetFromPanel from './layout/optionTitle';
|
|
35
36
|
import { BizTargetFromPanelContext } from './layout/optionTitle/types';
|
|
36
|
-
export { BizTargetFromPanel, BizSearchInput, BizSelect, BizDialog, BizChart, BizTable, BizAnalysisLayout, BizDetailLayout, BizUserGroup, IconFont, ColorIcon, BizTargetSelector, BizEventSelector, BizAttributeSelector, BizGlobalDataContext, BizTargetFromPanelContext, BizTargetCondition, BizDatePicker, BizConditionItem, BizConditionGroup, BizAttrCondition, BizAttrConditionGroup, BizUserCondition, BizAddToScene, BizAddToPanel, BizCycleTime, BizDnd, BizLoginForm, DemoWrapper, SocketClient, ajax, util, theme, convertAttributeData, BizUserTagsSelect, setGlobalConfig };
|
|
37
|
+
export { BizTargetFromPanel, BizSearchInput, BizSelect, BizDialog, BizChart, BizTable, BizAnalysisLayout, BizDetailLayout, BizUserGroup, IconFont, ColorIcon, BizTargetSelector, BizEventSelector, BizAttributeSelector, BizGlobalDataContext, BizTargetFromPanelContext, BizTargetCondition, BizDatePicker, BizQuickDatePicker, BizConditionItem, BizConditionGroup, BizAttrCondition, BizAttrConditionGroup, BizUserCondition, BizAddToScene, BizAddToPanel, BizCycleTime, BizDnd, BizLoginForm, DemoWrapper, SocketClient, ajax, util, theme, convertAttributeData, BizUserTagsSelect, setGlobalConfig };
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
2
|
+
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."); }
|
|
3
|
+
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); }
|
|
4
|
+
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; }
|
|
5
|
+
function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
|
|
6
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
7
|
+
import { BizQuickDatePicker } from '@zgfe/business-lib';
|
|
8
|
+
import React, { useState } from 'react';
|
|
9
|
+
import '@zgfe/business-lib/es/assets/styles/resetAntd.less';
|
|
10
|
+
import { ConfigProvider } from 'antd';
|
|
11
|
+
import zhCN from 'antd/es/locale/zh_CN';
|
|
12
|
+
export default (function () {
|
|
13
|
+
var _useState = useState({
|
|
14
|
+
unit: 'day',
|
|
15
|
+
begin: '2023-06-23',
|
|
16
|
+
end: '2023-06-30',
|
|
17
|
+
relative: 7
|
|
18
|
+
}),
|
|
19
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
20
|
+
time = _useState2[0],
|
|
21
|
+
setTime = _useState2[1];
|
|
22
|
+
var onChange = function onChange(data) {
|
|
23
|
+
console.log('onChange', data);
|
|
24
|
+
setTime(data);
|
|
25
|
+
};
|
|
26
|
+
return /*#__PURE__*/React.createElement(ConfigProvider, {
|
|
27
|
+
locale: zhCN
|
|
28
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
29
|
+
style: {
|
|
30
|
+
display: 'flex'
|
|
31
|
+
}
|
|
32
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
33
|
+
style: {
|
|
34
|
+
lineHeight: '32px'
|
|
35
|
+
}
|
|
36
|
+
}, "\u9009\u62E9\u65F6\u95F4\uFF1A"), /*#__PURE__*/React.createElement(BizQuickDatePicker, {
|
|
37
|
+
defaultValue: time,
|
|
38
|
+
onChange: onChange
|
|
39
|
+
})));
|
|
40
|
+
});
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import './styles/index.less';
|
|
3
|
+
import { QuickDatePickerTypes } from './types';
|
|
4
|
+
export declare const classPrefix = "biz-quick-date-picker-wrap";
|
|
5
|
+
declare const BizQuickDatePicker: React.FC<QuickDatePickerTypes.Props>;
|
|
6
|
+
export default BizQuickDatePicker;
|
|
@@ -0,0 +1,186 @@
|
|
|
1
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
2
|
+
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."); }
|
|
3
|
+
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); }
|
|
4
|
+
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; }
|
|
5
|
+
function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
|
|
6
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
7
|
+
import React, { useEffect, useState, useRef } from 'react';
|
|
8
|
+
import './styles/index.less';
|
|
9
|
+
import moment from 'moment';
|
|
10
|
+
import { quickModuleOneOptions, quickModuleTwoOptions } from './utils';
|
|
11
|
+
import IconFont from '../icon/iconFont';
|
|
12
|
+
import { DatePicker } from 'antd';
|
|
13
|
+
import { util } from '../utils';
|
|
14
|
+
var RangePicker = DatePicker.RangePicker;
|
|
15
|
+
export var classPrefix = 'biz-quick-date-picker-wrap';
|
|
16
|
+
var BizQuickDatePicker = function BizQuickDatePicker(props) {
|
|
17
|
+
var defaultValue = props.defaultValue;
|
|
18
|
+
var domId = util.guid();
|
|
19
|
+
var _useState = useState(false),
|
|
20
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
21
|
+
show = _useState2[0],
|
|
22
|
+
setShow = _useState2[1];
|
|
23
|
+
var _useState3 = useState(-1),
|
|
24
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
25
|
+
relative = _useState4[0],
|
|
26
|
+
setRelative = _useState4[1];
|
|
27
|
+
var _useState5 = useState('day'),
|
|
28
|
+
_useState6 = _slicedToArray(_useState5, 2),
|
|
29
|
+
unit = _useState6[0],
|
|
30
|
+
setUnit = _useState6[1];
|
|
31
|
+
var _useState7 = useState([moment().subtract(6, 'day'), moment()]),
|
|
32
|
+
_useState8 = _slicedToArray(_useState7, 2),
|
|
33
|
+
value = _useState8[0],
|
|
34
|
+
setValue = _useState8[1];
|
|
35
|
+
var _useState9 = useState('过去7天'),
|
|
36
|
+
_useState10 = _slicedToArray(_useState9, 2),
|
|
37
|
+
showText = _useState10[0],
|
|
38
|
+
setShowText = _useState10[1];
|
|
39
|
+
var _useState11 = useState(50),
|
|
40
|
+
_useState12 = _slicedToArray(_useState11, 2),
|
|
41
|
+
tipWidth = _useState12[0],
|
|
42
|
+
setTipWidth = _useState12[1];
|
|
43
|
+
useEffect(function () {
|
|
44
|
+
var _value = defaultValue || props.value;
|
|
45
|
+
if (_value && _value.begin !== '') {
|
|
46
|
+
setValue([moment(_value.begin), moment(_value.end)]);
|
|
47
|
+
_value.relative && setRelative(_value.relative);
|
|
48
|
+
_value.unit && setUnit(_value.unit);
|
|
49
|
+
if (_value.relative === -1) {
|
|
50
|
+
setShowText('自定义');
|
|
51
|
+
setTipWidth(62);
|
|
52
|
+
} else if (_value && _value.relative && _value.unit === 'day') {
|
|
53
|
+
quickModuleTwoOptions.map(function (item) {
|
|
54
|
+
if (item.value === _value.relative) {
|
|
55
|
+
setShowText(item.label);
|
|
56
|
+
setTipWidth(item.width);
|
|
57
|
+
}
|
|
58
|
+
});
|
|
59
|
+
} else {
|
|
60
|
+
quickModuleOneOptions.map(function (item) {
|
|
61
|
+
if (item.value === _value.relative) {
|
|
62
|
+
setShowText(item.label);
|
|
63
|
+
setTipWidth(item.width);
|
|
64
|
+
}
|
|
65
|
+
});
|
|
66
|
+
}
|
|
67
|
+
}
|
|
68
|
+
}, [defaultValue, props.value]);
|
|
69
|
+
var onOpenChange = function onOpenChange(show) {
|
|
70
|
+
setShow(show);
|
|
71
|
+
};
|
|
72
|
+
var onChange = function onChange(date, dateString) {
|
|
73
|
+
setShowText('自定义');
|
|
74
|
+
setTipWidth(62);
|
|
75
|
+
setRelative(-1);
|
|
76
|
+
if (date === null) {
|
|
77
|
+
setValue(undefined);
|
|
78
|
+
var changeValue = {
|
|
79
|
+
unit: 'day',
|
|
80
|
+
begin: '',
|
|
81
|
+
end: '',
|
|
82
|
+
relative: -1
|
|
83
|
+
};
|
|
84
|
+
props.onChange && props.onChange(changeValue);
|
|
85
|
+
} else {
|
|
86
|
+
setValue(date);
|
|
87
|
+
var _changeValue = {
|
|
88
|
+
unit: 'day',
|
|
89
|
+
begin: dateString[0],
|
|
90
|
+
end: dateString[1],
|
|
91
|
+
relative: -1
|
|
92
|
+
};
|
|
93
|
+
props.onChange && props.onChange(_changeValue);
|
|
94
|
+
}
|
|
95
|
+
};
|
|
96
|
+
var disabledDate = function disabledDate(current) {
|
|
97
|
+
return current && current > moment().endOf('month');
|
|
98
|
+
};
|
|
99
|
+
var quickModuleHandle = function quickModuleHandle(item) {
|
|
100
|
+
setTipWidth(item.width);
|
|
101
|
+
var _value;
|
|
102
|
+
if (item.type === 'week' || item.type === 'month') {
|
|
103
|
+
switch (Number(item.value)) {
|
|
104
|
+
case 1:
|
|
105
|
+
_value = [moment().isoWeekday(1), moment().isoWeekday(7)];
|
|
106
|
+
break;
|
|
107
|
+
case 2:
|
|
108
|
+
_value = [moment().isoWeekday(1).subtract(1, 'week'), moment().isoWeekday(7).subtract(1, 'week')];
|
|
109
|
+
break;
|
|
110
|
+
case 3:
|
|
111
|
+
_value = [moment().startOf('month'), moment().endOf('month')];
|
|
112
|
+
break;
|
|
113
|
+
case 4:
|
|
114
|
+
_value = [moment().startOf('month').subtract(1, 'month'), moment().endOf('month').subtract(1, 'month')];
|
|
115
|
+
break;
|
|
116
|
+
}
|
|
117
|
+
} else {
|
|
118
|
+
_value = [moment().subtract(Number(item.value) - 1, 'day'), moment()];
|
|
119
|
+
}
|
|
120
|
+
setRelative(item.value);
|
|
121
|
+
setUnit(item.type);
|
|
122
|
+
setShowText(item.label);
|
|
123
|
+
setValue(_value);
|
|
124
|
+
RangePickerRef.current && RangePickerRef.current.blur();
|
|
125
|
+
if (_value) {
|
|
126
|
+
var changeValue = {
|
|
127
|
+
unit: item.type,
|
|
128
|
+
begin: _value[0].format('YYYY-MM-DD'),
|
|
129
|
+
end: _value[1].format('YYYY-MM-DD'),
|
|
130
|
+
relative: item.value
|
|
131
|
+
};
|
|
132
|
+
props.onChange && props.onChange(changeValue);
|
|
133
|
+
}
|
|
134
|
+
};
|
|
135
|
+
var RangePickerRef = useRef(null);
|
|
136
|
+
var renderExtraFooter = function renderExtraFooter() {
|
|
137
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
138
|
+
className: "".concat(classPrefix, "-content-options")
|
|
139
|
+
}, /*#__PURE__*/React.createElement("ol", null, quickModuleOneOptions.map(function (item) {
|
|
140
|
+
return /*#__PURE__*/React.createElement("li", {
|
|
141
|
+
className: "".concat(item.type === unit && item.value === relative ? 'active' : ''),
|
|
142
|
+
key: item.label,
|
|
143
|
+
onClick: function onClick() {
|
|
144
|
+
return quickModuleHandle(item);
|
|
145
|
+
}
|
|
146
|
+
}, item.label);
|
|
147
|
+
})), /*#__PURE__*/React.createElement("ol", null, quickModuleTwoOptions.map(function (item) {
|
|
148
|
+
return /*#__PURE__*/React.createElement("li", {
|
|
149
|
+
className: "".concat(item.type === unit && item.value === relative ? 'active' : ''),
|
|
150
|
+
key: item.label,
|
|
151
|
+
onClick: function onClick() {
|
|
152
|
+
return quickModuleHandle(item);
|
|
153
|
+
}
|
|
154
|
+
}, item.label);
|
|
155
|
+
})), /*#__PURE__*/React.createElement("div", {
|
|
156
|
+
className: "".concat(relative === -1 ? 'active' : '')
|
|
157
|
+
}, "\u81EA\u5B9A\u4E49\u65F6\u95F4", /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(IconFont, {
|
|
158
|
+
type: "fanhuiicon"
|
|
159
|
+
}))));
|
|
160
|
+
};
|
|
161
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
162
|
+
id: domId,
|
|
163
|
+
className: "".concat(classPrefix, " clearfix ").concat(show ? 'focus' : '')
|
|
164
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
165
|
+
className: "".concat(classPrefix, "-tip"),
|
|
166
|
+
style: {
|
|
167
|
+
pointerEvents: 'none'
|
|
168
|
+
}
|
|
169
|
+
}, showText), /*#__PURE__*/React.createElement(RangePicker, {
|
|
170
|
+
style: {
|
|
171
|
+
paddingLeft: "".concat(tipWidth, "px")
|
|
172
|
+
},
|
|
173
|
+
popupClassName: "".concat(classPrefix, "-content"),
|
|
174
|
+
ref: RangePickerRef,
|
|
175
|
+
getPopupContainer: function getPopupContainer() {
|
|
176
|
+
return document.getElementById(domId);
|
|
177
|
+
},
|
|
178
|
+
separator: '至',
|
|
179
|
+
value: value,
|
|
180
|
+
onOpenChange: onOpenChange,
|
|
181
|
+
disabledDate: disabledDate,
|
|
182
|
+
onChange: onChange,
|
|
183
|
+
renderExtraFooter: renderExtraFooter
|
|
184
|
+
}));
|
|
185
|
+
};
|
|
186
|
+
export default BizQuickDatePicker;
|