|  |  | 
 |  |  |     ReferenceArrayInput, | 
 |  |  |     AutocompleteInput, | 
 |  |  |     DeleteButton, | 
 |  |  |     FunctionField, | 
 |  |  | } from 'react-admin'; | 
 |  |  | import { Box, Typography, Card, Stack } from '@mui/material'; | 
 |  |  | import { styled } from '@mui/material/styles'; | 
 |  |  | 
 |  |  | import MyExportButton from '../components/MyExportButton'; | 
 |  |  | import PageDrawer from "../components/PageDrawer"; | 
 |  |  | import MyField from "../components/MyField"; | 
 |  |  | import { PAGE_DRAWER_WIDTH, OPERATE_MODE } from '@/config/setting'; | 
 |  |  | import { PAGE_DRAWER_WIDTH, OPERATE_MODE, DEFAULT_PAGE_SIZE } from '@/config/setting'; | 
 |  |  | import * as Common from '@/utils/common'; | 
 |  |  | import ImportButton from '../components/ImportButton' | 
 |  |  | import { useRouteImport } from './useRouteImport'; | 
 |  |  |  | 
 |  |  | import * as importTemp from './importTemp.csv?raw'; | 
 |  |  | const IMPORT_TEMP_URL = `data:text/csv;name=crm_contacts_sample.csv;charset=utf-8,${encodeURIComponent(importTemp.default)}`; | 
 |  |  |  | 
 |  |  | const StyledDatagrid = styled(DatagridConfigurable)(({ theme }) => ({ | 
 |  |  |     '& .css-1vooibu-MuiSvgIcon-root': { | 
 |  |  | 
 |  |  |  | 
 |  |  |     <TextInput source="uuid" label="table.field.route.uuid" />, | 
 |  |  |     <TextInput source="name" label="table.field.route.name" />, | 
 |  |  |     <ReferenceInput source="startCode" label="table.field.route.startCode" reference="code"> | 
 |  |  |     <ReferenceInput source="startCode" label="table.field.route.startCode" reference="code" alwaysOn> | 
 |  |  |         <AutocompleteInput label="table.field.route.startCode" optionText="data" filterToQuery={(val) => ({ data: val })} /> | 
 |  |  |     </ReferenceInput>, | 
 |  |  |     <ReferenceInput source="endCode" label="table.field.route.endCode" reference="code"> | 
 |  |  |     <ReferenceInput source="endCode" label="table.field.route.endCode" reference="code" alwaysOn> | 
 |  |  |         <AutocompleteInput label="table.field.route.endCode" optionText="data" filterToQuery={(val) => ({ data: val })} /> | 
 |  |  |     </ReferenceInput>, | 
 |  |  |     <TextInput source="codeArr" label="table.field.route.codeArr" />, | 
 |  |  |     <TextInput source="codeDataArr" label="table.field.route.codeDataArr" />, | 
 |  |  |     <SelectInput source="direction" label="table.field.route.direction" | 
 |  |  |         choices={[ | 
 |  |  |             { id: 0, name: '无序' }, | 
 |  |  |             { id: 1, name: '正向' }, | 
 |  |  |             { id: 2, name: '反向' }, | 
 |  |  |             { id: 0, name: 'page.route.enums.direction.unordered' }, | 
 |  |  |             { id: 1, name: 'page.route.enums.direction.forward' }, | 
 |  |  |             { id: 2, name: 'page.route.enums.direction.reverse' }, | 
 |  |  |         ]} | 
 |  |  |         alwaysOn | 
 |  |  |     />, | 
 |  |  |  | 
 |  |  |     <TextInput label="common.field.memo" source="memo" />, | 
 |  |  | 
 |  |  |                         <FilterButton /> | 
 |  |  |                         <MyCreateButton onClick={() => { setCreateDialog(true) }} /> | 
 |  |  |                         <SelectColumnsButton preferenceKey='route' /> | 
 |  |  |                         <ImportButton importTemp={IMPORT_TEMP_URL} useCodeImport={useRouteImport} onceBatch={10} /> | 
 |  |  |                         <MyExportButton /> | 
 |  |  |                     </TopToolbar> | 
 |  |  |                 )} | 
 |  |  |                 perPage={25} | 
 |  |  |                 perPage={DEFAULT_PAGE_SIZE} | 
 |  |  |             > | 
 |  |  |                 <StyledDatagrid | 
 |  |  |                     preferenceKey='route' | 
 |  |  | 
 |  |  |                     </ReferenceField> | 
 |  |  |                     <TextField source="codeArr" label="table.field.route.codeArr" /> | 
 |  |  |                     <TextField source="codeDataArr" label="table.field.route.codeDataArr" /> | 
 |  |  |                     <TextField source="direction$" label="table.field.route.direction" sortable={false} /> | 
 |  |  |  | 
 |  |  |                     <FunctionField | 
 |  |  |                         label="table.field.route.direction" | 
 |  |  |                         sortable={false} | 
 |  |  |                         render={(record) => { | 
 |  |  |                             switch (record.direction) { | 
 |  |  |                                 case 0: | 
 |  |  |                                     return translate('page.route.enums.direction.unordered'); | 
 |  |  |                                 case 1: | 
 |  |  |                                     return translate('page.route.enums.direction.forward'); | 
 |  |  |                                 case 2: | 
 |  |  |                                     return translate('page.route.enums.direction.reverse'); | 
 |  |  |                                 default: | 
 |  |  |                                     return ''; | 
 |  |  |                             } | 
 |  |  |                         }} | 
 |  |  |                     /> | 
 |  |  |                     <ReferenceField source="updateBy" label="common.field.updateBy" reference="user" link={false} sortable={false}> | 
 |  |  |                         <TextField source="nickname" /> | 
 |  |  |                     </ReferenceField> |