adicionando paciente

This commit is contained in:
GilenoNeto901 2025-12-02 04:16:13 -03:00
commit 07ed113291
34 changed files with 3315 additions and 1658 deletions

251
package-lock.json generated
View File

@ -2631,9 +2631,9 @@
} }
}, },
"node_modules/@ckeditor/ckeditor5-alignment/node_modules/color-name": { "node_modules/@ckeditor/ckeditor5-alignment/node_modules/color-name": {
"version": "2.0.2", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-2.0.2.tgz", "resolved": "https://registry.npmjs.org/color-name/-/color-name-2.1.0.tgz",
"integrity": "sha512-9vEt7gE16EW7Eu7pvZnR0abW9z6ufzhXxGXZEVU9IqPdlsUiMwJeJfRtq0zePUmnbHGT9zajca7mX8zgoayo4A==", "integrity": "sha512-1bPaDNFm0axzE4MEAzKPuqKWeRaT43U/hyxKPBdqTfmPF+d6n7FSoTFxLVULUJOmiLp01KjhIPPH+HrXZJN4Rg==",
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
"engines": { "engines": {
@ -3144,9 +3144,9 @@
} }
}, },
"node_modules/@ckeditor/ckeditor5-autosave/node_modules/color-name": { "node_modules/@ckeditor/ckeditor5-autosave/node_modules/color-name": {
"version": "2.0.2", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-2.0.2.tgz", "resolved": "https://registry.npmjs.org/color-name/-/color-name-2.1.0.tgz",
"integrity": "sha512-9vEt7gE16EW7Eu7pvZnR0abW9z6ufzhXxGXZEVU9IqPdlsUiMwJeJfRtq0zePUmnbHGT9zajca7mX8zgoayo4A==", "integrity": "sha512-1bPaDNFm0axzE4MEAzKPuqKWeRaT43U/hyxKPBdqTfmPF+d6n7FSoTFxLVULUJOmiLp01KjhIPPH+HrXZJN4Rg==",
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
"engines": { "engines": {
@ -4126,9 +4126,9 @@
} }
}, },
"node_modules/@ckeditor/ckeditor5-bookmark/node_modules/color-name": { "node_modules/@ckeditor/ckeditor5-bookmark/node_modules/color-name": {
"version": "2.0.2", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-2.0.2.tgz", "resolved": "https://registry.npmjs.org/color-name/-/color-name-2.1.0.tgz",
"integrity": "sha512-9vEt7gE16EW7Eu7pvZnR0abW9z6ufzhXxGXZEVU9IqPdlsUiMwJeJfRtq0zePUmnbHGT9zajca7mX8zgoayo4A==", "integrity": "sha512-1bPaDNFm0axzE4MEAzKPuqKWeRaT43U/hyxKPBdqTfmPF+d6n7FSoTFxLVULUJOmiLp01KjhIPPH+HrXZJN4Rg==",
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
"engines": { "engines": {
@ -7241,9 +7241,9 @@
} }
}, },
"node_modules/@ckeditor/ckeditor5-clipboard/node_modules/color-name": { "node_modules/@ckeditor/ckeditor5-clipboard/node_modules/color-name": {
"version": "2.0.2", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-2.0.2.tgz", "resolved": "https://registry.npmjs.org/color-name/-/color-name-2.1.0.tgz",
"integrity": "sha512-9vEt7gE16EW7Eu7pvZnR0abW9z6ufzhXxGXZEVU9IqPdlsUiMwJeJfRtq0zePUmnbHGT9zajca7mX8zgoayo4A==", "integrity": "sha512-1bPaDNFm0axzE4MEAzKPuqKWeRaT43U/hyxKPBdqTfmPF+d6n7FSoTFxLVULUJOmiLp01KjhIPPH+HrXZJN4Rg==",
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
"engines": { "engines": {
@ -7758,9 +7758,9 @@
} }
}, },
"node_modules/@ckeditor/ckeditor5-code-block/node_modules/color-name": { "node_modules/@ckeditor/ckeditor5-code-block/node_modules/color-name": {
"version": "2.0.2", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-2.0.2.tgz", "resolved": "https://registry.npmjs.org/color-name/-/color-name-2.1.0.tgz",
"integrity": "sha512-9vEt7gE16EW7Eu7pvZnR0abW9z6ufzhXxGXZEVU9IqPdlsUiMwJeJfRtq0zePUmnbHGT9zajca7mX8zgoayo4A==", "integrity": "sha512-1bPaDNFm0axzE4MEAzKPuqKWeRaT43U/hyxKPBdqTfmPF+d6n7FSoTFxLVULUJOmiLp01KjhIPPH+HrXZJN4Rg==",
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
"engines": { "engines": {
@ -8284,9 +8284,9 @@
} }
}, },
"node_modules/@ckeditor/ckeditor5-editor-balloon/node_modules/color-name": { "node_modules/@ckeditor/ckeditor5-editor-balloon/node_modules/color-name": {
"version": "2.0.2", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-2.0.2.tgz", "resolved": "https://registry.npmjs.org/color-name/-/color-name-2.1.0.tgz",
"integrity": "sha512-9vEt7gE16EW7Eu7pvZnR0abW9z6ufzhXxGXZEVU9IqPdlsUiMwJeJfRtq0zePUmnbHGT9zajca7mX8zgoayo4A==", "integrity": "sha512-1bPaDNFm0axzE4MEAzKPuqKWeRaT43U/hyxKPBdqTfmPF+d6n7FSoTFxLVULUJOmiLp01KjhIPPH+HrXZJN4Rg==",
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
"engines": { "engines": {
@ -8800,9 +8800,9 @@
} }
}, },
"node_modules/@ckeditor/ckeditor5-editor-decoupled/node_modules/color-name": { "node_modules/@ckeditor/ckeditor5-editor-decoupled/node_modules/color-name": {
"version": "2.0.2", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-2.0.2.tgz", "resolved": "https://registry.npmjs.org/color-name/-/color-name-2.1.0.tgz",
"integrity": "sha512-9vEt7gE16EW7Eu7pvZnR0abW9z6ufzhXxGXZEVU9IqPdlsUiMwJeJfRtq0zePUmnbHGT9zajca7mX8zgoayo4A==", "integrity": "sha512-1bPaDNFm0axzE4MEAzKPuqKWeRaT43U/hyxKPBdqTfmPF+d6n7FSoTFxLVULUJOmiLp01KjhIPPH+HrXZJN4Rg==",
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
"engines": { "engines": {
@ -8903,9 +8903,9 @@
} }
}, },
"node_modules/@ckeditor/ckeditor5-editor-inline/node_modules/color-name": { "node_modules/@ckeditor/ckeditor5-editor-inline/node_modules/color-name": {
"version": "2.0.2", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-2.0.2.tgz", "resolved": "https://registry.npmjs.org/color-name/-/color-name-2.1.0.tgz",
"integrity": "sha512-9vEt7gE16EW7Eu7pvZnR0abW9z6ufzhXxGXZEVU9IqPdlsUiMwJeJfRtq0zePUmnbHGT9zajca7mX8zgoayo4A==", "integrity": "sha512-1bPaDNFm0axzE4MEAzKPuqKWeRaT43U/hyxKPBdqTfmPF+d6n7FSoTFxLVULUJOmiLp01KjhIPPH+HrXZJN4Rg==",
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
"engines": { "engines": {
@ -9006,9 +9006,9 @@
} }
}, },
"node_modules/@ckeditor/ckeditor5-editor-multi-root/node_modules/color-name": { "node_modules/@ckeditor/ckeditor5-editor-multi-root/node_modules/color-name": {
"version": "2.0.2", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-2.0.2.tgz", "resolved": "https://registry.npmjs.org/color-name/-/color-name-2.1.0.tgz",
"integrity": "sha512-9vEt7gE16EW7Eu7pvZnR0abW9z6ufzhXxGXZEVU9IqPdlsUiMwJeJfRtq0zePUmnbHGT9zajca7mX8zgoayo4A==", "integrity": "sha512-1bPaDNFm0axzE4MEAzKPuqKWeRaT43U/hyxKPBdqTfmPF+d6n7FSoTFxLVULUJOmiLp01KjhIPPH+HrXZJN4Rg==",
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
"engines": { "engines": {
@ -9125,9 +9125,9 @@
} }
}, },
"node_modules/@ckeditor/ckeditor5-emoji/node_modules/color-name": { "node_modules/@ckeditor/ckeditor5-emoji/node_modules/color-name": {
"version": "2.0.2", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-2.0.2.tgz", "resolved": "https://registry.npmjs.org/color-name/-/color-name-2.1.0.tgz",
"integrity": "sha512-9vEt7gE16EW7Eu7pvZnR0abW9z6ufzhXxGXZEVU9IqPdlsUiMwJeJfRtq0zePUmnbHGT9zajca7mX8zgoayo4A==", "integrity": "sha512-1bPaDNFm0axzE4MEAzKPuqKWeRaT43U/hyxKPBdqTfmPF+d6n7FSoTFxLVULUJOmiLp01KjhIPPH+HrXZJN4Rg==",
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
"engines": { "engines": {
@ -9235,9 +9235,9 @@
} }
}, },
"node_modules/@ckeditor/ckeditor5-enter/node_modules/color-name": { "node_modules/@ckeditor/ckeditor5-enter/node_modules/color-name": {
"version": "2.0.2", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-2.0.2.tgz", "resolved": "https://registry.npmjs.org/color-name/-/color-name-2.1.0.tgz",
"integrity": "sha512-9vEt7gE16EW7Eu7pvZnR0abW9z6ufzhXxGXZEVU9IqPdlsUiMwJeJfRtq0zePUmnbHGT9zajca7mX8zgoayo4A==", "integrity": "sha512-1bPaDNFm0axzE4MEAzKPuqKWeRaT43U/hyxKPBdqTfmPF+d6n7FSoTFxLVULUJOmiLp01KjhIPPH+HrXZJN4Rg==",
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
"engines": { "engines": {
@ -9750,9 +9750,9 @@
} }
}, },
"node_modules/@ckeditor/ckeditor5-find-and-replace/node_modules/color-name": { "node_modules/@ckeditor/ckeditor5-find-and-replace/node_modules/color-name": {
"version": "2.0.2", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-2.0.2.tgz", "resolved": "https://registry.npmjs.org/color-name/-/color-name-2.1.0.tgz",
"integrity": "sha512-9vEt7gE16EW7Eu7pvZnR0abW9z6ufzhXxGXZEVU9IqPdlsUiMwJeJfRtq0zePUmnbHGT9zajca7mX8zgoayo4A==", "integrity": "sha512-1bPaDNFm0axzE4MEAzKPuqKWeRaT43U/hyxKPBdqTfmPF+d6n7FSoTFxLVULUJOmiLp01KjhIPPH+HrXZJN4Rg==",
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
"engines": { "engines": {
@ -9853,9 +9853,9 @@
} }
}, },
"node_modules/@ckeditor/ckeditor5-font/node_modules/color-name": { "node_modules/@ckeditor/ckeditor5-font/node_modules/color-name": {
"version": "2.0.2", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-2.0.2.tgz", "resolved": "https://registry.npmjs.org/color-name/-/color-name-2.1.0.tgz",
"integrity": "sha512-9vEt7gE16EW7Eu7pvZnR0abW9z6ufzhXxGXZEVU9IqPdlsUiMwJeJfRtq0zePUmnbHGT9zajca7mX8zgoayo4A==", "integrity": "sha512-1bPaDNFm0axzE4MEAzKPuqKWeRaT43U/hyxKPBdqTfmPF+d6n7FSoTFxLVULUJOmiLp01KjhIPPH+HrXZJN4Rg==",
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
"engines": { "engines": {
@ -9972,9 +9972,9 @@
} }
}, },
"node_modules/@ckeditor/ckeditor5-fullscreen/node_modules/color-name": { "node_modules/@ckeditor/ckeditor5-fullscreen/node_modules/color-name": {
"version": "2.0.2", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-2.0.2.tgz", "resolved": "https://registry.npmjs.org/color-name/-/color-name-2.1.0.tgz",
"integrity": "sha512-9vEt7gE16EW7Eu7pvZnR0abW9z6ufzhXxGXZEVU9IqPdlsUiMwJeJfRtq0zePUmnbHGT9zajca7mX8zgoayo4A==", "integrity": "sha512-1bPaDNFm0axzE4MEAzKPuqKWeRaT43U/hyxKPBdqTfmPF+d6n7FSoTFxLVULUJOmiLp01KjhIPPH+HrXZJN4Rg==",
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
"engines": { "engines": {
@ -10486,9 +10486,9 @@
} }
}, },
"node_modules/@ckeditor/ckeditor5-highlight/node_modules/color-name": { "node_modules/@ckeditor/ckeditor5-highlight/node_modules/color-name": {
"version": "2.0.2", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-2.0.2.tgz", "resolved": "https://registry.npmjs.org/color-name/-/color-name-2.1.0.tgz",
"integrity": "sha512-9vEt7gE16EW7Eu7pvZnR0abW9z6ufzhXxGXZEVU9IqPdlsUiMwJeJfRtq0zePUmnbHGT9zajca7mX8zgoayo4A==", "integrity": "sha512-1bPaDNFm0axzE4MEAzKPuqKWeRaT43U/hyxKPBdqTfmPF+d6n7FSoTFxLVULUJOmiLp01KjhIPPH+HrXZJN4Rg==",
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
"engines": { "engines": {
@ -10589,9 +10589,9 @@
} }
}, },
"node_modules/@ckeditor/ckeditor5-horizontal-line/node_modules/color-name": { "node_modules/@ckeditor/ckeditor5-horizontal-line/node_modules/color-name": {
"version": "2.0.2", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-2.0.2.tgz", "resolved": "https://registry.npmjs.org/color-name/-/color-name-2.1.0.tgz",
"integrity": "sha512-9vEt7gE16EW7Eu7pvZnR0abW9z6ufzhXxGXZEVU9IqPdlsUiMwJeJfRtq0zePUmnbHGT9zajca7mX8zgoayo4A==", "integrity": "sha512-1bPaDNFm0axzE4MEAzKPuqKWeRaT43U/hyxKPBdqTfmPF+d6n7FSoTFxLVULUJOmiLp01KjhIPPH+HrXZJN4Rg==",
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
"engines": { "engines": {
@ -10692,9 +10692,9 @@
} }
}, },
"node_modules/@ckeditor/ckeditor5-html-embed/node_modules/color-name": { "node_modules/@ckeditor/ckeditor5-html-embed/node_modules/color-name": {
"version": "2.0.2", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-2.0.2.tgz", "resolved": "https://registry.npmjs.org/color-name/-/color-name-2.1.0.tgz",
"integrity": "sha512-9vEt7gE16EW7Eu7pvZnR0abW9z6ufzhXxGXZEVU9IqPdlsUiMwJeJfRtq0zePUmnbHGT9zajca7mX8zgoayo4A==", "integrity": "sha512-1bPaDNFm0axzE4MEAzKPuqKWeRaT43U/hyxKPBdqTfmPF+d6n7FSoTFxLVULUJOmiLp01KjhIPPH+HrXZJN4Rg==",
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
"engines": { "engines": {
@ -10902,9 +10902,9 @@
} }
}, },
"node_modules/@ckeditor/ckeditor5-html-support/node_modules/color-name": { "node_modules/@ckeditor/ckeditor5-html-support/node_modules/color-name": {
"version": "2.0.2", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-2.0.2.tgz", "resolved": "https://registry.npmjs.org/color-name/-/color-name-2.1.0.tgz",
"integrity": "sha512-9vEt7gE16EW7Eu7pvZnR0abW9z6ufzhXxGXZEVU9IqPdlsUiMwJeJfRtq0zePUmnbHGT9zajca7mX8zgoayo4A==", "integrity": "sha512-1bPaDNFm0axzE4MEAzKPuqKWeRaT43U/hyxKPBdqTfmPF+d6n7FSoTFxLVULUJOmiLp01KjhIPPH+HrXZJN4Rg==",
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
"engines": { "engines": {
@ -11848,9 +11848,9 @@
} }
}, },
"node_modules/@ckeditor/ckeditor5-language/node_modules/color-name": { "node_modules/@ckeditor/ckeditor5-language/node_modules/color-name": {
"version": "2.0.2", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-2.0.2.tgz", "resolved": "https://registry.npmjs.org/color-name/-/color-name-2.1.0.tgz",
"integrity": "sha512-9vEt7gE16EW7Eu7pvZnR0abW9z6ufzhXxGXZEVU9IqPdlsUiMwJeJfRtq0zePUmnbHGT9zajca7mX8zgoayo4A==", "integrity": "sha512-1bPaDNFm0axzE4MEAzKPuqKWeRaT43U/hyxKPBdqTfmPF+d6n7FSoTFxLVULUJOmiLp01KjhIPPH+HrXZJN4Rg==",
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
"engines": { "engines": {
@ -12790,9 +12790,9 @@
} }
}, },
"node_modules/@ckeditor/ckeditor5-markdown-gfm/node_modules/color-name": { "node_modules/@ckeditor/ckeditor5-markdown-gfm/node_modules/color-name": {
"version": "2.0.2", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-2.0.2.tgz", "resolved": "https://registry.npmjs.org/color-name/-/color-name-2.1.0.tgz",
"integrity": "sha512-9vEt7gE16EW7Eu7pvZnR0abW9z6ufzhXxGXZEVU9IqPdlsUiMwJeJfRtq0zePUmnbHGT9zajca7mX8zgoayo4A==", "integrity": "sha512-1bPaDNFm0axzE4MEAzKPuqKWeRaT43U/hyxKPBdqTfmPF+d6n7FSoTFxLVULUJOmiLp01KjhIPPH+HrXZJN4Rg==",
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
"engines": { "engines": {
@ -13319,9 +13319,9 @@
} }
}, },
"node_modules/@ckeditor/ckeditor5-mention/node_modules/color-name": { "node_modules/@ckeditor/ckeditor5-mention/node_modules/color-name": {
"version": "2.0.2", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-2.0.2.tgz", "resolved": "https://registry.npmjs.org/color-name/-/color-name-2.1.0.tgz",
"integrity": "sha512-9vEt7gE16EW7Eu7pvZnR0abW9z6ufzhXxGXZEVU9IqPdlsUiMwJeJfRtq0zePUmnbHGT9zajca7mX8zgoayo4A==", "integrity": "sha512-1bPaDNFm0axzE4MEAzKPuqKWeRaT43U/hyxKPBdqTfmPF+d6n7FSoTFxLVULUJOmiLp01KjhIPPH+HrXZJN4Rg==",
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
"engines": { "engines": {
@ -13421,9 +13421,9 @@
} }
}, },
"node_modules/@ckeditor/ckeditor5-minimap/node_modules/color-name": { "node_modules/@ckeditor/ckeditor5-minimap/node_modules/color-name": {
"version": "2.0.2", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-2.0.2.tgz", "resolved": "https://registry.npmjs.org/color-name/-/color-name-2.1.0.tgz",
"integrity": "sha512-9vEt7gE16EW7Eu7pvZnR0abW9z6ufzhXxGXZEVU9IqPdlsUiMwJeJfRtq0zePUmnbHGT9zajca7mX8zgoayo4A==", "integrity": "sha512-1bPaDNFm0axzE4MEAzKPuqKWeRaT43U/hyxKPBdqTfmPF+d6n7FSoTFxLVULUJOmiLp01KjhIPPH+HrXZJN4Rg==",
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
"engines": { "engines": {
@ -13524,9 +13524,9 @@
} }
}, },
"node_modules/@ckeditor/ckeditor5-page-break/node_modules/color-name": { "node_modules/@ckeditor/ckeditor5-page-break/node_modules/color-name": {
"version": "2.0.2", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-2.0.2.tgz", "resolved": "https://registry.npmjs.org/color-name/-/color-name-2.1.0.tgz",
"integrity": "sha512-9vEt7gE16EW7Eu7pvZnR0abW9z6ufzhXxGXZEVU9IqPdlsUiMwJeJfRtq0zePUmnbHGT9zajca7mX8zgoayo4A==", "integrity": "sha512-1bPaDNFm0axzE4MEAzKPuqKWeRaT43U/hyxKPBdqTfmPF+d6n7FSoTFxLVULUJOmiLp01KjhIPPH+HrXZJN4Rg==",
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
"engines": { "engines": {
@ -14062,9 +14062,9 @@
} }
}, },
"node_modules/@ckeditor/ckeditor5-remove-format/node_modules/color-name": { "node_modules/@ckeditor/ckeditor5-remove-format/node_modules/color-name": {
"version": "2.0.2", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-2.0.2.tgz", "resolved": "https://registry.npmjs.org/color-name/-/color-name-2.1.0.tgz",
"integrity": "sha512-9vEt7gE16EW7Eu7pvZnR0abW9z6ufzhXxGXZEVU9IqPdlsUiMwJeJfRtq0zePUmnbHGT9zajca7mX8zgoayo4A==", "integrity": "sha512-1bPaDNFm0axzE4MEAzKPuqKWeRaT43U/hyxKPBdqTfmPF+d6n7FSoTFxLVULUJOmiLp01KjhIPPH+HrXZJN4Rg==",
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
"engines": { "engines": {
@ -14165,9 +14165,9 @@
} }
}, },
"node_modules/@ckeditor/ckeditor5-restricted-editing/node_modules/color-name": { "node_modules/@ckeditor/ckeditor5-restricted-editing/node_modules/color-name": {
"version": "2.0.2", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-2.0.2.tgz", "resolved": "https://registry.npmjs.org/color-name/-/color-name-2.1.0.tgz",
"integrity": "sha512-9vEt7gE16EW7Eu7pvZnR0abW9z6ufzhXxGXZEVU9IqPdlsUiMwJeJfRtq0zePUmnbHGT9zajca7mX8zgoayo4A==", "integrity": "sha512-1bPaDNFm0axzE4MEAzKPuqKWeRaT43U/hyxKPBdqTfmPF+d6n7FSoTFxLVULUJOmiLp01KjhIPPH+HrXZJN4Rg==",
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
"engines": { "engines": {
@ -14267,9 +14267,9 @@
} }
}, },
"node_modules/@ckeditor/ckeditor5-select-all/node_modules/color-name": { "node_modules/@ckeditor/ckeditor5-select-all/node_modules/color-name": {
"version": "2.0.2", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-2.0.2.tgz", "resolved": "https://registry.npmjs.org/color-name/-/color-name-2.1.0.tgz",
"integrity": "sha512-9vEt7gE16EW7Eu7pvZnR0abW9z6ufzhXxGXZEVU9IqPdlsUiMwJeJfRtq0zePUmnbHGT9zajca7mX8zgoayo4A==", "integrity": "sha512-1bPaDNFm0axzE4MEAzKPuqKWeRaT43U/hyxKPBdqTfmPF+d6n7FSoTFxLVULUJOmiLp01KjhIPPH+HrXZJN4Rg==",
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
"engines": { "engines": {
@ -14369,9 +14369,9 @@
} }
}, },
"node_modules/@ckeditor/ckeditor5-show-blocks/node_modules/color-name": { "node_modules/@ckeditor/ckeditor5-show-blocks/node_modules/color-name": {
"version": "2.0.2", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-2.0.2.tgz", "resolved": "https://registry.npmjs.org/color-name/-/color-name-2.1.0.tgz",
"integrity": "sha512-9vEt7gE16EW7Eu7pvZnR0abW9z6ufzhXxGXZEVU9IqPdlsUiMwJeJfRtq0zePUmnbHGT9zajca7mX8zgoayo4A==", "integrity": "sha512-1bPaDNFm0axzE4MEAzKPuqKWeRaT43U/hyxKPBdqTfmPF+d6n7FSoTFxLVULUJOmiLp01KjhIPPH+HrXZJN4Rg==",
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
"engines": { "engines": {
@ -14472,9 +14472,9 @@
} }
}, },
"node_modules/@ckeditor/ckeditor5-source-editing/node_modules/color-name": { "node_modules/@ckeditor/ckeditor5-source-editing/node_modules/color-name": {
"version": "2.0.2", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-2.0.2.tgz", "resolved": "https://registry.npmjs.org/color-name/-/color-name-2.1.0.tgz",
"integrity": "sha512-9vEt7gE16EW7Eu7pvZnR0abW9z6ufzhXxGXZEVU9IqPdlsUiMwJeJfRtq0zePUmnbHGT9zajca7mX8zgoayo4A==", "integrity": "sha512-1bPaDNFm0axzE4MEAzKPuqKWeRaT43U/hyxKPBdqTfmPF+d6n7FSoTFxLVULUJOmiLp01KjhIPPH+HrXZJN4Rg==",
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
"engines": { "engines": {
@ -14588,9 +14588,9 @@
} }
}, },
"node_modules/@ckeditor/ckeditor5-special-characters/node_modules/color-name": { "node_modules/@ckeditor/ckeditor5-special-characters/node_modules/color-name": {
"version": "2.0.2", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-2.0.2.tgz", "resolved": "https://registry.npmjs.org/color-name/-/color-name-2.1.0.tgz",
"integrity": "sha512-9vEt7gE16EW7Eu7pvZnR0abW9z6ufzhXxGXZEVU9IqPdlsUiMwJeJfRtq0zePUmnbHGT9zajca7mX8zgoayo4A==", "integrity": "sha512-1bPaDNFm0axzE4MEAzKPuqKWeRaT43U/hyxKPBdqTfmPF+d6n7FSoTFxLVULUJOmiLp01KjhIPPH+HrXZJN4Rg==",
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
"engines": { "engines": {
@ -14744,9 +14744,9 @@
} }
}, },
"node_modules/@ckeditor/ckeditor5-style/node_modules/color-name": { "node_modules/@ckeditor/ckeditor5-style/node_modules/color-name": {
"version": "2.0.2", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-2.0.2.tgz", "resolved": "https://registry.npmjs.org/color-name/-/color-name-2.1.0.tgz",
"integrity": "sha512-9vEt7gE16EW7Eu7pvZnR0abW9z6ufzhXxGXZEVU9IqPdlsUiMwJeJfRtq0zePUmnbHGT9zajca7mX8zgoayo4A==", "integrity": "sha512-1bPaDNFm0axzE4MEAzKPuqKWeRaT43U/hyxKPBdqTfmPF+d6n7FSoTFxLVULUJOmiLp01KjhIPPH+HrXZJN4Rg==",
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
"engines": { "engines": {
@ -15256,9 +15256,9 @@
} }
}, },
"node_modules/@ckeditor/ckeditor5-theme-lark/node_modules/color-name": { "node_modules/@ckeditor/ckeditor5-theme-lark/node_modules/color-name": {
"version": "2.0.2", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-2.0.2.tgz", "resolved": "https://registry.npmjs.org/color-name/-/color-name-2.1.0.tgz",
"integrity": "sha512-9vEt7gE16EW7Eu7pvZnR0abW9z6ufzhXxGXZEVU9IqPdlsUiMwJeJfRtq0zePUmnbHGT9zajca7mX8zgoayo4A==", "integrity": "sha512-1bPaDNFm0axzE4MEAzKPuqKWeRaT43U/hyxKPBdqTfmPF+d6n7FSoTFxLVULUJOmiLp01KjhIPPH+HrXZJN4Rg==",
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
"engines": { "engines": {
@ -15384,9 +15384,9 @@
} }
}, },
"node_modules/@ckeditor/ckeditor5-undo/node_modules/color-name": { "node_modules/@ckeditor/ckeditor5-undo/node_modules/color-name": {
"version": "2.0.2", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-2.0.2.tgz", "resolved": "https://registry.npmjs.org/color-name/-/color-name-2.1.0.tgz",
"integrity": "sha512-9vEt7gE16EW7Eu7pvZnR0abW9z6ufzhXxGXZEVU9IqPdlsUiMwJeJfRtq0zePUmnbHGT9zajca7mX8zgoayo4A==", "integrity": "sha512-1bPaDNFm0axzE4MEAzKPuqKWeRaT43U/hyxKPBdqTfmPF+d6n7FSoTFxLVULUJOmiLp01KjhIPPH+HrXZJN4Rg==",
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
"engines": { "engines": {
@ -15483,9 +15483,9 @@
} }
}, },
"node_modules/@ckeditor/ckeditor5-upload/node_modules/color-name": { "node_modules/@ckeditor/ckeditor5-upload/node_modules/color-name": {
"version": "2.0.2", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-2.0.2.tgz", "resolved": "https://registry.npmjs.org/color-name/-/color-name-2.1.0.tgz",
"integrity": "sha512-9vEt7gE16EW7Eu7pvZnR0abW9z6ufzhXxGXZEVU9IqPdlsUiMwJeJfRtq0zePUmnbHGT9zajca7mX8zgoayo4A==", "integrity": "sha512-1bPaDNFm0axzE4MEAzKPuqKWeRaT43U/hyxKPBdqTfmPF+d6n7FSoTFxLVULUJOmiLp01KjhIPPH+HrXZJN4Rg==",
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
"engines": { "engines": {
@ -15594,9 +15594,9 @@
} }
}, },
"node_modules/@ckeditor/ckeditor5-watchdog/node_modules/color-name": { "node_modules/@ckeditor/ckeditor5-watchdog/node_modules/color-name": {
"version": "2.0.2", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-2.0.2.tgz", "resolved": "https://registry.npmjs.org/color-name/-/color-name-2.1.0.tgz",
"integrity": "sha512-9vEt7gE16EW7Eu7pvZnR0abW9z6ufzhXxGXZEVU9IqPdlsUiMwJeJfRtq0zePUmnbHGT9zajca7mX8zgoayo4A==", "integrity": "sha512-1bPaDNFm0axzE4MEAzKPuqKWeRaT43U/hyxKPBdqTfmPF+d6n7FSoTFxLVULUJOmiLp01KjhIPPH+HrXZJN4Rg==",
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
"engines": { "engines": {
@ -15712,9 +15712,9 @@
} }
}, },
"node_modules/@ckeditor/ckeditor5-widget/node_modules/color-name": { "node_modules/@ckeditor/ckeditor5-widget/node_modules/color-name": {
"version": "2.0.2", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-2.0.2.tgz", "resolved": "https://registry.npmjs.org/color-name/-/color-name-2.1.0.tgz",
"integrity": "sha512-9vEt7gE16EW7Eu7pvZnR0abW9z6ufzhXxGXZEVU9IqPdlsUiMwJeJfRtq0zePUmnbHGT9zajca7mX8zgoayo4A==", "integrity": "sha512-1bPaDNFm0axzE4MEAzKPuqKWeRaT43U/hyxKPBdqTfmPF+d6n7FSoTFxLVULUJOmiLp01KjhIPPH+HrXZJN4Rg==",
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
"engines": { "engines": {
@ -15814,9 +15814,9 @@
} }
}, },
"node_modules/@ckeditor/ckeditor5-word-count/node_modules/color-name": { "node_modules/@ckeditor/ckeditor5-word-count/node_modules/color-name": {
"version": "2.0.2", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-2.0.2.tgz", "resolved": "https://registry.npmjs.org/color-name/-/color-name-2.1.0.tgz",
"integrity": "sha512-9vEt7gE16EW7Eu7pvZnR0abW9z6ufzhXxGXZEVU9IqPdlsUiMwJeJfRtq0zePUmnbHGT9zajca7mX8zgoayo4A==", "integrity": "sha512-1bPaDNFm0axzE4MEAzKPuqKWeRaT43U/hyxKPBdqTfmPF+d6n7FSoTFxLVULUJOmiLp01KjhIPPH+HrXZJN4Rg==",
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
"engines": { "engines": {
@ -19654,9 +19654,9 @@
} }
}, },
"node_modules/@types/react-dom": { "node_modules/@types/react-dom": {
"version": "19.2.2", "version": "19.2.3",
"resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-19.2.2.tgz", "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-19.2.3.tgz",
"integrity": "sha512-9KQPoO6mZCi7jcIStSnlOWn2nEF3mNmyr3rIAsGnAbQKYbRLyqmeSc39EVgtxXVia+LMT8j3knZLAZAh+xLmrw==", "integrity": "sha512-jp2L/eY6fn+KgVVQAOqYItbF0VY/YApe5Mz2F0aykSO8gx31bYCZyvSeYxCHKvzHG5eZjc+zyaS5BrBWya2+kQ==",
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
"peerDependencies": { "peerDependencies": {
@ -22104,9 +22104,9 @@
} }
}, },
"node_modules/ckeditor5/node_modules/color-name": { "node_modules/ckeditor5/node_modules/color-name": {
"version": "2.0.2", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/color-name/-/color-name-2.0.2.tgz", "resolved": "https://registry.npmjs.org/color-name/-/color-name-2.1.0.tgz",
"integrity": "sha512-9vEt7gE16EW7Eu7pvZnR0abW9z6ufzhXxGXZEVU9IqPdlsUiMwJeJfRtq0zePUmnbHGT9zajca7mX8zgoayo4A==", "integrity": "sha512-1bPaDNFm0axzE4MEAzKPuqKWeRaT43U/hyxKPBdqTfmPF+d6n7FSoTFxLVULUJOmiLp01KjhIPPH+HrXZJN4Rg==",
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
"engines": { "engines": {
@ -29007,9 +29007,9 @@
} }
}, },
"node_modules/mdast-util-to-hast": { "node_modules/mdast-util-to-hast": {
"version": "13.2.0", "version": "13.2.1",
"resolved": "https://registry.npmjs.org/mdast-util-to-hast/-/mdast-util-to-hast-13.2.0.tgz", "resolved": "https://registry.npmjs.org/mdast-util-to-hast/-/mdast-util-to-hast-13.2.1.tgz",
"integrity": "sha512-QGYKEuUsYT9ykKBCMOEDLsU5JRObWQusAolFMeko/tYPufNkRffBAQjIE+99jbA87xv6FgmjLtwjh9wBWajwAA==", "integrity": "sha512-cctsq2wp5vTsLIcaymblUriiTcZd0CwWtCbLvrOzYCDZoWyMNV8sZ7krj09FSnsiJi3WVsHLM4k6Dq/yaPyCXA==",
"license": "MIT", "license": "MIT",
"peer": true, "peer": true,
"dependencies": { "dependencies": {
@ -31977,6 +31977,23 @@
"node": ">= 0.8.0" "node": ">= 0.8.0"
} }
}, },
"node_modules/prettier": {
"version": "2.8.8",
"resolved": "https://registry.npmjs.org/prettier/-/prettier-2.8.8.tgz",
"integrity": "sha512-tdN8qQGvNjw4CHbY+XXk0JgCXn9QiF21a55rBe5LJAU+kDyC4WQn4+awm2Xfk2lQMk5fKup9XgzTZtGkjBdP9Q==",
"license": "MIT",
"optional": true,
"peer": true,
"bin": {
"prettier": "bin-prettier.js"
},
"engines": {
"node": ">=10.13.0"
},
"funding": {
"url": "https://github.com/prettier/prettier?sponsor=1"
}
},
"node_modules/pretty-bytes": { "node_modules/pretty-bytes": {
"version": "5.6.0", "version": "5.6.0",
"resolved": "https://registry.npmjs.org/pretty-bytes/-/pretty-bytes-5.6.0.tgz", "resolved": "https://registry.npmjs.org/pretty-bytes/-/pretty-bytes-5.6.0.tgz",

View File

@ -1,4 +1,3 @@
.dashboard-container { .dashboard-container {
padding: 2rem; padding: 2rem;
font-family: 'Arial', sans-serif; font-family: 'Arial', sans-serif;
@ -6,7 +5,6 @@
min-height: 100vh; min-height: 100vh;
} }
.dashboard-header { .dashboard-header {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
@ -34,143 +32,133 @@
border: none; border: none;
border-radius: 8px; border-radius: 8px;
font-size: 1rem; font-size: 1rem;
font-weight: 600;
cursor: pointer; cursor: pointer;
transition: background-color 0.3s, transform 0.25s ease, box-shadow 0.25s ease; transition: all 0.3s ease;
box-shadow: 0 2px 8px rgba(30, 58, 138, 0.3);
} }
.new-user-btn:hover { .new-user-btn:hover {
background-color: #162d6b; background-color: #162d6b;
transform: translateY(-2px); transform: translateY(-2px);
box-shadow: 0px 4px 12px rgba(30, 58, 138, 0.3); box-shadow: 0 4px 12px rgba(30, 58, 138, 0.4);
} }
.filters-container { .filters-container {
background: #fff; background: #fff;
border-radius: 12px; border-radius: 12px;
padding: 1.5rem; padding: 1.2rem;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
margin-bottom: 2rem; margin-bottom: 2rem;
transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.filters-container:hover {
transform: translateY(-3px);
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
} }
.filters-title { .filters-title {
font-size: 18px; font-size: 16px;
font-weight: bold; font-weight: bold;
margin-bottom: 0.3rem; margin-bottom: 0.3rem;
color: #333; color: #333;
} }
.filters-subtitle { .filters-subtitle {
font-size: 0.9rem; font-size: 0.85rem;
color: #666; color: #666;
margin-bottom: 1rem; margin-bottom: 1rem;
} }
.filters-content { .filters-content {
display: flex; display: flex;
gap: 1rem; gap: 0.8rem;
align-items: center; align-items: center;
} }
.filters-input { .filters-input {
flex: 1; flex: 1;
padding: 0.6rem 1rem; padding: 0.5rem 0.8rem;
border: 1px solid #d1d5db; border: 1px solid #d1d5db;
border-radius: 8px; border-radius: 6px;
font-size: 0.95rem; font-size: 0.9rem;
color: #333; color: #333;
transition: border-color 0.2s, box-shadow 0.2s; min-width: 200px;
transition: all 0.2s ease;
} }
.filters-input:focus { .filters-input:focus {
border-color: #1e3a8a; border-color: #1e3a8a;
box-shadow: 0px 0px 0px 3px rgba(30, 58, 138, 0.2); box-shadow: 0 0 0 2px rgba(30, 58, 138, 0.1);
outline: none; outline: none;
} }
.filters-select { .filters-select {
padding: 0.6rem 1rem; padding: 0.5rem 0.8rem;
border: 1px solid #d1d5db; border: 1px solid #d1d5db;
border-radius: 8px; border-radius: 6px;
font-size: 0.95rem; font-size: 0.9rem;
background: #fff; background: #fff;
color: #333; color: #333;
cursor: pointer; cursor: pointer;
transition: border-color 0.2s, box-shadow 0.2s; min-width: 140px;
transition: all 0.2s ease;
} }
.filters-select:focus { .filters-select:focus {
border-color: #1e3a8a; border-color: #1e3a8a;
box-shadow: 0px 0px 0px 3px rgba(30, 58, 138, 0.2); box-shadow: 0 0 0 2px rgba(30, 58, 138, 0.1);
outline: none; outline: none;
} }
.cards-container { .cards-container {
display: grid; display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 1.5rem; gap: 1.2rem;
margin-bottom: 2rem; margin-bottom: 2rem;
} }
.card { .card {
background-color: white; background-color: white;
padding: 1.5rem; padding: 1.2rem;
border-radius: 12px; border-radius: 10px;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
border: 1px solid transparent; border: 1px solid transparent;
transition: transform 0.25s ease, box-shadow 0.25s ease, border 0.25s ease, background 0.25s ease; transition: all 0.25s ease;
cursor: pointer; cursor: pointer;
} }
.highlight:hover { .highlight:hover {
transform: translateY(-6px); transform: translateY(-4px);
box-shadow: 0 8px 20px rgba(30, 58, 138, 0.2); box-shadow: 0 6px 16px rgba(30, 58, 138, 0.2);
background: #f8faff; background: #f8faff;
border: 1px solid #1e3a8a33; border: 1px solid #1e3a8a33;
} }
.card-label { .card-label {
font-size: 0.9rem; font-size: 0.85rem;
color: #999; color: #999;
margin-bottom: 0.5rem; margin-bottom: 0.5rem;
} }
.card-value { .card-value {
font-size: 1.8rem; font-size: 1.6rem;
font-weight: bold; font-weight: bold;
margin: 0; margin: 0;
color: #333; color: #333;
} }
.card-extra { .card-extra {
font-size: 0.85rem; font-size: 0.8rem;
color: #666; color: #666;
} }
.card-extra.positive { .card-extra.positive {
color: #1e3a8a; color: #1e3a8a;
font-weight: 600;
} }
.user-table-container { .user-table-container {
background: #fff; background: #fff;
border-radius: 12px; border-radius: 12px;
padding: 1.5rem; padding: 1.2rem;
box-shadow: 0 4px 6px rgba(0,0,0,0.1); box-shadow: 0 2px 8px rgba(0,0,0,0.1);
margin-top: 2rem; margin-top: 2rem;
transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.user-table-container:hover {
transform: translateY(-4px);
box-shadow: 0 6px 14px rgba(0,0,0,0.15);
} }
.user-table-container h2 { .user-table-container h2 {
@ -193,7 +181,7 @@
.user-table th, .user-table th,
.user-table td { .user-table td {
padding: 12px 15px; padding: 10px 12px;
text-align: left; text-align: left;
border-bottom: 1px solid #e0e0e0; border-bottom: 1px solid #e0e0e0;
} }
@ -202,10 +190,11 @@
background-color: #f3f4f6; background-color: #f3f4f6;
color: #333; color: #333;
font-weight: 600; font-weight: 600;
font-size: 0.9rem;
} }
.user-table tr { .user-table tr {
transition: background-color 0.25s ease; transition: background-color 0.2s ease;
} }
.user-table tr:hover { .user-table tr:hover {
@ -214,44 +203,115 @@
.profile-badge { .profile-badge {
background-color: #1e3a8a; background-color: #1e3a8a;
color: #f7f7f7; color: white;
padding: 3px 8px; padding: 4px 10px;
border-radius: 8px; border-radius: 6px;
font-size: 0.85rem; font-size: 0.8rem;
font-weight: 500;
display: inline-block; display: inline-block;
} }
.status-badge { .status-badge {
padding: 3px 8px; padding: 4px 10px;
border-radius: 8px; border-radius: 6px;
font-size: 0.85rem; font-size: 0.8rem;
color: #fff; color: #fff;
font-weight: 500;
display: inline-block; display: inline-block;
text-transform: capitalize; text-transform: capitalize;
} }
.status-badge.ativo { .status-badge.ativo {
background-color: #28a745; background-color: #1e3a8a;
} }
.status-badge.inativo { .status-badge.inativo {
background-color: #dc3545; background-color: #6c757d;
} }
.actions { .actions {
display: flex; display: flex;
gap: 10px; gap: 8px;
flex-wrap: wrap;
} }
.action-icon { .action-btn {
border: none;
padding: 6px 12px;
font-size: 0.8rem;
font-weight: 500;
cursor: pointer; cursor: pointer;
color: #555; transition: all 0.2s ease;
transition: color 0.2s, transform 0.2s; border-radius: 4px;
display: inline-flex;
align-items: center;
gap: 4px;
} }
.action-icon:hover { .action-btn.detalhes {
color: #1e3a8a; background-color: #e6f2ff;
transform: scale(1.2); color: #004085;
border: 1px solid #b8d4ff;
}
.action-btn.detalhes:hover {
background-color: #cce4ff;
transform: translateY(-1px);
}
.action-btn.editar {
background-color: #fff3cd;
color: #856405;
border: 1px solid #ffeaa7;
}
.action-btn.editar:hover {
background-color: #ffeaa7;
transform: translateY(-1px);
}
.action-btn.excluir {
background-color: #f8d7da;
color: #721c24;
border: 1px solid #f1b0b7;
}
.action-btn.excluir:hover {
background-color: #f1b0b7;
transform: translateY(-1px);
}
.save-btn {
background-color: #1e3a8a;
color: white;
border: none;
padding: 8px 16px;
border-radius: 6px;
font-weight: 600;
cursor: pointer;
transition: all 0.3s ease;
}
.save-btn:hover {
background-color: #162d6b;
transform: translateY(-1px);
box-shadow: 0 4px 8px rgba(30, 58, 138, 0.3);
}
.edit-btn {
background-color: #fff3cd;
color: #856405;
border: 1px solid #ffeaa7;
padding: 8px 16px;
border-radius: 6px;
font-weight: 600;
cursor: pointer;
transition: all 0.3s ease;
}
.edit-btn:hover {
background-color: #ffeaa7;
transform: translateY(-1px);
} }
html[data-bs-theme="dark"] .dashboard-container { html[data-bs-theme="dark"] .dashboard-container {
@ -266,18 +326,17 @@ html[data-bs-theme="dark"] .dashboard-subtitle {
} }
html[data-bs-theme="dark"] .new-user-btn { html[data-bs-theme="dark"] .new-user-btn {
background-color: #2563eb; background-color: #1e3a8a;
color: #fff;
} }
html[data-bs-theme="dark"] .new-user-btn:hover { html[data-bs-theme="dark"] .new-user-btn:hover {
background-color: #1e40af; background-color: #162d6b;
} }
html[data-bs-theme="dark"] .filters-container, html[data-bs-theme="dark"] .filters-container,
html[data-bs-theme="dark"] .user-table-container { html[data-bs-theme="dark"] .user-table-container {
background: #1a1a1a; background: #1a1a1a;
box-shadow: 0 4px 6px rgba(0,0,0,0.4); box-shadow: 0 2px 8px rgba(0,0,0,0.4);
} }
html[data-bs-theme="dark"] .filters-title, html[data-bs-theme="dark"] .filters-title,
@ -299,19 +358,19 @@ html[data-bs-theme="dark"] .filters-select {
html[data-bs-theme="dark"] .filters-input:focus, html[data-bs-theme="dark"] .filters-input:focus,
html[data-bs-theme="dark"] .filters-select:focus { html[data-bs-theme="dark"] .filters-select:focus {
border-color: #2563eb; border-color: #1e3a8a;
box-shadow: 0px 0px 0px 3px rgba(37, 99, 235, 0.2); box-shadow: 0 0 0 2px rgba(30, 58, 138, 0.2);
} }
html[data-bs-theme="dark"] .cards-container .card { html[data-bs-theme="dark"] .cards-container .card {
background-color: #181818; background-color: #181818;
color: #e0e0e0; color: #e0e0e0;
box-shadow: 0 4px 6px rgba(0,0,0,0.4); box-shadow: 0 2px 6px rgba(0,0,0,0.4);
} }
html[data-bs-theme="dark"] .highlight:hover { html[data-bs-theme="dark"] .highlight:hover {
background: #232a3a; background: #1a1f2e;
border: 1px solid #2563eb33; border: 1px solid #1e3a8a33;
} }
html[data-bs-theme="dark"] .card-label { html[data-bs-theme="dark"] .card-label {
@ -327,7 +386,7 @@ html[data-bs-theme="dark"] .card-extra {
} }
html[data-bs-theme="dark"] .card-extra.positive { html[data-bs-theme="dark"] .card-extra.positive {
color: #2563eb; color: #1e3a8a;
} }
html[data-bs-theme="dark"] .user-table th { html[data-bs-theme="dark"] .user-table th {
@ -341,26 +400,39 @@ html[data-bs-theme="dark"] .user-table td {
} }
html[data-bs-theme="dark"] .user-table tr:hover { html[data-bs-theme="dark"] .user-table tr:hover {
background-color: #232a3a; background-color: #1a1f2e;
} }
html[data-bs-theme="dark"] .profile-badge { html[data-bs-theme="dark"] .profile-badge {
background-color: #2563eb; background-color: #1e3a8a;
color: #fff;
} }
html[data-bs-theme="dark"] .status-badge.ativo { html[data-bs-theme="dark"] .action-btn.detalhes {
background-color: #28a745; background-color: #e6f2ff;
color: #004085;
border: 1px solid #b8d4ff;
} }
html[data-bs-theme="dark"] .status-badge.inativo { html[data-bs-theme="dark"] .action-btn.detalhes:hover {
background-color: #dc3545; background-color: #cce4ff;
} }
html[data-bs-theme="dark"] .action-icon { html[data-bs-theme="dark"] .action-btn.editar {
color: #bdbdbd; background-color: #fff3cd;
color: #856405;
border: 1px solid #ffeaa7;
} }
html[data-bs-theme="dark"] .action-icon:hover { html[data-bs-theme="dark"] .action-btn.editar:hover {
color: #2563eb; background-color: #ffeaa7;
}
html[data-bs-theme="dark"] .action-btn.excluir {
background-color: #f8d7da;
color: #721c24;
border: 1px solid #f1b0b7;
}
html[data-bs-theme="dark"] .action-btn.excluir:hover {
background-color: #f1b0b7;
} }

View File

@ -1,14 +1,9 @@
import React from "react"; import React from "react";
import "./gestao.css"; import "./gestao.css";
import { FaEdit, FaTrash } from "react-icons/fa";
function UserDashboard() { function UserDashboard() {
return ( return (
<div className="dashboard-container">
<div className="dashboard-container">
<div className="dashboard-header"> <div className="dashboard-header">
<div> <div>
<h1 className="dashboard-title">Gestão de Usuários</h1> <h1 className="dashboard-title">Gestão de Usuários</h1>
@ -91,8 +86,9 @@ function UserDashboard() {
<td><span className="status-badge ativo">Ativo</span></td> <td><span className="status-badge ativo">Ativo</span></td>
<td>20/12/2024, 08:30</td> <td>20/12/2024, 08:30</td>
<td className="actions"> <td className="actions">
<span className="action-icon"></span> <button className="action-btn detalhes">Ver Detalhes</button>
<span className="action-icon"></span> <button className="action-btn editar">Editar</button>
<button className="action-btn excluir">Excluir</button>
</td> </td>
</tr> </tr>
<tr> <tr>
@ -103,8 +99,9 @@ function UserDashboard() {
<td><span className="status-badge ativo">Ativo</span></td> <td><span className="status-badge ativo">Ativo</span></td>
<td>19/12/2024, 14:20</td> <td>19/12/2024, 14:20</td>
<td className="actions"> <td className="actions">
<span className="action-icon"></span> <button className="action-btn detalhes">Ver Detalhes</button>
<span className="action-icon"></span> <button className="action-btn editar">Editar</button>
<button className="action-btn excluir">Excluir</button>
</td> </td>
</tr> </tr>
<tr> <tr>
@ -115,8 +112,9 @@ function UserDashboard() {
<td><span className="status-badge ativo">Ativo</span></td> <td><span className="status-badge ativo">Ativo</span></td>
<td>20/12/2024, 07:45</td> <td>20/12/2024, 07:45</td>
<td className="actions"> <td className="actions">
<span className="action-icon"></span> <button className="action-btn detalhes">Ver Detalhes</button>
<span className="action-icon"></span> <button className="action-btn editar">Editar</button>
<button className="action-btn excluir">Excluir</button>
</td> </td>
</tr> </tr>
<tr> <tr>
@ -127,8 +125,9 @@ function UserDashboard() {
<td><span className="status-badge inativo">Inativo</span></td> <td><span className="status-badge inativo">Inativo</span></td>
<td>15/12/2024, 16:30</td> <td>15/12/2024, 16:30</td>
<td className="actions"> <td className="actions">
<span className="action-icon"></span> <button className="action-btn detalhes">Ver Detalhes</button>
<span className="person-badge-fill"></span> <button className="action-btn editar">Editar</button>
<button className="action-btn excluir">Excluir</button>
</td> </td>
</tr> </tr>
</tbody> </tbody>
@ -138,5 +137,4 @@ function UserDashboard() {
); );
} }
export default UserDashboard; export default UserDashboard;

File diff suppressed because it is too large Load Diff

View File

@ -46,7 +46,7 @@ const DoctorRelatorioManager = () => {
if (authHeader) myHeaders.append('Authorization', authHeader); if (authHeader) myHeaders.append('Authorization', authHeader);
const requestOptions = { method: 'GET', headers: myHeaders, redirect: 'follow' }; const requestOptions = { method: 'GET', headers: myHeaders, redirect: 'follow' };
// Tenta descobrir o ID do usuário logado para aplicar filtro por médico
let userId = null; let userId = null;
let userFullName = null; let userFullName = null;
try { try {
@ -60,12 +60,12 @@ const DoctorRelatorioManager = () => {
console.warn('Não foi possível obter UserInfos (pode não estar logado):', err); console.warn('Não foi possível obter UserInfos (pode não estar logado):', err);
} }
// Monta a URL com possíveis filtros preferenciais
const baseUrl = "https://yuanqfswhberkoevtmfr.supabase.co/rest/v1/reports?select=*"; const baseUrl = "https://yuanqfswhberkoevtmfr.supabase.co/rest/v1/reports?select=*";
let data = []; let data = [];
if (userId) { if (userId) {
// 1) tenta por doctor_id
try { try {
const res = await fetch(`${baseUrl}&doctor_id=eq.${userId}`, requestOptions); const res = await fetch(`${baseUrl}&doctor_id=eq.${userId}`, requestOptions);
data = await res.json(); data = await res.json();
@ -74,7 +74,7 @@ const DoctorRelatorioManager = () => {
data = []; data = [];
} }
// 2) fallback para created_by (se vazio)
if ((!Array.isArray(data) || data.length === 0) && userId) { if ((!Array.isArray(data) || data.length === 0) && userId) {
try { try {
const res2 = await fetch(`${baseUrl}&created_by=eq.${userId}`, requestOptions); const res2 = await fetch(`${baseUrl}&created_by=eq.${userId}`, requestOptions);
@ -85,10 +85,9 @@ const DoctorRelatorioManager = () => {
} }
} }
// 3) fallback para requested_by com nome completo (se ainda vazio)
if ((!Array.isArray(data) || data.length === 0) && userFullName) { if ((!Array.isArray(data) || data.length === 0) && userFullName) {
try { try {
// encode para evitar problemas com espaços/caracteres especiais
const encodedName = encodeURIComponent(userFullName); const encodedName = encodeURIComponent(userFullName);
const res3 = await fetch(`${baseUrl}&requested_by=eq.${encodedName}`, requestOptions); const res3 = await fetch(`${baseUrl}&requested_by=eq.${encodedName}`, requestOptions);
data = await res3.json(); data = await res3.json();
@ -99,7 +98,6 @@ const DoctorRelatorioManager = () => {
} }
} }
// Se não obteve userId ou nenhuma das tentativas acima retornou algo, busca tudo (comportamento anterior)
if (!userId || (!Array.isArray(data) || data.length === 0)) { if (!userId || (!Array.isArray(data) || data.length === 0)) {
try { try {
const resAll = await fetch(baseUrl, requestOptions); const resAll = await fetch(baseUrl, requestOptions);
@ -110,7 +108,7 @@ const DoctorRelatorioManager = () => {
} }
} }
// garante unicidade e ordenação por criação
const uniqueMap = new Map(); const uniqueMap = new Map();
(Array.isArray(data) ? data : []).forEach(r => { (Array.isArray(data) ? data : []).forEach(r => {
if (r && r.id) uniqueMap.set(r.id, r); if (r && r.id) uniqueMap.set(r.id, r);
@ -144,14 +142,14 @@ const DoctorRelatorioManager = () => {
}; };
}, [authHeader]); }, [authHeader]);
// Busca dados de pacientes e médicos baseados na lista final que aparece na tela
useEffect(() => { useEffect(() => {
const fetchRelData = async () => { const fetchRelData = async () => {
const pacientes = []; const pacientes = [];
const medicos = []; const medicos = [];
for (let i = 0; i < relatoriosFinais.length; i++) { for (let i = 0; i < relatoriosFinais.length; i++) {
const rel = relatoriosFinais[i]; const rel = relatoriosFinais[i];
// paciente
try { try {
const pacienteRes = await GetPatientByID(rel.patient_id, authHeader); const pacienteRes = await GetPatientByID(rel.patient_id, authHeader);
pacientes.push(Array.isArray(pacienteRes) ? pacienteRes[0] : pacienteRes); pacientes.push(Array.isArray(pacienteRes) ? pacienteRes[0] : pacienteRes);
@ -159,13 +157,12 @@ const DoctorRelatorioManager = () => {
pacientes.push(null); pacientes.push(null);
} }
// médico: prioriza campos com id (doctor_id ou created_by). Se tiver somente requested_by (nome), usa nome.
try { try {
if (rel.doctor_id) { if (rel.doctor_id) {
const docRes = await GetDoctorByID(rel.doctor_id, authHeader); const docRes = await GetDoctorByID(rel.doctor_id, authHeader);
medicos.push(Array.isArray(docRes) ? docRes[0] : docRes); medicos.push(Array.isArray(docRes) ? docRes[0] : docRes);
} else if (rel.created_by) { } else if (rel.created_by) {
// created_by costuma ser id
const docRes = await GetDoctorByID(rel.created_by, authHeader); const docRes = await GetDoctorByID(rel.created_by, authHeader);
medicos.push(Array.isArray(docRes) ? docRes[0] : docRes); medicos.push(Array.isArray(docRes) ? docRes[0] : docRes);
} else if (rel.requested_by) { } else if (rel.requested_by) {
@ -174,7 +171,6 @@ const DoctorRelatorioManager = () => {
medicos.push({ full_name: '' }); medicos.push({ full_name: '' });
} }
} catch (err) { } catch (err) {
// fallback para requested_by se houver
medicos.push({ full_name: rel.requested_by || '' }); medicos.push({ full_name: rel.requested_by || '' });
} }
} }
@ -190,7 +186,6 @@ const DoctorRelatorioManager = () => {
}, [relatoriosFinais, authHeader]); }, [relatoriosFinais, authHeader]);
const abrirModal = (relatorio, pageIndex) => { const abrirModal = (relatorio, pageIndex) => {
// encontra índice global do relatório no array relatoriosFinais (para alinhar com pacientes/medicos)
const globalIndex = relatoriosFinais.findIndex(r => r.id === relatorio.id); const globalIndex = relatoriosFinais.findIndex(r => r.id === relatorio.id);
const indexToUse = globalIndex >= 0 ? globalIndex : (indiceInicial + pageIndex); const indexToUse = globalIndex >= 0 ? globalIndex : (indiceInicial + pageIndex);
setRelatorioModal(relatorio); setRelatorioModal(relatorio);
@ -198,7 +193,7 @@ const DoctorRelatorioManager = () => {
setShowModal(true); setShowModal(true);
}; };
// Função para limpar filtros
const limparFiltros = () => { const limparFiltros = () => {
setTermoPesquisa(''); setTermoPesquisa('');
setFiltroExame(''); setFiltroExame('');
@ -256,12 +251,11 @@ const DoctorRelatorioManager = () => {
return ( return (
<div> <div>
{showModal && ( {showModal && (
<div className="modal modal-centered" role="dialog" aria-modal="true" onClick={() => setShowModal(false)}> <div className="modal fade show" style={{ display: "block", backgroundColor: "rgba(0, 0, 0, 0.5)" }} tabIndex="-1">
<div className="modal-dialog modal-dialog-square" role="document" onClick={(e) => e.stopPropagation()}> <div className="modal-dialog modal-dialog-centered modal-lg">
<div className="modal-content"> <div className="modal-content">
<div className="modal-header custom-modal-header"> <div className="modal-header" style={{ backgroundColor: '#1e3a8a', color: 'white' }}>
<h5 className="modal-title">Relatório de {pacientesComRelatorios[modalIndex]?.full_name}</h5> <h5 className="modal-title">Relatório de {pacientesComRelatorios[modalIndex]?.full_name}</h5>
<button type="button" className="btn-close modal-close-btn" aria-label="Close" onClick={() => setShowModal(false)}></button>
</div> </div>
<div className="modal-body"> <div className="modal-body">
@ -290,11 +284,11 @@ const DoctorRelatorioManager = () => {
</div> </div>
</div> </div>
<div className="modal-footer custom-modal-footer"> <div className="modal-footer">
<button className="btn btn-primary" onClick={() => BaixarPDFdoRelatorio(pacientesComRelatorios[modalIndex]?.full_name, modalIndex)}> <button className="btn btn-primary" onClick={() => BaixarPDFdoRelatorio(pacientesComRelatorios[modalIndex]?.full_name, modalIndex)}>
<i className='bi bi-file-pdf-fill'></i> baixar em pdf <i className='bi bi-file-pdf-fill me-1'></i> Baixar em PDF
</button> </button>
<button type="button" className="btn btn-outline-secondary" onClick={() => { setShowModal(false) }}> <button type="button" className="btn btn-secondary" onClick={() => { setShowModal(false) }}>
Fechar Fechar
</button> </button>
</div> </div>

View File

@ -0,0 +1,215 @@
import React, { useState } from 'react';
import { useNavigate } from 'react-router-dom';
import html2pdf from 'html2pdf.js';
import './styleMedico/NovoRelatorioAudio.css';
const NovoRelatorioAudio = () => {
const navigate = useNavigate();
const [loading, setLoading] = useState(false);
const [formData, setFormData] = useState({
paciente_nome: '',
data_exame: new Date().toISOString().split('T')[0],
exam: '',
diagnostico: '',
conclusao: '',
medico_nome: 'Dr.______________________'
});
const handleAudioUpload = async (e) => {
const file = e.target.files[0];
if (!file) return;
setLoading(true);
const data = new FormData();
data.append('audio', file);
try {
const response = await fetch('http://localhost:3001/api/transcrever-relatorio', {
method: 'POST',
body: data,
});
if (!response.ok) throw new Error('Erro na comunicação com a API');
const result = await response.json();
setFormData(prev => ({
...prev,
exam: result.exam || prev.exam,
diagnostico: result.diagnostico || prev.diagnostico,
conclusao: result.conclusao || prev.conclusao
}));
} catch (error) {
console.error(error);
alert("Erro: Verifique se o backend (porta 3001) está rodando.");
} finally {
setLoading(false);
e.target.value = null;
}
};
const handleChange = (e) => {
const { name, value } = e.target;
setFormData(prev => ({ ...prev, [name]: value }));
};
const handlePrintPDF = () => {
const element = document.getElementById('documento-final');
const opt = {
margin: 0,
filename: `Laudo_${formData.paciente_nome || 'SemNome'}.pdf`,
image: { type: 'jpeg', quality: 0.98 },
html2canvas: { scale: 2 },
jsPDF: { unit: 'mm', format: 'a4', orientation: 'portrait' }
};
html2pdf().set(opt).from(element).save();
};
return (
<div className="ai-editor-container">
<div className="editor-sidebar">
<div>
<h4><i className="bi bi-robot me-2"></i>AI Report</h4>
<p className="text-muted small">Gerador de laudos automatizado</p>
</div>
<div className="ai-upload-box">
{loading ? (
<div className="spinner-border text-info" role="status"></div>
) : (
<>
<label htmlFor="audioFile" style={{cursor:'pointer', width:'100%', display:'block'}}>
<i className="bi bi-mic fs-2 text-info"></i>
<div style={{color:'#fff', fontWeight:'bold', marginTop:'10px'}}>Gravar / Enviar Áudio</div>
<div className="small text-muted mt-1">Clique para selecionar</div>
</label>
<input
id="audioFile"
type="file"
accept="audio/*"
style={{display:'none'}}
onChange={handleAudioUpload}
/>
</>
)}
</div>
<hr className="border-secondary" />
<div className="form-group">
<label>NOME DO PACIENTE</label>
<input
type="text"
name="paciente_nome"
className="form-control dark-input"
value={formData.paciente_nome}
onChange={handleChange}
placeholder="Ex: Maria Silva"
/>
</div>
<div className="form-group">
<label>EXAME REALIZADO</label>
<input
type="text"
name="exam"
className="form-control dark-input"
value={formData.exam}
onChange={handleChange}
/>
</div>
<div className="form-group">
<label>DIAGNÓSTICO (TEXTO)</label>
<textarea
name="diagnostico"
rows="5"
className="form-control dark-input"
value={formData.diagnostico}
onChange={handleChange}
></textarea>
</div>
<div className="form-group">
<label>CONCLUSÃO</label>
<textarea
name="conclusao"
rows="3"
className="form-control dark-input"
value={formData.conclusao}
onChange={handleChange}
></textarea>
</div>
<div className="mt-auto d-flex gap-2">
<button className="btn btn-outline-light flex-grow-1" onClick={() => navigate(-1)}>Voltar</button>
<button className="btn btn-info flex-grow-1 fw-bold" onClick={handlePrintPDF}>
<i className="bi bi-printer me-2"></i>PDF
</button>
</div>
</div>
<div className="preview-area">
<div id="documento-final" className="paper-a4">
<div style={{borderBottom: '2px solid #000', paddingBottom: '20px', marginBottom: '30px', display:'flex', justifyContent:'space-between'}}>
<div>
<h2 style={{margin:0, fontSize:'18pt', fontWeight:'bold'}}>CLÍNICA RISE UP</h2>
<p style={{margin:0, fontSize:'10pt'}}>Excelência em Diagnóstico por Imagem</p>
</div>
<div style={{textAlign:'right', fontSize:'10pt'}}>
<p style={{margin:0}}><strong>{formData.medico_nome}</strong></p>
<p style={{margin:0}}>CRM/SP 123456</p>
<p style={{margin:0}}>{new Date().toLocaleDateString()}</p>
</div>
</div>
<div style={{backgroundColor:'#f8f9fa', padding:'15px', borderRadius:'4px', marginBottom:'30px'}}>
<table style={{width:'100%', fontSize:'11pt'}}>
<tbody>
<tr>
<td style={{width:'15%', fontWeight:'bold'}}>Paciente:</td>
<td>{formData.paciente_nome || '__________________________'}</td>
</tr>
<tr>
<td style={{fontWeight:'bold'}}>Exame:</td>
<td>{formData.exam || '__________________________'}</td>
</tr>
<tr>
<td style={{fontWeight:'bold'}}>Data:</td>
<td>{new Date(formData.data_exame).toLocaleDateString('pt-BR')}</td>
</tr>
</tbody>
</table>
</div>
<div className="laudo-body">
<h4 style={{textTransform:'uppercase', borderBottom:'1px solid #ccc', paddingBottom:'5px', marginBottom:'15px'}}>Relatório Médico</h4>
<p style={{fontWeight:'bold', marginBottom:'5px'}}>Análise:</p>
<p style={{marginBottom:'25px', textAlign:'justify', whiteSpace:'pre-wrap'}}>
{formData.diagnostico || <span style={{color:'#ccc'}}>O diagnóstico aparecerá aqui após o processamento do áudio...</span>}
</p>
<p style={{fontWeight:'bold', marginBottom:'5px'}}>Conclusão:</p>
<p style={{marginBottom:'40px', textAlign:'justify', fontWeight:'500'}}>
{formData.conclusao}
</p>
</div>
<div style={{marginTop:'50px', textAlign:'center', pageBreakInside:'avoid'}}>
<p style={{marginBottom:0}}>________________________________________</p>
<p style={{fontWeight:'bold', margin:0}}>{formData.medico_nome}</p>
<p style={{fontSize:'10pt', color:'#666'}}>Assinatura Eletrônica</p>
</div>
</div>
</div>
</div>
);
};
export default NovoRelatorioAudio;

View File

@ -6,18 +6,58 @@
/* --- Posiciona a barra de busca corretamente --- */ /* --- Posiciona a barra de busca corretamente --- */
.busca-atendimento { .busca-atendimento {
display: flex; display: flex;
align-items: center; /* Alinha os itens verticalmente */ align-items: center;
margin-top: 20px; /* Espaço acima da barra de busca */ margin-top: 20px;
padding: 0 10px; /* Adiciona um padding lateral para alinhar com o resto */ padding: 0 10px;
gap: 15px; gap: 15px;
} }
.busca-atendimento > div:first-child { .busca-atendimento > div:first-child {
width: 400px; /* Define um tamanho para a barra de pesquisa */ width: 400px;
display: flex; display: flex;
align-items: center; align-items: center;
} }
@media (max-width: 768px) {
.busca-atendimento {
flex-direction: column;
align-items: stretch;
gap: 10px;
}
.busca-atendimento > div:first-child {
width: 100%;
}
.btns-e-legenda-container {
flex-direction: column;
align-items: flex-start;
gap: 10px;
}
.legenda-tabela {
flex-wrap: wrap;
gap: 8px;
}
}
@media (max-width: 576px) {
.busca-atendimento {
padding: 0 5px;
}
.btns-e-legenda-container {
padding: 0 5px;
}
.btn-selecionar-tabeladia,
.btn-selecionar-tabelasemana,
.btn-selecionar-tabelames {
padding: 6px 8px;
font-size: medium;
}
}
.busca-atendimento input { .busca-atendimento input {
margin-left: 8px; margin-left: 8px;
border-radius: 8px; border-radius: 8px;
@ -140,6 +180,7 @@
border-bottom: 3px solid transparent; border-bottom: 3px solid transparent;
padding: 8px; padding: 8px;
border-radius: 10px 10px 0px 0px; border-radius: 10px 10px 0px 0px;
color: #fff;
font-weight: bold; font-weight: bold;
cursor: pointer; cursor: pointer;
} }

View File

@ -0,0 +1,119 @@
/* Container que ocupa toda a altura da tela (menos o header do site) */
.ai-editor-container {
display: flex;
min-height: calc(100vh - 80px); /* Ajuste conforme seu header */
background-color: #e9ecef; /* Cor de "Mesa" */
overflow: hidden;
}
/* --- LADO ESQUERDO: PAINEL DE CONTROLE --- */
.editor-sidebar {
width: 400px;
background-color: #212529; /* Dark Mode para o painel */
color: #fff;
padding: 20px;
overflow-y: auto;
display: flex;
flex-direction: column;
gap: 15px;
box-shadow: 4px 0 10px rgba(0,0,0,0.1);
}
.editor-sidebar h4 {
color: #0dcaf0; /* Ciano para destaque */
margin-bottom: 20px;
font-weight: 700;
}
.editor-sidebar label {
font-size: 0.85rem;
color: #adb5bd;
margin-bottom: 5px;
}
/* Estilo customizado para inputs no fundo escuro */
.dark-input {
background-color: #343a40;
border: 1px solid #495057;
color: #fff;
border-radius: 6px;
}
.dark-input:focus {
background-color: #3b4248;
color: #fff;
border-color: #0dcaf0;
box-shadow: none;
}
/* Área de Upload Destacada */
.ai-upload-box {
border: 2px dashed #0dcaf0;
border-radius: 10px;
padding: 20px;
text-align: center;
background: rgba(13, 202, 240, 0.1);
transition: 0.3s;
cursor: pointer;
}
.ai-upload-box:hover {
background: rgba(13, 202, 240, 0.2);
}
/* --- LADO DIREITO: PREVIEW A4 --- */
.preview-area {
flex: 1;
display: flex;
justify-content: center;
align-items: flex-start;
padding: 40px;
overflow-y: auto;
}
.paper-a4 {
width: 210mm;
min-height: 297mm;
background: white;
padding: 25mm;
box-shadow: 0 0 20px rgba(0,0,0,0.15);
color: #000;
font-family: 'Georgia', serif; /* Fonte mais séria para o documento */
font-size: 12pt;
line-height: 1.6;
}
/* Responsividade: Em celular vira coluna única */
@media (max-width: 900px) {
.ai-editor-container {
flex-direction: column;
min-height: auto;
}
.editor-sidebar {
width: 100%;
height: auto;
box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}
.preview-area {
padding: 20px;
}
.paper-a4 {
width: 100%;
min-height: auto;
padding: 15mm;
box-shadow: none;
}
}
@media (max-width: 576px) {
.ai-editor-container {
padding: 0;
}
.editor-sidebar {
padding: 15px;
}
.preview-area {
padding: 10px;
}
.paper-a4 {
padding: 10mm;
}
}

View File

@ -1,14 +1,71 @@
/* Estilo geral do card para agrupar e dar um formato */ /* Estilo geral do card para agrupar e dar um formato */
.card-consulta { .card-consulta {
background-color: #007bff; /* Um tom de azul padrão */ background-color: #007bff;
display: flex; /* Para colocar horário e info lado a lado */ display: flex;
border-radius: 10px; /* Cantos arredondados */ border-radius: 10px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Sombra suave */ box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
overflow: hidden; /* Garante que o fundo azul não 'vaze' */ overflow: hidden;
/* width: 280px; /* Largura de exemplo */
margin: 20px; margin: 20px;
font-family: Arial, sans-serif; /* Fonte legível */ font-family: Arial, sans-serif;
}
@media (max-width: 768px) {
.card-consulta {
flex-direction: column;
margin: 10px;
}
.horario-container {
border-right: none;
border-bottom: 1px solid #0056b3;
padding: 10px 15px;
}
.horario {
font-size: 1.8em;
}
.info-container {
flex-direction: column;
align-items: flex-start;
gap: 1rem;
padding: 15px;
}
.actions-container {
opacity: 1;
visibility: visible;
background: none;
backdrop-filter: none;
-webkit-backdrop-filter: none;
border: none;
box-shadow: none;
margin-left: 0;
padding: 0;
justify-content: flex-start;
margin-top: 10px;
}
.card-consulta:hover .actions-container {
transform: none;
}
}
@media (max-width: 576px) {
.horario {
font-size: 1.5em;
}
.informacao {
font-size: 1em;
}
.btn-edit-custom-style,
.btn-delete-custom-style {
padding: 6px 10px;
font-size: 0.8rem;
}
} }
/* 1. Estilo para o Horário (Fundo Azul e Texto Branco/Grande) */ /* 1. Estilo para o Horário (Fundo Azul e Texto Branco/Grande) */

View File

@ -1,3 +1,10 @@
@media (max-width: 768px) {
.container-cardconsulta {
padding-right: 80px; /* Espaço para os botões */
position: relative;
}
}
.actions-container { .actions-container {
display: flex; display: flex;
gap: 8px; gap: 8px;
@ -84,4 +91,50 @@
.tabelamensal .container-cardconsulta{ .tabelamensal .container-cardconsulta{
width: 24rem; width: 24rem;
}
@media (max-width: 768px) {
.actions-container {
opacity: 1;
visibility: visible;
background: none;
backdrop-filter: none;
-webkit-backdrop-filter: none;
border: none;
box-shadow: none;
margin-left: 0;
padding: 0;
justify-content: flex-end;
position: absolute;
top: 10px;
right: 10px;
}
.container-cardconsulta:hover .actions-container {
transform: none;
}
.tabelamensal .container-cardconsulta {
width: 100%;
max-width: 100%;
}
}
@media (max-width: 576px) {
.container-cardconsulta {
padding-right: 10px; /* Remove o padding extra para telas muito pequenas */
}
.actions-container {
position: static;
margin-top: 10px;
justify-content: flex-start;
}
.btn-edit-custom-style,
.btn-delete-custom-style,
.btn-confirm-style {
padding: 6px 10px;
font-size: 0.8rem;
}
} }

View File

@ -183,6 +183,67 @@ textarea{
gap: 16px; gap: 16px;
} }
@media (max-width: 768px) {
.campos-informacoes-paciente,
.campo-informacoes-atendimento {
flex-direction: column;
gap: 10px;
}
#informacoes-atendimento-segunda-linha {
flex-direction: column;
gap: 10px;
}
#informacoes-atendimento-segunda-linha-esquerda select[name="unidade"],
input[type="time"],
select[name=solicitante],
.campo-de-input {
width: 100% !important;
max-width: 100%;
}
.tipo_atendimento {
margin-left: 0;
}
.linha {
flex-direction: column;
align-items: stretch;
gap: 10px;
}
.sessao-contador {
width: 100px;
}
}
@media (max-width: 576px) {
.form-container {
padding: 15px;
}
.form-title {
font-size: 22px;
}
.form-agendamento input,
.form-agendamento select,
.form-agendamento textarea {
font-size: 13px;
}
.form-actions {
flex-direction: column;
gap: 10px;
}
.btn-primary,
.btn-cancel {
width: 100%;
}
}
.campo-de-input { .campo-de-input {
flex: 1; flex: 1;
display: flex; display: flex;

View File

@ -1,55 +1,97 @@
import React from 'react' import React, { useState } from 'react'
import '../PagesMedico/styleMedico/FormNovoRelatorio.css' import '../PagesMedico/styleMedico/FormNovoRelatorio.css'
import { useState } from 'react'
import { useNavigate } from 'react-router-dom' import { useNavigate } from 'react-router-dom'
import { useAuth } from '../components/utils/AuthProvider' import { useAuth } from '../components/utils/AuthProvider'
import { GetPatientByCPF } from '../components/utils/Functions-Endpoints/Patient' import { GetPatientByCPF } from '../components/utils/Functions-Endpoints/Patient'
import { FormatCPF } from '../components/utils/Formatar/Format' import { FormatCPF } from '../components/utils/Formatar/Format'
import html2pdf from 'html2pdf.js' import html2pdf from 'html2pdf.js'
const FormRelatorio = ({onSave, DictInfo, setDictInfo }) => { const FormRelatorio = ({ onSave, DictInfo, setDictInfo }) => {
const {getAuthorizationHeader} = useAuth() const { getAuthorizationHeader } = useAuth()
let authHeader = getAuthorizationHeader() let authHeader = getAuthorizationHeader()
const navigate= useNavigate() const navigate = useNavigate()
const [showModal, setShowModal] = useState(false) const [showModal, setShowModal] = useState(false)
// --- NOVO: Estado para controlar o loading da transcrição ---
const [isTranscribing, setIsTranscribing] = useState(false);
// --- NOVA FUNÇÃO: Envia o áudio e preenche o formulário ---
const handleAudioUpload = async (e) => {
const file = e.target.files[0];
if (!file) return;
setIsTranscribing(true); // Ativa o spinner
const formData = new FormData();
formData.append('audio', file); // 'audio' deve ser o nome esperado no backend
try {
// ATENÇÃO: Substitua essa URL pela rota do seu backend que criamos
const response = await fetch('http://localhost:3001/api/transcrever-relatorio', {
method: 'POST',
body: formData,
// headers: { 'Authorization': authHeader } // Descomente se seu backend precisar de token
});
if (!response.ok) throw new Error("Falha na transcrição");
const data = await response.json();
// Atualiza o DictInfo com os dados vindos da IA
setDictInfo((prev) => ({
...prev,
exam: data.exam || prev.exam, // Preenche se a IA achou, senão mantém o antigo
diagnostico: data.diagnostico || prev.diagnostico,
conclusao: data.conclusao || prev.conclusao
}));
} catch (error) {
console.error("Erro no upload de áudio:", error);
alert("Não foi possível gerar o relatório por áudio. Verifique o backend.");
} finally {
setIsTranscribing(false); // Desativa o spinner
e.target.value = null; // Limpa o input para permitir enviar o mesmo arquivo novamente se quiser
}
};
// -----------------------------------------------------------
const BaixarPDFdoRelatorio = () => { const BaixarPDFdoRelatorio = () => {
const elemento = document.getElementById("folhaA4"); // tua div do relatório const elemento = document.getElementById("folhaA4"); // tua div do relatório
const opt = { const opt = {
margin: 0, margin: 0,
filename: `relatorio_${DictInfo?.paciente_nome || "paciente"}.pdf`, filename: `relatorio_${DictInfo?.paciente_nome || "paciente"}.pdf`,
html2canvas: { scale: 2 }, html2canvas: { scale: 2 },
jsPDF: { unit: "mm", format: "a4", orientation: "portrait" }, jsPDF: { unit: "mm", format: "a4", orientation: "portrait" },
}; };
html2pdf().set(opt).from(elemento).save(); html2pdf().set(opt).from(elemento).save();
} }
const handleChange = (e) => { const handleChange = (e) => {
const { name, value } = e.target; const { name, value } = e.target;
console.log(name, value) console.log(name, value)
if(name === 'paciente_cpf') { if (name === 'paciente_cpf') {
const formattedCPF = FormatCPF(value); const formattedCPF = FormatCPF(value);
setDictInfo((prev) => ({ ...prev, [name]: formattedCPF })); setDictInfo((prev) => ({ ...prev, [name]: formattedCPF }));
const fetchPatient = async () => { const fetchPatient = async () => {
const patientData = await GetPatientByCPF(formattedCPF, authHeader); const patientData = await GetPatientByCPF(formattedCPF, authHeader);
if (patientData) { if (patientData) {
setDictInfo((prev) => ({ setDictInfo((prev) => ({
...prev, ...prev,
paciente_cpf:value, paciente_cpf: value,
paciente_nome: patientData.full_name, paciente_nome: patientData.full_name,
paciente_id: patientData.id paciente_id: patientData.id
})); }));
}
};
if (formattedCPF.length === 14) {
fetchPatient();
} }
} else {
}; setDictInfo((prev) => ({ ...prev, [name]: value }));
if(formattedCPF.length === 14){
fetchPatient();
}
}else{
setDictInfo((prev) => ({ ...prev, [name]: value }));
} }
} }
@ -57,145 +99,164 @@ const FormRelatorio = ({onSave, DictInfo, setDictInfo }) => {
e.preventDefault(); e.preventDefault();
console.log(DictInfo) console.log(DictInfo)
setShowModal(true) setShowModal(true)
onSave({
"patient_id": DictInfo.paciente_id,
"exam": DictInfo.exam,
"diagnosis": DictInfo.diagnosis,
"conclusion": DictInfo.conclusao,
"status": "draft",
"requested_by": DictInfo.requested_by,
"hide_date": false,
"hide_signature": false,
});
onSave({
"patient_id": DictInfo.paciente_id,
"exam": DictInfo.exam,
"diagnosis": DictInfo.diagnostico, // Garanta que o backend espera 'diagnosis' mas seu state usa 'diagnostico'
"conclusion": DictInfo.conclusao,
"status": "draft",
"requested_by": DictInfo.requested_by,
"hide_date": false,
"hide_signature": false,
});
} }
return ( return (
<div> <div>
{showModal &&( {showModal && (
<div className="modal" style={{ display: 'block', backgroundColor: 'rgba(0,0,0,0.5)' }}> <div className="modal" style={{ display: 'block', backgroundColor: 'rgba(0,0,0,0.5)' }}>
<div className="modal-dialog"> <div className="modal-dialog">
<div className="modal-content"> <div className="modal-content">
<div className="modal-header bg-success text-white"> <div className="modal-header bg-success text-white">
<h5 className="modal-title ">Relatório criado com sucesso</h5> <h5 className="modal-title ">Relatório criado com sucesso</h5>
<button <button
type="button" type="button"
className="btn-close" className="btn-close"
onClick={() => setShowModal(false)} onClick={() => setShowModal(false)}
></button> ></button>
</div>
<div className="modal-body">
<p>Você também pode baixa-lo agora em pdf</p>
</div>
<div className="modal-footer">
<button className="btn btn-primary" onClick={BaixarPDFdoRelatorio}><i className='bi bi-file-pdf-fill'></i> baixar em pdf</button>
<button
type="button"
className="btn btn-primary"
onClick={() => { setShowModal(false); navigate(('/medico/relatorios')) }}
>
Fechar
</button>
</div>
</div>
</div>
</div> </div>
<div className="modal-body"> )}
<p>Você também pode baixa-lo agora em pdf</p>
</div>
<div className="modal-footer">
<button className="btn btn-primary" onClick={ BaixarPDFdoRelatorio}><i className='bi bi-file-pdf-fill'></i> baixar em pdf</button>
<button
type="button"
className="btn btn-primary"
onClick={() => {setShowModal(false); navigate(('/medico/relatorios'))}}
>
Fechar
</button>
</div>
</div>
</div>
</div>
)}
<div className='card'> <div className='card'>
<form action="" onSubmit={handleSubmit}>
<div id='primeiraLinha'>
<div className="col-md-2 mb-3">
<label >Nome do paciente:</label>
<input type="text" step="0.1" className="form-control" name="paciente_nome" onChange={handleChange} value={DictInfo.paciente_nome || ''} required />
</div>
<div className="col-md-2 mb-3">
<label >CPF do paciente:</label>
<input type="text" step="0.1" className="form-control" name="paciente_cpf" onChange={handleChange} value={DictInfo.paciente_cpf || ''} required />
</div>
<div className="col-md-2 mb-3">
<label >Nome do médico:</label>
<input type="text" step="0.1" className="form-control" name="requested_by" onChange={handleChange} value={DictInfo.requested_by || ''} required />
</div>
<div className="col-md-2 mb-3">
<label >Exame:</label>
<input type="text" className="form-control" name="exam" onChange={handleChange} />
</div>
<div className="col-md-2 mb-3">
<label >Data do exame:</label>
<input type="date" className="form-control" name="data_exame" onChange={handleChange} value={DictInfo.data_exame || ''} />
</div>
</div>
<div className='row'>
<div className="col-md-2 mb-3">
<label htmlFor='diagnostico'>Diagnostico:</label>
<textarea name="diagnostico" id="diagnostico" onChange={handleChange} cols="30" rows="5" value={DictInfo.diagnostico || ''}></textarea>
</div>
<div className="col-md-2 mb-3">
<label htmlFor='conclusao'>Conclusão:</label>
<textarea name="conclusao" id="conclusao" onChange={handleChange} cols="30" rows="5" value={DictInfo.conclusao || ''}></textarea>
</div>
</div>
<button
className="btn btn-success submitButton"
type='submit'
>
Salvar
</button>
</form> {/* --- ÁREA DE UPLOAD DE ÁUDIO (INSERIDA AQUI) --- */}
</div> <div className="p-3 mb-3 border-bottom bg-light">
<label className="form-label fw-bold">🎙 Preenchimento Automático via Áudio</label>
<div className="d-flex align-items-center gap-3">
{isTranscribing ? (
<div className="d-flex align-items-center text-primary">
<div className="spinner-border spinner-border-sm me-2" role="status"></div>
<span>A IA está gerando o relatório... aguarde.</span>
</div>
) : (
<input
type="file"
className="form-control"
accept="audio/*"
onChange={handleAudioUpload}
/>
)}
</div>
<small className="text-muted">Envie um áudio ditando o exame, diagnóstico e conclusão.</small>
</div>
{/* ----------------------------------------------- */}
<h3>Modelo do relatório</h3> <form action="" onSubmit={handleSubmit}>
<div id="folhaA4"> <div id='primeiraLinha'>
<div id='header-relatorio'> <div className="col-md-2 mb-3">
<p>Clinica Rise up</p> <label >Nome do paciente:</label>
<p>Dr {DictInfo.requested_by} - CRM/SP 123456</p> <input type="text" step="0.1" className="form-control" name="paciente_nome" onChange={handleChange} value={DictInfo.paciente_nome || ''} required />
<p>Avenida - (79) 9 4444-4444</p> </div>
</div>
<div id='infoPaciente'> <div className="col-md-2 mb-3">
<p>Paciente: {DictInfo?.paciente_nome}</p> <label >CPF do paciente:</label>
<p>Data de nascimento: </p> <input type="text" step="0.1" className="form-control" name="paciente_cpf" onChange={handleChange} value={DictInfo.paciente_cpf || ''} required />
</div>
<p>Data do exame: {DictInfo.data_exam}</p>
<p>Exame: {DictInfo.exam}</p> <div className="col-md-2 mb-3">
<label >Nome do médico:</label>
<input type="text" step="0.1" className="form-control" name="requested_by" onChange={handleChange} value={DictInfo.requested_by || ''} required />
</div>
<p>Diagnostico: {DictInfo.diagnostico}</p> <div className="col-md-2 mb-3">
<label >Exame:</label>
<input type="text" className="form-control" name="exam" onChange={handleChange} value={DictInfo.exam || ''} />
</div>
<p>Conclusão: {DictInfo.conclusao}</p>
</div>
<div> <div className="col-md-2 mb-3">
<p>Dr {DictInfo.requested_by}</p> <label >Data do exame:</label>
<p>Emitido em: 0</p> <input type="date" className="form-control" name="data_exame" onChange={handleChange} value={DictInfo.data_exame || ''} />
</div> </div>
</div> </div>
</div> <div className='row'>
) <div className="col-md-2 mb-3">
<label htmlFor='diagnostico'>Diagnostico:</label>
<textarea name="diagnostico" id="diagnostico" onChange={handleChange} cols="30" rows="5" value={DictInfo.diagnostico || ''}></textarea>
</div>
<div className="col-md-2 mb-3">
<label htmlFor='conclusao'>Conclusão:</label>
<textarea name="conclusao" id="conclusao" onChange={handleChange} cols="30" rows="5" value={DictInfo.conclusao || ''}></textarea>
</div>
</div>
<button
className="btn btn-success submitButton"
type='submit'
>
Salvar
</button>
</form>
</div>
<h3>Modelo do relatório</h3>
<div id="folhaA4">
<div id='header-relatorio'>
<p>Clinica Rise up</p>
<p>Dr {DictInfo.requested_by} - CRM/SP 123456</p>
<p>Avenida - (79) 9 4444-4444</p>
</div>
<div id='infoPaciente'>
<p>Paciente: {DictInfo?.paciente_nome}</p>
<p>Data de nascimento: </p>
{/* Corrigi de data_exam para data_exame para bater com o state */}
<p>Data do exame: {DictInfo.data_exame}</p>
<p>Exame: {DictInfo.exam}</p>
<p>Diagnostico: {DictInfo.diagnostico}</p>
<p>Conclusão: {DictInfo.conclusao}</p>
</div>
<div>
<p>Dr {DictInfo.requested_by}</p>
<p>Emitido em: {new Date().toLocaleDateString()}</p>
</div>
</div>
</div>
)
} }
export default FormRelatorio export default FormRelatorio

View File

@ -223,6 +223,8 @@
z-index: 2001; z-index: 2001;
margin-top: 80px; margin-top: 80px;
margin-right: 20px; margin-right: 20px;
/* Adicionado para responsividade */
max-width: 90vw;
} }
.suporte-card { .suporte-card {
@ -309,6 +311,8 @@
z-index: 3001; z-index: 3001;
margin-top: 80px; margin-top: 80px;
margin-right: 20px; margin-right: 20px;
/* Adicionado para responsividade */
max-width: 90vw;
} }
.chat-online { .chat-online {
@ -478,6 +482,7 @@
.suporte-card-container, .suporte-card-container,
.chat-container { .chat-container {
margin-top: 60px;
margin-right: 10px; margin-right: 10px;
margin-left: 10px; margin-left: 10px;
} }
@ -489,28 +494,101 @@
} }
} }
/* permite que cliques "passem" através do header (exceto para os elementos interativos) */ @media (max-width: 576px) {
.header-container { .header-container {
pointer-events: none; /* header não captura cliques */ padding: 8px 10px;
}
.right-corner-elements {
gap: 10px;
}
.profile-picture-container {
width: 35px;
height: 35px;
}
.phone-icon-container {
font-size: 20px;
}
.suporte-card-container,
.chat-container {
margin-top: 50px;
margin-right: 5px;
margin-left: 5px;
}
.suporte-card {
padding: 1rem;
}
.chat-online {
width: calc(100vw - 10px);
height: 80vh; /* Limita a altura para telas pequenas */
}
.chat-input {
padding: 0.75rem;
}
.chat-campo {
padding: 0.5rem;
}
.chat-enviar {
padding: 0.5rem 1rem;
}
} }
/* mas permite que os controles no canto (telefone e profile) continuem clicáveis */ @media (max-width: 768px) {
.header-container {
padding: 10px 15px;
}
.right-corner-elements {
gap: 15px;
}
.profile-picture-container {
width: 40px;
height: 40px;
}
.suporte-card-container,
.chat-container {
margin-right: 10px;
margin-left: 10px;
}
.suporte-card,
.chat-online {
width: calc(100vw - 20px);
max-width: none;
}
}
.header-container {
pointer-events: none;
}
.phone-icon-container, .phone-icon-container,
.profile-section { .profile-section {
pointer-events: auto; pointer-events: auto;
} }
/* Garantir pointer-events nos elementos do header e overlays criados por portal */
.header-container { pointer-events: auto; } .header-container { pointer-events: auto; }
.phone-icon-container, .profile-section { pointer-events: auto; } .phone-icon-container, .profile-section { pointer-events: auto; }
/* Força que os overlays criados por portal fiquem por cima */
.logout-modal-overlay, .suporte-card-overlay, .chat-overlay { .logout-modal-overlay, .suporte-card-overlay, .chat-overlay {
z-index: 110000 !important; z-index: 110000 !important;
pointer-events: auto !important; pointer-events: auto !important;
} }
/* Pequeno ajuste visual dos botões do modal (pode se misturar com seu CSS atual) */
.logout-cancel-button { .logout-cancel-button {
padding: 10px 18px; padding: 10px 18px;
border-radius: 8px; border-radius: 8px;

View File

@ -1,7 +0,0 @@
// src/utils/supabaseClient.js
import { createClient } from "@supabase/supabase-js";
import API_KEY from "./apiKeys";
const SUPABASE_URL = "https://yuanqfswhberkoevtmfr.supabase.co";
export const supabase = createClient(SUPABASE_URL, API_KEY);

View File

@ -25,5 +25,10 @@
"name": "Painel Administrativo", "name": "Painel Administrativo",
"icon": "file-bar-graph-fill", "icon": "file-bar-graph-fill",
"url": "/admin/painel" "url": "/admin/painel"
},
{
"name": "Gestão de Usuários",
"icon": "people-fill",
"url": "/admin/gestao"
} }
] ]

View File

@ -5,17 +5,26 @@
"url": "/medico/agendamento" "url": "/medico/agendamento"
}, },
{
"name": "Relatório por Áudio",
"icon": "file-earmark-plus-fill",
"url": "/medico/novo-relatorio-audio"
},
{ {
"name": "Relatórios", "name": "Relatórios",
"icon": "file-earmark-text-fill", "icon": "file-earmark-text-fill",
"url": "/medico/relatorios" "url": "/medico/relatorios"
}, },
{ {
"name": "Chat com pacientes", "name": "Chat com pacientes",
"icon": "chat-dots-fill", "icon": "chat-dots-fill",
"url": "/medico/chat" "url": "/medico/chat"
} }
] ]

View File

@ -1,13 +1,19 @@
body { *,
margin: 0; *::before,
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', *::after {
'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', box-sizing: border-box;
sans-serif; }
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; body {
} margin: 0;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
code { 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', sans-serif;
monospace; -webkit-font-smoothing: antialiased;
} -moz-osx-font-smoothing: grayscale;
}
code {
font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
monospace;
}

View File

@ -38,6 +38,9 @@ const DisponibilidadesDoctorPage = () => {
const [expandedDoctors, setExpandedDoctors] = useState({}); const [expandedDoctors, setExpandedDoctors] = useState({});
const [showSuggestions, setShowSuggestions] = useState(false); const [showSuggestions, setShowSuggestions] = useState(false);
const [availabilityEdit, setAvailabilityEdit] = useState([]); const [availabilityEdit, setAvailabilityEdit] = useState([]);
// Add the missing state variables
const [showDeleteModal, setShowDeleteModal] = useState(false);
const [selectedDisponibilidadeId, setSelectedDisponibilidadeId] = useState(null);
const getHeaders = () => { const getHeaders = () => {
const myHeaders = new Headers(); const myHeaders = new Headers();
@ -170,8 +173,24 @@ const DisponibilidadesDoctorPage = () => {
if (!window.confirm("Deseja realmente excluir esta disponibilidade?")) return; if (!window.confirm("Deseja realmente excluir esta disponibilidade?")) return;
try { try {
const res = await fetch(`${ENDPOINT}?id=eq.${id}`, { method: "DELETE", headers: getHeaders() }); const res = await fetch(`${ENDPOINT}?id=eq.${id}`, { method: "DELETE", headers: getHeaders() });
if (res.ok) setDisponibilidades((prev) => prev.filter((d) => d.id !== id)); if (res.ok) {
} catch (error) {} setDisponibilidades((prev) => prev.filter((d) => d.id !== id));
setShowDeleteModal(false);
setSelectedDisponibilidadeId(null);
}
} catch (error) {
console.error("Erro ao excluir disponibilidade:", error);
}
};
const handleOpenDeleteModal = (id) => {
setSelectedDisponibilidadeId(id);
setShowDeleteModal(true);
};
const handleCloseDeleteModal = () => {
setShowDeleteModal(false);
setSelectedDisponibilidadeId(null);
}; };
const disponibilidadesAgrupadas = useMemo(() => { const disponibilidadesAgrupadas = useMemo(() => {
@ -420,7 +439,16 @@ const DisponibilidadesDoctorPage = () => {
<td> <td>
<span className={getStatusBadgeClass(disp)}>{getStatusText(disp)}</span> <span className={getStatusBadgeClass(disp)}>{getStatusText(disp)}</span>
</td> </td>
<td>{!disp.is_empty && <button onClick={() => deletarDisponibilidade(disp.id)} className="disp-btn-delete">Excluir</button>}</td> <td>
{!disp.is_empty && (
<button
onClick={() => handleOpenDeleteModal(disp.id)}
className="disp-btn-delete"
>
Excluir
</button>
)}
</td>
</tr> </tr>
))} ))}
</tbody> </tbody>
@ -435,6 +463,51 @@ const DisponibilidadesDoctorPage = () => {
)} )}
</div> </div>
</section> </section>
{showDeleteModal && (
<div
className="modal fade show delete-modal"
style={{
display: "block",
backgroundColor: "rgba(0, 0, 0, 0.5)",
}}
tabIndex="-1"
>
<div className="modal-dialog modal-dialog-centered">
<div className="modal-content">
<div className="modal-header" style={{ backgroundColor: '#dc3545', color: 'white' }}>
<h5 className="modal-title">
Confirmação de Exclusão
</h5>
</div>
<div className="modal-body">
<p className="mb-0 fs-5">
Tem certeza que deseja excluir esta disponibilidade?
</p>
</div>
<div className="modal-footer">
<button
type="button"
className="btn btn-primary"
onClick={handleCloseDeleteModal}
>
Cancelar
</button>
<button
type="button"
className="btn btn-danger"
onClick={() => deletarDisponibilidade(selectedDisponibilidadeId)}
>
Excluir
</button>
</div>
</div>
</div>
</div>
)}
</div> </div>
); );
}; };

View File

@ -27,9 +27,8 @@ function TableDoctor({setDictInfo}) {
const [showDeleteModal, setShowDeleteModal] = useState(false); const [showDeleteModal, setShowDeleteModal] = useState(false);
const [selectedDoctorId, setSelectedDoctorId] = useState(null); const [selectedDoctorId, setSelectedDoctorId] = useState(null);
// Ordenação rápida const [sortKey, setSortKey] = useState(null);
const [sortKey, setSortKey] = useState(null); // 'nome' | 'idade' | null const [sortDir, setSortDir] = useState('asc');
const [sortDir, setSortDir] = useState('asc'); // 'asc' | 'desc'
const limparFiltros = () => { const limparFiltros = () => {
setSearch(""); setSearch("");
@ -147,7 +146,6 @@ function TableDoctor({setDictInfo}) {
return resultado; return resultado;
}) : []; }) : [];
const applySorting = (arr) => { const applySorting = (arr) => {
if (!Array.isArray(arr) || !sortKey) return arr; if (!Array.isArray(arr) || !sortKey) return arr;
const copy = [...arr]; const copy = [...arr];
@ -277,7 +275,7 @@ function TableDoctor({setDictInfo}) {
</button> </button>
</div> </div>
{/* Ordenação rápida */}
<div className="vr mx-2 d-none d-md-block" /> <div className="vr mx-2 d-none d-md-block" />
<div className="d-flex align-items-center gap-2"> <div className="d-flex align-items-center gap-2">
<span className="text-muted small">Ordenar por:</span> <span className="text-muted small">Ordenar por:</span>
@ -481,7 +479,6 @@ function TableDoctor({setDictInfo}) {
</tbody> </tbody>
</table> </table>
{/* Paginação */}
{medicosFiltrados.length > 0 && ( {medicosFiltrados.length > 0 && (
<div className="d-flex justify-content-between align-items-center mt-3"> <div className="d-flex justify-content-between align-items-center mt-3">
<div className="d-flex align-items-center"> <div className="d-flex align-items-center">
@ -554,15 +551,10 @@ function TableDoctor({setDictInfo}) {
> >
<div className="modal-dialog modal-dialog-centered"> <div className="modal-dialog modal-dialog-centered">
<div className="modal-content"> <div className="modal-content">
<div className="modal-header"> <div className="modal-header" style={{ backgroundColor: '#dc3545', color: 'white' }}>
<h5 className="modal-title"> <h5 className="modal-title">
Confirmação de Exclusão Confirmação de Exclusão
</h5> </h5>
<button
type="button"
className="btn-close"
onClick={() => setShowDeleteModal(false)}
></button>
</div> </div>
<div className="modal-body"> <div className="modal-body">

View File

@ -9,6 +9,7 @@ import { useAuth } from '../components/utils/AuthProvider'
const EditPage = ({DictInfo}) => { const EditPage = ({DictInfo}) => {
const navigate = useNavigate() const navigate = useNavigate()
const [PatientToPUT, setPatientPUT] = useState({}) const [PatientToPUT, setPatientPUT] = useState({})
const [showSuccessModal, setShowSuccessModal] = useState(false)
const { getAuthorizationHeader, isAuthenticated } = useAuth(); const { getAuthorizationHeader, isAuthenticated } = useAuth();
@ -37,9 +38,15 @@ const HandlePutPatient = async () => {
}; };
fetch(`https://yuanqfswhberkoevtmfr.supabase.co/rest/v1/patients?id=eq.${PatientToPUT.id}`,requestOptions) fetch(`https://yuanqfswhberkoevtmfr.supabase.co/rest/v1/patients?id=eq.${PatientToPUT.id}`,requestOptions)
.then(response => console.log(response)) .then(response => {
console.log(response)
if (response.ok) {
setShowSuccessModal(true)
}
return response
})
.then(result => console.log(result)) .then(result => console.log(result))
.catch(console.log("erro")) .catch(error => console.log("erro", error))
}; };
@ -52,6 +59,46 @@ const HandlePutPatient = async () => {
formData={PatientToPUT} formData={PatientToPUT}
setFormData={setPatientPUT} setFormData={setPatientPUT}
/> />
{showSuccessModal && (
<div
className="modal fade show delete-modal"
style={{
display: "block",
backgroundColor: "rgba(0, 0, 0, 0,5)",
}}
tabIndex="-1"
>
<div className="modal-dialog modal-dialog-centered">
<div className="modal-content">
<div className="modal-header" style={{ backgroundColor: '#1e3a8a', color: 'white' }}>
<h5 className="modal-title">
Paciente Editado
</h5>
</div>
<div className="modal-body">
<p className="mb-0 fs-5">
Paciente editado com sucesso!
</p>
</div>
<div className="modal-footer">
<button
type="button"
className="btn btn-primary"
onClick={() => {
setShowSuccessModal(false)
navigate(-1)
}}
>
OK
</button>
</div>
</div>
</div>
</div>
)}
</div> </div>
) )

View File

@ -1,4 +1,5 @@
import React, { useState, useEffect, useCallback, useMemo } from 'react'; import React, { useState, useEffect, useCallback, useMemo } from 'react';
import { useNavigate } from 'react-router-dom';
import dayjs from 'dayjs'; import dayjs from 'dayjs';
import 'dayjs/locale/pt-br'; import 'dayjs/locale/pt-br';
import weekday from 'dayjs/plugin/weekday'; import weekday from 'dayjs/plugin/weekday';
@ -23,12 +24,10 @@ const getDateRange = (date, view) => {
toDate = startDayjs.format('YYYY-MM-DD'); toDate = startDayjs.format('YYYY-MM-DD');
titleRange = startDayjs.format('DD/MM/YYYY'); titleRange = startDayjs.format('DD/MM/YYYY');
} else if (view === 'semanal') { } else if (view === 'semanal') {
// Padrão Dayjs: Sunday=0, Monday=1.
// startOf('week') pode ser Domingo ou Segunda, dependendo do locale.
// Se precisar forçar a Segunda-feira:
let weekStart = startDayjs.startOf('week'); let weekStart = startDayjs.startOf('week');
if (weekStart.day() !== 1) { // Se não for segunda-feira (1), ajusta if (weekStart.day() !== 1) {
weekStart = startDayjs.weekday(1); // Vai para a segunda-feira desta semana weekStart = startDayjs.weekday(1);
} }
const weekEnd = weekStart.add(6, 'day'); const weekEnd = weekStart.add(6, 'day');
@ -52,12 +51,21 @@ const getDateRange = (date, view) => {
const ExcecoesDisponibilidade = () => { const ExcecoesDisponibilidade = () => {
const { getAuthorizationHeader } = useAuth(); const { getAuthorizationHeader } = useAuth();
const navigate = useNavigate();
const [pageNovaExcecao, setPageNovaExcecao] = useState(false); const [pageNovaExcecao, setPageNovaExcecao] = useState(false);
const [excecoes, setExcecoes] = useState([]); const [excecoes, setExcecoes] = useState([]);
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
const [showDeleteModal, setShowDeleteModal] = useState(false);
const [selectedExceptionId, setSelectedExceptionId] = useState(null);
const [showSuccessModal, setShowSuccessModal] = useState(false);
const [successMessage, setSuccessMessage] = useState('');
const [filtroMedicoId, setFiltroMedicoId] = useState(''); const [filtroMedicoId, setFiltroMedicoId] = useState('');
const [filtroData, setFiltroData] = useState(dayjs().format('YYYY-MM-DD')); const [filtroData, setFiltroData] = useState(dayjs().format('YYYY-MM-DD'));
const [listaDeMedicos, setListaDeMedicos] = useState([]);
const [searchTermDoctor, setSearchTermDoctor] = useState('');
const [filteredDoctors, setFilteredDoctors] = useState([]);
const [selectedDoctor, setSelectedDoctor] = useState(null);
const [visualizacao, setVisualizacao] = useState('diario'); const [visualizacao, setVisualizacao] = useState('diario');
@ -123,8 +131,51 @@ const ExcecoesDisponibilidade = () => {
fetchExcecoes(fromDate, toDate, filtroMedicoId); fetchExcecoes(fromDate, toDate, filtroMedicoId);
}, [fetchExcecoes, filtroMedicoId, fromDate, toDate]); }, [fetchExcecoes, filtroMedicoId, fromDate, toDate]);
useEffect(() => {
const fetchDoctors = async () => {
const myHeaders = new Headers();
const authHeader = resolveAuthHeader();
if (authHeader) myHeaders.append("Authorization", authHeader);
if (API_KEY) myHeaders.append("apikey", API_KEY);
try {
const response = await fetch('https://yuanqfswhberkoevtmfr.supabase.co/rest/v1/doctors?select=id,full_name', {
method: 'GET',
headers: myHeaders
});
if (response.ok) {
const doctors = await response.json();
setListaDeMedicos(doctors);
}
} catch (error) {
console.error('Erro ao buscar médicos:', error);
}
};
fetchDoctors();
}, []);
const handleSearchDoctors = (term) => {
setSearchTermDoctor(term);
if (term.trim() === '') {
setFilteredDoctors([]);
return;
}
const filtered = listaDeMedicos.filter(doc =>
doc.full_name.toLowerCase().includes(term.toLowerCase())
);
setFilteredDoctors(filtered);
};
const limparFiltros = () => {
setSearchTermDoctor('');
setFilteredDoctors([]);
setSelectedDoctor(null);
setFiltroMedicoId('');
setFiltroData(dayjs().format('YYYY-MM-DD'));
setVisualizacao('diario');
};
const deleteExcecao = async (id) => { const deleteExcecao = async (id) => {
if (!window.confirm("Confirma exclusão desta exceção?")) return;
const myHeaders = new Headers(); const myHeaders = new Headers();
const authHeader = resolveAuthHeader(); const authHeader = resolveAuthHeader();
if (authHeader) myHeaders.append("Authorization", authHeader); if (authHeader) myHeaders.append("Authorization", authHeader);
@ -139,6 +190,9 @@ const ExcecoesDisponibilidade = () => {
}); });
if (res.ok) { if (res.ok) {
setExcecoes(prev => prev.filter(x => x.id !== id)); setExcecoes(prev => prev.filter(x => x.id !== id));
setShowDeleteModal(false);
setSuccessMessage('Exceção excluída com sucesso!');
setShowSuccessModal(true);
} else { } else {
const text = await res.text(); const text = await res.text();
console.error('Erro ao deletar exceção', res.status, text); console.error('Erro ao deletar exceção', res.status, text);
@ -163,7 +217,7 @@ const ExcecoesDisponibilidade = () => {
return ( return (
<div> <div>
{/* Título e Botão de Criação */}
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '15px' }}> <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '15px' }}>
<h1>Gerenciar Exceções de Disponibilidade</h1> <h1>Gerenciar Exceções de Disponibilidade</h1>
<button <button
@ -175,30 +229,80 @@ const ExcecoesDisponibilidade = () => {
</button> </button>
</div> </div>
<div className='atendimento-eprocura'> <div className="card p-3 mb-3" style={{ marginTop: '20px' }}>
<h5 className="mb-3">
<i className="bi bi-funnel-fill me-2 text-primary"></i>
Filtros
</h5>
{/* Filtros de Médico e Data */} <div className="row g-3 mb-3">
<div className='busca-atendimento'> <div className="col-md-6">
<div> <label className="form-label fw-bold">Buscar Médico</label>
<i className="fa-solid fa-user-doctor"></i>
<input <input
type="text" type="text"
placeholder="Filtrar por ID do Médico..." className="form-control"
value={filtroMedicoId} placeholder="Digite o nome do médico..."
onChange={(e) => setFiltroMedicoId(e.target.value)} value={searchTermDoctor}
onChange={(e) => handleSearchDoctors(e.target.value)}
/> />
<small className="text-muted">Filtre as exceções por médico</small>
{searchTermDoctor && filteredDoctors.length > 0 && (
<div className="list-group mt-2" style={{ maxHeight: '200px', overflowY: 'auto' }}>
{filteredDoctors.map((doc) => (
<button
key={doc.id}
className="list-group-item list-group-item-action"
onClick={() => {
setSearchTermDoctor(doc.full_name);
setFilteredDoctors([]);
setSelectedDoctor(doc);
setFiltroMedicoId(doc.id);
}}
>
{doc.full_name}
</button>
))}
</div>
)}
</div> </div>
<div>
<i className="fa-solid fa-calendar"></i> <div className="col-md-6">
<input <label className="form-label fw-bold">Data de Referência</label>
<input
type="date" type="date"
className="form-control"
value={filtroData} value={filtroData}
onChange={(e) => setFiltroData(e.target.value)} onChange={(e) => setFiltroData(e.target.value)}
/> />
<small className="text-muted">Selecione a data base para visualização</small>
</div> </div>
</div> </div>
{/* Botões de Visualização (Dia/Semana/Mês) */} <div className="d-flex justify-content-between align-items-center">
<div>
{selectedDoctor && (
<span className="badge bg-primary me-2">
<i className="bi bi-person-fill me-1"></i>
{selectedDoctor.full_name}
</span>
)}
<div className="contador-pacientes" style={{ display: 'inline-block' }}>
{excecoes.length} DE {excecoes.length} EXCEÇÕES ENCONTRADAS
</div>
</div>
<button
className="btn btn-outline-secondary btn-sm"
onClick={limparFiltros}
>
<i className="bi bi-arrow-clockwise me-1"></i> Limpar Filtros
</button>
</div>
</div>
<div className='atendimento-eprocura'>
<div className='container-btns-agenda-fila_esepera'> <div className='container-btns-agenda-fila_esepera'>
<button <button
className={`btn-agenda ${visualizacao === "diario" ? "opc-agenda-ativo" : ""}`} className={`btn-agenda ${visualizacao === "diario" ? "opc-agenda-ativo" : ""}`}
@ -220,7 +324,7 @@ const ExcecoesDisponibilidade = () => {
</button> </button>
</div> </div>
{/* Tabela de Exceções (Título usa o titleRange calculado) */}
<section className='calendario-ou-filaespera'> <section className='calendario-ou-filaespera'>
<div className="fila-container"> <div className="fila-container">
<h2 className="fila-titulo">Exceções em {titleRange} ({excecoes.length})</h2> <h2 className="fila-titulo">Exceções em {titleRange} ({excecoes.length})</h2>
@ -264,7 +368,10 @@ const ExcecoesDisponibilidade = () => {
<button <button
className="btn btn-sm btn-delete" className="btn btn-sm btn-delete"
onClick={() => deleteExcecao(exc.id)} onClick={() => {
setSelectedExceptionId(exc.id);
setShowDeleteModal(true);
}}
> >
<i className="bi bi-trash me-1"></i> Excluir <i className="bi bi-trash me-1"></i> Excluir
</button> </button>
@ -278,6 +385,89 @@ const ExcecoesDisponibilidade = () => {
</div> </div>
</section> </section>
</div> </div>
{showDeleteModal && (
<div
className="modal fade show delete-modal"
style={{
display: "block",
backgroundColor: "rgba(0, 0, 0, 0.5)",
}}
tabIndex="-1"
>
<div className="modal-dialog modal-dialog-centered">
<div className="modal-content">
<div className="modal-header" style={{ backgroundColor: '#dc3545', color: 'white' }}>
<h5 className="modal-title">
Confirmação de Exclusão
</h5>
</div>
<div className="modal-body">
<p className="mb-0 fs-5">
Tem certeza que deseja excluir esta exceção?
</p>
</div>
<div className="modal-footer">
<button
type="button"
className="btn btn-primary"
onClick={() => setShowDeleteModal(false)}
>
Cancelar
</button>
<button
type="button"
className="btn btn-danger"
onClick={() => deleteExcecao(selectedExceptionId)}
>
Excluir
</button>
</div>
</div>
</div>
</div>
)}
{showSuccessModal && (
<div
className="modal fade show delete-modal"
style={{
display: "block",
backgroundColor: "rgba(0, 0, 0, 0.5)",
}}
tabIndex="-1"
>
<div className="modal-dialog modal-dialog-centered">
<div className="modal-content">
<div className="modal-header" style={{ backgroundColor: '#1e3a8a', color: 'white' }}>
<h5 className="modal-title">
Sucesso
</h5>
</div>
<div className="modal-body">
<p className="mb-0 fs-5">
{successMessage}
</p>
</div>
<div className="modal-footer">
<button
type="button"
className="btn btn-primary"
onClick={() => setShowSuccessModal(false)}
>
OK
</button>
</div>
</div>
</div>
</div>
)}
</div> </div>
); );
} }

View File

@ -1,5 +1,5 @@
import React, { useState, useEffect, useMemo, useCallback } from "react"; import React, { useState, useEffect, useMemo, useCallback } from "react";
import './style/FinanceiroDashboard.css'; import "./style/FinanceiroDashboard.css";
const CONVENIOS_LIST = [ const CONVENIOS_LIST = [
"Particular", "Particular",
@ -8,72 +8,77 @@ const CONVENIOS_LIST = [
"SulAmérica", "SulAmérica",
"Unimed", "Unimed",
"Cassio", "Cassio",
"Outro" "Outro",
]; ];
function CurrencyInput({ value, onChange, label, id }) { function CurrencyInput({ value, onChange, label, id }) {
const formattedValue = useMemo(() => { const formattedValue = useMemo(() => {
let numericValue = Number(value) || 0; let numericValue = Number(value) || 0;
let stringValue = String(numericValue); let stringValue = String(numericValue);
while (stringValue.length < 3) { while (stringValue.length < 3) {
stringValue = '0' + stringValue; stringValue = "0" + stringValue;
} }
const integerPart = stringValue.slice(0, -2); const integerPart = stringValue.slice(0, -2);
const decimalPart = stringValue.slice(-2); const decimalPart = stringValue.slice(-2);
const formattedInteger = integerPart.replace(/\B(?=(\d{3})+(?!\d))/g, '.'); const formattedInteger = integerPart.replace(/\B(?=(\d{3})+(?!\d))/g, ".");
return `R$ ${formattedInteger},${decimalPart}`; return `R$ ${formattedInteger},${decimalPart}`;
}, [value]); }, [value]);
const handleKeyDown = useCallback((e) => { const handleKeyDown = useCallback(
const key = e.key; (e) => {
const key = e.key;
if (['Backspace', 'Delete', 'ArrowLeft', 'ArrowRight', 'Tab'].includes(key)) { if (
if (key === 'Backspace' || key === 'Delete') { ["Backspace", "Delete", "ArrowLeft", "ArrowRight", "Tab"].includes(key)
) {
if (key === "Backspace" || key === "Delete") {
e.preventDefault(); e.preventDefault();
const numericValue = value || 0; const numericValue = value || 0;
let newValueString = String(numericValue); let newValueString = String(numericValue);
if (newValueString.length <= 1) { if (newValueString.length <= 1) {
onChange(0); onChange(0);
} else { } else {
const newNumericValue = parseInt(newValueString.slice(0, -1)) || 0; const newNumericValue = parseInt(newValueString.slice(0, -1)) || 0;
onChange(newNumericValue); onChange(newNumericValue);
} }
}
return;
}
if (!/^\d$/.test(key)) {
e.preventDefault();
return;
} }
return;
}
if (!/^\d$/.test(key)) {
e.preventDefault(); e.preventDefault();
return;
}
e.preventDefault();
const digit = key;
const numericValue = value || 0;
let newValueString = String(numericValue) + digit; const digit = key;
const numericValue = value || 0;
if (newValueString.length > 10) return;
const newNumericValue = parseInt(newValueString); let newValueString = String(numericValue) + digit;
onChange(newNumericValue); if (newValueString.length > 10) return;
}, [value, onChange]);
const newNumericValue = parseInt(newValueString);
onChange(newNumericValue);
},
[value, onChange]
);
return ( return (
<div className="form-group"> <div className="form-group">
<label htmlFor={id}>{label}</label> <label htmlFor={id}>{label}</label>
<input <input
id={id} id={id}
className="input-field currency-input" className="input-field currency-input"
type="text" type="text"
value={formattedValue} value={formattedValue}
onChange={() => {}} onChange={() => {}}
onKeyDown={handleKeyDown} onKeyDown={handleKeyDown}
placeholder="R$ 0,00" placeholder="R$ 0,00"
/> />
@ -86,12 +91,12 @@ function mockFetchPagamentos() {
{ {
id: "PAY-001", id: "PAY-001",
paciente: { nome: "Sarah Oliveira", convenio: "Unimed" }, paciente: { nome: "Sarah Oliveira", convenio: "Unimed" },
valor: 20000, valor: 20000,
forma_pagamento: "Cartão", forma_pagamento: "Cartão",
data_vencimento: "2025-09-30", data_vencimento: "2025-09-30",
status: "pendente", status: "pendente",
desconto: 0, desconto: 0,
observacoes: "Pagamento parcelado em 2x" observacoes: "Pagamento parcelado em 2x",
}, },
{ {
id: "PAY-002", id: "PAY-002",
@ -100,8 +105,8 @@ function mockFetchPagamentos() {
forma_pagamento: "Dinheiro", forma_pagamento: "Dinheiro",
data_vencimento: "2025-09-15", data_vencimento: "2025-09-15",
status: "pago", status: "pago",
desconto: 1000, desconto: 1000,
observacoes: "" observacoes: "",
}, },
{ {
id: "PAY-003", id: "PAY-003",
@ -111,18 +116,18 @@ function mockFetchPagamentos() {
data_vencimento: "2025-09-20", data_vencimento: "2025-09-20",
status: "vencido", status: "vencido",
desconto: 0, desconto: 0,
observacoes: "Não respondeu ao contato" observacoes: "Não respondeu ao contato",
}, },
{ {
id: "PAY-004", id: "PAY-004",
paciente: { nome: "Carlos Almeida", convenio: "Particular" }, paciente: { nome: "Carlos Almeida", convenio: "Particular" },
valor: 10000, valor: 10000,
forma_pagamento: "Transferência", forma_pagamento: "Transferência",
data_vencimento: "2025-09-29", data_vencimento: "2025-09-29",
status: "pago", status: "pago",
desconto: 500, desconto: 500,
observacoes: "Desconto por pagamento adiantado" observacoes: "Desconto por pagamento adiantado",
} },
]; ];
} }
@ -132,7 +137,11 @@ export default function FinanceiroDashboard() {
const [query, setQuery] = useState(""); const [query, setQuery] = useState("");
const [filtroStatus, setFiltroStatus] = useState("Todos"); const [filtroStatus, setFiltroStatus] = useState("Todos");
const [novoPagamento, setNovoPagamento] = useState(false); const [novoPagamento, setNovoPagamento] = useState(false);
const [summary, setSummary] = useState({ totalRecebido: 0, totalAReceber: 0, totalDescontos: 0 }); const [summary, setSummary] = useState({
totalRecebido: 0,
totalAReceber: 0,
totalDescontos: 0,
});
useEffect(() => { useEffect(() => {
const data = mockFetchPagamentos(); const data = mockFetchPagamentos();
@ -141,7 +150,13 @@ export default function FinanceiroDashboard() {
function formatCurrency(centavos) { function formatCurrency(centavos) {
const valorEmReais = centavos / 100; const valorEmReais = centavos / 100;
return "R$ " + valorEmReais.toFixed(2).replace(".", ",").replace(/\B(?=(\d{3})+(?!\d))/g, '.'); return (
"R$ " +
valorEmReais
.toFixed(2)
.replace(".", ",")
.replace(/\B(?=(\d{3})+(?!\d))/g, ".")
);
} }
function getValorLiquido(valor, desconto) { function getValorLiquido(valor, desconto) {
@ -149,11 +164,12 @@ export default function FinanceiroDashboard() {
} }
const filteredPagamentos = useMemo(() => { const filteredPagamentos = useMemo(() => {
return pagamentos.filter(p => { return pagamentos.filter((p) => {
const q = query.toLowerCase(); const q = query.toLowerCase();
const statusOk = filtroStatus === "Todos" || p.status === filtroStatus; const statusOk = filtroStatus === "Todos" || p.status === filtroStatus;
const buscaOk = p.paciente.nome.toLowerCase().includes(q) || const buscaOk =
p.id.toLowerCase().includes(q); p.paciente.nome.toLowerCase().includes(q) ||
p.id.toLowerCase().includes(q);
return statusOk && buscaOk; return statusOk && buscaOk;
}); });
}, [pagamentos, query, filtroStatus]); }, [pagamentos, query, filtroStatus]);
@ -163,47 +179,55 @@ export default function FinanceiroDashboard() {
let aReceber = 0; let aReceber = 0;
let descontos = 0; let descontos = 0;
filteredPagamentos.forEach(p => { filteredPagamentos.forEach((p) => {
const valorLiquido = getValorLiquido(p.valor, p.desconto); const valorLiquido = getValorLiquido(p.valor, p.desconto);
if (p.status === 'pago') { if (p.status === "pago") {
recebido += valorLiquido; recebido += valorLiquido;
descontos += p.desconto; descontos += p.desconto;
} else { } else {
aReceber += p.valor; aReceber += valorLiquido;
} }
}); });
setSummary({ setSummary({
totalRecebido: recebido, totalRecebido: recebido,
totalAReceber: aReceber, totalAReceber: aReceber,
totalDescontos: descontos totalDescontos: descontos,
}); });
}, [filteredPagamentos]); }, [filteredPagamentos]);
function handleDelete(id) { function handleDelete(id) {
if (window.confirm("Tem certeza que deseja excluir este pagamento?")) { if (window.confirm("Tem certeza que deseja excluir este pagamento?")) {
setPagamentos(prev => prev.filter(p => p.id !== id)); setPagamentos((prev) => prev.filter((p) => p.id !== id));
setModalPagamento(null); setModalPagamento(null);
} }
} }
function handleSave(pagamento) { function handleSave(pagamento) {
if (!pagamento.paciente.nome || !pagamento.valor || !pagamento.data_vencimento || !pagamento.paciente.convenio) { if (
alert("Preencha Paciente, Convênio, Valor e Data de Vencimento."); !pagamento.paciente.nome ||
return; !pagamento.valor ||
!pagamento.data_vencimento ||
!pagamento.paciente.convenio
) {
alert("Preencha Paciente, Convênio, Valor e Data de Vencimento.");
return;
} }
if (novoPagamento) { if (novoPagamento) {
const newId = "PAY-" + (pagamentos.length + 1).toString().padStart(3, "0"); const newId =
pagamento.id = newId; "PAY-" + (pagamentos.length + 1).toString().padStart(3, "0");
setPagamentos(prev => [...prev, pagamento]); pagamento.id = newId;
setPagamentos((prev) => [...prev, pagamento]);
} else { } else {
setPagamentos(prev => prev.map(p => p.id === pagamento.id ? pagamento : p)); setPagamentos((prev) =>
prev.map((p) => (p.id === pagamento.id ? pagamento : p))
);
} }
setModalPagamento(null); setModalPagamento(null);
setNovoPagamento(false); setNovoPagamento(false);
} }
const closeModal = () => { const closeModal = () => {
setModalPagamento(null); setModalPagamento(null);
setNovoPagamento(false); setNovoPagamento(false);
@ -212,51 +236,54 @@ export default function FinanceiroDashboard() {
return ( return (
<div className="financeiro-wrap"> <div className="financeiro-wrap">
<h2>Controle Financeiro</h2> <h2>Controle Financeiro</h2>
<div className="summary-card-container"> <div className="summary-card-container">
<div className="summary-card green"> <div className="summary-card green">
<h3>Total Recebido (Filtrado)</h3> <h3>Total Recebido (Filtrado)</h3>
<p className="value">{formatCurrency(summary.totalRecebido)}</p> <p className="value">{formatCurrency(summary.totalRecebido)}</p>
</div> </div>
<div className="summary-card red"> <div className="summary-card red">
<h3>Total a Receber (Filtrado)</h3> <h3>Total a Receber (Filtrado)</h3>
<p className="value">{formatCurrency(summary.totalAReceber)}</p> <p className="value">{formatCurrency(summary.totalAReceber)}</p>
</div> </div>
<div className="summary-card blue"> <div className="summary-card blue">
<h3>Descontos Aplicados</h3> <h3>Descontos Aplicados</h3>
<p className="value">{formatCurrency(summary.totalDescontos)}</p> <p className="value">{formatCurrency(summary.totalDescontos)}</p>
</div> </div>
</div> </div>
<div className="list-page-card"> <div className="list-page-card">
<div style={{ display:"flex", gap:12, marginBottom:20 }}> <div style={{ display: "flex", gap: 12, marginBottom: 20 }}>
<input <input
className="input-field" className="input-field"
placeholder="Buscar paciente" placeholder="Buscar paciente"
value={query} value={query}
onChange={e => setQuery(e.target.value)} onChange={(e) => setQuery(e.target.value)}
style={{ flexGrow: 1 }} style={{ flexGrow: 1 }}
/> />
<select className="select-field" value={filtroStatus} onChange={e => setFiltroStatus(e.target.value)}> <select
className="select-field"
value={filtroStatus}
onChange={(e) => setFiltroStatus(e.target.value)}
>
<option value="Todos">Todos</option> <option value="Todos">Todos</option>
<option value="pago">Pago</option> <option value="pago">Pago</option>
<option value="pendente">Pendente</option> <option value="pendente">Pendente</option>
<option value="vencido">Vencido</option> <option value="vencido">Vencido</option>
</select> </select>
<button <button
className="action-btn" className="btn btn-primary"
style={{ background: "#3b82f6", color: "#fff", borderColor: "#3b82f6" }} onClick={() => {
onClick={() => {
setModalPagamento({ setModalPagamento({
paciente: { nome:"", convenio: CONVENIOS_LIST[0] }, paciente: { nome: "", convenio: CONVENIOS_LIST[0] },
valor:0, valor: 0,
forma_pagamento:"Dinheiro", forma_pagamento: "Dinheiro",
data_vencimento: new Date().toISOString().split('T')[0], data_vencimento: new Date().toISOString().split("T")[0],
status:"pendente", status: "pendente",
desconto:0, desconto: 0,
observacoes:"" observacoes: "",
}); });
setNovoPagamento(true); setNovoPagamento(true);
}} }}
> >
+ Adicionar Pagamento + Adicionar Pagamento
@ -269,12 +296,12 @@ export default function FinanceiroDashboard() {
<div className="table-container"> <div className="table-container">
<table> <table>
<thead> <thead>
<tr> <tr>
<th>Paciente</th> <th>Paciente</th>
<th>Convênio</th> <th>Convênio</th>
<th>Valor Total (R$)</th> <th>Valor Total (R$)</th>
<th>Desconto (R$)</th> <th>Desconto (R$)</th>
<th>Valor Líquido (R$)</th> <th>Valor Líquido (R$)</th>
<th>Forma</th> <th>Forma</th>
<th>Vencimento</th> <th>Vencimento</th>
<th>Status</th> <th>Status</th>
@ -282,29 +309,38 @@ export default function FinanceiroDashboard() {
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
{filteredPagamentos.map(p => ( {filteredPagamentos.map((p) => (
<tr key={p.id}> <tr key={p.id}>
<td>{p.paciente.nome}</td> <td style={{ fontWeight: 600 }}>{p.paciente.nome}</td>
<td>{p.paciente.convenio}</td> <td>{p.paciente.convenio}</td>
<td>{formatCurrency(p.valor)}</td> <td>{formatCurrency(p.valor)}</td>
<td>{formatCurrency(p.desconto)}</td> <td>{formatCurrency(p.desconto)}</td>
<td style={{ fontWeight: 600 }}>{formatCurrency(getValorLiquido(p.valor, p.desconto))}</td> <td style={{ fontWeight: 600 }}>
{formatCurrency(getValorLiquido(p.valor, p.desconto))}
</td>
<td>{p.forma_pagamento}</td> <td>{p.forma_pagamento}</td>
<td>{p.data_vencimento.split('-').reverse().join('/')}</td> <td>{p.data_vencimento.split("-").reverse().join("/")}</td>
<td><span className={`badge ${p.status}`}>{p.status.toUpperCase()}</span></td>
<td> <td>
<div className="action-group"> <span className={`badge ${p.status}`}>
<button {p.status.toUpperCase()}
className="action-btn" </span>
onClick={() => { setModalPagamento({...p}); setNovoPagamento(false); }} </td>
<td>
<div className="action-group">
<button
className="btn-view"
onClick={() => {
setModalPagamento({ ...p });
setNovoPagamento(false);
}}
> >
Ver / Editar <i className="bi bi-eye me-1"></i> Ver Detalhes
</button> </button>
<button <button
className="action-btn delete" className="btn-delete"
onClick={() => handleDelete(p.id)} onClick={() => handleDelete(p.id)}
> >
Excluir <i className="bi bi-trash me-1"></i> Excluir
</button> </button>
</div> </div>
</td> </td>
@ -317,21 +353,38 @@ export default function FinanceiroDashboard() {
</div> </div>
{modalPagamento && ( {modalPagamento && (
<div className="modal" onClick={(e) => e.target.classList.contains('modal') && closeModal()}> <div
className="modal"
onClick={(e) => e.target.classList.contains("modal") && closeModal()}
>
<div className="modal-card"> <div className="modal-card">
<div className="modal-header"> <div className="modal-header">
<h2>{novoPagamento ? "Adicionar Pagamento" : `Editar Pagamento - ${modalPagamento.paciente.nome}`}</h2> <h2>
<button className="close-btn" onClick={closeModal}>×</button> {novoPagamento
? "Adicionar Pagamento"
: `Editar Pagamento - ${modalPagamento.paciente.nome}`}
</h2>
<button className="close-btn" onClick={closeModal}>
×
</button>
</div> </div>
<div className="modal-body"> <div className="modal-body">
<div className="form-group"> <div className="form-group">
<label htmlFor="paciente_nome">Paciente</label> <label htmlFor="paciente_nome">Paciente</label>
<input <input
id="paciente_nome" id="paciente_nome"
className="input-field" className="input-field"
value={modalPagamento.paciente.nome} value={modalPagamento.paciente.nome}
onChange={e => setModalPagamento({...modalPagamento, paciente:{...modalPagamento.paciente, nome:e.target.value}})} onChange={(e) =>
setModalPagamento({
...modalPagamento,
paciente: {
...modalPagamento.paciente,
nome: e.target.value,
},
})
}
/> />
</div> </div>
@ -339,13 +392,23 @@ export default function FinanceiroDashboard() {
<label htmlFor="convenio">Convênio</label> <label htmlFor="convenio">Convênio</label>
<select <select
id="convenio" id="convenio"
className="select-field" className="select-field"
value={modalPagamento.paciente.convenio} value={modalPagamento.paciente.convenio}
onChange={e => setModalPagamento({...modalPagamento, paciente:{...modalPagamento.paciente, convenio:e.target.value}})} onChange={(e) =>
setModalPagamento({
...modalPagamento,
paciente: {
...modalPagamento.paciente,
convenio: e.target.value,
},
})
}
> >
<option value="">Selecione</option> <option value="">Selecione</option>
{CONVENIOS_LIST.map(conv => ( {CONVENIOS_LIST.map((conv) => (
<option key={conv} value={conv}>{conv}</option> <option key={conv} value={conv}>
{conv}
</option>
))} ))}
</select> </select>
</div> </div>
@ -353,23 +416,32 @@ export default function FinanceiroDashboard() {
id="valor" id="valor"
label="Valor da consulta (R$)" label="Valor da consulta (R$)"
value={modalPagamento.valor} value={modalPagamento.valor}
onChange={newValue => setModalPagamento({...modalPagamento, valor: newValue})} onChange={(newValue) =>
setModalPagamento({ ...modalPagamento, valor: newValue })
}
/> />
<CurrencyInput <CurrencyInput
id="desconto" id="desconto"
label="Desconto aplicado (R$)" label="Desconto aplicado (R$)"
value={modalPagamento.desconto} value={modalPagamento.desconto}
onChange={newValue => setModalPagamento({...modalPagamento, desconto: newValue})} onChange={(newValue) =>
setModalPagamento({ ...modalPagamento, desconto: newValue })
}
/> />
<div className="form-group"> <div className="form-group">
<label htmlFor="forma">Forma de pagamento</label> <label htmlFor="forma">Forma de pagamento</label>
<select <select
id="forma" id="forma"
className="select-field" className="select-field"
value={modalPagamento.forma_pagamento} value={modalPagamento.forma_pagamento}
onChange={e => setModalPagamento({...modalPagamento, forma_pagamento:e.target.value})} onChange={(e) =>
setModalPagamento({
...modalPagamento,
forma_pagamento: e.target.value,
})
}
> >
<option>Dinheiro</option> <option>Dinheiro</option>
<option>Cartão</option> <option>Cartão</option>
@ -380,22 +452,32 @@ export default function FinanceiroDashboard() {
<div className="form-group"> <div className="form-group">
<label htmlFor="vencimento">Data de vencimento</label> <label htmlFor="vencimento">Data de vencimento</label>
<input <input
id="vencimento" id="vencimento"
className="input-field" className="input-field"
type="date" type="date"
value={modalPagamento.data_vencimento} value={modalPagamento.data_vencimento}
onChange={e => setModalPagamento({...modalPagamento, data_vencimento:e.target.value})} onChange={(e) =>
setModalPagamento({
...modalPagamento,
data_vencimento: e.target.value,
})
}
/> />
</div> </div>
<div className="form-group"> <div className="form-group">
<label htmlFor="status">Status do pagamento</label> <label htmlFor="status">Status do pagamento</label>
<select <select
id="status" id="status"
className="select-field" className="select-field"
value={modalPagamento.status} value={modalPagamento.status}
onChange={e => setModalPagamento({...modalPagamento, status:e.target.value})} onChange={(e) =>
setModalPagamento({
...modalPagamento,
status: e.target.value,
})
}
> >
<option value="pago">Pago</option> <option value="pago">Pago</option>
<option value="pendente">Pendente</option> <option value="pendente">Pendente</option>
@ -405,27 +487,30 @@ export default function FinanceiroDashboard() {
<div className="form-group"> <div className="form-group">
<label htmlFor="observacoes">Observações financeiras</label> <label htmlFor="observacoes">Observações financeiras</label>
<textarea <textarea
id="observacoes" id="observacoes"
className="input-field" className="input-field"
rows={3} rows={3}
value={modalPagamento.observacoes} value={modalPagamento.observacoes}
onChange={e => setModalPagamento({...modalPagamento, observacoes:e.target.value})} onChange={(e) =>
setModalPagamento({
...modalPagamento,
observacoes: e.target.value,
})
}
/> />
</div> </div>
</div> <div className="modal-footer">
<button
<div className="modal-footer"> className="btn-view"
<button className="action-btn" onClick={() => handleSave(modalPagamento)}> onClick={() => handleSave(modalPagamento)}
Salvar >
</button> <i className="bi bi-check-circle me-1"></i> Salvar
<button </button>
className="action-btn" <button className="btn-delete" onClick={closeModal}>
onClick={closeModal} <i className="bi bi-x-circle me-1"></i> Cancelar
style={{ borderColor: '#d1d5db', color: '#4b5563' }} </button>
> </div>
Cancelar
</button>
</div> </div>
</div> </div>
</div> </div>

View File

@ -32,7 +32,6 @@ const LaudoManager = () => {
const [paginaAtual, setPaginaAtual] = useState(1); const [paginaAtual, setPaginaAtual] = useState(1);
const [itensPorPagina, setItensPorPagina] = useState(10); const [itensPorPagina, setItensPorPagina] = useState(10);
// agora guardamos a mensagem (null = sem aviso)
const [noPermissionText, setNoPermissionText] = useState(null); const [noPermissionText, setNoPermissionText] = useState(null);
const isSecretary = true; const isSecretary = true;
@ -162,11 +161,11 @@ const LaudoManager = () => {
const handleLiberarLaudo = async (relatorio) => { const handleLiberarLaudo = async (relatorio) => {
if (isSecretary) { if (isSecretary) {
// MUDANÇA: mostrar "Ainda não implementado"
setNoPermissionText('Ainda não implementado'); setNoPermissionText('Ainda não implementado');
return; return;
} }
// para médicos: implementação real já estava antes (mantive o bloco, caso queira)
try { try {
const myHeaders = new Headers(); const myHeaders = new Headers();
myHeaders.append('apikey', API_KEY); myHeaders.append('apikey', API_KEY);
@ -187,7 +186,6 @@ const LaudoManager = () => {
throw new Error('Erro ao liberar laudo: ' + res.status + ' ' + txt); throw new Error('Erro ao liberar laudo: ' + res.status + ' ' + txt);
} }
// refetch simples
const refreshed = await fetch("https://yuanqfswhberkoevtmfr.supabase.co/rest/v1/reports?select=*", { const refreshed = await fetch("https://yuanqfswhberkoevtmfr.supabase.co/rest/v1/reports?select=*", {
method: 'GET', method: 'GET',
headers: (() => { const h=new Headers(); h.append('apikey', API_KEY); if(authHeader) h.append('Authorization', authHeader); return h; })(), headers: (() => { const h=new Headers(); h.append('apikey', API_KEY); if(authHeader) h.append('Authorization', authHeader); return h; })(),
@ -327,7 +325,7 @@ const LaudoManager = () => {
<i className="bi bi-pencil me-1"></i> Editar <i className="bi bi-pencil me-1"></i> Editar
</button> </button>
{/* Removido o botão "Imprimir" daqui (agora no Ver Detalhes) */}
<button className="btn btn-sm btn-protocolo" onClick={() => handleOpenProtocol(relatorio, index)}> <button className="btn btn-sm btn-protocolo" onClick={() => handleOpenProtocol(relatorio, index)}>
<i className="bi bi-send me-1"></i> Protocolo <i className="bi bi-send me-1"></i> Protocolo
@ -405,14 +403,13 @@ const LaudoManager = () => {
</section> </section>
</div> </div>
{/* Modal principal (detalhes) */}
{showModal && relatorioModal && ( {showModal && relatorioModal && (
<div className="modal modal-centered" role="dialog" aria-modal="true" onClick={() => setShowModal(false)}> <div className="modal fade show" style={{ display: "block", backgroundColor: "rgba(0, 0, 0, 0.5)" }} tabIndex="-1">
<div className="modal-dialog modal-dialog-square" role="document" onClick={(e) => e.stopPropagation()}> <div className="modal-dialog modal-dialog-centered modal-lg">
<div className="modal-content"> <div className="modal-content">
<div className="modal-header custom-modal-header"> <div className="modal-header" style={{ backgroundColor: '#1e3a8a', color: 'white' }}>
<h5 className="modal-title">Relatório de {pacientesComRelatorios[modalIndex]?.full_name || relatorioModal.patient_name || 'Paciente'}</h5> <h5 className="modal-title">Relatório de {pacientesComRelatorios[modalIndex]?.full_name || relatorioModal.patient_name || 'Paciente'}</h5>
<button type="button" className="btn-close modal-close-btn" aria-label="Close" onClick={() => setShowModal(false)}></button>
</div> </div>
<div className="modal-body"> <div className="modal-body">
@ -441,11 +438,11 @@ const LaudoManager = () => {
</div> </div>
</div> </div>
<div className="modal-footer custom-modal-footer"> <div className="modal-footer">
<button className="btn btn-primary" onClick={() => BaixarPDFdoRelatorio(pacientesComRelatorios[modalIndex]?.full_name || 'paciente', modalIndex)}> <button className="btn btn-primary" onClick={() => BaixarPDFdoRelatorio(pacientesComRelatorios[modalIndex]?.full_name || 'paciente', modalIndex)}>
<i className='bi bi-file-pdf-fill'></i> baixar em pdf <i className='bi bi-file-pdf-fill me-1'></i> Baixar em PDF
</button> </button>
<button type="button" className="btn btn-outline-secondary" onClick={() => { setShowModal(false) }}> <button type="button" className="btn btn-secondary" onClick={() => { setShowModal(false) }}>
Fechar Fechar
</button> </button>
</div> </div>
@ -454,14 +451,13 @@ const LaudoManager = () => {
</div> </div>
)} )}
{/* Modal Protocolo */}
{showProtocolModal && protocolForIndex && ( {showProtocolModal && protocolForIndex && (
<div className="modal modal-centered" role="dialog" aria-modal="true" onClick={() => setShowProtocolModal(false)}> <div className="modal fade show" style={{ display: "block", backgroundColor: "rgba(0, 0, 0, 0.5)" }} tabIndex="-1">
<div className="modal-dialog modal-dialog-tabela-relatorio" role="document" onClick={(e) => e.stopPropagation()}> <div className="modal-dialog modal-dialog-centered">
<div className="modal-content"> <div className="modal-content">
<div className="modal-header custom-modal-header"> <div className="modal-header" style={{ backgroundColor: '#1e3a8a', color: 'white' }}>
<h5 className="modal-title">Protocolo de Entrega - {protocolForIndex.relatorio?.patient_name || 'Paciente'}</h5> <h5 className="modal-title">Protocolo de Entrega - {protocolForIndex.relatorio?.patient_name || 'Paciente'}</h5>
<button type="button" className="btn-close modal-close-btn" aria-label="Close" onClick={() => setShowProtocolModal(false)}></button>
</div> </div>
<div className="modal-body"> <div className="modal-body">
@ -474,14 +470,14 @@ const LaudoManager = () => {
</div> </div>
</div> </div>
<div className="modal-footer custom-modal-footer"> <div className="modal-footer">
<button className="btn btn-primary" onClick={() => { <button className="btn btn-primary" onClick={() => {
const idx = protocolForIndex.index ?? 0; const idx = protocolForIndex.index ?? 0;
BaixarPDFdoRelatorio(protocolForIndex.relatorio?.patient_name || 'paciente', idx); BaixarPDFdoRelatorio(protocolForIndex.relatorio?.patient_name || 'paciente', idx);
}}> }}>
<i className='bi bi-file-earmark-pdf-fill'></i> baixar protocolo (PDF) <i className='bi bi-file-earmark-pdf-fill me-1'></i> Baixar Protocolo (PDF)
</button> </button>
<button type="button" className="btn btn-outline-secondary" onClick={() => setShowProtocolModal(false)}> <button type="button" className="btn btn-secondary" onClick={() => setShowProtocolModal(false)}>
Fechar Fechar
</button> </button>
</div> </div>
@ -490,17 +486,18 @@ const LaudoManager = () => {
</div> </div>
)} )}
{/* Variável de aviso: mostra texto personalizado */}
{noPermissionText && ( {noPermissionText && (
<div className="modal modal-centered" role="dialog" aria-modal="true" onClick={() => setNoPermissionText(null)}> <div className="modal fade show" style={{ display: "block", backgroundColor: "rgba(0, 0, 0, 0.5)" }} tabIndex="-1">
<div className="modal-dialog modal-dialog-square" role="document" onClick={(e) => e.stopPropagation()}> <div className="modal-dialog modal-dialog-centered">
<div className="modal-content"> <div className="modal-content">
<div style={{ padding: 18 }}> <div className="modal-header" style={{ backgroundColor: '#1e3a8a', color: 'white' }}>
<h5 style={{ marginBottom: 8 }}>{noPermissionText}</h5> <h5 className="modal-title">Aviso</h5>
<p style={{ color: '#6c757d' }}>{/* opcional descrição aqui */}</p> </div>
<div style={{ textAlign: 'right', marginTop: 12 }}> <div className="modal-body">
<button className="btn btn-outline-secondary" onClick={() => setNoPermissionText(null)}>Fechar</button> <p>{noPermissionText}</p>
</div> </div>
<div className="modal-footer">
<button className="btn btn-primary" onClick={() => setNoPermissionText(null)}>Fechar</button>
</div> </div>
</div> </div>
</div> </div>

View File

@ -2,14 +2,6 @@ import React, { useState, useEffect, useCallback } from "react";
import { useLocation, useNavigate } from "react-router-dom"; import { useLocation, useNavigate } from "react-router-dom";
import "./style/ProfilePage.css"; import "./style/ProfilePage.css";
const MOCK_API_BASE_URL = "https://mock.apidog.com/m1/1053378-0-default";
const getLocalAvatar = () => localStorage.getItem('user_avatar');
const setLocalAvatar = (avatarData) => localStorage.setItem('user_avatar', avatarData);
const clearLocalAvatar = () => localStorage.removeItem('user_avatar');
const ROLES = { const ROLES = {
ADMIN: "Administrador", ADMIN: "Administrador",
SECRETARY: "Secretária", SECRETARY: "Secretária",
@ -36,7 +28,6 @@ const ProfilePage = () => {
const [userEmail, setUserEmail] = useState("admin@squad23.com"); const [userEmail, setUserEmail] = useState("admin@squad23.com");
const [avatarUrl, setAvatarUrl] = useState(null); const [avatarUrl, setAvatarUrl] = useState(null);
const [isEditingName, setIsEditingName] = useState(false); const [isEditingName, setIsEditingName] = useState(false);
const [isUploading, setIsUploading] = useState(false);
const [error, setError] = useState(null); const [error, setError] = useState(null);
@ -52,14 +43,21 @@ const ProfilePage = () => {
useEffect(() => { useEffect(() => {
const loadProfileData = () => { const loadProfileData = () => {
const localAvatar = localStorage.getItem('user_avatar');
const localAvatar = getLocalAvatar();
if (localAvatar) { if (localAvatar) {
setAvatarUrl(localAvatar); setAvatarUrl(localAvatar);
} }
}; };
loadProfileData(); loadProfileData();
const handleStorageChange = () => {
loadProfileData();
};
window.addEventListener('storage', handleStorageChange);
return () => window.removeEventListener('storage', handleStorageChange);
}, []); }, []);
const handleNameSave = () => { const handleNameSave = () => {
@ -83,104 +81,6 @@ const ProfilePage = () => {
const handleClose = () => navigate(-1); const handleClose = () => navigate(-1);
const handleAvatarUpload = async (event) => {
const file = event.target.files[0];
if (!file) return;
setError(null);
const MAX_FILE_SIZE = 5 * 1024 * 1024;
const ACCEPTED_TYPES = ['image/jpeg', 'image/png', 'image/gif', 'image/webp'];
if (file.size > MAX_FILE_SIZE) {
setError("Arquivo muito grande. Máximo 5MB.");
return;
}
if (!ACCEPTED_TYPES.includes(file.type)) {
setError("Tipo de arquivo não suportado. Use JPEG, PNG, GIF ou WebP.");
return;
}
setIsUploading(true);
try {
try {
const result = await uploadAvatarToMockAPI(file);
const newAvatarUrl = result.url || result.avatarUrl;
if (newAvatarUrl) {
setAvatarUrl(newAvatarUrl);
setLocalAvatar(newAvatarUrl);
console.log('Avatar enviado para API com sucesso');
return;
}
} catch (apiError) {
console.log('API não disponível, salvando localmente...');
}
const reader = new FileReader();
reader.onload = (e) => {
const imageDataUrl = e.target.result;
setLocalAvatar(imageDataUrl);
setAvatarUrl(imageDataUrl);
console.log('Avatar salvo localmente');
};
reader.readAsDataURL(file);
} catch (error) {
console.error('Erro no processamento:', error);
const reader = new FileReader();
reader.onload = (e) => {
const imageDataUrl = e.target.result;
setLocalAvatar(imageDataUrl);
setAvatarUrl(imageDataUrl);
};
reader.readAsDataURL(file);
} finally {
setIsUploading(false);
event.target.value = '';
}
};
const uploadAvatarToMockAPI = async (file) => {
const formData = new FormData();
formData.append("avatar", file);
const response = await fetch(`${MOCK_API_BASE_URL}/storage/v1/object/avatars/[path]`, {
method: "POST",
body: formData
});
if (!response.ok) {
return null;
}
return await response.json();
};
const clearAvatar = () => {
fetch(`${MOCK_API_BASE_URL}/storage/v1/object/avatars/[path]`, {
method: "DELETE"
}).catch(() => {
});
clearLocalAvatar();
setAvatarUrl(null);
};
return ( return (
<div className="profile-overlay" role="dialog" aria-modal="true"> <div className="profile-overlay" role="dialog" aria-modal="true">
<div className="profile-modal"> <div className="profile-modal">
@ -203,7 +103,7 @@ const ProfilePage = () => {
className="avatar-img" className="avatar-img"
onError={() => { onError={() => {
setAvatarUrl(null); setAvatarUrl(null);
clearLocalAvatar(); localStorage.removeItem('user_avatar');
}} }}
/> />
) : ( ) : (
@ -212,26 +112,15 @@ const ProfilePage = () => {
</div> </div>
)} )}
</div> </div>
<label <p style={{
className={`avatar-edit-btn ${isUploading ? 'uploading' : ''}`} textAlign: 'center',
title="Alterar foto de perfil" marginTop: '10px',
> fontSize: '0.85rem',
{isUploading ? 'Enviando...' : 'Alterar Foto'} color: '#666'
<input }}>
type="file" Gerencie seu avatar no menu do perfil acima
accept="image/*" </p>
onChange={handleAvatarUpload}
disabled={isUploading}
style={{ display: "none" }}
/>
</label>
{isUploading && (
<p className="upload-status">
Processando imagem...
</p>
)}
</div> </div>
</div> </div>
@ -287,11 +176,6 @@ const ProfilePage = () => {
</div> </div>
<div className="profile-actions"> <div className="profile-actions">
{avatarUrl && (
<button onClick={clearAvatar} className="btn btn-clear">
Remover Avatar
</button>
)}
<button <button
className="btn btn-close" className="btn btn-close"
onClick={handleClose} onClick={handleClose}

View File

@ -1,5 +1,5 @@
import React, { useState, useEffect } from "react"; import React, { useState, useEffect } from "react";
import { Link } from "react-router-dom"; import { Link, useNavigate } from "react-router-dom";
import API_KEY from "../components/utils/apiKeys"; import API_KEY from "../components/utils/apiKeys";
import { useAuth } from "../components/utils/AuthProvider"; import { useAuth } from "../components/utils/AuthProvider";
import "./style/TablePaciente.css"; import "./style/TablePaciente.css";
@ -9,6 +9,7 @@ import manager from "../components/utils/fetchErros/ManagerFunction";
function TablePaciente({ setCurrentPage, setPatientID,setDictInfo }) { function TablePaciente({ setCurrentPage, setPatientID,setDictInfo }) {
const { getAuthorizationHeader, isAuthenticated } = useAuth(); const { getAuthorizationHeader, isAuthenticated } = useAuth();
const navigate = useNavigate();
const [pacientes, setPacientes] = useState([]); const [pacientes, setPacientes] = useState([]);
const [search, setSearch] = useState(""); const [search, setSearch] = useState("");
@ -23,9 +24,9 @@ function TablePaciente({ setCurrentPage, setPatientID,setDictInfo }) {
const [dataInicial, setDataInicial] = useState(""); const [dataInicial, setDataInicial] = useState("");
const [dataFinal, setDataFinal] = useState(""); const [dataFinal, setDataFinal] = useState("");
// Ordenação rápida
const [sortKey, setSortKey] = useState(null); // 'nome' | 'idade' | null const [sortKey, setSortKey] = useState(null);
const [sortDir, setSortDir] = useState('asc'); // 'asc' | 'desc' const [sortDir, setSortDir] = useState('asc');
const [paginaAtual, setPaginaAtual] = useState(1); const [paginaAtual, setPaginaAtual] = useState(1);
@ -250,7 +251,7 @@ function TablePaciente({ setCurrentPage, setPatientID,setDictInfo }) {
return resultado; return resultado;
}) : []; }) : [];
// Aplica ordenação rápida
const applySorting = (arr) => { const applySorting = (arr) => {
if (!Array.isArray(arr) || !sortKey) return arr; if (!Array.isArray(arr) || !sortKey) return arr;
const copy = [...arr]; const copy = [...arr];
@ -377,7 +378,6 @@ function TablePaciente({ setCurrentPage, setPatientID,setDictInfo }) {
<i className="bi bi-calendar me-1"></i> Aniversariantes <i className="bi bi-calendar me-1"></i> Aniversariantes
</button> </button>
{/* Ordenação rápida (estilo compacto por select) */}
<div className="vr mx-2 d-none d-md-block" /> <div className="vr mx-2 d-none d-md-block" />
<div className="d-flex align-items-center gap-2"> <div className="d-flex align-items-center gap-2">
<span className="text-muted small">Ordenar por:</span> <span className="text-muted small">Ordenar por:</span>
@ -550,11 +550,15 @@ function TablePaciente({ setCurrentPage, setPatientID,setDictInfo }) {
</button> </button>
</Link> </Link>
<Link to={"edit"}> <button
<button className="btn btn-sm btn-edit" onClick={() => setDictInfo(paciente)}> className="btn btn-sm btn-edit"
<i className="bi bi-pencil me-1"></i> Editar onClick={() => {
</button> setDictInfo(paciente);
</Link> navigate('edit');
}}
>
<i className="bi bi-pencil me-1"></i> Editar
</button>
<button <button
className="btn btn-sm btn-delete" className="btn btn-sm btn-delete"
@ -588,7 +592,7 @@ function TablePaciente({ setCurrentPage, setPatientID,setDictInfo }) {
</tbody> </tbody>
</table> </table>
{/* Paginação */}
{pacientesFiltrados.length > 0 && ( {pacientesFiltrados.length > 0 && (
<div className="d-flex justify-content-between align-items-center mt-3"> <div className="d-flex justify-content-between align-items-center mt-3">
<div className="d-flex align-items-center"> <div className="d-flex align-items-center">
@ -661,15 +665,10 @@ function TablePaciente({ setCurrentPage, setPatientID,setDictInfo }) {
> >
<div className="modal-dialog modal-dialog-centered"> <div className="modal-dialog modal-dialog-centered">
<div className="modal-content"> <div className="modal-content">
<div className="modal-header"> <div className="modal-header" style={{ backgroundColor: '#dc3545', color: 'white' }}>
<h5 className="modal-title"> <h5 className="modal-title">
Confirmação de Exclusão Confirmação de Exclusão
</h5> </h5>
<button
type="button"
className="btn-close"
onClick={() => setShowDeleteModal(false)}
></button>
</div> </div>
<div className="modal-body"> <div className="modal-body">

View File

@ -1,9 +1,15 @@
import React, { useState, useEffect } from 'react'; import React, { useState, useEffect } from "react";
import { useNavigate } from 'react-router-dom'; import { useNavigate } from "react-router-dom";
import { FaCalendarAlt, FaCalendarCheck, FaFileAlt, FaUserMd, FaClock } from 'react-icons/fa'; import {
import { useAuth } from '../components/utils/AuthProvider'; FaCalendarAlt,
import API_KEY from '../components/utils/apiKeys'; FaCalendarCheck,
import './style/inicioPaciente.css'; FaFileAlt,
FaUserMd,
FaClock,
} from "react-icons/fa";
import { useAuth } from "../components/utils/AuthProvider";
import API_KEY from "../components/utils/apiKeys";
import "./style/inicioPaciente.css";
function InicioPaciente() { function InicioPaciente() {
const navigate = useNavigate(); const navigate = useNavigate();
@ -15,7 +21,8 @@ function InicioPaciente() {
const [pacienteId, setPacienteId] = useState(null); const [pacienteId, setPacienteId] = useState(null);
useEffect(() => { useEffect(() => {
const userId = localStorage.getItem('user_id') || localStorage.getItem('patient_id'); const userId =
localStorage.getItem("user_id") || localStorage.getItem("patient_id");
setPacienteId(userId); setPacienteId(userId);
}, []); }, []);
@ -23,57 +30,63 @@ function InicioPaciente() {
const fetchMedicos = async () => { const fetchMedicos = async () => {
try { try {
const authHeader = getAuthorizationHeader(); const authHeader = getAuthorizationHeader();
const myHeaders = new Headers(); const myHeaders = new Headers();
myHeaders.append("apikey", API_KEY); myHeaders.append("apikey", API_KEY);
myHeaders.append("Authorization", authHeader); myHeaders.append("Authorization", authHeader);
const requestOptions = { const requestOptions = {
method: 'GET', method: "GET",
headers: myHeaders, headers: myHeaders,
redirect: 'follow' redirect: "follow",
}; };
const response = await fetch("https://yuanqfswhberkoevtmfr.supabase.co/rest/v1/doctors", requestOptions); const response = await fetch(
"https://yuanqfswhberkoevtmfr.supabase.co/rest/v1/doctors",
requestOptions
);
if (response.ok) { if (response.ok) {
const data = await response.json(); const data = await response.json();
setMedicos(data); setMedicos(data);
console.log(' Médicos carregados:', data.length); console.log(" Médicos carregados:", data.length);
} else { } else {
console.error(' Erro ao buscar médicos:', response.status); console.error(" Erro ao buscar médicos:", response.status);
} }
} catch (error) { } catch (error) {
console.error(' Erro ao buscar médicos:', error); console.error(" Erro ao buscar médicos:", error);
} }
}; };
const fetchAgendamentos = async () => { const fetchAgendamentos = async () => {
try { try {
const authHeader = getAuthorizationHeader(); const authHeader = getAuthorizationHeader();
const myHeaders = new Headers(); const myHeaders = new Headers();
myHeaders.append("apikey", API_KEY); myHeaders.append("apikey", API_KEY);
myHeaders.append("Authorization", authHeader); myHeaders.append("Authorization", authHeader);
const requestOptions = { const requestOptions = {
method: 'GET', method: "GET",
headers: myHeaders, headers: myHeaders,
redirect: 'follow' redirect: "follow",
}; };
// Buscar todos os agendamentos (depois filtraremos pelo paciente) // Buscar todos os agendamentos (depois filtraremos pelo paciente)
const response = await fetch("https://yuanqfswhberkoevtmfr.supabase.co/rest/v1/appointments", requestOptions); const response = await fetch(
"https://yuanqfswhberkoevtmfr.supabase.co/rest/v1/appointments",
requestOptions
);
if (response.ok) { if (response.ok) {
const data = await response.json(); const data = await response.json();
setAgendamentos(data); setAgendamentos(data);
console.log(' Agendamentos carregados:', data.length); console.log(" Agendamentos carregados:", data.length);
} else { } else {
console.error(' Erro ao buscar agendamentos:', response.status); console.error(" Erro ao buscar agendamentos:", response.status);
} }
} catch (error) { } catch (error) {
console.error(' Erro ao buscar agendamentos:', error); console.error(" Erro ao buscar agendamentos:", error);
} finally { } finally {
setLoading(false); setLoading(false);
} }
@ -87,44 +100,50 @@ function InicioPaciente() {
useEffect(() => { useEffect(() => {
if (agendamentos.length > 0 && medicos.length > 0) { if (agendamentos.length > 0 && medicos.length > 0) {
const agendamentosComNomes = agendamentos.map(agendamento => { const agendamentosComNomes = agendamentos.map((agendamento) => {
const medico = medicos.find(m => m.id === agendamento.doctor_id); const medico = medicos.find((m) => m.id === agendamento.doctor_id);
return { return {
...agendamento, ...agendamento,
nomeMedico: medico?.full_name || 'Médico não encontrado', nomeMedico: medico?.full_name || "Médico não encontrado",
especialidadeMedico: medico?.specialty || '' especialidadeMedico: medico?.specialty || "",
}; };
}); });
setAgendamentosComMedicos(agendamentosComNomes); setAgendamentosComMedicos(agendamentosComNomes);
} }
}, [agendamentos, medicos]); }, [agendamentos, medicos]);
const meusAgendamentos = agendamentosComMedicos.filter(a => const meusAgendamentos = agendamentosComMedicos.filter((a) =>
pacienteId ? a.patient_id === pacienteId : true pacienteId ? a.patient_id === pacienteId : true
); );
const hoje = new Date(); const hoje = new Date();
hoje.setHours(0, 0, 0, 0); hoje.setHours(0, 0, 0, 0);
const agendamentosFuturos = meusAgendamentos.filter(a => { const agendamentosFuturos = meusAgendamentos
if (!a.scheduled_at) return false; .filter((a) => {
const dataAgendamento = new Date(a.scheduled_at); if (!a.scheduled_at) return false;
return dataAgendamento >= hoje && a.status !== 'cancelled' && a.status !== 'completed'; const dataAgendamento = new Date(a.scheduled_at);
}).sort((a, b) => new Date(a.scheduled_at) - new Date(b.scheduled_at)); return (
dataAgendamento >= hoje &&
a.status !== "cancelled" &&
a.status !== "completed"
);
})
.sort((a, b) => new Date(a.scheduled_at) - new Date(b.scheduled_at));
const proximasConsultas = agendamentosFuturos.length; const proximasConsultas = agendamentosFuturos.length;
const consultasHoje = agendamentosFuturos.filter(a => { const consultasHoje = agendamentosFuturos.filter((a) => {
const dataAgendamento = new Date(a.scheduled_at); const dataAgendamento = new Date(a.scheduled_at);
dataAgendamento.setHours(0, 0, 0, 0); dataAgendamento.setHours(0, 0, 0, 0);
return dataAgendamento.getTime() === hoje.getTime(); return dataAgendamento.getTime() === hoje.getTime();
}).length; }).length;
const consultasPendentes = meusAgendamentos.filter(a => const consultasPendentes = meusAgendamentos.filter(
a.status === 'pending' || a.status === 'requested' (a) => a.status === "pending" || a.status === "requested"
).length; ).length;
const historicoConsultas = meusAgendamentos.filter(a => const historicoConsultas = meusAgendamentos.filter(
a.status === 'completed' (a) => a.status === "completed"
).length; ).length;
return ( return (
@ -154,17 +173,19 @@ function InicioPaciente() {
<FaCalendarCheck className="stat-paciente-icon" /> <FaCalendarCheck className="stat-paciente-icon" />
</div> </div>
</div> </div>
<div className="stat-paciente-card"> <div className="stat-paciente-card">
<div className="stat-paciente-info"> <div className="stat-paciente-info">
<span className="stat-paciente-label">Aguardando</span> <span className="stat-paciente-label">Aguardando</span>
<span className="stat-paciente-value">{loading ? '...' : consultasPendentes}</span> <span className="stat-paciente-value">
{loading ? "..." : consultasPendentes}
</span>
</div> </div>
<div className="stat-paciente-icon-wrapper purple"> <div className="stat-paciente-icon-wrapper purple">
<FaClock className="stat-paciente-icon" /> <FaClock className="stat-paciente-icon" />
</div> </div>
</div> </div>
<div className="stat-paciente-card"> <div className="stat-paciente-card">
<div className="stat-paciente-info"> <div className="stat-paciente-info">
<span className="stat-paciente-label">Realizadas</span> <span className="stat-paciente-label">Realizadas</span>
@ -179,27 +200,42 @@ function InicioPaciente() {
<div className="quick-actions-paciente"> <div className="quick-actions-paciente">
<h2>Acesso Rápido</h2> <h2>Acesso Rápido</h2>
<div className="actions-paciente-grid"> <div className="actions-paciente-grid">
<div className="action-paciente-button" onClick={() => navigate('/paciente/agendamento')}> <div
className="action-paciente-button"
onClick={() => navigate("/paciente/agendamento")}
>
<FaCalendarCheck className="action-paciente-icon" /> <FaCalendarCheck className="action-paciente-icon" />
<div className="action-paciente-info"> <div className="action-paciente-info">
<span className="action-paciente-title">Minhas Consultas</span> <span className="action-paciente-title">Minhas Consultas</span>
<span className="action-paciente-desc">Ver todos os agendamentos</span> <span className="action-paciente-desc">
Ver todos os agendamentos
</span>
</div> </div>
</div> </div>
<div className="action-paciente-button" onClick={() => navigate('/paciente/laudo')}> <div
className="action-paciente-button"
onClick={() => navigate("/paciente/laudo")}
>
<FaFileAlt className="action-paciente-icon" /> <FaFileAlt className="action-paciente-icon" />
<div className="action-paciente-info"> <div className="action-paciente-info">
<span className="action-paciente-title">Meus Laudos</span> <span className="action-paciente-title">Meus Laudos</span>
<span className="action-paciente-desc">Acessar documentos médicos</span> <span className="action-paciente-desc">
Acessar documentos médicos
</span>
</div> </div>
</div> </div>
<div className="action-paciente-button" onClick={() => navigate('/paciente/agendamento')}> <div
className="action-paciente-button"
onClick={() => navigate("/paciente/agendamento")}
>
<FaUserMd className="action-paciente-icon" /> <FaUserMd className="action-paciente-icon" />
<div className="action-paciente-info"> <div className="action-paciente-info">
<span className="action-paciente-title">Meus Médicos</span> <span className="action-paciente-title">Meus Médicos</span>
<span className="action-paciente-desc">Ver histórico de atendimentos</span> <span className="action-paciente-desc">
Ver histórico de atendimentos
</span>
</div> </div>
</div> </div>
</div> </div>
@ -213,22 +249,28 @@ function InicioPaciente() {
</div> </div>
) : agendamentosFuturos.length > 0 ? ( ) : agendamentosFuturos.length > 0 ? (
<div className="consultas-paciente-list"> <div className="consultas-paciente-list">
{agendamentosFuturos.slice(0, 3).map(agendamento => ( {agendamentosFuturos.slice(0, 3).map((agendamento) => (
<div key={agendamento.id} className="consulta-paciente-item"> <div key={agendamento.id} className="consulta-paciente-item">
<div className="consulta-paciente-info"> <div className="consulta-paciente-info">
<div className="consulta-paciente-time-date"> <div className="consulta-paciente-time-date">
<p className="consulta-paciente-hora"> <p className="consulta-paciente-hora">
{new Date(agendamento.scheduled_at).toLocaleTimeString('pt-BR', { {new Date(agendamento.scheduled_at).toLocaleTimeString(
hour: '2-digit', "pt-BR",
minute: '2-digit' {
})} hour: "2-digit",
minute: "2-digit",
}
)}
</p> </p>
<p className="consulta-paciente-data"> <p className="consulta-paciente-data">
{new Date(agendamento.scheduled_at).toLocaleDateString('pt-BR', { {new Date(agendamento.scheduled_at).toLocaleDateString(
day: '2-digit', "pt-BR",
month: 'short', {
year: 'numeric' day: "2-digit",
})} month: "short",
year: "numeric",
}
)}
</p> </p>
</div> </div>
<div className="consulta-paciente-detalhes"> <div className="consulta-paciente-detalhes">
@ -242,16 +284,25 @@ function InicioPaciente() {
</p> </p>
)} )}
</div> </div>
<span className={`consulta-paciente-status status-${agendamento.status}`}> <span
{agendamento.status === 'scheduled' ? 'Confirmado' : className={`consulta-paciente-status status-${agendamento.status}`}
agendamento.status === 'pending' ? 'Aguardando' : >
agendamento.status === 'requested' ? 'Solicitado' : agendamento.status} {agendamento.status === "scheduled"
? "Confirmado"
: agendamento.status === "pending"
? "Aguardando"
: agendamento.status === "requested"
? "Solicitado"
: agendamento.status}
</span> </span>
</div> </div>
</div> </div>
))} ))}
{agendamentosFuturos.length > 3 && ( {agendamentosFuturos.length > 3 && (
<button className="view-all-paciente-button" onClick={() => navigate('/paciente/agendamento')}> <button
className="view-all-paciente-button"
onClick={() => navigate("/paciente/agendamento")}
>
Ver todas as consultas Ver todas as consultas
</button> </button>
)} )}
@ -260,7 +311,10 @@ function InicioPaciente() {
<div className="no-consultas-content"> <div className="no-consultas-content">
<FaCalendarCheck className="no-consultas-icon" /> <FaCalendarCheck className="no-consultas-icon" />
<p>Você não tem consultas agendadas</p> <p>Você não tem consultas agendadas</p>
<button className="agendar-paciente-button" onClick={() => navigate('/paciente/agendamento/criar')}> <button
className="agendar-paciente-button"
onClick={() => navigate("/paciente/agendamento/criar")}
>
Agendar Consulta Agendar Consulta
</button> </button>
</div> </div>
@ -270,4 +324,4 @@ function InicioPaciente() {
); );
} }
export default InicioPaciente; export default InicioPaciente;

View File

@ -43,6 +43,33 @@
margin-left: 0; margin-left: 0;
} }
@media (max-width: 576px) {
.busca-atendimento {
flex-direction: column;
gap: 10px;
}
.container-btns-agenda-fila_esepera {
flex-direction: column;
align-items: flex-start;
gap: 10px;
flex-wrap: wrap; /* Adicionado para permitir quebra de linha nos botões */
}
.btns-gerenciamento-e-consulta {
width: 100%;
justify-content: space-between;
flex-wrap: wrap; /* Adicionado para permitir quebra de linha nos botões */
}
.btn-adicionar-consulta {
padding: 8px 12px; /* Reduzido o padding */
font-size: 0.8rem; /* Reduzido o tamanho da fonte */
white-space: normal; /* Permite quebra de linha no texto do botão */
text-align: center;
}
}
.container-btns-agenda-fila_esepera { .container-btns-agenda-fila_esepera {
margin-top: 20px; margin-top: 20px;
margin-left: 0; margin-left: 0;
@ -57,7 +84,7 @@
background-color: transparent; background-color: transparent;
border: 0; border: 0;
border-bottom: 2px solid transparent; border-bottom: 2px solid transparent;
padding: 12px 24px; padding: 10px 12px; /* Reduzido o padding */
border-radius: 0; border-radius: 0;
font-weight: 600; font-weight: 600;
color: #718096; color: #718096;
@ -108,7 +135,23 @@
font-family: 'Inter', sans-serif; font-family: 'Inter', sans-serif;
margin-top: 20px; margin-top: 20px;
} }
@media (max-width: 768px) {
.calendar-wrapper {
flex-direction: column;
padding: 16px;
}
}
.calendar-info-panel { flex: 0 0 300px; border-right: 1px solid #E2E8F0; padding-right: 24px; display: flex; flex-direction: column; } .calendar-info-panel { flex: 0 0 300px; border-right: 1px solid #E2E8F0; padding-right: 24px; display: flex; flex-direction: column; }
@media (max-width: 768px) {
.calendar-info-panel {
border-right: none;
border-bottom: 1px solid #E2E8F0;
padding-right: 0;
padding-bottom: 16px;
}
}
.info-date-display { background-color: #EDF2F7; border-radius: 8px; padding: 12px; text-align: center; margin-bottom: 16px; } .info-date-display { background-color: #EDF2F7; border-radius: 8px; padding: 12px; text-align: center; margin-bottom: 16px; }
.info-date-display span { font-weight: 600; color: #718096; text-transform: uppercase; font-size: 0.9rem; } .info-date-display span { font-weight: 600; color: #718096; text-transform: uppercase; font-size: 0.9rem; }
.info-date-display strong { display: block; font-size: 2.5rem; font-weight: 700; color: #2D3748; } .info-date-display strong { display: block; font-size: 2.5rem; font-weight: 700; color: #2D3748; }
@ -135,6 +178,14 @@
.nav-buttons button { padding: 8px 12px; border-radius: 6px; border: 1px solid #CBD5E0; background-color: #fff; font-weight: 600; cursor: pointer; transition: all 0.2s; } .nav-buttons button { padding: 8px 12px; border-radius: 6px; border: 1px solid #CBD5E0; background-color: #fff; font-weight: 600; cursor: pointer; transition: all 0.2s; }
.nav-buttons button:hover { background-color: #EDF2F7; } .nav-buttons button:hover { background-color: #EDF2F7; }
.calendar-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; } .calendar-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
@media (max-width: 1200px) {
.calendar-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 768px) {
.calendar-grid { grid-template-columns: repeat(2, 1fr); }
}
.day-header { font-weight: 600; color: #718096; text-align: center; padding: 8px 0; font-size: 0.875rem; } .day-header { font-weight: 600; color: #718096; text-align: center; padding: 8px 0; font-size: 0.875rem; }
.day-cell { min-height: 110px; border-radius: 8px; border: 1px solid #E2E8F0; padding: 8px; transition: background-color 0.2s, border-color 0.2s; cursor: pointer; position: relative; } .day-cell { min-height: 110px; border-radius: 8px; border: 1px solid #E2E8F0; padding: 8px; transition: background-color 0.2s, border-color 0.2s; cursor: pointer; position: relative; }
.day-cell span { font-weight: 600; color: #4A5568; } .day-cell span { font-weight: 600; color: #4A5568; }
@ -233,7 +284,7 @@
} }
@media (max-width: 576px) { @media (max-width: 576px) {
.calendar-grid { grid-template-columns: repeat(2, 1fr); } .calendar-grid { grid-template-columns: 1fr; } /* 1 coluna em telas muito pequenas */
.date-indicator h2 { font-size: 1.25rem; } .date-indicator h2 { font-size: 1.25rem; }
.legend-item { font-size: 0.75rem; padding: 4px 8px; } .legend-item { font-size: 0.75rem; padding: 4px 8px; }
.appointment-item { flex-direction: column; align-items: stretch; gap: 8px; } .appointment-item { flex-direction: column; align-items: stretch; gap: 8px; }
@ -273,6 +324,7 @@
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
margin: 15px 0 20px; margin: 15px 0 20px;
color: #fff;
} }
.tabs-agenda-fila { .tabs-agenda-fila {
@ -283,6 +335,7 @@
.btns-gerenciamento-e-consulta { .btns-gerenciamento-e-consulta {
display: flex; display: flex;
gap: 10px; gap: 10px;
flex-wrap: wrap; /* Permite quebra de linha */
} }
.container-btns-agenda-fila_esepera { .container-btns-agenda-fila_esepera {
display: flex; display: flex;

View File

@ -190,6 +190,12 @@ html, body {
} }
/* ===== Fila de Espera ===== */ /* ===== Fila de Espera ===== */
@media (max-width: 992px) {
.fila-container {
overflow-x: auto;
}
}
.fila-container { .fila-container {
width: 100%; width: 100%;
max-width: none; max-width: none;
@ -286,6 +292,13 @@ html, body {
transition: border-color 0.2s; transition: border-color 0.2s;
} }
@media (max-width: 768px) {
.busca-fila-espera {
width: 100%;
position: static;
}
}
.busca-fila-espera:focus { .busca-fila-espera:focus {
border-color: #888; border-color: #888;
} }

View File

@ -21,6 +21,12 @@
margin-bottom: 10px; margin-bottom: 10px;
} }
@media (max-width: 1200px) {
.summary-card {
min-width: 180px;
}
}
.summary-card { .summary-card {
flex: 1; flex: 1;
min-width: 200px; min-width: 200px;
@ -39,6 +45,7 @@
margin: 0 0 8px 0; margin: 0 0 8px 0;
font-size: 14px; font-size: 14px;
font-weight: 500; font-weight: 500;
color: #fff;
opacity: 0.9; opacity: 0.9;
} }
@ -107,43 +114,87 @@
} }
/* Botões de ação */ /* Botões de ação */
.action-group {
display: flex; .btn-view {
gap: 8px; background-color: #E6F2FF !important;
align-items: center; color: #004085 !important;
border: 1px solid #B8D4F0 !important;
padding: 0.375rem 0.75rem;
font-size: 0.875rem;
border-radius: 6px;
cursor: pointer;
transition: all 0.15s ease-in-out;
text-decoration: none;
display: inline-block;
text-align: center;
} }
.action-btn { .btn-view:hover {
cursor: pointer; background-color: #D1E7FF !important;
padding: 6px 12px; border-color: #9EC5FE !important;
border-radius: 6px;
border: 1px solid #d7e6fb;
background: #fff;
transition: all 0.2s ease;
font-size: 13px;
} }
.action-btn:hover { .btn-edit {
background: #f6f9fc; background-color: #FFF3CD !important;
border-color: #93c5fd; color: #856404 !important;
border: 1px solid #FFEAA7 !important;
padding: 0.375rem 0.75rem;
font-size: 0.875rem;
border-radius: 6px;
cursor: pointer;
transition: all 0.15s ease-in-out;
text-decoration: none;
display: inline-block;
text-align: center;
} }
.action-btn.delete { .btn-edit:hover {
border-color: #fca5a5; background-color: #FFEEBA !important;
color: #b91c1c; border-color: #FFE087 !important;
} }
.action-btn.delete:hover { .btn-delete:hover {
background: #fee2e2; background-color: #F1B0B7 !important;
border-color: #ef4444; border-color: #ED969E !important;
}
.btn-delete {
background-color: #F8D7DA !important;
color: #721C24 !important;
border: 1px solid #F5C6CB !important;
padding: 0.375rem 0.75rem;
font-size: 0.875rem;
border-radius: 6px;
cursor: pointer;
transition: all 0.15s ease-in-out;
text-decoration: none;
display: inline-block;
text-align: center;
}
html[data-bs-theme="dark"] .btn-view {
background-color: #1e3a8a !important;
color: #e0e0e0 !important;
border-color: #374151 !important;
}
html[data-bs-theme="dark"] .btn-edit {
background-color: #78350f !important;
color: #fef3c7 !important;
border-color: #374151 !important;
}
html[data-bs-theme="dark"] .btn-delete {
background-color: #7f1d1d !important;
color: #fee2e2 !important;
border-color: #374151 !important;
} }
/* Badges de status */ /* Badges de status */
.badge { .badge {
display: inline-block; display: inline-block;
padding: 4px 10px; padding: 8px 18px !important;
border-radius: 9999px; border-radius: 9999px;
font-size: 12px; font-size: 14px !important;
font-weight: 600; font-weight: 600;
text-transform: uppercase; text-transform: uppercase;
} }
@ -182,12 +233,18 @@
padding: 24px; padding: 24px;
width: 100%; width: 100%;
max-width: 550px; max-width: 550px;
max-height: 90vh; max-height: 85vh;
overflow-y: auto;
box-sizing: border-box; box-sizing: border-box;
box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1); box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
} }
@media (max-width: 576px) {
.modal-card {
padding: 16px;
max-height: 95vh;
}
}
.modal-header { .modal-header {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
@ -198,7 +255,7 @@
.modal-header h2 { .modal-header h2 {
font-size: 20px; font-size: 20px;
font-weight: 700; font-weight: 700;
color: #1f2937; color: #fff;
margin: 0; margin: 0;
} }
@ -208,6 +265,12 @@
gap: 16px; gap: 16px;
} }
.modal-card .input-field,
.modal-card .select-field,
.modal-card textarea {
width: 100%;
}
.form-group { .form-group {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@ -241,12 +304,23 @@
gap: 10px; gap: 10px;
margin-top: 24px; margin-top: 24px;
} }
.input-field,
.select-field,
textarea {
padding: 10px 12px;
border: 1px solid #d1d5db;
border-radius: 8px;
box-sizing: border-box;
font-size: 14px;
transition: border-color 0.2s, box-shadow 0.2s;
background-color: #fff;
}
/* Inputs e selects */ /* Inputs e selects */
.input-field, .input-field,
.select-field, .select-field,
textarea { textarea {
width: 100%;
padding: 10px 12px; padding: 10px 12px;
border: 1px solid #d1d5db; border: 1px solid #d1d5db;
border-radius: 8px; border-radius: 8px;
@ -269,6 +343,26 @@ textarea {
min-height: 80px; min-height: 80px;
} }
.financeiro-wrap .input-field:not(.modal-card *),
.financeiro-wrap .select-field:not(.modal-card *),
.financeiro-wrap textarea:not(.modal-card *) {
width: 30%;
}
@media (max-width: 768px) {
.financeiro-wrap .input-field:not(.modal-card *),
.financeiro-wrap .select-field:not(.modal-card *),
.financeiro-wrap textarea:not(.modal-card *) {
width: 100%;
}
}
.modal-card .input-field,
.modal-card .select-field,
.modal-card textarea {
width: 100%;
}
/* Mensagem quando não há pagamentos */ /* Mensagem quando não há pagamentos */
.empty { .empty {
text-align: center; text-align: center;
@ -366,4 +460,4 @@ html[data-bs-theme="dark"] textarea:focus {
border-color: #3b82f6; border-color: #3b82f6;
box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.25); box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.25);
outline: none; outline: none;
} }

View File

@ -1,3 +1,134 @@
/* Container Principal */
/* Responsividade */
@media (max-width: 1200px) {
.dashboard-container {
padding: 1.5rem;
}
}
@media (max-width: 768px) {
.dashboard-container {
padding: 1rem;
}
.dashboard-header h1 {
font-size: 1.5rem;
}
.dashboard-header p {
margin-bottom: 1.5rem;
}
.stats-grid {
grid-template-columns: 1fr 1fr; /* 2 colunas em tablets */
gap: 1rem;
}
.stat-value {
font-size: 1.5rem;
}
.stat-icon-wrapper {
width: 40px;
height: 40px;
}
.stat-icon {
font-size: 1rem;
}
.actions-grid {
grid-template-columns: 1fr; /* 1 coluna em tablets */
gap: 1rem;
}
.action-icon {
font-size: 1.8rem;
}
.action-title {
font-size: 0.9rem;
}
.appointments-section {
padding: 1.5rem;
}
.agendamento-info {
flex-direction: column;
align-items: flex-start;
gap: 0.5rem;
}
.agendamento-time-date {
flex-direction: row;
gap: 1rem;
min-width: auto;
}
.agendamento-detalhes {
min-width: auto;
}
}
@media (max-width: 576px) {
.dashboard-container {
padding: 0.5rem;
}
.dashboard-header h1 {
font-size: 1.3rem;
}
.dashboard-header p {
margin-bottom: 1rem;
}
.stats-grid {
grid-template-columns: 1fr; /* 1 coluna em celulares */
}
.stat-card {
padding: 1rem;
}
.stat-value {
font-size: 1.3rem;
}
.action-button {
padding: 1rem;
}
.appointments-section {
padding: 1rem;
}
.agendamento-item {
padding: 0.75rem 1rem;
}
.agendamento-hora {
font-size: 1.1rem;
}
.agendamento-data {
font-size: 0.7rem;
}
.agendamento-paciente,
.agendamento-medico {
font-size: 0.85rem;
}
.manage-button,
.view-all-button {
padding: 0.6rem 1.2rem;
font-size: 0.8rem;
}
}
/* Container Principal */ /* Container Principal */
.dashboard-container { .dashboard-container {
padding: 2rem; padding: 2rem;
@ -70,10 +201,10 @@
} }
/* Cores dos ícones */ /* Cores dos ícones */
.stat-icon-wrapper.blue { background-color: #5d5dff; } .stat-icon-wrapper.blue { background-color: #1D3B88; }
.stat-icon-wrapper.green { background-color: #30d158; } .stat-icon-wrapper.green { background-color: #399CE5; }
.stat-icon-wrapper.purple { background-color: #a272ff; } .stat-icon-wrapper.purple { background-color: #5F5DF2; }
.stat-icon-wrapper.orange { background-color: #f1952e; } .stat-icon-wrapper.orange { background-color: #051AFF; }
/* Seção de Ações Rápidas */ /* Seção de Ações Rápidas */
.quick-actions h2 { .quick-actions h2 {

View File

@ -2,6 +2,17 @@
line-height: 2.5; line-height: 2.5;
} }
/* Adiciona responsividade para a tabela */
@media (max-width: 992px) {
.table-doctor-card {
overflow-x: auto;
}
}
.table-doctor-container {
line-height: 2.5;
}
.table-doctor-card { .table-doctor-card {
border: none; border: none;
box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075); box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);

View File

@ -2,6 +2,17 @@
line-height: 2.5; line-height: 2.5;
} }
/* Adiciona responsividade para a tabela */
@media (max-width: 992px) {
.table-paciente-card {
overflow-x: auto;
}
}
.table-paciente-container {
line-height: 2.5;
}
.table-paciente-card { .table-paciente-card {
border: none; border: none;
box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075); box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);

View File

@ -25,7 +25,7 @@
/* Estatísticas - Paciente */ /* Estatísticas - Paciente */
.stats-paciente-grid { .stats-paciente-grid {
display: grid; display: grid;
grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
gap: 1.5rem; gap: 1.5rem;
margin-bottom: 2.5rem; margin-bottom: 2.5rem;
} }
@ -81,10 +81,10 @@
} }
/* Cores dos ícones - Paciente */ /* Cores dos ícones - Paciente */
.stat-paciente-icon-wrapper.blue { background-color: #5d5dff; } .stat-paciente-icon-wrapper.blue { background-color: #051AFF; }
.stat-paciente-icon-wrapper.green { background-color: #30d158; } .stat-paciente-icon-wrapper.green { background-color: #5F5DF2; }
.stat-paciente-icon-wrapper.purple { background-color: #a272ff; } .stat-paciente-icon-wrapper.purple { background-color: #a272ff; }
.stat-paciente-icon-wrapper.orange { background-color: #f1952e; } .stat-paciente-icon-wrapper.orange { background-color: #0065FF; }
/* Ações Rápidas - Paciente */ /* Ações Rápidas - Paciente */
.quick-actions-paciente h2 { .quick-actions-paciente h2 {
@ -96,7 +96,7 @@
.actions-paciente-grid { .actions-paciente-grid {
display: grid; display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 1.5rem; gap: 1.5rem;
margin-bottom: 2.5rem; margin-bottom: 2.5rem;
} }
@ -180,7 +180,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
gap: 2rem; gap: 2rem;
flex-wrap: wrap; flex-wrap: wrap;
} }
.consulta-paciente-time-date { .consulta-paciente-time-date {
@ -432,14 +432,6 @@ html[data-bs-theme="dark"] .view-all-paciente-button:hover {
padding: 1rem; padding: 1rem;
} }
.stats-paciente-grid {
grid-template-columns: 1fr;
}
.actions-paciente-grid {
grid-template-columns: 1fr;
}
.consulta-paciente-info { .consulta-paciente-info {
flex-direction: column; flex-direction: column;
align-items: flex-start; align-items: flex-start;
@ -451,4 +443,4 @@ html[data-bs-theme="dark"] .view-all-paciente-button:hover {
flex-direction: row; flex-direction: row;
justify-content: space-around; justify-content: space-around;
} }
} }

View File

@ -9,6 +9,7 @@ import Chat from "../../PagesMedico/Chat";
import DoctorItems from "../../data/sidebar-items-medico.json"; import DoctorItems from "../../data/sidebar-items-medico.json";
import FormNovoRelatorio from "../../PagesMedico/FormNovoRelatorio"; import FormNovoRelatorio from "../../PagesMedico/FormNovoRelatorio";
import EditPageRelatorio from "../../PagesMedico/EditPageRelatorio"; import EditPageRelatorio from "../../PagesMedico/EditPageRelatorio";
import NovoRelatorioAudio from "../../PagesMedico/NovoRelatorioAudio";
import BotaoVideoChamada from '../../components/BotaoVideoChamada'; import BotaoVideoChamada from '../../components/BotaoVideoChamada';
import DoctorAgendamentoEditPage from "../../PagesMedico/DoctorAgendamentoEditPage"; import DoctorAgendamentoEditPage from "../../PagesMedico/DoctorAgendamentoEditPage";
@ -25,6 +26,8 @@ function PerfilMedico() {
<div id="main"> <div id="main">
<Routes> <Routes>
<Route path="/" element={<DoctorRelatorioManager />} /> <Route path="/" element={<DoctorRelatorioManager />} />
<Route path="/novo-relatorio" element={<FormNovoRelatorio />} />
<Route path="/novo-relatorio-audio" element={<NovoRelatorioAudio />} />
<Route path="/relatorios/criar" element={<FormNovoRelatorio />} /> <Route path="/relatorios/criar" element={<FormNovoRelatorio />} />
<Route path="/relatorios/:id/edit" element={<EditPageRelatorio />} /> <Route path="/relatorios/:id/edit" element={<EditPageRelatorio />} />
<Route path="/prontuario" element={<Prontuario />} /> <Route path="/prontuario" element={<Prontuario />} />