@riil-frontend/component-topology 4.0.0-beta.21 → 4.0.0-beta.24

package/es/constants/ResourceInfoDisplay.js

@@ -53,8 +53,5 @@ export var NODE_TIP_DEFAULT_CONFIG = {
 
 export var DEFAULT_LINK_TAG_COMMON_CONFIG = {
   isCustom: false,
-  data: [{
-    type: 'metric',
-    code: 'interface_totalbps'
-  }]
+  data: []
 };

package/es/core/components/AlarmListPanel/components/AlarmListItem.js

@@ -10,10 +10,6 @@ var alarmLink = function alarmLink(alarmInfo) {
   return "/default/pagecenter/" + PAGE_TYPE.ALERT_DETAIL + "/view/" + alarmInfo.alertId + "?alertId=" + alarmInfo.alertId + "&resId=" + alarmInfo.ciId + "&title=" + alarmInfo.alertObject + "&ruleId=" + alarmInfo.ruleId + "&ciCode=" + alarmInfo.ciTypeCode + "&ciType=" + alarmInfo.ciType;
 };
 
-var riskLink = function riskLink(item) {
-  return "/default/inspectionTaskList/inspectionReport?title=" + item.ciName + "&reportId=" + item.executeId + "&reportTime=" + item.executeTime + "&reportType=" + item.viewType + "&reportName=" + item.ciName;
-};
-
 function AlarmListItem(props) {
   // 传入参数
   var topo = props.topo,
@@ -38,6 +34,11 @@ function RiskListItem(props) {
   var topo = props.topo,
       alarmInfo = props.alarmInfo,
       onClick = props.onClick;
+
+  var riskLink = function riskLink(item) {
+    return "/default/inspectionTaskList/inspectionReport?title=" + item.ciName + "&reportId=" + item.executeId + "&reportTime=" + item.executeTime + "&reportType=" + item.viewType + "&reportName=" + item.reportName;
+  };
+
   return /*#__PURE__*/React.createElement(_List.Item, {
     className: styles.AlarmListItem,
     media: /*#__PURE__*/React.createElement(_Icon, {

package/es/core/components/DisplaySettingDrawer/ResourceDisplay/BasicConfig.js

@@ -21,6 +21,7 @@ function BasicConfig(props, ref) {
       value = props.value,
       commonOptions = props.commonOptions,
       defaultCommonConfig = props.defaultCommonConfig,
+      commonSelectWidget = props.commonSelectWidget,
       limit = props.limit,
       elementType = props.elementType,
       showType = props.showType,
@@ -78,6 +79,7 @@ function BasicConfig(props, ref) {
     });
   };
 
+  var CommonSelectWidget = commonSelectWidget || CommonCheckboxGroup;
   return /*#__PURE__*/React.createElement(_Box, {
     spacing: 8,
     direction: "column"
@@ -96,7 +98,7 @@ function BasicConfig(props, ref) {
     type: "primary",
     text: true,
     onClick: openSetting
-  }, showType === 'tag' ? '选择图数据' : '选择Tooltip数据'), renderCustomSettingDrawer())), !isCustom && /*#__PURE__*/React.createElement(CommonCheckboxGroup, {
+  }, showType === 'tag' ? '选择图数据' : '选择Tooltip数据'), renderCustomSettingDrawer())), !isCustom && /*#__PURE__*/React.createElement(CommonSelectWidget, {
     value: data,
     dataSource: commonOptions,
     limit: limit,

package/es/core/editor/components/settings/propertyViews/multipleElements/BatchSetNodeIcon.js

@@ -0,0 +1,21 @@
+import React from 'react';
+import { isGroup, isNode } from "../../../../../../utils/htElementUtils";
+import NodeIconSelect from "../node/NodeIconSelect";
+export default function BatchSetNodeIcon(props) {
+  var topo = props.topo;
+
+  var setNodeIcon = function setNodeIcon(iconId) {
+    var selection = topo.getSelectionModel().getSelection().toArray();
+    var nodes = selection.filter(function (element) {
+      return isNode(element) && !isGroup(element);
+    });
+    nodes.forEach(function (node) {
+      node.setImage(iconId);
+    });
+  };
+
+  return /*#__PURE__*/React.createElement(NodeIconSelect, {
+    topo: topo,
+    onChange: setNodeIcon
+  });
+}

package/es/core/editor/components/settings/propertyViews/multipleElements/MultipleElementPropertyView.js

@@ -7,6 +7,7 @@ import BatchSetNodeSize from "./BatchSetNodeSize/BatchSetNodeSize";
 import { TPL_TREE } from "../../../../../../utils/template";
 import ViewPropertyView from "../view/ViewPropertyView";
 import MultipleElementLineType from "./MultipleElementLineType";
+import BatchSetNodeIcon from "./BatchSetNodeIcon";
 var CollapsePanel = _Collapse.Panel;
 /**
  * 多选元素属性面板
@@ -60,6 +61,10 @@ export default function MultipleElementPropertyView(props) {
     key: "\u56FE\u7247",
     title: "\u56FE\u7247"
   }, /*#__PURE__*/React.createElement(_Form.Item, {
+    label: "\u663E\u793A\u56FE\u7247"
+  }, /*#__PURE__*/React.createElement(BatchSetNodeIcon, {
+    topo: topo
+  })), /*#__PURE__*/React.createElement(_Form.Item, {
     label: "\u56FE\u7247\u5C3A\u5BF8",
     style: {
       marginBottom: 0

package/es/core/models/AttributeMetricDisplay.js

@@ -114,10 +114,6 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
       return _extends({}, link, {
         type: 'edge'
       });
-    }), linkGroups.map(function (link) {
-      return _extends({}, link, {
-        type: 'edgeGroup'
-      });
     }));
   };
 
@@ -241,8 +237,14 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
     var tagTipOptions = this.topo.options.tagTip;
     var defaultLinkTagConfig = tagTipOptions !== null && tagTipOptions !== void 0 && tagTipOptions.getDefaultLinkTagConfig ? tagTipOptions === null || tagTipOptions === void 0 ? void 0 : tagTipOptions.getDefaultLinkTagConfig(link) : null;
     var defaultLinkTipConfig = tagTipOptions !== null && tagTipOptions !== void 0 && tagTipOptions.getDefaultLinkTipConfig ? tagTipOptions === null || tagTipOptions === void 0 ? void 0 : tagTipOptions.getDefaultLinkTipConfig(link) : null;
+    var linkTagConfig = linkTag || defaultLinkTagConfig;
     return {
-      tags: getItems(linkTag || defaultLinkTagConfig),
+      tags: getItems(linkTagConfig),
+      tagLinkArrow: {
+        1: 'both',
+        2: 'from',
+        3: 'to'
+      }[linkTagConfig === null || linkTagConfig === void 0 ? void 0 : linkTagConfig.type] || undefined,
       tips: getItems(linkTip || defaultLinkTipConfig)
     };
   };
@@ -255,13 +257,14 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
 
       var tagTipConfig = _this2.getLinkTagTipConfig(link);
 
-      return {
+      return _extends({
         type: link.type,
         id: link.id,
-        ciType: ciType,
+        ciType: ciType
+      }, tagTipConfig, {
         tags: filterByPermission(link, tagTipConfig.tags),
         tips: filterByPermission(link, tagTipConfig.tips)
-      };
+      });
     });
   }
   /**
@@ -700,9 +703,10 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
   ;
 
   _proto.buildTagsTips = function buildTagsTips() {
+    var _this6 = this;
+
     var data = this.getData(); // 获取标注、悬浮框配置
 
-    var formatter = new AttributeFormatter(this.topo);
     var ciConfigs = this.getResourceTagTipConfig();
     var ciTagsAndTips = ciConfigs.map(function (ciConfig) {
       var ciDataItem = findItem(data, 'id', ciConfig.id);
@@ -720,10 +724,20 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
         ciType: ciConfig.ciType
       });
 
+      var formatter = new AttributeFormatter(_this6.topo);
+      var tags = formatter.formatAttrs(ciConfig.tags, ciData); // 链路标注箭头
+
+      if (ciConfig.type === 'edge') {
+        tags = {
+          data: tags,
+          linkArrow: ciConfig.tagLinkArrow
+        };
+      }
+
       return {
         type: ciConfig.type,
         id: ciConfig.id,
-        tags: formatter.formatAttrs(ciConfig.tags, ciData),
+        tags: tags,
         tips: formatter.formatAttrs(ciConfig.tips, ciData)
       };
     });

package/es/core/models/TopoApp.js

@@ -20,7 +20,7 @@ import { updateEdgeExpanded } from "../utils/edgeUtil";
 import PluginManager from "./PluginManager";
 import topoFactory from "./topoFactory"; // eslint-disable-next-line no-undef
 
-var version = typeof "4.0.0-beta.21" === 'string' ? "4.0.0-beta.21" : null;
+var version = typeof "4.0.0-beta.24" === 'string' ? "4.0.0-beta.24" : null;
 console.info("\u62D3\u6251\u7248\u672C: " + version);
 /**
  * 拓扑显示和编辑

package/es/core/models/attributeFormatter/index.js

@@ -1,4 +1,3 @@
-import _extends from "@babel/runtime/helpers/extends";
 import rlog from '@riil-frontend/component-topology-utils/es/rlog';
 import { metricValueFormat } from '@riil-frontend/utils';
 import { findItem } from "../../../utils/topoData";
@@ -25,33 +24,10 @@ export function formatMetric(val, metricInfo) {
     return "" + val;
   }
 }
-
-function addLinkMetricUnderlineArrow(metricCode) {
-  var map = {
-    // 总流速和总带宽利用率：双向箭头
-    'interface_totalbps': 'both',
-    'bandwidth_utilization': 'both',
-    // 发送速率和发送带宽利用率：背向取值端口的箭头 指向目的
-    'out_rate': 'to',
-    'out_bandwidth_utilization': 'to',
-    // 接收速率和接收带宽利用率：指向取值端口的箭头 指向源
-    'in_rate': 'from',
-    'in_bandwidth_utilization': 'from'
-  };
-
-  if (map[metricCode]) {
-    return {
-      underlineArrow: map[metricCode]
-    };
-  }
-
-  return {};
-}
 /**
  * 标注值格式化
  */
 
-
 var AttributeFormatter = /*#__PURE__*/function () {
   function AttributeFormatter(topo) {
     this.topo = topo;
@@ -88,7 +64,7 @@ var AttributeFormatter = /*#__PURE__*/function () {
       fieldValue = ciData[attrType + "Map"][fieldCode + "_object"].displayName;
     }
 
-    return _extends({
+    return {
       type: item.type,
       code: item.code,
       // 属性code
@@ -97,7 +73,7 @@ var AttributeFormatter = /*#__PURE__*/function () {
       value: formatMetric(fieldValue, fieldMeta),
       // 属性值
       originValue: fieldValue
-    }, addLinkMetricUnderlineArrow(fieldCode));
+    };
   };
 
   _proto.attributeTransform = function attributeTransform(item, ciData) {

package/es/core/viewer/components/plugins/ResourceDetail/components/ResourceOverview/BaseInfoBlock.js

@@ -10,18 +10,28 @@ export default function BaseInfoBlock(props) {
       ciTypeMeta = props.ciTypeMeta,
       headerExtra = props.headerExtra,
       renderContent = props.renderContent,
-      baseInfo = props.baseInfo;
+      baseInfo = props.baseInfo,
+      isAppTopo = props.isAppTopo;
   var id = data.id,
       ciType = data.ciType,
       type = data.type,
       name = data.name;
+  console.log('111 data', data);
   return /*#__PURE__*/React.createElement(BlockBox, {
     headerTitle: "\u57FA\u672C\u4FE1\u606F",
-    headerExtra: headerExtra ? headerExtra(props) : ciType === 'network_link' && /*#__PURE__*/React.createElement(SingleResourceStrategyLink, {
+    headerExtra: /*#__PURE__*/React.createElement("div", {
+      style: {
+        display: 'flex'
+      }
+    }, !isAppTopo && ciType === 'network_link' ? /*#__PURE__*/React.createElement("div", {
+      style: {
+        lineHeight: '28px'
+      }
+    }, /*#__PURE__*/React.createElement(SingleResourceStrategyLink, {
       id: id,
       ciType: ciType,
       name: name
-    })
+    })) : '', headerExtra ? headerExtra(props) : '')
   }, loading ? /*#__PURE__*/React.createElement(_Loading, {
     style: {
       width: '100%',

package/es/core/viewer/components/plugins/ResourceDetail/components/ResourceOverview/ResourceOverview.js

@@ -47,7 +47,7 @@ function formatUrl(url) {
 
 
 export default function ResourceOverview(props) {
-  var _viewerProps$resource, _data$attributes, _baseInfo$resource;
+  var _viewerProps$resource, _data$attributes;
 
   var topo = props.topo,
       id = props.id,
@@ -393,7 +393,7 @@ export default function ResourceOverview(props) {
                   icon: 'Overall_risk_full',
                   className: 'risk-icon',
                   title: "" + item.ciName + item.itemName,
-                  link: "/default/inspectionTaskList/inspectionReport?title=" + item.ciName + "&reportId=" + item.executeId + "&reportTime=" + item.executeTime + "&reportType=" + item.viewType + "&reportName=" + item.ciName,
+                  link: "/default/inspectionTaskList/inspectionReport?title=" + item.ciName + "&reportId=" + item.executeId + "&reportTime=" + item.executeTime + "&reportType=" + item.viewType + "&reportName=" + item.reportName,
                   time: item.firstFoundTime
                 };
               }); // console.log('告警和风险', alarmList, riskList);
@@ -508,7 +508,8 @@ export default function ResourceOverview(props) {
     id: id,
     ciType: ciType,
     type: type,
-    name: baseInfo === null || baseInfo === void 0 ? void 0 : (_baseInfo$resource = baseInfo.resource) === null || _baseInfo$resource === void 0 ? void 0 : _baseInfo$resource.display_name
+    // name: '123'
+    name: props.name
   }; // 基本信息设置改变
 
   function baseInfoColChange(_x5) {
@@ -807,6 +808,7 @@ export default function ResourceOverview(props) {
     data: elementData,
     ciTypeMeta: ciTypeMeta,
     baseInfo: baseInfo,
+    isAppTopo: isAppTopo,
     headerExtra: function headerExtra(p) {
       var _resourceOverviewProp3;
 

package/es/topoCenter/components/TopoView.js

@@ -17,6 +17,7 @@ import LinkTag from "../../core/components/DisplaySettingDrawer/LinkTag";
 import LinkTip from "../../core/components/DisplaySettingDrawer/LinkTip";
 import ViewerTools from "./viewer/titlebar/ViewerTools";
 import useEdgeFlow from "../hooks/viewer/useEdgeFlow";
+import LinkTagV2 from "./viewer/displaySetting/LinkTagV2";
 /**
  * 拓扑组件。变化无权限、无数据显示
  */
@@ -111,7 +112,7 @@ function NetworkTopologyCore(props) {
         showLinkConfig: true,
         // 是否显示链路流动效果配置
         linkTagConfig: function linkTagConfig(params) {
-          return /*#__PURE__*/React.createElement(LinkTag, params);
+          return /*#__PURE__*/React.createElement(LinkTagV2, params);
         },
         linkTipConfig: function linkTipConfig(params) {
           return /*#__PURE__*/React.createElement(LinkTip, params);

package/es/topoCenter/components/viewer/displaySetting/LinkTagCommonRidioGroup.js

@@ -0,0 +1,23 @@
+import _Radio from "@alifd/next/es/radio";
+import React from 'react';
+import styles from "./LinkTagCommonRidioGroup.module.scss";
+export default function LinkTagCommonRidioGroup(props) {
+  var value = props.value,
+      dataSource = props.dataSource,
+      limit = props.limit,
+      onChange = props.onChange;
+  return /*#__PURE__*/React.createElement("div", {
+    className: styles.contaienr
+  }, /*#__PURE__*/React.createElement("div", {
+    className: styles.checkboxGroupWrapper
+  }, /*#__PURE__*/React.createElement(_Radio.Group, {
+    value: typeof value === 'string' ? value : undefined,
+    itemDirection: "ver",
+    onChange: onChange
+  }, dataSource.map(function (item) {
+    return /*#__PURE__*/React.createElement(_Radio, {
+      value: item.value
+    }, item.label);
+  }))));
+}
+;

package/es/topoCenter/components/viewer/displaySetting/LinkTagCommonRidioGroup.module.scss

@@ -0,0 +1,23 @@
+@import "@alifd/next/variables";
+
+.contaienr {
+  padding: 16px 12px;
+  background: #F2F7FD;
+  border-radius: 4px;
+
+  .checkboxGroupWrapper {
+    margin: -8px -8px -8px 0;
+
+    :global {
+      .#{$css-prefix}checkbox-group.next-checkbox-group-hoz {
+        display: flex;
+        flex-flow: row wrap;
+  
+        .#{$css-prefix}checkbox-wrapper {
+          margin-left: 8px;
+          margin-right: 8px;
+        }
+      }
+    }
+  }
+}

package/es/topoCenter/components/viewer/displaySetting/LinkTagV2.js

@@ -0,0 +1,85 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React from 'react';
+import { DEFAULT_LINK_TAG_COMMON_CONFIG } from "../../../../constants/ResourceInfoDisplay";
+import BasicConfig from "../../../../core/components/DisplaySettingDrawer/ResourceDisplay/BasicConfig";
+import ResourceDiplayInfoSetting from "../../../../core/components/ResourceViewAttributeSetting/Setting";
+import LinkTagCommonRidioGroup from "./LinkTagCommonRidioGroup"; // 默认中可配置内容包括总速率、带宽利用率、发送速率、发送带宽利用率、接收速率、接收带宽利用率
+
+var CommonOptions = [{
+  value: '1',
+  label: '总流速、带宽利用率',
+  options: {
+    data: ['metric:interface_totalbps', 'metric:bandwidth_utilization']
+  }
+}, {
+  value: '2',
+  label: '发送速率、发送带宽利用率',
+  options: {
+    data: ['metric:out_rate', 'metric:out_bandwidth_utilization']
+  }
+}, {
+  value: '3',
+  label: '接收速率、接收带宽利用率',
+  options: {
+    data: ['metric:in_rate', 'metric:in_bandwidth_utilization']
+  }
+}];
+
+var buildConfig = function buildConfig(item) {
+  return {
+    type: item.split(':')[0],
+    code: item.split(':')[1]
+  };
+};
+/**
+ * 资源标注配置
+ * @param {*} props 
+ * @returns 
+ */
+
+
+function LinkTagV2(props, ref) {
+  var value = props.value,
+      onChange = props.onChange;
+
+  var handleChange = function handleChange(newValue) {
+    console.error(111, newValue);
+
+    if (!newValue.isCustom) {
+      var _CommonOptions$find;
+
+      var type = newValue.data;
+      var config = ((_CommonOptions$find = CommonOptions.find(function (item) {
+        return item.value === type;
+      })) === null || _CommonOptions$find === void 0 ? void 0 : _CommonOptions$find.options) || {
+        data: []
+      };
+      onChange(_extends({}, newValue, config, {
+        data: config.data.map(buildConfig),
+        type: type
+      }));
+    } else {
+      onChange(newValue);
+    }
+  };
+
+  return /*#__PURE__*/React.createElement(BasicConfig, _extends({
+    ref: ref
+  }, props, {
+    value: value ? _extends({}, value, {
+      data: value.type
+    }) : value,
+    limit: 1,
+    elementType: "link",
+    showType: "tag",
+    commonOptions: CommonOptions,
+    defaultCommonConfig: DEFAULT_LINK_TAG_COMMON_CONFIG,
+    commonSelectWidget: LinkTagCommonRidioGroup,
+    customSettingDrawer: function customSettingDrawer(params) {
+      return /*#__PURE__*/React.createElement(ResourceDiplayInfoSetting, params);
+    },
+    onChange: handleChange
+  }));
+}
+
+export default /*#__PURE__*/React.forwardRef(LinkTagV2);

package/es/topoCenter/models/TopoCenter.js

@@ -29,8 +29,8 @@ var TopoCenter = /*#__PURE__*/function (_TopoApp) {
         },
         getDefaultLinkTipConfig: function getDefaultLinkTipConfig() {
           return DEFAULT_TIP_COMMON_CONFIG;
-        },
-        ExtElementTagTipBuilder: LinkTagsTipsBuilder
+        } // ExtElementTagTipBuilder: LinkTagsTipsBuilder,
+
       },
       onSwitchToEditModeBegin: function () {
         var _onSwitchToEditModeBegin = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(topo) {

package/lib/constants/ResourceInfoDisplay.js

@@ -63,9 +63,6 @@ var NODE_TIP_DEFAULT_CONFIG = {
 exports.NODE_TIP_DEFAULT_CONFIG = NODE_TIP_DEFAULT_CONFIG;
 var DEFAULT_LINK_TAG_COMMON_CONFIG = {
   isCustom: false,
-  data: [{
-    type: 'metric',
-    code: 'interface_totalbps'
-  }]
+  data: []
 };
 exports.DEFAULT_LINK_TAG_COMMON_CONFIG = DEFAULT_LINK_TAG_COMMON_CONFIG;

package/lib/core/components/AlarmListPanel/components/AlarmListItem.js

@@ -26,10 +26,6 @@ var alarmLink = function alarmLink(alarmInfo) {
   return "/default/pagecenter/" + _uicbb.PAGE_TYPE.ALERT_DETAIL + "/view/" + alarmInfo.alertId + "?alertId=" + alarmInfo.alertId + "&resId=" + alarmInfo.ciId + "&title=" + alarmInfo.alertObject + "&ruleId=" + alarmInfo.ruleId + "&ciCode=" + alarmInfo.ciTypeCode + "&ciType=" + alarmInfo.ciType;
 };
 
-var riskLink = function riskLink(item) {
-  return "/default/inspectionTaskList/inspectionReport?title=" + item.ciName + "&reportId=" + item.executeId + "&reportTime=" + item.executeTime + "&reportType=" + item.viewType + "&reportName=" + item.ciName;
-};
-
 function AlarmListItem(props) {
   // 传入参数
   var topo = props.topo,
@@ -54,6 +50,11 @@ function RiskListItem(props) {
   var topo = props.topo,
       alarmInfo = props.alarmInfo,
       onClick = props.onClick;
+
+  var riskLink = function riskLink(item) {
+    return "/default/inspectionTaskList/inspectionReport?title=" + item.ciName + "&reportId=" + item.executeId + "&reportTime=" + item.executeTime + "&reportType=" + item.viewType + "&reportName=" + item.reportName;
+  };
+
   return /*#__PURE__*/_react["default"].createElement(_list["default"].Item, {
     className: _indexModule["default"].AlarmListItem,
     media: /*#__PURE__*/_react["default"].createElement(_icon["default"], {

package/lib/core/components/DisplaySettingDrawer/ResourceDisplay/BasicConfig.js

@@ -40,6 +40,7 @@ function BasicConfig(props, ref) {
       value = props.value,
       commonOptions = props.commonOptions,
       defaultCommonConfig = props.defaultCommonConfig,
+      commonSelectWidget = props.commonSelectWidget,
       limit = props.limit,
       elementType = props.elementType,
       showType = props.showType,
@@ -99,6 +100,7 @@ function BasicConfig(props, ref) {
     });
   };
 
+  var CommonSelectWidget = commonSelectWidget || _CommonCheckboxGroup["default"];
   return /*#__PURE__*/_react["default"].createElement(_box["default"], {
     spacing: 8,
     direction: "column"
@@ -117,7 +119,7 @@ function BasicConfig(props, ref) {
     type: "primary",
     text: true,
     onClick: openSetting
-  }, showType === 'tag' ? '选择图数据' : '选择Tooltip数据'), renderCustomSettingDrawer())), !isCustom && /*#__PURE__*/_react["default"].createElement(_CommonCheckboxGroup["default"], {
+  }, showType === 'tag' ? '选择图数据' : '选择Tooltip数据'), renderCustomSettingDrawer())), !isCustom && /*#__PURE__*/_react["default"].createElement(CommonSelectWidget, {
     value: data,
     dataSource: commonOptions,
     limit: limit,

package/lib/core/editor/components/settings/propertyViews/multipleElements/BatchSetNodeIcon.js

@@ -0,0 +1,31 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+exports.__esModule = true;
+exports["default"] = BatchSetNodeIcon;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _htElementUtils = require("../../../../../../utils/htElementUtils");
+
+var _NodeIconSelect = _interopRequireDefault(require("../node/NodeIconSelect"));
+
+function BatchSetNodeIcon(props) {
+  var topo = props.topo;
+
+  var setNodeIcon = function setNodeIcon(iconId) {
+    var selection = topo.getSelectionModel().getSelection().toArray();
+    var nodes = selection.filter(function (element) {
+      return (0, _htElementUtils.isNode)(element) && !(0, _htElementUtils.isGroup)(element);
+    });
+    nodes.forEach(function (node) {
+      node.setImage(iconId);
+    });
+  };
+
+  return /*#__PURE__*/_react["default"].createElement(_NodeIconSelect["default"], {
+    topo: topo,
+    onChange: setNodeIcon
+  });
+}

package/lib/core/editor/components/settings/propertyViews/multipleElements/MultipleElementPropertyView.js

@@ -23,6 +23,8 @@ var _ViewPropertyView = _interopRequireDefault(require("../view/ViewPropertyView
 
 var _MultipleElementLineType = _interopRequireDefault(require("./MultipleElementLineType"));
 
+var _BatchSetNodeIcon = _interopRequireDefault(require("./BatchSetNodeIcon"));
+
 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; }
@@ -80,6 +82,10 @@ function MultipleElementPropertyView(props) {
     key: "\u56FE\u7247",
     title: "\u56FE\u7247"
   }, /*#__PURE__*/_react["default"].createElement(_form["default"].Item, {
+    label: "\u663E\u793A\u56FE\u7247"
+  }, /*#__PURE__*/_react["default"].createElement(_BatchSetNodeIcon["default"], {
+    topo: topo
+  })), /*#__PURE__*/_react["default"].createElement(_form["default"].Item, {
     label: "\u56FE\u7247\u5C3A\u5BF8",
     style: {
       marginBottom: 0