File: /home/imensosw/www/imenso.co/dev/lavender/booking-details.php
<!doctype html>
<html lang="en-US" >
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="profile" href="http://gmpg.org/xfn/11">
<title>Lavender Medical</title>
<link rel='stylesheet' href='css/bootstrap.min.css' media='all' />
<link rel='stylesheet' href='css/style.css' media='all' />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css" media="all">
<link href="https://fonts.googleapis.com/css2?family=Sen:wght@400;700;800&display=swap" rel="stylesheet">
</head>
<body>
<?php include('header.php'); ?>
<section class="b-burger">
<div class="container">
<h1 class="date-scroll pt-4"> <a href="bookings.php"><i class="fa fa-long-arrow-left smbtn"></i> <strong>Back</strong></a></h1>
<form>
<div class="row pt-4">
<div class="col-lg-8">
<div class="d-card">
<h4>Basic Details</h4>
<div class="form-group">
<label>Hospital Name</label>
<select class="chosen-select">
<option>Bupa Cromwell</option>
<option>Hillsborough Clinic</option>
<option>Freeman Hospital</option>
<option>Bupa Cromwell</option>
</select>
</div>
<div class="form-group">
<div class="info">
<div class="info-left">
<strong>John Wick </strong> <a href="javascript:;" data-toggle="modal" data-target="#infoHospital" class="ml-3"><small><i class="fa fa-pencil mr-2" title="Edit Info"></i>Edit</small></a><br>
<small>Location: 45 East Block NY</small><br>
<small>Email: johnwich@bupa.com</small><br>
<small>Phone: 9988776655</small>
</div>
</div>
</div>
<div class="form-group">
<label>Operation Name</label>
<select class="chosen-select">
<option>Select</option>
<option>Appendectomy</option>
<option>C-Section</option>
<option>Heart Bypass Surgery</option>
<option><a href="#" class="btn sml-btn">Add New</a></option>
</select>
</div>
<div class="form-group">
<label>PO Number</label>
<input type="" class="form-control" name="">
</div>
</div>
<div class="d-card mt-4">
<h4>Purchase/Hire Details</h4>
<div class="form-row">
<div class="form-group col-4">
<div class="d-flex align-items-end">
<div>
<label >Delivery date</label>
<input id="datepicker" value="3/9/2022"/>
</div>
<div>
<select class="chosen-select">
<option>Slot</option>
<option>Pre 9AM</option>
<option>Pre 10AM</option>
<option>Pre 12</option>
</select>
</div>
</div>
</div>
<div class="form-group col-4">
<div class="d-flex align-items-end">
<div>
<label >Operation date</label>
<input id="datepicker2" value="3/9/2022"/>
</div>
<div>
<select class="chosen-select">
<option>Slot</option>
<option>AM</option>
<option>PM</option>
<option>TBD</option>
</select>
</div>
</div>
</div>
<div class="form-group col-4">
<label>Collection date</label>
<input id="datepicker3" value="3/13/2022" />
</div>
</div>
<div class="form-group">
<label>Select Kit</label>
<select class="chosen-select">
<option>Select</option>
<option>RTS MTP Implant</option>
<option>Lesser Toe</option>
<option>I2B Staple</option>
</select>
</div>
<div class="mt-4">
<table class="table">
<tbody>
<tr>
<td>
<div class="mb-2">
<strong><a href="javascript:;" data-toggle="modal" data-target="#kitDetails">RTS MTP implant - Set 01</a></strong></div>
<!-- <a href="javascript:;" onclick="$('#avl1').toggle();" class="sml-btn mt-2">Check Availability</a> -->
<span class="capsule red-dim">Not Available</span>
</td>
<td><label>Hire Charge</label><input type="text" class="form-control" style="width: 120px;" name="" placeholder="£"></td>
<td class="text-right">
<a href="javascript:;" onclick="$('#added').toggle(); $('.addnow').hide()" class="btn btn-primary addnow"><i class="fa fa-plus"></i> Add</a>
<div id="added" style="display: none;"><font style="color:green;"> <i class="fa fa-check"></i> Added </font> <a href="javascript:" class="ml-3" onclick="$('.addnow').show(); $('#added').hide();"> <i class="fa fa-trash"></i></a></div>
</td>
</tr>
<!-- <tr>
<td colspan="4" style="border: none;">
<div id="avl1" class="table-chart-sml" style="display: none;">
<table id="main-table" class="main-table">
<thead>
<tr>
<td colspan="17" class="text-center">
<div class="mnth-srl">
<i class="fa fa-chevron-left"></i>
<span>April 2022</span>
<i class="fa fa-chevron-right"></i>
</div>
</td>
</tr>
<tr>
<th scope="col">1 Fri</th>
<th scope="col">2 Sat</th>
<th scope="col">3 Sun</th>
<th scope="col" class="tdy">4 Mon</th>
<th scope="col">5 Tue</th>
<th scope="col">6 Wed</th>
<th scope="col">7 Thu</th>
<th scope="col">8 Fri</th>
<th scope="col">9 Sat</th>
<th scope="col">10 Sun</th>
<th scope="col">11 Mon</th>
<th scope="col">12 Tue</th>
<th scope="col">13 Wed</th>
<th scope="col">14 Thu</th>
<th scope="col">15 Fri</th>
<th scope="col">16 Sat</th>
<th scope="col">17 Sun</th>
</tr>
</thead>
<tbody>
<tr class="kit-row">
<td class="albl" data-toggle="tooltip" data-placement="top" title="" data-original-title="Available">
</td>
<td class="albl" data-toggle="tooltip" data-placement="top" title="" data-original-title="Available">
</td>
<td class="tbr" data-toggle="tooltip" data-placement="top" title="" data-original-title="To be replenished"></td>
<td class="bkd" data-toggle="tooltip" data-placement="top" title="" data-original-title="Booked"></td>
<td class="bkd" data-toggle="tooltip" data-placement="top" title="" data-original-title="Booked"></td>
<td class="dbkd" data-toggle="tooltip" data-placement="top" title="" data-original-title="Double Booked"></td>
<td class="csnmt" data-toggle="tooltip" data-placement="top" title="" data-original-title="Consignment"></td>
<td class="cmgtd"></td>
<td class="stwrng" data-toggle="tooltip" data-placement="top" title="" data-original-title="Something Wrong"></td>
<td class="albl" data-toggle="tooltip" data-placement="top" title="" data-original-title="Available"></td>
<td class="albl" data-toggle="tooltip" data-placement="top" title="" data-original-title="Available"></td>
<td class="albl" data-toggle="tooltip" data-placement="top" title="" data-original-title="Available"></td>
<td class="albl data-toggle="tooltip" data-placement="top" title="" data-original-title="Available"></td>
<td class="albl" data-toggle="tooltip" data-placement="top" title="" data-original-title="Available"></td>
<td class="albl" data-toggle="tooltip" data-placement="top" title="" data-original-title="Available"></td>
<td class="albl" data-toggle="tooltip" data-placement="top" title="" data-original-title="Available"></td>
<td class="albl" data-toggle="tooltip" data-placement="top" title="" data-original-title="Available"></td>
</tr>
</tbody>
</table>
</div>
</td>
</tr> -->
<tr>
<td>
<div class="mb-2"><strong><a class="" href="javascript:;" data-toggle="modal" data-target="#kitDetails">RTS MTP implant - Set 02</a></strong></div>
<span class="capsule green-dim">Available</span>
<!-- <a href="javascript:;" onclick="$('#avl2').toggle();" class="sml-btn mt-2">Check Availability</a> -->
</td>
<td><label>Hire Charge</label><input type="text" class="form-control" style="width: 120px;" name="" placeholder="£"></td>
<td class="text-right">
<a href="javascript:;" onclick="$('#added2').show(); $('.addnow2').hide()" class="btn btn-primary addnow2"><i class="fa fa-plus"></i> Add</a>
<div id="added2" style="display: none;"><font style="color:green;"> <i class="fa fa-check"></i> Added
</font> <a href="javascript:;" class="ml-3" onclick="$('.addnow2').show(); $('#added2').hide();"> <i class="fa fa-trash"></i></a></div>
</td>
</tr>
<!-- <tr>
<td colspan="4" style="border: none;">
<div id="avl2" class="table-chart-sml" style="display: none;">
<table id="main-table" class="main-table">
<thead>
<tr>
<td colspan="17" class="text-center">
<div class="mnth-srl">
<i class="fa fa-chevron-left"></i>
<span>April 2022</span>
<i class="fa fa-chevron-right"></i>
</div>
</td>
</tr>
<tr>
<th scope="col">1 Fri</th>
<th scope="col">2 Sat</th>
<th scope="col">3 Sun</th>
<th scope="col" class="tdy">4 Mon</th>
<th scope="col">5 Tue</th>
<th scope="col">6 Wed</th>
<th scope="col">7 Thu</th>
<th scope="col">8 Fri</th>
<th scope="col">9 Sat</th>
<th scope="col">10 Sun</th>
<th scope="col">11 Mon</th>
<th scope="col">12 Tue</th>
<th scope="col">13 Wed</th>
<th scope="col">14 Thu</th>
<th scope="col">15 Fri</th>
<th scope="col">16 Sat</th>
<th scope="col">17 Sun</th>
</tr>
</thead>
<tbody>
<tr class="kit-row">
<td class="albl" data-toggle="tooltip" data-placement="top" title="" data-original-title="Available">
</td>
<td class="albl" data-toggle="tooltip" data-placement="top" title="" data-original-title="Available">
</td>
<td class="tbr" data-toggle="tooltip" data-placement="top" title="" data-original-title="To be replenished"></td>
<td class="bkd" data-toggle="tooltip" data-placement="top" title="" data-original-title="Booked"></td>
<td class="bkd" data-toggle="tooltip" data-placement="top" title="" data-original-title="Booked"></td>
<td class="dbkd" data-toggle="tooltip" data-placement="top" title="" data-original-title="Double Booked"></td>
<td class="csnmt" data-toggle="tooltip" data-placement="top" title="" data-original-title="Consignment"></td>
<td class="cmgtd"></td>
<td class="stwrng" data-toggle="tooltip" data-placement="top" title="" data-original-title="Something Wrong"></td>
<td class="albl" data-toggle="tooltip" data-placement="top" title="" data-original-title="Available"></td>
<td class="albl" data-toggle="tooltip" data-placement="top" title="" data-original-title="Available"></td>
<td class="albl" data-toggle="tooltip" data-placement="top" title="" data-original-title="Available"></td>
<td class="albl data-toggle="tooltip" data-placement="top" title="" data-original-title="Available"></td>
<td class="albl" data-toggle="tooltip" data-placement="top" title="" data-original-title="Available"></td>
<td class="albl" data-toggle="tooltip" data-placement="top" title="" data-original-title="Available"></td>
<td class="albl" data-toggle="tooltip" data-placement="top" title="" data-original-title="Available"></td>
<td class="albl" data-toggle="tooltip" data-placement="top" title="" data-original-title="Available"></td>
</tr>
</tbody>
</table>
</div>
</td>
</tr> -->
</tbody>
</table>
</div>
</div>
</div>
<div class="col-lg-4">
<div class="d-card">
<h4>Charges</h4>
<div class="form-group">
<label>Shipping Charge</label>
<input id="" type="text" class="form-control" value="" />
</div>
</div>
<div class="d-card mt-4">
<h4>Booked By</h4>
<div class="form-group">
<label>Assigned Rep</label>
<select class="chosen-select">
<option>Select</option>
<option>James Clear</option>
<option>Robbin Hood</option>
<option>John Doe</option>
</select>
</div>
<div class="form-group">
<label>Additional Reps</label>
<select class="chosen-select" multiple>
<option>Select</option>
<option>James Clear</option>
<option>Robbin Hood</option>
<option>John Doe</option>
</select>
</div>
</div>
<div class="d-card mt-4">
<h4>Additional Notes</h4>
<div class="form-group">
<textarea class="form-control" rows="4"></textarea>
</div>
</div>
<div class="mt-5 text-right">
<a href="kits.php" class="btn btn-secondary mr-2">Cancel</a>
<a href="kits.php" class="btn btn-primary">Save Changes</a>
</div>
</form>
</div>
</div><!--/row-->
</div>
</section>
<!-- Hospital Info Modal -->
<div class="modal fade bigModal" id="infoHospital" tabindex="-1" role="dialog" aria-labelledby="" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="">Hospital Info</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<form class="row">
<div class="col-lg-6">
<div class="form-group">
<label>Switch Board Phone Number</label>
<input type="" class="form-control" name="" value="9988776655">
</div>
<div class="form-group">
<label>Contact Person Name</label>
<input type="" class="form-control" name="" value="John Wich">
</div>
<div class="form-group">
<label>Contact Person Phone Number</label>
<input type="" class="form-control" name="" value="9977885522">
</div>
<div class="form-group">
<label>Email Address</label>
<input type="" class="form-control" name="" value="johnwich@buba.com">
</div>
</div>
<div class="col-lg-6">
<div class="form-group">
<label>Default Hospital Address</label>
<textarea class="form-control" name="" rows="2" value="">45 East Block NY</textarea>
<a href="" class="sml-btn mt-3"><i class="fa fa-plus"></i> Add More Address</a>
</div>
<div class="form-group">
<label>Default Hospital Department</label>
<input type="" class="form-control" name="" value="OPD">
<a href="" class="sml-btn mt-3"><i class="fa fa-plus"></i> Add More Department</a>
</div>
</div>
</form>
</div>
<div class="modal-footer">
<a href="" class="btn btn-secondary" data-dismiss="modal">Cancel</a>
<a href="" class="btn btn-primary">Submit</a>
</div>
</div>
</div>
</div>
<!-- Kit Details Modal -->
<div class="modal fade bigModal" id="kitDetails" tabindex="-1" role="dialog" aria-labelledby="" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="">Kit Details</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<table class="table">
<thead>
<tr>
<th>Product Code</th>
<th>Product Name</th>
<th>Qty</th>
</tr>
</thead>
<tbody>
<tr>
<td>M04 S0001</td>
<td>RTS Lesser MTP Instrument Kit - Size 1-3</td>
<td>2</td>
</tr>
<tr>
<td>M04 S0001</td>
<td>RTS Lesser MTP Implant Size 1</td>
<td>1</td>
</tr>
<tr>
<td>M04 S0001</td>
<td>RTS Lesser MTP Instrument Kit - Size 1-3</td>
<td>2</td>
</tr>
</tbody>
</table>
</div>
<div class="modal-footer">
<a href="" class="btn btn-secondary" data-dismiss="modal">Close</a>
</div>
</div>
</div>
</div>
<?php include("footer.php");?>
<script>
$(function(){
setTimeout(function(){
$('.nav-item').removeClass('active');
$('.nav-item').eq(2).addClass('active');
},100);
});
</script>
</body>
</html>