feat: 新增多设备搜索
This commit is contained in:
parent
897507b97b
commit
1875b5e848
@ -95,6 +95,10 @@ var DeviceOverview = (function() {
|
||||
return DeviceMarkers.locateMyLocation();
|
||||
}
|
||||
|
||||
function clearDeviceFilter() {
|
||||
return SearchFilter.clearDeviceFilter();
|
||||
}
|
||||
|
||||
return {
|
||||
init: init,
|
||||
|
||||
@ -107,6 +111,7 @@ var DeviceOverview = (function() {
|
||||
locateDeviceOnMap: locateDeviceOnMap,
|
||||
locateDeviceDirectly: locateDeviceDirectly,
|
||||
locateMyLocation: locateMyLocation,
|
||||
clearDeviceFilter: clearDeviceFilter,
|
||||
|
||||
toggleMapFunctionsMenu: toggleMapFunctionsMenu,
|
||||
toggleDeviceId: toggleDeviceId,
|
||||
@ -141,3 +146,4 @@ window.queryDevices = DeviceOverview.queryDevices;
|
||||
window.locateDeviceOnMap = DeviceOverview.locateDeviceOnMap;
|
||||
window.locateDeviceDirectly = DeviceOverview.locateDeviceDirectly;
|
||||
window.locateMyLocation = DeviceOverview.locateMyLocation;
|
||||
window.clearDeviceFilter = DeviceOverview.clearDeviceFilter;
|
||||
@ -3,6 +3,8 @@ var SearchFilter = (function() {
|
||||
|
||||
var currentSearchedDevice = null;
|
||||
var markerState = 3; // 1:all; 2:orange; 3:red
|
||||
var filteredDeviceIds = [];
|
||||
var isFilterActive = false;
|
||||
|
||||
function searchDevice(deviceId) {
|
||||
if (!deviceId || !deviceId.trim()) {
|
||||
@ -11,6 +13,13 @@ var SearchFilter = (function() {
|
||||
}
|
||||
|
||||
deviceId = deviceId.trim();
|
||||
|
||||
// 多设备
|
||||
if (deviceId.indexOf(',') !== -1) {
|
||||
return handleMultiDeviceSearch(deviceId);
|
||||
}
|
||||
|
||||
// 单设备
|
||||
currentSearchedDevice = deviceId;
|
||||
|
||||
var success = DeviceMarkers.locateDevice(deviceId);
|
||||
@ -37,6 +46,126 @@ var SearchFilter = (function() {
|
||||
return success;
|
||||
}
|
||||
|
||||
function handleMultiDeviceSearch(deviceIdsString) {
|
||||
var deviceIds = deviceIdsString.split(',').map(function(id) {
|
||||
return id.trim();
|
||||
}).filter(function(id) {
|
||||
return id !== '';
|
||||
});
|
||||
|
||||
if (deviceIds.length === 0) {
|
||||
clearSearch();
|
||||
return false;
|
||||
}
|
||||
|
||||
filteredDeviceIds = deviceIds;
|
||||
|
||||
var foundDevices = filterDevicesByIds(deviceIds);
|
||||
|
||||
if (foundDevices.length > 0) {
|
||||
showFilterStatus(deviceIds.length);
|
||||
|
||||
isFilterActive = true;
|
||||
|
||||
var firstDevice = foundDevices[0];
|
||||
var geometry = firstDevice.getGeometry();
|
||||
var coordinates = geometry.getCoordinates();
|
||||
|
||||
if (MapCore.getMap()) {
|
||||
MapCore.getMap().getView().animate({
|
||||
center: coordinates,
|
||||
zoom: 12,
|
||||
duration: 1000
|
||||
});
|
||||
}
|
||||
|
||||
if (window.layer && typeof window.layer.msg === 'function') {
|
||||
window.layer.msg('已过滤显示 ' + foundDevices.length + ' 个设备');
|
||||
}
|
||||
|
||||
return true;
|
||||
} else {
|
||||
if (window.layer && typeof window.layer.msg === 'function') {
|
||||
window.layer.msg('未找到任何匹配的设备');
|
||||
}
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
function filterDevicesByIds(deviceIds) {
|
||||
if (!DeviceMarkers.getAllFeatures) return [];
|
||||
|
||||
var allFeatures = DeviceMarkers.getAllFeatures();
|
||||
var foundDevices = [];
|
||||
var vectorSource = MapCore.getVectorSource();
|
||||
|
||||
if (!vectorSource) return [];
|
||||
|
||||
var myLocationFeature = DeviceMarkers.getMyLocationFeature();
|
||||
|
||||
vectorSource.clear();
|
||||
|
||||
if (myLocationFeature) {
|
||||
vectorSource.addFeature(myLocationFeature);
|
||||
}
|
||||
|
||||
for (var i = 0; i < allFeatures.length; i++) {
|
||||
var feature = allFeatures[i];
|
||||
var deviceInfo = feature.get('deviceInfo');
|
||||
|
||||
if (deviceInfo) {
|
||||
var deviceId = String(deviceInfo.deviceid).trim();
|
||||
|
||||
for (var j = 0; j < deviceIds.length; j++) {
|
||||
var searchId = String(deviceIds[j]).trim();
|
||||
|
||||
if (deviceId === searchId ||
|
||||
deviceId.indexOf(searchId) !== -1 ||
|
||||
deviceId.replace(/\s+/g, '') === searchId.replace(/\s+/g, '')) {
|
||||
vectorSource.addFeature(feature);
|
||||
foundDevices.push(feature);
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return foundDevices;
|
||||
}
|
||||
|
||||
function showFilterStatus(count) {
|
||||
var filterStatus = document.getElementById('filterStatus');
|
||||
|
||||
if (filterStatus) {
|
||||
filterStatus.innerHTML =
|
||||
'<span style="color: #1aa094; font-weight: bold; font-size: 12px;">定位中</span>' +
|
||||
'<button class="toolbar-btn" onclick="clearDeviceFilter()" style="background: #f56565; margin-left: 6px;">' +
|
||||
'<i class="layui-icon layui-icon-close" style="font-size: 12px;"></i>' +
|
||||
'</button>';
|
||||
|
||||
filterStatus.style.display = 'flex';
|
||||
}
|
||||
}
|
||||
|
||||
function hideFilterStatus() {
|
||||
var filterStatus = document.getElementById('filterStatus');
|
||||
if (filterStatus) {
|
||||
filterStatus.style.display = 'none';
|
||||
}
|
||||
}
|
||||
|
||||
function clearDeviceFilter() {
|
||||
isFilterActive = false;
|
||||
filteredDeviceIds = [];
|
||||
hideFilterStatus();
|
||||
|
||||
applyCurrentFilter();
|
||||
|
||||
if (window.layer && typeof window.layer.msg === 'function') {
|
||||
window.layer.msg('已清除设备过滤');
|
||||
}
|
||||
}
|
||||
|
||||
function clearSearch() {
|
||||
currentSearchedDevice = null;
|
||||
var searchInput = document.getElementById('deviceSearchNew');
|
||||
@ -44,9 +173,13 @@ var SearchFilter = (function() {
|
||||
searchInput.value = '';
|
||||
}
|
||||
|
||||
if (isFilterActive) {
|
||||
clearDeviceFilter();
|
||||
} else {
|
||||
// 恢复到当前的过滤状态
|
||||
applyCurrentFilter();
|
||||
}
|
||||
}
|
||||
|
||||
function applyCurrentFilter() {
|
||||
switch(markerState) {
|
||||
@ -166,6 +299,14 @@ var SearchFilter = (function() {
|
||||
markerState = state;
|
||||
}
|
||||
|
||||
function isFilterModeActive() {
|
||||
return isFilterActive;
|
||||
}
|
||||
|
||||
function getFilteredDeviceIds() {
|
||||
return filteredDeviceIds;
|
||||
}
|
||||
|
||||
return {
|
||||
searchDevice: searchDevice,
|
||||
clearSearch: clearSearch,
|
||||
@ -178,6 +319,9 @@ var SearchFilter = (function() {
|
||||
locateDeviceDirectly: locateDeviceDirectly,
|
||||
getCurrentSearchedDevice: getCurrentSearchedDevice,
|
||||
getMarkerState: getMarkerState,
|
||||
setMarkerState: setMarkerState
|
||||
setMarkerState: setMarkerState,
|
||||
clearDeviceFilter: clearDeviceFilter,
|
||||
isFilterModeActive: isFilterModeActive,
|
||||
getFilteredDeviceIds: getFilteredDeviceIds
|
||||
};
|
||||
})();
|
||||
@ -526,11 +526,9 @@
|
||||
|
||||
/* 测量状态指示器样式 */
|
||||
#measureStatus {
|
||||
background: rgba(255, 255, 255, 0.98);
|
||||
border: 1px solid rgba(72, 187, 120, 0.3);
|
||||
border-radius: 8px;
|
||||
padding: 6px 12px;
|
||||
box-shadow: 0 2px 8px rgba(72, 187, 120, 0.2);
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
}
|
||||
@ -541,6 +539,20 @@
|
||||
min-width: 24px;
|
||||
}
|
||||
|
||||
#filterStatus {
|
||||
border: 1px solid rgba(26, 160, 148, 0.3);
|
||||
border-radius: 8px;
|
||||
padding: 6px 12px;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
#filterStatus .toolbar-btn {
|
||||
padding: 2px 6px;
|
||||
height: 24px;
|
||||
min-width: 24px;
|
||||
}
|
||||
|
||||
.weather-forecast-card {
|
||||
position: absolute;
|
||||
top: 55%;
|
||||
@ -792,6 +804,14 @@
|
||||
justify-content: center;
|
||||
padding: 6px 0px;
|
||||
}
|
||||
|
||||
#filterStatus {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
padding: 6px 0px;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -896,7 +916,7 @@
|
||||
<div class="toolbar-divider"></div>
|
||||
|
||||
<div class="toolbar-item">
|
||||
<input type="text" id="deviceSearchNew" class="toolbar-input" placeholder="搜索设备编号">
|
||||
<input type="text" id="deviceSearchNew" class="toolbar-input" placeholder="设备编号">
|
||||
<button class="toolbar-btn" onclick="searchDeviceNew()">搜索</button>
|
||||
</div>
|
||||
|
||||
@ -962,11 +982,14 @@
|
||||
</div>
|
||||
|
||||
<div id="measureStatus" class="toolbar-item" style="display: none;">
|
||||
<span style="color: #48bb78; font-weight: bold; font-size: 12px;">测量中</span>
|
||||
<span style="color: #1aa094; font-weight: bold; font-size: 12px;">测量中</span>
|
||||
<button class="toolbar-btn" onclick="finishMeasuring()" style="background: #f56565; margin-left: 6px;">
|
||||
<i class="layui-icon layui-icon-close" style="font-size: 12px;"></i>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div id="filterStatus" class="toolbar-item" style="display: none;">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@ -1026,6 +1049,7 @@
|
||||
window.locateDeviceOnMap = DeviceOverview.locateDeviceOnMap;
|
||||
window.locateDeviceDirectly = DeviceOverview.locateDeviceDirectly;
|
||||
window.switchMapType = DeviceOverview.switchMapType;
|
||||
window.locateMyLocation = DeviceOverview.locateMyLocation;
|
||||
</script>
|
||||
|
||||
</body>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user