/**
* 创建者:王成
* 创建日期:2022年5月31日
* 描述:地图页面中综合执法相关功能
*/
/* 查询到的案件Id集合 */
var queryCaseIds = [];
/* 查询图层模型 */
var zfQueryLayerObj = undefined;
/**
* 查询初始化
*/
function MapQueryConfigInit() {
/* 获取存储的用户信息 */
getSaveUserInfo({
success: function(userInfo) {
var joinUser = userInfo;
//初始化案件实例
caseBase = new JTCaseBase({
queryType: "Input",
ashxName: "appQueryCases",
pageFlag: "Map",
userInfo: joinUser,
});
//绑定数据表
caseBase.bindUlTable(undefined);
/**
* 绑定搜索框 通过绑定监听获取输入的内容
* @param {Object} value 获取输入的查询内容
*/
caseBase.bindSearchControlEvent('search', function(value) {
if (zfQueryLayerObj.isCase == "1") {
queryCaseIds.length = 0;
queryCaseIds.push(value);
// caseBase.queryDataByCaseId(queryCaseIds);
/* 替换统一方法试试 */
showManyLayerQueryResult([{
cName: '案件图斑',
caseId: value,
isCase: true,
}], true);
} else {
zfFeatureQueryModel.start = '1';
zfFeatureQueryModel.fldName = zfQueryLayerObj.queryField;
zfFeatureQueryModel.fldValue = value;
zfFeatureQueryModel.tabName = zfQueryLayerObj.eName;
zfFeatureQueryModel.showFldName = zfQueryLayerObj.queryField;
/* 开始查询数据 */
zfQueryResultIndex = 0;
beginQueryFeatureByLayer();
}
});
/**
* 绑定查询返回事件
* @param {Array[JSON]} caseDatas
*/
caseBase.eventQueryResult = function(caseDatas) {
showCaseQueryResult(caseDatas);
}
/**
* 绑定案件变更回调事件
* @param {string} caseNum 案件编号
*/
caseBase.eventCaseChange = function(caseNum) {
/* 调用刷新案件方法 */
refreshDataTable(caseNum);
}
},
error: function(err) {
muiAlertError(err);
}
});
}
/* 执法数据图层空间数据查询模型 */
var zfFeatureQueryModel = {
tabName: '',
fldName: '',
fldValue: '',
showFldName: '',
queryType: '',
start: '1',
count: '10',
}
/**
* 查询当前图层符合条件的空间数据
*/
function beginQueryFeatureByLayer() {
sendAjax({
waitMessage: '查询中...',
url: 'appQueryFeatureData',
data: zfFeatureQueryModel,
success: function(resData) {
showFeatureQueryResult(resData[0]);
},
error: function(err) {
muiAlertError(err);
}
})
}
/* 执法图层查询内容结果容器 */
var zfQueryResultFather = undefined;
/* 执法图层查询结果序号 */
var zfQueryResultIndex = 0;
/**
* 执法相关图层查询初始化
*/
function showQueryResultPanel(title) {
/* 创建根部滚动容器 */
var divScroll = document.createElement('div');
divScroll.className = 'mui-scroll-wrapper';
/* 创建滚动子容器 */
var divScrollChild = document.createElement('div');
divScrollChild.className = 'mui-scroll';
divScroll.append(divScrollChild);
/* 创建具体内容容器 */
zfQueryResultFather = document.createElement('div');
zfQueryResultFather.className = 'jt-data-panel';
divScrollChild.append(zfQueryResultFather);
/* 创建弹窗的标题头 */
var header = document.createElement('header');
header.className = 'mui-bar';
header.innerHTML = "" + title + ' 查询结果';
/* 显示详细信息 */
_showMuiPopover(header, divScroll);
}
/**
* 展示查询到的空间数据
* @param {JSON} jsonData 查询到的数据
*/
function showFeatureQueryResult(jsonData) {
/* 显示查询结果框 */
showQueryResultPanel(zfQueryLayerObj.cName);
/* 移除显示更多按钮 */
$(".jt-data-row").remove();
for (var i in jsonData.dataList) {
var item = jsonData.dataList[i];
var divRow = document.createElement('div');
divRow.className = 'jt-feature-data-row';
zfQueryResultFather.append(divRow);
var divHtml = "" + (++zfQueryResultIndex) + "";
divHtml += "" + item.feaName + "";
divHtml += "" + item.feaArea + "";
divHtml += ""
divHtml += ""
divHtml += "";
divRow.innerHTML = divHtml;
}
/* 判断是否需要追加加载更多按钮 */
if (jsonData.isLast != "1") {
/* 添加 加载更多按钮 */
var divRow = document.createElement('div');
divRow.className = 'jt-data-row';
zfQueryResultFather.append(divRow);
var btn = document.createElement('button');
btn.id = "lastDom";
btn.className = 'mui-btn mui-btn-block jt-btn-load';
btn.innerHTML = "加载更多";
btn.onclick = function() {
mui(this).button('loading');
zfFeatureQueryModel.start = parseInt(zfFeatureQueryModel.start) + parseInt(zfFeatureQueryModel.count);
/* 开始查询数据 */
beginQueryFeatureByLayer();
}
divRow.append(btn);
}
}
/* 可供查询的多图层配置 */
var queryLayerConfig = [];
/**
* 查询多图层配置
* @param {JSON} subjectLayerConfig 专题图层配置
*/
function zf_manyLayerConfigInit(subjectLayerConfig) {
let queryIds = subjectLayerConfig ? subjectLayerConfig.queryIds + "," : undefined;
/* 获取图层 */
getSaveUserLayers({
success: function(jsonLayers) {
var btnHtml = "";
/* 获取具体图层 */
for (let layer of jsonLayers[0].layerList) {
if (queryIds === undefined) {
if (layer.isQuery == '1') {
queryLayerConfig.push(layer);
}
} else if (queryIds.indexOf(layer.layerId) != -1) {
if (layer.isQuery == '1') {
queryLayerConfig.push(layer);
}
}
}
/* 设置默认查询图层 */
zf_selectQueryLayer(queryLayerConfig[0]);
/* 判断可查询的图层数 */
if (queryLayerConfig && queryLayerConfig.length > 1) {
$(".jt-layer-select-btn").show(); /* 显示多图层选择按钮 */
/* 多图层选择按钮绑定事件 */
$(".jt-layer-select-btn")[0].addEventListener('tap', function() {
showLeftWindow('查询图层选择', 6, function() {
initSelectLayer();
});
});
}
},
error: function(err) {
muiAlertError(err);
},
});
}
/**
* 初始化选择图层
*/
function initSelectLayer() {
let btnHtml = "";
for (let i in queryLayerConfig) {
let layer = queryLayerConfig[i]
btnHtml += "";
}
/* 加入列表 */
$(".jt-layer-select-content").html(btnHtml);
mui('.mui-scroll-wrapper').scroll();
}
/**
* 打开左侧滑出窗口
* @param {string} title 标题
* @param {number} width 宽度[0-1]比例
* @param {function} callback 回调
*/
function showLeftWindow(title, width, callback) {
var domTitle = $(".jt-popover-left .mui-bar .jt-title")[0];
$(domTitle).html(title);
$($('.jt-popover-left')[0]).animate({
right: (100 - width * 10) + '%',
width: width * 10 + '%',
}, function() {
if (callback) callback();
});
}
/**
* 关闭左侧滑出窗口
* @param {function} callback 回调
*/
function closeLeftWindow(callback) {
$($('.jt-popover-left')[0]).animate({
right: (100) + '%',
}, function() {
if (callback) callback();
});
}
/**
*
* @param {JSON} layer 选择的查询图层
*/
function zf_selectQueryLayer(layer) {
closeLeftWindow();
/* 设置当前查询图层 */
zfQueryLayerObj = layer;
var hintContent = "" + layer.cName + "";
hintContent += " " + layer.showHint;
$(".mui-search .mui-placeholder >span:nth-child(2)").html(hintContent);
$("#search").val('');
$(".mui-input-row.mui-search.mui-active").removeClass('mui-active');
}
/* 当前显示的案件结果集合 */
var sliderCaseDatas = undefined;
/* slider控件显示的索引 */
var sliderMoveIndex = 0;
/**
* 添加查询案件到集合中
* @param {Array[JSON]} caseDatas 查询案件数据集
*/
function showCaseQueryResult(caseDatas) {
/* 如果未查询到任何案件 则直接提示返回 */
if (caseDatas.length == 0) {
return;
}
/* 赋值查询案件数据集 */
sliderCaseDatas = caseDatas;
sliderMoveIndex = 0;
/* 赋值案件数量 用以显示 */
queryCaseCount = caseDatas.length;
/* 创建内容slider容器*/
let divSlider = document.createElement('div');
divSlider.className = 'mui-slider';
/* 创建具体内容容器 */
let divContent = document.createElement('div');
divContent.className = 'mui-slider-group'
divSlider.append(divContent);
/* 循环增加所有案件 */
for (var i = 0; i < caseDatas.length; i++) {
appendToSliderItemByCase(caseDatas[i], divContent, false);
}
/* 清除原有显示内容 */
$("#queryResultPopover").html('');
/* 创建弹窗的标题头 */
let header = document.createElement('header');
header.className = 'mui-bar';
header.id = 'queryResultTitle'
header.innerHTML = "当前案件 " + (sliderMoveIndex + 1) + "/" + queryCaseCount;
_showMuiPopover(header, divSlider);
/* 初始化slider 这很重要 否则将无法滑动*/
mui('.mui-slider').slider().gotoItem(sliderMoveIndex);
/* 滑动组件滑动监听 */
document.querySelector(".mui-slider").addEventListener('slide', function(event) {
/* 记录当前手工切换到哪一个了 以便在进行案件事物处理后 能正确切换到刚刚处理的案件 */
$('#queryResultTitle').html("当前案件 " + (event.detail.slideNumber + 1) + "/" + queryCaseCount);
});
}
/**
* 向Slider的容器中追加案件
* @param {JSON} caseJson 案件的JSON数据
* @param {dom} domSlider Slider容器的dom对象
* @param {dom} isLastOrFirst 是否属于第一个或者最后一个
*/
function appendToSliderItemByCase(caseJson, domSlider, isLastOrFirst) {
var div = caseBase.createCase(caseJson);
var sliderDiv = document.createElement("div");
sliderDiv.id = caseJson.casenum;
if (isLastOrFirst) {
sliderDiv.className = "mui-slider-item mui-slider-item-duplicate";
} else {
sliderDiv.className = "mui-slider-item";
}
sliderDiv.append(div);
domSlider.append(sliderDiv);
}
/* 查询的案件总数 */
var queryCaseCount = 0;
/**
* 处理案件处置 处理、审核、派发、撤派 等操作成功后的后续处理事宜
* @param {string} casenum 处置的案件编号
*/
function refreshDataTable(casenum) {
/* 重新查询 */
caseBase.queryCaseByCasenum(casenum, function(caseJson) {
/* 不能使用替换方法 导致mui-slder无法滑动 原因未知 */
/* 寻找原来案件元素的位置 */
for (var i = 0; i < sliderCaseDatas.length; i++) {
if (sliderCaseDatas[i].casenum === caseJson.casenum) {
//找到了 记录下来
sliderMoveIndex = i;
break;
}
}
/* 替换元素 */
sliderCaseDatas.splice(sliderMoveIndex, 1, caseJson);
/* 先关闭弹出框 */
mui('#queryResultPopover').popover('toggle');
/* 重置内容 */
showCaseQueryResult(sliderCaseDatas);
});
}
/**
* 打开航线查询框
*/
function showFlightLineQueryPopover() {
$("#divFlightQuery").slideDown(600);
}
/**
* 关闭航线查询框
*/
function hideFlightLineQueryPopover() {
$("#divFlightQuery").slideUp(600);
}
/* 挂接事件 */
var btnDate = document.getElementById('btnFlightDate');
btnDate.addEventListener('tap', function() {
var _self = this;
if (_self.picker) {
_self.picker.show(function(rs) {
$(_self).html(rs.text);
$(_self).attr('data-value', rs.text);
getLineUsersByDate(rs.text);
});
} else {
var optionsJson = this.getAttribute('data-options') || '{}';
var options = JSON.parse(optionsJson);
_self.picker = new mui.DtPicker(options);
_self.picker.show(function(rs) {
$(_self).html(rs.text);
$(_self).attr('data-value', rs.text);
getLineUsersByDate(rs.text);
});
}
});
/* 航线用户 */
var lineUsers = [];
/**
* 根据日期获取该日期内拥有航线数据的全部用户
* @param {string} strDate 日期
*/
function getLineUsersByDate(strDate) {
lineUsers = [];
var iData = {
date: strDate,
}
sendAjax({
dataType: 'post',
url: 'appQueryLineUsersByDate',
data: iData,
waitMessage: '正在同步数据...',
success: function(resData) {
for (var i in resData) {
lineUsers.push({
value: resData[i].selCode,
text: resData[i].selName,
})
}
addListenerToSelectButton('btnFlightMember', lineUsers);
},
error: function(err) {
clearSelectButton('btnFlightMember');
muiAlertError(err);
}
})
}
/**
* 查询航线数据
*/
function event_click_queryLines() {
var queryLinesModel = {
date: getAttributeValue('btnFlightDate', 'data-value'),
userId: getAttributeValue('btnFlightMember', 'data-code'),
}
if (queryLinesModel.date == "") {
muiAlert("请选择查询日期!", "敬告");
return;
}
if (queryLinesModel.userId == "") {
muiAlert("请选择查询巡查员!", "敬告");
return;
}
queryLines(queryLinesModel);
}
/**
* 查询指定日期指定用户的航线数据
* @param {JSON} queryModel 查询模型
*/
function queryLines(queryModel) {
sendAjax({
dataType: 'post',
url: 'appQueryLinesByDateAndUser',
data: queryModel,
waitMessage: '正在查询航线...',
success: function(resData) {
var count = 0;
for (var i in resData) {
var points = [];
var line = resData[i];
count += parseInt(line.points.length);
for (var idx in line.points) {
points.push({
x: line.points[idx].longitude,
y: line.points[idx].latitude,
});
}
jtMapKit.AddPointsToMap(points);
}
$(".jt-line-result")[0].innerHTML = "航点" + count + "个";
},
error: function(err) {
muiAlertError(err);
}
})
}
/**
* 清除航线
*/
function event_click_clearLines() {
jtMapKit.clearGraphic();
}
/* +++++++++++++++++++点击事件+++++++++++++++++++++++++++ */
/**
* 地图上点击查询案件
*/
function EventClick_PointQuery() {
muiToast("地图单击案件图斑进行查询!");
jtMapKit.queryCaseByPoint({
url: caseServerUrl,
filter: caseQueryFilter,
}, function(res) {
showQueryTaskResult(res);
}, function(err) {
muiAlert(err, '警告');
});
}
/**
* 地图上区域查询案件
*/
function EventClick_AreaQuery() {
muiToast("地图上单击绘制区域,点击查询按钮进行查询!");
jtMapKit.queryCaseByPolygon({
url: caseServerUrl,
filter: caseQueryFilter,
}, function(op) {
createToolsBySketch('案件查询', 'caseQueryByPolygonComplete', {
geometry: op.geometry,
});
}, function(res) {
hideNormalResult();
showQueryTaskResult(res);
}, function(err) {
hideNormalResult();
muiAlert(err, '警告');
});
}
/**
* 案件查询完成操作
* @param {JSON} options 配置项
* options.geometry{JSON}:查询参考要素
*/
function caseQueryByPolygonComplete(options) {
if (options.geometry == undefined || options.geometry.rings[0].length <= 3) {
muiAlert("绘制的区域不符合要求,请继续绘制");
return;
}
jtMapKit.queryCaseByPolygonComplete();
}
/**
* 案件地类分析
*/
function EventClick_CaseAnalysis() {
muiToast("地图单击案件图斑进行分析!");
selectFeatureExecuteAnalysis({
tabName: 'TIN_XJGL_SGLIST_POLYGON',
fldName: 'ajh',
});
}
/**
* 案件查询结果窗口管理 显示\隐藏
*/
function EventClick_QueryWindow() {
mui('#queryResultPopover').popover('toggle');
}
/**
* 分析案件占地情况
* @param {string} caseId 案件Id
*/
function beginAnalysisCaseFloorArea(caseId) {
createAndOpenPage({
htmlPath: 'case-analysis-result.html',
autoback: true,
title: '案件图斑占压分析',
extras: {
caseId: caseId,
},
});
}