Merge branch '2.0' of github.com:nocobase/nocobase into 2.0

packages/core/client/src/flow/models/actions/FilterActionModel.tsx

@@ -40,6 +40,7 @@ export class FilterActionModel extends GlobalActionModel {
     filterValue?: any;
     ignoreFieldsNames?: string[];
     open?: boolean;
+    position: 'left';
   };
 
   defaultProps: any = {
@@ -73,6 +74,13 @@ FilterActionModel.registerFlow({
   title: tval('Filter configuration'),
   auto: true,
   steps: {
+    position: {
+      title: '位置',
+      uiSchema: {},
+      handler(ctx, params) {
+        ctx.model.setProps('position', 'left');
+      },
+    },
     ignoreFieldsNames: {
       title: tval('Filterable fields'),
       uiSchema: {

packages/core/client/src/flow/models/data-blocks/table/TableModel.tsx

@@ -212,16 +212,49 @@ export class TableModel extends DataBlockModel<TableModelStructure> {
     return (
       <Card>
         <Spin spinning={this.resource.loading}>
-          <Space style={{ marginBottom: 16 }}>
-            {this.mapSubModels('actions', (action) => (
-              <FlowModelRenderer
-                model={action}
-                showFlowSettings={{ showBackground: false, showBorder: false }}
-                sharedContext={{ currentBlockModel: this }}
-              />
-            ))}
-            <AddActionButton model={this} subModelBaseClass="GlobalActionModel" subModelKey="actions" />
-          </Space>
+          <DndProvider
+            onDragEnd={({ active, over }) => {
+              if (active.id && over?.id && active.id !== over.id) {
+                this.flowEngine.moveModel(active.id as string, over.id as string);
+              }
+            }}
+          >
+            <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: 16 }}>
+              <Space>
+                {this.mapSubModels('actions', (action) => {
+                  // @ts-ignore
+                  if (action.props.position === 'left') {
+                    return (
+                      <FlowModelRenderer
+                        model={action}
+                        showFlowSettings={{ showBackground: false, showBorder: false }}
+                        sharedContext={{ currentBlockModel: this }}
+                      />
+                    );
+                  }
+
+                  return null;
+                })}
+              </Space>
+              <Space>
+                {this.mapSubModels('actions', (action) => {
+                  // @ts-ignore
+                  if (action.props.position !== 'left') {
+                    return (
+                      <FlowModelRenderer
+                        model={action}
+                        showFlowSettings={{ showBackground: false, showBorder: false }}
+                        sharedContext={{ currentBlockModel: this }}
+                      />
+                    );
+                  }
+
+                  return null;
+                })}
+                <AddActionButton model={this} subModelBaseClass="GlobalActionModel" subModelKey="actions" />
+              </Space>
+            </div>
+          </DndProvider>
           <Table
             components={this.components}
             tableLayout="fixed"

packages/core/flow-engine/src/components/dnd/index.tsx

@@ -37,15 +37,22 @@ export const Droppable: FC<{ model: FlowModel; children: React.ReactNode }> = ({
     <div
       ref={setNodeRef}
       style={{
-        background: isOver ? '#e6f7ff' : 'transparent',
-        borderRadius: 4,
-        transition: 'all 0.2s',
-        marginBottom: 8,
-        padding: 8,
+        position: 'relative',
         opacity: isActiveDroppable ? 0.3 : 1,
       }}
     >
       {children}
+      <div
+        style={{
+          position: 'absolute',
+          top: 0,
+          left: 0,
+          right: 0,
+          bottom: 0,
+          backgroundColor: isOver ? 'var(--colorBgSettingsHover)' : 'transparent',
+          pointerEvents: 'none',
+        }}
+      ></div>
     </div>
   );
 };