#

vincentlu

2025-04-08 5831c3e1dabd8d29270c140dc75151b20f65d030

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
import { useEffect, useState } from 'react';
import { DragDropContext } from '@hello-pangea/dnd';
import { Box, LinearProgress } from '@mui/material';
import {
    useDataProvider,
    useListContext,
    useNotify,
    useRefresh,
    useTranslate,
} from 'react-admin';
import { MissionColumn } from './MissionColumn';
import request from '@/utils/request';
import { CUSTOM_PAGES_DATA_INTERVAL } from '@/config/setting';
 
export const MissionListContent = () => {
    const translate = useTranslate();
    const notify = useNotify();
    const refresh = useRefresh();
    const dataProvider = useDataProvider();
    const { data, isPending, refetch } = useListContext();
 
    const [stages, setStages] = useState([]);
 
    useEffect(() => {
        const httpStages = async () => {
            request.post('/mission/posType/list').then(res => {
                const { code, msg, data } = res.data;
                if (code === 200) {
                    setStages(data);
                } else {
                    notify(msg || 'common.response.fail', { type: 'error', messageArgs: { _: msg } });
                }
            }).catch(error => {
                notify(error.message || 'common.response.fail', { type: 'error', messageArgs: { _: error.message } });
            })
        }
        httpStages();
    }, [notify]);
 
    useEffect(() => {
        const intervalId = setInterval(() => {
            refetch();
        }, CUSTOM_PAGES_DATA_INTERVAL);
 
        return () => clearInterval(intervalId);
    }, [refetch])
 
    if (isPending) return <LinearProgress />;
 
    const onDragEnd = result => {
        const { destination, source } = result;
        if (!destination) {
            return;
        }
        const { droppableId: sourceStage, index: sourceIdx } = source;
        const { droppableId: destinationStage, index: destinationIdx } = destination;
 
        if (destinationStage === sourceStage
            && destinationIdx === sourceIdx) {
            return;
        }
    };
 
    return (
        <DragDropContext onDragEnd={onDragEnd}>
            <Box display="flex">
                {stages.map(stage => (
                    <MissionColumn
                        key={stage}
                        stage={stage}
                        missions={data.filter(item => item.posType === stage)}
                    />
                ))}
            </Box>
        </DragDropContext>
    );
};