@vtx/modals2 2.15.10 → 2.15.14

package/lib/vtx-device-modal/components/DataAnalysis/Chart.js

@@ -1,6 +1,6 @@
 "use strict";
 
-function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+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); }
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -17,19 +17,19 @@ var _echartsForReact = _interopRequireDefault(require("echarts-for-react"));
 var _vmNodata = _interopRequireDefault(require("../../../vm-nodata"));
 var echarts = _interopRequireWildcard(require("echarts"));
 var _config = require("../../config");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+function _toConsumableArray(r) { return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread(); }
 function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
-function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _iterableToArray(r) { if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r); }
+function _arrayWithoutHoles(r) { if (Array.isArray(r)) return _arrayLikeToArray(r); }
+function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
 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."); }
-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); }
-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; }
-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; } }
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+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; } }
+function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
 var VtxRangePicker = _components.VtxDatePicker.VtxRangePicker,
   VtxMonthPicker = _components.VtxDatePicker.VtxMonthPicker,
   VtxYearPicker = _components.VtxDatePicker.VtxYearPicker;
@@ -179,6 +179,32 @@ var Chart = function Chart(_ref) {
       });
       offsetList.push(_lodash["default"].last(offsetList) || 0 + (maxLength * 10 + 20));
     });
+    var legendData = [];
+    list.forEach(function (item, index) {
+      if (item.showMode === 'stack') {
+        var _state = _lodash["default"].map(_lodash["default"].uniqBy(item.dataList, 'value'));
+        var _colors = ['#73a0fa', '#73deb3'];
+        var stateColor = {};
+        _state.forEach(function (v, index) {
+          stateColor[v.value] = _colors[index % 2];
+        });
+        legendData.push.apply(legendData, _toConsumableArray((_state || []).map(function (item) {
+          return {
+            name: item.value,
+            itemStyle: {
+              color: stateColor[item.value]
+            }
+          };
+        })));
+      } else {
+        legendData.push({
+          name: item.newName || item.name || '',
+          itemStyle: {
+            color: _config.colors[index % 5].lineColor
+          }
+        });
+      }
+    });
     return {
       color: _config.colors.map(function (color) {
         return color.lineColor;
@@ -212,12 +238,16 @@ var Chart = function Chart(_ref) {
         trigger: 'axis',
         formatter: function formatter(data) {
           var circle = "<span style=\"display:inline-block;margin-right:5px;border-radius:50%;width:10px;height:10px;left:5px;background-color:";
-          var result = "".concat(data[0].name, "<br/>");
+          var result = "";
           data.map(function (v) {
             var info = list.find(function (item) {
               return item.name === v.seriesName;
             }) || {};
-            result += "".concat(circle + _config.colors[v.seriesIndex % 5].lineColor, "\"></span>").concat(v.seriesName, "\uFF1A").concat(v.value).concat(info.unit || '', "<br/>");
+            if (v.componentSubType === 'custom') {
+              result += "".concat(circle + v.color, "\"></span>").concat(v.name, "\uFF1A").concat(v.value.slice(1).join('~')).concat(info.unit || '', "<br/>");
+            } else {
+              result += "".concat(circle + _config.colors[v.seriesIndex % 5].lineColor, "\"></span>").concat(v.seriesName, "\uFF1A").concat(v.value).concat(info.unit || '', "<br/>");
+            }
           });
           return result;
         }
@@ -275,8 +305,13 @@ var Chart = function Chart(_ref) {
       }),
       series: list.flatMap(function (item, index) {
         if (item.showMode === 'stack') {
-          var _state = _lodash["default"].map(_lodash["default"].uniqBy(item.dataList, 'value'));
-          return [].concat(_toConsumableArray((_state || []).map(function (v) {
+          var _state2 = _lodash["default"].map(_lodash["default"].uniqBy(item.dataList, 'value'));
+          var _colors2 = ['#73a0fa', '#73deb3'];
+          var stateColor = {};
+          _state2.forEach(function (v, index) {
+            stateColor[v.value] = _colors2[index % 2];
+          });
+          return [].concat(_toConsumableArray((_state2 || []).map(function (v) {
             return {
               name: v.value,
               type: 'bar',
@@ -334,10 +369,10 @@ var Chart = function Chart(_ref) {
               return {
                 itemStyle: {
                   normal: {
-                    color: _config.colors[item.originValue]
+                    color: stateColor[item.originValue]
                   }
                 },
-                color: _config.colors[item.originValue],
+                color: stateColor[item.originValue],
                 name: item.value,
                 label: item.value,
                 value: [0, item.date, (_a = arr[index + 1]) === null || _a === void 0 ? void 0 : _a.date]
@@ -510,8 +545,8 @@ var Chart = function Chart(_ref) {
       }),
       series: newList.flatMap(function (item, index) {
         if (item.showMode === 'stack') {
-          var _state2 = _lodash["default"].map(_lodash["default"].uniqBy(item.dataList, 'value'));
-          return [].concat(_toConsumableArray((_state2 || []).map(function (v) {
+          var _state3 = _lodash["default"].map(_lodash["default"].uniqBy(item.dataList, 'value'));
+          return [].concat(_toConsumableArray((_state3 || []).map(function (v) {
             return {
               name: v.value,
               type: 'bar',
@@ -632,7 +667,7 @@ var Chart = function Chart(_ref) {
     value: 'danTime'
   }, "\u5355\u65F6\u6BB5"), /*#__PURE__*/_react["default"].createElement(Option, {
     value: 'duoTime'
-  }, "\u591A\u65F6\u6BB5")), timeType === 'danTime' ? /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_antd.Radio.Group, {
+  }, "\u591A\u65F6\u6BB5")), timeType === 'danTime' ? (/*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_antd.Radio.Group, {
     optionType: "button",
     value: danTimeType,
     onChange: function onChange(_ref2) {
@@ -662,7 +697,7 @@ var Chart = function Chart(_ref) {
     label: '自定义',
     value: 'self'
   }]).map(function (item) {
-    return item.value === 'self' ? /*#__PURE__*/_react["default"].createElement(_antd.Popover, {
+    return item.value === 'self' ? (/*#__PURE__*/_react["default"].createElement(_antd.Popover, {
       content: /*#__PURE__*/_react["default"].createElement(VtxRangePicker, {
         allowClear: false,
         style: {
@@ -698,7 +733,7 @@ var Chart = function Chart(_ref) {
       trigger: "click"
     }, /*#__PURE__*/_react["default"].createElement(_antd.Radio.Button, {
       value: item.value
-    }, item.label)) : item.value === 'month' ? /*#__PURE__*/_react["default"].createElement(_antd.Popover, {
+    }, item.label))) : item.value === 'month' ? (/*#__PURE__*/_react["default"].createElement(_antd.Popover, {
       content: /*#__PURE__*/_react["default"].createElement(VtxMonthPicker, {
         allowClear: false,
         style: {
@@ -714,7 +749,7 @@ var Chart = function Chart(_ref) {
       trigger: "click"
     }, /*#__PURE__*/_react["default"].createElement(_antd.Radio.Button, {
       value: item.value
-    }, item.label)) : item.value === 'year' ? /*#__PURE__*/_react["default"].createElement(_antd.Popover, {
+    }, item.label))) : item.value === 'year' ? (/*#__PURE__*/_react["default"].createElement(_antd.Popover, {
       content: /*#__PURE__*/_react["default"].createElement(VtxYearPicker, {
         allowClear: false,
         style: {
@@ -733,9 +768,9 @@ var Chart = function Chart(_ref) {
       trigger: "click"
     }, /*#__PURE__*/_react["default"].createElement(_antd.Radio.Button, {
       value: item.value
-    }, item.label)) : /*#__PURE__*/_react["default"].createElement(_antd.Radio.Button, {
+    }, item.label))) : (/*#__PURE__*/_react["default"].createElement(_antd.Radio.Button, {
       value: item.value
-    }, item.label);
+    }, item.label));
   })), /*#__PURE__*/_react["default"].createElement(_antd.Tooltip, {
     title: collectFrequency === 'day' ? '自定义时间仅支持查30天' : '自定义时间仅支持查七天'
   }, /*#__PURE__*/_react["default"].createElement(_icons.QuestionCircleOutlined, {
@@ -743,7 +778,7 @@ var Chart = function Chart(_ref) {
       marginLeft: 8,
       fontSize: 16
     }
-  }))) : /*#__PURE__*/_react["default"].createElement("div", {
+  })))) : (/*#__PURE__*/_react["default"].createElement("div", {
     style: {
       marginLeft: 10
     }
@@ -766,7 +801,7 @@ var Chart = function Chart(_ref) {
         duoTimeType: value
       });
     }
-  }), duoTimeList.length === 5 ? null : /*#__PURE__*/_react["default"].createElement(_antd.Button, {
+  }), duoTimeList.length === 5 ? null : (/*#__PURE__*/_react["default"].createElement(_antd.Button, {
     type: "primary",
     icon: /*#__PURE__*/_react["default"].createElement(_icons.PlusOutlined, null),
     style: {
@@ -782,26 +817,45 @@ var Chart = function Chart(_ref) {
         }])
       });
     }
-  }, "\u65B0\u589E")), /*#__PURE__*/_react["default"].createElement("div", null, timeType === 'duoTime' && duoTimeList.map(function (item, index) {
+  }, "\u65B0\u589E")))), /*#__PURE__*/_react["default"].createElement("span", null, "\u91C7\u96C6\u5468\u671F\uFF1A"), /*#__PURE__*/_react["default"].createElement(_components.VtxSelect, {
+    allowClear: false,
+    style: {
+      width: 200
+    },
+    onChange: function onChange(e) {
+      return setState({
+        collectFrequency: e
+      });
+    },
+    value: collectFrequency
+  }, collectList.map(function (item) {
+    return /*#__PURE__*/_react["default"].createElement(Option, {
+      key: item.id
+    }, item.name);
+  }))), /*#__PURE__*/_react["default"].createElement("div", {
+    style: {
+      marginTop: 8
+    }
+  }, timeType === 'duoTime' && duoTimeList.map(function (item, index) {
     return /*#__PURE__*/_react["default"].createElement("span", {
       style: {
         marginLeft: 20,
         position: 'relative'
       },
       key: index
-    }, duoTimeType === 'day' ? /*#__PURE__*/_react["default"].createElement(_components.VtxDatePicker, {
+    }, duoTimeType === 'day' ? (/*#__PURE__*/_react["default"].createElement(_components.VtxDatePicker, {
       allowClear: false,
       value: item.time,
       onChange: function onChange(_unused, dateStr) {
         handleDuoTimeList(index, dateStr);
       }
-    }) : /*#__PURE__*/_react["default"].createElement(VtxMonthPicker, {
+    })) : (/*#__PURE__*/_react["default"].createElement(VtxMonthPicker, {
       allowClear: false,
       value: item.time,
       onChange: function onChange(_, dateStr) {
         handleDuoTimeList(index, dateStr);
       }
-    }), index === 0 ? null : /*#__PURE__*/_react["default"].createElement(_icons.CloseCircleOutlined, {
+    })), index === 0 ? null : (/*#__PURE__*/_react["default"].createElement(_icons.CloseCircleOutlined, {
       style: {
         color: '#bbb8b8',
         position: 'absolute',
@@ -816,31 +870,16 @@ var Chart = function Chart(_ref) {
           })
         });
       }
-    }));
-  })), /*#__PURE__*/_react["default"].createElement("span", null, "\u91C7\u96C6\u5468\u671F\uFF1A"), /*#__PURE__*/_react["default"].createElement(_components.VtxSelect, {
-    allowClear: false,
-    style: {
-      width: 200
-    },
-    onChange: function onChange(e) {
-      return setState({
-        collectFrequency: e
-      });
-    },
-    value: collectFrequency
-  }, collectList.map(function (item) {
-    return /*#__PURE__*/_react["default"].createElement(Option, {
-      key: item.id
-    }, item.name);
-  }))), /*#__PURE__*/_react["default"].createElement("div", {
+    })));
+  })), /*#__PURE__*/_react["default"].createElement("div", {
     className: "vtx-device-modal-analysis-content--chart"
-  }, loading ? /*#__PURE__*/_react["default"].createElement(_antd.Spin, {
+  }, loading ? (/*#__PURE__*/_react["default"].createElement(_antd.Spin, {
     spinning: true
-  }) : (0, _lodash.isEmpty)(newList) ? /*#__PURE__*/_react["default"].createElement(_vmNodata["default"], {
+  })) : (0, _lodash.isEmpty)(newList) ? (/*#__PURE__*/_react["default"].createElement(_vmNodata["default"], {
     style: {
       height: 300
     }
-  }) : /*#__PURE__*/_react["default"].createElement(_echartsForReact["default"], {
+  })) : (/*#__PURE__*/_react["default"].createElement(_echartsForReact["default"], {
     option: timeType === 'danTime' ? getGroupDanOption(newList) : getGroupDuoOption(newList),
     notMerge: true,
     lazyUpdate: true,
@@ -848,8 +887,7 @@ var Chart = function Chart(_ref) {
       height: '100%',
       width: '100%'
     }
-  })));
+  }))));
 };
-var _default = Chart;
-exports["default"] = _default;
+var _default = exports["default"] = Chart;
 //# sourceMappingURL=Chart.js.map