#

luxiaotao1123

2024-09-10 8c8b3cc23896b5b7bc98ba7829abeb30d505de3c

#

 zy-acs-flow/src/page/components/EditTopToolBar.jsx

@@ -1,12 +1,13 @@
import React, { useState, useRef, useEffect, useMemo } from "react";
import { TopToolbar } from "react-admin";
import { TopToolbar, useResourceContext, useTranslate } from "react-admin";
import { Stack, Button, Box, Chip } from '@mui/material';
import ArrowBackIosNewIcon from '@mui/icons-material/ArrowBackIosNew';
import { useNavigate } from 'react-router-dom';

const CustomerTopToolBar = (props) => {
const CustomerTopToolBar = ({ ...rest }) => {
    const navigate = useNavigate();

    const resource = useResourceContext();
    const translate = useTranslate();
    return (
        <TopToolbar sx={{
            marginTop: 1,
@@ -14,7 +15,7 @@
            justifyContent: 'flex-start'
        }}>
            <Button
                onClick={() => navigate(-1)}
                onClick={() => navigate('/' + resource)}
                sx={{
                    border: '1px solid #ccc',
                    padding: '6px 12px',
@@ -22,7 +23,7 @@
                }}
                startIcon={<ArrowBackIosNewIcon />}
            >
                Back
                {translate('ra.action.back')}
            </Button>
        </TopToolbar>
    )

 zy-acs-flow/src/page/user/UserEdit.jsx

@@ -45,168 +45,175 @@

const UserEdit = () => {
    const translate = useTranslate();
    const record = useRecordContext();

    return (
        <SimpleForm
            shouldUnregister
            warnWhenUnsavedChanges
            toolbar={<FormToolbar />}
            mode="onTouched"
            defaultValues={{}}
            validate={(values) => {
                const errors = {};
                if (!values.username) {
                    errors.username = 'ra.validation.required';
                }
                if (!values.nickname) {
                    errors.nickname = 'ra.validation.required';
                }
                if (!values.userRoleIds) {
                    errors.userRoleIds = 'ra.validation.required';
                }
                if (!values.email) {
                } else {
                    const error = email()(values.email);
                    if (error) {
                        errors.email = error;
                    }
                }
                if (!values.password) {
                    errors.password = 'ra.validation.required';
                }
                if (values.password && values.password !== values.confirmPassword) {
                    errors.confirmPassword = 'validate.pwdMisMatch';
                }
                console.log(values);

                return errors;
            }}
        >
            <Grid container width={{ xs: '100%', xl: '80%' }} rowSpacing={3} columnSpacing={3}>
                <Grid item xs={12} md={8}>
                    <Typography variant="h6" gutterBottom>
                        {translate('common.edit.title.main')}
                    </Typography>
                    <Stack direction='row' gap={2}>
                        <TextInput
                            label="table.field.user.username"
                            source="username"
                            parse={v => v}
                            autoFocus
                            validate={required()}
                        />
                        <TextInput
                            label="table.field.user.nickname"
                            source="nickname"
                            parse={v => v}
                        />
                    </Stack>
                    <Stack direction='row' gap={2}>
                        <SelectInput
                            label="table.field.user.sex"
                            source="sex"
                            choices={[
                                { id: 0, name: '未知' },
                                { id: 1, name: '男' },
                                { id: 2, name: '女' },
                            ]}
                        />
                        <TextInput
                            label="table.field.user.code"
                            source="code"
                            parse={v => v}
                        />
                    </Stack>
                    <Stack direction='row' gap={2}>
                        <TextInput
                            label="table.field.user.phone"
                            source="phone"
                            parse={v => v}
                        />
                        <TextInput
                            label="table.field.user.email"
                            source="email"
                            parse={v => v}
                        />
                    </Stack>
                    <Stack direction='row' gap={2}>
                        <TextInput
                            label="table.field.user.realName"
                            source="realName"
                            parse={v => v}
                        />
                        <TextInput
                            label="table.field.user.idCard"
                            source="idCard"
                            parse={v => v}
                        />
                    </Stack>
                    <Stack direction='row' gap={2}>
                        <TextInput
                            label="table.field.user.birthday"
                            source="birthday"
                            parse={v => v}
                        />
                        <TextInput
                            label="table.field.user.introduction"
                            multiline
                            source="introduction"
                            parse={v => v}
                        />
                    </Stack>
                    <Typography variant="h6" gutterBottom>
                        {translate('common.edit.title.changePwd')}
                    </Typography>
                    <Stack direction='row' gap={2}>
                        <PasswordInput
                            label="table.field.user.password"
                            source="password"
                        />
                        <PasswordInput
                            label="table.field.user.confirmPwd"
                            source="confirmPassword"
                            value={record?.password}
                        />
                    </Stack>
                </Grid>
                <Grid item xs={12} md={4}>
                    <Typography variant="h6" gutterBottom>
                        {translate('common.edit.title.common')}
                    </Typography>
                    <Stack direction='row' gap={2}>
                        <TreeSelectInput
                            label="table.field.user.deptId"
                            value={record?.deptId}
                            resource={'dept'}
                            source="deptId"
                        />
                    </Stack>
                    <Stack direction='row' gap={2}>
                        <RolesSelect
                            label="table.field.user.role"
                            source="userRoleIds"
                        />
                    </Stack>
                    <Stack direction='row' gap={2}>
                        <StatusSelectInput />
                    </Stack>
                    <Box mt="2em" />
                    <MemoInput />
                </Grid>
            </Grid>
        </SimpleForm>
    )
}

export default function () {
    return (
        <Edit
            redirect="list"
            mutationMode={EDIT_MODE}
            actions={<CustomerTopToolBar />}
            aside={<EditBaseAside />}
            transform={(data) => {
                return {
                    ...data,
                    roleIds: data['userRoleIds'] || []
                };
            }}
        >
            <SimpleForm
                shouldUnregister
                warnWhenUnsavedChanges
                toolbar={<FormToolbar />}
                mode="onTouched"
                defaultValues={{}}
                validate={(values) => {
                    const errors = {};
                    if (!values.username) {
                        errors.username = 'ra.validation.required';
                    }
                    if (!values.nickname) {
                        errors.nickname = 'ra.validation.required';
                    }
                    if (!values.roleIds) {
                        errors.roleIds = 'ra.validation.required';
                    }
                    if (!values.email) {
                    } else {
                        const error = email()(values.email);
                        if (error) {
                            errors.email = error;
                        }
                    }
                    if (!values.password) {
                        errors.password = 'ra.validation.required';
                    }
                    if (values.password && values.password !== values.confirmPassword) {
                        errors.confirmPassword = 'validate.pwdMisMatch';
                    }
                    return errors;
                }}
            >
                <Grid container width={{ xs: '100%', xl: '80%' }} rowSpacing={3} columnSpacing={3}>
                    <Grid item xs={12} md={8}>
                        <Typography variant="h6" gutterBottom>
                            {translate('common.edit.title.main')}
                        </Typography>
                        <Stack direction='row' gap={2}>
                            <TextInput
                                label="table.field.user.username"
                                source="username"
                                parse={v => v}
                                autoFocus
                                validate={required()}
                            />
                            <TextInput
                                label="table.field.user.nickname"
                                source="nickname"
                                parse={v => v}
                            />
                        </Stack>
                        <Stack direction='row' gap={2}>
                            <SelectInput
                                label="table.field.user.sex"
                                source="sex"
                                choices={[
                                    { id: 0, name: '未知' },
                                    { id: 1, name: '男' },
                                    { id: 2, name: '女' },
                                ]}
                            />
                            <TextInput
                                label="table.field.user.code"
                                source="code"
                                parse={v => v}
                            />
                        </Stack>
                        <Stack direction='row' gap={2}>
                            <TextInput
                                label="table.field.user.phone"
                                source="phone"
                                parse={v => v}
                            />
                            <TextInput
                                label="table.field.user.email"
                                source="email"
                                parse={v => v}
                            />
                        </Stack>
                        <Stack direction='row' gap={2}>
                            <TextInput
                                label="table.field.user.realName"
                                source="realName"
                                parse={v => v}
                            />
                            <TextInput
                                label="table.field.user.idCard"
                                source="idCard"
                                parse={v => v}
                            />
                        </Stack>
                        <Stack direction='row' gap={2}>
                            <TextInput
                                label="table.field.user.birthday"
                                source="birthday"
                                parse={v => v}
                            />
                            <TextInput
                                label="table.field.user.introduction"
                                multiline
                                source="introduction"
                                parse={v => v}
                            />
                        </Stack>
                        <Typography variant="h6" gutterBottom>
                            {translate('common.edit.title.changePwd')}
                        </Typography>
                        <Stack direction='row' gap={2}>
                            <PasswordInput
                                label="table.field.user.password"
                                source="password"
                            />
                            <PasswordInput
                                label="table.field.user.confirmPwd"
                                source="confirmPassword"
                            />
                        </Stack>
                    </Grid>
                    <Grid item xs={12} md={4}>
                        <Typography variant="h6" gutterBottom>
                            {translate('common.edit.title.common')}
                        </Typography>
                        <Stack direction='row' gap={2}>
                            <TreeSelectInput
                                label="table.field.user.deptId"
                                value={record?.deptId}
                            />
                            <ReferenceInput
                                source="deptId"
                                reference="dept"
                            >
                                <AutocompleteInput
                                    label="table.field.user.deptId"
                                    optionText="name"
                                />
                            </ReferenceInput>
                        </Stack>
                        <Stack direction='row' gap={2}>
                            <RolesSelect
                                label="table.field.user.role"
                                source="roleIds"
                            />
                        </Stack>
                        <Stack direction='row' gap={2}>
                            <StatusSelectInput />
                        </Stack>
                        <Box mt="2em" />
                        <MemoInput />
                    </Grid>
                </Grid>
            </SimpleForm>
        </Edit >
            <UserEdit />
        </Edit>
    )
}

export default UserEdit;
};