diff --git a/packages/client/src/schemas/designable-bar/style.less b/packages/client/src/schemas/designable-bar/style.less
index 7594628ba..cee7ebf55 100644
--- a/packages/client/src/schemas/designable-bar/style.less
+++ b/packages/client/src/schemas/designable-bar/style.less
@@ -81,3 +81,25 @@
background: none !important;
border: 2px solid rgba(241, 139, 98, 0.3) !important;
}
+
+.action-bar-align-right,
+.action-bar-align-left {
+ position: relative;
+ &.isOver {
+ background-color: transparent !important;
+ .ant-space {
+ position: relative;
+ z-index: 2;
+ }
+ &::after {
+ content: '';
+ background-color: rgba(241, 139, 98, 0.1) !important;
+ position: absolute;
+ top: -3px;
+ left: -3px;
+ right: -3px;
+ bottom: -3px;
+ z-index: 1;
+ }
+ }
+}
diff --git a/packages/client/src/schemas/form/DesignableBar.tsx b/packages/client/src/schemas/form/DesignableBar.tsx
index 4f3d7afc7..e054d28f6 100644
--- a/packages/client/src/schemas/form/DesignableBar.tsx
+++ b/packages/client/src/schemas/form/DesignableBar.tsx
@@ -26,14 +26,16 @@ import constate from 'constate';
import { useEffect } from 'react';
import { uid } from '@formily/shared';
import { getSchemaPath } from '../../components/schema-renderer';
-import { useCollection } from '../../constate';
+import { useCollection, useCollectionContext } from '../../constate';
+import { useTable } from '../table';
export const DesignableBar = observer((props) => {
const field = useField();
const { designable, schema, refresh, deepRemove } = useDesignable();
const [visible, setVisible] = useState(false);
const { dragRef } = useContext(DraggableBlockContext);
- const collectionName = field.componentProps.collectionName;
+ const { props: tableProps } = useTable();
+ const collectionName = field.componentProps?.collectionName || tableProps?.collectionName;
const { collection } = useCollection({ collectionName });
return (
@@ -44,7 +46,7 @@ export const DesignableBar = observer((props) => {
}}
className={cls('designable-bar-actions', { active: visible })}
>
-
+
{dragRef && }
{
},
});
const description = values.description || null;
- realField.description = description || collectionField?.uiSchema?.description;
+ realField.description =
+ description || collectionField?.uiSchema?.description;
schema['description'] = description;
await updateSchema({
key: schema['key'],
diff --git a/packages/client/src/schemas/table/index.tsx b/packages/client/src/schemas/table/index.tsx
index a1e2ffaab..9bbbd77d1 100644
--- a/packages/client/src/schemas/table/index.tsx
+++ b/packages/client/src/schemas/table/index.tsx
@@ -1612,9 +1612,11 @@ Table.Operation.Cell = observer((props: any) => {
});
Table.Operation.DesignableBar = (props) => {
- const { schema, remove, refresh, appendChild } = useDesignable(props.path);
+ const { designable, schema, remove, refresh, appendChild } = useDesignable(
+ props.path,
+ );
const [visible, setVisible] = useState(false);
- if (!schema?.parent?.parent['x-designable-bar']) {
+ if (!designable || !schema?.parent?.parent['x-designable-bar']) {
return null;
}
console.log('Table.Operation.DesignableBar', schema?.parent?.parent);
diff --git a/packages/client/src/schemas/tabs/index.tsx b/packages/client/src/schemas/tabs/index.tsx
index 8e10b65e9..5e85fbf6b 100644
--- a/packages/client/src/schemas/tabs/index.tsx
+++ b/packages/client/src/schemas/tabs/index.tsx
@@ -1,6 +1,6 @@
import { observer, connect, useField, RecursionField } from '@formily/react';
import React from 'react';
-import { Button, Tabs as AntdTabs, Dropdown, Menu, Switch } from 'antd';
+import { Button, Tabs as AntdTabs, Dropdown, Menu, Switch, Space } from 'antd';
import {
findPropertyByPath,
getSchemaPath,
@@ -104,7 +104,8 @@ export const Tabs: any = observer((props: any) => {
{...others}
className={cls({ singleton })}
tabBarExtraContent={
- designable && schema['x-designable-bar'] && (
+ designable &&
+ schema['x-designable-bar'] && (
}
@@ -218,36 +219,38 @@ Tabs.DesignableBar = () => {
}}
className={cls('designable-bar-actions', { active: visible })}
>
- {
- setVisible(visible);
- }}
- overlay={
-
- }
- >
-
-
+
+ {
+ setVisible(visible);
+ }}
+ overlay={
+
+ }
+ >
+
+
+
);
@@ -265,74 +268,76 @@ Tabs.TabPane.DesignableBar = () => {
}}
className={cls('designable-bar-actions', { active: visible })}
>
- {' '}
- {
- setVisible(visible);
- }}
- overlay={
-
+ }
+ >
+
+
+
);