ui-soxo-bootstrap-core 2.4.24 → 2.4.25-dev.10

package/core/modules/reporting/components/reporting-dashboard/reporting-dashboard.js

@@ -21,6 +21,9 @@ import './reporting-dashboard.scss';
 // import MenuDashBoard from '../../../../pages/homepage-api/menu-dashboard';
 import MenuDashBoardComponent from '../../../../lib/elements/basic/menu-dashboard/menu-dashboard';
 import { useHistory } from 'react-router-dom';
+
+import * as ReportingDashboardComp from '../index';
+
 // import { isPdfFile } from 'pdfjs-dist';
 
 var genericComponents = require('./../../../../lib');
@@ -50,6 +53,7 @@ export default function ReportingDashboard({
   barcodeFilterKey,
   showScanner,
   dbPtr,
+  attributes,
 }) {
   const [config, setConfig] = useState({});
 
@@ -283,7 +287,6 @@ export default function ReportingDashboard({
       if (result?.result && result?.result[0]) {
         resultDetails = result.result[0];
       }
-
       // Update patients
       setPatients(resultDetails || []);
 
@@ -300,6 +303,7 @@ export default function ReportingDashboard({
       }
     } catch (error) {
       console.error('Error fetching report data:', error);
+      message.warn('Please try again');
     } finally {
       // Always runs, success or error
       setLoading(false);
@@ -519,12 +523,14 @@ export default function ReportingDashboard({
             isFixedIndex={isFixedIndex}
             showScanner={showScanner}
             barcodeFilterKey={barcodeFilterKey}
-            CustomComponents={{ ...CustomComponents, ...genericComponents }}
+            CustomComponents={{ ...CustomComponents, ...genericComponents, ...ReportingDashboardComp }}
             refresh={refresh}
             config={config}
             loading={cardLoading}
             pagination={pagination}
             handlePagination={handlePagination}
+            attributes={attributes}
+            fetchReportData={(paginationUpdate) => fetchReportData(id, formContents, dbPtr, paginationUpdate || pagination)}
           />
           {/** GuestList component end*/}
         </>
@@ -556,8 +562,19 @@ function GuestList({
   config,
   pagination,
   handlePagination,
+  attributes,
+  fetchReportData,
 }) {
+  
+  /**
+   * @param {*} propValues
+   */
+  const propValues = (attributes && JSON.parse(attributes)) || {};
+
+  const { buttonAttributes = [] } = propValues;
+
   var [query, setQuery] = useState('');
+
   const [exportData, setExportData] = useState({});
 
   // const [data, setData] = useState([]);
@@ -571,9 +588,14 @@ function GuestList({
   // patient object to redirect to upon successful QR scan.
   const [redirectPatient, setRedirectPatient] = useState(null);
 
+  const [visible, setVisible] = useState(false);
+
+  const [ActiveComponent, setActiveComponent] = useState(null);
+
   let history = useHistory();
 
   const { isMobile, dispatch } = useContext(GlobalContext);
+  const [single, setSingle] = useState({});
 
   const getRedirectLink = (entry, record) => {
     let redirectLink = entry.redirect_link;
@@ -928,6 +950,25 @@ function GuestList({
     }
   };
 
+  //open the edit modal
+  const handleOpenEdit = (button) => {
+    const componentName = button.component;
+    const ComponentToRender = ReportingDashboardComp[componentName];
+
+    if (!ComponentToRender) {
+      console.error(`Component ${componentName} not found!`);
+      return;
+    }
+
+    setSingle({});
+    setActiveComponent(() => ComponentToRender);
+    setVisible(true);
+  };
+
+  // close the edit modal
+  const handleCloseEdit = () => {
+    setShowEdit(false);
+  };
   return (
     <>
       <div className="table-header">
@@ -945,6 +986,28 @@ function GuestList({
               Scan QR
             </Button>
           ) : null}
+          {/** Add User button */}
+          {Array.isArray(buttonAttributes) &&
+            buttonAttributes.map((btn, index) => (
+              <Button key={index} size="small" type="primary" style={{ marginLeft: 8 }} onClick={() => handleOpenEdit(btn)}>
+                {btn.title}
+              </Button>
+            ))}
+
+          <Modal open={visible} onCancel={() => setVisible(false)} footer={null} destroyOnClose width={950} style={{ top: 10 }}>
+            {ActiveComponent && (
+              <ActiveComponent
+                formContent={single}
+                callback={() => {
+                  setVisible(false);
+                  refresh();
+                  setVisible(false);
+                  fetchReportData();
+                }}
+                // {...dynamicProps}
+              />
+            )}
+          </Modal>
 
           <Modal open={isScannerVisible} title="Scan QR Code" footer={null} onCancel={() => setScannerVisible(false)} destroyOnClose>
             <QrScanner onScanSuccess={handleScanSuccess} onClose={() => setScannerVisible(false)} />

package/core/modules/steps/action-buttons.js

@@ -0,0 +1,79 @@
+import React from 'react';
+import { Card, Skeleton } from 'antd';
+import { Button } from '../../lib';
+
+export default function ActionButtons({
+  loading,
+  steps,
+  activeStep,
+  isStepCompleted,
+  renderDynamicComponent,
+  handlePrevious,
+  handleNext,
+  handleSkip,
+  handleFinish,
+  handleStartNextProcess,
+  nextProcessId,
+  timelineCollapsed,
+}) {
+  return (
+    <>
+    <div style={{ minHeight: 300 }}>
+      {loading ? <Skeleton active /> : renderDynamicComponent()}
+      
+    </div>
+    <>
+    <div style={{ marginTop: 20, display: 'flex', justifyContent: 'flex-start', gap: '10px' }}>
+        {/* Back button */}
+        <Button disabled={activeStep === 0} onClick={handlePrevious} style={{ marginRight: 8 ,borderRadius: 4, }}>
+          Back
+        </Button>
+
+        {/* Skip button */}
+        {steps.length > 0 && steps[activeStep]?.allow_skip === 'Y' && (
+          <Button type="default" onClick={handleSkip} 
+           style={{
+              borderRadius: 4,
+            }}
+          disabled={activeStep === steps.length - 1}>
+            Skip
+          </Button>
+        )}
+
+        {/* Next / Finish / Start Next */}
+        {steps[activeStep]?.order_seqtype === 'E' ? (
+          nextProcessId?.next_process_id ? (
+            <Button type="primary"
+             style={{
+              borderRadius: 4,
+            }}
+             onClick={handleStartNextProcess}>
+              Start Next {nextProcessId.next_process_name}
+            </Button>
+          ) : (
+            <Button type="primary" 
+             style={{
+              borderRadius: 4,
+            }}
+             onClick={handleFinish}>
+              Finish
+            </Button>
+          )
+        ) : (
+          <Button
+            type="primary"
+            // shape="round"
+            style={{
+              borderRadius: 4,
+            }}
+            disabled={activeStep === steps.length - 1 || !isStepCompleted}
+            onClick={handleNext}
+          >
+            Next →
+          </Button>
+        )}
+      </div>
+      </>
+      </>
+  );
+}