add site
This commit is contained in:
798
Site/SystemSettings/ManageLocations.aspx
Normal file
798
Site/SystemSettings/ManageLocations.aspx
Normal file
@ -0,0 +1,798 @@
|
||||
<%@ Page Title="" Language="C#" MasterPageFile="~/SystemSettings/SysSettingMasterPage.master" AutoEventWireup="true" CodeFile="ManageLocations.aspx.cs" Inherits="ManageLocations" %>
|
||||
|
||||
|
||||
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
|
||||
<style type="text/css">
|
||||
::-ms-clear, ::-ms-reveal {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.selectinput {
|
||||
width: 150px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.dialog-content table {
|
||||
border-collapse: collapse;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.dialog-content table td.label {
|
||||
width: 120px;
|
||||
text-align: right;
|
||||
padding-right: 10px;
|
||||
line-height: 24px;
|
||||
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-content table td input[type="checkbox"] {
|
||||
border: none;
|
||||
}
|
||||
|
||||
.dialog-content table td textarea {
|
||||
height: 100px;
|
||||
/*max-width: 200px;*/
|
||||
}
|
||||
|
||||
#dialogdatatb td {
|
||||
padding-top: 30px;
|
||||
}
|
||||
|
||||
.a {
|
||||
text-decoration: none;
|
||||
color: #2140fb;
|
||||
}
|
||||
|
||||
#basemapTitle {
|
||||
position: absolute;
|
||||
z-index: 2;
|
||||
bottom: 0px;
|
||||
width: 90%;
|
||||
color: #4c4c4c;
|
||||
margin: 0;
|
||||
font-size: 10px;
|
||||
line-height: 12px;
|
||||
display: block;
|
||||
padding: 2px 5%;
|
||||
background: #fff;
|
||||
background: rgba(255, 255, 255, 0.80);
|
||||
-webkit-border-radius: 0 0 5px 5px;
|
||||
-moz-border-radius: 0 0 5px 5px;
|
||||
-o-border-radius: 0 0 5px 5px;
|
||||
border-radius: 0 0 5px 5px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
|
||||
#basemapImg {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center center;
|
||||
-webkit-border-radius: 5px;
|
||||
-moz-border-radius: 5px;
|
||||
-o-border-radius: 5px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
#basemapgalleryDiv {
|
||||
position: absolute;
|
||||
right: 20px;
|
||||
top: 40px;
|
||||
z-index: 199;
|
||||
background-color: #EFEFEF;
|
||||
height: 75px;
|
||||
width: 75px;
|
||||
border: solid 1px #57585A;
|
||||
border-radius: 5px;
|
||||
padding: 1px;
|
||||
}
|
||||
|
||||
#basemapGallery {
|
||||
position: absolute;
|
||||
right: 15px;
|
||||
top: 35px;
|
||||
width: 370px;
|
||||
height: 120px;
|
||||
overflow: auto;
|
||||
display: none;
|
||||
z-index: 200;
|
||||
background-color: #EFEFEF;
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
//必须放在地图js之前
|
||||
var dojoConfig = {
|
||||
paths: {
|
||||
extras1: location.pathname.replace(/\/[^/]+$/, "") + "/../js/mapview"
|
||||
},
|
||||
cacheBust: true
|
||||
};
|
||||
</script>
|
||||
<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>
|
||||
<link rel="stylesheet" href="https://js.arcgis.com/3.40/esri/css/esri.css" />
|
||||
<script src="https://js.arcgis.com/3.40"></script>
|
||||
<script src="<%=GetFileUrlWithVersion("../js/editableselect.js")%>"></script>
|
||||
<script type="text/javascript" src="<%=GetFileUrlWithVersion("../js/mapcontrol.js")%>"></script>
|
||||
|
||||
<script type="text/javascript">
|
||||
var IsDealer = <%=IsDealer ?"true":"false"%>;
|
||||
var IsAdmin =<%=IsAdmin ?"true":"false"%>;
|
||||
var DataGrid = window.DataGrid || window['g5-datagrid'];
|
||||
|
||||
|
||||
function locationrequest(method, param, callback, error) {
|
||||
_network.request("SystemSettings/ManageLocations.aspx", -1, method, param, callback, error || function (e) {
|
||||
console.log(e);
|
||||
showmaskbg(false, true);
|
||||
showAlert(GetTextByKey('P_SET_QUERY', 'An unknown error occurred. Please refresh page.'), GetTextByKey('P_SET_QUERY', 'Query'));
|
||||
});
|
||||
}
|
||||
|
||||
function OnAdd(pid) {
|
||||
locationdata = undefined;
|
||||
locationID = undefined;
|
||||
pID = pid;
|
||||
|
||||
$('#dialog_name').val('');
|
||||
$('#dialog_code').val('');
|
||||
$('#dialog_longitude').val('');
|
||||
$('#dialog_latitude').val('');
|
||||
$('#dialog_address').val('');
|
||||
$('#dialog_address2').val('');
|
||||
$('#dialog_city').val('');
|
||||
editableSelectState.val('');
|
||||
$('#dialog_zip').val('');
|
||||
$('#dialog_notes').val('');
|
||||
$('#imgfilogo').attr('src', '');
|
||||
$('#trimg').hide();
|
||||
$('#dialog_location .dialog-title span.title').text(GetTextByKey("P_SET_ADDLOCATIONS", "Add Location"));
|
||||
|
||||
showmaskbg(true);
|
||||
$('#dialog_location')
|
||||
.attr('act', 'add')
|
||||
.css({
|
||||
'top': (document.documentElement.clientHeight - $('#dialog_location').height()) / 3,
|
||||
'left': (document.documentElement.clientWidth - $('#dialog_location').width()) / 2
|
||||
})
|
||||
.showDialogfixed();
|
||||
$('#dialog_name').focus();
|
||||
}
|
||||
|
||||
var locationID;
|
||||
var pID;
|
||||
var locationdata;
|
||||
function OnEdit() {
|
||||
locationdata = undefined;
|
||||
var index = vue.$refs.grid.selectedIndex;
|
||||
if (index < 0) {
|
||||
showAlert(GetTextByKey("P_SET_PLEASESELECTLOCATION", "Please select Location."), GetTextByKey("P_SET_EDITLOCATIONS", "Edit Location")); return;
|
||||
}
|
||||
var location = vue.$refs.grid.source[index];
|
||||
if (!location) {
|
||||
locationID = undefined;
|
||||
pID = undefined;
|
||||
return;
|
||||
}
|
||||
|
||||
locationID = location.ID;
|
||||
pID = location.PId;
|
||||
$('#dialog_name').val(location.Name);
|
||||
$('#dialog_code').val(location.Code);
|
||||
$('#dialog_longitude').val(location.Longitude);
|
||||
$('#dialog_latitude').val(location.Latitude);
|
||||
$('#dialog_address').val(location.Address);
|
||||
$('#dialog_address2').val(location.Address2);
|
||||
$('#dialog_city').val(location.City);
|
||||
editableSelectState.text(location.State);
|
||||
$('#dialog_zip').val(location.Zip);
|
||||
$('#dialog_notes').val(location.Notes);
|
||||
$('#imgfilogo').attr('src', '../titlelogo.ashx?tp=location&cmpid=' + location.ID + "&sn=" + Math.random() + "'");
|
||||
$('#trimg').show();
|
||||
$('#dialog_location .dialog-title span.title').text(GetTextByKey("P_SET_EDITLOCATIONS", "Edit Location"));
|
||||
showmaskbg(true);
|
||||
$('#dialog_location')
|
||||
.attr('act', 'edit')
|
||||
.css({
|
||||
'top': (document.documentElement.clientHeight - $('#dialog_location').height()) / 3,
|
||||
'left': (document.documentElement.clientWidth - $('#dialog_location').width()) / 2
|
||||
})
|
||||
.showDialogfixed();
|
||||
$('#dialog_name').focus();
|
||||
}
|
||||
|
||||
function OnDblClick(e) {
|
||||
OnEdit();
|
||||
}
|
||||
|
||||
function OnDelete() {
|
||||
var index = vue.$refs.grid.selectedIndex;
|
||||
if (index < 0) {
|
||||
return;
|
||||
}
|
||||
var loc = vue.$refs.grid.source[index];
|
||||
if (!loc) {
|
||||
return;
|
||||
}
|
||||
showConfirm(GetTextByKey("P_SET_DOYOUWANTTODELETETHELOCATION", 'Do you want to delete the location?'), GetTextByKey("P_SET_DELETELOCATIONS", "Delete Location"), function () {
|
||||
locationrequest("DeleteCustomerLocation", loc.ID, function (data) {
|
||||
if (typeof (data) === "string") {
|
||||
showAlert(data, GetTextByKey("P_SET_DELETELOCATIONS", "Delete Location"));
|
||||
}
|
||||
else
|
||||
OnRefresh();
|
||||
}, function (err) {
|
||||
showAlert(GetTextByKey("P_SET_FAILEDTODELETETHISLOCATION", 'Failed to delete this Location.'), GetTextByKey("P_SET_DELETELOCATIONS", "Delete Location"));
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function OnRefresh() {
|
||||
showloading(true);
|
||||
|
||||
var searchtxt = "";
|
||||
searchtxt = htmlencode($.trim($('#searchinputtxt').val()));
|
||||
locationrequest("GetCustomerLocations", searchtxt, function (data) {
|
||||
showloading(false);
|
||||
if (typeof (data) === "string") {
|
||||
showAlert(data, GetTextByKey("P_SET_ERROR", 'Error'));
|
||||
return;
|
||||
}
|
||||
|
||||
showLocations(data);
|
||||
}, function (err) {
|
||||
console.log(err);
|
||||
showloading(false);
|
||||
});
|
||||
}
|
||||
|
||||
function showLocations(data) {
|
||||
for (var i = 0; i < data.length; i++) {
|
||||
var r = data[i];
|
||||
r.LogoUrl = "../titlelogo.ashx?tp=location&cmpid=" + r.ID + "&sn=" + Math.random();
|
||||
r.Edit = "\uf044";
|
||||
r.Delete = "\uf00d";
|
||||
}
|
||||
vue.source = data;
|
||||
}
|
||||
|
||||
var vue;
|
||||
//加载表格
|
||||
function initGrid() {
|
||||
showmaskbg(true);
|
||||
vue = new Vue({
|
||||
el: "#locationlist",
|
||||
components: {
|
||||
'data-grid': DataGrid
|
||||
},
|
||||
data: {
|
||||
columns: CreateStyleColumn(),
|
||||
source: [],
|
||||
totalRow: null
|
||||
},
|
||||
methods: {
|
||||
rowdblclick: function () {
|
||||
OnEdit();
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
showmaskbg(false);
|
||||
}
|
||||
//创建列表的行
|
||||
function CreateStyleColumn() {
|
||||
var list_columns = [
|
||||
{ name: 'Name', caption: GetTextByKey("P_SET_LOCATIONSNAME", "Location Name"), valueIndex: 'Name', type: 0, css: { 'width': 200, 'text-align': 'left' } },
|
||||
{ name: 'Code', caption: GetTextByKey("P_SET_CODE", "Code"), valueIndex: 'Code', type: 0, css: { 'width': 200, 'text-align': 'left' } },
|
||||
//{ name: 'Latitude', caption: GetTextByKey("P_SET_LATITUDE", "Latitude"), valueIndex: 'Latitude', type: 0, css: { 'width': 150, 'text-align': 'left' } },
|
||||
//{ name: 'Longitude', caption: GetTextByKey("P_SET_LONGITUDE", "Longitude"), valueIndex: 'Longitude', type: 0, css: { 'width': 150, 'text-align': 'left' } },
|
||||
{ name: 'Address', caption: GetTextByKey("P_SET_ADDRESS1", "Address 1"), valueIndex: 'Address', type: 0, css: { 'width': 200, 'text-align': 'left' } },
|
||||
{ name: 'Address2', caption: GetTextByKey("P_SET_ADDRESS2", "Address 2"), valueIndex: 'Address2', type: 0, css: { 'width': 200, 'text-align': 'left' } },
|
||||
{ name: 'City', caption: GetTextByKey("P_SET_CITY", "City"), valueIndex: 'City', type: 0, css: { 'width': 150, 'text-align': 'left' } },
|
||||
{ name: 'State', caption: GetTextByKey("P_SET_STATE", "State"), valueIndex: 'State', type: 0, css: { 'width': 150, 'text-align': 'left' } },
|
||||
{ name: 'Zip', caption: GetTextByKey("P_SET_ZIP", "Zip"), valueIndex: 'Zip', type: 0, css: { 'width': 150, 'text-align': 'left' } },
|
||||
{ name: 'LogoUrl', caption: GetTextByKey("P_SET_LOGO", "Logo"), valueIndex: "LogoUrl", type: 7, css: { 'width': 80, 'text-align': 'left' } },
|
||||
{ name: 'Notes', caption: GetTextByKey("P_SET_NOTES", "Notes"), valueIndex: 'Notes', type: 0, css: { 'width': 280, 'text-align': 'left' } },
|
||||
{ name: 'AddSub', caption: "", valueIndex: 'Add', type: 5, css: { 'width': 30, 'text-align': 'center' } },
|
||||
{ name: 'Location', caption: "", valueIndex: 'Location', type: 5, css: { 'width': 30, 'text-align': 'center' } },
|
||||
{ name: 'Edit', caption: "", valueIndex: 'Edit', type: 5, css: { 'width': 30, 'text-align': 'center' } },
|
||||
{ name: 'Delete', caption: "", valueIndex: 'Delete', type: 5, 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.type = list_columns[hd].type;
|
||||
col.enabled = true;
|
||||
col.width = list_columns[hd].css.width;
|
||||
col.align = list_columns[hd].css["text-align"]
|
||||
col.key = list_columns[hd].valueIndex;
|
||||
if (col.name === "Name") {
|
||||
col.styleFilter = function (e) {
|
||||
if (e.PId > 0)
|
||||
return { 'padding-left': '24px' };
|
||||
else
|
||||
return { 'font-weight': 'bold' };
|
||||
}
|
||||
}
|
||||
else if (col.name === "AddSub") {
|
||||
col.onclick = function (e) {
|
||||
var index = vue.$refs.grid.selectedIndex;
|
||||
if (index < 0) return;
|
||||
var dep = vue.$refs.grid.source[index];
|
||||
OnAdd(dep.ID);
|
||||
};
|
||||
col.filter = function (e) {
|
||||
if (e.PId > 0)
|
||||
return "";
|
||||
else
|
||||
return "\uf067";
|
||||
}
|
||||
col.styleFilter = function (e) {
|
||||
if (e.PId > 0)
|
||||
return { 'dispaly': 'none' };
|
||||
else
|
||||
return {
|
||||
'font-family': 'FontAwesome',
|
||||
'cursor': 'pointer',
|
||||
'color': 'rgb(123, 28, 33)'
|
||||
};
|
||||
}
|
||||
col.attrs = { 'title': GetTextByKey("P_SET_ADD", 'Add') };
|
||||
}
|
||||
else if (col.name === "LogoUrl") {
|
||||
col.styleFilter = function (item) {
|
||||
return { width: '60px' };
|
||||
}
|
||||
}
|
||||
else if (col.name === "Edit") {
|
||||
col.onclick = function (e) {
|
||||
OnEdit();
|
||||
};
|
||||
col.styleFilter = function (e) {
|
||||
return {
|
||||
'font-family': 'FontAwesome',
|
||||
'cursor': 'pointer',
|
||||
'color': 'rgb(123, 28, 33)'
|
||||
};
|
||||
}
|
||||
col.attrs = { 'title': GetTextByKey("P_SET_EDIT", 'Edit') };
|
||||
}
|
||||
else if (col.name === "Delete") {
|
||||
col.onclick = function (e) {
|
||||
OnDelete();
|
||||
};
|
||||
col.styleFilter = function (e) {
|
||||
return {
|
||||
'font-family': 'FontAwesome',
|
||||
'cursor': 'pointer',
|
||||
'color': 'rgb(123, 28, 33)'
|
||||
};
|
||||
}
|
||||
col.attrs = { 'title': GetTextByKey("P_SET_DELETE", 'Delete') };
|
||||
}
|
||||
else if (col.name === "Location") {
|
||||
col.onclick = function (e, item) {
|
||||
locationdata = item;
|
||||
SelectLocation();
|
||||
};
|
||||
col.filter = function (e) {
|
||||
return "\uf3c5";
|
||||
}
|
||||
col.styleFilter = function (e) {
|
||||
return {
|
||||
'font-family': 'FontAwesome',
|
||||
'cursor': 'pointer',
|
||||
'color': 'rgb(123, 28, 33)'
|
||||
};
|
||||
}
|
||||
col.attrs = { 'title': GetTextByKey("P_SET_SELECTLOCATION", 'Select Location') };
|
||||
}
|
||||
columns.push(col);
|
||||
}
|
||||
return columns;
|
||||
}
|
||||
|
||||
function OnDialogOK() {
|
||||
var item = {
|
||||
'Name': $.trim($('#dialog_name').val()),
|
||||
'Code': $.trim($('#dialog_code').val()),
|
||||
'Latitude': $.trim($('#dialog_latitude').val()),
|
||||
'Longitude': $.trim($('#dialog_longitude').val()),
|
||||
'Address': $.trim($('#dialog_address').val()),
|
||||
'Address2': $.trim($('#dialog_address2').val()),
|
||||
'City': $.trim($('#dialog_city').val()),
|
||||
'State': $.trim(editableSelectState.text()),
|
||||
'Zip': $.trim($('#dialog_zip').val()),
|
||||
'Notes': $.trim($('#dialog_notes').val())
|
||||
};
|
||||
var alerttitle;
|
||||
if (locationID) {
|
||||
item.ID = locationID;
|
||||
item.PId = pID;
|
||||
alerttitle = GetTextByKey("P_SET_EDITLOCATIONS", "Edit Location");
|
||||
} else {
|
||||
item.ID = -1;
|
||||
item.PId = pID;
|
||||
alerttitle = GetTextByKey("P_SET_ADDLOCATIONS", "Add Location");
|
||||
}
|
||||
|
||||
if (!item.Name || item.Name.length == 0) {
|
||||
showAlert(GetTextByKey("P_SET_LOCATIONNAMECANNOTBEEMPTY", 'Location name cannot be empty.'), alerttitle);
|
||||
$('#dialog_name').focus();
|
||||
return;
|
||||
}
|
||||
if (item.Name.length > 100) {
|
||||
showAlert(GetTextByKey("P_SET_LOCATIONNAMEISTOOLONG", 'Location name is too long (> 100 characters).'), alerttitle);
|
||||
$('#dialog_name').focus();
|
||||
return;
|
||||
}
|
||||
|
||||
if (item.Latitude === "" || isNaN(item.Latitude) || item.Latitude > 90 || item.Latitude < -90)
|
||||
item.Latitude = 0;
|
||||
if (item.Longitude === "" || isNaN(item.Longitude) || item.Longitude > 180 || item.Longitude < -180)
|
||||
item.Longitude = 0;
|
||||
|
||||
if (item.Notes.length > 2000) {
|
||||
showAlert(GetTextByKey("P_SET_NOTESISTOOLONG", 'Notes is too long (> 2000 characters).'), alerttitle);
|
||||
$('#dialog_notes').focus();
|
||||
return;
|
||||
}
|
||||
|
||||
showloading(true);
|
||||
var formData = new FormData();
|
||||
formData.append("fiLogoFile", fiLogoFile);
|
||||
formData.append("MethodName", "SaveCustomerLocation");
|
||||
formData.append("ClientData", htmldecode(JSON.stringify(item)));
|
||||
|
||||
$.ajax({
|
||||
url: 'ManageLocations.aspx',
|
||||
type: 'POST',
|
||||
dataType: 'json',
|
||||
processData: false,
|
||||
contentType: false,
|
||||
data: formData,
|
||||
async: true,
|
||||
success: function (result) {
|
||||
showloading(false);
|
||||
if (result == "OK") {
|
||||
$('#dialog_location').hideDialog();
|
||||
fiLogoFile = undefined;
|
||||
OnRefresh();
|
||||
}
|
||||
else {
|
||||
showAlert(result, GetTextByKey("P_SET_SAVELOCATIONS", 'Save Location'));
|
||||
}
|
||||
},
|
||||
error: function (err) {
|
||||
showloading(false);
|
||||
showAlert(err.statusText, GetTextByKey("P_SET_SAVELOCATIONS", 'Save Location'));
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
var editableSelectState;
|
||||
$(function () {
|
||||
setPageTitle(GetTextByKey("P_SET_MANAGELOCATIONS", 'Manage Locations'), true);
|
||||
initGrid();
|
||||
$('#btnBrowseLogo').click(browseLogo);
|
||||
|
||||
editableSelectState = new $editableselect($("#dialog_state"), 50);
|
||||
editableSelectState.tabIndex(1);
|
||||
|
||||
OnRefresh();
|
||||
|
||||
getStates();
|
||||
|
||||
$('#dialog_location').dialog(function () {
|
||||
showmaskbg(false);
|
||||
});
|
||||
|
||||
$('#dialog_selectlocation').dialog(function () {
|
||||
if (!$("#dialog_location").is(":visible"))
|
||||
showmaskbg(false);
|
||||
});
|
||||
|
||||
$('#searchinputtxt').keydown(searchEnter);
|
||||
|
||||
$(window).resize(function () {
|
||||
$("#locationlist").css("height", $(window).height() - $("#locationlist").offset().top - 4);
|
||||
}).resize();
|
||||
|
||||
});
|
||||
|
||||
var statedata = [];
|
||||
function getStates() {
|
||||
statedata.push("AL", "AK", "AZ", "AR", "CA", "CO", "CT", "DE", "FL", "GA", "HI", "ID", "IL", "IN", "IA", "KS", "KY", "LA", "ME", "MD", "MA", "MI", "MN", "MS", "MO", "MT", "NE", "NV", "NH", "NJ",
|
||||
"NM", "NY", "NC", "ND", "OH", "OK", "OR", "PA", "RI", "SC", "SD", "TN", "TX", "UT", "VT", "VA", "WA", "WV", "WI", "WY");
|
||||
editableSelectState.datasource = statedata;
|
||||
editableSelectState.valuepath = ""
|
||||
editableSelectState.displaypath = "";
|
||||
}
|
||||
|
||||
var fiLogoFile = undefined;
|
||||
function browseLogo() {
|
||||
var file = $('<input type="file" style="display: none;" accept="image/png,image/jpeg" />')
|
||||
file.change(function () {
|
||||
if (!/image\/\w+/.test(this.files[0].type)) {
|
||||
showAlert(GetTextByKey("P_SET_LOCATIONLOGOISINVALID", 'The file type for the location logo is invalid. The file must be JPG or PNG.'), GetTextByKey("P_SET_SAVELOCATIONS", 'Save Location'));
|
||||
return;
|
||||
}
|
||||
fiLogoFile = this.files[0];
|
||||
$("#imgfilogo").attr('src', window.URL.createObjectURL(fiLogoFile));
|
||||
$('#trimg').show();
|
||||
}).click();
|
||||
}
|
||||
|
||||
function searchEnter(e) {
|
||||
if (e.keyCode == 13 || e.keyCode == 9) {
|
||||
OnRefresh();
|
||||
}
|
||||
}
|
||||
|
||||
var mapctrl;
|
||||
function SelectLocation() {
|
||||
var d = $('#dialog_selectlocation');
|
||||
if (!mapctrl)
|
||||
mapctrl = new $mapcontrol(setmaplocation, onlocselectchanged);
|
||||
else
|
||||
setmaplocation();
|
||||
|
||||
$('#dialog_selectlocation .dialog-title span.title').text(GetTextByKey("P_SET_SELECTLOCATION", "Select Location"));
|
||||
showmaskbg(true);
|
||||
d.css({
|
||||
'top': (document.documentElement.clientHeight - d.height()) / 3,
|
||||
'left': (document.documentElement.clientWidth - d.width()) / 2
|
||||
}).showDialogfixed();
|
||||
}
|
||||
|
||||
function onlocselectchanged(lat, long) {
|
||||
$("#lbllatitude").text(lat);
|
||||
$("#lbllongtude").text(long);
|
||||
}
|
||||
|
||||
function setmaplocation() {
|
||||
$("#lbllatitude").text("");
|
||||
$("#lbllongtude").text("");
|
||||
mapctrl.setLocation(0, 0);
|
||||
var latitude = 0;
|
||||
var longitude = 0;
|
||||
if (locationdata) {
|
||||
latitude = locationdata.Latitude;
|
||||
longitude = locationdata.Longitude;
|
||||
}
|
||||
else {
|
||||
latitude = $("#dialog_latitude").val();
|
||||
longitude = $("#dialog_longitude").val();
|
||||
}
|
||||
|
||||
if (latitude === "" || isNaN(latitude) || latitude > 90 || latitude < -90)
|
||||
return;
|
||||
if (longitude === "" || isNaN(longitude) || longitude > 180 || longitude < -180)
|
||||
return;
|
||||
|
||||
$("#lbllatitude").text(latitude);
|
||||
$("#lbllongtude").text(longitude);
|
||||
mapctrl.setLocation(latitude, longitude);
|
||||
}
|
||||
|
||||
function OnSelectLocationOK() {
|
||||
$('#dialog_selectlocation').hideDialog();
|
||||
var loc = mapctrl.getLocation();
|
||||
if (locationdata) {
|
||||
locationdata.Latitude = loc[0];
|
||||
locationdata.Longitude = loc[1];
|
||||
saveLocation(locationdata);
|
||||
}
|
||||
else {
|
||||
$("#dialog_latitude").val(loc[0]);
|
||||
$("#dialog_longitude").val(loc[1]);
|
||||
GetAddress();
|
||||
}
|
||||
}
|
||||
|
||||
function saveLocation(loc) {
|
||||
var item = {
|
||||
'ID': loc.ID,
|
||||
'PId': loc.PId,
|
||||
'Name': loc.Name,
|
||||
'Code': loc.Code,
|
||||
'Latitude': loc.Latitude,
|
||||
'Longitude': loc.Longitude,
|
||||
'Address': loc.Address,
|
||||
'Notes': loc.Notes
|
||||
};
|
||||
var p = htmldecode(JSON.stringify(item));
|
||||
locationrequest("SaveCustomerLocation", p, function (data) {
|
||||
if (data === 'OK')
|
||||
OnRefresh();
|
||||
}, function (err) {
|
||||
});
|
||||
}
|
||||
|
||||
var LocatorC = undefined;
|
||||
var PointC = undefined;
|
||||
var locator;
|
||||
function getAddress(lat, long) {
|
||||
if (!locator) {
|
||||
require([
|
||||
"esri/tasks/locator",
|
||||
"esri/geometry/Point"
|
||||
], function (Locator, Point) {
|
||||
LocatorC = Locator;
|
||||
PointC = Point;
|
||||
//var locator = new Locator("http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Locators/ESRI_Geocode_USA/GeocodeServer");
|
||||
var locator = new LocatorC("https://geocode.arcgis.com/arcgis/rest/services/World/GeocodeServer");
|
||||
locator.on("location-to-address-complete", function (evt) {
|
||||
if (evt.address.address) {
|
||||
if (evt.address.address.Address && evt.address.address.Address != "")
|
||||
$('#dialog_address').val(evt.address.address.Address);
|
||||
else
|
||||
$('#dialog_address').val(evt.address.address.Match_addr);
|
||||
$('#dialog_city').val(evt.address.address.City);
|
||||
editableSelectState.text(evt.address.address.RegionAbbr);
|
||||
$('#dialog_zip').val(evt.address.address.Postal);
|
||||
}
|
||||
});
|
||||
|
||||
var point = new PointC(long, lat);
|
||||
locator.locationToAddress(point, 100);
|
||||
});
|
||||
}
|
||||
else {
|
||||
var point = new PointC(long, lat);
|
||||
locator.locationToAddress(point, 100);
|
||||
}
|
||||
}
|
||||
|
||||
function GetAddress() {
|
||||
//var address = $('#dialog_address').val();
|
||||
//if (!address) {
|
||||
var longitude = $("#dialog_longitude").val();
|
||||
var latitude = $("#dialog_latitude").val();
|
||||
if (longitude === "" || isNaN(longitude) || longitude > 180 || longitude < -180)
|
||||
return;
|
||||
if (latitude === "" || isNaN(latitude) || latitude > 90 || latitude < -90)
|
||||
return;
|
||||
getAddress(latitude, longitude);
|
||||
//}
|
||||
}
|
||||
</script>
|
||||
</asp:Content>
|
||||
<asp:Content ID="Content3" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
|
||||
<div id="recordcontent" style="padding: 0px; margin: 0px;">
|
||||
<div class="page_title" data-lgid="P_SET_MANAGELOCATIONS">Manage Locations</div>
|
||||
<div class="function_title">
|
||||
<span class="sbutton iconadd" onclick="OnAdd();" data-lgid="P_SET_ADD">Add</span>
|
||||
<span class="sbutton iconrefresh" onclick="OnRefresh();" data-lgid="P_SET_REFRESH">Refresh</span>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
<div id="locationlist">
|
||||
<data-grid ref="grid" v-bind:columns="columns" v-bind:source="source" v-bind:allow-editing="true" v-on:rowdblclick="rowdblclick"
|
||||
v-bind:allow-auto-new-row="false" v-bind:total-row="totalRow" body-class="autoHeightBody">
|
||||
</data-grid>
|
||||
</div>
|
||||
<%--<div id="locationlist"></div>--%>
|
||||
</div>
|
||||
<div id="mask_bg" style="display: none;">
|
||||
<div class="loading c-spin"></div>
|
||||
</div>
|
||||
|
||||
<div class="dialog" id="dialog_location" style="display: none; width: 500px;">
|
||||
<div class="dialog-title"><span class="title" data-lgid="P_SET_ADDLOCATIONS">Add Location</span><em class="dialog-close"></em></div>
|
||||
<div class="dialog-content">
|
||||
<table>
|
||||
<tr>
|
||||
<td class="label" data-lgid="P_SET_LOCATIONSNAME_COLON">Location Name:</td>
|
||||
<td colspan="2">
|
||||
<input type="text" id="dialog_name" maxlength="100" tabindex="1" style="width: 320px;" autocomplete="off" /></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="label" data-lgid="P_SET_CODE_COLON">Code:</td>
|
||||
<td colspan="2">
|
||||
<input type="text" id="dialog_code" maxlength="20" tabindex="1" style="width: 320px;" autocomplete="off" /></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="label" data-lgid="P_SET_LATITUDE_COLON">Latitude:</td>
|
||||
<td>
|
||||
<input type="text" id="dialog_latitude" disabled="disabled" maxlength="100" tabindex="1" style="width: 320px;" onblur="GetAddress()" autocomplete="off" /></td>
|
||||
<td rowspan="2">
|
||||
<span class="sbutton iconlocation" onclick="SelectLocation()" data-title-lgid="P_SET_SELECTLOCATION"></span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="label" data-lgid="P_SET_LONGITUDE_COLON">Longitude:</td>
|
||||
<td>
|
||||
<input type="text" id="dialog_longitude" disabled="disabled" maxlength="100" tabindex="1" style="width: 320px;" onblur="GetAddress()" autocomplete="off" />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="label" data-lgid="P_SET_ADDRESS1_COLON">Address 1:</td>
|
||||
<td colspan="2">
|
||||
<input type="text" id="dialog_address" maxlength="1000" tabindex="1" style="width: 320px;" autocomplete="off" /></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="label" data-lgid="P_SET_ADDRESS2_COLON">Address 2:</td>
|
||||
<td colspan="2">
|
||||
<input type="text" id="dialog_address2" maxlength="1000" tabindex="1" style="width: 320px;" autocomplete="off" /></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="label" data-lgid="P_SET_CITY_COLON">City:</td>
|
||||
<td colspan="2">
|
||||
<input type="text" id="dialog_city" maxlength="50" tabindex="1" style="width: 320px;" autocomplete="off" /></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="label" data-lgid="P_SET_STATE_COLON">State:</td>
|
||||
<td colspan="2">
|
||||
<div id="dialog_state" style="width: 322px; height: 22px;"></div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="label" data-lgid="P_SET_ZIP_COLON">Zip:</td>
|
||||
<td colspan="2">
|
||||
<input type="text" id="dialog_zip" maxlength="50" tabindex="1" style="width: 320px;" autocomplete="off" /></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="label" data-lgid="P_SET_LOGO_COLON">Logo:</td>
|
||||
<td colspan="2">
|
||||
<input id="btnBrowseLogo" type="button" value="Browse..." data-lgid="P_SET_BROWSE" tabindex="1" style="width: 120px; height: 22px;" />
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="trimg">
|
||||
<td class="label"></td>
|
||||
<td colspan="2">
|
||||
<img id="imgfilogo" src="" style="width: 60px; height: 60px; margin: 5px;" />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="label" data-lgid="P_SET_NOTES_COLON">Notes:</td>
|
||||
<td colspan="2">
|
||||
<textarea id="dialog_notes" class="inputbox" maxlength="1000" tabindex="6" style="width: 320px;"></textarea></td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
<div class="dialog-func">
|
||||
<input type="button" value="Cancel" data-lgid="P_SET_CANCEL" class="dialog-close" tabindex="8" />
|
||||
<input type="button" onclick="OnDialogOK();" value="OK" data-lgid="P_SET_OK" tabindex="7" />
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="dialog" id="dialog_selectlocation" style="display: none;">
|
||||
<div class="dialog-title"><span class="title" data-lgid="P_SET_SELECTLOCATION">Select Location</span><em class="dialog-close"></em></div>
|
||||
<div style="width: 900px; height: 600px;">
|
||||
<div id="mapdiv" style="width: 100%; height: 100%;">
|
||||
</div>
|
||||
<div id="basemapgalleryDiv">
|
||||
<div id="basemapImg"></div>
|
||||
<div id="basemapTitle"></div>
|
||||
</div>
|
||||
<div id="basemapGallery"></div>
|
||||
</div>
|
||||
<div class="dialog-func">
|
||||
<span data-lgid="P_SET_LATITUDE_COLON">Latitude:</span>
|
||||
<span id="lbllatitude"></span>
|
||||
<span data-lgid="P_SET_LONGITUDE_COLON" style="margin-left: 10px;">Longitude:</span>
|
||||
<span id="lbllongtude"></span>
|
||||
<input type="button" value="Cancel" data-lgid="P_SET_CANCEL" class="dialog-close" tabindex="8" />
|
||||
<input type="button" onclick="OnSelectLocationOK();" value="OK" data-lgid="P_SET_OK" tabindex="7" />
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
</div>
|
||||
</asp:Content>
|
||||
Reference in New Issue
Block a user