chen.lin
20 小时以前 82065a03737fa1370eb9f4f01ab5332933baf08a
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
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
import React, { useState } from "react";
import {
    List,
    DatagridConfigurable,
    SearchInput,
    TopToolbar,
    SelectColumnsButton,
    EditButton,
    FilterButton,
    TextField,
    TextInput,
    FunctionField,
    SelectInput,
    WrapperField,
    DeleteButton,
} from 'react-admin';
import { Box } from '@mui/material';
import { styled } from '@mui/material/styles';
import OpenApiAppCreate from "./OpenApiAppCreate";
import EmptyData from "@/page/components/EmptyData";
import MyCreateButton from "@/page/components/MyCreateButton";
import { OPERATE_MODE, DEFAULT_PAGE_SIZE } from '@/config/setting';
 
const StyledDatagrid = styled(DatagridConfigurable)(() => ({
    '& .RaDatagrid-row': { cursor: 'auto' },
    '& .opt': { width: 140 },
}));
 
const filters = [
    <SearchInput source="condition" alwaysOn />,
    <TextInput source="id" label="应用ID" />,
    <TextInput source="name" label="应用名称" />,
    <SelectInput
        label="启用状态"
        source="enable"
        choices={[
            { id: 1, name: '启用' },
            { id: 0, name: '未启用' },
        ]}
    />,
];
 
const OpenApiAppList = () => {
    const [createDialog, setCreateDialog] = useState(false);
 
    return (
        <Box display="flex">
            <List
                title="应用管理"
                empty={<EmptyData onClick={() => setCreateDialog(true)} />}
                filters={filters}
                sort={{ field: "id", order: "asc" }}
                actions={(
                    <TopToolbar>
                        <FilterButton />
                        <MyCreateButton onClick={() => setCreateDialog(true)} />
                        <SelectColumnsButton preferenceKey="openApiApp" />
                    </TopToolbar>
                )}
                perPage={DEFAULT_PAGE_SIZE}
            >
                <StyledDatagrid
                    preferenceKey="openApiApp"
                    bulkActionButtons={() => <DeleteButton mutationMode={OPERATE_MODE} />}
                    rowClick={false}
                    omit={['tenantId']}
                >
                    <TextField source="id" label="应用ID" />
                    <TextField source="name" label="应用名称" />
                    <TextField source="screct" label="应用密钥" />
                    <TextField source="url" label="应用URL" />
                    <FunctionField source="enable" label="启用" render={(r) => (r.enable === 1 ? '启用' : '未启用')} />
                    <WrapperField cellClassName="opt" label="操作">
                        <EditButton sx={{ padding: '1px', fontSize: '.75rem' }} />
                        <DeleteButton sx={{ padding: '1px', fontSize: '.75rem' }} mutationMode={OPERATE_MODE} />
                    </WrapperField>
                </StyledDatagrid>
            </List>
            <OpenApiAppCreate open={createDialog} setOpen={setCreateDialog} />
        </Box>
    );
};
 
export default OpenApiAppList;