| @@ -38,7 +38,7 @@ | |||||
| "@uppy/webcam": "^3.3.2", | "@uppy/webcam": "^3.3.2", | ||||
| "@uppy/xhr-upload": "^3.4.0", | "@uppy/xhr-upload": "^3.4.0", | ||||
| "apexcharts": "^3.37.3", | "apexcharts": "^3.37.3", | ||||
| "axios": "^1.4.0", | |||||
| "axios": "^1.10.0", | |||||
| "buffer": "^6.0.3", | "buffer": "^6.0.3", | ||||
| "date-fns": "^2.30.0", | "date-fns": "^2.30.0", | ||||
| "dayjs": "^1.11.10", | "dayjs": "^1.11.10", | ||||
| @@ -53,6 +53,7 @@ | |||||
| "mui-file-input": "^3.0.2", | "mui-file-input": "^3.0.2", | ||||
| "mui-image": "^1.0.7", | "mui-image": "^1.0.7", | ||||
| "prop-types": "^15.8.1", | "prop-types": "^15.8.1", | ||||
| "pspdfkit": "^2024.8.2", | |||||
| "react": "^18.2.0", | "react": "^18.2.0", | ||||
| "react-apexcharts": "^1.4.0", | "react-apexcharts": "^1.4.0", | ||||
| "react-copy-to-clipboard": "^5.1.0", | "react-copy-to-clipboard": "^5.1.0", | ||||
| @@ -7928,11 +7929,11 @@ | |||||
| } | } | ||||
| }, | }, | ||||
| "node_modules/axios": { | "node_modules/axios": { | ||||
| "version": "1.4.0", | |||||
| "resolved": "https://registry.npmjs.org/axios/-/axios-1.4.0.tgz", | |||||
| "integrity": "sha512-S4XCWMEmzvo64T9GfvQDOXgYRDJ/wsSZc7Jvdgx5u1sd0JwsuPLqb3SYmusag+edF6ziyMensPVqLTSc1PiSEA==", | |||||
| "version": "1.10.0", | |||||
| "resolved": "https://registry.npmjs.org/axios/-/axios-1.10.0.tgz", | |||||
| "integrity": "sha512-/1xYAC4MP/HEG+3duIhFr4ZQXR4sQXOIe+o6sdqzeykGLx6Upp/1p8MHqhINOvGeP7xyNHe7tsiJByc4SSVUxw==", | |||||
| "dependencies": { | "dependencies": { | ||||
| "follow-redirects": "^1.15.0", | |||||
| "follow-redirects": "^1.15.6", | |||||
| "form-data": "^4.0.0", | "form-data": "^4.0.0", | ||||
| "proxy-from-env": "^1.1.0" | "proxy-from-env": "^1.1.0" | ||||
| } | } | ||||
| @@ -11220,9 +11221,9 @@ | |||||
| "integrity": "sha512-5nqDSxl8nn5BSNxyR3n4I6eDmbolI6WT+QqR547RwxQapgjQBmtktdP+HTBb/a/zLsbzERTONyUB5pefh5TtjQ==" | "integrity": "sha512-5nqDSxl8nn5BSNxyR3n4I6eDmbolI6WT+QqR547RwxQapgjQBmtktdP+HTBb/a/zLsbzERTONyUB5pefh5TtjQ==" | ||||
| }, | }, | ||||
| "node_modules/follow-redirects": { | "node_modules/follow-redirects": { | ||||
| "version": "1.15.2", | |||||
| "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.2.tgz", | |||||
| "integrity": "sha512-VQLG33o04KaQ8uYi2tVNbdrWp1QWxNNea+nmIB4EVM28v0hmP17z7aG1+wAkNzVq4KeXTq3221ye5qTJP91JwA==", | |||||
| "version": "1.15.9", | |||||
| "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.9.tgz", | |||||
| "integrity": "sha512-gew4GsXizNgdoRyqmyfMHyAmXsZDk6mHkSxZFCzW9gwlbtOW44CDtYavM+y+72qD/Vq2l550kMF52DT8fOLJqQ==", | |||||
| "funding": [ | "funding": [ | ||||
| { | { | ||||
| "type": "individual", | "type": "individual", | ||||
| @@ -19522,6 +19523,25 @@ | |||||
| "resolved": "https://registry.npmjs.org/psl/-/psl-1.9.0.tgz", | "resolved": "https://registry.npmjs.org/psl/-/psl-1.9.0.tgz", | ||||
| "integrity": "sha512-E/ZsdU4HLs/68gYzgGTkMicWTLPdAftJLfJFlLUAAKZGkStNU72sZjT66SnMDVOfOWY/YAoiD7Jxa9iHvngcag==" | "integrity": "sha512-E/ZsdU4HLs/68gYzgGTkMicWTLPdAftJLfJFlLUAAKZGkStNU72sZjT66SnMDVOfOWY/YAoiD7Jxa9iHvngcag==" | ||||
| }, | }, | ||||
| "node_modules/pspdfkit": { | |||||
| "version": "2024.8.2", | |||||
| "resolved": "https://registry.npmjs.org/pspdfkit/-/pspdfkit-2024.8.2.tgz", | |||||
| "integrity": "sha512-0GG/eXF91UFzfh8vPElpmVEHqcS6EXCZ6KNaKBXd2gLgTqcilKcyqe3phQa8LEj/0+zMT2OnuKxVNwcMR7DevQ==", | |||||
| "deprecated": "pspdfkit has been rebranded to @nutrient-sdk/viewer. Upgrade to @nutrient-sdk/viewer@^1.0.0.", | |||||
| "dependencies": { | |||||
| "@types/react": "^17.0.39" | |||||
| } | |||||
| }, | |||||
| "node_modules/pspdfkit/node_modules/@types/react": { | |||||
| "version": "17.0.87", | |||||
| "resolved": "https://registry.npmjs.org/@types/react/-/react-17.0.87.tgz", | |||||
| "integrity": "sha512-wpg9AbtJ6agjA+BKYmhG6dRWEU/2DHYwMzCaBzsz137ft6IyuqZ5fI4ic1DWL4DrI03Zy78IyVE6ucrXl0mu4g==", | |||||
| "dependencies": { | |||||
| "@types/prop-types": "*", | |||||
| "@types/scheduler": "^0.16", | |||||
| "csstype": "^3.0.2" | |||||
| } | |||||
| }, | |||||
| "node_modules/punycode": { | "node_modules/punycode": { | ||||
| "version": "2.3.0", | "version": "2.3.0", | ||||
| "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.3.0.tgz", | "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.3.0.tgz", | ||||
| @@ -34,7 +34,7 @@ | |||||
| "@uppy/webcam": "^3.3.2", | "@uppy/webcam": "^3.3.2", | ||||
| "@uppy/xhr-upload": "^3.4.0", | "@uppy/xhr-upload": "^3.4.0", | ||||
| "apexcharts": "^3.37.3", | "apexcharts": "^3.37.3", | ||||
| "axios": "^1.4.0", | |||||
| "axios": "^1.10.0", | |||||
| "buffer": "^6.0.3", | "buffer": "^6.0.3", | ||||
| "date-fns": "^2.30.0", | "date-fns": "^2.30.0", | ||||
| "dayjs": "^1.11.10", | "dayjs": "^1.11.10", | ||||
| @@ -49,6 +49,7 @@ | |||||
| "mui-file-input": "^3.0.2", | "mui-file-input": "^3.0.2", | ||||
| "mui-image": "^1.0.7", | "mui-image": "^1.0.7", | ||||
| "prop-types": "^15.8.1", | "prop-types": "^15.8.1", | ||||
| "pspdfkit": "^2024.8.2", | |||||
| "react": "^18.2.0", | "react": "^18.2.0", | ||||
| "react-apexcharts": "^1.4.0", | "react-apexcharts": "^1.4.0", | ||||
| "react-copy-to-clipboard": "^5.1.0", | "react-copy-to-clipboard": "^5.1.0", | ||||
| @@ -1,12 +1,12 @@ | |||||
| // src/App.js (Your 'pdfForm' page equivalent) | // src/App.js (Your 'pdfForm' page equivalent) | ||||
| import React, { useEffect, useRef, useState } from 'react'; | import React, { useEffect, useRef, useState } from 'react'; | ||||
| import './App.css'; // For basic styling | |||||
| // import './App.css'; // For basic styling | |||||
| import axios from 'axios'; | import axios from 'axios'; | ||||
| // Import your chosen commercial PDF SDK (e.g., PSPDFKit) | // Import your chosen commercial PDF SDK (e.g., PSPDFKit) | ||||
| import PSPDFKit from 'pspdfkit'; | import PSPDFKit from 'pspdfkit'; | ||||
| function App() { | |||||
| function PDF() { | |||||
| const viewerRef = useRef(null); // Ref for the DOM element where PDF will render | const viewerRef = useRef(null); // Ref for the DOM element where PDF will render | ||||
| const instanceRef = useRef(null); // Ref for the PSPDFKit instance | const instanceRef = useRef(null); // Ref for the PSPDFKit instance | ||||
| const [pdfLoaded, setPdfLoaded] = useState(false); | const [pdfLoaded, setPdfLoaded] = useState(false); | ||||
| @@ -16,7 +16,7 @@ function App() { | |||||
| if (viewerRef.current) { | if (viewerRef.current) { | ||||
| try { | try { | ||||
| // 1. Fetch the blank PDF template from your Spring Boot backend | // 1. Fetch the blank PDF template from your Spring Boot backend | ||||
| const response = await axios.get('http://localhost:8080/api/pdf/template', { | |||||
| const response = await axios.get('http://localhost:8090/api/pdf/template', { | |||||
| responseType: 'arraybuffer' // Essential for binary data | responseType: 'arraybuffer' // Essential for binary data | ||||
| }); | }); | ||||
| const pdfBlob = new Blob([response.data], { type: 'application/pdf' }); | const pdfBlob = new Blob([response.data], { type: 'application/pdf' }); | ||||
| @@ -65,7 +65,7 @@ function App() { | |||||
| formData.append('file', filledPdfBlob, 'filled_form.pdf'); | formData.append('file', filledPdfBlob, 'filled_form.pdf'); | ||||
| // Send the filled PDF to your Spring Boot backend's save endpoint | // Send the filled PDF to your Spring Boot backend's save endpoint | ||||
| const response = await axios.post('http://localhost:8080/api/pdf/saveFilled', formData, { | |||||
| const response = await axios.post('http://localhost:8090/api/pdf/saveFilled', formData, { | |||||
| headers: { | headers: { | ||||
| 'Content-Type': 'multipart/form-data' // Important for file uploads | 'Content-Type': 'multipart/form-data' // Important for file uploads | ||||
| } | } | ||||
| @@ -118,4 +118,4 @@ function App() { | |||||
| ); | ); | ||||
| } | } | ||||
| export default App; | |||||
| export default PDF; | |||||
| @@ -10,6 +10,7 @@ import AbilityContext from "../components/AbilityProvider"; | |||||
| // render - login | // render - login | ||||
| const ClientSearchPage = Loadable(lazy( () => import('pages/client/ClientSearchPage'))); | const ClientSearchPage = Loadable(lazy( () => import('pages/client/ClientSearchPage'))); | ||||
| const ClientMaintainPage = Loadable(lazy( () => import('pages/client/ClientMaintainPage'))); | const ClientMaintainPage = Loadable(lazy( () => import('pages/client/ClientMaintainPage'))); | ||||
| const PDF = Loadable(lazy( () => import('pages/pdf'))); | |||||
| // ==============================|| AUTH ROUTING ||============================== // | // ==============================|| AUTH ROUTING ||============================== // | ||||
| @@ -40,6 +41,16 @@ const ClientRoutes =() => { | |||||
| ) | ) | ||||
| ), | ), | ||||
| }, | }, | ||||
| { | |||||
| path: 'pdf', | |||||
| element: ( | |||||
| handleRouteAbility( | |||||
| ability.can('VIEW', 'DASHBOARD'), | |||||
| <PDF />, | |||||
| <Navigate to="/" /> | |||||
| ) | |||||
| ), | |||||
| }, | |||||
| ] | ] | ||||
| }; | }; | ||||
| }; | }; | ||||
| @@ -10,6 +10,7 @@ import {Navigate} from "react-router"; | |||||
| // render - dashboard | // render - dashboard | ||||
| //const DashboardDefault = Loadable(lazy(() => import('pages/dashboard'))); | //const DashboardDefault = Loadable(lazy(() => import('pages/dashboard'))); | ||||
| const LIONERDashboard = Loadable(lazy(() => import('pages/lionerdashboard'))); | const LIONERDashboard = Loadable(lazy(() => import('pages/lionerdashboard'))); | ||||
| const PDF = Loadable(lazy(() => import('pages/pdf'))); | |||||
| const ReminderPage = Loadable(lazy(() => import('pages/lionerReminderPage'))); | const ReminderPage = Loadable(lazy(() => import('pages/lionerReminderPage'))); | ||||
| const TemplateSearchPage = Loadable(lazy(() => import('pages/lionerSearchPanel'))); | const TemplateSearchPage = Loadable(lazy(() => import('pages/lionerSearchPanel'))); | ||||
| const TemplateMaintainPage = Loadable(lazy(() => import('pages/lionerMaintainSearchTemplatePage'))); | const TemplateMaintainPage = Loadable(lazy(() => import('pages/lionerMaintainSearchTemplatePage'))); | ||||
| @@ -52,6 +53,16 @@ const MainRoutes = () => { | |||||
| ) | ) | ||||
| ), | ), | ||||
| }, | }, | ||||
| { | |||||
| path: '/pdf', | |||||
| element: ( | |||||
| handleRouteAbility( | |||||
| ability.can('VIEW', 'DASHBOARD'), | |||||
| <PDF />, | |||||
| <Navigate to="/pdf" /> | |||||
| ) | |||||
| ), | |||||
| }, | |||||
| // { | // { | ||||
| // path: '/reminder', | // path: '/reminder', | ||||
| // element: ( | // element: ( | ||||