Have a screen with folding folds on tabs in Reset so when I change the previous tab reset

Asked

Viewed 21 times

-2

inserir a descrição da imagem aqui

This is my code from the General Data tab

import { Field, Form, Formik } from "formik";
import React, { useState } from "react";
import { SearchCep } from "../../../../../_metronic/_assets/js/components/SearchCEP";
import { ContactTabDadosGerais } from "./ContactTabDadosGerais";
import { ResponsibleTabGerais } from "./ResponsibleTabGerais";
import { UploadPhotoClient } from "./UploadPhotoClient";



export function TabDadosGerais() {

    // eslint-disable-next-line
    const [nome, setNome] = useState();


    function onSubmit(values) {
        console.log('SUBMIT', values);

    }


    return (
        <>
            <Formik
                onSubmit={onSubmit}
                initialValues={{
                    foto: '',
                    nome: '',
                    fantasia: '',
                    cnpj: '',
                    inscricaomunicipal: '',
                    inscricaoestadual: '',
                }}
            >
                {() => (
                    <Form>
                        <div className="row">
                            <div className="row">
                                <div className="form-group mb-0">
                                    <UploadPhotoClient />
                                </div>
                                
                                <div className="col-10 mb-0">
                                    <div className="row">
                                        <div className="form-group col-sm-7">
                                            <label>Nome</label>
                                            <Field
                                                className="form-control input-boder-color"
                                                required
                                                name="nome"
                                                type="text"
                                                placeholder="Nome ou Razão Social do contato"
                                                value={nome}



                                            />
                                        </div>
                                        <div className="form-group col-sm-3">
                                            <label>Tipo de Pessoa</label>
                                            <Field className="form-control input-boder-color" component="select" name="tipodepessoa">
                                                <option value="pessoajuridica">Pessoa Jurídica</option>
                                                <option value="Pessoafisica">Pessoa Física</option>
                                            </Field>
                                        </div>
                                        <div className="form-group col-sm-3">
                                            <label>Fantasia</label>
                                            <Field className="form-control input-boder-color" required name="fantasia" type="text" />
                                        </div>
                                        <div className="form-group col-sm-3">
                                            <label>CNPJ</label>
                                            <Field className="form-control input-boder-color" required name="cnpj" type="text" />
                                        </div>
                                        <div className="form-group col-sm-3">
                                            <label>inscrição Munipal</label>
                                            <Field className="form-control input-boder-color" required name="IM" type="text" />
                                        </div>
                                        <div className="form-group col-sm-3">
                                            <label>Inscrição Estadual</label>
                                            <Field className="form-control input-boder-color" required name="inscricaoestadual" />
                                        </div>
                                        <div className="form-group col-sm-3">
                                            <label>Contribuinte</label>
                                            <Field className="form-control input-boder-color" name="contribuinte" component="select">
                                                <option value="0">0 - Não Informado</option>
                                                <option value="1">1 - Contribuinte ICMS</option>
                                                <option value="2">2 - Contribuinte Isento de Inscrição no cadastro de Contribuinte do ICMS</option>
                                                <option value="9">9 - não contribuinte, que pode ou nao Possuir Inscrição Estadual no Cadastro de Contribuinte do ICMS</option>
                                            </Field>
                                        </div>
                                        <div className="form-group col-sm-3">
                                            <label>Tipo de Contato</label>
                                            <Field className="form-control input-boder-color" name="tipocontato" component="select">
                                                <option value="">Selecione</option>
                                                <option value="pessoaF">Pessoa Física</option>
                                                <option value="pessoaJ">Pessoa Jurídica</option>
                                                <option value="fprnecedor">Fornecedor</option>
                                                <option value="transportadora">Transportadora</option>
                                            </Field>
                                        </div>
                                        <div className="form-group col-sm-3">
                                            <label>Tipo de Cadastro</label>
                                            <Field className="form-control input-boder-color" name="tipocadastro" component="select">
                                                <option value="normal">Normal</option>
                                                <option value="crediario">Crediário</option>
                                            </Field>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <hr />
                    </Form>

                )}

            </Formik>
            <h3 className="page-header first">Endereço</h3>
            <SearchCep />
            <ContactTabDadosGerais />
            <ResponsibleTabGerais />





        </>

    );

}
  • Reset because the component is mounted again. You will need to make use of the initialValues.

  • could make an example for me friend

No answers

Browser other questions tagged

You are not signed in. Login or sign up in order to post.