#

vincentlu

1 天以前 7662f3bdce6bacb4c0dbdfda635ddc0f575046cd

#

 rsf-admin/src/page/dashboard/NbCard.jsx

New file
@@ -0,0 +1,107 @@
import * as React from 'react';
import {
    Avatar,
    Box,
    Button,
    List,
    ListItem,
    ListItemAvatar,
    ListItemButton,
    ListItemText,
} from '@mui/material';
import CommentIcon from '@mui/icons-material/Comment';
import { Link } from 'react-router-dom';
import {
    ReferenceField,
    FunctionField,
    useGetList,
    useTranslate,
    useIsDataLoaded,
} from 'react-admin';
import CardWithIcon from '../components/CardWithIcon';

const NbCard = (props) => {
    const { list, ...rest } = props;
    const translate = useTranslate();
    const {
        data: reviews,
        total,
        isPending,
    } = useGetList('reviews', {
        filter: { status: 'pending' },
        sort: { field: 'date', order: 'DESC' },
        pagination: { page: 1, perPage: 100 },
    });

    const display = 'display';
    const newList = list.concat(list);

    return (
        <CardWithIcon
            icon={CommentIcon}
            title={translate('pos.dashboard.pending_reviews')}
            subtitle={total}
            {...rest}
        >
            <List sx={{ display }}>
                {newList?.map((record) => (
                    <ListItem key={record.id} disablePadding>
                        <ListItemButton
                            alignItems="flex-start"
                            component={Link}
                            to={`/reviews/${record.id}`}
                        >
                            {/* <ListItemAvatar>
                                <Avatar
                                    sx={{
                                        // bgcolor: 'primary.main',
                                        bgcolor: '#a2beeaff',
                                        color: 'primary.contrastText', // 避免白字白底
                                        // width: 40,
                                        // height: 40,
                                        // fontSize: 16,
                                    }}
                                >
                                    {record.id}
                                </Avatar>
                            </ListItemAvatar> */}

                            <ListItemText
                                // primary={
                                //     <StarRatingField
                                //         record={record}
                                //         source="rating"
                                //     />
                                // }
                                primary={record.date + record.date}
                                secondary={record.total}
                                sx={{
                                    overflowY: 'hidden',
                                    height: '3em',
                                    display: '-webkit-box',
                                    WebkitLineClamp: 2,
                                    WebkitBoxOrient: 'vertical',
                                    paddingRight: 0,
                                }}
                            />
                        </ListItemButton>
                    </ListItem>
                ))}
            </List>
            <Box flexGrow={1}>&nbsp;</Box>
            <Button
                sx={{ borderRadius: 0 }}
                component={Link}
                to="/reviews"
                size="small"
                color="primary"
            >
                <Box p={1} sx={{ color: 'primary.main' }}>
                    {translate('pos.dashboard.all_reviews')}
                </Box>
            </Button>
        </CardWithIcon>
    );
};

export default NbCard;

 rsf-admin/src/page/dashboard/index.jsx

@@ -12,6 +12,7 @@
import { Box, Typography, LinearProgress, Stack } from '@mui/material';
import NbChart from "./NbChart";
import NbList from "./NbList";
import NbCard from "./NbCard";

const styles = {
    flex: { display: 'flex' },
@@ -53,14 +54,14 @@
                    padding: '2rem 1rem',
                }}
            >
                <WordEffect
                {/* <WordEffect
                    words={translate('page.welcome.index')}
                    color={theme.palette.mode === 'light' ? '#666' : '#eeeeee'}
                />
                <WordEffect
                    words={translate('page.welcome.tech')}
                    color={theme.palette.mode === 'light' ? '#666' : '#eeeeee'}
                />
                /> */}
            </div>
        </>
    )
@@ -79,10 +80,10 @@
            if (code === 200) {
                setStatistic(data);
            } else {
                notify(msg, { type: 'error', messageArgs: { _: msg } });
                // notify(msg, { type: 'error', messageArgs: { _: msg } });
            }
        }).catch((error) => {
            notify(error.message, { type: 'error', messageArgs: { _: error.message } });
            // notify(error.message, { type: 'error', messageArgs: { _: error.message } });
            console.error(error);
        })
    }, [])
@@ -146,16 +147,30 @@
                </div>
                <div style={styles.rightCol}>
                    <div style={styles.flex}>
                        <CardWithIcon
                        <NbCard
                            icon={WifiIcon}
                            title={translate('page.member.header.onlineMembers')}
                            subtitle={`${statistic?.membersOnlineQua}`}
                            to={{
                                pathname: '/task',
                                search: JSON.stringify({
                                    filter: JSON.stringify({ status: 1 }),
                                }),
                            }}
                            list={recentOrders}
                        />
                        <Spacer />
                        <CardWithIcon
                        <NbCard
                            icon={SensorOccupiedIcon}
                            title={translate('page.member.header.totalMembers')}
                            subtitle={`${statistic?.membersTotalQua}`}
                            to={{
                                pathname: '/task',
                                search: JSON.stringify({
                                    filter: JSON.stringify({ status: 1 }),
                                }),
                            }}
                            list={recentOrders}
                        />
                    </div>
                </div>