1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
|
import React from 'react';
import ReactDOM from 'react-dom';
import 'tailwindcss/tailwind.css';
import Paper from './components/Paper';
import Header from './components/Header';
import Button from './components/Button';
import ListTable from './components/ListTable';
const navigation = [
{ name: 'Главная', route: '/'},
{ name: 'Товары', route: '/products'}
];
const fields = [
{ key: '_id', label: 'ID' },
{ key: 'name', label: 'Название' },
{ key: 'type', label: 'Тип' },
];
const items = [
{ _id: 1, name: 'Товар 1', type: 'Кондиционер' },
{ _id: 2, name: 'Товар 2', type: 'Кондиционер' },
{ _id: 3, name: 'Товар 3', type: 'Кондиционер' },
{ _id: 4, name: 'Товар 4', type: 'Кондиционер' },
{ _id: 5, name: 'Товар 5', type: 'Кондиционер' },
{ _id: 6, name: 'Товар 6', type: 'Кондиционер' },
];
const App: React.FC = () => (
<>
<Header navigation={navigation} />
<Paper>
<p>
Привет, мир!
<Button>Нажми меня</Button>
<Button variant="outlined">Отменить</Button>
</p>
<ListTable items={items} fields={fields} />
</Paper>
</>
);
ReactDOM.render(
<React.StrictMode>
<App />
</React.StrictMode>,
document.getElementById('root')
);
|