mirror of
https://github.com/nocobase/nocobase
synced 2024-11-15 09:17:23 +00:00
fix(kanban): kanban data on a page should be isolated (#3232)
* fix: kanban block data on a page influences each other * test: kanban test
This commit is contained in:
parent
c2f3cfd6ce
commit
2808440426
@ -26,7 +26,7 @@ test.describe('configure params in gantt block', () => {
|
||||
await page.getByRole('spinbutton').fill('1');
|
||||
const [request] = await Promise.all([
|
||||
page.waitForRequest((request) => request.url().includes('api/general:list')),
|
||||
page.getByRole('button', { name: 'OK' }).click(),
|
||||
page.getByRole('button', { name: 'OK', exact: true }).click(),
|
||||
]);
|
||||
const requestUrl = request.url();
|
||||
const queryParams = new URLSearchParams(new URL(requestUrl).search);
|
||||
|
@ -53,7 +53,7 @@ export const toColumns = (groupField: any, dataSource: Array<any> = []) => {
|
||||
export const Kanban: any = observer(
|
||||
(props: any) => {
|
||||
const { styles } = useStyles();
|
||||
const { groupField, onCardDragEnd, ...restProps } = useProps(props);
|
||||
const { groupField, onCardDragEnd, dataSource, setDataSource, ...restProps } = useProps(props);
|
||||
const field = useField<ArrayField>();
|
||||
const fieldSchema = useFieldSchema();
|
||||
const [disableCardDrag, setDisableCardDrag] = useState(false);
|
||||
@ -77,11 +77,13 @@ export const Kanban: any = observer(
|
||||
const handleCardRemove = (card, column) => {
|
||||
const updatedBoard = Board.removeCard({ columns: field.value }, column, card);
|
||||
field.value = updatedBoard.columns;
|
||||
setDataSource(updatedBoard.columns);
|
||||
};
|
||||
const handleCardDragEnd = (card, fromColumn, toColumn) => {
|
||||
onCardDragEnd?.({ columns: field.value, groupField }, fromColumn, toColumn);
|
||||
const updatedBoard = Board.moveCard({ columns: field.value }, fromColumn, toColumn);
|
||||
field.value = updatedBoard.columns;
|
||||
setDataSource(updatedBoard.columns);
|
||||
};
|
||||
return (
|
||||
<Spin wrapperClassName={styles.nbKanban} spinning={field.loading || false}>
|
||||
@ -99,7 +101,7 @@ export const Kanban: any = observer(
|
||||
</div>
|
||||
)}
|
||||
renderCard={(card, { column, dragging }) => {
|
||||
const columnIndex = field.value?.indexOf(column);
|
||||
const columnIndex = dataSource?.indexOf(column);
|
||||
const cardIndex = column?.cards?.indexOf(card);
|
||||
return (
|
||||
schemas.card && (
|
||||
@ -136,7 +138,7 @@ export const Kanban: any = observer(
|
||||
}}
|
||||
>
|
||||
{{
|
||||
columns: field.value || [],
|
||||
columns: dataSource || [],
|
||||
}}
|
||||
</Board>
|
||||
</Spin>
|
||||
|
@ -2,7 +2,7 @@ import { ArrayField } from '@formily/core';
|
||||
import { Schema, useField, useFieldSchema } from '@formily/react';
|
||||
import { Spin } from 'antd';
|
||||
import uniq from 'lodash/uniq';
|
||||
import React, { createContext, useContext, useEffect } from 'react';
|
||||
import React, { createContext, useContext, useEffect, useState } from 'react';
|
||||
import {
|
||||
useACLRoleContext,
|
||||
useCollection,
|
||||
@ -135,15 +135,17 @@ const useDisableCardDrag = () => {
|
||||
export const useKanbanBlockProps = () => {
|
||||
const field = useField<ArrayField>();
|
||||
const ctx = useKanbanBlockContext();
|
||||
const [dataSource, setDataSource] = useState([]);
|
||||
useEffect(() => {
|
||||
if (!ctx?.service?.loading) {
|
||||
setTimeout(() => {
|
||||
field.value = toColumns(ctx.groupField, ctx?.service?.data?.data);
|
||||
});
|
||||
field.value = toColumns(ctx.groupField, ctx?.service?.data?.data);
|
||||
setDataSource(toColumns(ctx.groupField, ctx?.service?.data?.data));
|
||||
}
|
||||
// field.loading = ctx?.service?.loading;
|
||||
}, [ctx?.service?.loading]);
|
||||
return {
|
||||
setDataSource,
|
||||
dataSource,
|
||||
groupField: ctx.groupField,
|
||||
disableCardDrag: useDisableCardDrag(),
|
||||
async onCardDragEnd({ columns, groupField }, { fromColumnId, fromPosition }, { toColumnId, toPosition }) {
|
||||
|
@ -40,7 +40,7 @@ test.describe('configure setting', () => {
|
||||
await page.getByRole('spinbutton').fill('1');
|
||||
const [request] = await Promise.all([
|
||||
page.waitForRequest((request) => request.url().includes('api/general:list')),
|
||||
page.getByRole('button', { name: 'OK' }).click(),
|
||||
page.getByRole('button', { name: 'OK', exact: true }).click(),
|
||||
]);
|
||||
const requestUrl = request.url();
|
||||
const queryParams = new URLSearchParams(new URL(requestUrl).search);
|
||||
|
Loading…
Reference in New Issue
Block a user