{"ast":null,"code":"var _jsxFileName = \"C:\\\\Users\\\\User\\\\Downloads\\\\medora5\\\\frontend\\\\src\\\\pages\\\\billing\\\\BillingDetail.js\",\n _s = $RefreshSig$();\nimport React, { useState, useEffect } from 'react';\nimport { useParams, useNavigate } from 'react-router-dom';\nimport { billingService } from '../../services/billingService';\nimport Loading from '../../components/Loading';\nimport ErrorAlert from '../../components/ErrorAlert';\nimport SuccessAlert from '../../components/SuccessAlert';\nimport { jsxDEV as _jsxDEV, Fragment as _Fragment } from \"react/jsx-dev-runtime\";\nfunction BillingDetail() {\n _s();\n const {\n id\n } = useParams();\n const navigate = useNavigate();\n const user = JSON.parse(localStorage.getItem('user') || '{}');\n const isPatient = user.role === 'PATIENT';\n const [billing, setBilling] = useState(null);\n const [billingDetail, setBillingDetail] = useState(null);\n const [loading, setLoading] = useState(true);\n const [error, setError] = useState(null);\n const [success, setSuccess] = useState(null);\n const [updating, setUpdating] = useState(false);\n const [paymentStatus, setPaymentStatus] = useState('');\n const [downloading, setDownloading] = useState(false);\n useEffect(() => {\n const fetchBilling = async () => {\n try {\n setLoading(true);\n const response = await billingService.getBillingById(id);\n setBilling(response.data);\n setPaymentStatus(response.data.paymentStatus);\n\n // Fetch detailed billing information\n try {\n const detailResponse = await billingService.getBillingDetail(id);\n setBillingDetail(detailResponse.data);\n } catch (err) {\n console.error('Could not fetch billing details:', err);\n }\n } catch (err) {\n setError('Failed to fetch billing record');\n console.error(err);\n } finally {\n setLoading(false);\n }\n };\n fetchBilling();\n }, [id]);\n const handleUpdatePaymentStatus = async () => {\n try {\n setUpdating(true);\n const response = await billingService.updatePaymentStatus(id, {\n paymentStatus,\n paymentDate: new Date().toISOString().split('T')[0]\n });\n setBilling(response.data);\n setSuccess('Payment status updated successfully!');\n } catch (err) {\n setError('Failed to update payment status');\n } finally {\n setUpdating(false);\n }\n };\n const handleDownloadInvoice = async () => {\n try {\n setDownloading(true);\n await billingService.downloadInvoicePDF(id);\n setSuccess('Invoice downloaded successfully!');\n } catch (err) {\n setError('Failed to download invoice');\n console.error(err);\n } finally {\n setDownloading(false);\n }\n };\n if (loading) return /*#__PURE__*/_jsxDEV(Loading, {}, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 78,\n columnNumber: 23\n }, this);\n\n // Prevent unauthorized access to billing\n if (user.role === 'DOCTOR' || user.role === 'LAB_TECHNICIAN') {\n return /*#__PURE__*/_jsxDEV(\"div\", {\n style: {\n padding: '20px',\n textAlign: 'center'\n },\n children: [/*#__PURE__*/_jsxDEV(\"h1\", {\n className: \"text-2xl font-bold\",\n style: {\n color: '#7c3aed',\n marginBottom: '10px'\n },\n children: \"Access Denied\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 84,\n columnNumber: 9\n }, this), /*#__PURE__*/_jsxDEV(\"p\", {\n style: {\n color: 'var(--color-neutral-600)'\n },\n children: \"You do not have permission to access billing records.\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 85,\n columnNumber: 9\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 83,\n columnNumber: 7\n }, this);\n }\n if (!billing) {\n return /*#__PURE__*/_jsxDEV(\"div\", {\n children: /*#__PURE__*/_jsxDEV(ErrorAlert, {\n message: \"Billing record not found\",\n onClose: () => navigate('/billing')\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 93,\n columnNumber: 9\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 92,\n columnNumber: 7\n }, this);\n }\n return /*#__PURE__*/_jsxDEV(\"div\", {\n children: [/*#__PURE__*/_jsxDEV(\"div\", {\n className: \"flex justify-between items-center mb-6\",\n children: [/*#__PURE__*/_jsxDEV(\"h1\", {\n className: \"text-3xl font-bold\",\n style: {\n color: '#7c3aed'\n },\n children: [\"Billing Record #\", billing.billId]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 101,\n columnNumber: 9\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"space-x-2\",\n children: [/*#__PURE__*/_jsxDEV(\"button\", {\n onClick: handleDownloadInvoice,\n disabled: downloading,\n className: \"bg-green-600 text-white px-4 py-2 rounded hover:bg-green-700 disabled:opacity-50\",\n children: downloading ? 'Downloading...' : 'Download Invoice (PDF)'\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 103,\n columnNumber: 11\n }, this), /*#__PURE__*/_jsxDEV(\"button\", {\n onClick: () => navigate('/billing'),\n className: \"bg-gray-300 text-gray-700 px-4 py-2 rounded hover:bg-gray-400\",\n children: \"Back\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 110,\n columnNumber: 11\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 102,\n columnNumber: 9\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 100,\n columnNumber: 7\n }, this), error && /*#__PURE__*/_jsxDEV(ErrorAlert, {\n message: error,\n onClose: () => setError(null)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 116,\n columnNumber: 17\n }, this), success && /*#__PURE__*/_jsxDEV(SuccessAlert, {\n message: success,\n onClose: () => setSuccess(null)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 117,\n columnNumber: 19\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n className: `grid gap-6 mb-6 ${isPatient ? 'grid-cols-1 lg:grid-cols-2' : 'grid-cols-1 lg:grid-cols-3'}`,\n children: [/*#__PURE__*/_jsxDEV(\"div\", {\n className: \"bg-white rounded-lg shadow p-6\",\n children: [/*#__PURE__*/_jsxDEV(\"h2\", {\n className: \"text-xl font-bold mb-4\",\n children: \"Billing Information\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 121,\n columnNumber: 11\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"space-y-3\",\n children: [/*#__PURE__*/_jsxDEV(InfoRow, {\n label: \"Patient\",\n value: billing.patientName\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 123,\n columnNumber: 13\n }, this), /*#__PURE__*/_jsxDEV(InfoRow, {\n label: \"Total Cost\",\n value: `$${billing.totalCost}`\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 124,\n columnNumber: 13\n }, this), /*#__PURE__*/_jsxDEV(InfoRow, {\n label: \"Current Status\",\n value: billing.paymentStatus\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 125,\n columnNumber: 13\n }, this), /*#__PURE__*/_jsxDEV(InfoRow, {\n label: \"Payment Date\",\n value: billing.paymentDate || 'Not paid'\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 126,\n columnNumber: 13\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 122,\n columnNumber: 11\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 120,\n columnNumber: 9\n }, this), !isPatient && /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"bg-white rounded-lg shadow p-6\",\n children: [/*#__PURE__*/_jsxDEV(\"h2\", {\n className: \"text-xl font-bold mb-4\",\n children: \"Update Payment Status\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 132,\n columnNumber: 13\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"space-y-4\",\n children: [/*#__PURE__*/_jsxDEV(\"div\", {\n children: [/*#__PURE__*/_jsxDEV(\"label\", {\n className: \"block text-sm font-semibold mb-2\",\n children: \"Payment Status\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 135,\n columnNumber: 17\n }, this), /*#__PURE__*/_jsxDEV(\"select\", {\n value: paymentStatus,\n onChange: e => setPaymentStatus(e.target.value),\n className: \"w-full px-4 py-2 border rounded-lg\",\n children: [/*#__PURE__*/_jsxDEV(\"option\", {\n value: \"PENDING\",\n children: \"Pending\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 141,\n columnNumber: 19\n }, this), /*#__PURE__*/_jsxDEV(\"option\", {\n value: \"PAID\",\n children: \"Paid\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 142,\n columnNumber: 19\n }, this), /*#__PURE__*/_jsxDEV(\"option\", {\n value: \"CANCELLED\",\n children: \"Cancelled\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 143,\n columnNumber: 19\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 136,\n columnNumber: 17\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 134,\n columnNumber: 15\n }, this), /*#__PURE__*/_jsxDEV(\"button\", {\n onClick: handleUpdatePaymentStatus,\n disabled: updating || paymentStatus === billing.paymentStatus,\n className: \"w-full bg-purple-600 text-white px-4 py-2 rounded hover:bg-purple-700 disabled:opacity-50\",\n children: updating ? 'Updating...' : 'Update Status'\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 146,\n columnNumber: 15\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 133,\n columnNumber: 13\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 131,\n columnNumber: 11\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"bg-white rounded-lg shadow p-6\",\n children: [/*#__PURE__*/_jsxDEV(\"h2\", {\n className: \"text-xl font-bold mb-4\",\n children: \"Patient Details\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 158,\n columnNumber: 11\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"space-y-3\",\n children: billingDetail && /*#__PURE__*/_jsxDEV(_Fragment, {\n children: [/*#__PURE__*/_jsxDEV(InfoRow, {\n label: \"EMBG\",\n value: billingDetail.patientEmbg\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 162,\n columnNumber: 17\n }, this), /*#__PURE__*/_jsxDEV(InfoRow, {\n label: \"Phone\",\n value: billingDetail.patientPhone\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 163,\n columnNumber: 17\n }, this), /*#__PURE__*/_jsxDEV(InfoRow, {\n label: \"Bill Date\",\n value: billingDetail.billDate\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 164,\n columnNumber: 17\n }, this)]\n }, void 0, true)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 159,\n columnNumber: 11\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 157,\n columnNumber: 9\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 119,\n columnNumber: 7\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"bg-white rounded-lg shadow p-6\",\n children: [/*#__PURE__*/_jsxDEV(\"h2\", {\n className: \"text-xl font-bold mb-4\",\n children: \"Itemized Services\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 172,\n columnNumber: 9\n }, this), billingDetail && (billingDetail.procedures.length > 0 || billingDetail.labTests.length > 0) ? /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"space-y-4\",\n children: [billingDetail.procedures.length > 0 && /*#__PURE__*/_jsxDEV(\"div\", {\n children: [/*#__PURE__*/_jsxDEV(\"h3\", {\n className: \"font-semibold text-lg mb-2\",\n children: \"Procedures\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 178,\n columnNumber: 17\n }, this), /*#__PURE__*/_jsxDEV(\"table\", {\n className: \"w-full\",\n children: [/*#__PURE__*/_jsxDEV(\"thead\", {\n className: \"bg-gray-100\",\n children: /*#__PURE__*/_jsxDEV(\"tr\", {\n children: [/*#__PURE__*/_jsxDEV(\"th\", {\n className: \"px-4 py-2 text-left\",\n children: \"Description\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 182,\n columnNumber: 23\n }, this), /*#__PURE__*/_jsxDEV(\"th\", {\n className: \"px-4 py-2 text-right\",\n children: \"Cost\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 183,\n columnNumber: 23\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 181,\n columnNumber: 21\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 180,\n columnNumber: 19\n }, this), /*#__PURE__*/_jsxDEV(\"tbody\", {\n children: billingDetail.procedures.map((proc, idx) => /*#__PURE__*/_jsxDEV(\"tr\", {\n className: \"border-t\",\n children: [/*#__PURE__*/_jsxDEV(\"td\", {\n className: \"px-4 py-2\",\n children: proc.description\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 189,\n columnNumber: 25\n }, this), /*#__PURE__*/_jsxDEV(\"td\", {\n className: \"px-4 py-2 text-right\",\n children: [\"$\", proc.cost]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 190,\n columnNumber: 25\n }, this)]\n }, idx, true, {\n fileName: _jsxFileName,\n lineNumber: 188,\n columnNumber: 23\n }, this))\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 186,\n columnNumber: 19\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 179,\n columnNumber: 17\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 177,\n columnNumber: 15\n }, this), billingDetail.labTests.length > 0 && /*#__PURE__*/_jsxDEV(\"div\", {\n children: [/*#__PURE__*/_jsxDEV(\"h3\", {\n className: \"font-semibold text-lg mb-2\",\n children: \"Lab Tests\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 200,\n columnNumber: 17\n }, this), /*#__PURE__*/_jsxDEV(\"table\", {\n className: \"w-full\",\n children: [/*#__PURE__*/_jsxDEV(\"thead\", {\n className: \"bg-gray-100\",\n children: /*#__PURE__*/_jsxDEV(\"tr\", {\n children: [/*#__PURE__*/_jsxDEV(\"th\", {\n className: \"px-4 py-2 text-left\",\n children: \"Description\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 204,\n columnNumber: 23\n }, this), /*#__PURE__*/_jsxDEV(\"th\", {\n className: \"px-4 py-2 text-right\",\n children: \"Cost\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 205,\n columnNumber: 23\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 203,\n columnNumber: 21\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 202,\n columnNumber: 19\n }, this), /*#__PURE__*/_jsxDEV(\"tbody\", {\n children: billingDetail.labTests.map((test, idx) => /*#__PURE__*/_jsxDEV(\"tr\", {\n className: \"border-t\",\n children: [/*#__PURE__*/_jsxDEV(\"td\", {\n className: \"px-4 py-2\",\n children: test.description\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 211,\n columnNumber: 25\n }, this), /*#__PURE__*/_jsxDEV(\"td\", {\n className: \"px-4 py-2 text-right\",\n children: [\"$\", test.cost]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 212,\n columnNumber: 25\n }, this)]\n }, idx, true, {\n fileName: _jsxFileName,\n lineNumber: 210,\n columnNumber: 23\n }, this))\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 208,\n columnNumber: 19\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 201,\n columnNumber: 17\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 199,\n columnNumber: 15\n }, this), /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"border-t-2 pt-4 mt-4 flex justify-end\",\n children: /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"text-right\",\n children: [/*#__PURE__*/_jsxDEV(\"p\", {\n className: \"text-gray-600\",\n children: \"Total Amount:\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 222,\n columnNumber: 17\n }, this), /*#__PURE__*/_jsxDEV(\"p\", {\n className: \"text-2xl font-bold text-purple-600\",\n children: [\"$\", billing.totalCost]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 223,\n columnNumber: 17\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 221,\n columnNumber: 15\n }, this)\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 220,\n columnNumber: 13\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 175,\n columnNumber: 11\n }, this) : /*#__PURE__*/_jsxDEV(\"p\", {\n className: \"text-gray-500\",\n children: \"No services itemized for this billing record.\"\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 228,\n columnNumber: 11\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 171,\n columnNumber: 7\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 99,\n columnNumber: 5\n }, this);\n}\n_s(BillingDetail, \"+L49HC9Vi3EUS7jcBFcybPeaKcU=\", false, function () {\n return [useParams, useNavigate];\n});\n_c = BillingDetail;\nfunction InfoRow({\n label,\n value\n}) {\n return /*#__PURE__*/_jsxDEV(\"div\", {\n className: \"flex justify-between\",\n children: [/*#__PURE__*/_jsxDEV(\"span\", {\n className: \"text-gray-800\",\n children: [label, \":\"]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 238,\n columnNumber: 7\n }, this), /*#__PURE__*/_jsxDEV(\"span\", {\n className: \"text-gray-800\",\n children: value || 'N/A'\n }, void 0, false, {\n fileName: _jsxFileName,\n lineNumber: 239,\n columnNumber: 7\n }, this)]\n }, void 0, true, {\n fileName: _jsxFileName,\n lineNumber: 237,\n columnNumber: 5\n }, this);\n}\n_c2 = InfoRow;\nexport default BillingDetail;\nvar _c, _c2;\n$RefreshReg$(_c, \"BillingDetail\");\n$RefreshReg$(_c2, \"InfoRow\");","map":{"version":3,"names":["React","useState","useEffect","useParams","useNavigate","billingService","Loading","ErrorAlert","SuccessAlert","jsxDEV","_jsxDEV","Fragment","_Fragment","BillingDetail","_s","id","navigate","user","JSON","parse","localStorage","getItem","isPatient","role","billing","setBilling","billingDetail","setBillingDetail","loading","setLoading","error","setError","success","setSuccess","updating","setUpdating","paymentStatus","setPaymentStatus","downloading","setDownloading","fetchBilling","response","getBillingById","data","detailResponse","getBillingDetail","err","console","handleUpdatePaymentStatus","updatePaymentStatus","paymentDate","Date","toISOString","split","handleDownloadInvoice","downloadInvoicePDF","fileName","_jsxFileName","lineNumber","columnNumber","style","padding","textAlign","children","className","color","marginBottom","message","onClose","billId","onClick","disabled","InfoRow","label","value","patientName","totalCost","onChange","e","target","patientEmbg","patientPhone","billDate","procedures","length","labTests","map","proc","idx","description","cost","test","_c","_c2","$RefreshReg$"],"sources":["C:/Users/User/Downloads/medora5/frontend/src/pages/billing/BillingDetail.js"],"sourcesContent":["import React, { useState, useEffect } from 'react';\nimport { useParams, useNavigate } from 'react-router-dom';\nimport { billingService } from '../../services/billingService';\nimport Loading from '../../components/Loading';\nimport ErrorAlert from '../../components/ErrorAlert';\nimport SuccessAlert from '../../components/SuccessAlert';\n\nfunction BillingDetail() {\n const { id } = useParams();\n const navigate = useNavigate();\n const user = JSON.parse(localStorage.getItem('user') || '{}');\n const isPatient = user.role === 'PATIENT';\n\n const [billing, setBilling] = useState(null);\n const [billingDetail, setBillingDetail] = useState(null);\n const [loading, setLoading] = useState(true);\n const [error, setError] = useState(null);\n const [success, setSuccess] = useState(null);\n const [updating, setUpdating] = useState(false);\n const [paymentStatus, setPaymentStatus] = useState('');\n const [downloading, setDownloading] = useState(false);\n\n useEffect(() => {\n const fetchBilling = async () => {\n try {\n setLoading(true);\n const response = await billingService.getBillingById(id);\n setBilling(response.data);\n setPaymentStatus(response.data.paymentStatus);\n\n // Fetch detailed billing information\n try {\n const detailResponse = await billingService.getBillingDetail(id);\n setBillingDetail(detailResponse.data);\n } catch (err) {\n console.error('Could not fetch billing details:', err);\n }\n } catch (err) {\n setError('Failed to fetch billing record');\n console.error(err);\n } finally {\n setLoading(false);\n }\n };\n\n fetchBilling();\n }, [id]);\n\n const handleUpdatePaymentStatus = async () => {\n try {\n setUpdating(true);\n const response = await billingService.updatePaymentStatus(id, {\n paymentStatus,\n paymentDate: new Date().toISOString().split('T')[0],\n });\n setBilling(response.data);\n setSuccess('Payment status updated successfully!');\n } catch (err) {\n setError('Failed to update payment status');\n } finally {\n setUpdating(false);\n }\n };\n\n const handleDownloadInvoice = async () => {\n try {\n setDownloading(true);\n await billingService.downloadInvoicePDF(id);\n setSuccess('Invoice downloaded successfully!');\n } catch (err) {\n setError('Failed to download invoice');\n console.error(err);\n } finally {\n setDownloading(false);\n }\n };\n\n if (loading) return
You do not have permission to access billing records.
\n| Description | \nCost | \n
|---|---|
| {proc.description} | \n${proc.cost} | \n
| Description | \nCost | \n
|---|---|
| {test.description} | \n${test.cost} | \n
Total Amount:
\n${billing.totalCost}
\nNo services itemized for this billing record.
\n )}\n