@@ -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: ( | ||||