import React, { useState } from "react";
|
import {
|
List,
|
SearchInput,
|
TopToolbar,
|
ColumnsButton,
|
EditButton,
|
FilterButton,
|
BulkDeleteButton,
|
WrapperField,
|
useRecordContext,
|
useNotify,
|
TextField,
|
NumberField,
|
DateField,
|
ReferenceField,
|
TextInput,
|
NumberInput,
|
ReferenceInput,
|
AutocompleteInput,
|
DeleteButton,
|
useRefresh,
|
Button
|
} from 'react-admin';
|
import { Box } from '@mui/material';
|
import WarehouseAreasCreate from "./WarehouseAreasCreate";
|
import EmptyData from "../components/EmptyData";
|
import MyCreateButton from "../components/MyCreateButton";
|
import PageDrawer from "../components/PageDrawer";
|
import BatchModal from "./BatchModal";
|
import { PAGE_DRAWER_WIDTH, OPERATE_MODE, DEFAULT_PAGE_SIZE } from '@/config/setting';
|
import EditIcon from '@mui/icons-material/Edit';
|
import StickyDataTable from "@/page/components/StickyDataTable";
|
import ListExportPrintButton from "../components/ListExportPrintButton";
|
|
const filters = [
|
<SearchInput key="condition" source="condition" placeholder="搜索库区名称" alwaysOn />,
|
<ReferenceInput
|
key="warehouseId"
|
source="warehouseId"
|
label="table.field.loc.warehouseId"
|
reference="warehouse"
|
>
|
<AutocompleteInput
|
label="table.field.loc.warehouseId"
|
optionText="name"
|
filterToQuery={(val) => ({ name: val })}
|
/>
|
</ReferenceInput>,
|
<TextInput key="code" source="code" label="table.field.warehouseAreas.code" />,
|
<TextInput key="name" source="name" label="table.field.warehouseAreas.name" />,
|
<ReferenceInput
|
key="shipperId"
|
source="shipperId"
|
label="table.field.warehouseAreas.shipperId"
|
reference="shipper"
|
>
|
<AutocompleteInput
|
label="table.field.warehouseAreas.shipperId"
|
optionText="name"
|
filterToQuery={(val) => ({ name: val })}
|
/>
|
</ReferenceInput>,
|
<NumberInput key="supplierId" source="supplierId" label="table.field.warehouseAreas.supplierId" />,
|
];
|
|
const HIDDEN_COLUMN_SOURCES = [
|
'id',
|
'updateTime',
|
'updateBy',
|
'createTime',
|
'createBy',
|
'longitude',
|
'latgitude',
|
'length',
|
'width',
|
'height',
|
'shipperId$',
|
'supplierId',
|
'sort',
|
];
|
|
const createColumnDef = (source, label, fieldType = 'text', extra = {}) => ({
|
source,
|
label,
|
fieldType,
|
hidden: HIDDEN_COLUMN_SOURCES.includes(source),
|
...extra,
|
});
|
|
const COLUMN_DEFS = [
|
createColumnDef('id', 'id', 'number'),
|
createColumnDef('sort', 'table.field.warehouseAreas.sort', 'number'),
|
createColumnDef('warehouseId$', 'table.field.warehouseAreas.wareId'),
|
createColumnDef('code', 'table.field.warehouseAreas.code'),
|
createColumnDef('name', 'table.field.warehouseAreas.name'),
|
createColumnDef('type$', 'table.field.warehouseAreas.type'),
|
createColumnDef('shipperId$', 'table.field.warehouseAreas.shipperId'),
|
createColumnDef('supplierId', 'table.field.warehouseAreas.supplierId', 'number'),
|
createColumnDef('flagMix$', 'table.field.warehouseAreas.flagMix'),
|
createColumnDef('flagMinus$', 'table.field.warehouseAreas.flagMinus'),
|
createColumnDef('updateBy', 'common.field.updateBy', 'text', {
|
component: 'reference',
|
reference: 'user',
|
childSource: 'nickname',
|
sortable: false,
|
}),
|
createColumnDef('updateTime', 'common.field.updateTime', 'date', {
|
component: 'date',
|
showTime: true,
|
}),
|
createColumnDef('createBy', 'common.field.createBy', 'text', {
|
component: 'reference',
|
reference: 'user',
|
childSource: 'nickname',
|
sortable: false,
|
}),
|
createColumnDef('createTime', 'common.field.createTime', 'date', {
|
component: 'date',
|
showTime: true,
|
}),
|
createColumnDef('memo', 'common.field.memo', 'text', {
|
sortable: false,
|
}),
|
];
|
|
const renderColumnField = (column) => {
|
if (column.component === 'reference') {
|
return (
|
<ReferenceField
|
key={column.source}
|
source={column.source}
|
label={column.label}
|
reference={column.reference}
|
link={false}
|
sortable={column.sortable}
|
>
|
<TextField source={column.childSource} />
|
</ReferenceField>
|
);
|
}
|
|
if (column.component === 'date' || column.fieldType === 'date') {
|
return (
|
<DateField
|
key={column.source}
|
source={column.source}
|
label={column.label}
|
showTime={column.showTime}
|
/>
|
);
|
}
|
|
if (column.fieldType === 'number') {
|
return (
|
<NumberField
|
key={column.source}
|
source={column.source}
|
label={column.label}
|
/>
|
);
|
}
|
|
return (
|
<TextField
|
key={column.source}
|
source={column.source}
|
label={column.label}
|
sortable={column.sortable}
|
/>
|
);
|
};
|
|
const exportPrintButton = (
|
<ListExportPrintButton
|
storeKey="warehouseAreas"
|
columns={COLUMN_DEFS}
|
title="menu.warehouseAreas"
|
fileName="warehouseAreas"
|
/>
|
);
|
|
const WarehouseAreasList = () => {
|
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.warehouseAreas"
|
empty={<EmptyData onClick={() => { setCreateDialog(true); }} />}
|
filters={filters}
|
sort={{ field: "warehouseId", order: "desc" }}
|
actions={(
|
<TopToolbar>
|
<FilterButton />
|
<MyCreateButton onClick={() => { setCreateDialog(true); }} />
|
<ColumnsButton storeKey="warehouseAreas" />
|
{exportPrintButton}
|
</TopToolbar>
|
)}
|
perPage={DEFAULT_PAGE_SIZE}
|
>
|
<StickyDataTable
|
storeKey="warehouseAreas"
|
bulkActionButtons={
|
<>
|
{exportPrintButton}
|
<BulkDeleteButton mutationMode={OPERATE_MODE} />
|
</>
|
}
|
rowClick={() => false}
|
stickyRight={['opt']}
|
hiddenColumns={HIDDEN_COLUMN_SOURCES}
|
>
|
{COLUMN_DEFS.map((column) => renderColumnField(column))}
|
<WrapperField cellClassName="opt" label="common.field.opt">
|
<EditButton sx={{ padding: '1px', fontSize: '.75rem' }} />
|
<DeleteButton sx={{ padding: '1px', fontSize: '.75rem' }} mutationMode={OPERATE_MODE} />
|
</WrapperField>
|
</StickyDataTable>
|
</List>
|
<WarehouseAreasCreate
|
open={createDialog}
|
setOpen={setCreateDialog}
|
/>
|
<PageDrawer
|
title="WarehouseAreas Detail"
|
drawerVal={drawerVal}
|
setDrawerVal={setDrawerVal}
|
/>
|
</Box>
|
);
|
};
|
|
export default WarehouseAreasList;
|
|
const MixButton = () => {
|
const [createDialog, setCreateDialog] = useState(false);
|
|
return (
|
<>
|
<Button onClick={() => setCreateDialog(true)} label="toolbar.batchMix">
|
<EditIcon />
|
</Button>
|
|
<BatchModal
|
open={createDialog}
|
setOpen={setCreateDialog}
|
fieldType="flagMix"
|
/>
|
</>
|
);
|
};
|
|
const WareButton = () => {
|
const [createDialog, setCreateDialog] = useState(false);
|
|
return (
|
<>
|
<Button onClick={() => setCreateDialog(true)} label="toolbar.batchWarehouse">
|
<EditIcon />
|
</Button>
|
|
<BatchModal
|
open={createDialog}
|
setOpen={setCreateDialog}
|
fieldType="wareId"
|
/>
|
</>
|
);
|
};
|
|
const StatusButton = () => {
|
const [createDialog, setCreateDialog] = useState(false);
|
|
return (
|
<>
|
<Button onClick={() => setCreateDialog(true)} label="toolbar.batchStatus">
|
<EditIcon />
|
</Button>
|
|
<BatchModal
|
open={createDialog}
|
setOpen={setCreateDialog}
|
fieldType="status"
|
/>
|
</>
|
);
|
};
|
