@zgfe/business-lib 1.2.29 → 1.2.32
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/attributeSelector/demo/index.js +1 -1
- package/es/attributeSelector/index.js +4 -2
- package/es/attributeSelector/listPanel.js +3 -2
- package/es/attributeSelector/types.d.ts +1 -0
- package/es/chart/demo/data/data6.d.ts +19 -0
- package/es/chart/demo/data/data6.js +51 -0
- package/es/chart/demo/muit_y.d.ts +3 -0
- package/es/chart/demo/muit_y.js +18 -0
- package/es/chart/index.js +6 -5
- package/es/chart/types.d.ts +2 -1
- package/es/chart/util/chartOptionConfig.d.ts +3 -1
- package/es/chart/util/chartOptionConfig.js +21 -8
- package/es/chart/util/formatData.js +2 -1
- package/package.json +2 -2
|
@@ -24,7 +24,8 @@ var BizAttributeSelector = function BizAttributeSelector(props) {
|
|
|
24
24
|
theme = props.theme,
|
|
25
25
|
extra = props.extra,
|
|
26
26
|
isNumber = props.isNumber,
|
|
27
|
-
overlayClassName = props.overlayClassName
|
|
27
|
+
overlayClassName = props.overlayClassName,
|
|
28
|
+
isStrNum = props.isStrNum;
|
|
28
29
|
var _useState = useState(),
|
|
29
30
|
_useState2 = _slicedToArray(_useState, 2),
|
|
30
31
|
currentAttr = _useState2[0],
|
|
@@ -122,7 +123,8 @@ var BizAttributeSelector = function BizAttributeSelector(props) {
|
|
|
122
123
|
}, props), {}, {
|
|
123
124
|
value: currentAttr,
|
|
124
125
|
onChange: onChange,
|
|
125
|
-
isNumber: isNumber
|
|
126
|
+
isNumber: isNumber,
|
|
127
|
+
isStrNum: isStrNum
|
|
126
128
|
}));
|
|
127
129
|
},
|
|
128
130
|
trigger: ['click'],
|
|
@@ -24,7 +24,8 @@ var AttrListPanel = function AttrListPanel(props) {
|
|
|
24
24
|
eventIdList = props.eventIdList,
|
|
25
25
|
funnelEventIdList = props.funnelEventIdList,
|
|
26
26
|
extra = props.extra,
|
|
27
|
-
isNumber = props.isNumber
|
|
27
|
+
isNumber = props.isNumber,
|
|
28
|
+
isStrNum = props.isStrNum;
|
|
28
29
|
var _useState = useState(''),
|
|
29
30
|
_useState2 = _slicedToArray(_useState, 2),
|
|
30
31
|
searchValue = _useState2[0],
|
|
@@ -158,7 +159,7 @@ var AttrListPanel = function AttrListPanel(props) {
|
|
|
158
159
|
anchor: hasAnchor ? String(Math.random()) : anchor.event,
|
|
159
160
|
key: "event-".concat(event.id),
|
|
160
161
|
children: event.attrList.slice().filter(function (item) {
|
|
161
|
-
return isNumber ? item.type === 2 : true;
|
|
162
|
+
return isStrNum ? item.type === 2 || item.type === 1 : isNumber ? item.type === 2 : true;
|
|
162
163
|
})
|
|
163
164
|
};
|
|
164
165
|
list.push(group);
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
declare const _default: {
|
|
2
|
+
series: ({
|
|
3
|
+
type: string;
|
|
4
|
+
names: string[];
|
|
5
|
+
values: number[];
|
|
6
|
+
yAxisIndex: number;
|
|
7
|
+
duration?: undefined;
|
|
8
|
+
index?: undefined;
|
|
9
|
+
} | {
|
|
10
|
+
duration: never[];
|
|
11
|
+
type: string;
|
|
12
|
+
index: string;
|
|
13
|
+
names: string[];
|
|
14
|
+
values: number[];
|
|
15
|
+
yAxisIndex: number;
|
|
16
|
+
})[];
|
|
17
|
+
xAxis: string[];
|
|
18
|
+
};
|
|
19
|
+
export default _default;
|
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
export default {
|
|
2
|
+
series: [{
|
|
3
|
+
type: 'bar',
|
|
4
|
+
names: ['histogramFirstUv1'],
|
|
5
|
+
values: [12, 23, 34, 45, 56],
|
|
6
|
+
yAxisIndex: 0
|
|
7
|
+
}, {
|
|
8
|
+
duration: [],
|
|
9
|
+
type: 'bar',
|
|
10
|
+
index: '人数',
|
|
11
|
+
names: ['histogramSecondUv2'],
|
|
12
|
+
values: [21, 32, 43, 54, 65],
|
|
13
|
+
yAxisIndex: 0
|
|
14
|
+
}, {
|
|
15
|
+
duration: [],
|
|
16
|
+
type: 'bar',
|
|
17
|
+
index: '人数',
|
|
18
|
+
names: ['lineChartFirstUv3'],
|
|
19
|
+
values: [1123, 3123, 1233, 2231, 4322],
|
|
20
|
+
yAxisIndex: 1
|
|
21
|
+
}, {
|
|
22
|
+
duration: [],
|
|
23
|
+
type: 'bar',
|
|
24
|
+
index: '人数',
|
|
25
|
+
names: ['lineChartSecondUv4'],
|
|
26
|
+
values: [2133, 1235, 4321, 2234, 2323],
|
|
27
|
+
yAxisIndex: 1
|
|
28
|
+
}, {
|
|
29
|
+
duration: [],
|
|
30
|
+
type: 'bar',
|
|
31
|
+
index: '人数',
|
|
32
|
+
names: ['lineChartSecondUv5'],
|
|
33
|
+
values: [3242, 2342, 4234, 2123, 3242],
|
|
34
|
+
yAxisIndex: 1
|
|
35
|
+
}, {
|
|
36
|
+
duration: [],
|
|
37
|
+
type: 'bar',
|
|
38
|
+
index: '人数',
|
|
39
|
+
names: ['lineChartSecondUv6'],
|
|
40
|
+
values: [2343, 3242, 3434, 4352, 2344],
|
|
41
|
+
yAxisIndex: 1
|
|
42
|
+
}, {
|
|
43
|
+
duration: [],
|
|
44
|
+
type: 'line',
|
|
45
|
+
index: '额度',
|
|
46
|
+
names: ['lineChartFirstNv'],
|
|
47
|
+
values: [0.1, 0.2, 0.3, 0.4, 0.5],
|
|
48
|
+
yAxisIndex: 2
|
|
49
|
+
}],
|
|
50
|
+
xAxis: ['2023-10-25 00:00:00', '2023-10-25 01:00:00', '2023-10-25 02:00:00', '2023-10-25 03:00:00', '2023-10-25 04:00:00']
|
|
51
|
+
};
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { BizChart } from '@zgfe/business-lib';
|
|
3
|
+
import data from './data/data6';
|
|
4
|
+
export default (function () {
|
|
5
|
+
return /*#__PURE__*/React.createElement(BizChart, {
|
|
6
|
+
data: data,
|
|
7
|
+
type: "muit_y",
|
|
8
|
+
showAll: false,
|
|
9
|
+
legendPosition: "bottom",
|
|
10
|
+
muit_yAxis: [{
|
|
11
|
+
name: '单位:张'
|
|
12
|
+
}, {
|
|
13
|
+
name: '单位:百万'
|
|
14
|
+
}, {
|
|
15
|
+
show: false
|
|
16
|
+
}]
|
|
17
|
+
});
|
|
18
|
+
});
|
package/es/chart/index.js
CHANGED
|
@@ -41,7 +41,8 @@ var BizChart = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
41
41
|
legendOrient = props.legendOrient,
|
|
42
42
|
autoHeight = props.autoHeight,
|
|
43
43
|
isHideLegend = props.isHideLegend,
|
|
44
|
-
tooltipTrigger = props.tooltipTrigger
|
|
44
|
+
tooltipTrigger = props.tooltipTrigger,
|
|
45
|
+
muit_yAxis = props.muit_yAxis;
|
|
45
46
|
var _useState = useState({}),
|
|
46
47
|
_useState2 = _slicedToArray(_useState, 2),
|
|
47
48
|
chartOption = _useState2[0],
|
|
@@ -109,10 +110,10 @@ var BizChart = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
109
110
|
if (type === 'pie') {
|
|
110
111
|
var rData = formatPieData(data, showAll, showList, props.showOther);
|
|
111
112
|
eOption = getPieOption(rData, legendPosition, legendOrient, props.showLabel, props.radius, props.center, tooltipFormatter);
|
|
112
|
-
} else if (type === 'line' || type === 'bar' || type === 'line_bar') {
|
|
113
|
-
var _rData = formatChartData(data, showAll, showList, reverseXAxis, colors, type === 'line_bar');
|
|
114
|
-
eOption = getChartOption(type, _rData, legendPosition, legendOrient, valueUnit, xRotate, yRotate, tooltipFormatter, xAxisFormatter, yAxisFormatter, legendFormatter, reverseXAxis, seriesName, isHideLegend, tooltipTrigger);
|
|
115
|
-
if (type === 'line_bar') {
|
|
113
|
+
} else if (type === 'line' || type === 'bar' || type === 'line_bar' || type === 'muit_y') {
|
|
114
|
+
var _rData = formatChartData(data, showAll, showList, reverseXAxis, colors, type === 'line_bar' || type === 'muit_y');
|
|
115
|
+
eOption = getChartOption(type, _rData, legendPosition, legendOrient, valueUnit, xRotate, yRotate, tooltipFormatter, xAxisFormatter, yAxisFormatter, legendFormatter, reverseXAxis, seriesName, isHideLegend, tooltipTrigger, muit_yAxis);
|
|
116
|
+
if (type === 'line_bar' || type === 'muit_y') {
|
|
116
117
|
eOption.grid.right = '1%';
|
|
117
118
|
eOption.grid.left = '1%';
|
|
118
119
|
}
|
package/es/chart/types.d.ts
CHANGED
|
@@ -28,7 +28,7 @@ export declare namespace ChartTypes {
|
|
|
28
28
|
};
|
|
29
29
|
}
|
|
30
30
|
interface Props {
|
|
31
|
-
type?: 'bar' | 'pie' | 'line' | 'map' | 'line_bar';
|
|
31
|
+
type?: 'bar' | 'pie' | 'line' | 'map' | 'line_bar' | 'muit_y';
|
|
32
32
|
data?: Value;
|
|
33
33
|
option?: EChartsOption;
|
|
34
34
|
isCity?: boolean;
|
|
@@ -54,5 +54,6 @@ export declare namespace ChartTypes {
|
|
|
54
54
|
autoHeight?: boolean;
|
|
55
55
|
isHideLegend?: boolean;
|
|
56
56
|
tooltipTrigger?: string;
|
|
57
|
+
muit_yAxis?: {}[];
|
|
57
58
|
}
|
|
58
59
|
}
|
|
@@ -10,7 +10,9 @@ export declare const gridConfig: GridOption;
|
|
|
10
10
|
export declare const xAxisConfig: XAXisOption;
|
|
11
11
|
export declare const yAxisConfig: YAXisOption;
|
|
12
12
|
export declare const tooltipConfig: TooltipComponentOption;
|
|
13
|
-
export declare const getChartOption: (chartType: string, data: ChartTypes.Value, legendPosition?: 'top' | 'bottom' | 'middle', legendOrient?: 'horizontal' | 'vertical', unit?: string, xRotate?: number, yRotate?: number, tooltipFormatter?: ((value: any) => string) | undefined, xAxisFormatter?: ((value: any) => string) | undefined, yAxisFormatter?: ((value: any) => string) | undefined, legendFormatter?: ((value: any) => string) | undefined, reverseXAxis?: boolean, seriesName?: string, isHideLegend?: boolean, tooltipTrigger?: string
|
|
13
|
+
export declare const getChartOption: (chartType: string, data: ChartTypes.Value, legendPosition?: 'top' | 'bottom' | 'middle', legendOrient?: 'horizontal' | 'vertical', unit?: string, xRotate?: number, yRotate?: number, tooltipFormatter?: ((value: any) => string) | undefined, xAxisFormatter?: ((value: any) => string) | undefined, yAxisFormatter?: ((value: any) => string) | undefined, legendFormatter?: ((value: any) => string) | undefined, reverseXAxis?: boolean, seriesName?: string, isHideLegend?: boolean, tooltipTrigger?: string, muit_yAxis?: {
|
|
14
|
+
name?: string;
|
|
15
|
+
}[]) => EChartsOption;
|
|
14
16
|
export declare const getPieOption: (seriesData?: object[], legendPosition?: 'top' | 'bottom' | 'middle', legendOrient?: 'horizontal' | 'vertical', showLabel?: boolean, radius?: string | number | Array<string | number>, center?: Array<string | number>, tooltipFormatter?: ((value: any) => string) | undefined, legendFormatter?: ((value: any) => string) | undefined) => EChartsOption;
|
|
15
17
|
export declare const getMapOption: (seriesData: object[] | undefined, maxMinValue: {
|
|
16
18
|
min: number;
|
|
@@ -124,6 +124,7 @@ export var getChartOption = function getChartOption(chartType, data) {
|
|
|
124
124
|
var seriesName = arguments.length > 12 ? arguments[12] : undefined;
|
|
125
125
|
var isHideLegend = arguments.length > 13 ? arguments[13] : undefined;
|
|
126
126
|
var tooltipTrigger = arguments.length > 14 ? arguments[14] : undefined;
|
|
127
|
+
var muit_yAxis = arguments.length > 15 ? arguments[15] : undefined;
|
|
127
128
|
var xAxis = JSON.parse(JSON.stringify(xAxisConfig)),
|
|
128
129
|
tooltip = JSON.parse(JSON.stringify(tooltipConfig)),
|
|
129
130
|
yAxis = _objectSpread({}, yAxisConfig),
|
|
@@ -136,7 +137,7 @@ export var getChartOption = function getChartOption(chartType, data) {
|
|
|
136
137
|
if (data.xAxis) {
|
|
137
138
|
xAxis.data = data.xAxis;
|
|
138
139
|
}
|
|
139
|
-
xAxis.boundaryGap = chartType === 'bar' || chartType === 'line_bar';
|
|
140
|
+
xAxis.boundaryGap = chartType === 'bar' || chartType === 'line_bar' || chartType === 'muit_y';
|
|
140
141
|
xAxis.axisLabel = xAxis.axisLabel || {
|
|
141
142
|
rotate: 0
|
|
142
143
|
};
|
|
@@ -155,7 +156,7 @@ export var getChartOption = function getChartOption(chartType, data) {
|
|
|
155
156
|
return yAxisFormatterDefault(value, unit);
|
|
156
157
|
};
|
|
157
158
|
}
|
|
158
|
-
if (chartType === 'line_bar') {
|
|
159
|
+
if (chartType === 'line_bar' || chartType === 'muit_y') {
|
|
159
160
|
yAxis.alignTicks = true;
|
|
160
161
|
yAxis.minInterval = 1;
|
|
161
162
|
}
|
|
@@ -165,24 +166,28 @@ export var getChartOption = function getChartOption(chartType, data) {
|
|
|
165
166
|
}
|
|
166
167
|
if (!reverseXAxis) {
|
|
167
168
|
series = data.series.map(function (item) {
|
|
168
|
-
return _objectSpread(_objectSpread(_objectSpread({}, item), seriesItem), {}, {
|
|
169
|
-
type: chartType === 'line_bar' ? item.type : chartType
|
|
169
|
+
return _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, item), seriesItem), {}, {
|
|
170
|
+
type: chartType === 'line_bar' || chartType === 'muit_y' ? item.type : chartType
|
|
170
171
|
}, chartType === 'line_bar' ? {
|
|
171
172
|
yAxisIndex: item.type === 'line' ? 1 : 0
|
|
173
|
+
} : {}), chartType === 'muit_y' ? {
|
|
174
|
+
yAxisIndex: item.yAxisIndex
|
|
172
175
|
} : {});
|
|
173
176
|
});
|
|
174
177
|
} else {
|
|
175
|
-
series = [_objectSpread(_objectSpread({
|
|
178
|
+
series = [_objectSpread(_objectSpread(_objectSpread({
|
|
176
179
|
name: seriesName || '',
|
|
177
180
|
data: data.series
|
|
178
181
|
}, seriesItem), {}, {
|
|
179
|
-
type: chartType === 'line_bar' ? seriesItem.type : chartType
|
|
182
|
+
type: chartType === 'line_bar' || chartType === 'muit_y' ? seriesItem.type : chartType
|
|
180
183
|
}, chartType === 'line_bar' ? {
|
|
181
184
|
yAxisIndex: seriesItem.type === 'line' ? 1 : 0
|
|
185
|
+
} : {}), chartType === 'muit_y' ? {
|
|
186
|
+
yAxisIndex: seriesItem.yAxisIndex
|
|
182
187
|
} : {})];
|
|
183
188
|
}
|
|
184
189
|
tooltip.axisPointer = tooltip.axisPointer || {};
|
|
185
|
-
tooltip.axisPointer.type = chartType === 'bar' || chartType === 'line_bar' ? 'shadow' : 'line';
|
|
190
|
+
tooltip.axisPointer.type = chartType === 'bar' || chartType === 'line_bar' || chartType === 'muit_y' ? 'shadow' : 'line';
|
|
186
191
|
tooltip.formatter = function (params) {
|
|
187
192
|
return tooltipFormatter ? tooltipFormatter(params) : tooltip.trigger === 'item' ? tooltipFormatterItemDefault(params, data.resultFormatMap, unit) : tooltipFormatterDefault(params, data.resultFormatMap, unit);
|
|
188
193
|
};
|
|
@@ -202,11 +207,19 @@ export var getChartOption = function getChartOption(chartType, data) {
|
|
|
202
207
|
legend.width = 50;
|
|
203
208
|
grid.left = '10%';
|
|
204
209
|
}
|
|
205
|
-
if (chartType === 'line') {
|
|
210
|
+
if (chartType === 'line' || chartType === 'muit_y') {
|
|
206
211
|
legend.icon = 'circle';
|
|
207
212
|
}
|
|
208
213
|
legend.formatter = legendFormatter ? legendFormatter : legendFormatterDefault;
|
|
209
214
|
var dealyAxis = chartType === 'line_bar' ? [yAxis, yAxis] : yAxis;
|
|
215
|
+
if (chartType === 'muit_y' && muit_yAxis) {
|
|
216
|
+
dealyAxis = muit_yAxis === null || muit_yAxis === void 0 ? void 0 : muit_yAxis.map(function (item) {
|
|
217
|
+
if (item && item.name) {
|
|
218
|
+
grid.top = 45;
|
|
219
|
+
}
|
|
220
|
+
return _objectSpread(_objectSpread({}, yAxis), item);
|
|
221
|
+
});
|
|
222
|
+
}
|
|
210
223
|
return _objectSpread(_objectSpread({}, baseConfig), {}, {
|
|
211
224
|
legend: legend,
|
|
212
225
|
xAxis: xAxis,
|
|
@@ -70,7 +70,8 @@ export var formatChartData = function formatChartData(data, showAll, showList, r
|
|
|
70
70
|
}, seriesItem.stack ? {
|
|
71
71
|
stack: seriesItem.stack
|
|
72
72
|
} : {}), {}, {
|
|
73
|
-
type: isUseSelf ? seriesItem.type : undefined
|
|
73
|
+
type: isUseSelf ? seriesItem.type : undefined,
|
|
74
|
+
yAxisIndex: isUseSelf ? seriesItem.yAxisIndex : undefined
|
|
74
75
|
}));
|
|
75
76
|
}
|
|
76
77
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@zgfe/business-lib",
|
|
3
|
-
"version": "1.2.
|
|
3
|
+
"version": "1.2.32",
|
|
4
4
|
"module": "es/index.js",
|
|
5
5
|
"typings": "es/index.d.ts",
|
|
6
6
|
"files": [
|
|
@@ -55,7 +55,7 @@
|
|
|
55
55
|
"react": "^16.12.0 || ^17.0.0",
|
|
56
56
|
"yorkie": "^2.0.0"
|
|
57
57
|
},
|
|
58
|
-
"gitHead": "
|
|
58
|
+
"gitHead": "ec4c1b653da8285638008767c73e3e708fdc4402",
|
|
59
59
|
"gitHooks": {
|
|
60
60
|
"pre-commit": "lint-staged"
|
|
61
61
|
}
|