From e5f260e7c3512bc868a64007a4a63b1dce32f8e0 Mon Sep 17 00:00:00 2001
From: Jessica_Faro <jessica.faro@souunit.com.br>
Date: Mon, 1 Dec 2025 18:04:38 -0300
Subject: [PATCH] =?UTF-8?q?adic=C3=A7oes=20na=20consulta?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/PagesMedico/DoctorAgendamentoManager.jsx | 26 +++++++
 src/PagesMedico/FormNovoRelatorio.jsx        | 47 +++++++----
 src/PagesMedico/styleMedico/Agendamento.css  | 82 +++++++++-----------
 3 files changed, 95 insertions(+), 60 deletions(-)

diff --git a/src/PagesMedico/DoctorAgendamentoManager.jsx b/src/PagesMedico/DoctorAgendamentoManager.jsx
index 567646c..c96cd08 100644
--- a/src/PagesMedico/DoctorAgendamentoManager.jsx
+++ b/src/PagesMedico/DoctorAgendamentoManager.jsx
@@ -1,3 +1,4 @@
+// src/PagesMedico/DoctorAgendamentoManager.jsx
 import React, { useState, useMemo, useEffect, useCallback } from "react";
 import { useNavigate } from "react-router-dom";
 import API_KEY from "../components/utils/apiKeys.js";
@@ -15,6 +16,7 @@ import {
   Edit,
   Trash2,
   CheckCircle,
+  FileText,
 } from "lucide-react";
 import "../pages/style/Agendamento.css";
 import "../pages/style/FilaEspera.css";
@@ -290,6 +292,18 @@ const Agendamento = () => {
     setPageConsulta(true);
   };
 
+  const handleCreateReport = (appointment) => {
+    navigate("/medico/novo-relatorio", {
+      state: {
+        appointment,
+        patient_id: appointment.patient_id,
+        doctor_id: appointment.doctor_id,
+        paciente_nome: appointment.paciente_nome,
+        medico_nome: appointment.medico_nome,
+      },
+    });
+  };
+
   const handleSearchMedicos = (term) => {
     setSearchTermDoctor(term);
     if (term.trim()) {
@@ -631,6 +645,18 @@ const Agendamento = () => {
                                   <Edit size={16} />
                                 </button>
                               )}
+
+                              {app.status !== "cancelled" && (
+                                <button
+                                  className="btn-action btn-report-blue"
+                                  onClick={() => handleCreateReport(app)}
+                                  title="Criar Relatório / Laudo"
+                                  aria-label={`Criar relatório para ${app.paciente_nome}`}
+                                >
+                                  <FileText size={16} />
+                                </button>
+                              )}
+
                               {app.status !== "cancelled" && (
                                 <button
                                   className="btn-action btn-delete"
diff --git a/src/PagesMedico/FormNovoRelatorio.jsx b/src/PagesMedico/FormNovoRelatorio.jsx
index 2f2aabe..4f9dfd0 100644
--- a/src/PagesMedico/FormNovoRelatorio.jsx
+++ b/src/PagesMedico/FormNovoRelatorio.jsx
@@ -1,5 +1,6 @@
+// src/PagesMedico/FormNovoRelatorio.jsx
 import React, { useEffect, useState, useRef } from 'react';
-import { useNavigate } from 'react-router-dom';
+import { useNavigate, useLocation } from 'react-router-dom';
 import API_KEY from '../components/utils/apiKeys';
 import { useAuth } from '../components/utils/AuthProvider';
 import TiptapEditor from './TiptapEditor';
@@ -12,6 +13,7 @@ const FormNovoRelatorio = () => {
   const { getAuthorizationHeader } = useAuth();
   const authHeader = getAuthorizationHeader();
   const navigate = useNavigate();
+  const location = useLocation();
 
   const [patients, setPatients] = useState([]);
   const [doctors, setDoctors] = useState([]);
@@ -33,6 +35,7 @@ const FormNovoRelatorio = () => {
   const [showDoctorDropdown, setShowDoctorDropdown] = useState(false);
   const patientRef = useRef();
   const doctorRef = useRef();
+  const [lockedFromAppointment, setLockedFromAppointment] = useState(false);
 
   useEffect(() => {
     let mounted = true;
@@ -129,7 +132,24 @@ const FormNovoRelatorio = () => {
 
   const handleEditorChange = (html) => setForm(prev => ({ ...prev, contentHtml: html }));
 
-  // 🔹 Agora com created_by sendo o ID do usuário logado
+  useEffect(() => {
+    if (location && location.state && location.state.appointment) {
+      const appt = location.state.appointment;
+      const paciente_nome = location.state.paciente_nome || appt.paciente_nome || '';
+      const medico_nome = location.state.medico_nome || appt.medico_nome || '';
+      setForm(prev => ({
+        ...prev,
+        patient_id: appt.patient_id || prev.patient_id,
+        patient_name: paciente_nome || prev.patient_name,
+        patient_birth: prev.patient_birth || '',
+        doctor_id: appt.doctor_id || prev.doctor_id,
+        doctor_name: medico_nome || prev.doctor_name,
+        contentHtml: generateTemplate(paciente_nome, prev.patient_birth || '', medico_nome)
+      }));
+      setLockedFromAppointment(true);
+    }
+  }, [location]);
+
   const handleSubmit = async (e) => {
     e.preventDefault();
     if (!form.patient_id) return alert('Selecione o paciente (clicando no item) antes de salvar.');
@@ -149,7 +169,6 @@ const FormNovoRelatorio = () => {
         requested_by: form.doctor_name || ''
       };
 
-      // Busca o id do usuário logado (via token)
       let userId = null;
       try {
         const token = authHeader?.replace(/^Bearer\s+/i, '') || '';
@@ -189,8 +208,6 @@ const FormNovoRelatorio = () => {
       }
 
       const created = await res.json();
-      console.log('Relatório criado:', created);
-
       window.dispatchEvent(new Event('reports:refresh'));
       alert('Relatório criado com sucesso!');
       navigate('/medico/relatorios');
@@ -211,11 +228,12 @@ const FormNovoRelatorio = () => {
             <input
               className="form-control"
               placeholder="Comece a digitar (ex.: m para pacientes que começam com m)"
-              value={patientQuery}
-              onChange={(e) => { setPatientQuery(e.target.value); setShowPatientDropdown(true); }}
-              onFocus={() => setShowPatientDropdown(true)}
+              value={lockedFromAppointment ? form.patient_name : patientQuery}
+              onChange={(e) => { if (!lockedFromAppointment) { setPatientQuery(e.target.value); setShowPatientDropdown(true); } }}
+              onFocus={() => { if (!lockedFromAppointment) setShowPatientDropdown(true); }}
+              disabled={lockedFromAppointment}
             />
-            {showPatientDropdown && patientQuery && (
+            {!lockedFromAppointment && showPatientDropdown && patientQuery && (
               <ul className="list-group position-absolute" style={{ zIndex: 50, maxHeight: 220, overflowY: 'auto', width: '100%' }}>
                 {filteredPatients.length > 0 ? filteredPatients.map(p => (
                   <li key={p.id} className="list-group-item list-group-item-action" onClick={() => choosePatient(p)}>
@@ -232,11 +250,12 @@ const FormNovoRelatorio = () => {
             <input
               className="form-control"
               placeholder="Comece a digitar o nome do médico"
-              value={doctorQuery}
-              onChange={(e) => { setDoctorQuery(e.target.value); setShowDoctorDropdown(true); }}
-              onFocus={() => setShowDoctorDropdown(true)}
+              value={lockedFromAppointment ? form.doctor_name : doctorQuery}
+              onChange={(e) => { if (!lockedFromAppointment) { setDoctorQuery(e.target.value); setShowDoctorDropdown(true); } }}
+              onFocus={() => { if (!lockedFromAppointment) setShowDoctorDropdown(true); }}
+              disabled={lockedFromAppointment}
             />
-            {showDoctorDropdown && doctorQuery && (
+            {!lockedFromAppointment && showDoctorDropdown && doctorQuery && (
               <ul className="list-group position-absolute" style={{ zIndex: 50, maxHeight: 220, overflowY: 'auto', width: '100%' }}>
                 {filteredDoctors.length > 0 ? filteredDoctors.map(d => (
                   <li key={d.id} className="list-group-item list-group-item-action" onClick={() => chooseDoctor(d)}>
@@ -261,4 +280,4 @@ const FormNovoRelatorio = () => {
   );
 };
 
-export default FormNovoRelatorio;
\ No newline at end of file
+export default FormNovoRelatorio;
diff --git a/src/PagesMedico/styleMedico/Agendamento.css b/src/PagesMedico/styleMedico/Agendamento.css
index 09cde6f..c4e80f6 100644
--- a/src/PagesMedico/styleMedico/Agendamento.css
+++ b/src/PagesMedico/styleMedico/Agendamento.css
@@ -1,23 +1,19 @@
-/* --- Esconde a barra de unidade e profissional --- */
+/* src/pages/style/Agendamento.css */
 .unidade-selecionarprofissional {
   display: none;
 }
-
-/* --- Posiciona a barra de busca corretamente --- */
 .busca-atendimento {
   display: flex;
-  align-items: center; /* Alinha os itens verticalmente */
-  margin-top: 20px; /* Espaço acima da barra de busca */
-  padding: 0 10px; /* Adiciona um padding lateral para alinhar com o resto */
+  align-items: center;
+  margin-top: 20px;
+  padding: 0 10px;
   gap: 15px;
 }
-
 .busca-atendimento > div:first-child {
-    width: 400px; /* Define um tamanho para a barra de pesquisa */
-    display: flex;
-    align-items: center;
+  width: 400px;
+  display: flex;
+  align-items: center;
 }
-
 .busca-atendimento input {
   margin-left: 8px;
   border-radius: 8px;
@@ -25,7 +21,6 @@
   width: 100%;
   border: 1px solid #ccc;
 }
-
 .busca-atendimento select {
   padding: 8px;
   border-radius: 8px;
@@ -34,8 +29,6 @@
   font-weight: bold;
   border: none;
 }
-
-/* --- Estilos dos botões de Dia, Semana, Mês --- */
 .btn-selecionar-tabeladia,
 .btn-selecionar-tabelasemana,
 .btn-selecionar-tabelames {
@@ -46,15 +39,12 @@
   border-style: hidden;
   cursor: pointer;
 }
-
 .btn-selecionar-tabeladia {
   border-radius: 10px 0px 0px 10px;
 }
-
 .btn-selecionar-tabelames {
   border-radius: 0px 10px 10px 0px;
 }
-
 .btn-selecionar-tabeladia.ativo,
 .btn-selecionar-tabelasemana.ativo,
 .btn-selecionar-tabelames.ativo {
@@ -62,8 +52,6 @@
   border-color: darkcyan;
   font-weight: bolder;
 }
-
-/* --- Container dos botões e legenda --- */
 .btns-e-legenda-container {
   display: flex;
   justify-content: space-between;
@@ -71,13 +59,10 @@
   margin-top: 10px;
   padding: 0 10px;
 }
-
-/* --- Legendas --- */
 .legenda-tabela {
   display: flex;
   gap: 15px;
 }
-
 #status-card-consulta-realizado, .legenda-item-realizado {
   background-color: #b7ffbd;
   border: 3px solid #91d392;
@@ -85,7 +70,6 @@
   font-weight: bold;
   border-radius: 10px;
 }
-
 #status-card-consulta-cancelado, .legenda-item-cancelado {
   background-color: #ffb7cc;
   border: 3px solid #ff6c84;
@@ -93,7 +77,6 @@
   font-weight: bold;
   border-radius: 10px;
 }
-
 #status-card-consulta-confirmado, .legenda-item-confirmado {
   background-color: #eef8fb;
   border: 3px solid #d8dfe7;
@@ -101,7 +84,6 @@
   font-weight: bold;
   border-radius: 10px;
 }
-
 #status-card-consulta-agendado, .legenda-item-agendado {
   background-color: #f7f7c4;
   border: 3px solid #f3ce67;
@@ -109,8 +91,6 @@
   font-weight: bold;
   border-radius: 10px;
 }
-
-/* --- Estrutura Geral --- */
 .calendario {
   border-collapse: collapse;
   width: 100%;
@@ -120,11 +100,9 @@
   border: 1px solid #eee;
   background-color: #ffffff;
 }
-
 .calendario-ou-filaespera {
   margin-top: 0;
 }
-
 .container-btns-agenda-fila_esepera {
   margin-top: 30px;
   display: flex;
@@ -132,7 +110,6 @@
   gap: 20px;
   margin-left: 20px;
 }
-
 .btn-fila-espera,
 .btn-agenda {
   background-color: transparent;
@@ -144,44 +121,35 @@
   font-weight: bold;
   cursor: pointer;
 }
-
 .opc-filaespera-ativo,
 .opc-agenda-ativo {
   color: white;
   background-color: #5980fd;
 }
-
-
-/* Dark mode styles */
 html[data-bs-theme="dark"] {
   background-color: #181a1b;
   color: #e0e0e0;
 }
-
 html[data-bs-theme="dark"] .calendario {
   background-color: #23272a;
   border: 1px solid #333;
   box-shadow: 0 4px 12px rgba(0,0,0,0.25);
 }
-
 html[data-bs-theme="dark"] .busca-atendimento input {
   background-color: #23272a;
   color: #e0e0e0;
   border: 1px solid #444;
 }
-
 html[data-bs-theme="dark"] .busca-atendimento select {
   background-color: #5980fd;
   color: #fff;
 }
-
 html[data-bs-theme="dark"] .btn-selecionar-tabeladia,
 html[data-bs-theme="dark"] .btn-selecionar-tabelasemana,
 html[data-bs-theme="dark"] .btn-selecionar-tabelames {
   background-color: #23272a;
   color: #e0e0e0;
 }
-
 html[data-bs-theme="dark"] .btn-selecionar-tabeladia.ativo,
 html[data-bs-theme="dark"] .btn-selecionar-tabelasemana.ativo,
 html[data-bs-theme="dark"] .btn-selecionar-tabelames.ativo {
@@ -189,44 +157,66 @@ html[data-bs-theme="dark"] .btn-selecionar-tabelames.ativo {
   color: #fff;
   border-color: #3a5ccc;
 }
-
 html[data-bs-theme="dark"] .btn-fila-espera,
 html[data-bs-theme="dark"] .btn-agenda {
   background-color: #23272a;
   color: #e0e0e0;
   border-bottom: 3px solid transparent;
 }
-
 html[data-bs-theme="dark"] .opc-filaespera-ativo,
 html[data-bs-theme="dark"] .opc-agenda-ativo {
   background-color: #5980fd;
   color: #fff;
 }
-
 html[data-bs-theme="dark"] #status-card-consulta-realizado,
 html[data-bs-theme="dark"] .legenda-item-realizado {
   background-color: #1e2e1e;
   border: 3px solid #2e4d2e;
   color: #b7ffbd;
 }
-
 html[data-bs-theme="dark"] #status-card-consulta-cancelado,
 html[data-bs-theme="dark"] .legenda-item-cancelado {
   background-color: #2e1e23;
   border: 3px solid #4d2e36;
   color: #ffb7cc;
 }
-
 html[data-bs-theme="dark"] #status-card-consulta-confirmado,
 html[data-bs-theme="dark"] .legenda-item-confirmado {
   background-color: #1e2327;
   border: 3px solid #2e3a4d;
   color: #eef8fb;
 }
-
 html[data-bs-theme="dark"] #status-card-consulta-agendado,
 html[data-bs-theme="dark"] .legenda-item-agendado {
   background-color: #2e2e1e;
   border: 3px solid #4d4d2e;
   color: #f7f7c4;
-}
\ No newline at end of file
+}
+.appointment-actions .btn-action {
+  margin-left: 6px;
+}
+.btn-action.btn-report-blue {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: 6px;
+  padding: 8px 10px;
+  border-radius: 10px;
+  border: none;
+  cursor: pointer;
+  font-size: 0.95rem;
+  line-height: 1;
+  box-shadow: 0 4px 8px rgba(41, 98, 255, 0.12);
+  transition: transform 0.08s ease, box-shadow 0.12s ease;
+  background: linear-gradient(180deg, #2f6bff 0%, #1e52d6 100%);
+  color: #ffffff;
+}
+.btn-action.btn-report-blue:hover,
+.btn-action.btn-report-blue:focus {
+  transform: translateY(-2px);
+  box-shadow: 0 6px 14px rgba(41, 98, 255, 0.18);
+}
+.btn-action.btn-report-blue svg {
+  stroke: #ffffff;
+  color: #ffffff;
+}