strategy-panel 1.0.1 → 1.0.2

package/es/components/canvas/config-panel/components/time-trigger/section-time.js

@@ -0,0 +1,81 @@
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+import React from 'react';
+import classNames from 'classnames';
+import { Form, Select } from 'antd';
+import EffectiveTime from "./effective-time";
+import SectionDetail from "./section-Detail";
+import "../../style.less";
+
+var SectionTime = function SectionTime(props) {
+  var value = props.value,
+      onChange = props.onChange,
+      disabled = props.disabled;
+
+  var handleDatesChange = function handleDatesChange(effectDates) {
+    console.log('xxxxxxxxxxxxxxxxxxxx handleDatesChange', effectDates);
+    onChange === null || onChange === void 0 ? void 0 : onChange(_objectSpread(_objectSpread({}, value), {}, {
+      effectDates: effectDates
+    }));
+  };
+
+  var handleUnitChange = function handleUnitChange(unit) {
+    if (unit !== (value === null || value === void 0 ? void 0 : value.unit)) {
+      onChange === null || onChange === void 0 ? void 0 : onChange(_objectSpread(_objectSpread({}, value), {}, {
+        unit: unit,
+        list: [{}]
+      }));
+    }
+  };
+
+  var handleValueChange = function handleValueChange(list) {
+    console.log('xxxxxxxxxxxxxxxxxxxx handleValueChange', list);
+    onChange === null || onChange === void 0 ? void 0 : onChange(_objectSpread(_objectSpread({}, value), {}, {
+      list: list
+    }));
+  };
+
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+    className: classNames('border-bottom', 'inner-bottom-box')
+  }, /*#__PURE__*/React.createElement(Form.Item, {
+    label: "\u89E6\u53D1\u6A21\u5F0F",
+    required: true,
+    className: "no-margin-bottom"
+  }, /*#__PURE__*/React.createElement(Select, {
+    disabled: disabled,
+    allowClear: true,
+    value: value === null || value === void 0 ? void 0 : value.unit,
+    onChange: handleUnitChange
+  }, /*#__PURE__*/React.createElement(Select.Option, {
+    value: "HOURS"
+  }, "\u5C0F\u65F6\u533A\u95F4"), /*#__PURE__*/React.createElement(Select.Option, {
+    value: "DAYS"
+  }, "\u65E5\u5468\u671F"), /*#__PURE__*/React.createElement(Select.Option, {
+    value: "MONTHS"
+  }, "\u6708\u533A\u95F4")))), (value === null || value === void 0 ? void 0 : value.unit) && /*#__PURE__*/React.createElement("div", {
+    className: classNames('border-bottom', 'inner-bottom-box')
+  }, /*#__PURE__*/React.createElement(Form.Item, {
+    label: "\u65F6\u95F4\u533A\u95F4",
+    required: true,
+    className: "no-margin-bottom"
+  }, /*#__PURE__*/React.createElement(SectionDetail, {
+    mode: value === null || value === void 0 ? void 0 : value.unit,
+    disabled: disabled,
+    value: value === null || value === void 0 ? void 0 : value.list,
+    onChange: handleValueChange
+  }))), /*#__PURE__*/React.createElement("div", {
+    className: classNames('border-bottom', 'inner-bottom-box')
+  }, /*#__PURE__*/React.createElement(Form.Item, {
+    label: "\u751F\u6548\u65F6\u95F4\u533A\u95F4",
+    className: "no-margin-bottom"
+  }, /*#__PURE__*/React.createElement(EffectiveTime, {
+    value: value === null || value === void 0 ? void 0 : value.effectDates,
+    onChange: handleDatesChange
+  }))));
+};
+
+export default SectionTime;

package/es/{pages → components/canvas}/config-panel/components/time-trigger/timing-time.d.ts

@@ -1,9 +1,9 @@
-import React from 'react';
-import '../../style.less';
-interface Props {
-    value?: any;
-    onChange?: (value: any) => void;
-    disabled?: boolean;
-}
-declare const TimingTime: React.FC<Props>;
-export default TimingTime;
+import React from 'react';
+import '../../style.less';
+interface Props {
+    value?: any;
+    onChange?: (value: any) => void;
+    disabled?: boolean;
+}
+declare const TimingTime: React.FC<Props>;
+export default TimingTime;

package/es/{pages → components/canvas}/config-panel/components/time-trigger/timing-time.js

@@ -1,8 +1,3 @@
-import "antd/es/select/style";
-import _Select from "antd/es/select";
-import "antd/es/form/style";
-import _Form from "antd/es/form";
-
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
@@ -10,6 +5,7 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
 import React from 'react';
+import { Form, Select } from 'antd';
 import classNames from 'classnames';
 import CycleTime from "./components/cycle-time";
 import "../../style.less";
@@ -29,21 +25,21 @@ var TimingTime = function TimingTime(props) {
 
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
     className: classNames('border-bottom', 'inner-bottom-box')
-  }, /*#__PURE__*/React.createElement(_Form.Item, {
+  }, /*#__PURE__*/React.createElement(Form.Item, {
     label: "\u89E6\u53D1\u5468\u671F",
     required: true,
     className: "no-margin-bottom",
-    validateStatus: (value === null || value === void 0 ? void 0 : value.cycle) ? 'success' : 'error'
-  }, /*#__PURE__*/React.createElement(_Select, {
+    validateStatus: value !== null && value !== void 0 && value.cycle ? 'success' : 'error'
+  }, /*#__PURE__*/React.createElement(Select, {
     disabled: disabled,
     allowClear: true,
     value: value === null || value === void 0 ? void 0 : value.cycle,
     onChange: cycleChange
-  }, /*#__PURE__*/React.createElement(_Select.Option, {
+  }, /*#__PURE__*/React.createElement(Select.Option, {
     value: "day"
-  }, "\u65E5"), /*#__PURE__*/React.createElement(_Select.Option, {
+  }, "\u65E5"), /*#__PURE__*/React.createElement(Select.Option, {
     value: "week"
-  }, "\u5468"), /*#__PURE__*/React.createElement(_Select.Option, {
+  }, "\u5468"), /*#__PURE__*/React.createElement(Select.Option, {
     value: "month"
   }, "\u6708")))), (value === null || value === void 0 ? void 0 : value.cycle) && /*#__PURE__*/React.createElement(CycleTime, {
     disabled: disabled,

package/es/{pages → components/canvas}/config-panel/config-common.d.ts

@@ -1,37 +1,38 @@
-import './style.less';
-export declare const getComponentConfig: (experimentId: string) => {
-    [x: string]: {
-        name: string;
-        label: string;
-        type: string;
-        required: boolean;
-        selectData: {
-            label: string;
-            value: string;
-        }[];
-    }[] | {
-        name: string;
-        type: string;
-        component: JSX.Element;
-    }[] | {
-        name: string;
-        label: string;
-        required: boolean;
-        type: string;
-        component: JSX.Element;
-    }[] | ({
-        name: string;
-        label: string;
-        type: string;
-        selectData?: undefined;
-    } | {
-        name: string;
-        label: string;
-        type: string;
-        selectData: {
-            label: string;
-            value: string;
-        }[];
-    })[];
-};
-export declare const getFormatComponent: (data: any, mode: Types.ModeType) => JSX.Element | undefined;
+import type { ModeType } from "../../../packages/graph-canvas/typings";
+import './style.less';
+export declare const getComponentConfig: (experimentId: string) => {
+    [x: number]: {
+        name: string;
+        label: string;
+        type: string;
+        required: boolean;
+        selectData: {
+            label: string;
+            value: string;
+        }[];
+    }[] | {
+        name: string;
+        type: string;
+        component: JSX.Element;
+    }[] | {
+        name: string;
+        label: string;
+        required: boolean;
+        type: string;
+        component: JSX.Element;
+    }[] | ({
+        name: string;
+        label: string;
+        type: string;
+        selectData?: undefined;
+    } | {
+        name: string;
+        label: string;
+        type: string;
+        selectData: {
+            label: string;
+            value: string;
+        }[];
+    })[];
+};
+export declare const getFormatComponent: (data: any, mode: ModeType) => JSX.Element | undefined;

package/es/{pages → components/canvas}/config-panel/config-common.js

@@ -1,22 +1,16 @@
-import "antd/es/input/style";
-import _Input from "antd/es/input";
-import "antd/es/form/style";
-import _Form from "antd/es/form";
-import "antd/es/select/style";
-import _Select from "antd/es/select";
-
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
 import React from 'react';
-import { withMode } from "../../hooks/withMode";
+import { Form, Input, Select } from 'antd';
+import { withMode } from "../../../packages/hooks/withMode";
 import { MOTION_OPERATION, // COMPONENTS_TYPE,
 // COMMONLY_USED,
 SCENE_DISPLAY, SIGN_OPERATION // MOTION_OPERATION,
-} from "../../common/graph-common/node-types";
+} from "../../../packages/graph-canvas/node-types";
 import TimeTrigger from "./components/time-trigger";
 import ConditionConfiguration from "./components/condition-configuration";
 import "./style.less";
-var Option = _Select.Option;
+var Option = Select.Option;
 export var getComponentConfig = function getComponentConfig(experimentId) {
   var _ref;
 
@@ -92,12 +86,12 @@ export var getFormatComponent = function getFormatComponent(data, mode) {
       formComponent = /*#__PURE__*/React.createElement("div", {
         className: "border-bottom",
         key: name
-      }, /*#__PURE__*/React.createElement(_Form.Item, {
+      }, /*#__PURE__*/React.createElement(Form.Item, {
         label: label,
         name: name,
         rules: rules,
         className: "no-margin-bottom"
-      }, /*#__PURE__*/React.createElement(_Input, {
+      }, /*#__PURE__*/React.createElement(Input, {
         disabled: mode === 'view' ? true : disabled
       })));
       break;
@@ -106,12 +100,12 @@ export var getFormatComponent = function getFormatComponent(data, mode) {
       formComponent = /*#__PURE__*/React.createElement("div", {
         className: "border-bottom",
         key: name
-      }, /*#__PURE__*/React.createElement(_Form.Item, {
+      }, /*#__PURE__*/React.createElement(Form.Item, {
         label: label,
         name: name,
         rules: rules,
         className: "no-margin-bottom"
-      }, /*#__PURE__*/React.createElement(_Select, {
+      }, /*#__PURE__*/React.createElement(Select, {
         disabled: mode === 'view' ? true : disabled
       }, selectData === null || selectData === void 0 ? void 0 : selectData.map(function (item) {
         return /*#__PURE__*/React.createElement(Option, {
@@ -125,7 +119,7 @@ export var getFormatComponent = function getFormatComponent(data, mode) {
       formComponent = /*#__PURE__*/React.createElement("div", {
         className: "border-bottom",
         key: name
-      }, /*#__PURE__*/React.createElement(_Form.Item, {
+      }, /*#__PURE__*/React.createElement(Form.Item, {
         key: name,
         label: label,
         name: name,

package/es/{pages → components/canvas}/config-panel/index.d.ts

@@ -1,13 +1,14 @@
-import React from 'react';
-import type { configDataItem } from './node-form';
-import './style.less';
-interface Props {
-    experimentId: string;
-    className?: string;
-    extraConfigData?: configDataItem;
-    activeNodeId?: string;
-    mode?: Types.ModeType;
-}
-declare const ConfigPanel: React.FC<Props>;
-export default ConfigPanel;
-export type { configDataItem };
+import React from 'react';
+import type { configDataItem } from './node-form';
+import type { ModeType } from "../../../packages/graph-canvas/typings";
+import './style.less';
+interface Props {
+    experimentId: string;
+    className?: string;
+    extraConfigData?: configDataItem;
+    activeNodeId?: string;
+    mode?: ModeType;
+}
+declare const ConfigPanel: React.FC<Props>;
+export default ConfigPanel;
+export type { configDataItem };

package/es/{pages → components/canvas}/config-panel/index.js

@@ -12,8 +12,8 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
 import React from 'react';
 import classNames from 'classnames';
-import { useObservableState } from "../../hooks/useObservableState";
-import { useExperimentGraph } from "../rx-models/experiment-graph";
+import { useObservableState } from "../../../packages/hooks/useObservableState";
+import { useExperimentGraph } from "../../../packages/graph-canvas";
 import NodeForm from "./node-form";
 import "./style.less";
 

package/es/{pages → components/canvas}/config-panel/node-form.d.ts

@@ -1,22 +1,23 @@
-import React from 'react';
-import './style.less';
-export declare type configDataItem = Record<string, {
-    name: string;
-    label: string;
-    type: 'input' | 'select' | 'auto';
-    required?: boolean;
-    component?: React.ReactNode;
-    disabled?: boolean;
-    selectData?: {
-        label: string;
-        value: any;
-    }[];
-}[]>;
-export interface Props {
-    experimentId: string;
-    nodeId: string;
-    extraConfigData?: configDataItem;
-    mode: Types.ModeType;
-}
-declare const NodeForm: React.FC<Props>;
-export default NodeForm;
+import React from 'react';
+import type { ModeType } from "../../../packages/graph-canvas/typings";
+import './style.less';
+export declare type configDataItem = Record<string, {
+    name: string;
+    label?: string;
+    type: 'input' | 'select' | 'auto';
+    required?: boolean;
+    component?: React.ReactNode;
+    disabled?: boolean;
+    selectData?: {
+        label: string;
+        value: any;
+    }[];
+}[]>;
+export interface Props {
+    experimentId: string;
+    nodeId: string;
+    extraConfigData?: configDataItem;
+    mode: ModeType;
+}
+declare const NodeForm: React.FC<Props>;
+export default NodeForm;

package/es/{pages → components/canvas}/config-panel/node-form.js

@@ -1,8 +1,3 @@
-import "antd/es/input/style";
-import _Input from "antd/es/input";
-import "antd/es/form/style";
-import _Form from "antd/es/form";
-
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _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."); }
@@ -16,14 +11,15 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
 import React, { useEffect } from 'react';
-import { useObservableState } from "../../hooks/useObservableState";
-import { useExperimentGraph } from "../rx-models/experiment-graph";
+import { Form, Input } from 'antd';
+import { useObservableState } from "../../../packages/hooks/useObservableState";
+import { useExperimentGraph } from "../../../packages/graph-canvas";
 import { getComponentConfig } from "./config-common";
 import { getFormatComponent } from "./config-common";
 import "./style.less";
 
 var NodeForm = function NodeForm(_ref) {
-  var _nodeId$split;
+  var _nodeId$split, _node$id, _node$id$split;
 
   var nodeId = _ref.nodeId,
       experimentId = _ref.experimentId,
@@ -31,7 +27,7 @@ var NodeForm = function NodeForm(_ref) {
       extraConfigData = _ref$extraConfigData === void 0 ? {} : _ref$extraConfigData,
       mode = _ref.mode;
 
-  var _Form$useForm = _Form.useForm(),
+  var _Form$useForm = Form.useForm(),
       _Form$useForm2 = _slicedToArray(_Form$useForm, 1),
       form = _Form$useForm2[0];
 
@@ -54,26 +50,28 @@ var NodeForm = function NodeForm(_ref) {
   var allConfigData = Object.assign({}, componentConfig, extraConfigData);
   var configData = allConfigData === null || allConfigData === void 0 ? void 0 : allConfigData[nodeType];
   useEffect(function () {
-    if (node === null || node === void 0 ? void 0 : node.nodeData) {
+    if (node !== null && node !== void 0 && node.nodeData) {
       var nodeData = typeof node.nodeData === 'string' ? JSON.parse(node === null || node === void 0 ? void 0 : node.nodeData) : node.nodeData;
       console.log('NodeForm useEffect', node.nodeData);
       form.setFieldsValue(nodeData);
     }
   }, [node === null || node === void 0 ? void 0 : node.nodeData]);
-  return /*#__PURE__*/React.createElement(_Form, {
+  return /*#__PURE__*/React.createElement(Form, {
     form: form,
     className: "config-panel-form",
     layout: "vertical",
     onValuesChange: onValuesChange
   }, /*#__PURE__*/React.createElement("div", {
     className: "border-bottom"
-  }, /*#__PURE__*/React.createElement(_Form.Item, {
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "config-title"
+  }, "\u7EC4\u4EF6\u7C7B\u578B: ", node === null || node === void 0 ? void 0 : node.name), /*#__PURE__*/React.createElement("div", {
+    className: "id-line"
+  }, "id: ", node === null || node === void 0 ? void 0 : (_node$id = node.id) === null || _node$id === void 0 ? void 0 : (_node$id$split = _node$id.split('-')) === null || _node$id$split === void 0 ? void 0 : _node$id$split[1]), /*#__PURE__*/React.createElement(Form.Item, {
+    name: "realName",
     label: "\u7EC4\u4EF6\u540D\u79F0",
     className: "no-margin-bottom"
-  }, /*#__PURE__*/React.createElement(_Input, {
-    disabled: true,
-    value: node === null || node === void 0 ? void 0 : node.name
-  }))), configData === null || configData === void 0 ? void 0 : configData.map(function (item) {
+  }, /*#__PURE__*/React.createElement(Input, null))), configData === null || configData === void 0 ? void 0 : configData.map(function (item) {
     return getFormatComponent(item, mode);
   }));
 };

package/es/{pages → components/canvas}/config-panel/style.less

@@ -1,81 +1,90 @@
-@e9-color: #e9e9e9;
-@f2-color: #F2F2F2;
-@black-color: #323232;
-
-.config-panel {
-  width: 290px;
-  min-width: 290px;
-  margin-top: -1px;
-  margin-right: -300px;
-  border: 1px solid @e9-color;
-  transition: margin-right 0.3s ease-out;
-  &.selected {
-    margin-right: 0;
-  }
-}
-
-.setting {
-  height: 100%;
-  .form {
-    flex-grow: 1;
-    height: 100%;
-    padding: 10px 0;
-    overflow-x: hidden;
-    overflow-y: auto;
-    background: #fff;
-  }
-}
-
-.no-margin-bottom {
-  margin-bottom: 0 !important;
-}
-
-.config-panel-form{
-  & > .border-bottom:last-child{
-    margin-bottom: 50px;
-  }
-}
-
-.border-bottom {
-  margin-bottom: 6px;
-  padding: 0 10px 12px;
-  border-bottom: 1px solid @e9-color;
-  &.inner-bottom-box{
-    margin: 0 -10px -13px;
-  }
-  &.inner-bottom-box:not(:first-child) {
-    margin-top: 18px;
-  }
-
-  .ant-form-item-with-help .ant-form-item-explain {
-    display: none;
-  }
-  .ant-input,
-  .ant-input-number,
-  .ant-input-number-status-error:not(.ant-input-number-disabled):not(.ant-input-number-borderless).ant-input-number,
-  .ant-input-number-status-error:not(.ant-input-number-disabled):not(.ant-input-number-borderless).ant-input-number:hover{
-    border-radius: 4px;
-    color: @black-color !important;
-    background: @f2-color !important;
-  }
-  .ant-picker,
-  .ant-picker:not([disabled]):hover,
-  .ant-picker-status-error.ant-picker, .ant-picker-status-error.ant-picker:not([disabled]):hover{
-    border-radius: 4px;
-    color: @black-color !important;
-    background: @f2-color !important;
-  }
-  .ant-form-item-has-error .ant-input-number:not([disabled]):hover,
-  .ant-form-item-has-error .ant-picker:not([disabled]):hover,
-  .ant-form-item-has-error .ant-select:not(.ant-select-disabled):not(.ant-select-customize-input) .ant-select-selector{
-    border-radius: 4px;
-    color: @black-color !important;
-    background: @f2-color !important;
-  }
-  .ant-select:not(.ant-select-customize-input) .ant-select-selector{
-    border-radius: 4px;
-    color: @black-color !important;
-    background: @f2-color !important;
-  }
-}
-
+@e9-color: #e9e9e9;
+@f2-color: #F2F2F2;
+@black-color: #323232;
+
+.config-panel {
+  width: 350px;
+  min-width: 350px;
+  margin-top: -1px;
+  margin-right: -360px;
+  border: 1px solid @e9-color;
+  transition: margin-right 0.3s ease-out;
+  &.selected {
+    margin-right: 0;
+  }
+}
+
+.setting {
+  height: 100%;
+  .form {
+    flex-grow: 1;
+    height: 100%;
+    padding: 10px 0;
+    overflow-x: hidden;
+    overflow-y: auto;
+    background: #fff;
+  }
+}
+
+.no-margin-bottom {
+  margin-bottom: 0 !important;
+}
+
+.config-panel-form{
+  & > .border-bottom:last-child{
+    margin-bottom: 50px;
+  }
+}
+
+.border-bottom {
+  margin-bottom: 6px;
+  padding: 0 10px 12px;
+  border-bottom: 1px solid @e9-color;
+  &.inner-bottom-box{
+    margin: 0 -10px -13px;
+  }
+  &.inner-bottom-box:not(:first-child) {
+    margin-top: 18px;
+  }
+
+  .ant-form-item-with-help .ant-form-item-explain {
+    display: none;
+  }
+  .ant-input,
+  .ant-input-number,
+  .ant-input-number-status-error:not(.ant-input-number-disabled):not(.ant-input-number-borderless).ant-input-number,
+  .ant-input-number-status-error:not(.ant-input-number-disabled):not(.ant-input-number-borderless).ant-input-number:hover{
+    border-radius: 4px;
+    color: @black-color !important;
+    background: @f2-color !important;
+  }
+  .ant-picker,
+  .ant-picker:not([disabled]):hover,
+  .ant-picker-status-error.ant-picker, .ant-picker-status-error.ant-picker:not([disabled]):hover{
+    border-radius: 4px;
+    color: @black-color !important;
+    background: @f2-color !important;
+  }
+  .ant-form-item-has-error .ant-input-number:not([disabled]):hover,
+  .ant-form-item-has-error .ant-picker:not([disabled]):hover,
+  .ant-form-item-has-error .ant-select:not(.ant-select-disabled):not(.ant-select-customize-input) .ant-select-selector{
+    border-radius: 4px;
+    color: @black-color !important;
+    background: @f2-color !important;
+  }
+  .ant-select:not(.ant-select-customize-input) .ant-select-selector{
+    border-radius: 4px;
+    color: @black-color !important;
+    background: @f2-color !important;
+  }
+
+  .id-line{
+    margin-top: 5px;
+    text-align: right;
+    user-select: all;
+  }
+}
+
+.section-detail-select{
+  display: flex;
+}

package/es/{pages → components/canvas}/dag-canvas/canvas-content.d.ts

@@ -1,10 +1,11 @@
-import React from 'react';
-import '@antv/x6-react-shape';
-import './canvas-content.less';
-interface Props {
-    experimentId: string;
-    className?: string;
-    viewData?: any;
-}
-export declare const CanvasContent: React.FC<Props>;
-export {};
+import React from 'react';
+import '@antv/x6-react-shape';
+import './canvas-content.less';
+interface Props {
+    experimentId: string;
+    className?: string;
+    viewData?: any;
+    dragEnable: boolean;
+}
+export declare const CanvasContent: React.FC<Props>;
+export {};