@riil-frontend/component-topology 6.0.6 → 6.0.8

package/es/core/components/TopoView/GraphViewPanel.js

@@ -9,14 +9,15 @@ export default function GraphViewPanel(props) {
 
   var _useCanvasTheme = useCanvasTheme({
     topo: topo,
-    themeName: themeName
+    themeName: themeName,
+    hideBackgroundColor: hideBackgroundColor
   }),
       canvasColor = _useCanvasTheme.canvasColor;
 
   return /*#__PURE__*/React.createElement("div", {
     className: styles.viewPanel,
     style: {
-      background: hideBackgroundColor ? null : canvasColor
+      background: canvasColor
     }
   }, props.children);
 }

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

@@ -6,9 +6,10 @@ import { formatBackgroundRgbaColor, parseBackground, parseColor } from "../color
 export function getTextStyle(element) {
   var underline = null;
   return _extends({
-    color: parseColor(element.a('link_ind_left_color')),
+    color: parseColor(element.a('edge.tag.color')),
+    fontFamily: element.a('edge.tag.fontFamily') || '微软雅黑',
     underline: underline
-  }, fontStyleUtil.toMap(element.a('link_ind_left_font')), parseBackground(element.a('link_ind_background')));
+  }, parseBackground(element.a('edge.tag.background')));
 }
 export function setTextStyle(element, style, topo) {
   var _fontStyleUtil$remove = fontStyleUtil.removeBoldItalic(style),

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

@@ -64,7 +64,7 @@ export function setTextStyle(element, style) {
  */
 
 export function getEnabledFields(element) {
-  return ['fontFamily', 'fontSize', 'bold', 'italic', 'color', 'background', 'opacity'];
+  return ['fontFamily', 'fontSize', 'color', 'background', 'opacity'];
 }
 export default {
   getTextStyle: getTextStyle,

package/es/core/editor/config/themes.js

@@ -7,9 +7,9 @@ var baseLightTheme = {
   },
   globalEdgeTagStyle: {
     color: '#777B9A',
-    background: '#FFFFFF',
+    background: 'rgba(255, 255, 255, 1)',
     // 背景色，不传使用默认内置 @V1.2
-    borderColor: '#CBCBCB' // 边框颜色，不传使用默认内置。用于主题切换 @V1.2
+    borderColor: '#B5BDC7' // 边框颜色，不传使用默认内置。用于主题切换 @V1.2
 
   },
   text: {
@@ -17,8 +17,8 @@ var baseLightTheme = {
   },
   group: {
     style: {
-      'group.title.background': '#E4E9EE',
-      // 标题背景颜色
+      'group.title.background': 'rgba(228, 233, 238, 1)',
+      // 标题背景颜色 #E4E9EE
       'group.title.color': '#4D6277',
       // 标题文字颜色
       'group.background': 'rgba(255, 255, 255, 0.9)',
@@ -69,8 +69,8 @@ var THEMES = [_extends({}, baseLightTheme, {
   },
   globalEdgeTagStyle: {
     color: '#E4E9EE',
-    background: '#063658',
-    // 背景色，不传使用默认内置 @V1.2
+    background: 'rgba(6, 54, 88, 1)',
+    // 背景色，不传使用默认内置 @V1.2 index.js:1 #063658 
     borderColor: '#08A5F4' // 边框颜色，不传使用默认内置。用于主题切换 @V1.2
 
   },

package/es/core/hooks/useCanvasTheme.js

@@ -30,15 +30,16 @@ var themeMap = [{
 }, {});
 export default function useCanvasTheme(props) {
   var topo = props.topo,
-      themeName = props.themeName; // 拓扑图是否加载
+      themeName = props.themeName,
+      hideBackgroundColor = props.hideBackgroundColor; // 拓扑图是否加载
 
   var _topo$store$useModelS = topo.store.useModelState('topoMod'),
       graphLoaded = _topo$store$useModelS.graphLoaded;
 
+  var themeConfig = themeMap[themeName || 'white'];
+  var canvasColor = hideBackgroundColor ? null : themeConfig.color;
   useEffect(function () {
     // 设置
-    var themeConfig = themeMap[themeName || 'white'];
-
     if (graphLoaded && themeConfig) {
       try {
         topo.getHtTopo().setTheme(themeName);
@@ -47,8 +48,18 @@ export default function useCanvasTheme(props) {
         console.error('切换主题失败', error);
       }
     }
-  }, [themeName, graphLoaded]);
+  }, [graphLoaded, themeName]);
+  useEffect(function () {
+    // 设置
+    if (graphLoaded) {
+      try {
+        topo.getHtTopo().getGraphView().dm().setBackground(canvasColor);
+      } catch (error) {
+        console.error('切换主题失败', error);
+      }
+    }
+  }, [graphLoaded, canvasColor]);
   return {
-    canvasColor: themeMap[themeName].color
+    canvasColor: canvasColor
   };
 }

package/es/core/hooks/useGraphAlarmDisplay.js

@@ -76,7 +76,7 @@ export default function useGraphAlarmDisplay(options) {
     });
 
     function showAlarm() {
-      if (!graphLoaded || isEditMode) {
+      if (!graphLoaded) {
         return;
       }
 
@@ -129,5 +129,5 @@ export default function useGraphAlarmDisplay(options) {
         resources: resources
       });
     };
-  }, [isEditMode, graphLoaded, resources, alarmSwitch, alarmList, risks, relateTopoAlarm]);
+  }, [graphLoaded, resources, alarmSwitch, alarmList, risks, relateTopoAlarm]);
 }

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.6" === 'string' ? "6.0.6" : null;
+var version = typeof "6.0.8" === 'string' ? "6.0.8" : null;
 console.info("\u62D3\u6251\u7248\u672C: " + version);
 /**
  * 拓扑显示和编辑

package/es/core/utils/showGraphManageStatusUtil.js

@@ -3,7 +3,6 @@ import { setElementRuntimeStyle } from "../../utils/htElementUtils";
 export function showManageStatus(options) {
   var topo = options.topo,
       resources = options.resources,
-      isEditMode = options.isEditMode,
       graphLoaded = options.graphLoaded,
       cisEventLevel = options.cisEventLevel;
 
@@ -14,7 +13,7 @@ export function showManageStatus(options) {
   }; // 首次加载和监控状态变化后，更新节点和连线置灰状态
 
 
-  if (!isEditMode && graphLoaded) {
+  if (graphLoaded) {
     resources.forEach(function (resource) {
       var type = resource.type,
           id = resource.id,

package/lib/core/components/TopoView/GraphViewPanel.js

@@ -19,14 +19,15 @@ function GraphViewPanel(props) {
 
   var _useCanvasTheme = (0, _useCanvasTheme2["default"])({
     topo: topo,
-    themeName: themeName
+    themeName: themeName,
+    hideBackgroundColor: hideBackgroundColor
   }),
       canvasColor = _useCanvasTheme.canvasColor;
 
   return /*#__PURE__*/_react["default"].createElement("div", {
     className: _TopoViewModule["default"].viewPanel,
     style: {
-      background: hideBackgroundColor ? null : canvasColor
+      background: canvasColor
     }
   }, props.children);
 }

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

@@ -22,9 +22,10 @@ var _excluded = ["color", "background", "opacity", "bold", "italic"];
 function getTextStyle(element) {
   var underline = null;
   return (0, _extends2["default"])({
-    color: (0, _colorUtil.parseColor)(element.a('link_ind_left_color')),
+    color: (0, _colorUtil.parseColor)(element.a('edge.tag.color')),
+    fontFamily: element.a('edge.tag.fontFamily') || '微软雅黑',
     underline: underline
-  }, _fontStyleUtil["default"].toMap(element.a('link_ind_left_font')), (0, _colorUtil.parseBackground)(element.a('link_ind_background')));
+  }, (0, _colorUtil.parseBackground)(element.a('edge.tag.background')));
 }
 
 function setTextStyle(element, style, topo) {

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

@@ -79,7 +79,7 @@ function setTextStyle(element, style) {
 
 
 function getEnabledFields(element) {
-  return ['fontFamily', 'fontSize', 'bold', 'italic', 'color', 'background', 'opacity'];
+  return ['fontFamily', 'fontSize', 'color', 'background', 'opacity'];
 }
 
 var _default = {

package/lib/core/editor/config/themes.js

@@ -15,9 +15,9 @@ var baseLightTheme = {
   },
   globalEdgeTagStyle: {
     color: '#777B9A',
-    background: '#FFFFFF',
+    background: 'rgba(255, 255, 255, 1)',
     // 背景色，不传使用默认内置 @V1.2
-    borderColor: '#CBCBCB' // 边框颜色，不传使用默认内置。用于主题切换 @V1.2
+    borderColor: '#B5BDC7' // 边框颜色，不传使用默认内置。用于主题切换 @V1.2
 
   },
   text: {
@@ -25,8 +25,8 @@ var baseLightTheme = {
   },
   group: {
     style: {
-      'group.title.background': '#E4E9EE',
-      // 标题背景颜色
+      'group.title.background': 'rgba(228, 233, 238, 1)',
+      // 标题背景颜色 #E4E9EE
       'group.title.color': '#4D6277',
       // 标题文字颜色
       'group.background': 'rgba(255, 255, 255, 0.9)',
@@ -77,8 +77,8 @@ var THEMES = [(0, _extends2["default"])({}, baseLightTheme, {
   },
   globalEdgeTagStyle: {
     color: '#E4E9EE',
-    background: '#063658',
-    // 背景色，不传使用默认内置 @V1.2
+    background: 'rgba(6, 54, 88, 1)',
+    // 背景色，不传使用默认内置 @V1.2 index.js:1 #063658 
     borderColor: '#08A5F4' // 边框颜色，不传使用默认内置。用于主题切换 @V1.2
 
   },

package/lib/core/hooks/useCanvasTheme.js

@@ -44,15 +44,16 @@ var themeMap = [{
 
 function useCanvasTheme(props) {
   var topo = props.topo,
-      themeName = props.themeName; // 拓扑图是否加载
+      themeName = props.themeName,
+      hideBackgroundColor = props.hideBackgroundColor; // 拓扑图是否加载
 
   var _topo$store$useModelS = topo.store.useModelState('topoMod'),
       graphLoaded = _topo$store$useModelS.graphLoaded;
 
+  var themeConfig = themeMap[themeName || 'white'];
+  var canvasColor = hideBackgroundColor ? null : themeConfig.color;
   (0, _react.useEffect)(function () {
     // 设置
-    var themeConfig = themeMap[themeName || 'white'];
-
     if (graphLoaded && themeConfig) {
       try {
         topo.getHtTopo().setTheme(themeName);
@@ -61,8 +62,18 @@ function useCanvasTheme(props) {
         console.error('切换主题失败', error);
       }
     }
-  }, [themeName, graphLoaded]);
+  }, [graphLoaded, themeName]);
+  (0, _react.useEffect)(function () {
+    // 设置
+    if (graphLoaded) {
+      try {
+        topo.getHtTopo().getGraphView().dm().setBackground(canvasColor);
+      } catch (error) {
+        console.error('切换主题失败', error);
+      }
+    }
+  }, [graphLoaded, canvasColor]);
   return {
-    canvasColor: themeMap[themeName].color
+    canvasColor: canvasColor
   };
 }

package/lib/core/hooks/useGraphAlarmDisplay.js

@@ -86,7 +86,7 @@ function useGraphAlarmDisplay(options) {
     });
 
     function showAlarm() {
-      if (!graphLoaded || isEditMode) {
+      if (!graphLoaded) {
         return;
       }
 
@@ -141,5 +141,5 @@ function useGraphAlarmDisplay(options) {
         resources: resources
       });
     };
-  }, [isEditMode, graphLoaded, resources, alarmSwitch, alarmList, risks, relateTopoAlarm]);
+  }, [graphLoaded, resources, alarmSwitch, alarmList, risks, relateTopoAlarm]);
 }

package/lib/core/models/TopoApp.js

@@ -54,7 +54,7 @@ var _ElementTagTipConfig = _interopRequireDefault(require("./tagstips/ElementTag
 var _SelectionModel = _interopRequireDefault(require("./SelectionModel"));
 
 // eslint-disable-next-line no-undef
-var version = typeof "6.0.6" === 'string' ? "6.0.6" : null;
+var version = typeof "6.0.8" === 'string' ? "6.0.8" : null;
 console.info("\u62D3\u6251\u7248\u672C: " + version);
 /**
  * 拓扑显示和编辑

package/lib/core/utils/showGraphManageStatusUtil.js

@@ -13,7 +13,6 @@ var _htElementUtils = require("../../utils/htElementUtils");
 function showManageStatus(options) {
   var topo = options.topo,
       resources = options.resources,
-      isEditMode = options.isEditMode,
       graphLoaded = options.graphLoaded,
       cisEventLevel = options.cisEventLevel;
 
@@ -24,7 +23,7 @@ function showManageStatus(options) {
   }; // 首次加载和监控状态变化后，更新节点和连线置灰状态
 
 
-  if (!isEditMode && graphLoaded) {
+  if (graphLoaded) {
     resources.forEach(function (resource) {
       var type = resource.type,
           id = resource.id,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@riil-frontend/component-topology",
-  "version": "6.0.6",
+  "version": "6.0.8",
   "description": "拓扑",
   "scripts": {
     "start": "build-scripts start",
@@ -116,6 +116,6 @@
     "access": "public"
   },
   "license": "MIT",
-  "homepage": "https://unpkg.com/@riil-frontend/component-topology@6.0.6/build/index.html",
+  "homepage": "https://unpkg.com/@riil-frontend/component-topology@6.0.8/build/index.html",
   "gitHead": "2da19ffccbb7ca60a8acf396e39f542c68bb33f5"
 }