wargerm 0.4.25 → 0.4.28

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/index.esm.js CHANGED
@@ -52,6 +52,12 @@ import Player from 'xgplayer';
52
52
  import FlvPlayer from 'xgplayer-flv.js';
53
53
  import HlsJsPlayer from 'xgplayer-hls.js';
54
54
  import { isEmpty } from 'lodash';
55
+ import ReactEChartsCore from 'echarts-for-react/lib/core';
56
+ import * as echarts from 'echarts/core';
57
+ import { use, registerTheme } from 'echarts/core';
58
+ import { BarChart, LineChart, PieChart, RadarChart, PictorialBarChart, CustomChart } from 'echarts/charts';
59
+ import { TitleComponent, TooltipComponent, GridComponent, LegendComponent, LegendPlainComponent, MarkLineComponent, LegendScrollComponent, PolarComponent, GraphicComponent, ToolboxComponent } from 'echarts/components';
60
+ import { CanvasRenderer } from 'echarts/renderers';
55
61
 
56
62
  function ownKeys(object, enumerableOnly) {
57
63
  var keys = Object.keys(object);
@@ -540,8 +546,8 @@ Index$3.Group = _Checkbox.Group;
540
546
  /*
541
547
  * @Author: lijin
542
548
  * @Date: 2021-10-27 22:18:49
543
- * @LastEditTime: 2021-10-29 14:50:11
544
- * @LastEditors: lijin
549
+ * @LastEditTime: 2022-06-30 16:51:49
550
+ * @LastEditors: caldelle 793238465@qq.com
545
551
  * @Description:
546
552
  * @FilePath: \wargerm\src\utils\index.ts
547
553
  * 可以输入预定的版权声明、个性签名、空行等
@@ -601,6 +607,12 @@ function getArrayLayer(arr, attr) {
601
607
 
602
608
  return newIndex;
603
609
  }
610
+ var calcWidth = function calcWidth(width) {
611
+ return document.body.clientWidth / 3840 * width;
612
+ };
613
+ var calcHeight = function calcHeight(height) {
614
+ return document.body.clientHeight / 2160 * height;
615
+ };
604
616
 
605
617
  var _excluded$1 = ["className", "frameStyle", "style", "direction", "children"];
606
618
  function FrameBox(_ref) {
@@ -6747,7 +6759,7 @@ var WCascader = function WCascader(props) {
6747
6759
  }, extraProps));
6748
6760
  };
6749
6761
 
6750
- var _excluded$6 = ["columns", "extraColumns", "className", "style", "search", "disabled", "disabledHideInSearch", "disabledRuler", "onFormChange", "onSubmit", "onReset"];
6762
+ var _excluded$6 = ["columns", "extraColumns", "className", "style", "search", "disabled", "disabledHideInSearch", "disabledRuler", "onFormChange", "onSubmit", "onReset", "setForm"];
6751
6763
  var RangePicker$2 = Index$5.RangePicker;
6752
6764
 
6753
6765
  var WForm = function WForm(props, ref) {
@@ -6762,6 +6774,7 @@ var WForm = function WForm(props, ref) {
6762
6774
  onFormChange = props.onFormChange,
6763
6775
  onSubmit = props.onSubmit,
6764
6776
  onReset = props.onReset,
6777
+ setForm = props.setForm,
6765
6778
  extraProps = _objectWithoutProperties(props, _excluded$6);
6766
6779
 
6767
6780
  var _Form$useForm = _Form.useForm(),
@@ -7895,6 +7908,17 @@ var WForm = function WForm(props, ref) {
7895
7908
  setFieldsValue: setFieldsValue
7896
7909
  };
7897
7910
  });
7911
+ useEffect(function () {
7912
+ if (form) {
7913
+ setForm && setForm(form);
7914
+ }
7915
+
7916
+ return function () {
7917
+ if (form) {
7918
+ setForm && setForm(null);
7919
+ }
7920
+ };
7921
+ }, []);
7898
7922
  return /*#__PURE__*/React.createElement(_Form, _objectSpread2({
7899
7923
  style: {
7900
7924
  marginBottom: '20px',
@@ -11133,7 +11157,7 @@ function Xgplay(_ref, fRef) {
11133
11157
  var playerRef = useRef(null);
11134
11158
  useEffect(function () {
11135
11159
  if (ref.current) {
11136
- if ((type === null || type === void 0 ? void 0 : type.indexOf('hls')) !== -1) {
11160
+ if ((type === null || type === void 0 ? void 0 : type.indexOf('m3u8')) !== -1) {
11137
11161
  playerRef.current = new HlsJsPlayer(_objectSpread2({
11138
11162
  el: ref.current,
11139
11163
  width: '100%',
@@ -11150,7 +11174,19 @@ function Xgplay(_ref, fRef) {
11150
11174
  height: '100%',
11151
11175
  autoplay: true,
11152
11176
  isLive: true,
11153
- autoplayMuted: true
11177
+ autoplayMuted: true,
11178
+ flvOptionalConfig: {
11179
+ enableWorker: true,
11180
+ enableStashBuffer: false,
11181
+ stashInitialSize: 2048,
11182
+ lazyLoad: true,
11183
+ lazyLoadMaxDuration: 2 * 60,
11184
+ autoCleanupSourceBuffer: true,
11185
+ autoCleanupMaxBackwardDuration: 35 * 60,
11186
+ autoCleanupMinBackwardDuration: 30 * 60,
11187
+ reuseRedirectedURL: true //重用301/302重定向url,用于随后的请求,如查找、重新连接等
11188
+
11189
+ }
11154
11190
  }, config));
11155
11191
  setRef(playerRef.current);
11156
11192
  } else if ((type === null || type === void 0 ? void 0 : type.indexOf('mp4')) !== -1) {
@@ -11220,8 +11256,10 @@ function VideoPlayer(_ref, ref) {
11220
11256
  config = _ref$config === void 0 ? {} : _ref$config,
11221
11257
  layoutIndex = _ref.layoutIndex,
11222
11258
  _ref$url = _ref.url,
11223
- url = _ref$url === void 0 ? [] : _ref$url;
11224
- var layouts = [{
11259
+ url = _ref$url === void 0 ? [] : _ref$url,
11260
+ _ref$layouts = _ref.layouts,
11261
+ layouts = _ref$layouts === void 0 ? [] : _ref$layouts;
11262
+ var basicLayouts = [{
11225
11263
  title: '1x1布局',
11226
11264
  style: {
11227
11265
  gridTemplateColumns: '1fr',
@@ -11253,6 +11291,7 @@ function VideoPlayer(_ref, ref) {
11253
11291
  }),
11254
11292
  span: 9
11255
11293
  }];
11294
+ var allLayouts = [].concat(_toConsumableArray(layouts), basicLayouts);
11256
11295
 
11257
11296
  var _useState = useState(layoutIndex || 0),
11258
11297
  _useState2 = _slicedToArray(_useState, 2),
@@ -11264,7 +11303,7 @@ function VideoPlayer(_ref, ref) {
11264
11303
  urls = _useState4[0],
11265
11304
  setUrls = _useState4[1];
11266
11305
 
11267
- var initPlayerIndex = layouts[layoutIndex || 0].span >= url.length ? url.length - 1 >= 0 ? url.length - 1 : 0 : layouts[layoutIndex || 0].span - 1;
11306
+ var initPlayerIndex = allLayouts[layoutIndex || 0].span >= url.length ? url.length - 1 >= 0 ? url.length - 1 : 0 : allLayouts[layoutIndex || 0].span - 1;
11268
11307
 
11269
11308
  var _useState5 = useState(initPlayerIndex),
11270
11309
  _useState6 = _slicedToArray(_useState5, 2),
@@ -11280,7 +11319,7 @@ function VideoPlayer(_ref, ref) {
11280
11319
  setPlayers = _useState8[1];
11281
11320
 
11282
11321
  var renderDom = useMemo(function () {
11283
- var arr = new Array(layouts[currentLayoutIndex].span).fill(0);
11322
+ var arr = new Array(allLayouts[currentLayoutIndex].span).fill(0);
11284
11323
  return arr.map(function (item, index) {
11285
11324
  return /*#__PURE__*/React.createElement("div", {
11286
11325
  key: index,
@@ -11361,22 +11400,24 @@ function VideoPlayer(_ref, ref) {
11361
11400
  }, /*#__PURE__*/React.createElement("div", {
11362
11401
  ref: domRef,
11363
11402
  className: "videoContainer-grid",
11364
- style: layouts[currentLayoutIndex].style
11403
+ style: allLayouts[currentLayoutIndex].style
11365
11404
  }, renderDom), footer ? /*#__PURE__*/React.createElement("div", {
11366
11405
  className: "tools"
11367
- }, layouts.map(function (item, index) {
11406
+ }, allLayouts.map(function (item, index) {
11368
11407
  return /*#__PURE__*/React.createElement("div", {
11369
11408
  key: index,
11370
11409
  className: "btnbox",
11371
11410
  onClick: function onClick() {
11372
- var playerIndex = layouts[index || 0].span > url.length ? url.length - 1 >= 0 ? url.length : 0 : layouts[index || 0].span - 1;
11411
+ var playerIndex = allLayouts[index || 0].span > url.length ? url.length - 1 >= 0 ? url.length : 0 : allLayouts[index || 0].span - 1;
11373
11412
  setCurrentPlayerIndex(playerIndex);
11374
11413
  setCurrentLayoutIndex(index);
11375
11414
  }
11376
11415
  }, /*#__PURE__*/React.createElement(_Tooltip, {
11377
11416
  placement: "top",
11378
11417
  title: item.title
11379
- }, item.icon));
11418
+ }, item.icon || /*#__PURE__*/React.createElement(IconFont, {
11419
+ type: "icon-dantupailie"
11420
+ })));
11380
11421
  })) : null));
11381
11422
  }
11382
11423
 
@@ -11612,4 +11653,593 @@ var index$4 = (function (_ref) {
11612
11653
  });
11613
11654
  });
11614
11655
 
11615
- export { Index$9 as AutoScroll, Index$b as Breadcrumb, WButton as Button, index$1 as Card, WCascader as Cascader, Index$3 as Checkbox, Index$8 as CountUp, Index$1 as DatePicker, index as IconFont, Index as Input, WInputNumber as InputNumber, Modal, ModalForm$1 as ModalForm, Modal$1 as ModalTips, Index$7 as Number, NumericInput, Index$2 as Radio, Select, Index$a as Swiper, WSwitch as Switch, index$2 as TabelCard, Table, Index$6 as TreeSelect, index$4 as Video, index$3 as VideoPlayer, Index$5 as WDatePicker, WForm$1 as WForm, WebsocketHeart };
11656
+ /*
11657
+ * @Author: lijin
11658
+ * @Date: 2021-08-04 13:22:21
11659
+ * @LastEditTime: 2021-08-04 13:25:19
11660
+ * @LastEditors: lijin
11661
+ * @Description:
11662
+ * @FilePath: \big-screen\src\components\ReactECharts\theme.ts
11663
+ * 可以输入预定的版权声明、个性签名、空行等
11664
+ */
11665
+ var contrastColor = '#9EA1A7';
11666
+ var backgroundColor = 'transparent';
11667
+
11668
+ var axisCommon = function axisCommon() {
11669
+ return {
11670
+ axisLine: {
11671
+ lineStyle: {
11672
+ color: contrastColor
11673
+ }
11674
+ },
11675
+ splitLine: {
11676
+ lineStyle: {
11677
+ color: '#2c3641'
11678
+ }
11679
+ },
11680
+ splitArea: {
11681
+ areaStyle: {
11682
+ color: ['rgba(255,255,255,0.02)', 'rgba(255,255,255,0.05)']
11683
+ }
11684
+ },
11685
+ minorSplitLine: {
11686
+ lineStyle: {
11687
+ color: '#20203B'
11688
+ }
11689
+ }
11690
+ };
11691
+ };
11692
+
11693
+ var colorPalette = ['#4992ff', '#7cffb2', '#fddd60', '#ff6e76', '#58d9f9', '#05c091', '#ff8a45', '#8d48e3', '#dd79ff'];
11694
+ var theme = {
11695
+ darkMode: true,
11696
+ color: colorPalette,
11697
+ backgroundColor: backgroundColor,
11698
+ axisPointer: {
11699
+ lineStyle: {
11700
+ color: '#817f91'
11701
+ },
11702
+ crossStyle: {
11703
+ color: '#817f91'
11704
+ },
11705
+ label: {
11706
+ color: contrastColor,
11707
+ backgroundColor: '#104873'
11708
+ }
11709
+ },
11710
+ legend: {
11711
+ textStyle: {
11712
+ color: contrastColor
11713
+ }
11714
+ },
11715
+ textStyle: {
11716
+ color: contrastColor
11717
+ },
11718
+ title: {
11719
+ textStyle: {
11720
+ color: '#EEF1FA'
11721
+ },
11722
+ subtextStyle: {
11723
+ color: '#B9B8CE'
11724
+ }
11725
+ },
11726
+ toolbox: {
11727
+ iconStyle: {
11728
+ borderColor: contrastColor
11729
+ }
11730
+ },
11731
+ dataZoom: {
11732
+ borderColor: '#71708A',
11733
+ textStyle: {
11734
+ color: contrastColor
11735
+ },
11736
+ brushStyle: {
11737
+ color: 'rgba(135,163,206,0.3)'
11738
+ },
11739
+ handleStyle: {
11740
+ color: '#353450',
11741
+ borderColor: '#C5CBE3'
11742
+ },
11743
+ moveHandleStyle: {
11744
+ color: '#B0B6C3',
11745
+ opacity: 0.3
11746
+ },
11747
+ fillerColor: 'rgba(135,163,206,0.2)',
11748
+ emphasis: {
11749
+ handleStyle: {
11750
+ borderColor: '#91B7F2',
11751
+ color: '#4D587D'
11752
+ },
11753
+ moveHandleStyle: {
11754
+ color: '#636D9A',
11755
+ opacity: 0.7
11756
+ }
11757
+ },
11758
+ dataBackground: {
11759
+ lineStyle: {
11760
+ color: '#71708A',
11761
+ width: 1
11762
+ },
11763
+ areaStyle: {
11764
+ color: '#71708A'
11765
+ }
11766
+ },
11767
+ selectedDataBackground: {
11768
+ lineStyle: {
11769
+ color: '#87A3CE'
11770
+ },
11771
+ areaStyle: {
11772
+ color: '#87A3CE'
11773
+ }
11774
+ }
11775
+ },
11776
+ visualMap: {
11777
+ textStyle: {
11778
+ color: contrastColor
11779
+ }
11780
+ },
11781
+ timeline: {
11782
+ lineStyle: {
11783
+ color: contrastColor
11784
+ },
11785
+ label: {
11786
+ color: contrastColor
11787
+ },
11788
+ controlStyle: {
11789
+ color: contrastColor,
11790
+ borderColor: contrastColor
11791
+ }
11792
+ },
11793
+ calendar: {
11794
+ itemStyle: {
11795
+ color: backgroundColor
11796
+ },
11797
+ dayLabel: {
11798
+ color: contrastColor
11799
+ },
11800
+ monthLabel: {
11801
+ color: contrastColor
11802
+ },
11803
+ yearLabel: {
11804
+ color: contrastColor
11805
+ }
11806
+ },
11807
+ timeAxis: axisCommon(),
11808
+ logAxis: axisCommon(),
11809
+ valueAxis: axisCommon(),
11810
+ categoryAxis: axisCommon(),
11811
+ line: {
11812
+ symbol: 'circle'
11813
+ },
11814
+ graph: {
11815
+ color: colorPalette
11816
+ },
11817
+ gauge: {
11818
+ title: {
11819
+ color: contrastColor
11820
+ }
11821
+ },
11822
+ candlestick: {
11823
+ itemStyle: {
11824
+ color: '#FD1050',
11825
+ color0: '#0CF49B',
11826
+ borderColor: '#FD1050',
11827
+ borderColor0: '#0CF49B'
11828
+ }
11829
+ }
11830
+ };
11831
+ theme.categoryAxis.splitLine.show = false;
11832
+
11833
+ var RAF = /*#__PURE__*/function () {
11834
+ function RAF() {
11835
+ _classCallCheck(this, RAF);
11836
+
11837
+ this._timerIdMap = void 0;
11838
+ this._timerIdMap = {
11839
+ timeout: {},
11840
+ interval: {}
11841
+ };
11842
+ }
11843
+
11844
+ _createClass(RAF, [{
11845
+ key: "run",
11846
+ value: function run() {
11847
+ var _this = this;
11848
+
11849
+ var type = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'interval';
11850
+ var cb = arguments.length > 1 ? arguments[1] : undefined;
11851
+ var interval = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 16.7;
11852
+ // 每16.7毫秒刷新一次(一帧)
11853
+ var now = Date.now;
11854
+ var startTime = now();
11855
+ var endTime = startTime;
11856
+ var timerSymbol = Symbol();
11857
+
11858
+ var loop = function loop() {
11859
+ _this.setIdMap(timerSymbol, type, loop);
11860
+
11861
+ endTime = now();
11862
+
11863
+ if (endTime - startTime >= interval) {
11864
+ if (type === 'interval') {
11865
+ startTime = now();
11866
+ endTime = startTime;
11867
+ }
11868
+
11869
+ cb();
11870
+ type === 'timeout' && _this.clearTimeout(timerSymbol);
11871
+ }
11872
+ };
11873
+
11874
+ this.setIdMap(timerSymbol, type, loop);
11875
+ return timerSymbol;
11876
+ }
11877
+ }, {
11878
+ key: "setIdMap",
11879
+ value: function setIdMap(timerSymbol, type, loop) {
11880
+ var id = requestAnimationFrame(loop);
11881
+ this._timerIdMap[type][timerSymbol] = id;
11882
+ }
11883
+ }, {
11884
+ key: "setTimeout",
11885
+ value: function setTimeout(cb, interval) {
11886
+ return this.run('timeout', cb, interval);
11887
+ }
11888
+ }, {
11889
+ key: "clearTimeout",
11890
+ value: function clearTimeout(timer) {
11891
+ cancelAnimationFrame(this._timerIdMap.timeout[timer]);
11892
+ }
11893
+ }, {
11894
+ key: "setInterval",
11895
+ value: function setInterval(cb, interval) {
11896
+ return this.run('interval', cb, interval);
11897
+ }
11898
+ }, {
11899
+ key: "clearInterval",
11900
+ value: function clearInterval(timer) {
11901
+ cancelAnimationFrame(this._timerIdMap.interval[timer]);
11902
+ }
11903
+ }]);
11904
+
11905
+ return RAF;
11906
+ }();
11907
+
11908
+ /*
11909
+ * @Author: lijin
11910
+ * @Date: 2022-06-20 15:27:46
11911
+ * @LastEditTime: 2022-06-30 17:32:49
11912
+ * @LastEditors: caldelle 793238465@qq.com
11913
+ * @Description:
11914
+ * @FilePath: \hefeihz-web-bigscreen\src\hooks\useRAF.ts
11915
+ * 可以输入预定的版权声明、个性签名、空行等
11916
+ */
11917
+ function useRAF() {
11918
+ var raf = useMemo(function () {
11919
+ return new RAF();
11920
+ }, []);
11921
+ return {
11922
+ raf: raf
11923
+ };
11924
+ }
11925
+
11926
+ use([TitleComponent, TooltipComponent, GridComponent, BarChart, CanvasRenderer, LineChart, PieChart, RadarChart, LegendComponent, LegendPlainComponent, MarkLineComponent, PictorialBarChart, CustomChart, LegendScrollComponent, PolarComponent, GraphicComponent, ToolboxComponent]);
11927
+ registerTheme('my_theme', theme); // The usage of ReactEChartsCore are same with above.
11928
+
11929
+ var ReactECharts = /*#__PURE__*/React.memo(function (_ref) {
11930
+ var _option$highlightData, _option$highlightData2, _option$highlightData3;
11931
+
11932
+ var option = _ref.option,
11933
+ _ref$onChartReady = _ref.onChartReady,
11934
+ onChartReady = _ref$onChartReady === void 0 ? function () {} : _ref$onChartReady,
11935
+ _ref$EventsDict = _ref.EventsDict,
11936
+ EventsDict = _ref$EventsDict === void 0 ? {} : _ref$EventsDict,
11937
+ _ref$style = _ref.style,
11938
+ style = _ref$style === void 0 ? {} : _ref$style,
11939
+ ref = _ref.ref,
11940
+ _ref$autoLoop = _ref.autoLoop,
11941
+ autoLoop = _ref$autoLoop === void 0 ? true : _ref$autoLoop,
11942
+ _ref$duration = _ref.duration,
11943
+ duration = _ref$duration === void 0 ? 2000 : _ref$duration,
11944
+ _ref$seriesIndex = _ref.seriesIndex,
11945
+ seriesIndex = _ref$seriesIndex === void 0 ? 0 : _ref$seriesIndex,
11946
+ opts = _ref.opts,
11947
+ otherProps = _ref.otherProps;
11948
+
11949
+ var _useRAF = useRAF(),
11950
+ raf = _useRAF.raf;
11951
+
11952
+ var _useState = useState(-1),
11953
+ _useState2 = _slicedToArray(_useState, 2),
11954
+ currentIndex = _useState2[0],
11955
+ setCurrentIndex = _useState2[1];
11956
+
11957
+ var instance = useRef(null);
11958
+ var timer = useRef(null);
11959
+ var timeoutTimer = useRef(null);
11960
+
11961
+ var _useState3 = useState(false),
11962
+ _useState4 = _slicedToArray(_useState3, 2),
11963
+ Flag = _useState4[0],
11964
+ setFlag = _useState4[1];
11965
+
11966
+ var length = (_option$highlightData = option === null || option === void 0 ? void 0 : (_option$highlightData2 = option.highlightData) === null || _option$highlightData2 === void 0 ? void 0 : _option$highlightData2.length) !== null && _option$highlightData !== void 0 ? _option$highlightData : 0;
11967
+ var current = option === null || option === void 0 ? void 0 : (_option$highlightData3 = option.highlightData) === null || _option$highlightData3 === void 0 ? void 0 : _option$highlightData3[currentIndex];
11968
+ var currentName = typeof current === 'string' ? current : current === null || current === void 0 ? void 0 : current.name;
11969
+ useEffect(function () {
11970
+ if (autoLoop && length > 1) {
11971
+ timer.current = raf.setInterval(function () {
11972
+ setCurrentIndex(function (index) {
11973
+ return index >= length - 1 ? 0 : index + 1;
11974
+ });
11975
+ }, duration);
11976
+ } else {
11977
+ setCurrentIndex(-1);
11978
+ timer.current && raf.clearInterval(timer.current);
11979
+ }
11980
+
11981
+ return function () {
11982
+ timer.current && raf.clearInterval(timer.current);
11983
+ };
11984
+ }, [autoLoop, duration, raf, length]);
11985
+ useEffect(function () {
11986
+ if (!instance.current) {
11987
+ return;
11988
+ }
11989
+
11990
+ instance.current.dispatchAction({
11991
+ type: 'downplay'
11992
+ });
11993
+ instance.current.dispatchAction({
11994
+ type: 'hideTip'
11995
+ });
11996
+
11997
+ if (currentIndex > -1) {
11998
+ instance.current.dispatchAction({
11999
+ type: 'showTip',
12000
+ seriesIndex: seriesIndex,
12001
+ dataIndex: currentIndex
12002
+ });
12003
+ currentName && instance.current.dispatchAction({
12004
+ type: 'highlight',
12005
+ name: currentName
12006
+ });
12007
+ }
12008
+ }, [currentIndex, instance, seriesIndex, currentName]);
12009
+
12010
+ var onChartReadyCallback = function onChartReadyCallback(chart) {
12011
+ instance.current = chart;
12012
+ onChartReady(chart, option);
12013
+ timeoutTimer.current = raf.setTimeout(function () {
12014
+ instance.current.resize();
12015
+ }, 20);
12016
+ };
12017
+
12018
+ useEffect(function () {
12019
+ filter(option);
12020
+ }, [option]);
12021
+
12022
+ var filter = function filter(option) {
12023
+ var _option$series;
12024
+
12025
+ var flag = option === null || option === void 0 ? void 0 : (_option$series = option.series) === null || _option$series === void 0 ? void 0 : _option$series.every(function (item) {
12026
+ return !item.data || item.data.length == 0;
12027
+ });
12028
+ setFlag(flag);
12029
+ return option;
12030
+ };
12031
+
12032
+ useEffect(function () {
12033
+ var resizeHandler = function resizeHandler() {
12034
+ if (instance.current) {
12035
+ instance.current.resize();
12036
+ }
12037
+ };
12038
+
12039
+ window.addEventListener('resize', resizeHandler);
12040
+ return function () {
12041
+ timeoutTimer.current && raf.clearTimeout(timeoutTimer.current);
12042
+ window.removeEventListener('resize', resizeHandler);
12043
+ };
12044
+ }, []);
12045
+ return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ReactEChartsCore, _objectSpread2({
12046
+ ref: ref,
12047
+ echarts: echarts,
12048
+ option: option,
12049
+ notMerge: true,
12050
+ lazyUpdate: true,
12051
+ style: style,
12052
+ theme: 'my_theme',
12053
+ onChartReady: onChartReadyCallback,
12054
+ onEvents: EventsDict,
12055
+ opts: opts || {}
12056
+ }, otherProps)));
12057
+ });
12058
+
12059
+ var lineOption = function lineOption(_ref) {
12060
+ var list = _ref.list,
12061
+ xdata = _ref.xdata;
12062
+ return {
12063
+ grid: {
12064
+ top: '18%',
12065
+ bottom: 1,
12066
+ left: 20,
12067
+ right: 20,
12068
+ containLabel: true
12069
+ },
12070
+ tooltip: {
12071
+ trigger: 'axis',
12072
+ backgroundColor: '#012536',
12073
+ borderColor: 'rgba(81,190,246,1)',
12074
+ textStyle: {
12075
+ color: '#daeef7',
12076
+ fontSize: calcWidth(24)
12077
+ },
12078
+ position: function position(point, params, dom, rect, size) {
12079
+ // 其中point为当前鼠标的位置,size中有两个属性:viewSize和contentSize,分别为外层div和tooltip提示框的大小
12080
+ var x = point[0]; //
12081
+
12082
+ var y = point[1];
12083
+ var viewWidth = size.viewSize[0];
12084
+ var viewHeight = size.viewSize[1];
12085
+ var boxWidth = size.contentSize[0];
12086
+ var boxHeight = size.contentSize[1];
12087
+ var posX = 0; // x坐标位置
12088
+
12089
+ var posY = 0; // y坐标位置
12090
+
12091
+ if (x < boxWidth) {
12092
+ // 左边放不开
12093
+ posX = 5;
12094
+ } else {
12095
+ // 左边放的下
12096
+ posX = x - boxWidth;
12097
+ }
12098
+
12099
+ if (y < boxHeight) {
12100
+ // 上边放不开
12101
+ posY = 5;
12102
+ } else {
12103
+ // 上边放得下
12104
+ posY = y - boxHeight;
12105
+ }
12106
+
12107
+ return [posX, posY];
12108
+ },
12109
+ axisPointer: {
12110
+ lineStyle: {
12111
+ color: {
12112
+ type: 'linear',
12113
+ x: 0,
12114
+ y: 0,
12115
+ x2: 0,
12116
+ y2: 1,
12117
+ colorStops: [{
12118
+ offset: 0,
12119
+ color: 'rgba(255,255,255,0)' // 0% 处的颜色
12120
+
12121
+ }, {
12122
+ offset: 0.5,
12123
+ color: 'rgba(255,255,255,1)' // 100% 处的颜色
12124
+
12125
+ }, {
12126
+ offset: 1,
12127
+ color: 'rgba(255,255,255,0)' // 100% 处的颜色
12128
+
12129
+ }],
12130
+ global: false // 缺省为 false
12131
+
12132
+ }
12133
+ }
12134
+ },
12135
+ formatter: function formatter(params) {
12136
+ if (params.length == 0) {
12137
+ return null;
12138
+ }
12139
+
12140
+ var dom = '';
12141
+ params.map(function (item) {
12142
+ dom = dom + " <div><?xml version=\"1.0\" standalone=\"no\"?><!DOCTYPE svg PUBLIC \"-//W3C//DTD SVG 1.1//EN\" \"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd\">\n <svg t=\"1655805829921\" class=\"icon\" viewBox=\"0 0 1024 1024\" fill=\"".concat(item.color, "\"; version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" p-id=\"5439\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" width=\"").concat(calcWidth(20), "px\" height=\"").concat(calcHeight(20), "px\" style=\"margin-right:").concat(calcWidth(10), "px\">\n <defs><style type=\"text/css\">@font-face { font-family: feedback-iconfont; src: url(\"//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff2?t=1630033759944\") format(\"woff2\"), url(\"//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff?t=1630033759944\") format(\"woff\"), url(\"//at.alicdn.com/t/font_1031158_u69w8yhxdu.ttf?t=1630033759944\") format(\"truetype\"); }\n </style></defs><path d=\"M512 512m-256 0a256 256 0 1 0 512 0 256 256 0 1 0-512 0Z\" p-id=\"5440\"></path><path d=\"M512 20.48C239.616 20.48 20.48 239.616 20.48 512s219.136 491.52 491.52 491.52 491.52-219.136 491.52-491.52S784.384 20.48 512 20.48z m0 899.072C286.72 919.552 104.448 737.28 104.448 512 104.448 286.72 286.72 104.448 512 104.448 737.28 104.448 919.552 286.72 919.552 512c0 225.28-182.272 407.552-407.552 407.552z\" p-id=\"5441\"></path></svg>").concat(item.seriesName, " : ").concat(item.value, "</div>");
12143
+ });
12144
+ return dom;
12145
+ }
12146
+ },
12147
+ legend: {
12148
+ top: 0,
12149
+ itemGap: calcWidth(20),
12150
+ show: true,
12151
+ textStyle: {
12152
+ fontSize: calcWidth(24),
12153
+ color: '#ccf8fb',
12154
+ lineHeight: calcHeight(20)
12155
+ },
12156
+ data: list === null || list === void 0 ? void 0 : list.map(function (item) {
12157
+ return {
12158
+ name: item.name,
12159
+ icon: "path://M512 512m-256 0a256 256 0 1 0 512 0 256 256 0 1 0-512 0Z,M512 20.48C239.616 20.48 20.48 239.616 20.48 512s219.136 491.52 491.52 491.52 491.52-219.136 491.52-491.52S784.384 20.48 512 20.48z m0 899.072C286.72 919.552 104.448 737.28 104.448 512 104.448 286.72 286.72 104.448 512 104.448 737.28 104.448 919.552 286.72 919.552 512c0 225.28-182.272 407.552-407.552 407.552z"
12160
+ };
12161
+ }),
12162
+ itemWidth: calcWidth(20),
12163
+ itemHeight: calcHeight(20)
12164
+ },
12165
+ xAxis: [{
12166
+ type: 'category',
12167
+ axisLabel: {
12168
+ formatter: '{value}',
12169
+ // interval: 0,
12170
+ fontSize: calcWidth(24),
12171
+ color: '#ccf8fb',
12172
+ margin: 20
12173
+ },
12174
+ axisLine: {
12175
+ lineStyle: {
12176
+ color: '#2c3641'
12177
+ }
12178
+ },
12179
+ splitLine: {
12180
+ show: false,
12181
+ lineStyle: {
12182
+ color: '#2c3641'
12183
+ }
12184
+ },
12185
+ axisTick: {
12186
+ show: false
12187
+ },
12188
+ data: xdata
12189
+ }],
12190
+ yAxis: [{
12191
+ type: 'value',
12192
+ splitLine: {
12193
+ lineStyle: {
12194
+ color: '#2c3641'
12195
+ }
12196
+ },
12197
+ axisLabel: {
12198
+ fontSize: calcWidth(24),
12199
+ color: '#ccf8fb',
12200
+ margin: 20
12201
+ },
12202
+ axisLine: {
12203
+ show: true,
12204
+ lineStyle: {
12205
+ color: '#2c3641'
12206
+ }
12207
+ },
12208
+ axisTick: {
12209
+ show: false
12210
+ }
12211
+ }],
12212
+ series: list === null || list === void 0 ? void 0 : list.map(function (item) {
12213
+ return {
12214
+ name: item.name,
12215
+ type: 'line',
12216
+ sampling: 'lttb',
12217
+ symbolSize: 8,
12218
+ itemStyle: {
12219
+ color: item.color
12220
+ },
12221
+ zlevel: 3,
12222
+ lineStyle: {
12223
+ normal: {
12224
+ width: calcWidth(2),
12225
+ color: item.color
12226
+ }
12227
+ },
12228
+ data: item.data
12229
+ };
12230
+ })
12231
+ };
12232
+ };
12233
+
12234
+ function LineEcharts(_ref2) {
12235
+ var config = _ref2.config;
12236
+ console.log(config);
12237
+ return /*#__PURE__*/React.createElement(ReactECharts, {
12238
+ option: lineOption(config),
12239
+ style: {
12240
+ height: '100%'
12241
+ }
12242
+ });
12243
+ }
12244
+
12245
+ export { Index$9 as AutoScroll, Index$b as Breadcrumb, WButton as Button, index$1 as Card, WCascader as Cascader, Index$3 as Checkbox, Index$8 as CountUp, Index$1 as DatePicker, index as IconFont, Index as Input, WInputNumber as InputNumber, LineEcharts, Modal, ModalForm$1 as ModalForm, Modal$1 as ModalTips, Index$7 as Number, NumericInput, Index$2 as Radio, Select, Index$a as Swiper, WSwitch as Switch, index$2 as TabelCard, Table, Index$6 as TreeSelect, index$4 as Video, index$3 as VideoPlayer, Index$5 as WDatePicker, WForm$1 as WForm, WebsocketHeart };