qr code base.html

<!DOCTYPE html>
<html>
   <head>
         <meta charset="utf-8">
         <meta name="viewport" content="width=device-width, intial-scale=1">
         <title>Patient report</title>
   </head>
   <body>
   <h1>Patient report</h1>
    <h2> Patient name</h2>
    <h2>Doctor name</h2>
    <h2>Date</h2>
    <h2>Previous visit date</h2>
    <h2>Prescription<h2>

      <b>Patient details</b>


        </body>
      </html>
<script src="qr code scanner/node_modules/html5-qrcode/html5-qrcode.min.js"></script>
<style>
    .result{
        background-color: green;
        color:#fff;
        padding:20px;
    }
    .row{
        display:flex;
    }
</style>


<div class="row">
    <div class="col">
        <div style="width:500px;" id="reader"></div>
    </div>
    <div class="col" style="padding:30px;">
        <h4>SCAN RESULT</h4>
        <div id="result">Result Here</div>
    </div>
</div>


<script type="text/javascript">
function onScanSuccess(qrCodeMessage) {
        document.getElementById('result').innerHTML = '<span class="result">'+qrCodeMessage+'</span>';
}

function onScanError(errorMessage) {
    //handle scan error
}

var html5QrcodeScanner = new Html5QrcodeScanner(
        "reader", { fps: 10, qrbox: 250 });
html5QrcodeScanner.render(onScanSuccess, onScanError);

</script>
