diff --git a/packages/plugins/@nocobase/plugin-block-workbench/src/client/WorkbenchAction.tsx b/packages/plugins/@nocobase/plugin-block-workbench/src/client/WorkbenchAction.tsx index f549e6fead..e4a2f4434b 100644 --- a/packages/plugins/@nocobase/plugin-block-workbench/src/client/WorkbenchAction.tsx +++ b/packages/plugins/@nocobase/plugin-block-workbench/src/client/WorkbenchAction.tsx @@ -31,9 +31,6 @@ const useStyles = createStyles(({ token, css }) => ({ title: css` margin-top: ${token.marginSM}px; width: 100%; - white-space: nowrap; - text-overflow: ellipsis; - overflow: hidden; `, })); @@ -41,14 +38,23 @@ function Button() { const fieldSchema = useFieldSchema(); const icon = fieldSchema['x-component-props']?.['icon']; const backgroundColor = fieldSchema['x-component-props']?.['iconColor']; - const { layout } = useContext(WorkbenchBlockContext); + const { layout, ellipsis = true } = useContext(WorkbenchBlockContext); const { styles, cx } = useStyles(); const compile = useCompile(); const title = compile(fieldSchema.title); return layout === WorkbenchLayout.Grid ? (
} /> -
{title}
+
+ {title} +
) : ( {title} diff --git a/packages/plugins/@nocobase/plugin-block-workbench/src/client/WorkbenchBlock.tsx b/packages/plugins/@nocobase/plugin-block-workbench/src/client/WorkbenchBlock.tsx index baa6054440..e09db30b53 100644 --- a/packages/plugins/@nocobase/plugin-block-workbench/src/client/WorkbenchBlock.tsx +++ b/packages/plugins/@nocobase/plugin-block-workbench/src/client/WorkbenchBlock.tsx @@ -101,7 +101,7 @@ const InternalIcons = () => { ); }; -export const WorkbenchBlockContext = createContext({ layout: 'grid' }); +export const WorkbenchBlockContext = createContext({ layout: 'grid', ellipsis: true }); const useStyles = createStyles(({ token, css }) => ({ containerClass: css` @@ -142,7 +142,7 @@ const useStyles = createStyles(({ token, css }) => ({ export const WorkbenchBlock: any = withDynamicSchemaProps( (props) => { const fieldSchema = useFieldSchema(); - const { layout = 'grid' } = fieldSchema['x-component-props'] || {}; + const { layout = 'grid', ellipsis } = fieldSchema['x-component-props'] || {}; const { styles } = useStyles(); const { title } = fieldSchema['x-decorator-props'] || {}; const targetHeight = useBlockHeight(); @@ -171,7 +171,7 @@ export const WorkbenchBlock: any = withDynamicSchemaProps( return (
- + {props.children} diff --git a/packages/plugins/@nocobase/plugin-block-workbench/src/client/workbenchBlockSettings.tsx b/packages/plugins/@nocobase/plugin-block-workbench/src/client/workbenchBlockSettings.tsx index 887fe00fe9..cbd5fda054 100644 --- a/packages/plugins/@nocobase/plugin-block-workbench/src/client/workbenchBlockSettings.tsx +++ b/packages/plugins/@nocobase/plugin-block-workbench/src/client/workbenchBlockSettings.tsx @@ -14,6 +14,7 @@ import { SchemaSettingsBlockHeightItem, SchemaSettingsModalItem, useOpenModeContext, + SchemaSettingsItemType, } from '@nocobase/client'; import { CustomSchemaSettingsBlockTitleItem } from './SchemaSettingsBlockTitleItem'; import React from 'react'; @@ -55,6 +56,32 @@ const ActionPanelLayout = () => { ); }; +export const ellipsisSettingsItem: SchemaSettingsItemType = { + name: 'ellipsis', + type: 'switch', + useComponentProps() { + const fieldSchema = useFieldSchema(); + const { dn } = useDesignable(); + const { t } = useTranslation(); + return { + title: t('Ellipsis action title', { ns: 'block-workbench' }), + checked: fieldSchema['x-component-props']?.ellipsis !== false, + onChange: async (checked) => { + fieldSchema['x-component-props'] = fieldSchema['x-component-props'] || {}; + fieldSchema['x-component-props']['ellipsis'] = checked; + await dn.emit('patch', { + schema: { + 'x-uid': fieldSchema['x-uid'], + 'x-component-props': { + ...fieldSchema['x-component-props'], + ellipsis: checked, + }, + }, + }); + }, + }; + }, +}; export function ActionPanelItemsPerRow() { const field = useField(); const fieldSchema = useFieldSchema(); @@ -122,6 +149,7 @@ export const workbenchBlockSettings = new SchemaSettings({ return isMobile && fieldSchema?.['x-component-props']?.layout !== WorkbenchLayout.List; }, }, + ellipsisSettingsItem, { type: 'remove', name: 'remove', diff --git a/packages/plugins/@nocobase/plugin-block-workbench/src/locale/zh-CN.json b/packages/plugins/@nocobase/plugin-block-workbench/src/locale/zh-CN.json index d827616d7f..8d2edfb35f 100644 --- a/packages/plugins/@nocobase/plugin-block-workbench/src/locale/zh-CN.json +++ b/packages/plugins/@nocobase/plugin-block-workbench/src/locale/zh-CN.json @@ -13,5 +13,6 @@ "Add popup": "添加弹窗", "Add custom request": "添加自定义请求", "At least 1, up to 6": "最多6个,最少一个", - "Items per row":"每行显示个数" + "Items per row": "每行显示个数", + "Ellipsis action title": "省略超出长度的操作标题" }