fleet-contractor/Site/JobSite/JobSiteManage.aspx
2023-04-28 12:22:26 +08:00

1355 lines
58 KiB
Plaintext

<%@ Page Title="" Language="C#" MasterPageFile="~/JobSite/JobSiteMasterPage.master" AutoEventWireup="true" CodeFile="JobSiteManage.aspx.cs" Inherits="JobSiteManage" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
<link href="../css/jquery.datetimepicker.css" rel="stylesheet" />
<style type="text/css">
.itemselcted {
background-color: #ccc;
}
.itemhidden {
display: none;
}
.itemsuggested {
background-color: #ffff99;
}
#tbMachineTypes tbody tr:hover {
cursor: default;
background: #ddd;
}
#tbodyAssigned tr:hover {
cursor: default;
background: #ddd;
}
#tbodyUnassigned tr:hover {
cursor: default;
background: #ddd;
}
#tbodySelected tr:hover {
cursor: default;
background: #ddd;
}
#contentctrl {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
.float_left {
float: left;
}
.function_bar {
float: right;
}
.user_main {
padding: 0 4px;
}
.dialog .dialog-title .dialog-close {
float: right;
margin-right: 6px;
cursor: pointer;
}
.dialog .dialog-title .dialog-close:before {
content: '\e600';
}
.dialog-content table {
border-collapse: collapse;
width: 100%;
}
.dialog-content table td.label {
width: 170px;
text-align: right;
padding-right: 10px;
line-height: 28px;
height: 24px;
vertical-align: top;
}
.dialog-content table td input,
.dialog-content table td textarea {
border: 1px solid #a9a9a9;
width: 200px;
height: 18px;
padding: 1px;
}
#dialog_machines .dialog-content table td input,
#dialog_layouts .dialog-content table td input {
width: auto;
}
.dialog-content table td input[type="checkbox"] {
border: none;
}
.dialog-content table td textarea {
height: 100px;
max-width: 200px;
}
#dialog_user_randompass {
width: auto;
height: 16px;
margin: 3px 4px 0 4px;
}
.icon {
font-family: CalciteWebCoreIcons;
cursor: default;
}
.machine_filter {
height: 20px;
line-height: 20px;
}
.machine_filter select {
height: 23px;
min-width: 100px;
max-width: 300px;
}
.ybutton {
width: 80px;
line-height: normal;
margin-left: 6px;
border: none;
background: rgb(249, 189, 117);
padding: 5px 14px;
cursor: pointer;
}
.ybutton:hover {
background: #d7690E;
}
.td_controller {
vertical-align: middle;
padding: 40px 8px;
/*border-left: 1px solid #b0b0b0;
border-right: 1px solid #b0b0b0;*/
}
.ctl_button {
font-family: 'CalciteWebCoreIcons';
display: block;
margin: 6px auto;
width: 60px;
height: 22px;
line-height: 21px;
padding: 0;
}
.subdialog {
width: -moz-calc(100% - 24px);
width: -webkit-calc(100% - 24px);
width: calc(100% - 24px);
}
.machine_maskbg {
top: 0;
left: 0;
width: 100%;
height: 100%;
position: absolute;
background: #000;
opacity: 0.2;
}
#machine-name {
margin: 10px 10px 6px;
/*color: gray;*/
font-weight: lighter;
font-size: 18px;
width: 770px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
</style>
<link href="<%=GetFileUrlWithVersion("../css/panel.css")%>" rel="stylesheet" />
<link href="<%=GetFileUrlWithVersion("../css/spectrum.css")%>" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="../css/editmultiselect.css" />
<script type="text/javascript" src="<%=GetFileUrlWithVersion("../js/vue.min.js")%>"></script>
<script>Vue.config.productionTip = false; Vue.config.silent = true;</script>
<script type="text/javascript" src="<%=GetFileUrlWithVersion("../js/components/datagrid.js")%>"></script>
<script src="../js/spectrum.js?v=1" type="text/javascript"></script>
<script src="../js/jquery.datetimepicker.full.js"></script>
<script src="<%=GetFileUrlWithVersion("../js/assetselector.js")%>" type="text/javascript"></script>
<script src="<%=GetFileUrlWithVersion("../js/editmultiselect.js")%>" type="text/javascript"></script>
<script src="<%=GetFileUrlWithVersion("../js/gridlayout.js")%>" type="text/javascript"></script>
<script>
_network.jobsitequery = function (method, param, callback, error, nolog) {
_network.request("JobSite/JobSiteManage.aspx?tp=ashx", -1, method, param, callback, error, nolog);
}
var gridLayoutID = "Jobsites";
var _allJobSites;
var jobsitetypeparam;
var IsAdmin =<%=IsAdmin ?"true":"false"%>;
/***************************Jobsites***************************/
function OnDelete(jobsite) {
if (!jobsite) {
return;
}
_network.jobsitequery("GetJobSiteUsers", jobsite.ID, function (data) {
DeleteJobSite(jobsite.ID, data);
}, function (err) {
});
}
function DeleteJobSite(jobsiteid, users) {
var userstr = "";
if (users && users.length > 0) {
userstr = GetTextByKey("P_JS_USERHAVEANYDATAAVAILABLEONTHEMAP", "This user(s) will no longer have any data available on the map:") + "<br/>";
for (var i = 0; i < users.length; i++) {
var user = users[i];
userstr += user.Name + "(" + user.ID + ")<br/>";
}
}
var text = GetTextByKey("P_JS_REMOVEHOBSITETIPS", "If you proceed and remove this jobsite all historical data attached to this jobsite will be removed.") + "<br/>" + userstr + GetTextByKey("P_JS_WOULDYOULIKETOCONTINUE", "Would you like to continue?");
var alerttile = GetTextByKey("P_JS_DELETEJOBSITE", "Delete Jobsite");
showConfirm('<div style="padding-right:20px">' + text + '</div>', alerttile, function (e, notes) {
_network.jobsitequery("DeleteJobSite", jobsiteid + String.fromCharCode(170) + notes, function (data) {
OnRefresh();
}, function (err) {
showAlert(GetTextByKey("P_JS_FAILEDTODELETETHISJOBSITE", "Failed to delete this jobsite."), alerttile);
});
}, null, true);
}
function CloseDialog(type) {
$('#dialog_jobsite').hideDialog();
OnRefresh();
}
function CloseACConfigDialog() {
$('#dialog_jobsiteacconfig').hideDialog();
showmaskbg(false);
}
function ShowDialog(type) {
showmaskbg(true);
$('#dialog_jobsite')
.attr('act', type)
.showDialogRight();
}
function ShowACDialog() {
showmaskbg(true);
$('#dialog_jobsiteacconfig').showDialogRight(150);
}
function OnAdd() {
execIframeFunc("init", [], "iframejobsite");
ShowDialog("add");
}
var jobsiteid;
function OnEdit() {
var jobsite = grid_dt.source[grid_dt.selectedIndex].Values;
if (!jobsite) {
jobsiteid = undefined;
return;
}
jobsiteid = jobsite.ID;
execIframeFunc("init", [jobsite], "iframejobsite");
showmaskbg(true);
ShowDialog("edit");
}
function OnDblClick(e) {
OnEdit();
}
function OnRefresh() {
showloading(true);
var searchtxt = "";
searchtxt = htmlencode($.trim($('#searchinputtxt').val()));
var jobsitetypes = [];
if (jobsitetypeparam)
jobsitetypes = jobsitetypeparam.selectedvalue;
var active = $('#chk_activesitesonly').prop('checked');
_network.jobsitequery("GetJobSites", JSON.stringify(jobsitetypes) + String.fromCharCode(170) + searchtxt + String.fromCharCode(170) + active, function (data) {
showloading(false);
_allJobSites = data;
showJobSiteList(data);
}, function (err) {
showloading(false);
});
}
function showJobSiteList(data) {
var rows = [];
for (var i = 0; i < data.length; i++) {
var r = data[i];
for (var j in r) {
//if (j === "Radius_UOM")
// r[j] = { DisplayValue: r["Radius"] > 0 ? r["Radius_UOM"] : '', Value: r["Radius"] > 0 ? r[j] : '' };
if (j === "StartDate")
r[j] = { DisplayValue: r["StartDateStr"], Value: r[j] };
else if (j === "EndDate")
r[j] = { DisplayValue: r["EndDateStr"], Value: r[j] };
else if (j === "ProjectedEndDate")
r[j] = { DisplayValue: r["ProjectedEndDateStr"], Value: r[j] };
}
var fr = { Values: r };
rows.push(fr);
}
grid_dt.setData(rows);
grid_dt.refresh();
}
var grid_dt;
function InitGridData() {
grid_dt = new GridView('#jobsitelist');
grid_dt.lang = {
all: GetTextByKey("P_GRID_ALL", "(All)"),
ok: GetTextByKey("P_GRID_OK", "OK"),
reset: GetTextByKey("P_GRID_RESET", "Reset")
};
var list_columns = [
{ name: 'Name', caption: GetTextByKey("P_JS_NAME", "Name"), valueIndex: 'Name', css: { 'width': 200, 'text-align': 'left' } },
{ name: 'Region', caption: GetTextByKey("P_JS_REGION", "Region"), valueIndex: 'Region', css: { 'width': 120, 'text-align': 'left' } },
{ name: 'Number', caption: GetTextByKey("P_JS_NUMBER", "Number"), valueIndex: 'Number', css: { 'width': 120, 'text-align': 'left' } },
{ name: 'Code', caption: GetTextByKey("P_JS_CODE", "Code"), valueIndex: 'Code', css: { 'width': 120, 'text-align': 'left' } },
{ name: 'Types', caption: GetTextByKey("P_JS_TYPES", "Types"), valueIndex: 'Types', allowFilter: true, css: { 'width': 160, 'text-align': 'left' } },
{ name: 'Latitude', caption: GetTextByKey("P_JS_LATITUDE", "Latitude"), valueIndex: 'Latitude', css: { 'width': 100, 'text-align': 'right' } },
{ name: 'Longitude', caption: GetTextByKey("P_JS_LONGITUDE", "Longitude"), valueIndex: 'Longitude', css: { 'width': 100, 'text-align': 'right' } },
{ name: 'ColorString', caption: GetTextByKey("P_JS_COLOR", "Color"), valueIndex: 'ColorString', css: { 'width': 60, 'text-align': 'center' } },
{ name: 'RadiusStr', caption: GetTextByKey("P_JS_RADIUS", "RadiusStr"), valueIndex: 'RadiusStr', css: { 'width': 100, 'text-align': 'right' } },
{ name: 'BaseonAsset', caption: GetTextByKey("P_JS_BINDINGTOASSET", "Binding to Asset"), valueIndex: 'BaseonMachineName', css: { 'width': 200, 'text-align': 'left' } },
//{ name: 'Radius', caption: GetTextByKey("P_JS_RADIUS", "Radius"), valueIndex: 'Radius', css: { 'width': 100, 'text-align': 'right' } },
//{ name: 'Radius_UOM', caption: GetTextByKey("P_JS_RADIUSUOM", "Radius UOM"), valueIndex: 'Radius_UOM', allowFilter: true, css: { 'width': 100, 'text-align': 'left' } },
{ name: 'Foreman', caption: GetTextByKey("P_JS_FOREMAN", "Foreman"), valueIndex: 'Foreman', css: { 'width': 120, 'text-align': 'left' } },
{ name: 'Manager', caption: GetTextByKey("P_JS_MANAGER", "Manager"), valueIndex: 'Manager', visible: false, css: { 'width': 120, 'text-align': 'left' } },
{ name: 'Phone', caption: GetTextByKey("P_JS_PHONE", "Phone"), valueIndex: 'Phone', visible: false, css: { 'width': 100, 'text-align': 'left' } },
{ name: 'Email', caption: GetTextByKey("P_JS_EMAIL", "Email"), valueIndex: 'Email', visible: false, css: { 'width': 100, 'text-align': 'left' } },
{ name: 'Group', caption: GetTextByKey("P_JS_GROUP", "Group"), valueIndex: 'Group', visible: false, css: { 'width': 100, 'text-align': 'left' } },
{ name: 'Address1', caption: GetTextByKey("P_JS_DELIVERYADDRESS1", "Delivery Address 1"), valueIndex: 'Address1', visible: false, css: { 'width': 140, 'text-align': 'left' } },
{ name: 'Address2', caption: GetTextByKey("P_JS_DELIVERYADDRESS2", "Delivery Address 2"), valueIndex: 'Address2', visible: false, css: { 'width': 140, 'text-align': 'left' } },
{ name: 'City', caption: GetTextByKey("P_JS_CITY", "City"), valueIndex: 'City', visible: false, css: { 'width': 100, 'text-align': 'left' } },
{ name: 'State', caption: GetTextByKey("P_JS_STATE", "State"), valueIndex: 'State', visible: false, css: { 'width': 100, 'text-align': 'left' } },
{ name: 'Zip', caption: GetTextByKey("P_JS_ZIP", "Zip"), valueIndex: 'Zip', visible: false, css: { 'width': 100, 'text-align': 'left' } },
{ name: 'County', caption: GetTextByKey("P_JS_COUNTY", "County"), valueIndex: 'County', visible: false, css: { 'width': 100, 'text-align': 'left' } },
{ name: 'StartDate', caption: GetTextByKey("P_JS_STATDATE", "Start Date"), valueIndex: 'StartDate', css: { 'width': 100, 'text-align': 'left' } },
{ name: 'ProjectedEndDate', caption: GetTextByKey("P_JS_PROJECTEDENDDATE", "Projected End Date"), valueIndex: 'ProjectedEndDate', css: { 'width': 130, 'text-align': 'left' } },
{ name: 'EndDate', caption: GetTextByKey("P_JS_ENDDATE", "End Date"), valueIndex: 'EndDate', css: { 'width': 100, 'text-align': 'left' } },
{ name: 'Notes', caption: GetTextByKey("P_JS_NOTES", "Notes"), valueIndex: 'Notes', visible: false, css: { 'width': 100, 'text-align': 'left' } },
{ name: 'Edit', caption: "", alwaysshow: true, css: { 'width': 30, 'text-align': 'center' } },
{ name: 'Delete', caption: "", alwaysshow: true, css: { 'width': 30, 'text-align': 'center' } },
{ name: 'ManageAssets', caption: "", alwaysshow: true, css: { 'width': 30, 'text-align': 'center' } }
];
var columns = [];
// head
for (var hd in list_columns) {
var col = {};
col.name = list_columns[hd].name;
col.caption = list_columns[hd].caption;
col.visible = list_columns[hd].visible === false ? false : true;
col.sortable = true;
col.width = list_columns[hd].css.width;
col.align = list_columns[hd].css["text-align"]
col.key = list_columns[hd].valueIndex;
col.allowFilter = list_columns[hd].allowFilter;
col.alwaysshow = list_columns[hd].alwaysshow;
if (col.name === "Edit") {
col.sortable = false;
col.isurl = true;
col.text = "\uf044";
col.events = {
onclick: function () {
OnEdit()
}
};
col.classFilter = function (e) {
return "icon-col";
}
col.attrs = { 'title': GetTextByKey("P_JS_EDIT", 'Edit') };
}
else if (col.name === "Delete") {
col.sortable = false;
col.isurl = true;
col.text = "\uf00d";
col.events = {
onclick: function () {
OnDelete(this);
}
};
col.classFilter = function (e) {
return "icon-col";
};
col.attrs = { 'title': GetTextByKey("P_JS_DELETE", 'Delete') };
}
else if (col.name === "ManageAssets") {
col.sortable = false;
col.isurl = true;
col.text = "\uf63c";
col.events = {
onclick: function () {
OnManageMachine(this);
}
};
col.classFilter = function (e) {
return "icon-col";
};
col.attrs = { 'title': GetTextByKey("P_JS_MANAGEASSETS", 'Manage Assets') };
} else if (col.name === 'ColorString') {
col.allowHtml = true;
col.filter = function (item) {
var bg = 'rgb(' + item.Color.Red + ',' + item.Color.Green + ',' + item.Color.Blue + ')';
var cb = '<div style="background:' + bg + ';width:16px;height:16px;"></div>';
//return cb + item.ColorString;
return cb;
};
col.styleFilter = function () {
return { display: 'block' };
};
}
columns.push(col);
}
grid_dt.canMultiSelect = false;
//grid_dt.columns = columns;
//grid_dt.init();
grid_dt.rowdblclick = OnEdit;
grid_dt.selectedrowchanged = function (rowindex) {
var rowdata = grid_dt.source[rowindex];
if (rowdata) {
jobsiteid = rowdata.Values.ID;
}
}
grid_dt.allcolumns = columns;
getGridLayout(gridLayoutID, grid_dt, OnRefresh);
}
/**************************JobSite Machine********************************/
/*************************************************************************/
function OnMachineAdd() {
$("#dialogmask").show();
var dialogAssets = new $assetselector('dialog_machines');
dialogAssets.jobsiteId = jobsiteid;
dialogAssets.onDialogClosed = function () {
$("#dialogmask").hide();
$('#dialog_machines').remove();
};
dialogAssets.onOK = function (source) {
var items = [];
for (var i = 0; i < source.length; i++) {
var it = source[i].Values;
if (it.Selected) {
items.push({
Values: {
AssetId: it.Id,
VIN: it.VIN,
Name: it.Name,
MakeName: it.MakeName,
ModelName: it.ModelName,
TypeName: it.TypeName,
OnSite: false
}
});
}
}
$("#dialogmask").hide();
var params = [
'', jobsiteid,
JSON.stringify(items.map(function (f) { return f.Values.AssetId; }))
];
_network.jobsitequery('AddAssetToJobSite', params.join(String.fromCharCode(170)), function (r) {
if (r === 'OK') {
items = items.filter(function (it) {
var assetId = it.Values.AssetId;
return grid_dtsm.innerSource.filter(function (st) { return st.Values.AssetId === assetId; }).length === 0;
});
grid_dtsm.setData(grid_dtsm.innerSource.concat(items));
} else {
showAlert(r, GetTextByKey("P_JS_ASSETASSIGNMENT", "Asset Assignment"));
}
});
};
dialogAssets.showSelector(2, true);
}
function OnMachineDeleteSingle(item) {
var alerttitle = GetTextByKey("P_JS_ASSETASSIGNMENT", "Asset Assignment");
showConfirm(GetTextByKey("P_JS_DELETEASSIGNEDASSET", 'Are you sure you want to delete the assigned asset:{0}?').replace('{0}', item.Name), alerttitle, function () {
var params = [
'', jobsiteid,
JSON.stringify([item.AssetId])
];
$("#dialogmask").show();
_network.jobsitequery('RemoveAssetFromJobSite', params.join(String.fromCharCode(170)), function (r) {
$("#dialogmask").hide();
if (r !== 'OK') {
showAlert(r, alerttitle);
} else {
for (var i = 0; i < grid_dtsm.innerSource.length; i++) {
var s = grid_dtsm.innerSource[i].Values;
if (s.AssetId === item.AssetId) {
grid_dtsm.innerSource.splice(i, 1);
break;
}
}
if (grid_dtsm.source != null) {
for (var j = 0; j < grid_dtsm.source.length; j++) {
if (item.AssetId === grid_dtsm.source[j].Values.AssetId) {
grid_dtsm.source.splice(j, 1);
break;
}
}
}
grid_dtsm.reset();
}
});
});
}
function OnSiteChanging(item, input) {
var checked = $(input).prop('checked');
var text = GetTextByKey("P_JS_ONSITETIPS", "You have manually assigned a jobsite. This action will disable geofence alerts and jobsite auto-assignment. Do you want to proceed? ");
if (!checked)
text = GetTextByKey("P_JS_ONSITETIPS1", "Are you sure you want to change the on-site of the asset:{0}?").replace('{0}', item.Name);
showConfirm(text, GetTextByKey("P_JS_ONSITECHANGE", "On Site Change"), function () {
$(input).prop('checked', !$(input).prop('checked')).change();
});
}
function OnSiteChanged() {
var params = [
'', jobsiteid,
this.AssetId,
this.OnSite ? '1' : '0'
];
$('#dialogmask').show();
_network.jobsitequery('ChangeAssetOnSiteState', params.join(String.fromCharCode(170)), function (r) {
$("#dialogmask").hide();
if (r !== 'OK') {
showAlert(r, GetTextByKey("P_JS_ASSETASSIGNMENT", "Asset Assignment"));
}
});
}
var allMachines;
var _availableMachines = [];
var _selectedMachines = [];
var _showSelectedMachines = [];
function OnManageMachine(job) {
//$('#chk_showallassignedassets').prop('checked', false);
//$('#txt_machine_key').val('');
jobsite = job;
if (!jobsite) {
jobsiteid = undefined;
return;
}
jobsiteid = jobsite.ID;
$('#machine-name').text(jobsite.Name);
_selectedMachines = jobsite.Machines == null ? [] : jobsite.Machines;
_showSelectedMachines = jobsite.Machines == null ? [] : jobsite.Machines;
var title = GetTextByKey("P_JS_MANAGEASSETS", "Manage Assets");// + "&nbsp;&nbsp;&nbsp;&nbsp;" + jobsite.Name + "&nbsp;&nbsp;&nbsp;&nbsp;" + "Radius_UOM: " + jobsite.Radius_UOM
$('#dialog_managemahchine .dialog-title span.title').html(title);
showmaskbg(true);
$('#dialog_managemahchine')
.attr('init', 1)
.css({
'top': (document.documentElement.clientHeight - $('#dialog_managemahchine').height()) / 3,
'left': (document.documentElement.clientWidth - $('#dialog_managemahchine').width()) / 2
}).showDialog();
grid_dtsm.setData([]);
$('#selectedmachinelist input[type="checkbox"]').prop('checked', false);
GetSelectedMachines();
}
function GetSelectedMachines() {
_selectedMachines = [];
$("#dialogmask").show();
_network.jobsitequery('GetSelectedAssets', String.fromCharCode(170) + jobsiteid, function (data) {
if (typeof data === "string") {
showAlert(data, GetTextByKey("P_JS_ASSETASSIGNMENT", "Asset Assignment"));
return;
}
_selectedMachines = data;
showSelectedMachine(_selectedMachines);
$("#dialogmask").hide();
}, function (e) {
$("#dialogmask").hide();
});
}
function getMatchAvailableMachines() {
getMatchSelectedMachines();
var selected = [];
for (var i = 0; i < _showSelectedMachines.length; i++) {
var m = _showSelectedMachines[i];
selected.push(m.ID);
}
var typeid = $('#sel_machine_type').val();
var machinefilter = $('#txt_machine_key').val().toLowerCase();
_availableMachines = [];
for (var i = 0; i < allMachines.length; i++) {
var m = allMachines[i];
if ((typeid == -1 || typeid == m.TypeID)
&& (machinefilter == "" || m.VIN.toLowerCase().indexOf(machinefilter) >= 0
|| m.DisplayName.toLowerCase().indexOf(machinefilter) >= 0)
&& $.inArray(m.ID, selected) < 0) {
_availableMachines.push(m);
}
}
showAvailableMachine(_availableMachines);
}
function getMatchSelectedMachines() {
var typeid = $('#sel_machine_type').val();
var machinefilter = $('#txt_machine_key').val().toLowerCase();
var showallassigned = $('#chk_showallassignedassets').prop('checked');
_showSelectedMachines = [];
var unMatched = [];
for (var i = 0; i < _selectedMachines.length; i++) {
var m = _selectedMachines[i];
m.Highlight = false;
if ((typeid == -1 || typeid == m.TypeID)
&& (machinefilter == "" || m.VIN.toLowerCase().indexOf(machinefilter) >= 0
|| m.DisplayName.toLowerCase().indexOf(machinefilter) >= 0)) {
matched = true;
m.Highlight = showallassigned && (machinefilter !== "" || typeid != -1);
_showSelectedMachines.push(m);
}
else if (showallassigned)
unMatched.push(m);
}
for (var i in unMatched)
_showSelectedMachines.push(unMatched[i]);
showSelectedMachine(_showSelectedMachines);
}
function showMachines() {
showAvailableMachine(_availableMachines);
showSelectedMachine(_showSelectedMachines);
}
function showAvailableMachine(data) {
var rows = [];
for (var i = 0; i < data.length; i++) {
var r = data[i];
r.State = "UNASSIGNED";
var fr = { Values: r };
rows.push(fr);
}
grid_dtam.setData(rows);
}
function showSelectedMachine(data) {
var rows = [];
for (var i = 0; i < data.length; i++) {
var r = data[i];
var fr = { Values: r };
rows.push(fr);
}
grid_dtsm.setData(rows);
}
var grid_dtam;
function InitGridAvailableMachines() {
grid_dtam = new GridView('#availablemachinelist');
grid_dtam.lang = {
all: GetTextByKey("P_GRID_ALL", "(All)"),
ok: GetTextByKey("P_GRID_OK", "OK"),
reset: GetTextByKey("P_GRID_RESET", "Reset")
};
var list_columns = [
{ name: 'DisplayName', caption: "Asset Name", valueIndex: 'DisplayName', css: { 'width': 170, 'text-align': 'left' } },
{ name: 'State', caption: "Current State", valueIndex: 'State', css: { 'width': 100, 'text-align': 'left' } },
{ name: 'DistanceFromSite', caption: "Distance From Site", valueIndex: 'DistanceFromSite', css: { 'width': 130, 'text-align': 'right' } }
];
var columns = [];
// head
for (var hd in list_columns) {
var col = {};
col.name = list_columns[hd].name;
col.caption = list_columns[hd].caption;
col.visible = true;
col.sortable = true;
col.width = list_columns[hd].css.width;
col.align = list_columns[hd].css["text-align"]
col.key = list_columns[hd].valueIndex;
columns.push(col);
col.styleFilter = function (e) {
if (jobsite.Radius > 0) {//圆形JobSite
if (e.DistanceFromSite <= jobsite.Radius) {
e.State = "SUGGESTED";
return { 'background-color': '#ffff99' };
}
}
else {//多边形JobSite
if (e.WithinSite) {
e.State = "SUGGESTED";
return { 'background-color': '#ffff99' };
}
}
};
}
grid_dtam.canMultiSelect = true;
grid_dtam.columns = columns;
grid_dtam.init();
grid_dtam.rowdblclick = function (rowindex) {
var rowdata = grid_dtam.source[rowindex];
if (rowdata) {
var machine = rowdata.Values;
_availableMachines.splice(_availableMachines.indexOf(machine), 1);
machine.OnSite = true;
_selectedMachines.push(machine);
_showSelectedMachines.push(machine);
showMachines();
}
};
grid_dtam.selectedrowchanged = function (rowindex) {
var rowdata = grid_dtam.source[rowindex];
if (rowdata) {
}
}
}
var grid_dtsm;
function InitGridSelectedMachines() {
grid_dtsm = new GridView('#selectedmachinelist');
grid_dtsm.lang = {
all: GetTextByKey("P_GRID_ALL", "(All)"),
ok: GetTextByKey("P_GRID_OK", "OK"),
reset: GetTextByKey("P_GRID_RESET", "Reset")
};
var list_columns = [
{ name: 'OnSite', caption: GetTextByKey("P_JS_ONSITE", "On Site"), valueIndex: 'OnSite', type: 3, css: { 'width': 60, 'text-align': 'center' } },
{ name: 'DisplayName', caption: GetTextByKey("P_JS_ASSETNAME", "Asset Name"), valueIndex: 'Name', css: { 'width': 170, 'text-align': 'left' } },
{ name: 'MakeName', caption: GetTextByKey("P_JS_MAKE", "Make"), valueIndex: 'MakeName', css: { 'width': 90, 'text-align': 'left' } },
{ name: 'ModelName', caption: GetTextByKey("P_JS_MODEL", "Model"), valueIndex: 'ModelName', css: { 'width': 90, 'text-align': 'left' } },
{ name: 'TypeName', caption: GetTextByKey("P_JS_TYPE", "Type"), valueIndex: 'TypeName', css: { 'width': 170, 'text-align': 'left' } }
];
var columns = [];
// head
for (var hd in list_columns) {
var col = {};
col.name = list_columns[hd].name;
col.caption = list_columns[hd].caption;
col.visible = true;
col.sortable = true;
col.width = list_columns[hd].css.width;
col.align = list_columns[hd].css["text-align"]
col.key = list_columns[hd].valueIndex;
if (list_columns[hd].type) {
col.type = list_columns[hd].type;
}
col.allowFilter = (col.key === 'TypeName');
col.styleFilter = function (item) {
if (item.Highlight)
return { 'background-color': 'yellow' };
}
if (col.key === 'OnSite') {
col.events = {
onclick: function (e) {
OnSiteChanging(this, e.target);
return false;
},
onchange: OnSiteChanged
};
}
columns.push(col);
}
columns.push({
name: 'delete',
width: 30,
align: 'center',
sortable: false,
isurl: true,
text: '\uf00d',
events: {
onclick: function () {
OnMachineDeleteSingle(this);
}
},
classFilter: function (e) {
return "icon-col";
},
attrs: { 'title': 'Delete' }
});
grid_dtsm.canMultiSelect = true;
grid_dtsm.columns = columns;
grid_dtsm.init();
//grid_dtsm.rowdblclick = function (rowindex) {
// var rowdata = grid_dtsm.source[rowindex];
// if (rowdata) {
// var machine = rowdata.Values;
// _selectedMachines.splice(_selectedMachines.indexOf(machine), 1);
// _showSelectedMachines.splice(_showSelectedMachines.indexOf(machine), 1);
// _availableMachines.push(machine);
// showMachines();
// }
//};
grid_dtsm.selectedrowchanged = function (rowindex) {
var rowdata = grid_dtsm.source[rowindex];
if (rowdata) {
}
}
}
function OnEditorAdd() {
var indexs = grid_dtam.selectedIndexes;
if (indexs.length <= 0)
return;
for (var i = 0; i < indexs.length; i++) {
var index = indexs[i];
var m = grid_dtam.source[index].Values;
_availableMachines.splice(_availableMachines.indexOf(m), 1);
m.OnSite = true;
_selectedMachines.push(m);
_showSelectedMachines.push(m);
}
showMachines();
}
function OnEditorAddAll() {
for (var i = 0; i < _availableMachines.length; i++) {
var m = _availableMachines[i];
m.OnSite = true;
_selectedMachines.push(m);
_showSelectedMachines.push(m);
}
_availableMachines = [];
showMachines();
}
function OnEditorRemove() {
var indexs = grid_dtsm.selectedIndexes;
if (indexs.length <= 0)
return;
for (var i = 0; i < indexs.length; i++) {
var index = indexs[i];
var m = grid_dtsm.source[index].Values;
_selectedMachines.splice(_selectedMachines.indexOf(m), 1);
_showSelectedMachines.splice(_showSelectedMachines.indexOf(m), 1);
_availableMachines.push(m);
}
showMachines();
}
function OnEditorRemoveAll() {
for (var i = 0; i < _showSelectedMachines.length; i++) {
var m = _showSelectedMachines[i];
_selectedMachines.splice(_selectedMachines.indexOf(m), 1);
_availableMachines.push(m);
}
_showSelectedMachines = [];
showMachines();
}
function OnSaveMachine() {
var item = {
'ID': jobsiteid,
'Machines': []
};
for (var i = 0; i < grid_dtsm.innerSource.length; i++) {
var m = grid_dtsm.innerSource[i].Values;
item.Machines.push({
'AssetId': m.AssetId,
'VIN': m.VIN,
'OnSite': m.OnSite
});
}
var param = JSON.stringify(item);
param = htmlencode(param);
var alerttitle = GetTextByKey("P_JS_SAVEJSASSETS", "Save Jobsite Assets");
_network.jobsitequery("SaveJobSiteMachines", param, function (data) {
if (data !== 'OK') {
showAlert(data, alerttitle);
} else {
$('#dialog_managemahchine').hideDialog();
OnRefresh();
}
}, function (err) {
showAlert(GetTextByKey("P_JS_FAILEDTOSAVETHISJOBSITE", "Failed to save jobsite assets."), alerttitle);
});
}
/**************************End JobSite Machine********************************/
/*****************************************************************************/
function cellClick(e) {
var tr = $(e.target).parent();
if (!tr.is("tr"))
return;
var machine = tr.data("machine");
var slectedclass = tr.attr("class");
if (slectedclass === "itemselcted") {
tr.removeClass('itemselcted');
if ((jobsite.Radius > 0 && machine.DistanceFromSite <= jobsite.Radius)
|| machine.WithinSite) {
tr.addClass("itemsuggested");
}
}
else {
tr.addClass('itemselcted');
tr.removeClass('itemsuggested');
}
}
function cellTypeClick(e) {
var tr = $(e.target).parent();
if (!tr.is("tr"))
return;
if (tr.attr("class") === "itemselcted")
tr.removeClass('itemselcted');
else
tr.addClass('itemselcted');
}
function machineTypeClick(e) {
cellTypeClick(e);
getMatchAvailableMachines();
}
function searchEnter(e) {
if (e.keyCode == 13) {
getMatchAvailableMachines();
}
}
var jobsitetypesdata;
function getJobsiteTypes() {
_network.jobsitequery('GetJobSiteTypes', '', function (data) {
if (typeof (data) === "string") {
showAlert(data, GetTextByKey("P_AM_ERROR", 'Error'));
return;
}
var items = [];
for (var i = 0; i < data.length; i++) {
items.push({ 'Key': data[i], 'Value': data[i] })
}
jobsitetypeparam = {
items: items,
selectedvalue: []
};
jobsitetypesdata = data;
var iptalertype = editmultiselect(jobsitetypeparam);
$('#div_jobsitetype').append(iptalertype);
});
}
$(function () {
setPageTitle(GetTextByKey("P_JOBSITES", "Jobsites"), true);
$('.iconlayout').on('click', function (ev) {
CreateLayoutMenus(ev.target, gridLayoutID, grid_dt);
return false;
});
InitGridData();
InitGridSelectedMachines();
getJobsiteTypes();
$('#tbody_jobsite').click(function (e) {
var target = $(e.target);
if (!target.is('tr')) {
target = target.parents('tr');
}
$('#tbody_jobsite tr').removeClass('selected');
target.addClass('selected');
});
$('#dialog_managemahchine').dialog(function () {
showmaskbg(false);
});
$('#dialog_import').dialog(function () {
showmaskbg(false);
});
//$("#sel_machine_type").change(getMatchAvailableMachines);
//$('#txt_machine_key').keydown(searchEnter);
//$('#btnFilter').click(getMatchAvailableMachines);
//$('#chk_showallassignedassets').click(getMatchSelectedMachines);
if (!canExport) {
$('#spExport').hide();
}
$(window).resize(function () {
$("#jobsitelist").css("height", $(window).height() - $("#jobsitelist").offset().top - 4);
grid_dt && grid_dt.resize();
var top = (document.documentElement.clientHeight - $('#dialog_managemahchine').height()) / 3;
var left = (document.documentElement.clientWidth - $('#dialog_managemahchine').width()) / 2;
if (top < 0) top = 0;
if (left < 0) left = 0;
$('#dialog_managemahchine').css({ 'top': top, 'left': left });
var top1 = (document.documentElement.clientHeight - $('#dialog_layout').height()) / 3;
var left1 = (document.documentElement.clientWidth - $('#dialog_layout').width()) / 2;
if (top1 < 0) top1 = 0;
if (left1 < 0) left1 = 0;
$('#dialog_layout').css({ 'top': top1, 'left': left1 });
var top2 = (document.documentElement.clientHeight - $('#dialog_import').height()) / 3;
var left2 = (document.documentElement.clientWidth - $('#dialog_import').width()) / 2;
if (top2 < 0) top2 = 0;
if (left2 < 0) left2 = 0;
$('#dialog_import').css({ 'top': top2, 'left': left2 });
}).resize();
//OnRefresh();
$('#searchinputtxt').keydown(searchEnter);
});
function searchEnter(e) {
if (e.keyCode == 13 || e.keyCode == 9) {
OnRefresh();
}
}
function OnExport() {
var searchtxt = "";
searchtxt = htmlencode($.trim($('#searchinputtxt').val()));
var jobsitetypes = [];
if (jobsitetypeparam)
jobsitetypes = jobsitetypeparam.selectedvalue;
var active = $('#chk_activesitesonly').prop('checked');
var layout = getLayoutOnGrid(grid_dt);
var ps = ["jobsites", searchtxt, JSON.stringify(jobsitetypes), active ? 1 : 0, JSON.stringify(layout)];
var data = new FormData();
data.append('type', 'set');
data.append('ClientData', JSON.stringify(ps));
$.ajax({
url: "../ExportToFile.aspx",
type: 'POST',
dataType: 'json',
processData: false,
contentType: false,
data: data,
success: function (data) {
if (data && data != "")
window.open("../ExportToFile.aspx?type=exp&key=" + data);
},
error: function (err) {
}
});
}
//****************************Start Import******************************************//
function getcolumnsdata() {
var columnsdata = [
{ Id: "Name", Name: GetTextByKey("P_JS_NAME", "Name") },
{ Id: "Region", Name: GetTextByKey("P_JS_REGION", "Region") },
{ Id: "Number", Name: GetTextByKey("P_JS_NUMBER", "Number") },
{ Id: "Code", Name: GetTextByKey("P_JS_CODE", "Code") },
{ Id: "Types", Name: GetTextByKey("P_JS_TYPES", "Types") },
{ Id: "Latitude", Name: GetTextByKey("P_JS_LATITUDE", "Latitude") },
{ Id: "Longitude", Name: GetTextByKey("P_JS_LONGITUDE", "Longitude") },
{ Id: "Color", Name: GetTextByKey("P_JS_COLOR", "Color") },
{ Id: "Radius", Name: GetTextByKey("P_JS_RADIUS", "RadiusStr") },
{ Id: "Foreman", Name: GetTextByKey("P_JS_FOREMAN", "Foreman") },
{ Id: "Manager", Name: GetTextByKey("P_JS_MANAGER", "Manager") },
{ Id: "Phone", Name: GetTextByKey("P_JS_PHONE", "Phone") },
{ Id: "Email", Name: GetTextByKey("P_JS_EMAIL", "Email") },
{ Id: "Group", Name: GetTextByKey("P_JS_GROUP", "Group") },
{ Id: "Delivery Address 1", Name: GetTextByKey("P_JS_DELIVERYADDRESS1", "Delivery Address 1") },
{ Id: "Delivery Address 2", Name: GetTextByKey("P_JS_DELIVERYADDRESS2", "Delivery Address 2") },
{ Id: "City", Name: GetTextByKey("P_JS_CITY", "City") },
{ Id: "State", Name: GetTextByKey("P_JS_STATE", "State") },
{ Id: "Zip", Name: GetTextByKey("P_JS_ZIP", "Zip") },
{ Id: "County", Name: GetTextByKey("P_JS_COUNTY", "County") },
{ Id: "Start Date", Name: GetTextByKey("P_JS_STATDATE", "Start Date") },
{ Id: "Projected End Date", Name: GetTextByKey("P_JS_PROJECTEDENDDATE", "Projected End Date") },
{ Id: "End Date", Name: GetTextByKey("P_JS_ENDDATE", "End Date") },
{ Id: "Notes", Name: GetTextByKey("P_JS_NOTES", "Notes") },
];
return columnsdata;
}
var fildata;
function OnImport() {
var file = $('<input type="file" style="display: none;" accept=".xlsx" />');
file.change(function () {
fildata = this.files[0];
var formData = new FormData();
formData.append("iconFile", fildata);
formData.append("MethodName", "GetImportJobsiteColumns");
formData.append("ClientData", '');
$.ajax({
url: 'JobSIteManage.aspx',
type: 'POST',
dataType: 'json',
processData: false,
contentType: false,
data: formData,
async: true,
success: function (data) {
if (typeof (data) === "string") {
showAlert(data, GetTextByKey("P_JS_IMPORT", 'Import'));
} else {
CreateImportColumns(data);
$('#dialog_import')
.attr('act', 'add')
.css({
'top': (document.documentElement.clientHeight - $('#dialog_import').height()) / 3,
'left': (document.documentElement.clientWidth - $('#dialog_import').width()) / 2
})
.showDialogfixed();
}
},
error: function (err) {
showAlert(err.statusText, GetTextByKey("P_JS_IMPORT", 'Import'));
}
});
}).click();
}
function CreateImportColumns(excelcolumns) {
var tb = $('#tb_import');
tb.empty();
var columnsdata = getcolumnsdata();
for (var i = 0; i < columnsdata.length; i++) {
var col = columnsdata[i];
var tr = $('<tr></tr>');
tb.append(tr);
var td = $('<td class="label" style="width:130px;">' + col.Name + '</td>');
tr.append(td);
td = $('<td></td>');
tr.append(td);
var sel = CreateSelect(excelcolumns, col.Id);
td.append(sel);
}
}
function CreateSelect(excelcolumns, colid) {
var sel = $('<select style="width:180px;" name="sel_import"></select>').data('id', colid);
sel.append('<option></option>');
if (excelcolumns && excelcolumns.length > 0) {
for (var i = 0; i < excelcolumns.length; i++) {
var op = $('<option></option>').text(excelcolumns[i]).val(excelcolumns[i]);
sel.append(op);
}
sel.val(colid);
}
return sel;
}
var importing = false;
function OnImportJobsites() {
if (!fildata)
return;
if (importing) return;
importing = true;
var item = [];
var sels = $("select[name='sel_import']");
for (var i = 0; i < sels.length; i++) {
var sel = sels[i];
var kv = { Key: $(sel).data('id'), Value: $(sel).val() };
item.push(kv);
}
var param = JSON.stringify(item);
param = htmlencode(param);
var formData = new FormData();
formData.append("iconFile", fildata);
formData.append("MethodName", "ImportJobsites");
formData.append("ClientData", param);
$.ajax({
url: 'JobSIteManage.aspx',
type: 'POST',
dataType: 'json',
processData: false,
contentType: false,
data: formData,
async: true,
success: function (data) {
importing = false;
if (typeof (data) === "string") {
showAlert(data, GetTextByKey("P_JS_IMPORT", 'Import'));
} else {
showAlert(data + GetTextByKey("P_JS_JOBSITESIMPORTEDSUCCESSFULLY", ' jobsite(s) imported successfully.'), GetTextByKey("P_JS_IMPORT", 'Import Jobsites'));
$('#dialog_import').hideDialog();
if (data > 0)
OnRefresh();
}
},
error: function (err) {
importing = false;
showAlert(err.statusText, GetTextByKey("P_JS_IMPORT", 'Import'));
}
});
}
//****************************End Import******************************************//
function AutoCreateConfig() {
execIframeFunc("init", [], "iframejobsiteacconfig");
ShowACDialog();
}
</script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
<div id="contentctrl">
<div class="page_title" data-lgid="P_JOBSITES"></div>
<div class="search_bar">
<input type="password" autocomplete="new-password" style="display: none" />
<span data-lgid="P_JS_TYPE_COLON">Type:</span>
<div id="div_jobsitetype"></div>
<input type="text" id="searchinputtxt" autocomplete="off" style="margin-left: 5px;" />
<input class="search" type="button" onclick="OnRefresh();" value="Search" data-lgid="P_CM_SEARCH" style="margin-left: 5px;" />
<input id="chk_activesitesonly" type="checkbox" onclick="OnRefresh();" />
<label data-lgid="P_JS_ACTIVESITESONLY" for="chk_activesitesonly">Active Sites Only</label>
</div>
<div class="function_title">
<span class="sbutton iconadd" onclick="OnAdd();" data-lgid="P_JS_ADD"></span>
<span class="sbutton iconrefresh" onclick="OnRefresh();" data-lgid="P_JS_REFRESH"></span>
<span class="sbutton iconimport" onclick="OnImport();" data-lgid="P_JS_IMPORT">Import</span>
<span id="spExport" class="sbutton iconexport" onclick="OnExport();" data-lgid="P_MR_EXPORTTOEXCEL">Export to Excel</span>
<%if (CanConfig)
{%>
<span class="sbutton iconcog" onclick="AutoCreateConfig();" data-lgid="P_JS_CONFIGURATION">Configuration</span>
<%}%>
<span class="sbutton iconlayout iconmenu" data-lgid="P_MR_LAYOUT">Layout</span>
</div>
<div id="jobsitelist"></div>
</div>
<div id="mask_bg" style="display: none;">
<div class="loading c-spin"></div>
</div>
<div class="dialog" id="dialog_managemahchine" style="display: none;">
<div class="dialog-title"><span id="spTitle" class="title" data-lgid="P_JS_MANAGEASSETS"></span><em class="dialog-close"></em></div>
<div class="machine_filter" style="display: none">
<span style="margin-left: 10px;" data-lgid="P_JS_TYPE">Type: </span>
<select id="sel_machine_type" tabindex="20"></select>
<input type="text" id="txt_machine_key" tabindex="21" />
<input type="button" class="ybutton" id="btnFilter" value="Filter" tabindex="22" />
<span id="span_text_holder" style="display: none;"></span>
</div>
<div class="machine_filter" style="margin: 9px 6px 7px">
<span class="sbutton iconadd" onclick="OnMachineAdd()" data-lgid="P_JS_ADD">Add</span>
<span class="sbutton iconrefresh" onclick="GetSelectedMachines()" data-lgid="P_JS_REFRESH"></span>
</div>
<div class="machine_title">
<div id="machine-name"></div>
</div>
<div class="div_machines">
<table class="table_holder">
<thead>
<tr style="display: none">
<td>Available Assets</td>
<td></td>
<td>Assigned Assets
<input type="checkbox" id="chk_showallassignedassets" title="When checked, all associated or linked items will display regardless of filter. " /><label for="chk_showallassignedassets">Show All Assigned</label>
</td>
</tr>
</thead>
<tbody>
<tr>
<td style="display: none">
<div id="availablemachinelist" style="height: 400px; width: 430px;"></div>
</td>
<td class="td_controller" style="display: none">
<input class="ctl_button" type="button" value="&#xe62b;" onclick="OnEditorAdd();" tabindex="23" />
<input class="ctl_button" type="button" value="&#xe632;" onclick="OnEditorAddAll();" tabindex="24" />
<input class="ctl_button" type="button" value="&#xe62a;" onclick="OnEditorRemove();" tabindex="25" />
<input class="ctl_button" type="button" value="&#xe631;" onclick="OnEditorRemoveAll();" tabindex="26" />
</td>
<td style="padding: 0 4px">
<div id="selectedmachinelist" style="height: 500px; width: 780px;"></div>
</td>
</tr>
</tbody>
</table>
</div>
<div class="dialog-func">
<input type="button" value="Close" data-lgid="P_JS_CLOSE" class="dialog-close" tabindex="28" />
<%--<input type="button" onclick="OnSaveMachine();" value="OK" tabindex="27" />--%>
<div class="clear"></div>
</div>
<div id="dialogmask" class="maskbg" style="display: none;">
<div class="loading_icon icon c-spin"></div>
</div>
</div>
<div class="dialog subdialog" id="dialog_jobsite" style="display: none; border-bottom: 0; border-top: 0; min-width: 1330px;">
<%--<div class="dialog-title"><span class="title">Add Work Order</span></div>--%>
<iframe id="iframejobsite" src="AddJobSite.aspx" style="width: 100%; height: 100%; display: block; border: none;"></iframe>
<div class="maskbg" style="display: none;"></div>
</div>
<div class="dialog subdialog" id="dialog_jobsiteacconfig" style="display: none; border-bottom: 0; border-top: 0;">
<%--<div class="dialog-title"><span class="title">Add Work Order</span></div>--%>
<iframe id="iframejobsiteacconfig" src="JobsiteAutoCreateConfig.aspx" style="width: 100%; height: 100%; display: block; border: none;"></iframe>
<div class="maskbg" style="display: none;"></div>
</div>
<div class="dialog" id="dialog_import" style="display: none;">
<div class="dialog-title"><span class="title" data-lgid="P_JS_IMPORTJOBSITESFIELDMAPPING"></span><em class="dialog-close"></em></div>
<div class="machine_filter" style="margin: 9px 6px 7px; display: none;">
<span class="sbutton iconimport" onclick="OnImport()" data-lgid="P_JS_IMPORT">Add</span>
</div>
<div class="dialog-content adjust-content" style="height: 500px; overflow: auto;">
<table id="tb_import" class="table_holder">
</table>
</div>
<div class="dialog-func">
<input type="button" value="Close" data-lgid="P_JS_CANCEL" class="dialog-close" tabindex="28" />
<input type="button" onclick="OnImportJobsites();" value="OK" tabindex="27" />
<div class="clear"></div>
</div>
</div>
</asp:Content>