WhiteNightsAdminPanel/src/pages/vehicle/list.tsx

121 lines
2.8 KiB
TypeScript

import { type GridColDef } from "@mui/x-data-grid";
import { CustomDataGrid } from "../../components/CustomDataGrid";
import {
DeleteButton,
EditButton,
List,
ShowButton,
useDataGrid,
} from "@refinedev/mui";
import React, { useEffect } from "react";
import { VEHICLE_TYPES } from "../../lib/constants";
import { localeText } from "../../locales/ru/localeText";
import { observer } from "mobx-react-lite";
import { languageStore } from "../../store/LanguageStore";
export const VehicleList = observer(() => {
const { language } = languageStore;
const { dataGridProps } = useDataGrid({
resource: "vehicle",
meta: {
headers: {
"Accept-Language": language,
},
},
});
const columns = React.useMemo<GridColDef[]>(
() => [
{
field: "id",
headerName: "ID",
type: "number",
minWidth: 70,
display: "flex",
align: "left",
headerAlign: "left",
},
{
field: "carrier_id",
headerName: "ID перевозчика",
type: "string",
minWidth: 150,
display: "flex",
align: "left",
headerAlign: "left",
},
{
field: "tail_number",
headerName: "Бортовой номер",
type: "number",
minWidth: 150,
display: "flex",
align: "left",
headerAlign: "left",
},
{
field: "type",
headerName: "Тип",
type: "string",
minWidth: 200,
display: "flex",
align: "left",
headerAlign: "left",
renderCell: (params) => {
const value = params.row.type;
return (
VEHICLE_TYPES.find((type) => type.value === value)?.label || value
);
},
},
{
field: "city",
headerName: "Город",
type: "string",
align: "left",
headerAlign: "left",
flex: 1,
},
{
field: "actions",
headerName: "Действия",
minWidth: 120,
display: "flex",
align: "right",
headerAlign: "center",
sortable: false,
filterable: false,
disableColumnMenu: true,
renderCell: function render({ row }) {
return (
<>
<EditButton hideText recordItemId={row.id} />
<ShowButton hideText recordItemId={row.id} />
<DeleteButton
hideText
confirmTitle="Вы уверены?"
recordItemId={row.id}
/>
</>
);
},
},
],
[]
);
return (
<List>
<CustomDataGrid
{...dataGridProps}
languageEnabled
columns={columns}
localeText={localeText}
getRowId={(row: any) => row.id}
/>
</List>
);
});