form de agendar consulta melhorado
This commit is contained in:
parent
0a60dd717c
commit
d91b5cfebe
@ -1,80 +1,122 @@
|
||||
import React from 'react'
|
||||
import React from "react";
|
||||
import InputMask from "react-input-mask";
|
||||
|
||||
const FormNovaConsulta = ({ onCancel }) => {
|
||||
const handleSubmit = (e) => {
|
||||
e.preventDefault();
|
||||
alert("Agendamento salvo!");
|
||||
};
|
||||
|
||||
const FormNovaConsulta = ( {onCancel}) => {
|
||||
return (
|
||||
<div>
|
||||
<h1>Novo Agendamento</h1>
|
||||
|
||||
<form action="">
|
||||
<form onSubmit={handleSubmit}>
|
||||
<h2>Informações do paciente</h2>
|
||||
|
||||
<h2>Informações do paciente</h2>
|
||||
<label htmlFor="nome">Nome *</label>
|
||||
<input type="text" id='nome' />
|
||||
<label>Nome *</label>
|
||||
<input type="text" name="nome" placeholder="Insira o nome do paciente" required />
|
||||
<br></br>
|
||||
|
||||
<label htmlFor="cpf" >CPF do paciente</label>
|
||||
<input type="text" id='cpf' />
|
||||
<label>CPF do paciente</label>
|
||||
<InputMask mask="999.999.999-99" placeholder="000.000.000-00">
|
||||
{(inputProps) => <input {...inputProps} type="text" name="cpf" />}
|
||||
</InputMask>
|
||||
<br></br>
|
||||
|
||||
<label htmlFor="dataNascimento">Data de nascimeto *</label>
|
||||
<input type="text" id='dataNascimento' />
|
||||
<label>RG</label>
|
||||
<input type="text" name="rg" placeholder="Insira o nº do RG" maxLength={9} />
|
||||
<br></br>
|
||||
|
||||
<label htmlFor="telefone"> Telefone</label>
|
||||
<input type="text" id='telefone' />
|
||||
<label>Data de nascimento *</label>
|
||||
<input type="date" name="dataNascimento" required />
|
||||
<br></br>
|
||||
|
||||
<label htmlFor="email">E-mail</label>
|
||||
<input type="email" id='email' />
|
||||
<label>Telefone</label>
|
||||
<InputMask mask="(99) 99999-9999" placeholder="(99) 99999-9999">
|
||||
{(inputProps) => <input {...inputProps} type="tel" name="telefone" />}
|
||||
</InputMask>
|
||||
<br />
|
||||
|
||||
<label htmlFor="nome">Convenio</label>
|
||||
<select>
|
||||
<option value="">Particular</option>
|
||||
<option value="">Público</option>
|
||||
<label>E-mail</label>
|
||||
<input type="email" name="email" placeholder="Email" />
|
||||
<br></br>
|
||||
|
||||
</select>
|
||||
|
||||
<label htmlFor="matricula">Matrícula</label>
|
||||
<input type="text" id='matricula' />
|
||||
|
||||
<label htmlFor="validade">Validade</label>
|
||||
<input type="text" id='validade' />
|
||||
<label>Convênio</label>
|
||||
<select name="convenio">
|
||||
<option value="particular">Particular</option>
|
||||
<option value="publico">Público</option>
|
||||
</select>
|
||||
<br></br>
|
||||
|
||||
|
||||
<label>Matrícula</label>
|
||||
<input type="text" name="matricula" placeholder="000000000" />
|
||||
<br></br>
|
||||
|
||||
<h2>Informações do atendimento</h2>
|
||||
<label htmlFor="nomedoProfissional">Nome do profissional *</label>
|
||||
<input type="text" id='nomedoProfissional' />
|
||||
<label htmlFor="TipodeAtendimento">Tipo de atendimento *</label>
|
||||
<input type="text" id='TipodeAtendimento' />
|
||||
<label>Validade</label>
|
||||
<InputMask mask="99/99/9999" placeholder="00/00/0000">
|
||||
{(inputProps) => <input {...inputProps} type="text" name="validade" />}
|
||||
</InputMask>
|
||||
|
||||
<label htmlFor="">Unidade *</label>
|
||||
<select name="" id="">
|
||||
<option value="">Unidade Centro</option>
|
||||
<option value="">Unidade Leste</option>
|
||||
</select>
|
||||
<br></br>
|
||||
|
||||
<label htmlFor="DataAtendimento">Data *</label>
|
||||
<input type="text" id='DataAtendimento' />
|
||||
<h3>Informações adicionais</h3>
|
||||
<button type="button">Documentos e anexos</button>
|
||||
|
||||
<label htmlFor="TipodeAtendimento">Tipo de atendimento *</label>
|
||||
<input type="text" id='TipodeAtendimento' />
|
||||
<h2>Informações do atendimento</h2>
|
||||
|
||||
<label htmlFor="inicioAtendimento">Inicio</label>
|
||||
<input type="text" id='inicioAtendimento' />
|
||||
<label>Nome do profissional *</label>
|
||||
<input type="text" name="profissional" required />
|
||||
|
||||
<label>Tipo de atendimento *</label>
|
||||
<input type="text" name="tipoAtendimento" required />
|
||||
|
||||
<label htmlFor="terminoAtendimento">Término</label>
|
||||
<input type="text" id='terminoAtendimento'/>
|
||||
<label>Unidade *</label>
|
||||
<select name="unidade">
|
||||
<option value="centro">Núcleo de Especialidades Integradas</option>
|
||||
<option value="leste">Unidade Leste</option>
|
||||
</select>
|
||||
|
||||
<label htmlFor="">Profissional Solicitante</label>
|
||||
<select name="" id="">
|
||||
<option value="">Secretária</option>
|
||||
<option value="">Médico</option>
|
||||
</select>
|
||||
<label>Data *</label>
|
||||
<input type="date" name="dataAtendimento" required />
|
||||
|
||||
<button type='submit' >Saqlvar agendamento</button>
|
||||
<button onClick={() => onCancel()} >Cancelar</button>
|
||||
<label>Início *</label>
|
||||
<input type="time" name="inicio" required />
|
||||
|
||||
</form>
|
||||
<label>Término *</label>
|
||||
<input type="time" name="termino" required />
|
||||
|
||||
<label>Profissional solicitante</label>
|
||||
<select name="solicitante">
|
||||
<option value="">Selecione o solicitante</option>
|
||||
<option value="secretaria">Secretária</option>
|
||||
<option value="medico">Médico</option>
|
||||
</select>
|
||||
|
||||
<label>Observações</label>
|
||||
<textarea name="observacoes"></textarea>
|
||||
|
||||
<label>
|
||||
<input type="checkbox" name="reembolso" /> Pagamento via Reembolso
|
||||
</label>
|
||||
|
||||
<label>
|
||||
<input type="checkbox" name="imprimirEtiqueta" /> Imprimir na Etiqueta / Pulseira
|
||||
</label>
|
||||
|
||||
<h3>Acessibilidade</h3>
|
||||
<button type="button"></button>
|
||||
<button type="button"></button>
|
||||
<button type="button"></button>
|
||||
<button type="button"></button>
|
||||
|
||||
<br /><br />
|
||||
<button type="submit">Salvar agendamento</button>
|
||||
<button type="button" onClick={onCancel}>Cancelar</button>
|
||||
</form>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
);
|
||||
};
|
||||
|
||||
export default FormNovaConsulta
|
||||
export default FormNovaConsulta;
|
||||
@ -7,7 +7,7 @@ import FormNovaConsulta from '../components/AgendarConsulta/FormNovaConsulta';
|
||||
import { useState, useEffect } from 'react';
|
||||
import dayjs from 'dayjs'
|
||||
|
||||
const Agendamento = ( {setCurrentPage }) => {
|
||||
const Agendamento = () => {
|
||||
|
||||
|
||||
const ListarDiasdoMes = (ano, mes) => {
|
||||
@ -50,7 +50,7 @@ const Agendamento = ( {setCurrentPage }) => {
|
||||
}
|
||||
|
||||
const [tabela, setTabela] = useState('diario')
|
||||
const [PageNovaConsulta, setPageConsulta] = useState(false)
|
||||
const [PageNovaConsulta, setPageConsulta] = useState(true)
|
||||
|
||||
const handleClickAgendamento = (agendamento) => {
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user