add order no to shipment no

This commit is contained in:
Zain Fauzan Rofie Azizi
2018-03-20 10:37:49 +08:00
parent 03d93968c8
commit cbcc26d2e6
2 changed files with 389 additions and 9 deletions
+381
View File
@@ -0,0 +1,381 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>AzureUI - SHIPMENT ARRANGEMENTS1</title>
<link href="https://fonts.googleapis.com/css?family=Nunito:400,600,700,900" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="css/global.style.css">
</head>
<body>
<div class="nav-menu">
<nav class="menu">
<!-- profile logo start -->
<div class="nav-header">
<a href="home.html"><img src="images/CIEF.png" width="160"></a>
</div>
<!-- profile logo end -->
<!-- Menu navigation start -->
<div class="nav-container">
<ul class="main-menu">
<li>
<a href="#"><i class="fa fa-home"></i> Home</a>
</li>
<li>
<a href="#"><i class="fa fa-bell"></i> Notice</a>
</li>
<li>
<a href="javascript:void(0);"><i class="fa fa-briefcase"></i> Arrangement <span class="fa fa-angle-down"></span></a>
<ul>
<li><a href="arrangements-warehouse_receive_note1.html" data-loader="show"><i class="fa fa-industry"></i> Warehouse Receive Note</a></li>
<li><a href="arrangements-shipment_arrangements1.html" data-loader="show"><i class="fa fa-ship"></i> Shipment Arrangement</a></li>
<li><a href="arrangements-delivery_arrangements1.html" data-loader="show"><i class="fa fa-truck"></i> Delivery Arrangement</a></li>
</ul>
</li>
<li>
<a href="javascript:void(0);"><i class="fa fa-shopping-cart"></i> Orders <span class="fa fa-angle-down"></span></a>
<ul>
<li><a href="shipping-order.html" data-loader="show"><i class="fa fa-truck"></i> Shipping Order</a></li>
</ul>
</li>
<li>
<a href="custom_declaration.html"><i class="fa fa-suitcase"></i> Custom Declaration</a>
</li>
<li>
<a href="#"><i class="fa fa-comments"></i> Messenger</a>
</li>
<li>
<a href="javascript:void(0);"><i class="fa fa-shopping-cart"></i> Track Order</a>
</li>
<li>
<a href="example-element.html"><i class="fa fa-code"></i>Example Element</a>
</li>
</ul>
</div>
<!-- Menu navigation end -->
</nav>
</div>
<div class="wrapper">
<div class="wrapper-inline">
<!-- Header area start -->
<header style="background-color: #FFF">
<a class="go-back-link" href="javascript:history.back();"><i class="fa fa-arrow-left"></i></a>
<h1 id="HT" class="page-title" style="color: #000">Shipment Arrangement Status</h1>
<div class="navi-menu-button">
<em></em>
<em></em>
<em></em>
</div>
</header>
<!-- Header area end -->
<!-- Page content start -->
<main class="fix-top-menu">
<form>
<div class="form-divider"></div>
<div class="list-box-non">
<a href="javascript:void(0);" class="list-item" data-popup="formPopup">
<i class="fa fa-plus"></i>
<em class="seperate"></em>
<span class="list-item-title">Add New</span>
</a>
<!-- Content List Spawner Start Here -->
<div class="form-divider"></div>
<div class="form-row txt-center">
Shipment arrangement status is empty, do you want to add new status?
</div>
<!-- Content List Spawner End Here -->
</div>
</form>
</main>
<!-- Page content end -->
</div>
</div>
<!--POPUP HTML CONTENT START -->
<div class="popup-overlay" id="formPopup">
<!-- if you dont want overlay add class .no-overlay -->
<div class="popup-container">
<div class="popup-header">
<h3 class="popup-title">Shipment Details</h3>
<span class="popup-close" data-dismiss="true"><i class="fa fa-times"></i></span>
</div>
<!-- Shipment Arrangement Details Start Here-->
<div class="popup-content">
<div class="form-divider"></div>
<div class="form-label-divider">
<span class="label-span">Shipment Arrangement Details</span>
</div>
<div class="form-divider"></div>
<div class="form-row-group with-icons-no-padding">
<div class="form-row no-padding">
<div class="form-element-title">
<label style="color: #000">Loading Date</label>
</div>
<input type="text" class="form-element" placeholder="dd/mm/yyyy" disabled required />
</div>
<div class="form-row no-padding">
<div class="form-element-title">
<label style="color: #000">Shipment Number</label>
</div>
<input type="text" class="form-element" placeholder="KED 1726" required />
</div>
<div class="form-row no-padding">
<div class="form-element-title">
<label style="color: #000">Departure Port</label>
</div>
<input type="text" class="form-element" placeholder="Port Klang" required />
</div>
<div class="form-row no-padding">
<div class="form-element-title">
<label style="color: #000">Container No</label>
</div>
<input type="text" class="form-element" placeholder="MFG3456" required />
</div>
<div class="form-row no-padding">
<div class="form-element-title">
<label style="color: #000">Type of Container</label>
</div>
<select class="form-element">
<option value="">Please Select Type of Container</option>
<option value="1">Double Doors Container 20ft</option>
<option value="2">Double Doors Container 40ft</option>
<option value="3">Dry Storage Container 10ft</option>
<option value="4">Dry Storage Container 20ft</option>
<option value="5">Dry Storage Container 30ft</option>
<option value="6">Flat Rack Container</option>
<option value="7">Open Top Container</option>
<option value="8">Tunnel Container</option>
<option value="9">Open Side Storage Container</option>
<option value="10">Refregerated ISO Container</option>
<option value="11">Insulated or Thermal Container</option>
<option value="12">Tanks </option>
<option value="13">Cargo Storage Roll Container</option>
<option value="14">Half Height Container </option>
<option value="15">Car Container</option>
<option value="16">Intermediate Bulk Shift Container</option>
<option value="17">Drums </option>
<option value="18">Special Purpose Container</option>
<option value="19">Swap Bodies</option>
</select>
</div>
<div class="form-row no-padding">
<div class="form-element-title">
<label style="color: #000">ETD</label>
</div>
<input type="text" class="form-element" placeholder="dd/mm/yyyy" required />
</div>
<div class="form-row no-padding">
<div class="form-element-title">
<label style="color: #000">ETA</label>
</div>
<input type="text" class="form-element" placeholder="dd/mm/yyyy" required />
</div>
</div>
<!-- Shipment Arrangement Details End Here-->
<!-- Loading Vehicle Details Start Here-->
<div class="form-divider"></div>
<div class="form-label-divider">
<span class="label-span">Loading Vehicle and Driver</span>
</div>
<div class="form-divider"></div>
<div class="form-row-group with-icons-no-padding">
<div class="form-row no-padding">
<div class="form-element-title">
<label style="color: #000">Driver Name</label>
</div>
<input type="text" class="form-element" placeholder="John" disabled required />
</div>
<div class="form-row no-padding">
<div class="form-element-title">
<label style="color: #000">Driver Contact Number</label>
</div>
<input type="text" class="form-element" placeholder="0123456789" required />
</div>
<div class="form-row no-padding">
<div class="form-element-title">
<label style="color: #000">Trailer Number</label>
</div>
<input type="text" class="form-element" placeholder="KED 5353" required />
</div>
<div class="form-row no-padding">
<div class="form-element-title">
<label style="color: #000">Driver Identification Card Number</label>
</div>
<input type="text" class="form-element" placeholder="1234567891011" required />
</div>
</div>
<!-- Loading Vehicle Details End Here-->
<!-- Loading Venue Details Start Here-->
<div class="form-divider"></div>
<div class="form-label-divider">
<span class="label-span">Loading Venue</span>
</div>
<div class="form-divider"></div>
<div class="form-row-group with-icons-no-padding">
<div class="form-row no-padding">
<div class="form-element-title">
<label style="color: #000">Loading Address</label>
</div>
<input type="text" class="form-element" placeholder="" disabled required />
</div>
<div class="form-row no-padding">
<div class="form-element-title">
<label style="color: #000">Loading City</label>
</div>
<input type="text" class="form-element" placeholder="" required />
</div>
<div class="form-row no-padding">
<div class="form-element-title">
<label style="color: #000">Loading State</label>
</div>
<input type="text" class="form-element" placeholder="" required />
</div>
<div class="form-row no-padding">
<div class="form-element-title">
<label style="color: #000">Contact Number</label>
</div>
<input type="text" class="form-element" placeholder="" required />
</div>
<div class="form-row no-padding">
<div class="form-element-title">
<label style="color: #000">Postcode</label>
</div>
<input type="text" class="form-element" placeholder="" disabled required />
</div>
<div class="form-row no-padding">
<div class="form-element-title">
<label style="color: #000">Country</label>
</div>
<input type="text" class="form-element" placeholder="" required />
</div>
<div class="form-row no-padding">
<div class="form-element-title">
<label style="color: #000">Contact Person</label>
</div>
<input type="text" class="form-element" placeholder="" required />
</div>
<div class="form-row no-padding">
<div class="form-element-title">
<label style="color: #000">Remark</label>
</div>
<input type="text" class="form-element" placeholder="State If Any" required />
</div>
</div>
<div class="form-divider"></div>
<!-- Loading Venue Details End Here-->
<!-- Consolidation Start Here-->
<div class="popup-header">
<h3 class="popup-title">Consolidation</h3>
</div>
<div class="form-divider"></div>
<div class="form-label-divider">
<span class="label-span">Order Select</span>
</div>
<div class="form-divider"></div>
<div class="form-row-group with-icons-no-padding">
<div style="color: #069" class="list-box-non">
<button href="#" class="collapsible">
<i class="fa fa-ship"></i>
<em class="seperate"></em>
<span class="list-item-title">Order No : Steam/5467/0001</span>
</button>
<div class="content">
<div class="form-divider"></div>
<div class="form-row-group with-icons-no-padding">
<div class="form-row no-padding">
<div class="form-element-title">
<label style="color: #000">ETA</label>
</div>
<input type="text" class="form-element" placeholder="dd/mm/yyyy" disabled />
</div>
<div class="form-row no-padding">
<div class="form-element-title">
<label style="color: #000">Shipment Number</label>
</div>
<input type="text" class="form-element" placeholder="MFG3456" disabled />
</div>
<div class="form-row no-padding">
<div class="form-element-title">
<label style="color: #000">Marking Number</label>
</div>
<input type="text" class="form-element" placeholder="STEAM/12345/0001/00003" disabled />
</div>
<div class="form-row no-padding">
<div class="form-element-title">
<label style="color: #000">Address</label>
</div>
<input type="text" class="form-element" placeholder="a31,058898 China,Guangzhou, China" disabled />
</div>
</div>
<div class="form-divider"></div>
</div>
</div>
</div>
<!-- Consolidation End Here-->
<div class="popup-footer">
<div class="form-divider"></div>
<a href="arrangements-shipment_arrangements2.html"><span class="button blue" data-dismiss="false">Submit</span></a>
</div>
<div class="form-divider"></div>
</div>
</div>
</div>
<!--POPUP HTML CONTENT END -->
<script type="text/javascript">
/* =========================================
[Collapsible for Custom Order Select] Start Here
==========================================*/
var coll = document.getElementsByClassName("collapsible");
var i;
for (i = 0; i < coll.length; i++) {
coll[i].addEventListener("click", function()
{
this.classList.toggle("active");
var content = this.nextElementSibling;
if (content.style.display === "block") {
content.style.display = "none";
} else {
content.style.display = "block";
}
});
}
</script>
<script src="js/jquery-3.2.1.min.js"></script>
<script src="js/global.script.js"></script>
</body>
</html>
@@ -28,7 +28,13 @@
<span class="label-span">Shipment Arrangement Status</span>
</div>
<div class="form-divider"></div>
<div class="form-row-group with-icons-no-padding">
<div class="form-row-group with-icons-no-padding">
<div class="form-row no-padding">
<div class="form-element-title">
<label style="color: #000">Order Number</label>
</div>
<input type="text" class="form-element" placeholder="STEAM/12345/0001/00003" disabled />
</div>
<div class="form-row no-padding">
<div class="form-element-title">
<label style="color: #000">Shipment Number</label>
@@ -69,14 +75,7 @@
<label style="color: #000">ETA</label>
</div>
<input type="text" class="form-element" placeholder="3/04/2018"/>
</div>
<div class="form-row no-padding">
<div class="form-element-title">
<label style="color: #000">Order Number</label>
</div>
<input type="text" class="form-element" placeholder="STEAM/12345/0001/00003" disabled />
</div>
</div>
<div class="form-row no-padding">
<div class="form-element-title">