import React, { useState, useRef, useEffect, useMemo, useCallback } from "react"; 
 | 
import { useNavigate } from 'react-router-dom'; 
 | 
import { 
 | 
    List, 
 | 
    DatagridConfigurable, 
 | 
    SearchInput, 
 | 
    TopToolbar, 
 | 
    SelectColumnsButton, 
 | 
    EditButton, 
 | 
    FilterButton, 
 | 
    CreateButton, 
 | 
    ExportButton, 
 | 
    BulkDeleteButton, 
 | 
    WrapperField, 
 | 
    useRecordContext, 
 | 
    useTranslate, 
 | 
    useListContext, 
 | 
    useCreatePath, 
 | 
    TextField, 
 | 
    NumberField, 
 | 
    DateField, 
 | 
    BooleanField, 
 | 
    ReferenceField, 
 | 
    TextInput, 
 | 
    DateTimeInput, 
 | 
    DateInput, 
 | 
    SelectInput, 
 | 
    NumberInput, 
 | 
    ReferenceInput, 
 | 
    ReferenceArrayInput, 
 | 
    AutocompleteInput, 
 | 
    DeleteButton, 
 | 
    FunctionField, 
 | 
    Pagination, 
 | 
    useNotify, 
 | 
    useRefresh, 
 | 
} from 'react-admin'; 
 | 
import { Box, Typography, Button, Chip } from '@mui/material'; 
 | 
import { styled } from '@mui/material/styles'; 
 | 
import BusCreate from "./BusCreate"; 
 | 
import BusPanel from "./BusPanel"; 
 | 
import EmptyData from "../components/EmptyData"; 
 | 
import MyCreateButton from "../components/MyCreateButton"; 
 | 
import MyExportButton from '../components/MyExportButton'; 
 | 
import PageDrawer from "../components/PageDrawer"; 
 | 
import MyField from "../components/MyField"; 
 | 
import { PAGE_DRAWER_WIDTH, OPERATE_MODE, DEFAULT_PAGE_SIZE } from '@/config/setting'; 
 | 
import * as Common from '@/utils/common'; 
 | 
import BusListAside from "./BusListAside"; 
 | 
import { getBusStsColor } from '@/utils/color-util'; 
 | 
import CancelIcon from '@mui/icons-material/Cancel'; 
 | 
import request from '@/utils/request'; 
 | 
import ConfirmButton from "../components/ConfirmButton"; 
 | 
  
 | 
const StyledDatagrid = styled(DatagridConfigurable)(({ theme }) => ({ 
 | 
    '& .css-1vooibu-MuiSvgIcon-root': { 
 | 
        height: '.9em' 
 | 
    }, 
 | 
    '& .RaDatagrid-row': { 
 | 
        cursor: 'auto' 
 | 
    }, 
 | 
    '& .column-busNo': { 
 | 
        minWidth: '16em', 
 | 
    }, 
 | 
    '& .column-tasksNum': { 
 | 
        maxWidth: '8em', 
 | 
    }, 
 | 
    '& .column-tasksNumTotal': { 
 | 
        maxWidth: '8em', 
 | 
    }, 
 | 
    '& .column-memo': { 
 | 
        maxWidth: '12em', 
 | 
        overflow: 'hidden', 
 | 
        textOverflow: 'ellipsis', 
 | 
        whiteSpace: 'nowrap', 
 | 
    }, 
 | 
    '& .opt': { 
 | 
        width: 120 
 | 
    }, 
 | 
})); 
 | 
  
 | 
const filters = [ 
 | 
    // <SearchInput source="condition" alwaysOn />, 
 | 
    <TextInput source="busNo" label="table.field.bus.busNo" alwaysOn resettable />, 
 | 
    // <DateInput source="startTime" label="table.field.bus.startTime" />, 
 | 
    // <DateInput source="endTime" label="table.field.bus.endTime" />, 
 | 
    <ReferenceInput source="busSts" label="table.field.bus.busSts" reference="busSts" alwaysOn> 
 | 
        <AutocompleteInput label="table.field.bus.busSts" optionText="name" filterToQuery={(val) => ({ name: val })} /> 
 | 
    </ReferenceInput>, 
 | 
    <DateInput label='common.time.after' source="timeStart" alwaysOn />, 
 | 
    <DateInput label='common.time.before' source="timeEnd" alwaysOn />, 
 | 
    <TextInput label="common.field.memo" source="memo" />, 
 | 
    <SelectInput 
 | 
        label="common.field.status" 
 | 
        source="status" 
 | 
        choices={[ 
 | 
            { id: '1', name: 'common.enums.statusTrue' }, 
 | 
            { id: '0', name: 'common.enums.statusFalse' }, 
 | 
        ]} 
 | 
    />, 
 | 
] 
 | 
  
 | 
const BusList = () => { 
 | 
    const translate = useTranslate(); 
 | 
    const notify = useNotify(); 
 | 
    const refresh = useRefresh(); 
 | 
    const [createDialog, setCreateDialog] = useState(false); 
 | 
    const [drawerVal, setDrawerVal] = useState(false); 
 | 
  
 | 
    const onCancel = (busId) => { 
 | 
        request.get("/bus/cancel/" + busId).then(res => { 
 | 
            const { code, msg, data } = res.data; 
 | 
            if (code === 200) { 
 | 
                notify(msg || 'common.response.success', { type: 'success', messageArgs: { _: msg } }); 
 | 
                refresh(); 
 | 
            } else { 
 | 
                notify(msg || 'common.response.fail', { type: 'error', messageArgs: { _: msg } }); 
 | 
            } 
 | 
        }) 
 | 
    } 
 | 
  
 | 
    return ( 
 | 
        <Box display="flex"> 
 | 
            <List 
 | 
                sx={{ 
 | 
                    flexGrow: 1, 
 | 
                    transition: (theme) => 
 | 
                        theme.transitions.create(['all'], { 
 | 
                            duration: theme.transitions.duration.enteringScreen, 
 | 
                        }), 
 | 
                    marginRight: !!drawerVal ? `${PAGE_DRAWER_WIDTH}px` : 0, 
 | 
                }} 
 | 
                title={"menu.bus"} 
 | 
                empty={<EmptyData onClick={() => { setCreateDialog(true) }} />} 
 | 
                filters={filters} 
 | 
                sort={{ field: "create_time", order: "desc" }} 
 | 
                actions={( 
 | 
                    <TopToolbar> 
 | 
                        <FilterButton /> 
 | 
                        <MyCreateButton onClick={() => { setCreateDialog(true) }} /> 
 | 
                        <SelectColumnsButton preferenceKey='bus' /> 
 | 
                        <MyExportButton /> 
 | 
                    </TopToolbar> 
 | 
                )} 
 | 
                pagination={<Pagination rowsPerPageOptions={[10, 20, 50, 100]} />} 
 | 
                perPage={20} 
 | 
            // aside={<BusListAside />} 
 | 
            > 
 | 
                <StyledDatagrid 
 | 
                    preferenceKey='bus' 
 | 
                    bulkActionButtons={false} 
 | 
                    rowClick={'expand'} 
 | 
                    expand={() => <BusPanel />} 
 | 
                    expandSingle={true} 
 | 
                    omit={['id', 'uuid', 'phase', 'updateBy', 'updateTime', 'createTime', 'createBy']} 
 | 
                > 
 | 
                    <NumberField source="id" /> 
 | 
                    <TextField source="uuid" label="table.field.bus.uuid" /> 
 | 
                    <TextField source="busNo" label="table.field.bus.busNo" /> 
 | 
                    <ReferenceField source="busSts" label="table.field.bus.busSts" reference="busSts" link={false} sortable={true}> 
 | 
                        <FunctionField render={record => ( 
 | 
                            <Chip 
 | 
                                label={record.name} 
 | 
                                variant="outlined" 
 | 
                                size="small" 
 | 
                                color={getBusStsColor(record.name)} 
 | 
                                sx={{ fontSize: '0.75rem' }} 
 | 
                            /> 
 | 
                        )} /> 
 | 
                        {/* <TextField source="name" /> */} 
 | 
                    </ReferenceField> 
 | 
                    <NumberField source="tasksNum" label="table.field.bus.tasksNum" sortable={false} sx={{ fontWeight: 'bold' }} /> 
 | 
                    <NumberField source="tasksNumTotal" label="table.field.bus.tasksNumTotal" sortable={false} sx={{ fontWeight: 'bold' }} /> 
 | 
                    <DateField source="startTime" label="table.field.bus.startTime" showTime /> 
 | 
                    <DateField source="endTime" label="table.field.bus.endTime" showTime emptyText="-" /> 
 | 
                    <TextField source="phase" label="table.field.bus.phase" sortable={false} /> 
 | 
  
 | 
                    <ReferenceField source="updateBy" label="common.field.updateBy" reference="user" link={false} sortable={false}> 
 | 
                        <TextField source="nickname" /> 
 | 
                    </ReferenceField> 
 | 
                    <DateField source="updateTime" label="common.field.updateTime" showTime /> 
 | 
                    <ReferenceField source="createBy" label="common.field.createBy" reference="user" link={false} sortable={false}> 
 | 
                        <TextField source="nickname" /> 
 | 
                    </ReferenceField> 
 | 
                    <DateField source="createTime" label="common.field.createTime" showTime /> 
 | 
                    {/* <BooleanField source="statusBool" label="common.field.status" sortable={false} /> */} 
 | 
                    <TextField source="memo" label="common.field.memo" sortable={false} emptyText="-" /> 
 | 
                    <FunctionField label="common.field.opt" cellClassName="opt" render={record => ( 
 | 
                        (record.busSts === 15) && ( 
 | 
                            <ConfirmButton 
 | 
                                label="ra.action.cancel" 
 | 
                                size="small" 
 | 
                                color="error" 
 | 
                                startIcon={<CancelIcon />} 
 | 
                                sx={{ padding: '1px', fontSize: '.75rem' }} 
 | 
                                data={record.busNo} 
 | 
                                onConfirm={() => { 
 | 
                                    onCancel(record.id); 
 | 
                                }} 
 | 
                            /> 
 | 
                        ) 
 | 
                    )} /> 
 | 
                </StyledDatagrid> 
 | 
            </List> 
 | 
            <BusCreate 
 | 
                open={createDialog} 
 | 
                setOpen={setCreateDialog} 
 | 
            /> 
 | 
            <PageDrawer 
 | 
                title='Bus Detail' 
 | 
                drawerVal={drawerVal} 
 | 
                setDrawerVal={setDrawerVal} 
 | 
            > 
 | 
            </PageDrawer> 
 | 
        </Box> 
 | 
    ) 
 | 
} 
 | 
  
 | 
export default BusList; 
 |