Как создать кнопку отправки в реакции-администраторе, которая меняет внешний вид и поведение в зависимости от данных формы и проверки - PullRequest
2 голосов
/ 30 января 2020

В сложной форме с вкладками в Reaction-Admin мне нужно иметь две кнопки отправки, одна из которых - обычная кнопка сохранения, а другая - для изменения поля состояния (продвижение на один шаг рабочего процесса) и сохранения формы.

Кнопка сохранения должна стать активной, только если все необходимые поля заполнены пользователем. Другая кнопка меняет свой текст в зависимости от поля «status» в записи, которое содержит текущий шаг рабочего процесса, и активируется только тогда, когда проверка формы для текущего шага рабочего процесса проходит.

Так что либо мне нужен динамик Кнопка c или несколько кнопок, которые отображаются и скрываются в зависимости от поля состояния. Я думаю, что кнопка Dynami c была бы более элегантным решением.

Ниже вы видите код, который у меня есть на данный момент, он более или менее скопирован из документации реагирования администратора. Мне также нужно добавить пользовательскую кнопку сохранения, но это всего лишь подмножество, которое легко сделать, когда в конце работает AdvanceWorkflowButton.

const AdvanceWorkflowButton= ({ handleSubmitWithRedirect, ...props }) => {
    const [create] = useCreate('posts');
    const redirectTo = useRedirect();
    const notify = useNotify();
    const { basePath, redirect } = props;
    const form = useForm();

    // I need to set the label dynamically ... how?
    // I also need sth like:
    // if (validationSucceeds()) enable=true

    const handleClick = useCallback(() => {
        // here I need to check the current content of the "status" field.... how?
        form.change('status', { "id": 2, "name": "Vorbereitung begonnen" });
        handleSubmitWithRedirect('list');
    }, [form]);

    return <SaveButton {...props} handleSubmitWithRedirect={handleClick} />;
};

const CustomToolbar = props => (
    <Toolbar {...props} >
        <SaveButton
            label="Speichern"
            redirect="list"
            submitOnEnter={true}
            variant="text"
        />
       <AdvanceWorkflowButton />
    </Toolbar>
);
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...