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, 
 | 
    useNotify, 
 | 
    useListContext, 
 | 
    FunctionField, 
 | 
    TextField, 
 | 
    NumberField, 
 | 
    DateField, 
 | 
    BooleanField, 
 | 
    ReferenceField, 
 | 
    TextInput, 
 | 
    DateTimeInput, 
 | 
    DateInput, 
 | 
    SelectInput, 
 | 
    NumberInput, 
 | 
    ReferenceInput, 
 | 
    ReferenceArrayInput, 
 | 
    AutocompleteInput, 
 | 
    DeleteButton, 
 | 
} from 'react-admin'; 
 | 
import { Box, Typography, Card, Stack } from '@mui/material'; 
 | 
import { styled } from '@mui/material/styles'; 
 | 
import DictTypeCreate from "./DictTypeCreate"; 
 | 
import EmptyData from "../../../components/EmptyData"; 
 | 
import MyCreateButton from "../../../components/MyCreateButton"; 
 | 
import MyExportButton from '../../../components/MyExportButton'; 
 | 
import { PAGE_DRAWER_WIDTH, OPERATE_MODE, DEFAULT_PAGE_SIZE } from '@/config/setting'; 
 | 
import { width } from "@mui/system"; 
 | 
  
 | 
const StyledDatagrid = styled(DatagridConfigurable)(({ theme }) => ({ 
 | 
    '& .css-1vooibu-MuiSvgIcon-root': { 
 | 
        height: '.9em' 
 | 
    }, 
 | 
    '& .RaDatagrid-row': { 
 | 
        cursor: 'auto' 
 | 
    }, 
 | 
    '& .column-name': { 
 | 
    }, 
 | 
    '& .opt': { 
 | 
        width: 200 
 | 
    }, 
 | 
     
 | 
    '& .MuiTableCell-root': { 
 | 
    whiteSpace: 'nowrap', 
 | 
    overflow: 'visible', 
 | 
    textOverflow: 'unset' 
 | 
  }, 
 | 
  '& .column-description': { 
 | 
        maxWidth: '25em', 
 | 
        overflow: 'hidden', 
 | 
        textOverflow: 'ellipsis', 
 | 
        whiteSpace: 'nowrap', 
 | 
    }, 
 | 
})); 
 | 
  
 | 
const filters = [ 
 | 
    <SearchInput source="condition" alwaysOn />, 
 | 
    <DateInput label='common.time.after' source="timeStart" alwaysOn />, 
 | 
    <DateInput label='common.time.before' source="timeEnd" alwaysOn />, 
 | 
    <TextInput source="code" label="table.field.dictType.code" />, 
 | 
    <TextInput source="name" label="table.field.dictType.name" />, 
 | 
    <TextInput source="description" label="table.field.dictType.description" />, 
 | 
    <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' }, 
 | 
        ]} 
 | 
        resettable 
 | 
    />, 
 | 
] 
 | 
  
 | 
const DictTypeList = () => { 
 | 
    const translate = useTranslate(); 
 | 
    const [createDialog, setCreateDialog] = useState(false); 
 | 
    const [drawerVal, setDrawerVal] = useState(false); 
 | 
    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.dictType"} 
 | 
                empty={<EmptyData onClick={() => { setCreateDialog(true) }} />} 
 | 
                filters={filters} 
 | 
                sort={{ field: "create_time", order: "desc" }} 
 | 
                actions={( 
 | 
                    <TopToolbar> 
 | 
                        <FilterButton /> 
 | 
                        <MyCreateButton onClick={() => { setCreateDialog(true) }} /> 
 | 
                        <SelectColumnsButton preferenceKey='dictType' /> 
 | 
                        <MyExportButton /> 
 | 
                    </TopToolbar> 
 | 
                )} 
 | 
                perPage={DEFAULT_PAGE_SIZE} 
 | 
            > 
 | 
                <StyledDatagrid 
 | 
                    preferenceKey='dictType' 
 | 
                    bulkActionButtons={() => <BulkDeleteButton mutationMode={OPERATE_MODE} />} 
 | 
                    rowClick={'edit'} 
 | 
                    omit={['id', 'createTime', 'createBy$', 'memo','statusBool']} 
 | 
                > 
 | 
                    <NumberField source="id" /> 
 | 
                    <TextField source="code" label="table.field.dictType.code" 
 | 
                        // onClick={(event, record, val) => { 
 | 
                        //     event.stopPropagation(); 
 | 
                        //     assign(record); 
 | 
                        // }} 
 | 
                    /> 
 | 
                    <TextField source="name" label="table.field.dictType.name" /> 
 | 
                    <TextField source="description" label="table.field.dictType.description" /> 
 | 
                    <TextField source="updateBy$" label="common.field.updateBy" /> 
 | 
                    <DateField source="updateTime" label="common.field.updateTime" showTime /> 
 | 
                    <TextField source="createBy$" label="common.field.createBy" /> 
 | 
                    <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} /> 
 | 
                    <WrapperField cellClassName="opt" label="common.field.opt"> 
 | 
                        <EditButton sx={{ padding: '1px', fontSize: '.75rem' }} /> 
 | 
                        <DeleteButton sx={{ padding: '1px', fontSize: '.75rem' }} mutationMode={OPERATE_MODE} /> 
 | 
                    </WrapperField> 
 | 
                </StyledDatagrid> 
 | 
            </List> 
 | 
            <DictTypeCreate 
 | 
                open={createDialog} 
 | 
                setOpen={setCreateDialog} 
 | 
            /> 
 | 
        </Box> 
 | 
    ) 
 | 
} 
 | 
  
 | 
export default DictTypeList; 
 |