#

vincentlu

13 小时以前 4992e4e60b73a87c3781aabd9367e11e3eaa370e

 zy-acs-flow/src/page/integrationRecord/IntegrationRecordList.jsx

@@ -1,4 +1,4 @@
import React, { useState } from "react";
import React, { useState, useMemo } from "react";
import {
    List,
    DatagridConfigurable,
@@ -6,12 +6,11 @@
    TopToolbar,
    SelectColumnsButton,
    FilterButton,
    useTranslate,
    useRecordContext,
    TextField,
    NumberField,
    DateField,
    BooleanField,
    ReferenceField,
    TextInput,
    DateInput,
    SelectInput,
@@ -27,6 +26,7 @@
import { PAGE_DRAWER_WIDTH, DEFAULT_PAGE_SIZE } from '@/config/setting';
import { format } from 'date-fns';
import rowSx from './rowSx';
import { buildDirectionChoices, getDirectionLabel } from './direction';

const StyledDatagrid = styled(DatagridConfigurable)(({ theme }) => ({
    '& .css-1vooibu-MuiSvgIcon-root': {
@@ -66,37 +66,36 @@
    },
}));

const filters = [
    <SearchInput source="condition" alwaysOn />,
    <DateInput label='common.time.after' source="timeStart" alwaysOn />,
    <DateInput label='common.time.before' source="timeEnd" alwaysOn />,

    <TextInput source="uuid" label="table.field.integrationRecord.uuid" />,
    <TextInput source="namespace" label="table.field.integrationRecord.namespace" />,
    <TextInput source="url" label="table.field.integrationRecord.url" />,
    <TextInput source="appkey" label="table.field.integrationRecord.appkey" />,
    <TextInput source="caller" label="table.field.integrationRecord.caller" />,
    <SelectInput source="direction" label="table.field.integrationRecord.direction"
        choices={[
            { id: 1, name: '被调用' },
            { id: 2, name: '调用外部' },
        ]}
    />,
    <TextInput source="timestamp" label="table.field.integrationRecord.timestamp" />,
    <TextInput source="clientIp" label="table.field.integrationRecord.clientIp" />,
    <SelectInput source="result" label="table.field.integrationRecord.result"
        choices={[
            { id: 1, name: '成功' },
            { id: 0, name: '失败' },
        ]}
    />,

    <TextInput label="common.field.memo" source="memo" />,
]

const IntegrationRecordList = () => {
    const translate = useTranslate();
    const [createDialog, setCreateDialog] = useState(false);
    const [drawerVal, setDrawerVal] = useState(false);
    const directionChoices = useMemo(() => buildDirectionChoices(translate), [translate]);
    const filters = useMemo(() => [
        <SearchInput source="condition" alwaysOn />,
        <DateInput label='common.time.after' source="timeStart" alwaysOn />,
        <DateInput label='common.time.before' source="timeEnd" alwaysOn />,
        <TextInput source="uuid" label="table.field.integrationRecord.uuid" />,
        <TextInput source="namespace" label="table.field.integrationRecord.namespace" />,
        <TextInput source="url" label="table.field.integrationRecord.url" />,
        <TextInput source="appkey" label="table.field.integrationRecord.appkey" />,
        <TextInput source="caller" label="table.field.integrationRecord.caller" />,
        <SelectInput source="direction"
            label="table.field.integrationRecord.direction"
            choices={directionChoices}
            alwaysOn
        />,
        // <TextInput source="timestamp" label="table.field.integrationRecord.timestamp" />,
        <TextInput source="clientIp" label="table.field.integrationRecord.clientIp" />,
        <SelectInput source="result" label="table.field.integrationRecord.result"
            choices={[
                { id: 1, name: 'common.enums.success' },
                { id: 0, name: 'common.enums.failure' },
            ]}
            alwaysOn
        />,
        <TextInput label="common.field.memo" source="memo" />,
    ], [directionChoices]);

    return (
        <Box display="flex">
@@ -138,12 +137,12 @@
                    <TextField source="url" label="table.field.integrationRecord.url" />
                    <TextField source="appkey" label="table.field.integrationRecord.appkey" />
                    <TextField source="caller" label="table.field.integrationRecord.caller" />
                    <TextField source="direction" label="table.field.integrationRecord.direction" sortable={false} />
                    <DirectionField source="direction" label="table.field.integrationRecord.direction" sortable={false} />
                    <FormattedTimestampField source="timestamp" label="table.field.integrationRecord.timestamp" />
                    <TextField source="clientIp" label="table.field.integrationRecord.clientIp" />
                    <TextField source="request" label="table.field.integrationRecord.request" sortable={false} hidden={!!drawerVal} />
                    <TextField source="response" label="table.field.integrationRecord.response" sortable={false} hidden={!!drawerVal} />
                    <ResultField source="result" label="table.field.integrationRecord.result" />
                    <ResultField source="result" label="table.field.integrationRecord.result" sortable={false} />
                    <TextField source="err" label="table.field.integrationRecord.err" />
                    <NumberField source="costMs" label="table.field.integrationRecord.costMs" sx={{ fontWeight: 'bold' }} />

@@ -178,17 +177,35 @@
};

const ResultField = ({ source }) => {
    const translate = useTranslate();
    const record = useRecordContext();
    const val = record?.[source];
    return (
        <>
            {val === 1 ? (
                <Chip label="success" color="success" variant="outlined" size="small" />
                <Chip label={translate("common.enums.success")} color="success" variant="outlined" size="small" />
            ) : (
                <Chip label="error" color="error" variant="outlined" size="small" />
                <Chip label={translate("common.enums.failure")} color="error" variant="outlined" size="small" />
            )}
        </>
    );
};

const DirectionField = ({ source }) => {
    const record = useRecordContext();
    const translate = useTranslate();
    const val = record?.[source];
    if (val === undefined || val === null) {
        return null;
    }
    return (
        <Chip
            label={getDirectionLabel(translate, val)}
            variant="outlined"
            size="small"
            color="info"
        />
    );
};

export default IntegrationRecordList;