@jescon-technologies/react-native-ui-kit 0.0.4 → 0.0.5

package/src/Screens/SwipeLeftView.js

@@ -0,0 +1,1867 @@
+import React, { useState, useRef } from 'react';
+import { StyleSheet, Dimensions, View, Text, FlatList, Image, TouchableOpacity, PermissionsAndroid, TextInput, RefreshControl, Platform } from 'react-native';
+import Loader from '../Custom/Loader';
+import HeaderBlock from './HeaderBlock';
+import CContainerView from '../CustomComponents/CContainerView';
+import CDetailView from '../CustomComponents/CDetailView';
+import { normalize } from '../CommonStyle/componentStyle';
+import { imageURL, audioURL, videoURL, pdfURL, APIURL } from '../../../../../src/Common/apiConstants';
+import WebView from 'react-native-webview';
+import { ArrayCheck, notifyMessage, ValueCheck } from '../CommonStyle/ComponentFunctions';
+import moment from 'moment';
+
+const SwipeLeftView = (props) => {
+    const webviewRef = useRef();
+    const [filter, setFilter] = useState(props.route.params.type != undefined && props.route.params.type != null ? props.route.params.type : 0);
+    const [searchData, setSearchData] = useState('');
+    const [pdfdata, SetPdfData] = useState(props.route.params.pdf.data);
+
+
+    const allfiles = [];
+
+    const datasearch =
+        pdfdata.patientchartdetail &&
+            pdfdata.patientchartdetail != null &&
+            pdfdata.patientchartdetail != undefined ?
+            pdfdata.patientchartdetail.map(item => {
+                return {
+                    ...item,
+                    patientchartdetaildata:
+                        item.patientchartdetaildata != null &&
+                            item.patientchartdetaildata != undefined
+                            ? item.patientchartdetaildata.filter(subElement => {
+                                return subElement &&
+                                    subElement.textheader &&
+                                    subElement.textheader != null &&
+                                    subElement.textheader != undefined &&
+                                    subElement.textheader.length > 0
+                                    ? subElement.textheader
+                                        .toLowerCase()
+                                        .indexOf(searchData.toLowerCase()) >= 0
+                                    : null;
+                            })
+                            : null,
+                };
+            }) : null;
+
+    pdfdata.patientchartdetail &&
+        pdfdata.patientchartdetail != null &&
+        pdfdata.patientchartdetail != undefined ?
+        pdfdata.patientchartdetail.map(item => {
+            item.files &&
+                item.files != null &&
+                item.files != undefined ?
+                item.files.savedimages &&
+                    item.files.savedimages != null &&
+                    item.files.savedimages != undefined &&
+                    item.files.savedimages.length > 0 ?
+                    item.files.savedimages.filter((s, i) => {
+                        s.filename && s.filename != null && s.filename != undefined ?
+                            allfiles.push({ 'filename': s.filename }) : null
+                    }) : null
+                : null
+        }) : null;
+
+    const prescriptionsearch =
+        pdfdata.patientchartdetail &&
+            pdfdata.patientchartdetail != null &&
+            pdfdata.patientchartdetail != undefined
+            ? pdfdata.patientchartdetail.map(item => {
+                return {
+                    chartdate: item.chartdate,
+                    consultantname: item.consultantname,
+                    prescriptions: item.prescriptions,
+                    prescriptionsdata:
+                        ArrayCheck(item.prescriptions) &&
+                            item.prescriptions.data != null &&
+                            item.prescriptions.data != undefined
+                            ? item.prescriptions.data.filter(subElement => {
+                                return subElement &&
+                                    subElement.assignedstatusname &&
+                                    subElement.assignedstatusname != null &&
+                                    subElement.assignedstatusname != undefined &&
+                                    subElement.assignedstatusname.length > 0
+                                    ? subElement.assignedstatusname
+                                        .toLowerCase()
+                                        .indexOf(searchData.toLowerCase()) >= 0
+                                    : null;
+                            })
+                            : null,
+                };
+            })
+            : null;
+
+    const vitalsignsearch =
+        pdfdata.patientchartdetail &&
+            pdfdata.patientchartdetail != null &&
+            pdfdata.patientchartdetail != undefined
+            ? pdfdata.patientchartdetail.map(item => {
+                return {
+                    chartdate: item.chartdate,
+                    consultantname: item.consultantname,
+                    patientchartdetaildata: ArrayCheck(item.patientchartdetaildata) ? [item.patientchartdetaildata.find(o => o.textheader === "VITAL SIGNS")] : []
+                };
+            })
+            : null;
+
+    const servicesearch =
+        pdfdata.patientchartdetail &&
+            pdfdata.patientchartdetail != null &&
+            pdfdata.patientchartdetail != undefined
+            ? pdfdata.patientchartdetail.map(item => {
+                return {
+                    chartdate: item.chartdate,
+                    consultantname: item.consultantname,
+                    patientservice: item.patientservice,
+                    patientservicedata:
+                        ArrayCheck(item.patientservice) &&
+                            item.patientservice.data != null &&
+                            item.patientservice.data != undefined
+                            ? item.patientservice.data.filter(subElement => {
+                                return subElement &&
+                                    subElement.assignedstatusname &&
+                                    subElement.assignedstatusname != null &&
+                                    subElement.assignedstatusname != undefined &&
+                                    subElement.assignedstatusname.length > 0
+                                    ? subElement.assignedstatusname
+                                        .toLowerCase()
+                                        .indexOf(searchData.toLowerCase()) >= 0
+                                    : null;
+                            })
+                            : null,
+                };
+            })
+            : null;
+
+    const labresultsearch = null;
+
+
+    function reverse(s) {
+        var fields = s.split('T')
+        if (fields != undefined && fields.length > 0) {
+            return fields[0].split('-').reverse().join('-');
+        } else {
+            return s.split('-').reverse().join('-');
+        }
+    }
+
+    var htmldata =
+        filter == 1
+            ? prescriptionsearch
+            : filter == 2
+                ? labresultsearch
+                : filter == 0
+                    ? datasearch
+                    : filter == 3
+                        ? filteredDate :
+                        filter == 4 ?
+                            servicesearch :
+                            filter == 5 ?
+                                vitalsignsearch
+                                : datasearch;
+
+    // console.log("Pdfffffffff datattatatatatatattatata",JSON.stringify(pdfdata))
+    // console.log("HTMLLLLLLLL DATATATTATATATATTTATTAT",JSON.stringify(htmldata))
+
+    function fnDateConsultant(datas, i) {
+
+        return (
+            datas &&
+                datas.chartdate &&
+                datas.chartdate != null &&
+                datas.chartdate != undefined
+                ?
+                `
+        <script>
+          const ImgSync = async (h) => {
+
+            window.ReactNativeWebView.postMessage(JSON.stringify({'data':h,'i':'chead'}))
+          };
+        </script>
+    <div style="display: flex;flex-direction: row;align-items: center;margin-top:10px;margin;-bottom:10px;">
+      <div style="font-size:12px;font-weight: bold;">
+        <i class="fa fa-calendar">
+        </i>
+        ${' '}
+        ${datas &&
+                    datas.chartdate &&
+                    datas.chartdate != null &&
+                    datas.chartdate != undefined
+                    ? datas.chartdate
+                    : ''}
+      </div>
+      <div style="margin-left:15px;font-size:12px;font-weight: bold;">
+      ${ValueCheck(datas.consultantname) ? `<i class="fa fa-user-md">` : ``}
+      </i>
+        ${' '}
+        ${datas.consultantname &&
+                    datas.consultantname != null &&
+                    datas.consultantname != undefined
+                    ? datas.consultantname
+                    : ''}
+      </div>
+    </div>
+    `: ``)
+    }
+
+    function getIntake(params, dosage) {
+        switch (dosage) {
+            case "STAT NEBULIZATION":
+            case "STAT":
+            case "SOS":
+            case "INVESTIGATION":
+            case "PROCEDURE":
+            case "IF REQUIRED": return ""
+            default: return params
+        }
+    }
+
+    function fnHtml(multi, multitiming) {
+
+        var newArray = multi.timingdata[0].timings[0].timingsarray.filter(function (el) {
+            return el.dosage[0].unit != "";
+        });
+
+        return (
+            newArray.map((timing, i) => {
+
+                return timing.dosage != null &&
+                    timing.dosage != undefined ?
+                    `   
+              <div style="display: flex;flex-direction: column;justify-content:center;align-items:center;margin-top:5px;margin-bottom:5px;">
+                <div style="font-weight:normal;font-size:10px;">
+                  <b>${timing.dosage[0].volume ? timing.dosage[0].volume : ''}</b>
+                  ${timing.dosage[0].unit ? timing.dosage[0].unit : ''} 
+                  ${timing.dosage[0].intake &&
+                        timing.dosage[0].intake != null &&
+                        timing.dosage[0].intake != undefined ?
+                        getIntake(timing.dosage[0].intake, multi.dosage) :
+                        ''}
+                </div>
+
+                ${getIntake(timing.dosage[0].intake, multi.dosage) ?
+                        `<div style="font-weight:normal;font-size:10px;">
+                  ${`<b>${timing.timingslotname && timing.timingslotname != null && timing.timingslotname != undefined && timing.timingslotname.length > 1 ? timing.timingslotname.charAt(0) + `<b style="font-size:7px;">${timing.timingslotname.substring(1).toLowerCase()}</b>` : ''}</b>(${timing.dosage[0].specifictime == true ? timing.dosage[0].timeprovided : timing.timingslotfrom + '-' + timing.timingslotto})`}
+                </div>
+                <div style="font-weight:normal;font-size:8px;">
+                  ${timing.dosage[0].patientdescription ? '* ' + timing.dosage[0].patientdescription : ''}
+                </div>` : ``}
+              
+              </div>  
+              ${newArray.length == (i + 1) ? '' : '<div style="height:0.5px;background-color:grey;width:100%;"></div>'}
+            `
+                    : '';
+            }).join('')
+        )
+
+    }
+
+
+
+    function fnPrescription(datas, s) {
+
+        return (`
+    <div>
+    ${(ArrayCheck(datas.prescriptions) &&
+                datas.prescriptions[0].data &&
+                datas.prescriptions[0].data[0] &&
+                datas.prescriptions[0].data[0].assignedstatusname &&
+                datas.prescriptions[0].data[0].assignedstatusname != null &&
+                datas.prescriptions[0].data[0].assignedstatusname != undefined &&
+                datas.prescriptions[0].data[0].assignedstatusname.length > 0 &&
+                datas.prescriptions[0].data[0].assignedstatusname != ' (0)') ||
+                (ArrayCheck(datas.prescriptions) &&
+                    datas.prescriptions[0].description &&
+                    datas.prescriptions[0].description[0] &&
+                    datas.prescriptions[0].description[0].instructions &&
+                    datas.prescriptions[0].description[0].instructions != null &&
+                    datas.prescriptions[0].description[0].instructions != undefined &&
+                    datas.prescriptions[0].description[0].instructions.length > 0) ||
+                (ArrayCheck(datas.prescriptions) &&
+                    datas.prescriptions[0].description &&
+                    datas.prescriptions[0].description[0] &&
+                    datas.prescriptions[0].description[0].notes &&
+                    datas.prescriptions[0].description[0].notes[0] &&
+                    datas.prescriptions[0].description[0].notes[0].displayvalue &&
+                    datas.prescriptions[0].description[0].notes[0].displayvalue != null &&
+                    datas.prescriptions[0].description[0].notes[0].displayvalue != undefined &&
+                    datas.prescriptions[0].description[0].notes[0].displayvalue.length > 0)
+                ? `<div style="font-size:10px;font-weight:normal;background-color:#F0F0F0;color:blue;margin-top:5px;">
+      <i class="fas fa-pills"></i>
+      PRESCRIPTION
+      </div>
+      `
+                : ''
+            }
+
+      <div style="margin-top:5px;">
+      ${ArrayCheck(datas.prescriptions) &&
+                datas.prescriptions[0].date &&
+                datas.prescriptions[0].description &&
+                datas.prescriptions[0].description != null &&
+                datas.prescriptions[0].description != undefined &&
+                datas.prescriptions[0].description.length > 0
+                ? datas.prescriptions[0].description
+                    .map(presNoteInsCom => {
+                        return `<div style="display:flex;flex-direction:row;margin-top:5px;align-items:center;">
+                  ${presNoteInsCom.notes &&
+                                presNoteInsCom.notes != null &&
+                                presNoteInsCom.notes != undefined &&
+                                presNoteInsCom.notes.length > 0
+                                ? ` <b style="font-size:10px;">NOTES : </b>`
+                                : ''}
+                 
+                            ${presNoteInsCom.notes &&
+                                presNoteInsCom.notes != null &&
+                                presNoteInsCom.notes != undefined &&
+                                presNoteInsCom.notes.length > 0
+                                ? presNoteInsCom.notes
+                                    .map(presnotes => {
+                                        return `${presnotes.displayvalue &&
+                                            presnotes.displayvalue != null &&
+                                            presnotes.displayvalue != undefined &&
+                                            presnotes.displayvalue.length > 0
+                                            ? `<div style="font-size:16px;font-weight: normal;display:flex;flex-direction:row;">
+                                  <i style="border: 0px  solid grey;border-radius: 25px;padding: 4px;">
+                                    ` : ''}
+                                      ${' '}
+                                     ${presnotes.displayvalue &&
+                                                presnotes.displayvalue != null &&
+                                                presnotes.displayvalue != undefined &&
+                                                presnotes.displayvalue.length > 0
+                                                ? presnotes.displayvalue
+                                                : ''
+                                            }
+                                                        
+                                  </i>
+                                </div>`;
+                                    })
+                                    .join(',')
+                                : ''
+                            }
+      </div>
+      <div style="display:flex;flex-direction:row;margin-top:7px;">
+      ${presNoteInsCom.instructions &&
+                                presNoteInsCom.instructions != null &&
+                                presNoteInsCom.instructions != undefined &&
+                                presNoteInsCom.instructions.length > 0
+                                ? ` <b style="font-size:10px;">INSTRUCTIONS : </b>`
+                                : ''}
+     
+      ${presNoteInsCom.instructions &&
+                                presNoteInsCom.instructions != null &&
+                                presNoteInsCom.instructions != undefined &&
+                                presNoteInsCom.instructions.length > 0
+                                ? presNoteInsCom.instructions
+                                    .map(presinst => {
+                                        return `
+      <div style="font-size:16px;font-weight: normal;">
+      ${presinst.displayvalue &&
+                                                presinst.displayvalue != null &&
+                                                presinst.displayvalue != undefined &&
+                                                presinst.displayvalue.length > 0
+                                                ?
+                                                `<i style="border: 0px  solid grey;border-radius: 25px;padding: 4px;">
+                    
+                      ${' '}
+                      ${presinst.displayvalue &&
+                                                    presinst.displayvalue != null &&
+                                                    presinst.displayvalue != undefined &&
+                                                    presinst.displayvalue.length > 0
+                                                    ? presinst.displayvalue
+                                                    : ''
+                                                }
+                             
+                      </i>`
+                                                : ''}
+      </div>`;
+                                    })
+                                    .join(',')
+                                : ''
+                            }
+      </div>`;
+                    })
+                    .join('')
+                : ''
+            }
+      </div>
+
+
+
+      ${ArrayCheck(datas.prescriptions) &&
+                datas.prescriptions[0].date &&
+                datas.prescriptions[0].data &&
+                datas.prescriptions[0].data != null &&
+                datas.prescriptions[0].data != undefined &&
+                datas.prescriptions[0].data.length > 0 &&
+                datas.prescriptions[0].data[0] &&
+                datas.prescriptions[0].data[0].assignedstatusname &&
+                datas.prescriptions[0].data[0].assignedstatusname != null &&
+                datas.prescriptions[0].data[0].assignedstatusname != undefined &&
+                datas.prescriptions[0].data[0].assignedstatusname.length > 0 &&
+                datas.prescriptions[0].data[0].assignedstatusname != ' (0)'
+                ? `
+      <div style="flex-direction: row;display: flex;width:100%;margin-top:5px;">
+      <div style="flex-direction: column;display: flex;border: 1px solid grey;border-right:0px solid grey;width:5%;font-size:15px;font-weight: normal;text-align:center;justify-content:center;">
+        <div style="font-size:12px;">No</div>
+      </div>
+      <div style="flex-direction: column;display: flex;border: 1px solid #888888;border-right:0px solid #888888;width:25%;font-size:15px;font-weight: normal;text-align:center;justify-content:center;">
+        <div style="font-size:12px;">Medicine</div>
+        <div style="font-size:8px;">Content</div>
+      </div>
+      <div style="flex-direction: row;display: flex;width:70%;">
+        <div style="flex-direction: column;display: flex;border: 1px solid grey;border-right:0px solid grey;width:30%;font-size:15px;font-weight: normal;text-align:center;justify-content:center;">
+          <div style="font-size:12px;">Dosage</div>
+          <div style="font-size:8px;">Timing</div>
+        </div>
+        <div style="flex-direction: column;display: flex;border: 1px solid grey;border-right:0px solid grey;width:20%;font-size:15px;font-weight: normal;text-align:center;justify-content:center;">
+          <div style="font-size:12px;">Duration</div>
+        </div>
+        <div style="flex-direction: column;display: flex;border: 1px solid grey;border-right:0px solid grey;width:12%;font-size:15px;font-weight: normal;text-align:center;justify-content:center;">
+          <div style="font-size:12px;">Route</div>
+        </div>
+        <div style="flex-direction: column;display: flex;border: 1px solid grey;border-right:0px solid grey;width:18%;font-size:15px;font-weight: normal;text-align:center;justify-content:center;">
+          <div style="font-size:10px;">Medication Date</div>
+        </div>
+        <div style="flex-direction: column;display: flex;border: 1px solid grey;width:20%;font-size:15px;font-weight: normal;text-align:center;justify-content:center;">
+          <div style="font-size:12px;">Remarks</div>
+        </div>
+      </div>
+    </div>`: ''}
+
+                    
+                  
+                  ${ArrayCheck(datas.prescriptions) &&
+                datas.prescriptions[0].date &&
+                datas.prescriptions[0].data &&
+                datas.prescriptions[0].data != null &&
+                datas.prescriptions[0].data != undefined &&
+                datas.prescriptions[0].data.length > 0 &&
+                datas.prescriptions[0].data[0] &&
+                datas.prescriptions[0].data[0].assignedstatusname &&
+                datas.prescriptions[0].data[0].assignedstatusname != null &&
+                datas.prescriptions[0].data[0].assignedstatusname != undefined &&
+                datas.prescriptions[0].data[0].assignedstatusname.length > 0 &&
+                datas.prescriptions[0].data[0].assignedstatusname != ' (0)'
+                ? datas.prescriptions[0].data
+                    .map((pres, i) => {
+                        return `
+                        <script>
+      const SendPresData = async (s) => {
+                    ${ArrayCheck(datas.prescriptions) &&
+                                datas.prescriptions[0].date &&
+                                datas.prescriptions[0].date != null &&
+                                datas.prescriptions[0].date != undefined &&
+                                datas.prescriptions[0] &&
+                                datas.prescriptions[0].date &&
+                                datas.prescriptions[0].data &&
+                                datas.prescriptions[0].data != null &&
+                                datas.prescriptions[0].data != undefined &&
+                                datas.prescriptions[0].data.length > 0 &&
+                                datas.prescriptions[0].data[0] &&
+                                datas.prescriptions[0].data[0].assignedstatusname &&
+                                datas.prescriptions[0].data[0].assignedstatusname != null &&
+                                datas.prescriptions[0].data[0].assignedstatusname != undefined &&
+                                datas.prescriptions[0].data[0].assignedstatusname.length > 0 &&
+                                datas.prescriptions[0].data[0].assignedstatusname != ' (0)'
+                                ?
+                                `window.ReactNativeWebView.postMessage(JSON.stringify({
+                  'i': 'presnew',
+                  'index':s,
+                }))`
+                                // `window.ReactNativeWebView.postMessage('${JSON.stringify({
+                                //   'i': 'pres',
+                                //   'index':i,
+                                //   'pdate': datas.prescriptions.date,
+                                //   'pdata': datas.prescriptions.data,
+                                //   'doctorname': datas.consultantname ,
+                                //   'pdescription': datas.prescriptions.description
+                                // })}')`
+                                : ''};
+
+
+
+      };
+      window.addEventListener("message", message => {
+        alert(message.data) 
+      });
+    </script>
+                  <div  onclick= ${ArrayCheck(datas.prescriptions) &&
+                                datas.prescriptions[0].date &&
+                                datas.prescriptions[0].data &&
+                                datas.prescriptions[0].data != null &&
+                                datas.prescriptions[0].data != undefined &&
+                                datas.prescriptions[0].data.length > 0 &&
+                                datas.prescriptions[0].data[0] &&
+                                datas.prescriptions[0].data[0].assignedstatusname &&
+                                datas.prescriptions[0].data[0].assignedstatusname != null &&
+                                datas.prescriptions[0].data[0].assignedstatusname != undefined &&
+                                datas.prescriptions[0].data[0].assignedstatusname.length > 0 &&
+                                datas.prescriptions[0].data[0].assignedstatusname != ' (0)' &&
+                                datas.prescriptions[0].date &&
+                                datas.prescriptions[0].date != null &&
+                                datas.prescriptions[0].date != undefined &&
+                                datas.prescriptions[0].date.length > 0
+                                ? `SendPresData(${s})` : ""}  style="flex-direction: row;display: flex;width:100%;align-items:stretch;justify-content:stretch;">
+                    <div style="display:flex;justify-content:center;align-items:center;text-align:center;background-color:white;width: 5%;font-size:10px;font-weight: bold;border: 1px solid grey;border-top:0px solid;border-right:0px solid;">
+                      ${i + 1}${'.'}
+                    </div>
+                    <div style="display:flex;flex-direction:column;justify-content:center;align-items:flex-start;text-align:left;background-color:white;width: 25%;font-size:15px;font-weight: bold;border: 1px solid grey;border-top:0px solid;border-right:0px solid;">
+                      <div style="margin-left:5px;font-size:10px;font-weight: bold;color:red;text-align:left;">
+                        ${pres.timings &&
+                                pres.timings != undefined &&
+                                pres.timings != null &&
+                                pres.timings != '' &&
+                                pres.timings.timingcategoryname &&
+                                pres.timings.timingcategoryname != null &&
+                                pres.timings.timingcategoryname != undefined
+                                ?
+                                '[' + pres.timings.timingcategoryname + ']' :
+                                pres.dosage}
+                      </div>
+                      
+                      <div style="margin-left:5px;font-size:11px;">
+                        ${pres.outsidemedicine &&
+                                pres.outsidemedicine != null &&
+                                pres.outsidemedicine != undefined &&
+                                pres.outsidemedicine == true ?
+                                '<b style="font-size:11px;color:red;">*</b>' : ''
+                            }
+                        ${pres.assignedstatusname &&
+                                pres.assignedstatusname != null &&
+                                pres.assignedstatusname !=
+                                undefined &&
+                                pres.assignedstatusname.length > 0
+                                ? pres.assignedstatusname
+                                : ''
+                            }
+                      </div>
+
+                      <div style="margin-left:5px;font-size:9px;font-weight: normal;text-align:left;">
+                        ${pres.outsidemedicine &&
+                                pres.outsidemedicine != null &&
+                                pres.outsidemedicine != undefined &&
+                                pres.outsidemedicine == true ?
+                                '<b style="font-size:15px;color:white;">*</b>' : ''
+                            }  
+                        ${pres.content &&
+                                pres.content != null &&
+                                pres.content !=
+                                undefined &&
+                                pres.content.length > 0
+                                ? pres.content
+                                : ''
+                            }
+                      </div>
+                    </div>
+                    <div style="width:70%;text-align:center;flex-direction: row;display: flex;font-size:15px;font-weight: bold;">
+                      <div style="display:flex;justify-content:center;align-items:center;width:30%;display: flex;flex-direction: column;align-items:center;border:1px solid grey;border-top:0px solid;border-right:0px solid;">
+                        ${ArrayCheck(pres.timingdata) &&
+                                pres.timingdata[0].timings &&
+                                pres.timingdata[0].timings != undefined &&
+                                pres.timingdata[0].timings != null &&
+                                pres.timingdata[0].timings != '' &&
+                                pres.timingdata[0].timings[0].timingsarray &&
+                                pres.timingdata[0].timings[0].timingsarray != null &&
+                                pres.timingdata[0].timings[0].timingsarray != undefined ?
+                                fnHtml(pres, false)
+                                : ''}
+                      </div>
+                      ${ArrayCheck(pres.timingdata) && getIntake(pres.intake, pres.dosage) &&
+                                pres.timingdata[0].timings &&
+                                pres.timingdata[0].timings != undefined &&
+                                pres.timingdata[0].timings != null ?
+                                `<div style="display:flex;justify-content:center;align-items:center;width:20%;font-size:10px;text-align:center;border:1px solid grey;border-top:0px solid;border-right:0px solid;">
+                      ${pres.durationnature != null &&
+                                    pres.durationnature != undefined
+                                    ? pres.durationnature
+                                    : ''
+                                }${' '}
+                    ${pres.duration != undefined &&
+                                    pres.duration != null &&
+                                    pres.duration != 0
+                                    ? 'FOR ' + pres.duration
+                                    : ' '}${' '}
+                    ${pres.durationtype != null &&
+                                    pres.durationtype != undefined &&
+                                    pres.duration &&
+                                    pres.duration != undefined &&
+                                    pres.duration != null &&
+                                    pres.duration != 0
+                                    ? pres.durationtype
+                                    : ''
+                                }
+                    ${pres.durationtype != null &&
+                                    pres.durationtype != undefined &&
+                                    pres.duration &&
+                                    pres.duration != undefined &&
+                                    pres.duration != null &&
+                                    pres.duration != 0 &&
+                                    pres.duration != 1
+                                    ? '(S)'
+                                    : ' '}
+                      
+                      </div>`
+
+                                : `<div style="display:flex;justify-content:center;align-items:center;width:20%;font-size:10px;text-align:center;border:1px solid grey;border-top:0px solid;border-right:0px solid;">
+                      </div>`}
+                      <div style="display:flex;justify-content:center;align-items:center;width:12%;font-size:10px;text-align:center;border:1px solid grey;border-top:0px solid;border-right:0px solid;">
+                                ${ArrayCheck(pres.timingdata) && pres.routename && pres.routename != null && pres.routename != undefined ? pres.routename : ''}
+                      </div>
+                      <div style="display:flex;justify-content:center;align-items:center;width:18%;font-size:10px;text-align:center;border:1px solid grey;border-top:0px solid;border-right:0px solid;">
+                        ${ArrayCheck(pres.timingdata) && pres.timingdata[0].performeddate && pres.timingdata[0].performeddate != null && pres.timingdata[0].performeddate != undefined ? reverse(pres.timingdata[0].performeddate) : ''}
+                      </div> 
+                      <div style="display:flex;justify-content:center;align-items:center;width:20%;font-size:10px;text-align:center;border:1px solid grey;border-top:0px solid;">
+                        ${ArrayCheck(pres.timingdata) && pres.timingdata[0].remarks && pres.timingdata[0].remarks != null && pres.timingdata[0].remarks != undefined ? pres.timingdata[0].remarks : ''}                                 
+                      </div>
+                    </div>
+                  </div>
+
+
+`;
+                    })
+                    .join('')
+                : ''
+            }
+
+
+
+
+
+
+
+
+
+</div>
+`)
+
+    }
+
+    function fnPatientService(datas) {
+
+        return (`<div>
+
+    ${(ArrayCheck(datas.patientservice) &&
+                datas.patientservice[0].data &&
+                datas.patientservice[0].data[0] &&
+                datas.patientservice[0].data[0].assignedstatusname &&
+                datas.patientservice[0].data[0].assignedstatusname != null &&
+                datas.patientservice[0].data[0].assignedstatusname != undefined &&
+                datas.patientservice[0].data[0].assignedstatusname.length > 0 &&
+                datas.patientservice[0].data[0].assignedstatusname != ' (0)') ||
+                (ArrayCheck(datas.patientservice) &&
+                    datas.patientservice[0].description &&
+                    datas.patientservice[0].description[0] &&
+                    datas.patientservice[0].description[0].instructions &&
+                    datas.patientservice[0].description[0].instructions != null &&
+                    datas.patientservice[0].description[0].instructions != undefined &&
+                    datas.patientservice[0].description[0].instructions.length > 0) ||
+                (ArrayCheck(datas.patientservice) &&
+                    datas.patientservice[0].description &&
+                    datas.patientservice[0].description[0] &&
+                    datas.patientservice[0].description[0].notes &&
+                    datas.patientservice[0].description[0].notes[0] &&
+                    datas.patientservice[0].description[0].notes[0].displayvalue &&
+                    datas.patientservice[0].description[0].notes[0].displayvalue != null &&
+                    datas.patientservice[0].description[0].notes[0].displayvalue != undefined &&
+                    datas.patientservice[0].description[0].notes[0].displayvalue.length > 0)
+                ? `
+                <div style="font-size:10px;background-color:#F0F0F0;color:blue;">  <i class="fa-solid fa-hand-holding-heart"></i> PATIENT SERVICE</div>`
+                : ''
+            }
+    ${ArrayCheck(datas.patientservice) &&
+                datas.patientservice[0].date &&
+                datas.patientservice[0].data &&
+                datas.patientservice[0].data != null &&
+                datas.patientservice[0].data != undefined &&
+                datas.patientservice[0].data.length > 0 &&
+                datas.patientservice[0].data[0] &&
+                datas.patientservice[0].data[0].assignedstatusname &&
+                datas.patientservice[0].data[0].assignedstatusname != null &&
+                datas.patientservice[0].data[0].assignedstatusname != undefined &&
+                datas.patientservice[0].data[0].assignedstatusname.length > 0 &&
+                datas.patientservice[0].data[0].assignedstatusname != ' (0)'
+                ? `<div style="flex-direction: row;display: flex;width:100%;">
+    
+    <div style="width: 20%;border: 1px white;">
+    <div style="margin-left:1px;margin-top:5px;font-size:10px;font-weight: normal;">
+    Medicine/Content</div>
+    
+    </div>
+    
+    <div style="width: 40%;border: 1px white;">
+    <div style="margin-left:1px;margin-top:5px;font-size:10px;font-weight: normal;text-align:center;">Medication</div>
+    </div>
+    
+    
+    <div style="width: 20%;border: 1px white;">
+    <div style="margin-left:1px;margin-top:5px;font-size:10px;font-weight: normal;">Duration</div>
+    </div>
+    
+    <div style="width: 20%;border: 1px white;">
+    <div style="margin-left:1px;margin-top:5px;font-size:10px;font-weight: normal;">Route</div>
+    </div>
+    
+    </div>`
+                : ''
+            }
+    <div style="">
+    ${ArrayCheck(datas.patientservice) &&
+                datas.patientservice[0].date &&
+                datas.patientservice[0].data &&
+                datas.patientservice[0].data != null &&
+                datas.patientservice[0].data != undefined &&
+                datas.patientservice[0].data.length > 0 &&
+                datas.patientservice[0].data[0] &&
+                datas.patientservice[0].data[0].assignedstatusname &&
+                datas.patientservice[0].data[0].assignedstatusname != null &&
+                datas.patientservice[0].data[0].assignedstatusname != undefined &&
+                datas.patientservice[0].data[0].assignedstatusname.length > 0 &&
+                datas.patientservice[0].data[0].assignedstatusname != ' (0)'
+                ? datas.patientservice[0].data
+                    .map(pres => {
+                        return `
+    <div style="flex-direction: row;display: flex;width:100%;">
+    <div style="width: 20%;margin-left:1px;margin-top:1px;font-size:12px;font-weight: bold;">${pres.assignedstatusname ? pres.assignedstatusname : ''
+                            }</div>
+    <div style="width: 40%;margin-left:1px;margin-top:1px;font-size:10px;font-weight: bold;">
+    ${pres.dosage ? pres.dosage : ''
+                            }
+    
+          <div style="margin-left:1px;margin-top:1px;font-size:10px;font-weight: normal;">
+    
+          ${pres.timings != undefined && pres.timings != null && ArrayCheck(pres.timings) &&
+                                pres.timings[0].timingsarray != undefined ? pres.timings[0].timingsarray.map((timing, i) => {
+                                    return (timing.dosage[0].usagename != "" ? `
+            <div style="flex-direction: row;display: flex;">
+            ${timing.timingslotname}
+            ${'  '}
+            ${timing.dosage[0].usagename}
+            ${'  '}
+            ${' BETWEEN '}
+            ${'  '}
+            ${timing.timingslotfrom}
+            ${'  '}
+            ${" TO "}
+            ${'  '}
+            ${timing.timingslotto}
+            ${'  '}
+            ${timing.dosage[0].intake && timing.dosage[0].intake != null && timing.dosage[0].intake != undefined ? timing.dosage[0].intake : ''}
+            </div>
+            `: '')
+                                }).join('') : ''}
+                  
+                  
+                    </div>
+        
+          </div>
+    <div style="width: 20%;margin-left:1px;margin-top:1px;font-size:10px;font-weight: bold;">
+    
+          ${pres.timing ? pres.timing : ''
+                            }${' '}${pres.durationnature ? pres.durationnature : ''}${' '}${pres.duration ? 'FOR ' + pres.duration : ''
+                            }${' '}${pres.durationtype ? pres.durationtype + '(S)' : ''
+                            }${' '}
+          </div>
+    <div style="width: 20%;margin-left:1px;margin-top:1px;font-size:10px;font-weight: bold;">${pres.routename ? pres.routename : ''
+                            }</div>
+    </div>
+    
+    <div>
+    
+    </div>
+    
+    
+    
+    <div style="flex-direction: row;display: flex;">
+    <div style="margin-left:1px;margin-top:1px;font-size:10px;font-weight: bold;">${pres.performeddate ? '      ' + pres.performeddate : ''
+                            }${' '}${pres.remarks ? '**' + pres.remarks : ''}</div>
+    </div>
+    
+    
+    `;
+                    })
+                    .join('')
+                : ''
+            }</div>
+    
+    
+    <div style="margin-left:30px;">
+    ${ArrayCheck(datas.patientservice) &&
+                datas.patientservice[0].date &&
+                datas.patientservice[0].description &&
+                datas.patientservice[0].description != null &&
+                datas.patientservice[0].description != undefined &&
+                datas.patientservice[0].description.length > 0
+                ? datas.patientservice[0].description
+                    .map(presNoteInsCom => {
+                        return `<div>
+    ${presNoteInsCom.notes &&
+                                presNoteInsCom.notes != null &&
+                                presNoteInsCom.notes != undefined &&
+                                presNoteInsCom.notes.length > 0
+                                ? presNoteInsCom.notes
+                                    .map(presnotes => {
+                                        return `${presnotes.displayvalue &&
+                                            presnotes.displayvalue != null &&
+                                            presnotes.displayvalue != undefined &&
+                                            presnotes.displayvalue.length > 0
+                                            ? `<div style="font-size:14px;font-weight: normal;margin-top:10px">
+    <i style="border: 1px  solid lightgrey;border-radius: 25px;padding: 4px;">
+    <i class="fa fa-paperclip">
+    </i>`
+                                            : ''
+                                            }
+    ${' '}
+    ${presnotes.displayvalue &&
+                                                presnotes.displayvalue != null &&
+                                                presnotes.displayvalue != undefined &&
+                                                presnotes.displayvalue.length > 0
+                                                ? presnotes.displayvalue
+                                                : ''
+                                            }
+    </i>
+    </div>`;
+                                    })
+                                    .join('')
+                                : ''
+                            }
+    </div>
+    <div style="">
+    ${presNoteInsCom.instructions &&
+                                presNoteInsCom.instructions != null &&
+                                presNoteInsCom.instructions != undefined &&
+                                presNoteInsCom.instructions.length > 0
+                                ? presNoteInsCom.instructions
+                                    .map(presinst => {
+                                        return `
+    <div style="font-size:14px;font-weight: normal;margin-top:10px">
+    <i style="border: 1px  solid lightgrey;border-radius: 25px;padding: 4px;">
+    ${presinst.displayvalue &&
+                                                presinst.displayvalue != null &&
+                                                presinst.displayvalue != undefined &&
+                                                presinst.displayvalue.length > 0
+                                                ? `<i class="fa fa-thumb-tack"></i>`
+                                                : ''
+                                            }
+    ${' '}
+    ${presinst.displayvalue &&
+                                                presinst.displayvalue != null &&
+                                                presinst.displayvalue != undefined &&
+                                                presinst.displayvalue.length > 0
+                                                ? presinst.displayvalue
+                                                : ''
+                                            }
+    </i>
+    </div>`;
+                                    })
+                                    .join('')
+                                : ''
+                            }
+    </div>`;
+                    })
+                    .join('')
+                : ''
+            }
+    </div>
+    `)
+
+    }
+
+    function fnDiet(datas) {
+        // console.log("----------------DIET-------------------",JSON.stringify(datas))
+        return (`<div>
+    ${(ArrayCheck(datas.diet) &&
+                datas.diet[0].data &&
+                datas.diet[0].data[0] &&
+                datas.diet[0].data[0].assignedstatusname &&
+                datas.diet[0].data[0].assignedstatusname != null &&
+                datas.diet[0].data[0].assignedstatusname != undefined &&
+                datas.diet[0].data[0].assignedstatusname.length > 0 &&
+                datas.diet[0].data[0].assignedstatusname != ' (0)') ||
+                (ArrayCheck(datas.diet) &&
+                    datas.diet[0].description &&
+                    datas.diet[0].description[0] &&
+                    datas.diet[0].description[0].instructions &&
+                    datas.diet[0].description[0].instructions != null &&
+                    datas.diet[0].description[0].instructions != undefined &&
+                    datas.diet[0].description[0].instructions.length > 0) ||
+                (ArrayCheck(datas.diet) &&
+                    datas.diet[0].description &&
+                    datas.diet[0].description[0] &&
+                    datas.diet[0].description[0].notes &&
+                    datas.diet[0].description[0].notes[0] &&
+                    datas.diet[0].description[0].notes[0].displayvalue &&
+                    datas.diet[0].description[0].notes[0].displayvalue != null &&
+                    datas.diet[0].description[0].notes[0].displayvalue != undefined &&
+                    datas.diet[0].description[0].notes[0].displayvalue.length > 0)
+                ? `<div style="font-size:10px;background-color:#F0F0F0;color:blue;"> <i class="fa-solid fa-apple-whole"></i> DIET</div>`
+                : ''
+            }
+    ${ArrayCheck(datas.diet) &&
+                datas.diet[0].date &&
+                datas.diet[0].data &&
+                datas.diet[0].data != null &&
+                datas.diet[0].data != undefined &&
+                datas.diet[0].data.length > 0 &&
+                datas.diet[0].data[0] &&
+                datas.diet[0].data[0].assignedstatusname &&
+                datas.diet[0].data[0].assignedstatusname != null &&
+                datas.diet[0].data[0].assignedstatusname != undefined &&
+                datas.diet[0].data[0].assignedstatusname.length > 0 &&
+                datas.diet[0].data[0].assignedstatusname != ' (0)'
+                ? `<div style="flex-direction: row;display: flex;width:100%;">
+    
+    <div style="width: 20%;border: 1px white;">
+    <div style="margin-left:1px;margin-top:5px;font-size:10px;font-weight: normal;">
+    Medicine/Content</div>
+    
+    </div>
+    
+    <div style="width: 40%;border: 1px white;">
+    <div style="margin-left:1px;margin-top:5px;font-size:10px;font-weight: normal;text-align:center;">Medication</div>
+    </div>
+    
+    
+    <div style="width: 20%;border: 1px white;">
+    <div style="margin-left:1px;margin-top:5px;font-size:10px;font-weight: normal;">Duration</div>
+    </div>
+    
+    <div style="width: 20%;border: 1px white;">
+    <div style="margin-left:1px;margin-top:5px;font-size:10px;font-weight: normal;">Route</div>
+    </div>
+    
+    </div>`
+                : ''
+            }
+    <div style="">
+    ${ArrayCheck(datas.diet) &&
+                datas.diet[0].date &&
+                datas.diet[0].data &&
+                datas.diet[0].data != null &&
+                datas.diet[0].data != undefined &&
+                datas.diet[0].data.length > 0 &&
+                datas.diet[0].data[0] &&
+                datas.diet[0].data[0].assignedstatusname &&
+                datas.diet[0].data[0].assignedstatusname != null &&
+                datas.diet[0].data[0].assignedstatusname != undefined &&
+                datas.diet[0].data[0].assignedstatusname.length > 0 &&
+                datas.diet[0].data[0].assignedstatusname != ' (0)'
+                ? datas.diet[0].data
+                    .map(pres => {
+                        return `
+    <div style="flex-direction: row;display: flex;width:100%;">
+    <div style="width: 20%;margin-left:1px;margin-top:1px;font-size:10px;font-weight: bold;">${pres.assignedstatusname ? pres.assignedstatusname : ''
+                            }</div>
+    <div style="width: 40%;margin-left:1px;margin-top:1px;font-size:10px;font-weight: bold;">
+    ${pres.dosage ? pres.dosage : ''
+                            }
+    
+          <div style="margin-left:1px;margin-top:1px;font-size:10px;font-weight: normal;">
+    
+          ${pres.timings != undefined && pres.timings != null && pres.timings != "" && ArrayCheck(pres.timings) &&
+                                pres.timings[0].timingsarray != undefined ? pres.timings[0].timingsarray.map((timing, i) => {
+                                    return (timing.dosage[0].usagename != "" ? `
+            <div style="flex-direction: row;display: flex;">
+            ${timing.timingslotname}
+            ${'  '}
+            ${timing.dosage[0].usagename}
+            ${'  '}
+            ${' BETWEEN '}
+            ${'  '}
+            ${timing.timingslotfrom}
+            ${'  '}
+            ${" TO "}
+            ${'  '}
+            ${timing.timingslotto}
+            ${'  '}
+            ${timing.dosage[0].intake && timing.dosage[0].intake != null && timing.dosage[0].intake != undefined ? timing.dosage[0].intake : ''}
+            </div>
+            `: '')
+                                }).join('') : ''}
+                  
+                  
+                    </div>
+        
+          </div>
+    <div style="width: 20%;margin-left:1px;margin-top:1px;font-size:10px;font-weight: bold;">
+    
+          ${pres.timing ? pres.timing : ''
+                            }${' '}${pres.durationnature ? pres.durationnature : ''}${' '}${pres.duration ? 'FOR ' + pres.duration : ''
+                            }${' '}${pres.durationtype ? pres.durationtype + '(S)' : ''
+                            }${' '}
+          </div>
+    <div style="width: 20%;margin-left:1px;margin-top:1px;font-size:10px;font-weight: bold;">${pres.routename ? pres.routename : ''
+                            }</div>
+    </div>
+    
+    <div>
+    
+    </div>
+    
+    
+    
+    <div style="flex-direction: row;display: flex;">
+    <div style="margin-left:1px;margin-top:1px;font-size:10px;font-weight: bold;">${pres.performeddate ? '      ' + pres.performeddate : ''
+                            }${' '}${pres.remarks ? '**' + pres.remarks : ''}</div>
+    </div>
+    
+    
+    `;
+                    })
+                    .join('')
+                : ''
+            }</div>
+    
+    
+    <div style="">
+    ${ArrayCheck(datas.diet) &&
+                datas.diet[0].date &&
+                datas.diet[0].description &&
+                datas.diet[0].description != null &&
+                datas.diet[0].description != undefined &&
+                datas.diet[0].description.length > 0
+                ? datas.diet[0].description
+                    .map(presNoteInsCom => {
+                        return `<div>
+    ${presNoteInsCom.notes &&
+                                presNoteInsCom.notes != null &&
+                                presNoteInsCom.notes != undefined &&
+                                presNoteInsCom.notes.length > 0
+                                ? presNoteInsCom.notes
+                                    .map(presnotes => {
+                                        return `${presnotes.displayvalue &&
+                                            presnotes.displayvalue != null &&
+                                            presnotes.displayvalue != undefined &&
+                                            presnotes.displayvalue.length > 0
+                                            ? `<div style="font-size:14px;font-weight: normal;margin-top:10px;">
+    <i style="border: 1px  solid lightgrey;border-radius: 25px;padding: 4px;">
+    <i class="fa fa-paperclip">
+    </i>`
+                                            : ''
+                                            }
+    ${' '}
+    ${presnotes.displayvalue &&
+                                                presnotes.displayvalue != null &&
+                                                presnotes.displayvalue != undefined &&
+                                                presnotes.displayvalue.length > 0
+                                                ? presnotes.displayvalue
+                                                : ''
+                                            }
+    </i>
+    </div>`;
+                                    })
+                                    .join('')
+                                : ''
+                            }
+    </div>
+    <div style="">
+    ${presNoteInsCom.instructions &&
+                                presNoteInsCom.instructions != null &&
+                                presNoteInsCom.instructions != undefined &&
+                                presNoteInsCom.instructions.length > 0
+                                ? presNoteInsCom.instructions
+                                    .map(presinst => {
+                                        return `
+    <div style="font-size:14px;font-weight: normal;margin-top:10px;">
+    <i style="border: 1px  solid lightgrey;border-radius: 25px;padding: 4px;">
+    ${presinst.displayvalue &&
+                                                presinst.displayvalue != null &&
+                                                presinst.displayvalue != undefined &&
+                                                presinst.displayvalue.length > 0
+                                                ? `<i class="fa fa-thumb-tack"></i>`
+                                                : ''
+                                            }
+    ${' '}
+    ${presinst.displayvalue &&
+                                                presinst.displayvalue != null &&
+                                                presinst.displayvalue != undefined &&
+                                                presinst.displayvalue.length > 0
+                                                ? presinst.displayvalue
+                                                : ''
+                                            }
+    </i>
+    </div>`;
+                                    })
+                                    .join('')
+                                : ''
+                            }
+    </div>`;
+                    })
+                    .join('')
+                : ''
+            }
+    </div>
+    
+    `)
+
+    }
+
+
+    function fnMainMap() {
+        return (
+            `
+      ${htmldata && htmldata != null && htmldata != undefined && htmldata.length > 0 ?
+                htmldata.map((datas, i) => {
+                    return `
+        <div style="display: flex;flex-direction: column;">
+          <div style="position:fixed;bottom:100px;right:300px;opacity:1;z-index:100;color:#E5E4E2;user-select: none;font-size: 70px;transform: rotate(0deg);"> 
+          </div>
+          ${fnDateConsultant(datas, i)}
+          ${datas.patientchartdetaildata &&
+                            datas.patientchartdetaildata != null &&
+                            datas.patientchartdetaildata != undefined &&
+                            datas.patientchartdetaildata.length > 0
+                            ? datas.patientchartdetaildata
+                                .map(detaildata => {
+                                    // console.log("...............DDDDDDDD........", JSON.stringify(detaildata))
+                                    if (
+                                        ValueCheck(detaildata) &&
+                                        detaildata.textheader != null &&
+                                        detaildata.textheader != undefined &&
+                                        detaildata.textheader.length > 0 &&
+                                        detaildata.textheader != 'PRESCRIPTION' &&
+                                        detaildata.textheader != 'EYE EVALUATION' &&
+                                        detaildata.textheader != 'PATIENT SERVICE' &&
+                                        detaildata.textheader != 'DIET'
+                                    ) {
+                                        return `<div style="">
+                                                ${(detaildata.notes &&
+                                                detaildata.notes[0] &&
+                                                detaildata.notes[0].displayvalue &&
+                                                detaildata.notes[0].displayvalue != null &&
+                                                detaildata.notes[0].displayvalue != undefined &&
+                                                detaildata.notes[0].displayvalue.length > 0) ||
+                                                (detaildata.instructions &&
+                                                    detaildata.instructions[0] &&
+                                                    detaildata.instructions[0].displayvalue &&
+                                                    detaildata.instructions[0].displayvalue != null &&
+                                                    detaildata.instructions[0].displayvalue != undefined &&
+                                                    detaildata.instructions[0].displayvalue.length > 0) ||
+                                                (detaildata.savedpdf &&
+                                                    detaildata.savedpdf != null &&
+                                                    detaildata.savedpdf != undefined &&
+                                                    detaildata.savedpdf.length > 0) ||
+                                                (detaildata.savedimages &&
+                                                    detaildata.savedimages != null &&
+                                                    detaildata.savedimages != undefined &&
+                                                    detaildata.savedimages.length > 0) ||
+                                                (detaildata.savedaudio &&
+                                                    detaildata.savedaudio != null &&
+                                                    detaildata.savedaudio != undefined &&
+                                                    detaildata.savedaudio.length > 0) ||
+                                                (detaildata.savedvideo &&
+                                                    detaildata.savedvideo != null &&
+                                                    detaildata.savedvideo != undefined &&
+                                                    detaildata.savedvideo.length > 0)
+                                                ||
+                                                (detaildata &&
+                                                    detaildata.dataArr != null &&
+                                                    detaildata.dataArr != undefined &&
+                                                    detaildata.dataArr.length > 0)
+                                                ? `<div style="color:blue;font-size:10px;background-color:#F0F0F0;"> <i class="fa-solid fa-file"></i>
+                          ${detaildata.textheader &&
+                                                    detaildata.textheader != null &&
+                                                    detaildata.textheader != undefined &&
+                                                    detaildata.textheader.length > 0
+                                                    &&
+                                                    detaildata.textheader != 'PRESCRIPTION' &&
+                                                    detaildata.textheader != 'EYE EVALUATION' &&
+                                                    detaildata.textheader != 'PATIENT SERVICE' &&
+                                                    detaildata.textheader != 'DIET'
+                                                    ? detaildata.textheader
+                                                    : ''
+                                                }
+                            </div>`
+                                                : ''
+                                            }
+
+                    
+                                                ${detaildata.dataArr != undefined
+                                                && detaildata.dataArr != null
+                                                && detaildata.dataArr.length > 0 ?
+                                                detaildata.dataArr.map(arraydata => {
+                                                    // console.log("IMAG URL", JSON.stringify(arraydata))
+                                                    return `
+
+                        <div>
+                        <div style="display: flex;flex-direction: row;align-items: center;justify-content: space-between;background-color:#fff;">
+                        <div style="font-weight: bold;font-size:14px;">
+                        <i class="fa fa-circle-dot" style="margin-right:5px; font-size: 0.73em;"></i>
+                        </i>
+                                                            ${arraydata.displayvalue &&
+                                                            arraydata.displayvalue != null &&
+                                                            arraydata.displayvalue != "" &&
+                                                            arraydata.displayvalue != undefined &&
+                                                            arraydata.displayvalue.length > 0
+                                                            ? getString(arraydata.displayvalue)
+                                                            : ``}
+                      </div>
+                      </div>
+
+                      ${ValueCheck(arraydata.displayvalue)
+                                                            && getImageFromString(arraydata.displayvalue) != undefined ?
+                                                            `<a href="${imageURL + getImageFromString(arraydata.displayvalue)}"> <img onclick="SendDImgData2()" src=${imageURL + getImageFromString(arraydata.displayvalue)} 
+                      alt="No image(s)" onerror="this.src='https://upload.wikimedia.org/wikipedia/commons/1/14/No_Image_Available.jpg?20200913095930';" style="margin: 3px;width: 100px;height: 100px;object-fit: contain;"></a>` : ``}
+                      
+                      </div>`
+                                                }).join('') : ``}
+
+                    
+                    <div>
+                                            ${detaildata.notes &&
+                                                detaildata.notes != null &&
+                                                detaildata.notes != undefined &&
+                                                detaildata.notes.length > 0
+                                                ? detaildata.notes
+                                                    .map(notesdata => {
+                                                        return `${notesdata.displayvalue &&
+                                                            notesdata.displayvalue != null &&
+                                                            notesdata.displayvalue != undefined &&
+                                                            notesdata.displayvalue.length > 0
+                                                            ? `<div style="font-size:15px;font-weight: normal;display:flex;flex-direction:row;">
+                              <i style="border: 1px  solid grey;border-radius: 25px;padding: 4px;">
+                              <i class="fa fa-paperclip">
+                              </i>`
+                                                            : ''
+                                                            }
+                              ${' '}
+                              ${notesdata.displayvalue &&
+                                                                notesdata.displayvalue != null &&
+                                                                notesdata.displayvalue != undefined &&
+                                                                notesdata.displayvalue.length > 0
+                                                                ? notesdata.displayvalue
+                                                                : ''
+                                                            }
+                              </i>
+                              </div>`;
+                                                    })
+                                                    .join('')
+                                                : ''
+                                            }
+</div>
+<div style="margin-top:10px;">
+${detaildata.instructions &&
+                                                detaildata.instructions != null &&
+                                                detaildata.instructions != undefined &&
+                                                detaildata.instructions.length > 0
+                                                ? detaildata.instructions
+                                                    .map(instdata => {
+                                                        return `<div style="font-size:15px;font-weight: normal;display:flex;flex-direction:row;">
+                            ${instdata.displayvalue &&
+                                                                instdata.displayvalue != null &&
+                                                                instdata.displayvalue != undefined &&
+                                                                instdata.displayvalue.length > 0
+                                                                ?
+                                                                `<i style="border: 1px  solid grey;border-radius: 25px;padding: 4px;">
+                                            ${instdata.displayvalue &&
+                                                                    instdata.displayvalue != null &&
+                                                                    instdata.displayvalue != undefined &&
+                                                                    instdata.displayvalue.length > 0
+                                                                    ? `<i class="fa fa-thumb-tack"></i>`
+                                                                    : ''
+                                                                }
+                                            ${' '}
+                                            ${instdata.displayvalue &&
+                                                                    instdata.displayvalue != null &&
+                                                                    instdata.displayvalue != undefined &&
+                                                                    instdata.displayvalue.length > 0
+                                                                    ? instdata.displayvalue
+                                                                    : ''
+                                                                }
+                                            </i>`
+                                                                : ''}
+                            </div>`;
+                                                    })
+                                                    .join('')
+                                                : ''
+                                            }
+</div>
+
+
+<div style="">
+${detaildata.savedpdf &&
+                                                detaildata.savedpdf != null &&
+                                                detaildata.savedpdf != undefined &&
+                                                detaildata.savedpdf.length > 0
+                                                ? detaildata.savedpdf
+                                                    .map(pdf => {
+                                                        return ``;
+                                                    })
+                                                    .join('')
+                                                : ''
+                                            }
+</div>    
+<div style="">
+${detaildata.savedimages &&
+                                                detaildata.savedimages != null &&
+                                                detaildata.savedimages != undefined &&
+                                                detaildata.savedimages.length > 0
+                                                ? detaildata.savedimages
+                                                    .map((images, i) => {
+                                                        return `<script>
+  const SendDImgData = async () => {
+    ${detaildata.savedimages &&
+                                                                detaildata.savedimages != null &&
+                                                                detaildata.savedimages != undefined &&
+                                                                detaildata.savedimages.length > 0 ?
+                                                                `window.ReactNativeWebView.postMessage('${JSON.stringify({
+                                                                    i: 'dimgs',
+                                                                    savedimages: detaildata.savedimages,
+                                                                    index: i + 1,
+                                                                    imageuri: images.filename,
+                                                                })}')` : ''};
+  };
+</script>`;
+                                                    })
+                                                    .join('')
+                                                : ''
+                                            }
+</div>
+             
+</div>`;
+                                    }
+                                })
+                                .join('')
+                            : datas.description &&
+                                datas.description != null &&
+                                datas.description != undefined &&
+                                datas.description.length > 0
+                                ? datas.description
+                                    .map(descriptiondata => {
+                                        if (
+                                            descriptiondata.textheader &&
+                                            descriptiondata.textheader != null &&
+                                            descriptiondata.textheader != undefined &&
+                                            descriptiondata.textheader.length > 0 &&
+                                            descriptiondata.textheader != 'PRESCRIPTION'
+                                        ) {
+                                            return `<div style="margin-left:30px;">
+
+                                                    ${(descriptiondata.notes &&
+                                                    descriptiondata.notes[0] &&
+                                                    descriptiondata.notes[0].displayvalue &&
+                                                    descriptiondata.notes[0].displayvalue != null &&
+                                                    descriptiondata.notes[0].displayvalue != undefined &&
+                                                    descriptiondata.notes[0].displayvalue.length > 0) ||
+                                                    (descriptiondata.instructions &&
+                                                        descriptiondata.instructions[0] &&
+                                                        descriptiondata.instructions[0].displayvalue &&
+                                                        descriptiondata.instructions[0].displayvalue != null &&
+                                                        descriptiondata.instructions[0].displayvalue != undefined &&
+                                                        descriptiondata.instructions[0].displayvalue.length > 0) ||
+                                                    (descriptiondata.savedimages &&
+                                                        descriptiondata.savedimages != null &&
+                                                        descriptiondata.savedimages != undefined &&
+                                                        descriptiondata.savedimages.length > 0) ||
+                                                    (descriptiondata.savedaudio &&
+                                                        descriptiondata.savedaudio != null &&
+                                                        descriptiondata.savedaudio != undefined &&
+                                                        descriptiondata.savedaudio.length > 0) ||
+                                                    (descriptiondata.savedvideo &&
+                                                        descriptiondata.savedvideo != null &&
+                                                        descriptiondata.savedvideo != undefined &&
+                                                        descriptiondata.savedvideo.length > 0) ||
+                                                    (descriptiondata &&
+                                                        descriptiondata != null &&
+                                                        descriptiondata.textvalue != undefined &&
+                                                        descriptiondata.textvalue.length > 0)
+                                                    ? `<div style="color:blue;font-size:22px;background-color:#F0F0F0;">
+                                                        ${descriptiondata.textheader &&
+                                                        descriptiondata.textheader != null &&
+                                                        descriptiondata.textheader != undefined &&
+                                                        descriptiondata.textheader.length > 0 &&
+                                                        descriptiondata.textheader != 'PRESCRIPTION'
+                                                        ? descriptiondata.textheader
+                                                        : ''
+                                                    }
+</div>`
+                                                    : ''
+                                                }
+<p style="font-weight: bold;">
+${descriptiondata.textvalue &&
+                                                    descriptiondata.textvalue != null &&
+                                                    descriptiondata.textvalue != undefined &&
+                                                    descriptiondata.textvalue.length > 0
+                                                    ? descriptiondata.textvalue
+                                                    : ''
+                                                }
+</p>
+<div>
+${descriptiondata.notes &&
+                                                    descriptiondata.notes != null &&
+                                                    descriptiondata.notes != undefined &&
+                                                    descriptiondata.notes.length > 0
+                                                    ? descriptiondata.notes
+                                                        .map(dnotesdata => {
+                                                            return `${dnotesdata.displayvalue &&
+                                                                dnotesdata.displayvalue != null &&
+                                                                dnotesdata.displayvalue != undefined &&
+                                                                dnotesdata.displayvalue.length > 0
+                                                                ? `<div style="font-size:25px;font-weight: normal;">
+<p style="border: 1px  solid black;border-radius: 25px;padding: 4px;">
+<i class="fa fa-paperclip"></i>`
+                                                                : ''
+                                                                } 
+${' '}
+${dnotesdata.displayvalue &&
+                                                                    dnotesdata.displayvalue != null &&
+                                                                    dnotesdata.displayvalue != undefined &&
+                                                                    dnotesdata.displayvalue.length > 0
+                                                                    ? dnotesdata.displayvalue
+                                                                    : ''
+                                                                }
+</p>
+</div>`;
+                                                        })
+                                                        .join('')
+                                                    : ''
+                                                }
+</div>
+<div>
+${descriptiondata.instructions &&
+                                                    descriptiondata.instructions != null &&
+                                                    descriptiondata.instructions != undefined &&
+                                                    descriptiondata.instructions.length > 0
+                                                    ? descriptiondata.instructions
+                                                        .map(dinstdata => {
+                                                            return `<div style="font-size:15px;font-weight: normal;">
+<p style="border: 1px  solid black;border-radius: 25px;padding: 4px;">
+${dinstdata.displayvalue &&
+                                                                    dinstdata.displayvalue != null &&
+                                                                    dinstdata.displayvalue != undefined &&
+                                                                    dinstdata.displayvalue.length > 0
+                                                                    ? `<i class="fa fa-thumb-tack"></i>`
+                                                                    : ''
+                                                                }
+${' '}
+${dinstdata.displayvalue &&
+                                                                    dinstdata.displayvalue != null &&
+                                                                    dinstdata.displayvalue != undefined &&
+                                                                    dinstdata.displayvalue.length > 0
+                                                                    ? dinstdata.displayvalue
+                                                                    : ''
+                                                                }
+</p>
+</div>`;
+                                                        })
+                                                        .join('')
+                                                    : ''
+                                                }
+</div>
+
+</div>`;
+                                        }
+                                    })
+                                    .join('')
+                                : ''
+                        }
+          ${fnPrescription(datas, i)}
+          ${fnPatientService(datas)}
+          ${fnDiet(datas)}
+        </div>
+
+
+
+
+        <div>
+          ${ArrayCheck(datas.eyeprescription) &&
+                            datas.eyeprescription != null &&
+                            datas.eyeprescription != undefined
+                            ? `<p style="font-size:10px;background-color:#F0F0F0;color:blue;margin-left:0px;">
+                  EYE EVALUATION
+                </p>
+    <div style=""> 
+      <p>
+        Visual Acuity
+      </p>
+      <div>
+        <div style="flex-direction: row;display: flex;">
+          <div style="width: 197px;border: 1px solid white;margin:3px;border-radius:5px;text-align: center;">
+            <div style="margin-left:1px;margin-top:5px;font-size:12px;font-weight: normal;">
+              Name
+            </div>
+          </div>
+          <div style="width: 157px;border: 1px solid white;margin:3px;border-radius:5px;text-align: center;">
+            <div style="margin-left:1px;margin-top:5px;font-size:12px;font-weight: normal;">
+              Right Eye
+            </div>
+          </div>
+          <div style="width: 157px;border: 1px solid white;margin:3px;border-radius:5px;text-align: center;">
+            <div style="margin-left:1px;margin-top:5px;font-size:12px;font-weight: normal;">
+              Left Eye
+            </div>
+          </div>
+        </div>
+        <div style="flex-direction: row;display: flex;margin-left:30px;">
+          <div style="width: 197px;border: 1px solid white;margin:3px;border-radius:5px;text-align: center;">
+            <div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: normal;">
+              Unaided/PG
+            </div>
+          </div>
+          <div style="width: 157px;border: 1px solid grey;margin:3px;border-radius:5px;text-align: center;">
+            <div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: bold;">
+              ${datas.eyeprescription[0].unaidedrighteye
+                                ? datas.eyeprescription[0].unaidedrighteye
+                                : ' '
+                            }
+            </div>
+</div>
+<div style="width: 157px;border: 1px solid grey;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: bold;">${datas.eyeprescription[0].unaidedlefteye
+                                ? datas.eyeprescription[0].unaidedlefteye
+                                : ' '
+                            }
+</div>
+</div>
+</div>
+
+
+<div style="flex-direction: row;display: flex;margin-left:30px;">
+<div style="width: 197px;border: 1px solid white;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: normal;">Pinhole</div>
+</div>
+
+<div style="width: 157px;border: 1px solid grey;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: bold;">${datas.eyeprescription[0].presentlenserighteye
+                                ? datas.eyeprescription[0].presentlenserighteye
+                                : ' '
+                            }</div>
+</div>
+<div style="width: 157px;border: 1px solid grey;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: bold;">${datas.eyeprescription[0].presentlenselefteye
+                                ? datas.eyeprescription[0].presentlenselefteye
+                                : ' '
+                            }
+</div>
+</div>
+</div>
+
+<div style="flex-direction: row;display: flex;margin-left:30px;">
+<div style="width: 197px;border: 1px solid white;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: normal;">IOP</div>
+</div>
+
+<div style="width: 157px;border: 1px solid grey;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: bold;">${datas.eyeprescription[0].ioprrighteye
+                                ? datas.eyeprescription[0].ioprrighteye
+                                : ' '
+                            }</div>
+</div>
+<div style="width: 157px;border: 1px solid grey;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: bold;">${datas.eyeprescription[0].ioplefteye
+                                ? datas.eyeprescription[0].ioplefteye
+                                : ' '
+                            }
+</div>
+</div>
+</div>
+
+<div style="flex-direction: row;display: flex;margin-left:30px;">
+<div style="width: 197px;border: 1px solid white;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: normal;">PUPIL</div>
+</div>
+
+<div style="width: 157px;border: 1px solid grey;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: bold;">${datas.eyeprescription[0].pupilrighteye
+                                ? datas.eyeprescription[0].pupilrighteye
+                                : ' '
+                            }</div>
+</div>
+<div style="width: 157px;border: 1px solid grey;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: bold;">${datas.eyeprescription[0].pupillefteye
+                                ? datas.eyeprescription[0].pupillefteye
+                                : ' '
+                            }
+</div>
+</div>
+</div>
+
+</div>
+<p>Tested</p>
+
+<div>
+
+<div style="flex-direction: row;display: flex;margin-left:30px;">
+<div style="width: 197px;border: 1px solid white;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: normal;">${' '}</div>
+</div>
+<div style="width: 157px;border: 1px solid white;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: normal;">${' '}</div>
+</div>
+<div style="width: 157px;border: 1px solid white;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: normal;">Right Eye</div>
+</div>
+<div style="width: 157px;border: 1px solid white;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: normal;">${' '}</div>
+</div>
+<div style="width: 157px;border: 1px solid white;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: normal;">${' '}</div>
+</div>
+</div>
+
+<div style="flex-direction: row;display: flex;margin-left:30px;">
+<div style="width: 197px;border: 1px solid white;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: normal;">${' '}</div>
+</div>
+<div style="width: 157px;border: 1px solid grey;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: bold;">SPH
+</div>
+</div>
+<div style="width: 157px;border: 1px solid grey;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: bold;">CYL</div>
+</div>
+<div style="width: 157px;border: 1px solid grey;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: bold;">AXIS</div>
+</div>
+<div style="width: 157px;border: 1px solid grey;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: bold;">VA</div>
+</div>
+</div>
+
+<div style="flex-direction: row;display: flex;margin-left:30px;">
+<div style="width: 197px;border: 1px solid white;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: normal;">Distance</div>
+</div>
+<div style="width: 157px;border: 1px solid grey;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: bold;">${datas.eyeprescription[0].distancersph
+                                ? datas.eyeprescription[0].distancersph
+                                : ' '
+                            }
+</div>
+</div>
+<div style="width: 157px;border: 1px solid grey;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: bold;">${datas.eyeprescription[0].distancercyl
+                                ? datas.eyeprescription[0].distancercyl
+                                : ' '
+                            }</div>
+</div>
+<div style="width: 157px;border: 1px solid grey;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: bold;">${datas.eyeprescription[0].distanceraxis
+                                ? datas.eyeprescription[0].distanceraxis
+                                : '0'
+                            }</div>
+</div>
+<div style="width: 157px;border: 1px solid grey;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: bold;">${datas.eyeprescription[0].distancerva
+                                ? datas.eyeprescription[0].distancerva
+                                : ' '
+                            }</div>
+</div>
+</div>
+
+<div style="flex-direction: row;display: flex;margin-left:30px;">
+<div style="width: 197px;border: 1px solid white;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: normal;">Near</div>
+</div>
+<div style="width: 157px;border: 1px solid grey;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: bold;">${datas.eyeprescription[0].nearrsph ? datas.eyeprescription[0].nearrsph : ' '
+                            }
+</div>
+</div>
+<div style="width: 157px;border: 1px solid grey;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: bold;">${datas.eyeprescription[0].nearrcyl ? datas.eyeprescription[0].nearrcyl : ' '
+                            }</div>
+</div>
+<div style="width: 157px;border: 1px solid grey;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: bold;">${datas.eyeprescription[0].nearraxis ? datas.eyeprescription[0].nearraxis : '0'
+                            }</div>
+</div>
+<div style="width: 157px;border: 1px solid grey;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: bold;">${datas.eyeprescription[0].nearrva ? datas.eyeprescription[0].nearrva : ' '
+                            }</div>
+</div>
+</div>
+
+</div>
+<p>${' '}</p>
+
+<div>
+
+<div style="flex-direction: row;display: flex;margin-left:30px;">
+<div style="width: 197px;border: 1px solid white;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: normal;">${' '}</div>
+</div>
+<div style="width: 157px;border: 1px solid white;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: normal;">${' '}</div>
+</div>
+<div style="width: 157px;border: 1px solid white;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: normal;">Left Eye</div>
+</div>
+<div style="width: 157px;border: 1px solid white;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: normal;">${' '}</div>
+</div>
+<div style="width: 157px;border: 1px solid white;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: normal;">${' '}</div>
+</div>
+</div>
+
+<div style="flex-direction: row;display: flex;margin-left:30px;">
+<div style="width: 197px;border: 1px solid white;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: normal;">${' '}</div>
+</div>
+<div style="width: 157px;border: 1px solid grey;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: bold;">SPH
+</div>
+</div>
+<div style="width: 157px;border: 1px solid grey;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: bold;">CYL</div>
+</div>
+<div style="width: 157px;border: 1px solid grey;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: bold;">AXIS</div>
+</div>
+<div style="width: 157px;border: 1px solid grey;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: bold;">VA</div>
+</div>
+</div>
+
+<div style="flex-direction: row;display: flex;margin-left:30px;">
+<div style="width: 197px;border: 1px solid white;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: normal;">Distance</div>
+</div>
+<div style="width: 157px;border: 1px solid grey;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: bold;">${datas.eyeprescription[0].distancelsph
+                                ? datas.eyeprescription[0].distancelsph
+                                : ' '
+                            }
+</div>
+</div>
+<div style="width: 157px;border: 1px solid grey;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: bold;">${datas.eyeprescription[0].distancelcyl
+                                ? datas.eyeprescription[0].distancelcyl
+                                : ' '
+                            }</div>
+</div>
+<div style="width: 157px;border: 1px solid grey;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: bold;">${datas.eyeprescription[0].distancelaxis
+                                ? datas.eyeprescription[0].distancelaxis
+                                : '0'
+                            }</div>
+</div>
+<div style="width: 157px;border: 1px solid grey;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: bold;">${datas.eyeprescription[0].distancelva
+                                ? datas.eyeprescription[0].distancelva
+                                : ' '
+                            }</div>
+</div>
+</div>
+
+<div style="flex-direction: row;display: flex;margin-left:30px;">
+<div style="width: 197px;border: 1px solid white;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: normal;">Near</div>
+</div>
+<div style="width: 157px;border: 1px solid grey;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: bold;">${datas.eyeprescription[0].nearlsph ? datas.eyeprescription[0].nearlsph : ' '
+                            }
+</div>
+</div>
+<div style="width: 157px;border: 1px solid grey;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: bold;">${datas.eyeprescription[0].nearlcyl ? datas.eyeprescription[0].nearlcyl : ' '
+                            }</div>
+</div>
+<div style="width: 157px;border: 1px solid grey;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: bold;">${datas.eyeprescription[0].nearlaxis ? datas.eyeprescription[0].nearlaxis : '0'
+                            }</div>
+</div>
+<div style="width: 157px;border: 1px solid grey;margin:3px;border-radius:5px;text-align: center;">
+<div style="margin-left:1px;margin-top:5px;font-size:20px;font-weight: bold;">${datas.eyeprescription[0].nearlva ? datas.eyeprescription[0].nearlva : ' '
+                            }</div>
+</div>
+</div>
+
+
+
+
+</div>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+<p>Eye Examination</p>
+<p>Left Eye- ${datas.eyeprescription[0].eyeexaminationlefteye}</p>
+<p>Right Eye- ${datas.eyeprescription[0].eyeexaminationrighteye}</p>
+
+
+
+
+</div>
+                  `
+                            : ''
+                        }
+        </div>
+      `;
+                }).join('') : ''}`)
+    }
+
+
+    var contentData = `
+      <html>
+        <head>
+          <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.1/css/all.min.css" integrity="sha512-MV7K8+y+gLIBoVD59lQIYicR65iaqukzvf/nwasF0nqhPay5w/9lJmVM2hMDcnK1OnMGCdVK+iQrJ7lzPJQd1w==" crossorigin="anonymous" referrerpolicy="no-referrer" />
+          <title>
+            Bootstrap Example
+          </title>
+        </head>
+        <body>
+          <div>
+          ${fnMainMap()}
+          </div>
+        </body>
+     </html>`;
+
+    return (
+        <CContainerView>
+            <HeaderBlock style={{ marginBottom: normalize(30) }}
+                navigation={props.navigation} backhandler={false} />
+            <CDetailView>
+                <View androidHardwareAccelerationDisabled
+                    style={{
+                        flex: 1,
+                        backgroundColor: 'white',
+                        borderColor: 'black',
+                    }}>
+
+                    {pdfdata && pdfdata != null && pdfdata != undefined ? (
+                        <WebView
+                            ref={webviewRef}
+                            androidHardwareAccelerationDisabled
+                            style={{ opacity: 0.99 }}
+                            mixedContentMode="compatibility"
+                            source={{ html: contentData }}
+                        />
+                    )
+                        : null}
+                </View>
+            </CDetailView>
+        </CContainerView>
+    );
+
+    function getImageFromString(value) {
+        // console.log("STRINGGGGGGGGGGGGGGGGG", JSON.stringify(value))
+        var fields = value.split('@');
+        var imageString = fields[1];
+        return imageString
+    }
+
+    function getString(value) {
+        // console.log("STRINGGGGGGGGGGGGGGGGG", JSON.stringify(value))
+        var fields = value.split('@');
+        var imageString = fields[0];
+        return imageString
+    }
+};
+
+export default SwipeLeftView;