feat: 添加新执行动作

src/pages/rule-engine/Scene/Save/action/ListItem/Item.tsx

@@ -0,0 +1,10 @@
+interface ItemProps {
+  name: number;
+  resetField: any;
+  remove: (index: number | number[]) => void;
+  // type: 'serial' | 'parallel'
+}
+
+export default (props: ItemProps) => {
+  return <div className="">{props.name}</div>;
+};

src/pages/rule-engine/Scene/Save/action/ListItem/List.tsx

@@ -0,0 +1,28 @@
+import { Button, Form } from 'antd';
+import { PlusOutlined } from '@ant-design/icons';
+import Item from './Item';
+
+export default () => {
+  const [form] = Form.useForm();
+
+  return (
+    <div className="action-list-content">
+      <Form form={form} colon={false} layout={'vertical'} preserve={false} name="actions">
+        <Form.List name="actions">
+          {(fields, { add, remove }) => (
+            <>
+              {fields.map(({ key, name, ...resetField }) => (
+                <Item key={key} name={name} resetField={resetField} remove={remove} />
+              ))}
+              <div className="action-list-add">
+                <Button type="primary" onClick={add} ghost icon={<PlusOutlined />}>
+                  新增
+                </Button>
+              </div>
+            </>
+          )}
+        </Form.List>
+      </Form>
+    </div>
+  );
+};

src/pages/rule-engine/Scene/Save/action/ListItem/index.tsx

@@ -0,0 +1,7 @@
+import List from './List';
+import Item from './Item';
+
+export default {
+  List,
+  Item,
+};

src/pages/rule-engine/Scene/Save/action/index.less

@@ -16,3 +16,11 @@
     }
   }
 }
+
+.actions {
+  .actions-title {
+    margin: 16px 0;
+    font-weight: 800;
+    font-size: 14px;
+  }
+}

src/pages/rule-engine/Scene/Save/action/index.tsx

@@ -0,0 +1,35 @@
+import { Collapse } from 'antd';
+
+const { Panel } = Collapse;
+
+export default () => {
+  return (
+    <div className="actions">
+      <div className="actions-title">执行</div>
+      <div className="actions-warp">
+        <Collapse defaultActiveKey={[]}>
+          <Panel
+            header={
+              <span>
+                串行<span>按顺序依次执行动作</span>
+              </span>
+            }
+            key="1"
+          >
+            <div className="actions-list"></div>
+          </Panel>
+          <Panel
+            header={
+              <span>
+                并行<span>同时执行所有动作</span>
+              </span>
+            }
+            key="2"
+          >
+            <div className="actions-list"></div>
+          </Panel>
+        </Collapse>
+      </div>
+    </div>
+  );
+};

src/pages/rule-engine/Scene/Save/components/Buttons/AddButton.tsx

@@ -0,0 +1,12 @@
+interface ButtonProps {
+  children?: React.ReactDOM | string;
+  onClick?: () => void;
+}
+
+export default (props: ButtonProps) => {
+  return (
+    <div className="rule-button-warp">
+      <div className="rule-button add-button">{props.children}</div>
+    </div>
+  );
+};

src/pages/rule-engine/Scene/Save/components/Buttons/index.less

@@ -0,0 +1,17 @@
+.rule-button-warp {
+  padding: 8px;
+  background-color: #fafafa;
+
+  .rule-button {
+    padding: 6px 20px;
+    font-size: 14px;
+    line-height: 22px;
+    background-color: #fff;
+    border: 1px solid #e0e0e0;
+    border-radius: 15px;
+  }
+
+  .add-button {
+    color: #bdbdbd;
+  }
+}

src/pages/rule-engine/Scene/Save/components/Buttons/index.tsx

@@ -0,0 +1,2 @@
+import './index.less';
+export * as AddButton from './AddButton';