From 3af49c5a23b7b9259fed5e2334b6e33c15d2bc16 Mon Sep 17 00:00:00 2001 From: maxim Date: Fri, 14 Feb 2025 00:16:14 +0300 Subject: [PATCH] [2] add `show` page for other routes --- src/App.tsx | 16 ++++++++++++---- src/pages/route/index.ts | 1 + src/pages/route/list.tsx | 5 +++-- src/pages/route/show.tsx | 32 ++++++++++++++++++++++++++++++++ src/pages/sight/index.ts | 1 + src/pages/sight/list.tsx | 5 +++-- src/pages/sight/show.tsx | 33 +++++++++++++++++++++++++++++++++ src/pages/station/index.ts | 1 + src/pages/station/list.tsx | 5 +++-- src/pages/station/show.tsx | 33 +++++++++++++++++++++++++++++++++ src/pages/vehicle/index.ts | 1 + src/pages/vehicle/list.tsx | 5 +++-- src/pages/vehicle/show.tsx | 32 ++++++++++++++++++++++++++++++++ 13 files changed, 158 insertions(+), 12 deletions(-) create mode 100644 src/pages/route/show.tsx create mode 100644 src/pages/sight/show.tsx create mode 100644 src/pages/station/show.tsx create mode 100644 src/pages/vehicle/show.tsx diff --git a/src/App.tsx b/src/App.tsx index 13ea90b..26d6f00 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -21,10 +21,10 @@ import {CityList, CityCreate, CityEdit, CityShow} from './pages/city' import {CarrierList, CarrierCreate, CarrierEdit, CarrierShow} from './pages/carrier' import {MediaList, MediaCreate, MediaEdit, MediaShow} from './pages/media' import {ArticleList, ArticleCreate, ArticleEdit, ArticleShow} from './pages/article' -import {SightList, SightCreate, SightEdit} from './pages/sight' -import {StationList, StationCreate, StationEdit} from './pages/station' -import {VehicleList, VehicleCreate, VehicleEdit} from './pages/vehicle' -import {RouteList, RouteCreate, RouteEdit} from './pages/route' +import {SightList, SightCreate, SightEdit, SightShow} from './pages/sight' +import {StationList, StationCreate, StationEdit, StationShow} from './pages/station' +import {VehicleList, VehicleCreate, VehicleEdit, VehicleShow} from './pages/vehicle' +import {RouteList, RouteCreate, RouteEdit, RouteShow} from './pages/route' import {CountryIcon, CityIcon, CarrierIcon, MediaIcon, ArticleIcon, SightIcon, StationIcon, VehicleIcon, RouteIcon} from './components/ui/Icons' import {BACKEND_URL} from './lib/constants' @@ -109,6 +109,7 @@ function App() { list: '/sight', create: '/sight/create', edit: '/sight/edit/:id', + show: '/sight/show/:id', // добавить SHOW для sight->article (https://wn.krbl.ru/sight/2/article) meta: { canDelete: true, @@ -121,6 +122,7 @@ function App() { list: '/station', create: '/station/create', edit: '/station/edit/:id', + show: '/station/show/:id', // добавить SHOW для station->sight (https://wn.krbl.ru/station/2/sight) meta: { canDelete: true, @@ -133,6 +135,7 @@ function App() { list: '/vehicle', create: '/vehicle/create', edit: '/vehicle/edit/:id', + show: '/vehicle/show/:id', // добавить SHOW для vehicle->routes (https://wn.krbl.ru/vehicle/routes?id=1) meta: { canDelete: true, @@ -145,6 +148,7 @@ function App() { list: '/route', create: '/route/create', edit: '/route/edit/:id', + show: '/route/show/:id', // добавить SHOW для route->station (https://wn.krbl.ru/route/station) // добавить SHOW для route->vehicle (https://wn.krbl.ru/route/vehicle) meta: { @@ -212,24 +216,28 @@ function App() { } /> } /> } /> + } /> } /> } /> } /> + } /> } /> } /> } /> + } /> } /> } /> } /> + } /> } /> diff --git a/src/pages/route/index.ts b/src/pages/route/index.ts index fbafdcf..0f886cc 100644 --- a/src/pages/route/index.ts +++ b/src/pages/route/index.ts @@ -1,3 +1,4 @@ export * from './create' export * from './edit' export * from './list' +export * from './show' diff --git a/src/pages/route/list.tsx b/src/pages/route/list.tsx index c55e3cd..7cc3aa6 100644 --- a/src/pages/route/list.tsx +++ b/src/pages/route/list.tsx @@ -1,5 +1,5 @@ import {DataGrid, type GridColDef} from '@mui/x-data-grid' -import {DeleteButton, EditButton, List, useDataGrid} from '@refinedev/mui' +import {DeleteButton, EditButton, List, ShowButton, useDataGrid} from '@refinedev/mui' import React from 'react' export const RouteList = () => { @@ -50,13 +50,14 @@ export const RouteList = () => { headerName: 'Actions', align: 'right', headerAlign: 'center', - minWidth: 100, + minWidth: 120, sortable: false, display: 'flex', renderCell: function render({row}) { return ( <> + ) diff --git a/src/pages/route/show.tsx b/src/pages/route/show.tsx new file mode 100644 index 0000000..e13a5b9 --- /dev/null +++ b/src/pages/route/show.tsx @@ -0,0 +1,32 @@ +import {Stack, Typography} from '@mui/material' +import {useShow} from '@refinedev/core' +import {Show, TextFieldComponent as TextField} from '@refinedev/mui' + +export const RouteShow = () => { + const {query} = useShow({}) + const {data, isLoading} = query + + const record = data?.data + + const fields = [ + {label: 'ID', data: 'id'}, + {label: 'Carrier ID', data: 'carrier_id'}, + {label: 'Route Number', data: 'route_number'}, + {label: 'Route Direction', data: 'route_direction'}, + ] + + return ( + + + {fields.map(({label, data}) => ( + + + {label} + + + + ))} + + + ) +} diff --git a/src/pages/sight/index.ts b/src/pages/sight/index.ts index fbafdcf..0f886cc 100644 --- a/src/pages/sight/index.ts +++ b/src/pages/sight/index.ts @@ -1,3 +1,4 @@ export * from './create' export * from './edit' export * from './list' +export * from './show' diff --git a/src/pages/sight/list.tsx b/src/pages/sight/list.tsx index da251a7..19bd7ef 100644 --- a/src/pages/sight/list.tsx +++ b/src/pages/sight/list.tsx @@ -1,5 +1,5 @@ import {DataGrid, type GridColDef} from '@mui/x-data-grid' -import {DeleteButton, EditButton, List, useDataGrid} from '@refinedev/mui' +import {DeleteButton, EditButton, List, ShowButton, useDataGrid} from '@refinedev/mui' import React from 'react' export const SightList = () => { @@ -60,13 +60,14 @@ export const SightList = () => { headerName: 'Actions', align: 'right', headerAlign: 'center', - minWidth: 100, + minWidth: 120, sortable: false, display: 'flex', renderCell: function render({row}) { return ( <> + ) diff --git a/src/pages/sight/show.tsx b/src/pages/sight/show.tsx new file mode 100644 index 0000000..bae82af --- /dev/null +++ b/src/pages/sight/show.tsx @@ -0,0 +1,33 @@ +import {Stack, Typography} from '@mui/material' +import {useShow} from '@refinedev/core' +import {Show, TextFieldComponent as TextField} from '@refinedev/mui' + +export const SightShow = () => { + const {query} = useShow({}) + const {data, isLoading} = query + + const record = data?.data + + const fields = [ + {label: 'ID', data: 'id'}, + {label: 'Name', data: 'name'}, + {label: 'Latitude', data: 'latitude'}, + {label: 'Longitude', data: 'longitude'}, + {label: 'City ID', data: 'city_id'}, + ] + + return ( + + + {fields.map(({label, data}) => ( + + + {label} + + + + ))} + + + ) +} diff --git a/src/pages/station/index.ts b/src/pages/station/index.ts index fbafdcf..0f886cc 100644 --- a/src/pages/station/index.ts +++ b/src/pages/station/index.ts @@ -1,3 +1,4 @@ export * from './create' export * from './edit' export * from './list' +export * from './show' diff --git a/src/pages/station/list.tsx b/src/pages/station/list.tsx index 997625f..f64995b 100644 --- a/src/pages/station/list.tsx +++ b/src/pages/station/list.tsx @@ -1,5 +1,5 @@ import {DataGrid, type GridColDef} from '@mui/x-data-grid' -import {DeleteButton, EditButton, List, useDataGrid} from '@refinedev/mui' +import {DeleteButton, EditButton, List, ShowButton, useDataGrid} from '@refinedev/mui' import React from 'react' export const StationList = () => { @@ -59,13 +59,14 @@ export const StationList = () => { headerName: 'Actions', align: 'right', headerAlign: 'center', - minWidth: 100, + minWidth: 120, sortable: false, display: 'flex', renderCell: function render({row}) { return ( <> + ) diff --git a/src/pages/station/show.tsx b/src/pages/station/show.tsx new file mode 100644 index 0000000..6734007 --- /dev/null +++ b/src/pages/station/show.tsx @@ -0,0 +1,33 @@ +import {Stack, Typography} from '@mui/material' +import {useShow} from '@refinedev/core' +import {Show, TextFieldComponent as TextField} from '@refinedev/mui' + +export const StationShow = () => { + const {query} = useShow({}) + const {data, isLoading} = query + + const record = data?.data + + const fields = [ + {label: 'ID', data: 'id'}, + {label: 'Name', data: 'name'}, + {label: 'Latitude', data: 'latitude'}, + {label: 'Longitude', data: 'longitude'}, + {label: 'Description', data: 'description'}, + ] + + return ( + + + {fields.map(({label, data}) => ( + + + {label} + + + + ))} + + + ) +} diff --git a/src/pages/vehicle/index.ts b/src/pages/vehicle/index.ts index fbafdcf..0f886cc 100644 --- a/src/pages/vehicle/index.ts +++ b/src/pages/vehicle/index.ts @@ -1,3 +1,4 @@ export * from './create' export * from './edit' export * from './list' +export * from './show' diff --git a/src/pages/vehicle/list.tsx b/src/pages/vehicle/list.tsx index 6cd4cc4..0b7f536 100644 --- a/src/pages/vehicle/list.tsx +++ b/src/pages/vehicle/list.tsx @@ -1,5 +1,5 @@ import {DataGrid, type GridColDef} from '@mui/x-data-grid' -import {DeleteButton, EditButton, List, useDataGrid} from '@refinedev/mui' +import {DeleteButton, EditButton, List, ShowButton, useDataGrid} from '@refinedev/mui' import React from 'react' export const VehicleList = () => { @@ -49,13 +49,14 @@ export const VehicleList = () => { headerName: 'Actions', align: 'right', headerAlign: 'center', - minWidth: 100, + minWidth: 120, sortable: false, display: 'flex', renderCell: function render({row}) { return ( <> + ) diff --git a/src/pages/vehicle/show.tsx b/src/pages/vehicle/show.tsx new file mode 100644 index 0000000..864ce9a --- /dev/null +++ b/src/pages/vehicle/show.tsx @@ -0,0 +1,32 @@ +import {Stack, Typography} from '@mui/material' +import {useShow} from '@refinedev/core' +import {Show, TextFieldComponent as TextField} from '@refinedev/mui' + +export const VehicleShow = () => { + const {query} = useShow({}) + const {data, isLoading} = query + + const record = data?.data + + const fields = [ + {label: 'ID', data: 'id'}, + {label: 'Tail Number', data: 'tail_number'}, + {label: 'Type', data: 'type'}, + {label: 'City_id', data: 'city_id'}, + ] + + return ( + + + {fields.map(({label, data}) => ( + + + {label} + + + + ))} + + + ) +}