@riil-frontend/component-topology 6.0.0-alpha.62 → 6.0.0-alpha.63

package/es/core/editor/components/Toolbar/widgets/FontFamilyWidget.js

@@ -16,7 +16,7 @@ function FontFamilySelect(props) {
         }
       }, val || '微软雅黑');
     },
-    onChange: onChange
+    onSelect: onChange
   }, items.map(function (item) {
     return /*#__PURE__*/React.createElement(DropdownMenu.Item, {
       key: item

package/es/core/editor/components/Toolbar/widgets/FontSizeWidget.js

@@ -6,7 +6,7 @@ import WidgetBox from "./WidgetBox";
 function FontSizeSelect(props) {
   var value = props.value,
       disabled = props.disabled,
-      _onChange = props.onChange;
+      onChange = props.onChange;
   var items = [9, 10, 11, 12, 14, 16, 18, 20, 24, 30, 36];
   return /*#__PURE__*/React.createElement(DropdownMenu, {
     value: "" + (value || ''),
@@ -18,8 +18,8 @@ function FontSizeSelect(props) {
       }, val || 12);
     },
     disabled: disabled,
-    onChange: function onChange(val) {
-      return _onChange(parseInt(val, 10));
+    onSelect: function onSelect(val) {
+      return onChange(parseInt(val, 10));
     }
   }, items.map(function (item) {
     return /*#__PURE__*/React.createElement(DropdownMenu.Item, {

package/es/core/editor/components/Toolbar/widgets/FontStyleButton.js

@@ -1,4 +1,3 @@
-import _extends from "@babel/runtime/helpers/extends";
 import React, { useState, useEffect } from 'react';
 import { isText } from "../../../../../utils/htElementUtils";
 import DropdownMenu from "./components/DropdownMenu";
@@ -24,16 +23,6 @@ function buildValue(obj) {
   });
 }
 
-function formatStyle(arr) {
-  return items.map(function (item) {
-    return item.key;
-  }).reduce(function (map, name) {
-    var _extends2;
-
-    return _extends({}, map, (_extends2 = {}, _extends2[name] = arr.includes(name), _extends2));
-  }, {});
-}
-
 function FontStyleButton(props) {
   var topo = props.topo,
       showLabel = props.showLabel,
@@ -76,9 +65,13 @@ function FontStyleButton(props) {
    * @param {Array} selectedKeys 
    */
 
-  var handleChange = function handleChange(selectedKeys) {
+  var handleSelect = function handleSelect(selectedKeys, item, extra) {
+    var _setStyle;
+
+    var key = extra.key,
+        select = extra.select;
     topo.historyManager.beginTransaction();
-    setStyle(formatStyle(selectedKeys));
+    setStyle((_setStyle = {}, _setStyle[key] = select, _setStyle));
     topo.historyManager.endTransaction();
   };
 
@@ -97,7 +90,7 @@ function FontStyleButton(props) {
     },
     multiple: true,
     disabled: disabled,
-    onChange: handleChange
+    onSelect: handleSelect
   }, items.map(function (item) {
     return /*#__PURE__*/React.createElement(DropdownMenu.Item, {
       key: item.key

package/es/core/editor/components/Toolbar/widgets/components/DropdownMenu.js

@@ -7,15 +7,19 @@ function DropdownMenu(props) {
   var value = props.value,
       children = props.children,
       multiple = props.multiple,
-      onChange = props.onChange,
+      onSelect = props.onSelect,
       valueRender = props.valueRender,
       disabled = props.disabled;
   var selectedKeys = Array.isArray(value) ? value : [value];
   var valueDisplay = valueRender ? valueRender(value) : value;
   var selectMode = multiple ? 'multiple' : 'single';
 
-  var handleChange = function handleChange(keys) {
-    onChange(multiple ? keys : keys[0]);
+  var handleChange = function handleChange(keys, item, extra) {
+    var selected = multiple ? keys : keys[0];
+
+    if (onSelect) {
+      onSelect(selected, item, extra);
+    }
   };
 
   var menu = /*#__PURE__*/React.createElement(_Menu, {

package/es/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/ElementTextStyleSetting.js

@@ -42,7 +42,7 @@ function ElementTextStyleSetting(props) {
     };
   }, [htSelection]);
   return /*#__PURE__*/React.createElement(Component, _extends({
-    disabled: false,
+    disabled: true,
     htSelection: htSelection
   }, fieldProps, {
     setStyle: setStyle

package/es/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/elements/box.js

@@ -25,7 +25,17 @@ export function setTextStyle(element, style, topo) {
   element.a('rectFont', fontStr);
   topo.getHtTopo().setRectangleText(element);
 }
+/**
+ * 
+ * @param {*} element 
+ * @returns {Array}
+ */
+
+export function getEnabledFields(element) {
+  return ['fontFamily', 'fontSize', 'bold', 'italic', 'color', 'background', 'opacity'];
+}
 export default {
   getTextStyle: getTextStyle,
-  setTextStyle: setTextStyle
+  setTextStyle: setTextStyle,
+  getEnabledFields: getEnabledFields
 };

package/es/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/elements/edgeTag.js

@@ -43,6 +43,15 @@ export function setTextStyle(element, style, topo) {
     topo.getHtTopo().setEdgeLabelStyle(element, tagStyle);
   }
 }
+/**
+ * 
+ * @param {*} element 
+ * @returns {Array}
+ */
+
+export function getEnabledFields(element) {
+  return ['fontFamily', 'color', 'background', 'opacity'];
+}
 export function getFieldDisabled(element) {
   return {
     fontSize: true
@@ -51,5 +60,6 @@ export function getFieldDisabled(element) {
 export default {
   getTextStyle: getTextStyle,
   setTextStyle: setTextStyle,
+  getEnabledFields: getEnabledFields,
   getFieldDisabled: getFieldDisabled
 };

package/es/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/elements/groupTitle.js

@@ -28,17 +28,26 @@ export function setTextStyle(element, style, topo) {
 
   if ('color' in style) {
     element.s('group.title.color', style.color.hex);
-  } // 背景颜色
-
+  }
 
-  var prevStyle = getTextStyle(element);
-  element.s('group.title.background', formatBackgroundRgbaColor(prevStyle, style));
+  if ('background' in style || 'opacity' in style) {
+    // 背景颜色
+    var prevStyle = getTextStyle(element);
+    element.s('group.title.background', formatBackgroundRgbaColor(prevStyle, style));
+  }
 
   var fontStyle = _extends({}, getTextStyle(element), style);
 
-  var fontStr = fontStyleUtil.build(fontStyleUtil.removeBoldItalic(fontStyle));
+  var fontStr = fontStyleUtil.build(fontStyle);
   element.s('group.title.font', fontStr);
 }
+export function getEnabledFields(element) {
+  if (!element.isExpanded()) {
+    return ['fontFamily', 'fontSize', 'color', 'background', 'opacity'];
+  }
+
+  return ['fontFamily', 'fontSize', 'bold', 'italic', 'color', 'background', 'opacity'];
+}
 export function getFieldDisabled(element) {
   if (!element.isExpanded()) {
     return {
@@ -51,5 +60,6 @@ export function getFieldDisabled(element) {
 export default {
   getTextStyle: getTextStyle,
   setTextStyle: setTextStyle,
+  getEnabledFields: getEnabledFields,
   getFieldDisabled: getFieldDisabled
 };

package/es/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/elements/layerTitle.js

@@ -57,7 +57,17 @@ export function setTextStyle(element, style) {
   labelStyle.font = fontStr;
   setLabelStyle(element, labelStyle);
 }
+/**
+ * 
+ * @param {*} element 
+ * @returns {Array}
+ */
+
+export function getEnabledFields(element) {
+  return ['fontFamily', 'fontSize', 'bold', 'italic', 'color', 'background', 'opacity'];
+}
 export default {
   getTextStyle: getTextStyle,
-  setTextStyle: setTextStyle
+  setTextStyle: setTextStyle,
+  getEnabledFields: getEnabledFields
 };

package/es/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/elements/nodeTag.js

@@ -43,13 +43,27 @@ export function setTextStyle(element, style, topo) {
     topo.getHtTopo().setNodeLabelStyle(element, tagStyle);
   }
 }
+export function getEnabledFields(element) {
+  return ['fontFamily', 'color', 'background', 'opacity'];
+}
+/**
+ * 获得字段是否禁用
+ * 
+ * @param {*} element 
+ * @returns 
+ */
+
 export function getFieldDisabled(element) {
   return {
-    fontSize: true
+    fontSize: true,
+    bold: true,
+    italic: true,
+    underline: true
   };
 }
 export default {
   getTextStyle: getTextStyle,
   setTextStyle: setTextStyle,
+  getEnabledFields: getEnabledFields,
   getFieldDisabled: getFieldDisabled
 };

package/es/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/elements/text.js

@@ -27,7 +27,11 @@ export function setTextStyle(element, style) {
   var fontStr = fontStyleUtil.build(fontStyle);
   element.s('text.font', fontStr);
 }
+export function getEnabledFields(element) {
+  return ['fontFamily', 'fontSize', 'bold', 'italic', 'underline', 'color', 'background', 'opacity'];
+}
 export default {
   getTextStyle: getTextStyle,
-  setTextStyle: setTextStyle
+  setTextStyle: setTextStyle,
+  getEnabledFields: getEnabledFields
 };

package/es/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/textStyleUtil.js

@@ -44,48 +44,73 @@ export function getElementTextStyleFieldDisabled(element) {
 
   return null;
 }
+export function getElementTextStyleEnabledFields(element) {
+  var type = getElementType(element);
+  var handler = typeMap[type];
+
+  if (handler && handler.getEnabledFields) {
+    return handler.getEnabledFields(element);
+  }
+
+  return null;
+}
 export function getTextStyle(htSelection, styleNames) {
-  // 多选时值相同返回？
-  var values = htSelection.map(function (element) {
-    return getElementTextStyle(element);
-  }).filter(function (item) {
-    return !!item;
-  });
-  var value = {};
+  var elementValues = [];
+  var elementEnabledFieldsMap = {};
+  var enabledFields = [];
+  htSelection.forEach(function (element) {
+    var id = element.getId();
+    var elementTextStyle = getElementTextStyle(element);
+    elementValues.push({
+      id: id,
+      values: elementTextStyle
+    });
+    var elementEnabledFields = getElementTextStyleEnabledFields(element) || [];
+    elementEnabledFieldsMap[id] = elementEnabledFields;
+    enabledFields.push.apply(enabledFields, elementEnabledFields);
+  }); // 多选时值相同返回，排除元素禁用的字段值
 
-  if (values.length) {
-    styleNames.forEach(function (styleName) {
-      var val = values[0][styleName];
-      var different = values.filter(function (obj) {
-        return obj[styleName] !== val;
-      });
+  var value = {};
+  styleNames.forEach(function (styleName) {
+    // 查询该字段多元素的值列表，排除元素禁用的字段值
+    var fieldValueList = elementValues.reduce(function (result, item) {
+      // 元素字段是否禁用
+      var disabled = !elementEnabledFieldsMap[item.id].includes(styleName);
 
-      if (!different.length) {
-        value[styleName] = val;
+      if (!item.values || disabled) {
+        return result;
       }
-    });
-  } // 多选时元素都不支持字段时禁用
 
+      return [].concat(result, [item.values[styleName]]);
+    }, []); // 对比是否一样，如果一样则使用
+
+    var val = fieldValueList[0];
+    var different = fieldValueList.filter(function (item) {
+      return item !== val;
+    });
 
-  var fieldDisableds = htSelection.map(function (element) {
-    return getElementTextStyleFieldDisabled(element);
-  }).filter(function (item) {
-    return !!item;
+    if (!different.length) {
+      value[styleName] = val;
+    }
   });
+  var disabled = true; // 字段如果没有元素启用则禁用
+
   var fieldDisabled = styleNames.reduce(function (result, fieldName) {
     var _extends2;
 
-    var disabled = fieldDisableds.length && fieldDisableds.filter(function (item) {
-      return !!item[fieldName];
-    }).length === fieldDisableds.length;
-    return _extends({}, result, (_extends2 = {}, _extends2[fieldName] = disabled, _extends2));
+    if (enabledFields.includes(fieldName)) {
+      disabled = false;
+    }
+
+    return _extends({}, result, (_extends2 = {}, _extends2[fieldName] = !enabledFields.includes(fieldName), _extends2));
   }, {});
   return {
+    disabled: disabled,
     style: value,
     fieldDisabled: fieldDisabled,
     debugData: {
-      values: values,
-      fieldDisableds: fieldDisableds
+      elementValues: elementValues,
+      elementEnabledFieldsMap: elementEnabledFieldsMap
     }
   };
 }

package/es/core/editor/components/Toolbar/widgets/components/textStyleSetting/GlobalTagStyleSetting/GlobalTagStyleSetting.js

@@ -23,6 +23,7 @@ function GlobalTagStyleSetting(props) {
     };
   }, []);
   return /*#__PURE__*/React.createElement(Component, _extends({
+    disabled: true,
     style: values,
     setStyle: setStyle,
     fieldDisabled: fieldDisabled

package/es/core/models/TopoApp.js

@@ -23,7 +23,7 @@ import topoFactory from "./topoFactory";
 import ElementTagTipConfig from "./tagstips/ElementTagTipConfig";
 import SelectionModel from "./SelectionModel"; // eslint-disable-next-line no-undef
 
-var version = typeof "6.0.0-alpha.62" === 'string' ? "6.0.0-alpha.62" : null;
+var version = typeof "6.0.0-alpha.63" === 'string' ? "6.0.0-alpha.63" : null;
 console.info("\u62D3\u6251\u7248\u672C: " + version);
 /**
  * 拓扑显示和编辑

package/es/core/viewer/components/plugins/ResourceDetail/components/ResourceOverview/components/LinkTopo/hooks/useMetricPolling.js

@@ -44,18 +44,24 @@ export default function useMetricPolling(_ref) {
     return item;
   }).sort().join(',');
   useEffect(function () {
-    rlog.info('链路拓扑指标轮询 切换', {
-      linkCi: linkCi,
-      linkMetricCodes: linkMetricCodes
-    });
-    queryLinkMetricsRequest.run(linkCi, linkMetricCodes);
+    if (linkId) {
+      rlog.info('链路拓扑指标轮询 切换', {
+        linkCi: linkCi,
+        linkMetricCodes: linkMetricCodes
+      });
+      queryLinkMetricsRequest.run(linkCi, linkMetricCodes);
+    }
+
     return function () {};
   }, [linkId, linkMetricCodesStr]);
   useEffect(function () {
-    rlog.info('链路拓扑指标轮询 queryInterfaceMetricsRequest 开始', {
-      linkCi: linkCi
-    });
-    queryInterfaceMetricsRequest.run(linkCi);
+    if (linkId) {
+      rlog.info('链路拓扑指标轮询 queryInterfaceMetricsRequest 开始', {
+        linkCi: linkCi
+      });
+      queryInterfaceMetricsRequest.run(linkCi);
+    }
+
     return function () {};
   }, [linkId]);
   return data;

package/lib/core/editor/components/Toolbar/widgets/FontFamilyWidget.js

@@ -30,7 +30,7 @@ function FontFamilySelect(props) {
         }
       }, val || '微软雅黑');
     },
-    onChange: onChange
+    onSelect: onChange
   }, items.map(function (item) {
     return /*#__PURE__*/_react["default"].createElement(_DropdownMenu["default"].Item, {
       key: item

package/lib/core/editor/components/Toolbar/widgets/FontSizeWidget.js

@@ -20,7 +20,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 function FontSizeSelect(props) {
   var value = props.value,
       disabled = props.disabled,
-      _onChange = props.onChange;
+      onChange = props.onChange;
   var items = [9, 10, 11, 12, 14, 16, 18, 20, 24, 30, 36];
   return /*#__PURE__*/_react["default"].createElement(_DropdownMenu["default"], {
     value: "" + (value || ''),
@@ -32,8 +32,8 @@ function FontSizeSelect(props) {
       }, val || 12);
     },
     disabled: disabled,
-    onChange: function onChange(val) {
-      return _onChange(parseInt(val, 10));
+    onSelect: function onSelect(val) {
+      return onChange(parseInt(val, 10));
     }
   }, items.map(function (item) {
     return /*#__PURE__*/_react["default"].createElement(_DropdownMenu["default"].Item, {

package/lib/core/editor/components/Toolbar/widgets/FontStyleButton.js

@@ -5,8 +5,6 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 exports.__esModule = true;
 exports["default"] = void 0;
 
-var _extends3 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var _react = _interopRequireWildcard(require("react"));
 
 var _htElementUtils = require("../../../../../utils/htElementUtils");
@@ -41,16 +39,6 @@ function buildValue(obj) {
   });
 }
 
-function formatStyle(arr) {
-  return items.map(function (item) {
-    return item.key;
-  }).reduce(function (map, name) {
-    var _extends2;
-
-    return (0, _extends3["default"])({}, map, (_extends2 = {}, _extends2[name] = arr.includes(name), _extends2));
-  }, {});
-}
-
 function FontStyleButton(props) {
   var topo = props.topo,
       showLabel = props.showLabel,
@@ -93,9 +81,13 @@ function FontStyleButton(props) {
    * @param {Array} selectedKeys 
    */
 
-  var handleChange = function handleChange(selectedKeys) {
+  var handleSelect = function handleSelect(selectedKeys, item, extra) {
+    var _setStyle;
+
+    var key = extra.key,
+        select = extra.select;
     topo.historyManager.beginTransaction();
-    setStyle(formatStyle(selectedKeys));
+    setStyle((_setStyle = {}, _setStyle[key] = select, _setStyle));
     topo.historyManager.endTransaction();
   };
 
@@ -114,7 +106,7 @@ function FontStyleButton(props) {
     },
     multiple: true,
     disabled: disabled,
-    onChange: handleChange
+    onSelect: handleSelect
   }, items.map(function (item) {
     return /*#__PURE__*/_react["default"].createElement(_DropdownMenu["default"].Item, {
       key: item.key

package/lib/core/editor/components/Toolbar/widgets/components/DropdownMenu.js

@@ -17,15 +17,19 @@ function DropdownMenu(props) {
   var value = props.value,
       children = props.children,
       multiple = props.multiple,
-      onChange = props.onChange,
+      onSelect = props.onSelect,
       valueRender = props.valueRender,
       disabled = props.disabled;
   var selectedKeys = Array.isArray(value) ? value : [value];
   var valueDisplay = valueRender ? valueRender(value) : value;
   var selectMode = multiple ? 'multiple' : 'single';
 
-  var handleChange = function handleChange(keys) {
-    onChange(multiple ? keys : keys[0]);
+  var handleChange = function handleChange(keys, item, extra) {
+    var selected = multiple ? keys : keys[0];
+
+    if (onSelect) {
+      onSelect(selected, item, extra);
+    }
   };
 
   var menu = /*#__PURE__*/_react["default"].createElement(_menu["default"], {

package/lib/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/ElementTextStyleSetting.js

@@ -55,7 +55,7 @@ function ElementTextStyleSetting(props) {
     };
   }, [htSelection]);
   return /*#__PURE__*/_react["default"].createElement(Component, (0, _extends2["default"])({
-    disabled: false,
+    disabled: true,
     htSelection: htSelection
   }, fieldProps, {
     setStyle: setStyle

package/lib/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/elements/box.js

@@ -4,6 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 
 exports.__esModule = true;
 exports["default"] = void 0;
+exports.getEnabledFields = getEnabledFields;
 exports.getTextStyle = getTextStyle;
 exports.setTextStyle = setTextStyle;
 
@@ -38,9 +39,20 @@ function setTextStyle(element, style, topo) {
   element.a('rectFont', fontStr);
   topo.getHtTopo().setRectangleText(element);
 }
+/**
+ * 
+ * @param {*} element 
+ * @returns {Array}
+ */
+
+
+function getEnabledFields(element) {
+  return ['fontFamily', 'fontSize', 'bold', 'italic', 'color', 'background', 'opacity'];
+}
 
 var _default = {
   getTextStyle: getTextStyle,
-  setTextStyle: setTextStyle
+  setTextStyle: setTextStyle,
+  getEnabledFields: getEnabledFields
 };
 exports["default"] = _default;

package/lib/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/elements/edgeTag.js

@@ -4,6 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 
 exports.__esModule = true;
 exports["default"] = void 0;
+exports.getEnabledFields = getEnabledFields;
 exports.getFieldDisabled = getFieldDisabled;
 exports.getTextStyle = getTextStyle;
 exports.setTextStyle = setTextStyle;
@@ -59,6 +60,16 @@ function setTextStyle(element, style, topo) {
     topo.getHtTopo().setEdgeLabelStyle(element, tagStyle);
   }
 }
+/**
+ * 
+ * @param {*} element 
+ * @returns {Array}
+ */
+
+
+function getEnabledFields(element) {
+  return ['fontFamily', 'color', 'background', 'opacity'];
+}
 
 function getFieldDisabled(element) {
   return {
@@ -69,6 +80,7 @@ function getFieldDisabled(element) {
 var _default = {
   getTextStyle: getTextStyle,
   setTextStyle: setTextStyle,
+  getEnabledFields: getEnabledFields,
   getFieldDisabled: getFieldDisabled
 };
 exports["default"] = _default;

package/lib/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/elements/groupTitle.js

@@ -4,6 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 
 exports.__esModule = true;
 exports["default"] = void 0;
+exports.getEnabledFields = getEnabledFields;
 exports.getFieldDisabled = getFieldDisabled;
 exports.getTextStyle = getTextStyle;
 exports.setTextStyle = setTextStyle;
@@ -45,18 +46,29 @@ function setTextStyle(element, style, topo) {
 
   if ('color' in style) {
     element.s('group.title.color', style.color.hex);
-  } // 背景颜色
+  }
 
+  if ('background' in style || 'opacity' in style) {
+    // 背景颜色
+    var prevStyle = getTextStyle(element);
+    element.s('group.title.background', (0, _colorUtil.formatBackgroundRgbaColor)(prevStyle, style));
+  }
 
-  var prevStyle = getTextStyle(element);
-  element.s('group.title.background', (0, _colorUtil.formatBackgroundRgbaColor)(prevStyle, style));
   var fontStyle = (0, _extends2["default"])({}, getTextStyle(element), style);
 
-  var fontStr = _fontStyleUtil["default"].build(_fontStyleUtil["default"].removeBoldItalic(fontStyle));
+  var fontStr = _fontStyleUtil["default"].build(fontStyle);
 
   element.s('group.title.font', fontStr);
 }
 
+function getEnabledFields(element) {
+  if (!element.isExpanded()) {
+    return ['fontFamily', 'fontSize', 'color', 'background', 'opacity'];
+  }
+
+  return ['fontFamily', 'fontSize', 'bold', 'italic', 'color', 'background', 'opacity'];
+}
+
 function getFieldDisabled(element) {
   if (!element.isExpanded()) {
     return {
@@ -70,6 +82,7 @@ function getFieldDisabled(element) {
 var _default = {
   getTextStyle: getTextStyle,
   setTextStyle: setTextStyle,
+  getEnabledFields: getEnabledFields,
   getFieldDisabled: getFieldDisabled
 };
 exports["default"] = _default;