fix: table row button drag-and-drop issue (#6544)

* fix: table row button drag-and-drop issue

* fix: bug

* fix: bug
This commit is contained in:
Katherine 2025-03-24 22:01:09 +08:00 committed by GitHub
parent c2f97a9300
commit 7f1ede84d9
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 25 additions and 16 deletions

View File

@ -16,16 +16,19 @@ import Action from './Action';
import { ComposedAction } from './types';
import { Icon } from '../../../icon';
const WrapperComponent = ({ component: Component = 'a', icon, onlyIcon, children, ...restProps }: any) => {
return (
<Component {...restProps}>
<Tooltip title={restProps.title}>
<span style={{ marginRight: 3 }}>{icon && typeof icon === 'string' ? <Icon type={icon} /> : icon}</span>
</Tooltip>
{onlyIcon ? children[1] : children}
</Component>
);
};
const WrapperComponent = React.forwardRef(
({ component: Component = 'a', icon, onlyIcon, children, ...restProps }: any, ref) => {
return (
<Component ref={ref} {...restProps}>
<Tooltip title={restProps.title}>
<span style={{ marginRight: 3 }}>{icon && typeof icon === 'string' ? <Icon type={icon} /> : icon}</span>
</Tooltip>
{onlyIcon ? children[1] : children}
</Component>
);
},
);
WrapperComponent.displayName = 'WrapperComponentLink';
export const ActionLink: ComposedAction = withDynamicSchemaProps(
observer((props: any) => {

View File

@ -45,9 +45,9 @@ export const Sortable = (props: any) => {
const { draggable, droppable } = useContext(SortableContext);
const { isOver, setNodeRef } = droppable;
const droppableStyle = { ...style };
const isLinkComponent = component === 'a' || component?.displayName === 'WrapperComponentLink';
if (isOver && draggable?.active?.id !== droppable?.over?.id) {
droppableStyle[component === 'a' ? 'color' : 'background'] = getComputedColor(token.colorSettings);
droppableStyle[isLinkComponent ? 'color' : 'background'] = getComputedColor(token.colorSettings);
Object.assign(droppableStyle, overStyle);
}
@ -118,7 +118,6 @@ export const SortableItem: React.FC<SortableItemProps> = React.memo((props) => {
if (designable) {
return <InternalSortableItem {...props} />;
}
return React.createElement(
component || 'div',
_.omit(others, ['children', 'schema', 'overStyle', 'openMode', 'id', 'eid', 'removeParentsIfNoChildren']),

View File

@ -1,10 +1,18 @@
/**
* This file is part of the NocoBase (R) project.
* Copyright (c) 2020-2024 NocoBase Co., Ltd.
* Authors: NocoBase Team.
*
* This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
* For more information, please refer to: https://www.nocobase.com/agreement.
*/
import { css } from '@emotion/css';
import { ISchema, useFieldSchema } from '@formily/react';
import { Action, ActionContextProvider, SchemaComponent, useCompile } from '@nocobase/client';
import React, { useState } from 'react';
import { NAMESPACE } from './constants';
import { useTranslation } from 'react-i18next';
import { UploadOutlined } from '@ant-design/icons';
const importFormSchema: ISchema = {
type: 'void',
@ -113,7 +121,6 @@ const importFormSchema: ISchema = {
export const ImportAction = (props) => {
const [visible, setVisible] = useState(false);
const { t } = useTranslation(NAMESPACE);
const compile = useCompile();
const fieldSchema = useFieldSchema();
@ -121,7 +128,7 @@ export const ImportAction = (props) => {
return (
<ActionContextProvider value={{ visible, setVisible, fieldSchema }}>
<Action
icon={props.icon || <UploadOutlined />}
icon={props.icon || 'uploadoutlined'}
title={compile(fieldSchema?.title || "t('Import')")}
{...props}
onClick={() => setVisible(true)}