From 8eeb9f2f8e79826346bf8e0230572c6138a3318b Mon Sep 17 00:00:00 2001 From: hx <190679152@qq.com> Date: Sun, 15 Mar 2026 16:11:17 +0800 Subject: [PATCH] =?UTF-8?q?b=E7=AB=AF?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/device/device.js | 5 +- src/components/device/TrajectoryDialog.vue | 1522 +++++++++++--------- src/utils/loadAMap.js | 78 + src/utils/loadGoogleMaps.js | 61 + src/views/device/device/index.vue | 27 +- src/views/system/role/index.vue | 8 +- 6 files changed, 986 insertions(+), 715 deletions(-) create mode 100644 src/utils/loadAMap.js create mode 100644 src/utils/loadGoogleMaps.js diff --git a/src/api/device/device.js b/src/api/device/device.js index 2a1aead..25f6f80 100644 --- a/src/api/device/device.js +++ b/src/api/device/device.js @@ -15,10 +15,11 @@ export function getDevice(id) { }) } -export function getDeviceTrajectory(id) { +export function getDeviceTrajectory(id, params) { return request({ url: '/device/device/' + id + '/trajectory', - method: 'get' + method: 'get', + params: params }) } diff --git a/src/components/device/TrajectoryDialog.vue b/src/components/device/TrajectoryDialog.vue index 9ed4ee5..823c9cf 100644 --- a/src/components/device/TrajectoryDialog.vue +++ b/src/components/device/TrajectoryDialog.vue @@ -1,758 +1,884 @@ diff --git a/src/utils/loadAMap.js b/src/utils/loadAMap.js new file mode 100644 index 0000000..7b3f484 --- /dev/null +++ b/src/utils/loadAMap.js @@ -0,0 +1,78 @@ +let amapPromise = null; + +export function loadAMap(options = {}) { + const { + key = "", + securityJsCode = "", + version = "2.0", + plugins = [], + } = options; + + if (typeof window === "undefined") { + return Promise.reject(new Error("当前环境不支持加载高德地图")); + } + + if (window.AMap && typeof window.AMap.Map === "function") { + return Promise.resolve(window.AMap); + } + + if (!key) { + return Promise.reject(new Error("未配置高德地图 Web Key")); + } + + if (securityJsCode) { + window._AMapSecurityConfig = Object.assign({}, window._AMapSecurityConfig, { + securityJsCode, + }); + } + + if (amapPromise) { + return amapPromise; + } + + amapPromise = new Promise((resolve, reject) => { + const scriptId = "geotag-amap-script"; + const existingScript = document.getElementById(scriptId); + + const handleResolve = () => { + if (window.AMap && typeof window.AMap.Map === "function") { + resolve(window.AMap); + return; + } + amapPromise = null; + reject(new Error("高德地图脚本加载失败")); + }; + + const handleError = () => { + amapPromise = null; + reject(new Error("高德地图脚本加载失败")); + }; + + if (existingScript) { + existingScript.addEventListener("load", handleResolve, { once: true }); + existingScript.addEventListener("error", handleError, { once: true }); + return; + } + + const script = document.createElement("script"); + script.id = scriptId; + script.async = true; + script.defer = true; + script.onload = handleResolve; + script.onerror = handleError; + + const query = [ + "v=" + encodeURIComponent(version), + "key=" + encodeURIComponent(key), + ]; + + if (plugins.length) { + query.push("plugin=" + encodeURIComponent(plugins.join(","))); + } + + script.src = "https://webapi.amap.com/maps?" + query.join("&"); + document.head.appendChild(script); + }); + + return amapPromise; +} diff --git a/src/utils/loadGoogleMaps.js b/src/utils/loadGoogleMaps.js new file mode 100644 index 0000000..529d3b1 --- /dev/null +++ b/src/utils/loadGoogleMaps.js @@ -0,0 +1,61 @@ +let googleMapsPromise = null; + +export function loadGoogleMaps(apiKey) { + if (typeof window === "undefined") { + return Promise.reject(new Error("当前环境不支持加载谷歌地图")); + } + + if (window.google && window.google.maps) { + return Promise.resolve(window.google.maps); + } + + if (!apiKey) { + return Promise.reject(new Error("未配置谷歌地图 API Key")); + } + + if (googleMapsPromise) { + return googleMapsPromise; + } + + googleMapsPromise = new Promise((resolve, reject) => { + const callbackName = "__geotagGoogleMapsReady__"; + const scriptId = "geotag-google-maps-script"; + const existingScript = document.getElementById(scriptId); + + const cleanup = () => { + if (window[callbackName]) { + delete window[callbackName]; + } + }; + + window[callbackName] = () => { + cleanup(); + resolve(window.google.maps); + }; + + const handleError = () => { + cleanup(); + googleMapsPromise = null; + reject(new Error("谷歌地图脚本加载失败")); + }; + + if (existingScript) { + existingScript.addEventListener("error", handleError, { once: true }); + return; + } + + const script = document.createElement("script"); + script.id = scriptId; + script.async = true; + script.defer = true; + script.src = + "https://maps.googleapis.com/maps/api/js?key=" + + encodeURIComponent(apiKey) + + "&callback=" + + callbackName; + script.onerror = handleError; + document.head.appendChild(script); + }); + + return googleMapsPromise; +} diff --git a/src/views/device/device/index.vue b/src/views/device/device/index.vue index a6dd80e..d6060eb 100644 --- a/src/views/device/device/index.vue +++ b/src/views/device/device/index.vue @@ -103,29 +103,27 @@ - + - - + + - + - + - - - +