IMMREX7
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>School MIS</title>
<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
<meta name="csrf-token" content="{{ csrf_token() }}">
<link rel="stylesheet" href="https://online-login.online/plugins/bootstrap/css/bootstrap.min.css">
<style type="text/css">
@import url('https://fonts.googleapis.com/css?family=Montserrat:400,700&display=swap');
* {
margin: 0;
padding: 0;
box-sizing: border-box;
list-style: none;
font-family: 'Montserrat', sans-serif
}
body{
background-color:#3ba8d5;
}
.container {
margin: 20px auto;
width: 800px;
padding: 30px
}
.card.box1 {
width: 350px;
background-color: #3ba8d5;
color: #ffffff;
border-radius: 0
}
.card.box2 {
width: 450px;
height: 580px;
background-color: #ffffff;
border-radius: 0
}
.text {
font-size: 13px
}
.box2 .btn.btn-primary.bar {
width: 20px;
background-color: transparent;
border: none;
color: #3ba8d5;
}
.box2 .btn.btn-primary.bar:hover {
color: #ffffff;
}
.box1 .btn.btn-primary {
background-color: #57c97d;
width: 45px;
height: 45px;
display: flex;
justify-content: center;
align-items: center;
border: 1px solid #ddd
}
.box1 .btn.btn-primary:hover {
background-color: #f6f8f7;
color: #57c97d
}
.btn.btn-success {
width: 40px;
height: 40px;
border-radius: 50%;
background-color: #ddd;
color: black;
display: flex;
justify-content: center;
align-items: center;
border: none
}
.nav.nav-tabs {
border: none;
border-bottom: 2px solid #ddd
}
.nav.nav-tabs .nav-item .nav-link {
border: none;
color: black;
border-bottom: 2px solid transparent;
font-size: 14px
}
.nav.nav-tabs .nav-item .nav-link:hover {
border-bottom: 2px solid #3ecc6d;
color: #05cf48
}
.nav.nav-tabs .nav-item .nav-link.active {
border: none;
border-bottom: 2px solid #3ecc6d
}
.form-control {
border: none;
border-bottom: 1px solid #ddd;
box-shadow: none;
height: 20px;
font-weight: 600;
font-size: 14px;
padding: 15px 0px;
letter-spacing: 1.5px;
border-radius: 0
}
.inputWithIcon {
position: relative
}
img {
width: 50px;
height: 20px;
object-fit: cover
}
.inputWithIcon span {
position: absolute;
right: 0px;
bottom: 9px;
color: #57c97d;
cursor: pointer;
transition: 0.3s;
font-size: 14px
}
.form-control:focus {
box-shadow: none;
border-bottom: 1px solid #ddd
}
.btn-outline-primary {
color: black;
background-color: #ddd;
border: 1px solid #ddd
}
.btn-outline-primary:hover {
background-color: #05cf48;
border: 1px solid #ddd
}
.btn-check:active+.btn-outline-primary,
.btn-check:checked+.btn-outline-primary,
.btn-outline-primary.active,
.btn-outline-primary.dropdown-toggle.show,
.btn-outline-primary:active {
color: #baf0c3;
background-color: #3ecc6d;
box-shadow: none;
border: 1px solid #ddd
}
.btn-group>.btn-group:not(:last-child)>.btn,
.btn-group>.btn:not(:last-child):not(.dropdown-toggle),
.btn-group>.btn-group:not(:first-child)>.btn,
.btn-group>.btn:nth-child(n+3),
.btn-group>:not(.btn-check)+.btn {
border-radius: 50px;
margin-right: 20px
}
form {
font-size: 14px
}
form .btn.btn-primary {
width: 100%;
height: 45px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
background-color: #3ecc6d;
border: 1px solid #ddd
}
form .btn.btn-primary:hover {
background-color: #05cf48
}
@media (max-width:750px) {
.container {
padding: 10px;
width: 100%
}
.text-green {
font-size: 14px
}
.card.box1,
.card.box2 {
width: 100%
}
.nav.nav-tabs .nav-item .nav-link {
font-size: 12px
}
}
.form-control:disabled, .form-control[readonly] {
background-color: #ffffff;
opacity: 1;
}
</style>
</head>
<body>
<div class="container bg-light d-md-flex align-items-center">
<div class="card box1 shadow-sm p-md-5 p-md-5 p-4">
<strong style="font-size:22px;">{{$school->schoolName}}</strong><br>
<div class="fw-bolder mb-4">Total Amount : <span class="ps-3"><b>₹{{$order->order_amount}}</b></span></div>
<div class="d-flex flex-column">
<div class="border-bottom mb-4"></div>
<div class="d-flex flex-column mb-4"> <span class="far fa-file-alt text"><span class="ps-2">Transaction ID:</span></span> <span class="ps-3">PREONL{{$order->idOrder}}</span> </div>
<div class="d-flex flex-column mb-1"> <span class="far fa-calendar-alt text"><span class="ps-2">Payment For :</span></span>
@if($order->type == "Shop")
<span class="ps-3"></span>
Shop
</div>
@else
<span class="ps-3"></span>
School Fees
</div>
@endif
</div>
</div>
<div class="card box2 shadow-sm">
<div class="d-flex align-items-center justify-content-between p-md-5 p-4">
<span class="h5 fw-bold m-0">Student Details</span>
<div class="btn btn-primary bar"><span class="fas fa-bars"></span></div>
</div>
<div class="row">
<div class="col-12">
<div class="d-flex flex-column px-md-5 px-4 mb-4">
<span>Student Name</span>
<div class="inputWithIcon"> <input class="form-control" type="text" value="{{$student->firstName}} {{$student->middleName}} {{$student->lastName}}" readonly> <span class=""> <img src="{{ asset('storage/schools/'.$school->idSchool.'/'.$school->schoolLogo)}}" alt=""></span> </div>
</div>
</div>
<div class="col-md-6">
<div class="d-flex flex-column ps-md-5 px-md-0 px-4 mb-4">
<span>Father <span class="ps-1">Name</span></span>
<div class="inputWithIcon"> <input type="text" class="form-control" value="{{$student->father_fname}} {{$student->father_lname or ''}}" readonly> <span class="fas fa-calendar-alt"></span> </div>
</div>
</div>
<div class="col-md-6">
<div class="d-flex flex-column pe-md-5 px-md-0 px-4 mb-4">
<span>Class-Section</span>
<div class="inputWithIcon"> <input type="text" class="form-control" value="{{$student->classM->className}} {{$student->section->sectionName}}" readonly> <span class="fas fa-lock"></span> </div>
</div>
</div>
<div class="col-12">
<div class="d-flex flex-column px-md-5 px-4 mb-4">
<span>EC No.</span>
<div class="inputWithIcon"> <input class="form-control text-uppercase" type="text" value="{{$student->ecNo}}" readonly> <span class="far fa-user"></span> </div>
</div>
</div>
<div class="col-12">
<div class="d-flex flex-column px-md-5 px-4 mb-4">
<span>Mobile No.</span>
<div class="inputWithIcon"> <input class="form-control text-uppercase" type="text" value="{{$student->father_mobile}}" readonly> <span class="far fa-user"></span> </div>
</div>
</div>
<div class="col-12 px-md-5 px-4 mt-3">
<button class="btn btn-primary w-100" id="ebz-checkout-btn">Pay ₹{{$order->order_amount}}</button>
</div>
</div>
</div>
</div>
<script
src="https://code.jquery.com/jquery-2.2.4.min.js"
integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44="
crossorigin="anonymous"></script>
<script src="https://ebz-static.s3.ap-south-1.amazonaws.com/easecheckout/v2.0.0/easebuzz-checkout-v2.min.js"></script>
<script>
var easebuzzCheckout = new EasebuzzCheckout('{{$keyService->key_value}}', 'prod') // for test enviroment pass "test"
document.getElementById('ebz-checkout-btn').onclick = function(e){
var options = {
access_key: '{{$order->order_id}}', // access key received via Initiate Payment
onResponse: (response) => {
console.log(response);
if (response.hasOwnProperty("status")){
if (response.status == "success") {
$.ajax({
url: "{!!url('payment-link-status?order_id=')!!}" + response.txnid,
success: function(result) {
window.location.href = "{{url('payment-link-success?paid=Y')}}";
},
});
}
}
if (response.hasOwnProperty("error")){
if(response.error){
if (response.hasOwnProperty("error_Message")){
alert(response.error_Message);
}else
alert(response.message);
}
}
},
theme: "#123456" // color hex
}
easebuzzCheckout.initiatePayment(options);
};
$(function(){
})
</script>
</body>
</html>
Copyright © 2021 -