Ticket Management System Administration Portal | Part 7 | Route Page Code

 

Route

Overview

This page used to show transport routes. This page consists of four parts new route, search route, update route and delete route. Update view will be upload soon.

<div id = "route_panel" class = "col-md-12 display-none" >

<nav id = "route_nav" class = "nav nav-pills nav-stacked my-3" >

<a Id = "new_route_nav_link" class = "nav-link" href="#new_route_panel"> New </a>

<a Id = "search_route_nav_link" class = "nav-link" href = "#search_route_panel"> Search </a>

<a Id = "update_route_nav_link"

class = "nav-link" href = "#update_route_panel" > Update </a>

<a Id = "delete_route_nav_link"

class = "nav-link" href = "#delete_route_panel"> Delete </a>

</nav>

<div class = "row" >

<div class = "col-md-12" >

<div class = "cardbg-grey-500" >

<div class = "card-header" >

<strong id = "route_header_text" ></strong>

</div>

</div>

</div>

<div id = "display_route_panel" class = "col-md-12 my-3" >

<div class ="card" >

<div class = "card-body" > Route List </div>

</div>

</div>

<div id = "new_route_panel" class = "col-md-12 my-3" >

<div class = "card" >

<div class = "card-body" >

<div class = "row" >

<div class = "col-md-6" >

<div class = "form-group" >

<label for = "my-input" > Select Vehicle No </label>

<input id = "my-input" class = "form-control" type = "text" name = "" >

<small class = "form-text text-muted" > Validation </small>

</div>

</div>

<div class = "col-md-6" > Validation </div>

<div class = "col-md-6" >

<div class = "form-group" >

<label for = "my-input" > Enter Pick Location </label>

<input id = "my-input" class=" form-control" type = "text" name ="" >

<small class = "form-text text-muted" > Validation </small>

</div>

</div>

<div class = "col-md-6" > Validation </div>

<div class = "col-md-6" >

<div class = "form-group" >

<label for = "my-input" > Enter Drop Location </label>

<input id = "my-input" class = "form-control" type = "text" name = "" >

<small class = "form-text text-muted" > Validation </small>

</div>

</div>

<div class = "col-md-6" > Validation </div>

<div class = "col-md-6" >

<button class = "btn btn-success w-25 float-right" >Save</button>

</div>

</div>

</div>

</div>

</div>

<div id = "search_route_panel" class = "col-md-12 my-3" >

<div class = "card" >

<div class = "card-body" >

<div class = "row" >

<div class = "col-md-6" >

<div class = " form-group" >

<label for = "my-input" > Enter From Location </label>

<input id = "my-input" class = " form-control" type = "text" name = "" >

<small class = "form-text text-muted" > Validation </small>

</div>

</div>

<div class = "col-md-6" > Validation </div>

<div class = "col-md-6" >

<button class = "btn btn-success w-25 float-right" > Search </button>

</div>

</div>

</div>

</div>

</div>

<div id = "update_route_panel" class = "col-md-12 my-3" >

<div class = "card" >

<div class = "card-body" > Update Route </div>

</div>

</div>

<div id = "delete_route_panel" class = "col-md-12 my-3" >

<div class = "card" >

<div class = "card-body" >

<div class = "row" >

<div class = "col-md-6" >

<div class = "form-group">

<label for = "my-input"> Enter From Location </label>

<input id = "my-input" class = "form-control" type = "text" name = "" >

<small class = "form-text text-muted" > Validation </small>

</div>

</div>

<div class = "col-md-6" > Validation </div>

<div class = "col-md-6" >

<button class = "btn btn-success w-25 float-right" > Submit </button>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

Output:

Route View

Route Collapse View

Route New View

Route Search View

Route Update View