diff --git a/packages/client/src/schemas/kanban/index.tsx b/packages/client/src/schemas/kanban/index.tsx
index 89c8056a49..5f8fa42b31 100644
--- a/packages/client/src/schemas/kanban/index.tsx
+++ b/packages/client/src/schemas/kanban/index.tsx
@@ -6,7 +6,16 @@ import {
useField,
useForm,
} from '@formily/react';
-import { DndContext, DragOverlay, closestCorners } from '@dnd-kit/core';
+import {
+ DndContext,
+ DragOverlay,
+ closestCorners,
+ rectIntersection,
+ closestCenter,
+ useSensors,
+ useSensor,
+ MouseSensor,
+} from '@dnd-kit/core';
import {
SortableContext,
rectSortingStrategy,
@@ -48,6 +57,7 @@ export function SortableItem(props) {
transition,
} = useSortable({
id: props.id,
+ disabled: props.disabled,
data: {
type: props.type,
nodeRef,
@@ -70,6 +80,7 @@ export function SortableItem(props) {
{...attributes}
{...listeners}
>
+ {/*
drag
*/}
{props.children}
);
@@ -110,6 +121,22 @@ export const useKanban = () => {
return useContext(KanbanContext);
};
+class MyMouseSensor extends MouseSensor {
+ static activators = [
+ {
+ eventName: 'onMouseDown' as const,
+ handler: (event) => {
+ if (event.target.tagName === 'DIV') {
+ return true;
+ }
+ console.log('event.target.tagName', event.target.tagName);
+ event.target;
+ return false;
+ },
+ },
+ ];
+}
+
const InternalKanban = observer((props: any) => {
const field = useField();
const groupName = field.componentProps.groupName;
@@ -163,7 +190,8 @@ const InternalKanban = observer((props: any) => {
const [dragOverlayContent, setDragOverlayContent] = useState('');
const [style, setStyle] = useState({});
const containerRef = useRef();
- console.log({ style })
+ console.log({ style });
+ const sensors = useSensors(useSensor(MyMouseSensor));
return (
@@ -173,14 +201,18 @@ const InternalKanban = observer((props: any) => {
{
const el = event?.active?.data?.current?.nodeRef
?.current as HTMLElement;
console.log(event, el);
setDragOverlayContent(el?.outerHTML);
- setStyle({ width: el.clientWidth, height: containerRef.current?.clientHeight });
+ setStyle({
+ width: el.clientWidth,
+ height: containerRef.current?.clientHeight,
+ });
}}
- // collisionDetection={closestCorners}
+ collisionDetection={closestCenter}
onDragEnd={({ active, over }) => {
const source = values.find((item) => item.id === active?.id);
const target = values.find((item) => item.id === over?.id);
@@ -225,7 +257,8 @@ const InternalKanban = observer((props: any) => {
}}
>
{
id={column.value}
key={column.value}
type={'column'}
+ disabled
className={'column'}
>
@@ -269,6 +303,7 @@ const InternalKanban = observer((props: any) => {
key={item.id}
className={'item'}
id={item.id}
+ // disabled
type={'item'}
>
{
name={addCardSchema?.name}
schema={addCardSchema}
/>
- {/* }
- onClick={() => {
- field.push({
- id: uid(),
- title: uid(),
- [groupName]: column.value,
- });
- }}
- >
- 添加卡片
- */}
))}
-