<!DOCTYPE html>
<html lang="en">

<head>

	<!-- html2pdf CDN-->
	<script src=
"https://cdnjs.cloudflare.com/ajax/libs/html2pdf.js/0.9.2/html2pdf.bundle.js">
	</script>
   

	<style>
    
		.container {
			position : absolute;
			top: 20%;
			left: 28%;
			margin-top: -65px;
			margin-left: -100px;
			border-radius: 7px;
            
		}

		.card {
			box-sizing: content-box;
			width: 750px;
			height: fit-content;
			padding: 30px;
			border: 1px solid black;
			font-style: sans-serif;
			background-color: #f0f0f0;
		}

		#button {
			background-color: #4caf50;
			border-radius: 5px;
			margin-left: 650px;
			margin-bottom: 5px;
			color: white;
		}
        #GHRCE{
            margin : 0px;
            text-align: center;
        }
        #auton{
            margin: 0%;
            text-align: center;
        }
        #dual{
            margin: 0%;
            text-align: center;
        }
        #crpf{
            margin: 0%;
            text-align: center;
        }
        span{
            margin-right: 15px;
        }
        #date{
            margin-left: 500px;
        }
        #clearance{
            text-align: center;
        }
        #udet{
            justify-content:space-between;
            font-weight: lighter;
            font-family:'Times New Roman', Times, serif;
            font-style: normal
            
            
        }
        .details{
            letter-spacing: 1px;
            line-height: 25px;
            text-align: center;
        }
        .tg{
            margin-left: 30px;
        }
        #sign{
            margin-left: 500px;
        }
        img{
            
            margin-left: 340px;
        }
       

	</style>
</head>

<body>
    
	<div class="container">
		<button id="button">Download PDF</button>
		<div class="card" id="makepdf">
			<div class = "heading">
                <img src="../images/logo.png" alt="LOGO">
                <h2 id = "GHRCE">G.H. RAISONI COLLEGE OF ENGINEERING</h2>
                <h5 id ="auton">(An Autonomous Institute affiliated to RashtrasantTukdojiMaharaj Nagpur University , Nagpur)</h5>
                <h5 id ="dual">Dual Accreditations NAAC "A+" Grade& NBA (Tier-1)</h5>
                <h5 id ="crpf">CRPF Fate No. 3 , Hingna Road , Digdoh Hills , Nagpur - 440016 (INDIA)</h5>
                <span>Phone : +91 9604787184 , 9689903286</span>
                <span>Email : principal.ghrce@raisoni.net</span>
                <span>Web : ghrce.raisoni.net</span>
                <hr>
            </div>

            <div class="student">
              <span id="date">Date: <%= new Date().toLocaleDateString('en-GB') %></span>
              <h3 id="clearance">STUDENT CLEARANCE CERTIFICATE</h3>
            </div>

            <div class = "details">
                <h4 id = "udet"> Mr/Ms <%= status.Name %> was a student of IV <%= status.Name %>  Section <%= status.Section %> Roll No <%= status.Roll_Number %> Registration Number <%= status.Registration_Number %> Mobile Number <%= status.Mobile_Number %> and Appeared for <%= status.Year %> examination . No Dues against him / her are as per following</h4>
            </div>
            <style type="text/css">
                .tg  {border-collapse:collapse;border-spacing:0;}
                .tg td{border-color:black;border-style:solid;border-width:1px;font-family:Arial, sans-serif;font-size:14px;
                  overflow:hidden;padding:10px 5px;word-break:normal;}
                .tg th{border-color:black;border-style:solid;border-width:1px;font-family:Arial, sans-serif;font-size:14px;
                  font-weight:normal;overflow:hidden;padding:10px 5px;word-break:normal;}
                .tg .tg-0pky{border-color:inherit;text-align:left;vertical-align:top;width:50px;height:30px}
                .tg .tg-0lax{text-align:left;vertical-align:top;width :300px;height:50px}
                </style>
                <table class="tg">
                <thead>
                  <tr>
                    <th class="tg-0pky">Sr.No</th>
                    <th class="tg-0lax">Department</th>
                    <th class="tg-0lax">Signature</th>
                  </tr>
                </thead>
                <tbody>
                  <tr>
                    <td class="tg-0pky">1</td>
                    <td class="tg-0lax">Department HOD</td>
                    <td>
                      <% if (status.HOD_Verified === 1) { %>
                        <img height="40" width="40" src="../images/ver.webp" alt="Verified">
                      <% } else { %>
                        Unverified
                      <% } %>
                    </td>
                  </tr>
                  <tr>
                    <td class="tg-0pky">2</td>
                    <td class="tg-0lax">Project Report Submitted</td>
                    <td>
                      <% if (status.Project_Verified === 1) { %>
                        <img height="40" width="40" src="../images/ver.webp" alt="Verified">
                      <% } else { %>
                        Unverified
                      <% } %>
                    </td>
                  </tr>
                  <tr>
                    <td class="tg-0pky">3</td>
                    <td class="tg-0lax">Internship Report Submitted</td>
                    <td>
                      <% if (status.Internship_Verified === 1) { %>
                        <img height="40" width="40" src="../images/ver.webp" alt="Verified">
                      <% } else { %>
                        Unverified
                      <% } %>
                    </td>
                  </tr>
                  <tr>
                    <td class="tg-0pky">4</td>
                    <td>Accounts Verified:</td>
                    <td>
                      <% if (status.Accounts_Verified === 1) { %>
                        <img height="40" width="40" src="../images/ver.webp" alt="Verified">
                      <% } else { %>
                        Unverified
                      <% } %>
                    </td>
                  </tr>
                  <tr>
                    <td class="tg-0pky">5</td>
                    <td class="tg-0lax">Library Department</td>
                    <td>
                      <% if (status.Library_Verified === 1) { %>
                        <img height="40" width="40" src="../images/ver.webp" alt="Verified">
                      <% } else { %>
                        Unverified
                      <% } %>
                    </td>
                  </tr>
                  <tr>
                    <td class="tg-0pky">6</td>
                    <td class="tg-0lax">Training and Placement Department</td>
                    <td>
                      <% if (status['Training_And_Placement Verified'] === 1) { %>
                        <img height="40" width="40" src="../images/ver.webp" alt="Verified">
                      <% } else { %>
                        Unverified
                      <% } %>
                    </td>
                  </tr>
                  <tr>
                    <td class="tg-0pky">7</td>
                    <td class="tg-0lax">Alumni Cell</td>
                    <td>
                      <% if (status.Alumni_Cell_Verified === 1) { %>
                        <img height="40" width="40" src="../images/ver.webp" alt="Verified">
                      <% } else { %>
                        Unverified
                      <% } %>
                    </td>
                  </tr>
                </tbody>
                </table>
                <br>
                <br>
                <br>
                <br>
                <span id = "sign">Student Signature</span>
		</div>
	</div>
</body>

<script>
	var button = document.getElementById("button");
	var makepdf = document.getElementById("makepdf");

    button.addEventListener("click", function () {
            html2pdf().from(makepdf).save();
        });


   
</script>

</html>
