Scribd
Upload
3 views41 pages

All Code File

The document is a PHP-based web page for booking entry that includes various sections for inputting details such as LR details, party invoice details, product details, and freight & GST details. It features a user interface with buttons for actions like adding, editing, and deleting entries, as well as modals for creating cities and managing product information. The layout is styled using CSS for a clean and organized presentation.

Uploaded by

Prafulla Kinkar
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
3 views41 pages

All Code File

The document is a PHP-based web page for booking entry that includes various sections for inputting details such as LR details, party invoice details, product details, and freight & GST details. It features a user interface with buttons for actions like adding, editing, and deleting entries, as well as modals for creating cities and managing product information. The layout is styled using CSS for a clean and organized presentation.

Uploaded by

Prafulla Kinkar
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd

Index.

php

<?php require_once __DIR__ . '/[Link]'; ?>

<!DOCTYPE html>

<html>

<head>

<title>Booking Entry</title>

<style>

body{

margin:0;

font-family: Arial, Helvetica, sans-serif;

background:#eef1f7;

.page-container{

width:98%;

margin:15px auto;

/* Top Buttons */

.action-buttons{

text-align:right;

margin-bottom:10px;

.btn{

padding:6px 12px;

border:none;

border-radius:3px;
font-size:12px;

cursor:pointer;

margin-left:5px;

color:#fff;

.btn-new{background:#00a65a;}

.btn-edit{background:#f39c12;}

.btn-delete{background:#dd4b39;}

.btn-show{background:#00c0ef;}

.btn-print{background:#605ca8;}

.btn-mail{background:#3c8dbc;}

.btn-add{background:#2e86c1;color:#fff;}

h2{ margin:10px 0; }

/* Section Box */

.form-box{

background:#e6e6e6;

padding:25px;

margin-bottom:20px;

border-radius:6px;

position:relative;

/* Red Title Badge */

.form-box h4{

display:inline-block;

background:red;
color:#fff;

padding:4px 15px;

border-radius:15px;

font-size:13px;

position:absolute;

top:-12px;

.form-box:before{

content:'';

display:block;

height:2px;

background:#bdbdbd;

margin-bottom:15px;

/* Grid */

.grid{

display:grid;

grid-template-columns: repeat(4, 1fr);

gap:15px 25px;

margin-top:15px;

label{

font-size:12px;

font-weight:bold;

display:block;
margin-bottom:5px;

color:#333;

input, select{

width:100%;

padding:7px;

border:1px solid #c0c4c8;

border-radius:3px;

background:#f9fafb;

font-size:12px;

input:focus, select:focus{

border-color:black;

background:yellow;

/* Table */

.table-box{

overflow:auto;

margin-top:15px;

table{

width:100%;

border-collapse:collapse;

font-size:12px;

}
th{

background:#f4f4f4;

padding:6px;

border:1px solid #ccc;

td{

border:1px solid #ccc;

td input, td select{

border:none;

padding:6px;

font-size:12px;

/* Bottom Buttons */

.bottom-actions{

text-align:center;

margin:25px 0;

.bottom-actions button{

padding:8px 25px;

margin:5px;

border:none;

border-radius:3px;

font-size:13px;

cursor:pointer;

color:#fff;

}
.save-btn{background:#00a65a;}

.print-btn{background:#f39c12;}

.link-btn{background:#ff851b;}

.plus-btn{

width:18px;

height:18px;

padding:0;

font-size:12px;

font-weight:bold;

border:none;

border-radius:3px;

background:#00c0ef;

color:#fff;

cursor:pointer;

margin-left:5px;

/* ================= MODAL STYLE ================= */

.modal{

display:none;

position:fixed;

z-index:9999;

left:0;

top:0;

width:100%;

height:100%;
background:rgba(0,0,0,0.5);

justify-content:center;

align-items:center;

.[Link]{

display:flex;

.modal-content{

background:#fff;

padding:20px;

width:450px;

border-radius:6px;

position:relative;

.modal-header{

display:flex;

justify-content:space-between;

align-items:center;

font-weight:bold;

margin-bottom:15px;

.close-btn{

background:red;

color:#fff;
border:none;

padding:4px 10px;

font-size:14px;

cursor:pointer;

border-radius:4px;

.close-btn:hover{

background:darkred;

</style>

</head>

<body>

<div class="page-container">

<!-- Top Buttons -->

<div class="action-buttons">

<button class="btn btn-new">New</button>

<button class="btn btn-edit">Edit</button>

<button class="btn btn-delete">Delete</button>

<button class="btn btn-show">Show</button>

<button class="btn btn-print">Print</button>

<button class="btn btn-mail">Send Mail</button>

</div>

<h2>Booking Entry</h2>
<!-- ================= LR DETAILS ================= -->

<div class="form-box">

<h4>LR Details</h4>

<div class="grid">

<div><label>LR No.</label><input value="1900060318"></div>

<div><label>LR Date</label><input type="date"></div>

<div><label>Ref LR No.</label><input placeholder="Enter Ref LR No"></div>

<div><label>P.M.</label><input placeholder="Enter PM"></div>

<div>

<label>From

<button type="button" class="plus-btn" onclick="openCityModal()">+</button>

</label>

<select></select>

</div>

<div>

<label>To

<button type="button" class="plus-btn" onclick="openCityModal()">+</button>

</label>

<select></select>

</div>

<div>

<label>Consignor

<button type="button" class="plus-btn" onclick="openPartyModal()">+</button>


</label>

<select></select>

</div>

<div>

<label>Consignee

<button type="button" class="plus-btn" onclick="openPartyModal()">+</button>

</label>

<select></select>

</div>

<div><label>Cnsnr Address</label><input></div>

<div><label>Cnsgne Address</label><input></div>

<div><label>Cnsnr GSTIN</label><input></div>

<div><label>Cnsgne GSTIN</label><input></div>

<div><label>Billing Branch</label><input></div>

<div>

<label>Billed To

<button type="button" class="plus-btn" onclick="openPartyModal()">+</button>

</label>

<select></select>

</div>

<div>

<label>Vehicle No

<button type="button" class="plus-btn" onclick="openVehicleModal()">+</button>


</label>

<select></select>

</div>

<div><label>Owner Name</label><input placeholder="Enter Owner Name"></div>

<div><label>Transport Mode</label>

<select>

<option>By Road</option>

<option>By Air</option>

<option>By Train</option>

</select>

</div>

<div><label>Transp. Remark</label><input placeholder="Enter Transport Remark"></div>

<div><label>Remarks</label><input placeholder="Enter Remarks"></div>

<div><label>Delivery At</label><input placeholder="Enter Delivery At"></div>

<div><label>Company Name</label><input placeholder="Enter Company Name"></div>

<div><label>Policy No</label><input placeholder="Enter Policy No"></div>

<div><label>Insurance Amount</label><input placeholder="Enter Insurance


Amount"></div>

</div>

</div>

<!-- ================= PARTY INVOICE ================= -->

<div class="form-box">

<h4>Party Invoice Details</h4>

<div class="grid">
<div><label>Invoice No</label><input></div>

<div><label>Invoice Date</label><input type="date"></div>

<div><label>Value Of Goods</label><input></div>

<div><label>E-Way Bill No</label><input></div>

<div><label>EWB Exp. Date</label><input type="date"></div>

</div>

<!-- Buttons -->

<div style="text-align:center; margin-top:10px ;">

<button class="btn btn-add"> Add Invoice</button>

<button class="btn btn-edit">✏ Edit Invoice</button>

</div>

</div>

</div>

<!-- ================= PRODUCT DETAILS ================= -->

<div class="form-box">

<h4>Product Details</h4>

<div class="table-box">

<table>

<!-- ===== ROW 1 HEADER ===== -->

<tr>

<th>

PRODUCT

<button type="button" class="plus-btn" onclick="openProductModal()">+</button>

</th>
<th>Description</th>

<th>QTY</th>

<th>ACTUAL WT</th>

<th>CHARGE WT</th>

<th>

UNIT

<button type="button" class="plus-btn" onclick="openUnitModal()">+</button>

</th>

</tr>

<!-- ===== ROW 1 DATA ===== -->

<tr>

<td><input placeholder="Enter Product Name"></td>

<td><input placeholder="Enter Description"></td>

<td><input placeholder="Enter Qty"></td>

<td><input placeholder="Enter Actual Weight"></td>

<td><input placeholder="Enter Charge Weight"></td>

<td>

<select>

<option>BAG</option>

<option>BOX</option>

<option>KG</option>

<option>PCS</option>

</select>

</td>

</tr>

<!-- ===== ROW 2 HEADER ===== -->


<tr>

<th>RATE</th>

<th>RATE TYPE</th>

<th>AMOUNT</th>

<th>LENGTH</th>

<th>WIDTH</th>

<th>HEIGHT</th>

</tr>

<!-- ===== ROW 2 DATA ===== -->

<tr>

<td><input placeholder="Enter Rate"></td>

<td>

<select>

<option>Per Kg</option>

<option>Per Bag</option>

<option>Per Box</option>

<option>Fixed</option>

</select>

</td>

<td><input placeholder="Enter Amount"></td>

<td><input placeholder="Enter Length"></td>

<td><input placeholder="Enter Width"></td>

<td><input placeholder="Enter Height"></td>

</tr>

</table>
<!-- Add / Edit Buttons -->

<div style="text-align:center; margin-top:10px ;">

<button class="btn btn-add"> Add Item</button>

<button class="btn btn-edit">✏ Edit Item</button>

</div>

</div>

</div>

<!-- ================= FREIGHT & GST ================= -->

<div class="form-box">

<h4>Freight & GST Details</h4>

<div class="grid">

<div>

<label>Freight</label>

<input value="0">

</div>

<div>

<label>Hamali</label>

<input>

</div>

<div>

<label>Pre. Bhadha</label>

<input>

</div>
<div>

<label>Bilty Charge</label>

<input>

</div>

<div>

<label>Colle. Charges</label>

<input>

</div>

<div>

<label>C.P.C.</label>

<input>

</div>

<div>

<label>Other Charge</label>

<input>

</div>

<div>

<label>Total</label>

<input value="0">

</div>

<div>

<label>Apply GST</label>

<select>
<option>No</option>

<option>Yes</option>

</select>

</div>

<div>

<label>CGST</label>

<input value="0">

</div>

<div>

<label>SGST</label>

<input value="0">

</div>

<div>

<label>IGST</label>

<input value="0">

</div>

<div>

<label>Advance</label>

<input value="0">

</div>

<div>

<label>Grand Total</label>

<input value="0">
</div>

<div>

<label>URL Name</label>

<input>

</div>

<div>

<label>Print Type</label>

<select>

<option>A4</option>

<option>A5</option>

</select>

</div>

</div>

</div>

<!-- Bottom Buttons -->

<div class="bottom-actions">

<button class="save-btn">Save</button>

<button class="print-btn">Print</button>

<button class="link-btn">Generate Link</button>

</div>

</div>
<?php include '[Link]'; ?>

<?php include '[Link]'; ?>

<?php include '[Link]'; ?>

<?php include '[Link]'; ?>

<?php include '[Link]'; ?>

<script>

function openCityModal(){

[Link]("frmcitymodal").[Link]("show");

function openPartyModal(){

[Link]("frmpartymodal").[Link]("show");

function openVehicleModal(){

[Link]("frmvehiclemodal").[Link]("show");

function closeCityModal(){

[Link]("frmcitymodal").[Link]("show");

function closePartyModal(){

[Link]("frmpartymodal").[Link]("show");

function closeVehicleModal(){

[Link]("frmvehiclemodal").[Link]("show");
}

function openUnitModal(){

[Link]("unitModal").[Link]("show");

function closeUnitModal(){

[Link]("unitModal").[Link]("show");

function openProductModal(){

[Link]("frmproductmodal").[Link]("show");

function closeProductModal(){

[Link]("frmproductmodal").[Link]("show");

/* Click outside close */

[Link] = function(event){

if([Link]("modal")){

[Link]("show");

</script>

</body>

</html>
[Link]

<?php

require_once 'state_names.php';

require_once 'city_names.php';

$editData = null;

if (isset($_GET['edit_id'])) {

$id = (int)$_GET['edit_id'];

$editQuery = mysqli_query(

$pdo,

"SELECT * FROM city_master WHERE city_id = $id"

);

$editData = mysqli_fetch_assoc($editQuery);

if(isset($_POST['save_city'])) {

$state = $_POST['state'];

$city = $_POST['city_name'];

$district= $_POST['district_name'];

echo "<script>alert('City Saved Successfully');</script>";

?>

<title>City Creation</title>
<style>

body{

font-family: Arial, Helvetica, sans-serif;

/* Open Button */

.open-btn{

margin:40px;

padding:10px 25px;

background:#0d6efd;

color:#fff;

border:none;

cursor:pointer;

border-radius:4px;

/* Modal Background */

.modal{

display:none;

position:fixed;

top:0;

left:0;

width:100%;

height:100%;

background:rgba(0,0,0,0.6);

justify-content:center;

align-items:center;
z-index:9999;

.[Link]{

display:flex;

/* Modal Box */

.modal-box{

background:#fff;

width:500px;

padding:25px;

border-radius:8px;

/* Header */

.modal-header{

display:flex;

justify-content:space-between;

align-items:center;

margin-bottom:15px;

.modal-title{

background:red;

color:#fff;

padding:5px 20px;

border-radius:15px;
font-weight:bold;

/* Close Button */

.close-btn{

background:red;

color:#fff;

border:none;

width:30px;

height:30px;

cursor:pointer;

border-radius:50%;

/* Form */

.form-group{

margin-bottom:15px;

.form-group label{

display:block;

background:blue;

color:#fff;

padding:3px 12px;

border-radius:15px;

font-size:14px;

margin-bottom:5px;

}
.form-group input,

.form-group select{

width:100%;

padding:8px;

border:1px solid #ccc;

border-radius:4px;

.btn-save{

background:#198754;

color:white;

padding:8px 20px;

border:none;

border-radius:4px;

cursor:pointer;

.btn-cancel{

background:#6c757d;

color:white;

padding:8px 20px;

border:none;

border-radius:4px;

cursor:pointer;

</style>
<!-- Open Button -->

<!-- <button class="open-btn" onclick="openCityModal()">Create City</button> -->

<!-- Modal -->

<div id="frmcitymodal" class="modal">

<div class="modal-box">

<div class="modal-header">

<span class="modal-title">City Creation</span>

<button class="close-btn" onclick="closeCityModal()">×</button>

</div>

<form method="POST">

<div class="form-group">

<label>State Name *</label>

<select name="state" id="state" required>

<option value="">Select State Name</option>

<?php foreach ($stateCities as $state => $cities): ?>

<option value="<?= $state ?>"

<?= (isset($editData) && $editData['state'] == $state) ? 'selected' : '' ?>>

<?= $state ?>

</option>

<?php endforeach; ?>

</select>

</div>
<div class="form-group">

<label>City Name *</label>

<select name="district_name" id="city" required>

<option value="">Select City Name</option>

<?php

if (isset($editData)) {

foreach ($stateCities[$editData['state']] as $city) {

$selected = ($city == $editData['district_name']) ? 'selected' : '';

echo "<option value='$city' $selected>$city</option>";

?>

</select>

</div>

<div style="text-align:center; margin-top:15px;">

<button type="submit" name="save_city" class="btn-save">

Save

</button>

<button type="button" class="btn-cancel" onclick="closeCityModal()">

Cancel

</button>

</div>
</form>

</div>

</div>

<script>

function openCityModal(){

[Link]("frmcitymodal").[Link]("show");

function closeCityModal(){

[Link]("frmcitymodal").[Link]("show");

[Link]("frmcitymodal").addEventListener("click", function(event){

if([Link] === this){

closeCityModal();

});

</script>

<script>

var stateCities = <?= json_encode($stateCities) ?>;

</script>

<script src="city_dropdown.js"></script>
[Link]

<?php

require_once 'state_names.php';

require_once 'city_names.php';

$editData = null;

if (isset($_GET['edit_id'])) {

$id = (int)$_GET['edit_id'];

$editQuery = mysqli_query(

$pdo,

"SELECT * FROM city_master WHERE city_id = $id"

);

$editData = mysqli_fetch_assoc($editQuery);

if(isset($_POST['save_city'])) {

$state = $_POST['state'];

$city = $_POST['city_name'];

$district= $_POST['district_name'];

echo "<script>alert('City Saved Successfully');</script>";

?>
<title>Party Creation</title>

<style>

body{

font-family: Arial, Helvetica, sans-serif;

/* Open Button */

.open-btn{

margin:40px;

padding:10px 25px;

background:#0d6efd;

color:#fff;

border:none;

cursor:pointer;

border-radius:4px;

/* Modal Background */

.modal{

display:none;

position:fixed;

top:0;

left:0;

width:100%;

height:100%;

background:rgba(0,0,0,0.6);
justify-content:center;

align-items:center;

z-index:9999;

/* Show Modal */

.[Link]{

display:flex;

/* Modal Box */

.modal-box{

background:#fff;

width:500px;

padding:25px;

border-radius:8px;

position:relative;

/* Header */

.modal-header{

display:flex;

justify-content:space-between;

align-items:center;

margin-bottom:15px;

.modal-header span{
font-size:18px;

font-weight:bold;

/* Close Button */

.close-btn{

background:red;

color:#fff;

border:none;

width:30px;

height:30px;

cursor:pointer;

border-radius:50%;

/* Form */

.form-group{

margin-bottom:12px;

.form-group label{

display:block;

font-weight:bold;

margin-bottom:4px;

.form-group input,

.form-group select,
.form-group textarea{

width:100%;

padding:6px;

border:1px solid #ccc;

border-radius:4px;

.btn-save{

background:#198754;

color:white;

padding:8px 15px;

border:none;

border-radius:4px;

cursor:pointer;

</style>

<!-- Open Button -->

<!-- <button class="open-btn" onclick="openModal()">Party City</button> -->

<!-- Modal -->

<div id="frmpartymodal" class="modal">

<div class="modal-box">

<div class="modal-header">

<span>Party Creation</span>

<button class="close-btn" onclick="closepartyModal()">×</button>

</div>
<form>

<div class="form-group">

<label>Ledger Group</label>

<select>

<option>Bank</option>

<option>Cash</option>

<option>Driver</option>

<option>Expense</option>

<option>Income</option>

<option>Office</option>

<option>Income</option>

<option>Owner & Broker</option>

<option>Party</option>

<option>Staff</option>

<option>Supplier</option>

</select>

</div>

<div class="form-group">

<label>Party Name *</label>

<input type="text" placeholder="Enter Ledger / Party Name">

</div>

<div class="form-group">

<label>Address (1)</label>

<textarea placeholder="Enter Address"></textarea>

</div>
<form method="POST">

<div class="form-group">

<label>State Name *</label>

<select name="state" id="state" required>

<option value="">Select State Name</option>

<?php foreach ($stateCities as $state => $cities): ?>

<option value="<?= $state ?>"

<?= (isset($editData) && $editData['state'] == $state) ? 'selected' : '' ?>>

<?= $state ?>

</option>

<?php endforeach; ?>

</select>

</div>

<div class="form-group">

<label>City Name *</label>

<select name="district_name" id="city" required>

<option value="">Select City Name</option>

<?php

if (isset($editData)) {

foreach ($stateCities[$editData['state']] as $city) {

$selected = ($city == $editData['district_name']) ? 'selected' : '';

echo "<option value='$city' $selected>$city</option>";

}
}

?>

</select>

<div class="form-group">

<label>Mobile No.</label>

<input type="text" placeholder="Enter Mobile No.">

</div>

<button type="submit" class="btn-save">Save</button>

</form>

</div>

</div>

<script>

function openpartyModal(){

[Link]("frmpartymodal").[Link]("show");

function closepartyModal(){

[Link]("frmpartymodal").[Link]("show");

// Close when clicking outside modal box

[Link] = function(event){

var modal = [Link]("frmpartymodal");

if([Link] === modal){

closepartyModal();
}

</script>

<script>

var stateCities = <?= json_encode($stateCities) ?>;

</script>

<script src="city_dropdown.js"></script>
[Link]

<div id="frmproductmodal" class="modal">

<div class="modal-box">

<div class="modal-header">

<span class="modal-title">Product Creation</span>

<button type="button" class="close-btn" onclick="closeProductModal()">×</button>

</div>

<form method="POST">

<div class="form-group">

<label class="blue-label">

Group Name

<span class="plus-btn" onclick="openGroupModal()">+</span>

</label>

<select name="group_name">

<option>--------Select--------</option>

<option>General Goods</option>

<option>Industrial</option>

</select>

</div>

<div class="form-group">

<label class="blue-label">Product Name</label>

<input type="text" name="product_name" placeholder="Enter Product Name">


</div>

<div style="text-align:center; margin-top:20px;">

<button type="submit" class="btn-save">Save</button>

</div>

</form>

</div>

</div>

[Link]

<div id="unitModal" class="modal">

<div class="modal-box">

<div class="modal-header">

<span class="modal-title">Unit Creation</span>

<button type="button" class="close-btn" onclick="closeUnitModal()">×</button>

</div>

<form method="POST">

<div class="form-group">

<label>Unit Name</label>

<input type="text" name="unit_name" placeholder="Unit Name" required>

</div>

<div class="form-group">

<label>Unit Value</label>

<input type="text" name="unit_value" placeholder="Unit Value" required>


</div>

<div style="text-align:right;">

<button type="submit" name="save_unit" class="btn-save">Save</button>

</div>

</form>

</div>

</div>

[Link]

<div id="frmvehiclemodal" class="modal">

<div class="modal-box">

<div class="modal-header">

<span>Vehicle Creation</span>

<button type="button" class="close-btn" onclick="closeVehicleModal()">×</button>

</div>

<form>

<div class="form-group">

<label>Owner / Broker</label>

<select>

<option>Select Owner / Broker Name</option>

<option>Owner 1</option>
<option>Broker 1</option>

</select>

</div>

<div class="form-group">

<label>Vehicle No.</label>

<input type="text" placeholder="Enter Vehicle No.">

</div>

<div style="text-align:right;">

<button type="submit" class="btn-save">Save</button>

</div>

</form>

</div>

</div>

You might also like