mirror of
https://gitee.com/nocobase/nocobase.git
synced 2025-05-05 05:29:26 +08:00
fix: action panel icon missing when icon-only is enabled (#6773)
This commit is contained in:
parent
757765228f
commit
cf57be8fb4
@ -42,31 +42,35 @@ const useStyles = createStyles(({ token, css }) => ({
|
||||
`,
|
||||
}));
|
||||
|
||||
function Button() {
|
||||
function Button({ onlyIcon }) {
|
||||
const fieldSchema = useFieldSchema();
|
||||
const icon = fieldSchema['x-component-props']?.['icon'];
|
||||
const backgroundColor = fieldSchema['x-component-props']?.['iconColor'];
|
||||
const { icon, iconColor: backgroundColor } = fieldSchema['x-component-props'] || {};
|
||||
const { layout, ellipsis = true } = useContext(WorkbenchBlockContext);
|
||||
const { styles, cx } = useStyles();
|
||||
const { t } = useTranslation();
|
||||
const title = t(fieldSchema.title, { ns: NAMESPACE_UI_SCHEMA });
|
||||
return layout === WorkbenchLayout.Grid ? (
|
||||
<div title={title} className={cx(styles.avatar)}>
|
||||
<Avatar style={{ backgroundColor }} size={48} icon={<Icon type={icon} />} />
|
||||
<div
|
||||
className={cx(styles.title)}
|
||||
style={{
|
||||
whiteSpace: ellipsis ? 'nowrap' : 'normal',
|
||||
textOverflow: ellipsis ? 'ellipsis' : 'clip',
|
||||
overflow: ellipsis ? 'hidden' : 'visible',
|
||||
}}
|
||||
>
|
||||
{title}
|
||||
|
||||
const shouldShowTitle = !onlyIcon;
|
||||
|
||||
if (layout === WorkbenchLayout.Grid) {
|
||||
return (
|
||||
<div title={title} className={cx(styles.avatar)}>
|
||||
<Avatar style={{ backgroundColor }} size={48} icon={<Icon type={icon} />} />
|
||||
<div
|
||||
className={cx(styles.title)}
|
||||
style={{
|
||||
whiteSpace: ellipsis ? 'nowrap' : 'normal',
|
||||
textOverflow: ellipsis ? 'ellipsis' : 'clip',
|
||||
overflow: ellipsis ? 'hidden' : 'visible',
|
||||
}}
|
||||
>
|
||||
{shouldShowTitle && title}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
<span>{title}</span>
|
||||
);
|
||||
);
|
||||
}
|
||||
|
||||
return <span>{shouldShowTitle && title}</span>;
|
||||
}
|
||||
|
||||
export const WorkbenchAction = withDynamicSchemaProps((props) => {
|
||||
@ -79,9 +83,10 @@ export const WorkbenchAction = withDynamicSchemaProps((props) => {
|
||||
<Component
|
||||
className={cx(className, styles.action, 'nb-action-panel')}
|
||||
{...others}
|
||||
onlyIcon={false}
|
||||
type="text"
|
||||
icon={null}
|
||||
title={<Button />}
|
||||
title={<Button onlyIcon={others?.onlyIcon} />}
|
||||
confirmTitle={fieldSchema.title}
|
||||
style={{ display: 'flex', alignItems: 'center', justifyContent: 'center' }}
|
||||
/>
|
||||
|
@ -85,6 +85,7 @@ const InternalIcons = () => {
|
||||
key={key}
|
||||
prefix={<Avatar style={{ backgroundColor }} icon={<Icon type={icon} />} />}
|
||||
onClick={() => {}}
|
||||
style={{ marginTop: '5px' }}
|
||||
>
|
||||
<NocoBaseRecursionField name={key} schema={s} />
|
||||
</List.Item>
|
||||
|
Loading…
x
Reference in New Issue
Block a user