EOS/Views/Ticket/TicketAdministartion.cshtml
Nidhi Bhargava f0c1ab20e1 code push
2025-09-04 16:25:07 +05:30

546 lines
29 KiB
Plaintext

@{
ViewBag.Title = System.Configuration.ConfigurationManager.AppSettings["TitleNewLeadReport"];
Layout = "~/Views/Shared/_Layout.cshtml";
ViewBag.hostAddress = System.Configuration.ConfigurationManager.AppSettings["hostAddress"];
}
<div class="size20 left">
<div class="window">
<div class="titlebar">
<div class="title">
Ticket List
</div>
</div>
<div class="innerWindow">
<div class="menubar">
<div id="Menu_bar" class="searchBox" title="Quick Search">
<div class="inputBox">
<input type="text" id="txtSearch" />
</div>
<div class="sIcon">
<img alt="" src="@Url.Content("~/Content/images/search-icon.png")" />
</div>
</div>
</div>
<div class="content withmenubar withstatusbar">
<!-- ticket list table -->
<div id="TicketList_Tbl" class="listBox ldSection" data-bind="visible: $root.ticketList().length>0">
<table id="tableDevices" cellpadding="0" cellspacing="0">
<tr class="tableCelltitle">
<th style="text-align: left;">S.No.</th>
<th style="text-align: left; text-indent:0;">Ticket Id</th>
@*<th style="text-align: left;">Mobile No.</th>*@
<th style="text-align: left;">Status</th>
<th style="text-align: left;">SLA (Minutes)</th>
</tr>
<tbody data-bind="foreach: ticketList">
<tr data-bind="attr: {'id': ticket_id}, css: { activeListTr: $data == $root.chosenTicket() }, click: $root.assignTicket">
<td>
<label class="handMouse" data-bind="text : $index() + 1">
</label>
</td>
<td>
<label class="handMouse" data-bind="text: ticket_id">
</label>
</td>
@*<td>
<label class="handMouse" data-bind="text: EmployeeContact">
</label>
</td>*@
<td>
<label class="handMouse" data-bind="text: work_status">
</label>
</td>
<td>
@*<label class="handMouse" data-bind="text: sla_duration">
</label>*@
<span class="handMouse" data-bind="visible: sla_duration <= 120">
<label class="handMouse" style="color:green" data-bind="text: sla_duration">
</label>
</span>
<span class="handMouse" data-bind="visible: sla_duration > 120">
<label class="handMouse" style="color:red" data-bind="text: sla_duration">
</label>
</span>
</td>
</tr>
</tbody>
</table>
</div>
<!-- end of ticket list table -->
<!-- form -->
<div id="Tracker_from" class="display_none">
<form action="get">
<table border="0" cellspacing="0" cellpadding="0" width="100%">
@*<tr>
<th class="tableCelltitle" colspan="2">Talbe heading</th>
</tr>*@
<tr>
<td class="paddding_Zero">
<table width="100%" cellspacing="0" cellpadding="0" border="0" class="Inner_ListTbl">
<tbody>
<tr>
<th class="tableCelltitle" colspan="2">Agent Info</th>
</tr>
</tbody>
<tbody class="structure">
<tr>
<td>Language</td>
<td align="right">
<select id="agent_language">
<option>Select</option>
<option>English</option>
<option>Hindi</option>
<option>Gujarati</option>
<option>Punjabi</option>
<option>Malayalam</option>
</select>
</td>
</tr>
<tr>
<td>Region</td>
<td align="right">
<select id="agent_region">
<option>Select</option>
<option>East India</option>
<option>Northern India</option>
<option>Northeast India</option>
<option>South India</option>
<option>Western India</option>
</select>
</td>
</tr>
<tr>
<td>State</td>
<td align="right">
<select id="agent_state">
<option>Select</option>
<option>Rajasthan</option>
<option>Gujarat</option>
<option>Kerala</option>
<option>Maharashtra</option>
<option>Punjab</option>
<option>Tamil Nadu</option>
</select>
</td>
</tr>
<tr>
<td>City</td>
<td align="right">
<select id="agent_city">
<option>Select</option>
<option>Jaipur</option>
<option>Jodhpur</option>
<option>Ajmer</option>
<option>Kota</option>
<option>Udaipur</option>
<option>Alwar</option>
</select>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td class="paddding_Zero">
<table style="margin-top: 5px;" width="100%" cellspacing="0" cellpadding="0" border="0" class="Inner_ListTbl">
<tbody>
<tr>
<th style="border-top: 1px solid #c5c5c5;" colspan="2" class="tableCelltitle">Driver/Caller Info</th>
</tr>
</tbody>
<tbody class="structure">
<tr>
<td width="120" class="">Name</td>
<td class=" ">
<input type="text" id="driver_name" />
</td>
</tr>
<tr>
<td width="120" class="">Contact</td>
<td class=" ">
<input type="text" id="driver_contact_no" />
</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td class="paddding_Zero">
<table style="margin-top: 5px;" width="100%" cellspacing="0" cellpadding="0" border="0" class="Inner_ListTbl">
<tbody>
<tr>
<th style="border-top: 1px solid #c5c5c5;" colspan="2" class="tableCelltitle">Vehicle Info</th>
</tr>
</tbody>
<tbody class="structure">
<tr>
<td class="">Name</td>
<td class="">
<input type="text" id="vehicle_owner_name" />
</td>
</tr>
<tr>
<td class="">Contact no</td>
<td class="">
<input type="text" id="vehicle_owner_contact_no" />
</td>
</tr>
<tr>
<td class="">Location</td>
<td class="">
<input type="text" id="vehicle_owner_location" />
</td>
</tr>
<tr>
<td class="">Registration no</td>
<td class="">
<input type="text" id="vehicle_registration" />
</td>
</tr>
<tr>
<td class="">Vechicle model</td>
<td class="">
<input type="text" id="vehicle_model"/>
</td>
</tr>
<tr>
<td class="">Product varient 123</td>
<td class="">
<input type="text" id="vehicle_product_varient" />
</td>
</tr>
<tr>
<td style="vertical-align:top;" class=" ">VAS exact location</td>
<td colspan="1" class=" ">
<textarea rows="20" cols="20" id="eos_exact_location" disabled></textarea>
</td>
@*<td class=" ">Direction of vechicle(moving toward)</td>
<td class=" ">
<input type="text" />
</td>*@
</tr>
<tr>
<td class=" ">Type of load carrying</td>
<td class=" ">
<input type="text" id="vehicle_type_of_load_carrying"/>
</td>
</tr>
<tr>
<td class=" ">Direction of vechicle</td>
<td class=" ">
<input type="text" id="vehicle_direction_of_moving" />
</td>
</tr>
<tr>
<td style="vertical-align: top;" class=" ">Nature of problem</td>
<td colspan="1" class=" ">
<textarea rows="35" cols="20" id="nature_of_problem"></textarea>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</table>
</form>
</div>
<!-- end of form -->
</div>
<div class="statusbar" id="TicketList_Statusbar">
@*<div id="TicketList_Tbl_BtnWrp">
<input type="submit" value="Cancel" onclick="" class="Report_Btn" style="margin: auto;" />
<input type="submit" value="Get All Vans" onclick="" class="Report_Btn" style="margin: auto;" />
</div>*@
<div id="Tracker_from_BtnWrp" class="display_none">
<input id="ReturnToList" type="submit" value="Cancel" onclick="" class="Report_Btn" style="margin: auto;" />
<input type="submit" value="Get All Vans" onclick="calculateDistances()" class="Report_Btn" style="margin: auto;" />
</div>
</div>
</div>
</div>
</div>
<div class="size60 mid20-20">
<div class="window">
<div class="titlebar">
<div class="title">
Ticket Details On Map
</div>
</div>
<div id="divDetail" class="innerWindow">
<div class="toolbar">
<ul class="toolUl">
<li class="editBtn">
<div class="toolBtn">
<label>
@*<span class="hugeIcon addIcon"></span>*@<span class="k-icon k-add"></span> Add New Ticket
</label>
</div>
</li>
</ul>
</div>
<div id="divMapContainer" class="content withtoolbar">
</div>
</div>
@*<div class="statusbar">
</div>*@
</div>
</div>
<div class="size20 right">
<div class="window">
<div class="titlebar">
<div class="title">
Ticket Details
</div>
</div>
<div id="divDetail" class="innerWindow">
<div class="content">
<div class="listDetails">
<div class="ldSection">
<h2 style="text-align: center" class="darktxt">Ticket Id: <span data-bind="text: ticket_id"></span></h2>
<table class="themeTable" cellpadding="5" cellspacing="0">
<tbody>
<tr>
<th class="tableCelltitle paddding_Zero" colspan="2">Agent Info</th>
</tr>
<tr>
<td style="width: 50%" class="tableCelllabel">
<span class="darktxt">Language</span>
</td>
<td style="width: 50%" class="tableCellinfo darktxt" data-bind="text: agent_language"></td>
</tr>
<tr>
<td style="width: 50%" class="tableCelllabel">
<span class="darktxt">Region</span>
</td>
<td style="width: 50%" class="tableCellinfo darktxt" data-bind="text: agent_region"></td>
</tr>
<tr>
<td style="width: 50%" class="tableCelllabel">
<span class="darktxt">State</span>
</td>
<td style="width: 50%" class="tableCellinfo darktxt" data-bind="text: agent_state"></td>
</tr>
<tr>
<td style="width: 50%" class="tableCelllabel">
<span class="darktxt">City</span>
</td>
<td style="width: 50%" class="tableCellinfo darktxt" data-bind="text: agent_city"></td>
</tr>
<tr>
<th class="tableCelltitle paddding_Zero" colspan="2">Driver/Caller Info</th>
</tr>
<tr>
<td style="width: 50%" class="tableCelllabel">
<span class="darktxt">Name</span>
</td>
<td style="width: 50%" class="tableCellinfo darktxt" data-bind="text: driver_name"></td>
</tr>
<tr>
<td style="width: 50%" class="tableCelllabel">
<span class="darktxt">Contact</span>
</td>
<td style="width: 50%" class="tableCellinfo darktxt" data-bind="text: driver_contact_no"></td>
</tr>
<tr>
<th class="tableCelltitle paddding_Zero" colspan="2">Vehicle Info</th>
</tr>
<tr>
<td style="width: 50%" class="tableCelllabel">
<span class="darktxt">Owner's Name</span>
</td>
<td style="width: 50%" class="tableCellinfo darktxt" data-bind="text: vehicle_owner_name"></td>
</tr>
<tr>
<td style="width: 50%" class="tableCelllabel">
<span class="darktxt">Owner's Contact No.</span>
</td>
<td style="width: 50%" class="tableCellinfo darktxt" data-bind="text: vehicle_owner_contact_no"></td>
</tr>
<tr>
<td style="width: 50%" class="tableCelllabel">
<span class="darktxt">Owner's Location</span>
</td>
<td style="width: 50%" class="tableCellinfo darktxt" data-bind="text: vehicle_owner_location"></td>
</tr>
<tr>
<td style="width: 50%" class="tableCelllabel">
<span class="darktxt">Registration No.</span>
</td>
<td style="width: 50%" class="tableCellinfo darktxt" data-bind="text: vehicle_registration"></td>
</tr>
<tr>
<td style="width: 50%" class="tableCelllabel">
<span class="darktxt">Model No.</span>
</td>
<td style="width: 50%" class="tableCellinfo darktxt" data-bind="text: vehicle_model"></td>
</tr>
<tr>
<td style="width: 50%" class="tableCelllabel">
<span class="darktxt">Product varient 12</span>
</td>
<td style="width: 50%" class="tableCellinfo darktxt" data-bind="text: vehicle_product_varient"></td>
</tr>
<tr>
<td style="width: 50%" class="tableCelllabel">
<span class="darktxt">VAS exact location</span>
</td>
<td style="width: 50%" class="tableCellinfo darktxt" data-bind="text: eos_exact_location"></td>
</tr>
<tr>
<td style="width: 50%" class="tableCelllabel">
<span class="darktxt">Type of load carrying</span>
</td>
<td style="width: 50%" class="tableCellinfo darktxt" data-bind="text: vehicle_type_of_load_carrying"></td>
</tr>
<tr>
<td style="width: 50%" class="tableCelllabel">
<span class="darktxt">Direction of vechicle</span>
</td>
<td style="width: 50%" class="tableCellinfo darktxt" data-bind="text: vehicle_direction_of_moving"></td>
</tr>
<tr>
<td style="width: 50%" class="tableCelllabel">
<span class="darktxt">Nature of problem</span>
</td>
<td style="width: 50%" class="tableCellinfo darktxt" data-bind="text: nature_of_problem"></td>
</tr>
<tr>
<th class="tableCelltitle paddding_Zero" colspan="2">Van Info</th>
</tr>
<tr>
<td style="width: 50%" class="tableCelllabel">
<span class="darktxt">Van ID</span>
</td>
<td style="width: 50%" class="tableCellinfo darktxt" data-bind="text: employeeId"></td>
</tr>
@* <tr>
<td style="width: 50%" class=" ">
<span class="darktxt">Name</span>
</td>
<td style="width: 50%" class="tableCellinfo darktxt" data-bind="text: driver_name"></td>
</tr>
<tr>
<td style="width: 50%" class=" ">
<span class="darktxt">Contact No.</span>
</td>
<td style="width: 50%" class="tableCellinfo darktxt" data-bind="text: driver_contact_no"></td>
</tr>*@
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="dialog-form" title="Nearest Vans List"></div>
<link href="@Url.Content("~/Content/css/template.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/css/page-layout.css")" rel="stylesheet" type="text/css" />
@*<script type="text/javascript" src="@Url.Content("~/Scripts/map_api/ccplGoogleMap.js")"></script>
<script type="text/javascript" src="@Url.Content("~/Scripts/map_api/ccplMapAPI.js")"></script>*@
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCJ3wlWRqHYEdO5MEiXvbJUjopdDsy3CIg &sensor=false&libraries=geometry"></script>
<script src="@Url.Content("~/Scripts/knockout-2.2.0.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/Ticket/TicketAdministration.js")" type="text/javascript"></script>
<script type="text/javascript">
// accessing host address and making it available globally
var hostAddress = '@ViewBag.hostAddress';
var taskStatusReport;
//function calling on document ready
$(document).ready(function () {
'use strict';
// hiding report table
//$('.themeTable').hide();
// making report menu item selected
setSelectedMenuItem("liTicketAdministartion");
// binding date picker and showing today's date to Outscan date input box.
$('#outscanDate').levydatepicker({ dateFormat: 'dd M yy', defaultDate: "@DateTime.Now.ToString("dd MMM yyyy")" });
// creating an instance of TaskStatus Model
taskStatusReport = new TaskStatusReport();
// accessing and storing security token
var securityToken = '@ViewBag.SecurityToken';
// making the security token available gloablly
taskStatusReport.assignSecurityToken(securityToken);
// getting all the employees details and populate them on page
taskStatusReport.getAllEmployees();
// finally apply all knoucout bindings
ko.applyBindings(taskStatusReport);
// initializing the map to a particular html ID on page.
initMap("divMapContainer");
//for left panel table toggle
$(".editBtn").click(function () {
$("#TicketList_Statusbar").removeClass('Bgwhite');
$("#TicketList_Tbl, #TicketList_Tbl_BtnWrp, #Menu_bar").hide();
$("#Tracker_from, #Tracker_from_BtnWrp").show();
$(".dashboard .right").hide();
$(".dashboard .mid20-20").removeClass('size60').addClass('size80');
$("#userLocation").val('');
bindClickEventToMap();
});
$("#ReturnToList").click(function () {
$("#TicketList_Tbl, #TicketList_Tbl_BtnWrp, #Menu_bar").show();
$("#Tracker_from, #Tracker_from_BtnWrp").hide();
$(".dashboard .right").show();
$(".dashboard .mid20-20").removeClass('size80').addClass('size60');
removeClickEventToMap();
});
$("#TicketList_Statusbar").addClass('Bgwhite');
//end of left panel table toggle
});
</script>
<style type="text/css">
textarea {
/*width: 94%;*/
height: 50px;
/*margin-left: 10px;*/
}
.fulltextarea {
width: 96% !important;
}
table.modalTable, .modalTable th, .modalTable td {
border: 1px solid #c5c5c5;
border-collapse: collapse;
}
.Bgwhite {
background: #fff;
}
.modalTable th, .modalTable td {
padding: 15px;
}
.modalTable th {
text-align: left;
background: #f7f7f7;
}
.modalTable {
border-spacing: 5px;
}
tr.showMarked {
background-color: lightgray;
}
</style>